1. Foundations
Фактические значения, на которых построен интерфейс: цвет, размер, радиус, тень и типографика.
Chatballs UI inventory
Дизайн-система текущего фронтенда
Статический справочник существующих токенов, компонентов, паттернов и компоновок Chatballs. Примеры повторяют действующие CSS-классы и визуальные решения из apps/internal-ui/src.
Назначение: перед разработкой нового интерфейса открыть нужный раздел, найти существующий элемент и использовать его как эталон. Каталог ничего не меняет в приложении и не требует React.
Разделы
От базовых значений до компоновки целых экранов.
Токены
Цвета, типографика, радиусы, тени, интервалы и размеры controls.
Открыть foundations →Компоненты
Кнопки, ссылки, поля, селекты, переключатели, вкладки и пагинация.
Открыть components →Данные и статусы
Бейджи, статусы, продукты, каналы, аватары, метрики и иконки.
Открыть data display →Паттерны
Таблицы, фильтры, карточки, состояния, меню и decision dialogs.
Открыть patterns →Макеты страниц
Shell, list page, detail page, settings и conversation workspace.
Открыть layouts →Инвентарь
Поисковый реестр компонентов, CSS-паттернов, токенов и исходников.
Открыть inventory →Уровни системы
Как читать и использовать каталог.
2. Components
Переиспользуемые элементы из src/shared и их состояния.
3. Patterns
Устоявшиеся композиции: таблица с фильтрами, карточка, форма, диалог.
4. Layouts
Каркас целой страницы или рабочего пространства из существующих частей.
Основные источники
Файлы фронтенда, по которым собран этот справочник.