From dacab19e680e220deed883076a79b38b36987861 Mon Sep 17 00:00:00 2001 From: policyengine-bot Date: Sat, 9 May 2026 13:29:33 +0000 Subject: [PATCH] Update references from @policyengine/design-system to @policyengine/ui-kit MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The `@policyengine/design-system` package is deprecated. Per PolicyEngine/CLAUDE.md, `@policyengine/ui-kit` is the canonical design system. The `/legacy` subpath in ui-kit 0.8.0 mirrors design-system's API exactly for backward compatibility. This updates documentation and agent prompts to reference the correct package, helping future Claude Code sessions use the right dependency when working on PolicyEngine repositories. Changes: - Updated package references in skills and agent docs - Added deprecation notes where design-system is mentioned - Updated validation checks to look for both old and new packages 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- agents/dashboard/dashboard-architecture-validator.md | 3 ++- agents/dashboard/dashboard-planner.md | 2 +- skills/content/content-generation-skill/SKILL.md | 2 +- skills/documentation/policyengine-design-skill/SKILL.md | 2 +- skills/tools-and-apis/policyengine-app-skill/SKILL.md | 4 ++-- 5 files changed, 7 insertions(+), 6 deletions(-) diff --git a/agents/dashboard/dashboard-architecture-validator.md b/agents/dashboard/dashboard-architecture-validator.md index e928316..b6a609c 100644 --- a/agents/dashboard/dashboard-architecture-validator.md +++ b/agents/dashboard/dashboard-architecture-validator.md @@ -88,8 +88,9 @@ grep '@policyengine/ui-kit' package.json # Actually imported in components grep -rn "from '@policyengine/ui-kit'" app/ components/ --include='*.tsx' --include='*.ts' -# No CDN link for design-system +# No CDN link for design-system (deprecated package) grep -rn 'unpkg.com/@policyengine/design-system' app/ --include='*.tsx' +grep -rn 'unpkg.com/@policyengine/ui-kit' app/ --include='*.tsx' ``` ### 4. Package Manager diff --git a/agents/dashboard/dashboard-planner.md b/agents/dashboard/dashboard-planner.md index f6a610b..7640236 100644 --- a/agents/dashboard/dashboard-planner.md +++ b/agents/dashboard/dashboard-planner.md @@ -292,7 +292,7 @@ tests: design_compliance: - name: "uses_design_tokens" - description: "No hardcoded colors - all from @policyengine/design-system" + description: "No hardcoded colors - all from @policyengine/ui-kit" - name: "inter_font" description: "Inter font loaded and applied" - name: "sentence_case" diff --git a/skills/content/content-generation-skill/SKILL.md b/skills/content/content-generation-skill/SKILL.md index 80cdc4c..77c5a89 100644 --- a/skills/content/content-generation-skill/SKILL.md +++ b/skills/content/content-generation-skill/SKILL.md @@ -74,7 +74,7 @@ logo_path: Path to PolicyEngine logo ### Colors -Source of truth: `policyengine-design-skill` and `@policyengine/design-system` CSS tokens. +Source of truth: `policyengine-design-skill` and `@policyengine/ui-kit` CSS tokens. Social image generation runs in headless Chrome with design tokens loaded, so use CSS vars where possible. Fallback hex values for non-browser contexts: | Token | CSS var | Hex | diff --git a/skills/documentation/policyengine-design-skill/SKILL.md b/skills/documentation/policyengine-design-skill/SKILL.md index 13af36f..a6a333c 100644 --- a/skills/documentation/policyengine-design-skill/SKILL.md +++ b/skills/documentation/policyengine-design-skill/SKILL.md @@ -256,7 +256,7 @@ https://raw.githubusercontent.com/PolicyEngine/policyengine-app-v2/main/app/publ |-------------|-------------|------------| | **Standalone tool** | `@import "@policyengine/ui-kit/theme.css"` | Google Fonts: Inter | | **app-v2** | `import { colors } from '@/designTokens'` | Built-in (Mantine + Inter) | -| **Python chart** | Hardcode or load `tokens.json` from `@policyengine/design-system` | Inter for Plotly | +| **Python chart** | Hardcode or load `tokens.json` from `@policyengine/ui-kit` | Inter for Plotly | | **Blog HTML** | Hardcode from token values | Google Fonts: Inter | ## Accessibility diff --git a/skills/tools-and-apis/policyengine-app-skill/SKILL.md b/skills/tools-and-apis/policyengine-app-skill/SKILL.md index ef93f75..31ab353 100644 --- a/skills/tools-and-apis/policyengine-app-skill/SKILL.md +++ b/skills/tools-and-apis/policyengine-app-skill/SKILL.md @@ -16,7 +16,7 @@ Architecture and patterns for developing the main PolicyEngine web application a ``` policyengine-app-v2/ ├── packages/ -│ └── design-system/ # @policyengine/design-system (npm) +│ └── design-system/ # @policyengine/ui-kit/legacy (npm, design-system deprecated) ├── app/ # Main Vite application │ ├── src/ │ │ ├── pages/ # Page components (*.page.tsx) @@ -47,7 +47,7 @@ policyengine-app-v2/ | Routing | React Router v7 (`createBrowserRouter`) | | Charts | **Recharts** (standard), Plotly (maps only) | | Server state | React Query | -| Design tokens | `@policyengine/design-system` | +| Design tokens | `@policyengine/ui-kit/legacy` (formerly design-system) | | Language | TypeScript | | Formatting | Prettier + ESLint | | Testing | Vitest |