Пакет @gamesrc/core
Ядро системы: 142 компонента, слой токенов и утилиты. Устанавливается одной командой — npm i @gamesrc/core — и не тянет лишних зависимостей.
Game.SRC · Документация 4.2.0
Техническая документация
Справочник для разработчиков: API компонентов, структура токенов, правила интеграции и протоколы версионирования. Всё, что нужно, чтобы подключить систему к вашему продукту за один спринт.
Обновлено 14 марта 2025 · сборка 4.2.0-stable
Шаг 01 · Установка
Установка и настройка окружения
Минимальные требования: Node.js 18.17+, npm 9 или pnpm 8. Система публикуется в npm под scoped-пакетом @gamesrc/core и в реестре Figma Community под токеном-ключом gs-4.2.
Инициализация проекта
Скрипт npx gamesrc init создаёт каталог src/design-system/, подключает провайдер токенов и генерирует конфигурацию под ваш фреймворк.
Подключение токенов
Токены выгружаются в CSS-переменные и JSON. Файл tokens.css подключается до приложения, чтобы семантические значения были доступны во всех слоях.
Шаг 02 · Структура
Структура каталога и файлов
Система разбита на четыре изолированных слоя. Каждый слой версионируется отдельно, поэтому правка токенов не затрагивает компоненты, а паттерны — не ломают карточки.
/tokens
Слой фундаментальных значений: цвет, типографика, пространство, глубина, радиус. Файлы color.json, type.json, space.json — источник правды.
/components
Атомарные модули: Card, Button, Form, Modal. Каждый компонент — папка с index.ts, styles.css и тестами.
/patterns
Сценарные экраны: онбординг, чек-аут, дашборд активов. Собираются из компонентов и не переопределяют их стили.
/presets
Готовые пресеты брендов: lux, banking, retail. Переключаются переменной data-gs-preset без пересборки.
/docs
Исходники этой страницы: MDX-файлы, сгенерированные из JSDoc-комментариев компонентов. Обновляются при каждой сборке.
/changelog
Полная история версий и breaking changes. Файл CHANGELOG.md синхронизирован с тегов npm и релизами Figma-библиотеки.
Справочник
API компонентов
Каждый компонент описан типами, пропсами и вариантами. Ниже — ключевые модули и их сигнатуры. Полный список — в @gamesrc/core/dist/types.d.ts.
<Button>
Пропсы: variant (primary | ghost | on-dark), size (sm | md | lg), loading, disabled. Рендерит button с фокус-кольцом 4px.
<Card>
Слоты: header, body, footer. Пропсы: tone (neutral | accent), elevation (sm | md), interactive. Поддерживает hover-подъём.
<Form>
Компоненты полей: Field, Input, Select, Textarea. Валидация через validate() и onSubmit. Ошибки — через aria-describedby.
<Modal>
Пропсы: open, onClose, trap (focus trap), size (sm | md | full). Автоматически блокирует скролл и возвращает фокус триггеру.
<Badge>
Пропсы: tone (neutral | accent | ink), dot (live-индикатор), count. Используется в статусах и счётчиках активов.
<Tabs>
Пропсы: orientation (horizontal | vertical), controlled, onChange. Клавиатурная навигация стрелками, role="tablist" из коробки.
Протоколы
Версионирование
Мы придерживаемся SemVer для каждого слоя. Токены, компоненты и паттерны имеют собственные номера, поэтому вы фиксируете ровно те уровни, которые протестировали.
4.2.0текущая стабильная сборка
MAJORbreaking: смена токенов/примитивов
MINORновые компоненты, без изменений API
PATCHисправления стилей и доступности
Фиксация версий
Закрепляйте точные версии в package.json ("@gamesrc/core": "4.2.0"). Автоматические ^-обновления допустимы только для PATCH.
Каналы релизов
Три канала: stable (4.2.0), beta (4.3.0-beta.2) и canary. Бета-сборки публикуются еженедельно по средам.
Политика поддержки
Поддерживаются две последние MAJOR-версии. Текущий цикл: 4.x (до марта 2026) и 3.x (до марта 2025). Уведомление о конце поддержки — за 90 дней.
Вопросы
Интеграция: частые вопросы
Коротко о совместимости, лицензиях и поддержке.
Компоненты поставляются для React, Vue, Svelte и как нативный Web-компонент. Токены доступны в формате CSS-переменных, Figma-токенов и JSON для автоматической генерации.
Да. На этапе онбординга мы пересобираем слой токенов под ваши цвета, типографику и пространственную сетку — без изменения архитектуры компонентов. Пресет сохраняется в /presets и версионируется отдельно.
Лицензия привязана к команде, а не к продукту. Одна подписка покрывает все продукты вашей компании и включает обновления токенов и компонентов. Коммерческое использование разрешено без атрибуции.
В каждый тариф входит доступ к архитектору интерфейсов, ревью новых экранов и квартальные сессии по эволюции системы. Для тарифа «Атelier» — выделенная команда и SLA на ответ в 4 часа.
Готовы подключить Game.SRC к вашему продукту?
Запланируйте 30-минутную техническую сессию. Покажем, как токены, компоненты и протоколы версионирования работают на реальном проекте.