Библиотека
компонентов.
Визуальный язык новостной аналитики на основе публичной дизайн-системы Альфа-Банка. Общие токены и компоненты используются в приложении.
Основа
Публичная палитра Core: красный акцент, почти чёрный текст, белые и серые поверхности. Для статусов сохраняем текстовые подписи.
Цветовые токены
styles/alfa-tokens.cssТипографика
system-uiФакты, допущения и возможные последствия — в понятной последовательности.
Действия
Иерархия Core: красная accent, чёрная primary, серая secondary, контурная и текстовая кнопки.
Кнопки
UI/ButtonНажатие открывает боковую панель. В приложении сохранены прежние имена вариантов API; визуально они соответствуют Core.
Пиктограммы
react-iconly · lightИконка дополняет подпись; смысл действия не зависит от рисунка.
Ввод и выбор
Явные подписи, выбранное состояние и понятный фокус помогают работать с длинным аналитическим сценарием.
Фильтры
UI/FilterPillsВыбрано: Все
Переключатель
UI/ToggleПример локального состояния компонента
Поле ввода
UI/TextFieldВведите название события или компании
Десктоп: подпись внутри поля · мобильный: снаружи.
Состояния поля
UI/TextFieldУкажите период анализа
Данные и контент
Компоненты сохраняют различие между фактом, оценкой модели и позицией банка.
Статусы и метки
UI/BadgeАватар и идентичность
UI/AvatarКарточка
UI/CardРазбор событияОценка AI
Короткий вывод, затем основания и переход к подробностям. Для реального события здесь показываются подтверждённые источники.
Открыть лентуПоказатель
UI/StatCardЧисла на этой странице демонстрационные и не связаны с текущим каталогом.
Разделение оснований
UI/InfoBoxПозиция банка
Подтверждённая цитата из материала банка с указанием страницы.Оценка AI
Условное влияние на компанию с явными допущениями.Пары значений
UI/KeyValueList- Компания
- Обезличенный профиль
- Источник
- Открытая публикация
- Проверка
- На рассмотрении
Таблица
UI/DataTable| Слой | Что показывает | Статус |
|---|---|---|
| Факт | Сведения из источника | Проверен |
| Вывод | Возможное влияние на бизнес | Условно |
| Контекст | Данные со слов пользователя | Уточняется |
Состояния
Пустой результат, ожидание и необходимость проверки объясняют следующий шаг без потери контекста.
Измените фильтр или выберите другую компанию, чтобы продолжить поиск.
Готовим разбор
Показываем этап выполнения и сохраняем доступ к первоисточнику.
Нужна проверка
Недостаточно данных для точного числа. Условный сценарий остаётся доступным.
Требует контекстаSheet
Появляется справа, на телефоне — снизу. Закрывается кнопкой, Escape, нажатием вне панели или свайпом вниз.