StatBadge
Плашка статуса: раскладывает состояние прогресса по семантическим тонам бейджа.
◇ React◇ Vue◇ Svelte◇ Angular
Справочник
Рецепты
Композиции из примитивов — бейдж состояния, стопка алертов, карточка с полосой, диалог с формой, диалог с фильтруемым списком. Каждая показана целиком: раскладка — это ровно та часть, которую вы всё равно собирались менять.
Это примеры, а не компоненты.
Все 5 собраны из примитивов, которые есть во всех четырёх пакетах, поэтому каждая одинаково работает в React, Vue, Svelte и Angular. Ставить здесь нечего: откройте страницу, прочитайте композицию, скопируйте её.
CalloutList
Лента событий с уровнями важности, со встроенными состояниями загрузки и пустоты. Как и любой рецепт, на битых или отсутствующих данных рисует пустое состояние, а не падает.
◇ React◇ Vue◇ Svelte◇ Angular
ProgressCard
Карточка с прогресс-баром, который меняет цвет при переходе порога, и необязательным рядом действий. Значения зажимаются в 0–100.
◇ React◇ Vue◇ Svelte◇ Angular
FormDialog
Модальная форма с ловушкой фокуса и закрытием по Escape, на оверлее `[data-state]` из слоя анимаций.
◇ React◇ Vue◇ Svelte◇ Angular
CommandPalette
Поиск по командам на ⌘K — настоящий listbox с полной навигацией с клавиатуры.
◇ React◇ Vue◇ Svelte◇ Angular