# Components — picker index

> Loaded by the canvas and review agents as their components-vocabulary anchor. Each row = one component file in this folder with the trigger phrases that should make the agent reach for that spec.

When the PM mentions a component by name (in either language), apply the canonical rules from the matching file. **Do not paste the file content into the reply** — paraphrase and cite (`components/<name>.md`). Per-file specs cover anatomy, states, accessibility (focus, ARIA, keyboard), motion expectations, and known anti-patterns. If a PM asks for a component not in this index, fall back to the closest semantic match and say which file you cited.

---

## Catalog

| Component | File | Pick when the PM says |
|---|---|---|
| Accordion | `components/accordion.md` | accordion, collapse, expand, аккордеон, раскрывающийся блок |
| Alert / banner | `components/alert.md` | alert, banner, inline error, баннер, уведомление в шапке |
| Badge | `components/badge.md` | badge, pill counter, бейдж, счётчик |
| Breadcrumbs | `components/breadcrumbs.md` | breadcrumbs, хлебные крошки, путь |
| Button | `components/button.md` | button, CTA, кнопка, primary action |
| Card | `components/card.md` | card, tile, плитка, карточка |
| Checkbox | `components/checkbox.md` | checkbox, мультивыбор, флажок |
| Chip | `components/chip.md` | chip, tag, фильтр-чип, тег |
| Command palette | `components/command-palette.md` | command palette, cmd+k, спотлайт, быстрый поиск |
| Date picker | `components/date-picker.md` | date picker, calendar, дата, календарь |
| Drawer | `components/drawer.md` | drawer, side sheet, выезжающая панель |
| File upload | `components/file-upload.md` | file upload, drag and drop, загрузка файла |
| Input | `components/input.md` | input, text field, поле ввода |
| Label | `components/label.md` | label, подпись поля, form label |
| Link | `components/link.md` | link, hyperlink, ссылка |
| List | `components/list.md` | list, feed, лента, перечень |
| Menu | `components/menu.md` | menu, dropdown, context menu, выпадающее меню |
| Modal / dialog | `components/modal-dialog.md` | modal, dialog, popup, модалка, диалог |
| Navbar | `components/navbar.md` | navbar, top bar, шапка, навигация сверху |
| Pagination | `components/pagination.md` | pagination, page numbers, пагинация |
| Popover | `components/popover.md` | popover, hover card, поповер |
| Progress | `components/progress.md` | progress bar, loader, прогресс-бар |
| Radio | `components/radio.md` | radio, single choice, радиокнопка |
| Rich text editor | `components/rich-text-editor.md` | rich text, WYSIWYG, редактор |
| Select / combobox | `components/select-combobox.md` | select, dropdown choice, combobox, выбор из списка |
| Sidebar | `components/sidebar.md` | sidebar, nav rail, боковая панель |
| Skeleton | `components/skeleton.md` | skeleton, loading placeholder, скелетон |
| Slider | `components/slider.md` | slider, range, ползунок |
| Stepper | `components/stepper.md` | stepper, wizard, многошаговая форма |
| Switch | `components/switch.md` | switch, toggle, тумблер, переключатель |
| Table | `components/table.md` | table, data grid, таблица |
| Tabs | `components/tabs.md` | tabs, sections, вкладки |
| Toast | `components/toast.md` | toast, snackbar, нотификация |
| Tooltip | `components/tooltip.md` | tooltip, hint, подсказка |
| Tree | `components/tree.md` | tree, nested, дерево, иерархия |

---

## How to use this index

1. Parse the PM message and the canvas Brief for component nouns (Russian or English).
2. Pick the row that matches. If two rows match, pick the most specific (e.g. `select-combobox` over `menu` when the PM said "dropdown selector").
3. Open the matching local `components/<name>.md` entry before applying its contract; the index alone is not the component specification.
4. If the matching entry is unavailable, report the missing reference instead of reconstructing detailed rules from memory.

---

## What lives in each component file

Per the [`TEMPLATE.md`](TEMPLATE.md) contract every file in this folder covers:

- **Anatomy** — named parts and required tokens.
- **States** — default / hover / focus / active / disabled / loading.
- **Accessibility** — keyboard, ARIA, focus management, screen-reader behavior.
- **Motion** — entry / exit / state transitions and `prefers-reduced-motion` handling.
- **Anti-patterns** — common shipping mistakes and what to do instead.
- **Cross-links** — to typography, color, surfaces, accessibility, and form patterns where relevant.

---

## When the component isn't here

If the PM asks about a component this folder doesn't cover (e.g. avatar, timeline, kanban board, data viz chart):

- Say so plainly.
- Cite the closest semantic neighbour and adapt.
- Suggest adding the component file as a follow-up — the catalog is a living index, not a frozen contract.