Библиотека компонентов
Заготовки для личного кабинета и админки. Единая ширина сетки 1200px, тёмная тема, минимальный кегль 14px, все интерактивные элементы с фокус-кольцом.
Логотип
Авторский SVG-знак: договор, из которого растёт график сметы. Линия рисует себя в цикле, точка пика пульсирует.
Logo / LogoMark
Статусы и бейджи
StatusBadge — доменный статус с тоном; Badge — shadcn-примитив для подписей.
StatusBadge
Badge
Метрики
StatCard для дашбордов кабинета: значение, дельта, подсказка.
StatCard
Проекты
+3 за месяц12
2 ждут анализа
Средний чек
+12%3,8 млн ₽
Время анализа
50 мин
было 8–10 часов вручную
Требуют цены
−25
позиции без подтверждения
Формы
Field + Input/Select/Textarea/Checkbox/RadioGroup. Ошибки — через FieldError и data-invalid.
Поля ввода
Так проект будет называться в кабинете и в договоре.
Карточки и описания
Card для сущностей, DescriptionList для характеристик, аватары команды.
Card
- Позиции
- 32 изделия
- Цена договора
- 4 312 620 ₽
- Статус
- проверено
AvatarGroup
Участники проекта: заказчик, менеджер, AI-оркестратор.
Таблица
Позиции сметы: строка = изделие, сумма выравнивается вправо, статус — StatusBadge.
Table
| Позиция | Помещение | Сумма | Статус |
|---|---|---|---|
| Кухня с островом | Кухня-гостиная | 1 245 000 ₽ | подтверждена |
| Медиа-стена и консоль | Гостиная | 680 000 ₽ | подтверждена |
| Гардеробная система | Мастер-спальня | 920 000 ₽ | нужна цена |
| Шкафы и панели | 6 помещений | 780 000 ₽ | оценка AI |
Диалоги, меню и уведомления
Интерактивные примитивы: модалка, подтверждение удаления, выпадающее меню, тосты, табы.
Dialog / AlertDialog / DropdownMenu / Tooltip / Toast
Tabs
Прогресс и таймлайн
ProgressBar для загрузок и готовности; Timeline — для этапов проекта.
ProgressBar
Timeline
- ✓
Исходники загружены
6 файлов · сегодня, 08:42
- •
Анализ AI-команды
сейчас · шаг 3 из 4
- ·
Подтверждение цен
менеджер
- ·
Договор к подписи
после согласования
Пустые и загрузочные состояния
Empty для отсутствия данных, Skeleton — для загрузки списков.
Empty
Skeleton