code-ai-installer 1.2.0 → 1.3.0

package/.agents/ui_a11y_smoke_review/SKILL.md

@@ -1,15 +1,195 @@
----
-name: ui_a11y_smoke_review
-description: Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec.
----
-
-# Skill: UI & A11y Smoke Review
-
-## Проверить
-- Есть loading/empty/error состояния по UX Spec
-- Фокус-стили видимы, можно пользоваться клавиатурой
-- Формы: label/aria, сообщения об ошибках доступны
-- Нет очевидных регрессий контента/CTA
-
-## Выход
-- Findings + рекомендации
+---
+name: ui_a11y_smoke_review
+description: Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA.
+---
+
+# Skill: UI & A11y Smoke Review (Designer-Level)
+
+Быстрая designer-level проверка UI на соответствие UX Spec + a11y baseline **до передачи в QA**.
+
+> **Отличие от `$qa_ui_a11y_smoke`:** Этот скилл — дизайнерский quick check (5-10 мин, по UX Spec).
+> `$qa_ui_a11y_smoke` — формальный QA тест (25 WCAG checks, tools, report).
+
+**Разделы:**
+1. [Workflow](#1-workflow)
+2. [Checklist](#2-checklist)
+3. [UX Spec Compliance](#3-ux-compliance)
+4. [Quick A11y Scan](#4-a11y-scan)
+5. [Output Template](#5-output)
+
+---
+
+## 1. Workflow
+
+```
+1. Input:
+   ├── Implemented UI (browser / screenshots)
+   ├── UX Spec (из $ux_spec) — source of truth
+   └── A11y Baseline (из $a11y_baseline) — requirements
+
+2. Visual walkthrough per screen:
+   a. Does layout match UX Spec?
+   b. Are all components/sections present?
+   c. Are all 4 states implemented (loading/empty/error/success)?
+   d. Quick keyboard pass (Tab through interactive elements)
+
+3. Classify issues:
+   ├── P0: Missing critical states, broken flow, inaccessible
+   ├── P1: Wrong component, missing state, inconsistency
+   └── P2: Polish, spacing, cosmetic
+
+4. Report → DEV fixes before formal QA
+
+Note: This is a QUICK check. For formal testing → $qa_ui_a11y_smoke
+```
+
+---
+
+## 2. Checklist
+
+### 2.1 Visual & Layout
+
+| # | Check | UX Spec ref | Severity | Status |
+|---|-------|------------|----------|--------|
+| UI-01 | Layout matches UX Spec (columns, sections, order) | Screen Spec → Layout | 🟠 P1 | ☐ |
+| UI-02 | All sections present (no missing panels/cards) | Screen Spec → Sections | 🟠 P1 | ☐ |
+| UI-03 | Primary CTA visible and correctly styled | Screen Spec → Actions | 🔴 P0 | ☐ |
+| UI-04 | Typography hierarchy matches (h1 > h2 > body) | UI Inventory → Tokens | 🟡 P2 | ☐ |
+| UI-05 | Colors match design tokens | Design Rules → DR-xx | 🟠 P1 | ☐ |
+
+### 2.2 UI States
+
+| # | Check | Against | Severity | Status |
+|---|-------|---------|----------|--------|
+| UI-06 | **Loading** state present (skeleton or spinner per UX Spec) | Screen Spec → States | 🟠 P1 | ☐ |
+| UI-07 | **Empty** state present (illustration + text + CTA) | Screen Spec → States | 🟠 P1 | ☐ |
+| UI-08 | **Error** state present (message + retry/action) | Screen Spec → States | 🔴 P0 | ☐ |
+| UI-09 | **Success** feedback (toast/message after action) | Screen Spec → Notifications | 🟠 P1 | ☐ |
+| UI-10 | **Disabled** state clear (visual + non-clickable) | Screen Spec → States | 🟡 P2 | ☐ |
+| UI-11 | **Saving/In-flight** state (button spinner, disabled) | Screen Spec → Actions | 🟠 P1 | ☐ |
+
+### 2.3 Forms
+
+| # | Check | Against | Severity | Status |
+|---|-------|---------|----------|--------|
+| UI-12 | All form fields have visible labels | A11y Baseline A-10 | 🔴 P0 | ☐ |
+| UI-13 | Required fields marked (asterisk or text) | A11y Baseline A-11 | 🟠 P1 | ☐ |
+| UI-14 | Error messages visible and descriptive | Screen Spec → Validation | 🟠 P1 | ☐ |
+| UI-15 | Submit button feedback (loading/disabled during save) | Screen Spec → Actions | 🟠 P1 | ☐ |
+
+### 2.4 Quick A11y
+
+| # | Check | Against | Severity | Status |
+|---|-------|---------|----------|--------|
+| UI-16 | Can Tab to all interactive elements | A11y Baseline A-01 | 🔴 P0 | ☐ |
+| UI-17 | Focus ring visible on focused elements | A11y Baseline A-05 | 🔴 P0 | ☐ |
+| UI-18 | Modal traps focus + Escape closes | A11y Baseline A-07 | 🟠 P1 | ☐ |
+| UI-19 | No obvious contrast issues (text readable) | A11y Baseline A-19 | 🟠 P1 | ☐ |
+| UI-20 | Content/buttons not cut off or overlapping | — | 🟠 P1 | ☐ |
+
+---
+
+## 3. UX Spec Compliance
+
+### Per-screen verification
+
+For each screen in UX Spec, verify implementation matches:
+
+```markdown
+### Screen: <Name>
+
+| UX Spec Element | Expected | Implemented? | Notes |
+|----------------|----------|:------------:|-------|
+| Layout: 2-column 60/40 | Config + Preview | ✅ | — |
+| Tab: General | Title, Subtitle, CTA fields | ✅ | — |
+| Tab: Design | ColorPicker × 4, FontSelect | ⚠️ | Missing overlay picker |
+| Tab: Timer | Switch + NumberInputs | ✅ | — |
+| State: Loading | Skeleton | ❌ | Shows blank page |
+| State: Error (save) | Toast + inline errors | ⚠️ | Toast only, no inline |
+| Notification: Save success | Toast, 3s auto-dismiss | ✅ | — |
+```
+
+---
+
+## 4. Quick A11y Scan
+
+### 60-second keyboard test
+
+| Step | Action | Expected | Status |
+|------|--------|----------|:------:|
+| 1 | Press Tab from page top | Focus on first interactive element | ☐ |
+| 2 | Tab through all controls | Each gets visible focus ring | ☐ |
+| 3 | Enter on buttons | Action fires | ☐ |
+| 4 | Open modal/dropdown | Focus moves inside | ☐ |
+| 5 | Escape on modal | Modal closes, focus returns | ☐ |
+
+### Quick visual checks
+
+| Check | How | Expected |
+|-------|-----|---------|
+| Contrast | Squint test — can you read all text? | All text readable |
+| Hierarchy | Scan page — is structure clear? | Clear h1 > h2 > body |
+| CTA | Is the primary action obvious? | One clear primary button |
+| Errors | Trigger an error — is it clear? | Visible, descriptive, near the field |
+
+---
+
+## 5. Output Template
+
+```markdown
+# UI & A11y Smoke Review
+
+**Date:** YYYY-MM-DD
+**Reviewer:** UX/UI Designer Agent
+**Screen(s):** <list>
+**UX Spec:** <reference>
+
+## Checklist Results
+| Section | Pass | Fail | Total |
+|---------|:----:|:----:|:-----:|
+| Visual & Layout (UI-01..05) | 4 | 1 | 5 |
+| UI States (UI-06..11) | 4 | 2 | 6 |
+| Forms (UI-12..15) | 3 | 1 | 4 |
+| Quick A11y (UI-16..20) | 4 | 1 | 5 |
+| **Total** | **15** | **5** | **20** |
+
+## UX Spec Compliance
+| Screen | Elements checked | Match | Mismatch |
+|--------|:---------------:|:-----:|:--------:|
+| Settings | 7 | 5 | 2 |
+| Coupons | 5 | 5 | 0 |
+
+## Findings
+| # | Severity | Check | Screen | Finding | Fix |
+|---|----------|-------|--------|---------|-----|
+| 1 | 🔴 P0 | UI-08 | Settings | No error state for failed save | Add error toast + inline errors |
+| 2 | 🟠 P1 | UI-06 | Settings | Blank page instead of skeleton | Add skeleton loader |
+| 3 | 🟠 P1 | UI-05 | Design tab | Missing overlay color picker | Add 4th ColorPicker |
+| 4 | 🟡 P2 | UI-04 | Settings | Section titles not bold enough | Increase font-weight |
+
+## Keyboard Test
+| Step | Status |
+|------|:------:|
+| Tab navigation | ✅ |
+| Focus visible | ✅ |
+| Enter activates | ✅ |
+| Modal focus trap | ⚠️ Focus escapes |
+| Escape closes | ✅ |
+
+## Verdict
+- ✅ **READY FOR QA** — no P0, minor issues tracked
+- ⚠️ **FIX FIRST** — P0/P1 issues must be fixed before QA
+- ❌ **NOT READY** — critical UX/a11y issues block QA
+
+## Next
+- If READY → pass to $qa_ui_a11y_smoke for formal testing
+- If FIX FIRST → create DEV-xx tasks, re-review after fix
+```
+
+---
+
+## См. также
+- `$qa_ui_a11y_smoke` — formal QA a11y testing (25 WCAG checks)
+- `$ux_spec` — UX Spec (source of truth)
+- `$a11y_baseline` — a11y requirements
+- `$design_parity_review` — full design comparison

package/.agents/ui_a11y_smoke_review/agents/claude.json

@@ -1,13 +1,13 @@
 {
   "name": "ui_a11y_smoke_review",
   "display_name": "UI и a11y smoke-ревью",
-  "description": "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec.",
+  "description": "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA.",
   "default_prompt": "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\".",
   "triggers": [
     "ui_a11y_smoke_review",
     "ui a11y smoke review",
     "UI и a11y smoke-ревью",
-    "Быстрый UI/a11y smoke review"
+    "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec"
   ],
   "capabilities": [
     "ui",

package/.agents/ui_a11y_smoke_review/agents/copilot.json

@@ -1,13 +1,13 @@
 {
   "name": "ui_a11y_smoke_review",
   "display_name": "UI и a11y smoke-ревью",
-  "description": "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec.",
+  "description": "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA.",
   "default_prompt": "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\".",
   "triggers": [
     "ui_a11y_smoke_review",
     "ui a11y smoke review",
     "UI и a11y smoke-ревью",
-    "Быстрый UI/a11y smoke review"
+    "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec"
   ],
   "capabilities": [
     "ui",

package/.agents/ui_a11y_smoke_review/agents/gemini.json

@@ -1,13 +1,13 @@
 {
   "name": "ui_a11y_smoke_review",
   "display_name": "UI и a11y smoke-ревью",
-  "description": "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec.",
+  "description": "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA.",
   "default_prompt": "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\".",
   "triggers": [
     "ui_a11y_smoke_review",
     "ui a11y smoke review",
     "UI и a11y smoke-ревью",
-    "Быстрый UI/a11y smoke review"
+    "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec"
   ],
   "capabilities": [
     "ui",

package/.agents/ui_a11y_smoke_review/agents/openai.yaml

@@ -1,6 +1,6 @@
 interface:
   display_name: "UI и a11y smoke-ревью"
-  short_description: "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по…"
+  short_description: "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria…"
   default_prompt: "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\"."
 dependencies:
   tools: []

package/.agents/ui_a11y_smoke_review/agents/qwen.json

@@ -1,13 +1,13 @@
 {
   "name": "ui_a11y_smoke_review",
   "display_name": "UI и a11y smoke-ревью",
-  "description": "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec.",
+  "description": "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA.",
   "default_prompt": "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\".",
   "triggers": [
     "ui_a11y_smoke_review",
     "ui a11y smoke review",
     "UI и a11y smoke-ревью",
-    "Быстрый UI/a11y smoke review"
+    "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec"
   ],
   "capabilities": [
     "ui",

package/.agents/ui_a11y_smoke_review/agents/skill.yaml

@@ -1,13 +1,13 @@
 version: 1
 name: "ui_a11y_smoke_review"
 display_name: "UI и a11y smoke-ревью"
-description: "Быстрый UI/a11y smoke review: состояния loading/empty/error, фокус, клавиатура, aria/labels по a11y baseline и UX Spec."
+description: "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec. Выполняется ДО передачи в QA."
 default_prompt: "Используй $ui_a11y_smoke_review, когда задача относится к навыку \"UI и a11y smoke-ревью\"."
 triggers:
   - "ui_a11y_smoke_review"
   - "ui a11y smoke review"
   - "UI и a11y smoke-ревью"
-  - "Быстрый UI/a11y smoke review"
+  - "Быстрый UI/a11y smoke review дизайнера — состояния loading/empty/error, фокус, клавиатура, aria/labels, соответствие UX Spec"
 capabilities:
   - "ui"
   - "a11y"

package/.agents/ui_inventory/SKILL.md

@@ -1,50 +1,277 @@
----
-name: ui_inventory
-description: Составить инвентарь UI компонентов и правила переиспользования: базовые компоненты, композиционные компоненты, паттерны (forms, tables, dialogs), дизайн-токены (минимум).
----
-
-# Skill: UI Components Inventory
-
-## Цель
-Снизить стоимость разработки и поддерживать консистентность UI.
-
-## Выход
-Список компонентов в виде каталога:
-
-## 1) Базовые (atoms)
-- Button (variants: primary/secondary/ghost/destructive, sizes)
-- Input / Textarea
-- Select / Combobox
-- Checkbox / Radio / Switch
-- Badge / Tag
-- Spinner / Skeleton
-- Icon
-- Tooltip
-
-## 2) Составные (molecules/organisms)
-- FormField (label + control + help + error)
-- Modal / Dialog
-- Toast / Notification
-- Table (sorting/filter/pagination если нужно)
-- EmptyState (иконка + текст + CTA)
-- ErrorState (сообщение + retry)
-- Pagination
-- Navbar / Sidebar
-- Breadcrumbs (если нужно)
-
-## 3) Паттерны
-- Loading strategy (skeleton vs spinner)
-- Empty vs zero-results
-- Ошибки: уровни (inline / page / toast)
-- Подтверждение destructive действий
-- Обработка долгих операций (progress, optimistic UI)
-
-## 4) Минимальные design tokens (если нет дизайн-системы)
-- Spacing scale (например: 4/8/12/16/24/32)
-- Border radius уровни
-- Typography: заголовки/текст/подписи
-- Цвета состояний: success/warn/error/info (без конкретных hex, если не задано)
-
-## Правило
-Если есть готовая дизайн-система — inventory привязывается к её компонентам/вариантам.
-Если нет — описывать компоненты с минимальными параметрами, достаточными для реализации и тестирования UX Spec.
+---
+name: ui_inventory
+description: Составить инвентарь UI компонентов и правила переиспользования — базовые компоненты, композиционные компоненты, паттерны (forms, tables, dialogs), дизайн-токены (минимум).
+---
+
+# Skill: UI Components Inventory
+
+Каталог UI компонентов с variants, states, a11y notes.
+
+**Разделы:**
+1. [Workflow](#1-workflow)
+2. [Component Card Template](#2-card)
+3. [Component Catalog](#3-catalog)
+4. [Design Tokens](#4-tokens)
+5. [Design System Mapping](#5-mapping)
+6. [Пример: Button Card](#6-пример)
+7. [Output Template](#7-output)
+
+---
+
+## 1. Workflow
+
+```
+1. Input: UX Spec (из $ux_spec)
+2. Extract все упомянутые компоненты из Screen Specs
+3. Classify: atom / molecule / organism / pattern
+4. For each → Component Card (section 2)
+5. Map to design system (section 5) если есть
+6. Define design tokens (section 4)
+7. Validate: каждый компонент в UI Spec покрыт
+```
+
+### Decision: Use existing vs Build custom
+
+```
+Компонент нужен ← UX Spec
+    ├── Есть в дизайн-системе? (WDS / shadcn / Mantine)
+    │   ├── Да, подходит → USE (указать import + variant)
+    │   ├── Да, но нужна кастомизация → CUSTOMIZE (wrapper component)
+    │   └── Нет → BUILD CUSTOM (с a11y baseline)
+    └── Уже есть в проекте?
+        ├── Да → REUSE (указать путь)
+        └── Нет → CREATE (по template)
+```
+
+---
+
+## 2. Component Card Template
+
+```markdown
+### Component: <Name>
+
+**Category:** Atom / Molecule / Organism
+**Source:** WDS | shadcn | Custom | Existing (<path>)
+**Used in:** <screens list>
+
+#### Variants
+| Variant | Visual | Use case |
+|---------|--------|----------|
+| primary | Filled, accent color | Main CTA |
+| secondary | Outlined | Secondary actions |
+| ghost | Text only | Tertiary actions |
+| destructive | Red filled | Delete/remove |
+
+#### Props
+| Prop | Type | Required | Default | Description |
+|------|------|:--------:|---------|-------------|
+| label | string | ✅ | — | Button text |
+| variant | enum | ❌ | "primary" | Visual style |
+| size | "sm" | "md" | "lg" | ❌ | "md" | Dimensions |
+| disabled | boolean | ❌ | false | Disable interaction |
+| loading | boolean | ❌ | false | Show spinner |
+| onClick | function | ✅ | — | Click handler |
+
+#### States
+| State | Visual | Behavior |
+|-------|--------|----------|
+| Default | Normal appearance | Clickable |
+| Hover | Darker bg / lighter bg | Cursor pointer |
+| Active/Pressed | Slight scale down | Processing |
+| Focused | Focus ring visible | Keyboard nav |
+| Disabled | 50% opacity | Not clickable |
+| Loading | Spinner replaces label | Not clickable |
+
+#### A11y Notes
+- Uses `<button>` element (not div)
+- `aria-disabled` when disabled
+- `aria-busy` when loading
+- Focus visible via `:focus-visible`
+```
+
+---
+
+## 3. Component Catalog
+
+### 3.1 Atoms (base elements)
+
+| Component | Variants | Source | A11y |
+|-----------|---------|--------|------|
+| **Button** | primary / secondary / ghost / destructive | WDS / Custom | `<button>`, focus-visible |
+| **TextInput** | default / error / disabled | WDS / Custom | `<label>` linked, aria-invalid |
+| **Textarea** | default / error / disabled | WDS / Custom | `<label>` linked |
+| **Select** | default / error / disabled | WDS / Custom | aria-expanded, listbox role |
+| **Checkbox** | unchecked / checked / indeterminate | WDS | `<input type="checkbox">` |
+| **Switch** | off / on / disabled | WDS | role="switch", aria-checked |
+| **ColorPicker** | — | Custom | aria-label, keyboard nav |
+| **NumberInput** | default / error / disabled | WDS / Custom | min/max, step |
+| **Badge** | success / warn / error / info / neutral | WDS | aria-label for icon-only |
+| **Spinner** | sm / md / lg | WDS | aria-busy on parent |
+| **Skeleton** | text / rect / circle | Custom | aria-hidden |
+| **Icon** | varies (Material Symbols) | Custom | aria-hidden (decorative) or aria-label |
+| **Tooltip** | top / bottom / left / right | WDS | role="tooltip", aria-describedby |
+
+### 3.2 Molecules (composed)
+
+| Component | Contains | Source | Notes |
+|-----------|---------|--------|-------|
+| **FormField** | Label + Control + HelpText + Error | Custom | Standard form pattern |
+| **Toast** | Icon + Message + Close | WDS | Auto-dismiss, aria-live |
+| **EmptyState** | Icon/Illustration + Text + CTA | Custom | Call-to-action button |
+| **ErrorState** | Icon + Message + Retry button | Custom | — |
+| **Card** | Header + Body + Actions | Custom | — |
+| **TabBar** | Tab × N | WDS | role="tablist", arrow keys |
+
+### 3.3 Organisms (complex)
+
+| Component | Contains | Source | Notes |
+|-----------|---------|--------|-------|
+| **ConfigPanel** | TabBar + FormFields + SaveButton | Custom | Main settings form |
+| **LivePreview** | PopupTemplate (rendered) | Custom | Updates on config change |
+| **CouponTable** | Table + Pagination + EmptyState | Custom | CRUD actions |
+| **ConfirmDialog** | Modal + Message + Confirm/Cancel buttons | WDS | Focus trap |
+
+### 3.4 Patterns (behavioral)
+
+| Pattern | Rule | Components used |
+|---------|------|----------------|
+| **Loading strategy** | Skeleton for initial, spinner for actions | Skeleton, Spinner |
+| **Empty state** | Illustration + text + CTA | EmptyState |
+| **Error recovery** | Message + retry button | ErrorState, Toast |
+| **Destructive confirm** | Modal before delete | ConfirmDialog |
+| **Optimistic update** | Show change → revert on error | Toast (undo) |
+| **Form validation** | Inline on blur + all on submit | FormField (error state) |
+
+---
+
+## 4. Design Tokens
+
+### Spacing
+
+| Token | Value | Use |
+|-------|-------|-----|
+| `--space-xs` | 4px | Dense padding |
+| `--space-sm` | 8px | Default gap |
+| `--space-md` | 16px | Section padding |
+| `--space-lg` | 24px | Card padding |
+| `--space-xl` | 32px | Section spacing |
+| `--space-2xl` | 48px | Page margins |
+
+### Typography
+
+| Token | Size | Weight | Use |
+|-------|------|--------|-----|
+| `--text-xs` | 12px | 400 | Captions, help text |
+| `--text-sm` | 14px | 400 | Body, form labels |
+| `--text-md` | 16px | 400 | Default body |
+| `--text-lg` | 18px | 500 | Section headers |
+| `--text-xl` | 24px | 600 | Page headers |
+| `--text-2xl` | 32px | 700 | Title |
+
+### Border Radius
+
+| Token | Value | Use |
+|-------|-------|-----|
+| `--radius-sm` | 4px | Inputs, badges |
+| `--radius-md` | 8px | Cards, buttons |
+| `--radius-lg` | 12px | Modals, panels |
+| `--radius-full` | 9999px | Avatars, pills |
+
+### Status Colors
+
+| Token | Value | Use |
+|-------|-------|-----|
+| `--color-success` | `#22c55e` | Success states |
+| `--color-warning` | `#f59e0b` | Warnings |
+| `--color-error` | `#ef4444` | Errors |
+| `--color-info` | `#3b82f6` | Info |
+
+### Shadows
+
+| Token | Value | Use |
+|-------|-------|-----|
+| `--shadow-sm` | `0 1px 2px rgba(0,0,0,0.05)` | Cards |
+| `--shadow-md` | `0 4px 6px rgba(0,0,0,0.1)` | Dropdowns |
+| `--shadow-lg` | `0 10px 15px rgba(0,0,0,0.15)` | Modals |
+
+---
+
+## 5. Design System Mapping
+
+### Wix Design System (WDS) mapping
+
+| UI Inventory | WDS component | Import | Notes |
+|-------------|--------------|--------|-------|
+| Button | `<Button>` | `@wix/design-system` | Supports priority prop |
+| TextInput | `<Input>` | `@wix/design-system` | — |
+| Switch | `<ToggleSwitch>` | `@wix/design-system` | — |
+| Toast | `Toast` (imperative) | `@wix/design-system` | Use with `<Notification>` |
+| Modal | `<Modal>` + `<MessageModalLayout>` | `@wix/design-system` | — |
+| Tabs | `<Tabs>` | `@wix/design-system` | — |
+| Table | `<Table>` | `@wix/design-system` | — |
+| ColorPicker | — | Custom build | WDS doesn't have one |
+| LivePreview | — | Custom build | App-specific |
+
+---
+
+## 6. Пример: Button Card
+
+```markdown
+### Component: Button
+
+**Category:** Atom
+**Source:** WDS `<Button>` (customized)
+**Used in:** Settings (Save, Reset), Coupons (Create, Delete)
+
+#### Variants
+| Variant | WDS `priority` | Visual |
+|---------|:-------------:|--------|
+| primary | `primary` | Filled blue (#116DFF) |
+| secondary | `secondary` | Outlined |
+| destructive | N/A (custom) | Filled red (#D32F2F) |
+
+#### States
+| Default | Hover | Loading | Disabled |
+|---------|-------|---------|----------|
+| Normal | Darker bg | Spinner, no text | 50% opacity |
+
+#### A11y: `<button>`, focus-visible, aria-disabled, aria-busy
+```
+
+---
+
+## 7. Output Template
+
+```markdown
+# UI Components Inventory
+
+**Date:** YYYY-MM-DD
+**Author:** UX/UI Designer Agent
+**Design System:** <WDS / shadcn / Custom>
+**UX Spec:** <reference>
+
+## Component Summary
+| Category | Count | Custom | From DS |
+|----------|:-----:|:------:|:-------:|
+| Atoms | 13 | 3 | 10 |
+| Molecules | 6 | 4 | 2 |
+| Organisms | 4 | 4 | 0 |
+| Patterns | 6 | — | — |
+
+## Component Cards
+<section 2 format × N components>
+
+## Design Tokens
+<section 4>
+
+## Design System Mapping
+<section 5>
+```
+
+---
+
+## См. также
+- `$ux_spec` — Screen specs (input for inventory)
+- `$a11y_baseline` — a11y requirements per component
+- `$design_systems` — integration guide for design systems
+- `$design_intake` — analyze design materials

package/.agents/ui_inventory/agents/claude.json

@@ -1,13 +1,13 @@
 {
   "name": "ui_inventory",
   "display_name": "Инвентаризация UI-компонентов",
-  "description": "Составить инвентарь UI компонентов и правила переиспользования: базовые компоненты, композиционные компоненты, паттерны (forms, tables, dialogs), дизайн-токены (минимум).",
+  "description": "Составить инвентарь UI компонентов и правила переиспользования — базовые компоненты, композиционные компоненты, паттерны (forms, tables, dialogs), дизайн-токены (минимум).",
   "default_prompt": "Используй $ui_inventory, когда задача относится к навыку \"Инвентаризация UI-компонентов\".",
   "triggers": [
     "ui_inventory",
     "ui inventory",
     "Инвентаризация UI-компонентов",
-    "Составить инвентарь UI компонентов и правила переиспользования"
+    "Составить инвентарь UI компонентов и правила переиспользования — базовые компоненты, композиционные компоненты, паттерны (forms, tables, dialogs), дизайн-токены (минимум)"
   ],
   "capabilities": [
     "ui",