---
description: ReUI PRO приоритетнее голого shadcn — иерархия UI для telemtPanel
alwaysApply: true
---

# ReUI PRO > голый shadcn

В **telemtPanel** UI строится **reuse-first** из ReUI PRO. Голый shadcn/ui — только primitives и токены, никогда как источник страниц/blocks.

## Иерархия (жёстко)

1. **ReUI PRO** — MCP `user-reui` + registry `@reui` + kit `reui-kit/`  
   pages, KPI, lists, settings, shell, empty, forms-as-blocks, Quick Actions, auth
2. **shadcn primitives** — MCP `plugin-shadcn-shadcn` + `@telemt/ui`  
   только Button / Field / Sidebar / Dialog / Sheet / Input / … и design tokens
3. **Kit** (`apps/web/src/components/reui-kit/`) — adapt ReUI, не redesign
4. **Domain** — wiring данных Telemt / fleet

## Primary MCP

1. **`user-reui`** — `search` → `compose_page` / `get_block` / `get_component` → `get_install_command` → CLI → `validate_usage`
2. **`plugin-shadcn-shadcn`** — только free shadcn primitives / registry sync, **не** вместо PRO blocks

Skill: `.cursor/skills/reui/SKILL.md` · docs: [Cursor](https://reui.io/docs/cursor) · [License](https://reui.io/docs/license-setup) · [Blocks](https://reui.io/blocks)

## Surface

Ops / dashboard / list / detail / settings: **`surface: frame`** (`apps/web/src/lib/ui-surface.ts`).  
Не смешивать Card и Frame на одном ops-экране.

## Запрещено

- Поднимать **ui.shadcn.com/blocks** / shadcn MCP выше ReUI PRO для ops-экранов
- Hand-roll data-grid / KPI / Quick Actions / settings rows / empty / auth page при наличии `@reui` / kit
- Ставить SectionCards / DataGridCard / raw `<table>` как эталон
- `space-y-*` / `space-x-*` — только `flex` + `gap-*`
- Raw `bg-emerald-*` вместо semantic / ReUI `variant`
- Копипаст markup с сайта без `pnpm dlx shadcn@latest add @reui/...`

## Обязательные ссылки в ответах по UI

Для затронутой зоны всегда: `previewUrl` + `docsUrl` (например [stats-12](https://reui.io/preview/base/stats-12), [app-shell-12](https://reui.io/preview/base/app-shell-12)).

Детали: [`reui-mcp.mdc`](reui-mcp.mdc), [`kpi-hybrid.mdc`](kpi-hybrid.mdc), `docs/ui-design-contract.md`, `AGENTS.md`.