snack-uikit

Контрибьюторы: Snack UIKit - это стандартный инструмент разработки интерфейсов в компании cloud.ru. С его помощью решаются самые широкие задачи: seo-ориентированный портал, админки любой сложности и внутренние инструменты.
Кастомизация: Библиотека компонентов имеет интеграцию с figma и стилизуется набором токенов, которые могут быть переопределены. Вы можете настроить тему под свои нужды.
Dark/Light: Поддержка темной и светлой модификации "из коробки".
Модульная публикация: Компоненты поставляются в формате отдельных npm-пакетов. Вы можете обновлять только то, что необходимо в данный момент, не беспокоясь за остальные части вашего проекта.
E2E тестирование: Компоненты проходят автоматические тесты в chrome и firefox
Совместимость со всеми браузерами:

Начать использовать Snack UIKit

Вы можете использовать шаблон приложения, в котором уже подключен Snack UIKit и настроена сборка.

Стилизация приложения на Snack UIKit основана на использовании классов

light

dark

из файла

@snack-uikit/figma-tokens/build/css/brand.module.css

. Классы содержат css-переменные со стилями для светлой и темной модификаций интерфейса соответственно.

Не используйте эти css-переменные напрямую. Как использовать токены темы читайте в описании пакета темы.

Для того чтоб подключить стили Snack UIKit в приложение, вам нужно:

Импортировать хук useThemeConfig
В хук передать мапу с ключами тем и соответсвующими стилевыми файлами
Из хука получить класс для темы, который нужно задать обёртке на верхнем уровне приложения.
- Менять тему можно с помощью функции changeTheme, возвращаемой из хука. Можно также положить её в контекст и передать вниз по реакт-дереву.

Development Team

- Трифонов Михаил, Ахременко Григорий, Белов Алексей, Ершов Никита, Козлова Анна, Хлупин Сергей, Белявский Илья

Design Team

- Малокостов Игорь, Алексеев Алексей