@donkit-ai/design-system

Donkit Design System

Minimal design tokens and React components for Donkit products. Includes product skins data-variant=edgy and data-typography=editorial.

Install

npm install @donkit-ai/design-system

Usage

import '@donkit-ai/design-system/tokens.css';
// optional:
// import '@donkit-ai/design-system/light.css';
// import '@donkit-ai/design-system/high-contrast.css';

import { Button, Input, Card, LocaleProvider } from '@donkit-ai/design-system';

Package contents

Shared components + brand tokens.

Includes product skins: data-variant=edgy, data-typography=editorial (baked into tokens.css). The Atom package does not receive these.

Font contract

This package does not embed font binaries. Host loads webfonts (e.g. public/fonts/) and must match the families in CSS variables.

Role	CSS variable	Family	Files (host)
UI	--font-ui	Inter	(host-provided)
Mono	--font-mono	Fira Code	FiraCode-Variable.woff2

Host also owns product chrome (wordmark, favicon, platform_name) — not this package.

Font binaries are NOT in the package. Host loads fonts.files when self-hosting. data-variant=edgy and data-typography=editorial are supported product skins.

Locale

Chrome strings (Close, Loading, …) default to English. Override via LocaleProvider:

import { LocaleProvider } from '@donkit-ai/design-system';

<LocaleProvider strings={{ close: 'Закрыть', loading: 'Загрузка' }}>
  <App />
</LocaleProvider>

Appearance (optional)

import appearance from '@donkit-ai/design-system/appearance.json';
// { brand, themes, variants, typography, density, fonts }

brand	themes	variants	typography
donkit	light, high-contrast	edgy	editorial

Version

1.4.95 — dual-brand publish from one monorepo commit. Package contents = applicable surface for this brand only.