mbt-ui-kit 0.1.0

package/README.md

@@ -0,0 +1,160 @@
+# MBT UI Kit
+
+React компонентная библиотека со стилями на SCSS для Electron приложений.
+
+## Установка
+
+```bash
+npm install mbt-ui-kit
+# или
+bun install mbt-ui-kit
+```
+
+## Использование
+
+```tsx
+import { Button, Input } from "mbt-ui-kit";
+import "mbt-ui-kit/styles";
+
+function App() {
+  return (
+    <div>
+      <Input label="Email" placeholder="Введите email" showSearchIcon />
+      <Button>Отправить</Button>
+    </div>
+  );
+}
+```
+
+## Компоненты
+
+### Button
+Кнопка с тремя состояниями: default, hover, disabled.
+
+```tsx
+<Button>Start</Button>
+<Button disabled>Start</Button>
+<Button fullWidth>Start</Button>
+```
+
+### Input
+Текстовое поле с label и опциональной иконкой.
+
+```tsx
+<Input label="Label" placeholder="text_input" showSearchIcon />
+<Input label="Label" placeholder="text_input" muted />
+<Input placeholder="text_input" fullWidth />
+```
+
+### Typography
+Компоненты для заголовков, текста и метрик.
+
+```tsx
+<Heading level={1}>Main Title</Heading>
+<Text>Regular text</Text>
+<Text strong>Strong text</Text>
+<Metric large>1,234</Metric>
+```
+
+### MenuButton
+Кнопка для боковых меню с иконкой и текстом.
+
+```tsx
+<MenuButton>Training</MenuButton>
+<MenuButton selected>Training</MenuButton>
+<MenuButton small>Training</MenuButton>
+```
+
+## Разработка
+
+```bash
+# Установка зависимостей
+bun install
+
+# Запуск Storybook
+bun storybook
+
+# Сборка библиотеки
+bun run build
+
+# Линтинг и форматирование
+bun run lint
+bun run format
+```
+
+## Дизайн-токены
+
+Токены дизайн-системы доступны в трёх форматах для максимальной гибкости.
+
+### 1. TypeScript/JavaScript
+
+Импорт только токенов (без компонентов и стилей):
+```tsx
+import { tokens, colors, spacing, radius } from "mbt-ui-kit/tokens";
+
+const MyComponent = () => (
+  <div style={{ 
+    backgroundColor: colors.primary,
+    padding: spacing[4],
+    borderRadius: radius.sm 
+  }}>
+    Content
+  </div>
+);
+```
+
+Или из основного пакета:
+```tsx
+import { colors, spacing, fontSizes } from "mbt-ui-kit";
+```
+
+Доступные токены:
+- `colors` — цветовая палитра
+- `fonts` — семейства шрифтов
+- `fontSizes` — размеры текста
+- `fontWeights` — начертания шрифтов
+- `spacing` — отступы и размеры
+- `radius` — радиусы скругления
+- `zIndex` — z-индексы
+- `transitions` — анимации
+
+### 2. CSS Custom Properties
+
+Импорт CSS переменных:
+```tsx
+import "mbt-ui-kit/tokens.css";
+```
+
+Использование в CSS/SCSS:
+```css
+.my-class {
+  background-color: var(--mbt-color-primary);
+  padding: var(--mbt-space-4);
+  border-radius: var(--mbt-radius-sm);
+  font-family: var(--mbt-font-primary);
+  transition: all var(--mbt-transition-fast);
+}
+```
+
+Все переменные имеют префикс `--mbt-` для избежания конфликтов.
+
+### 3. SCSS Variables (для расширения библиотеки)
+
+```scss
+@use "mbt-ui-kit/src/styles/tokens" as *;
+
+.my-class {
+  background-color: $primary;
+  padding: $space-4;
+  border-radius: $radius-sm;
+  font-family: $font-ui-primary;
+}
+```
+
+## TypeScript
+
+Библиотека полностью типизирована с подробными JSDoc комментариями.
+
+## Лицензия
+
+MIT

package/dist/components/button/button.d.ts

@@ -0,0 +1,54 @@
+import type { ButtonHTMLAttributes, ReactNode } from "react";
+/**
+ * Button component props
+ *
+ * Расширяет стандартные HTML button атрибуты с дополнительными кастомными свойствами.
+ */
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Содержимое кнопки (текст, иконки, элементы)
+     *
+     * @example
+     * ```tsx
+     * <Button>Start</Button>
+     * <Button><Icon /> Start</Button>
+     * ```
+     */
+    children?: ReactNode;
+    /**
+     * Растягивает кнопку на всю ширину контейнера
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <Button fullWidth>Full Width Button</Button>
+     * ```
+     */
+    fullWidth?: boolean;
+}
+/**
+ * Button — компонент кнопки с тремя состояниями (default, hover, disabled)
+ *
+ * Дизайн с диагональными закруглениями (top-right и bottom-left).
+ * Шрифт: IBM Plex Sans Medium, 16px, uppercase.
+ *
+ * @component
+ *
+ * @example
+ * ```tsx
+ * // Обычная кнопка
+ * <Button>Start</Button>
+ *
+ * // Отключенная кнопка
+ * <Button disabled>Start</Button>
+ *
+ * // Кнопка на всю ширину
+ * <Button fullWidth>Start</Button>
+ *
+ * // С обработчиком клика
+ * <Button onClick={() => console.log('Clicked!')}>Click Me</Button>
+ * ```
+ */
+export declare function Button({ children, fullWidth, disabled, className, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=button.d.ts.map

package/dist/components/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D;;;;GAIG;AACH,MAAM,WAAW,WAAY,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC1E;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,WAAW,2CAeb"}

package/dist/components/button/index.d.ts

@@ -0,0 +1,3 @@
+export { Button } from "./button";
+export type { ButtonProps } from "./button";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/input/SearchIcon.d.ts

@@ -0,0 +1,26 @@
+/**
+ * SearchIcon component props
+ */
+interface SearchIconProps {
+    /**
+     * CSS класс для кастомизации стилей
+     */
+    className?: string;
+}
+/**
+ * SearchIcon — SVG иконка поиска (лупа)
+ *
+ * Размер: 24x24px.
+ * Цвет наследуется через `currentColor`.
+ *
+ * @component
+ *
+ * @example
+ * ```tsx
+ * <SearchIcon />
+ * <SearchIcon className="custom-class" />
+ * ```
+ */
+export declare function SearchIcon({ className }: SearchIconProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SearchIcon.d.ts.map

package/dist/components/input/SearchIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchIcon.d.ts","sourceRoot":"","sources":["../../../src/components/input/SearchIcon.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,UAAU,eAAe;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE,eAAe,2CA4BxD"}

package/dist/components/input/index.d.ts

@@ -0,0 +1,4 @@
+export { Input } from "./input";
+export type { InputProps } from "./input";
+export { SearchIcon } from "./SearchIcon";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/input/input.d.ts

@@ -0,0 +1,100 @@
+import type { InputHTMLAttributes, ReactNode } from "react";
+/**
+ * Input component props
+ *
+ * Расширяет стандартные HTML input атрибуты с дополнительными кастомными свойствами.
+ * Свойство `size` исключено, чтобы избежать конфликтов со стилями.
+ */
+export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+    /**
+     * Текст label над полем ввода
+     *
+     * @example
+     * ```tsx
+     * <Input label="Email" placeholder="example@mail.com" />
+     * ```
+     */
+    label?: string;
+    /**
+     * Приглушённое состояние (серый цвет текста и бордера)
+     *
+     * Используется для disabled или визуально неактивных полей.
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <Input label="Label" muted />
+     * ```
+     */
+    muted?: boolean;
+    /**
+     * Показывать встроенную иконку поиска справа
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <Input placeholder="Search..." showSearchIcon />
+     * ```
+     */
+    showSearchIcon?: boolean;
+    /**
+     * Кастомная иконка для отображения справа
+     *
+     * Переопределяет `showSearchIcon` если указана.
+     *
+     * @example
+     * ```tsx
+     * <Input icon={<CustomIcon />} />
+     * ```
+     */
+    icon?: ReactNode;
+    /**
+     * Растягивает input на всю ширину контейнера
+     *
+     * По умолчанию максимальная ширина 296px.
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <Input fullWidth placeholder="Full width input" />
+     * ```
+     */
+    fullWidth?: boolean;
+}
+/**
+ * Input — компонент текстового поля с label и опциональной иконкой
+ *
+ * Поддерживает два визуальных состояния: обычный (светлый) и muted (серый).
+ * Шрифт: Inter Regular, 16px.
+ * Border radius: 8px.
+ *
+ * @component
+ *
+ * @example
+ * ```tsx
+ * // С label и иконкой поиска
+ * <Input label="Search" placeholder="text_input" showSearchIcon />
+ *
+ * // Приглушённое состояние
+ * <Input label="Disabled field" muted disabled />
+ *
+ * // Без label, с кастомной иконкой
+ * <Input placeholder="Custom" icon={<MyIcon />} />
+ *
+ * // На всю ширину
+ * <Input label="Email" fullWidth />
+ *
+ * // С обработчиками
+ * <Input
+ *   label="Name"
+ *   value={value}
+ *   onChange={(e) => setValue(e.target.value)}
+ *   onFocus={() => console.log('Focused')}
+ * />
+ * ```
+ */
+export declare function Input({ label, muted, showSearchIcon, icon, fullWidth, className, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=input.d.ts.map

package/dist/components/input/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5D;;;;;GAKG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC3D;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;;;;OAWG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;;;;;;OASG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;;;;;;;;OAWG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,KAAa,EACb,cAAsB,EACtB,IAAI,EACJ,SAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,UAAU,2CAkDZ"}

package/dist/components/menu-button/GraduationCapIcon.d.ts

@@ -0,0 +1,6 @@
+interface GraduationCapIconProps {
+    className?: string;
+}
+export declare function GraduationCapIcon({ className }: GraduationCapIconProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=GraduationCapIcon.d.ts.map

package/dist/components/menu-button/GraduationCapIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraduationCapIcon.d.ts","sourceRoot":"","sources":["../../../src/components/menu-button/GraduationCapIcon.tsx"],"names":[],"mappings":"AAAA,UAAU,sBAAsB;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,SAAS,EAAE,EAAE,sBAAsB,2CA0BtE"}

package/dist/components/menu-button/index.d.ts

@@ -0,0 +1,4 @@
+export { MenuButton } from "./menu-button";
+export type { MenuButtonProps } from "./menu-button";
+export { GraduationCapIcon } from "./GraduationCapIcon";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/menu-button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/menu-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/menu-button/menu-button.d.ts

@@ -0,0 +1,63 @@
+import type { ButtonHTMLAttributes, ReactNode } from "react";
+/**
+ * MenuButton component props
+ *
+ * Расширяет стандартные HTML button атрибуты с дополнительными кастомными свойствами.
+ */
+export interface MenuButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Содержимое кнопки (текст)
+     */
+    children?: ReactNode;
+    /**
+     * Иконка слева от текста
+     *
+     * @default <GraduationCapIcon />
+     *
+     * @example
+     * ```tsx
+     * <MenuButton icon={<CustomIcon />}>Training</MenuButton>
+     * ```
+     */
+    icon?: ReactNode;
+    /**
+     * Активное/выбранное состояние кнопки
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <MenuButton selected>Training</MenuButton>
+     * ```
+     */
+    selected?: boolean;
+    /**
+     * Компактный размер кнопки (12px текст, 16px иконка)
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * <MenuButton small>Training</MenuButton>
+     * ```
+     */
+    small?: boolean;
+}
+/**
+ * MenuButton — кнопка для боковых меню с иконкой и текстом
+ *
+ * Поддерживает три визуальных состояния: default, hover (с фоном), selected (активное).
+ * Иконка и текст меняют цвет в зависимости от состояния.
+ *
+ * @props
+ * @icon {ReactNode} Иконка слева от текста
+ * @selected {boolean} Активное/выбранное состояние кнопки
+ * @small {boolean} Компактный размер кнопки
+ *
+ * @example
+ * ```tsx
+ * <MenuButton>Training</MenuButton>
+ * ```
+ */
+export declare function MenuButton({ children, icon, selected, small, disabled, className, ...props }: MenuButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=menu-button.d.ts.map

package/dist/components/menu-button/menu-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-button.d.ts","sourceRoot":"","sources":["../../../src/components/menu-button/menu-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7D;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC9E;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,IAAI,EACJ,QAAgB,EAChB,KAAa,EACb,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,2CAwBjB"}

package/dist/components/typography/Heading.d.ts

@@ -0,0 +1,34 @@
+import type { HTMLAttributes, ReactNode } from "react";
+/**
+ * Heading component props
+ */
+export interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
+    /**
+     * Уровень заголовка
+     *
+     * @example
+     * ```tsx
+     * <Heading level={1}>Main Title</Heading>
+     * ```
+     */
+    level: 1 | 2 | 3 | 4 | 5;
+    /**
+     * Содержимое заголовка
+     */
+    children?: ReactNode;
+}
+/**
+ * Heading — компонент заголовков с 5 уровнями
+ *
+ * Использует IBM Plex Sans с правильными размерами из дизайн-системы.
+ *
+ * @props
+ * @level {1 | 2 | 3 | 4 | 5} Уровень заголовка
+ *
+ * @example
+ * ```tsx
+ * <Heading level={1}>Main Title</Heading>
+ * ```
+ */
+export declare function Heading({ level, children, className, ...props }: HeadingProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Heading.d.ts.map

package/dist/components/typography/Heading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/typography/Heading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD;;GAEG;AACH,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,kBAAkB,CAAC;IACtE;;;;;;;OAOG;IACH,KAAK,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAEzB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,YAAY,2CASd"}

package/dist/components/typography/Metric.d.ts

@@ -0,0 +1,50 @@
+import type { HTMLAttributes, ReactNode } from "react";
+/**
+ * Metric component props
+ */
+export interface MetricProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Содержимое метрики
+     */
+    children?: ReactNode;
+    /**
+     * Крупный размер (24px)
+     *
+     * @default false
+     */
+    large?: boolean;
+    /**
+     * Приглушённый цвет
+     *
+     * @default false
+     */
+    muted?: boolean;
+    /**
+     * HTML элемент для рендера
+     *
+     * @default "div"
+     *
+     * @example
+     * ```tsx
+     * <Metric as="span" large>42</Metric>
+     * ```
+     */
+    as?: "div" | "span" | "p";
+}
+/**
+ * Metric — компонент для отображения метрик и числовых значений
+ *
+ * Использует IBM Plex Mono в двух размерах (16px и 24px).
+ *
+ * @props
+ * @large {boolean} Крупный размер (24px)
+ * @muted {boolean} Приглушённый цвет
+ * @as {string} HTML элемент для рендера
+ *
+ * @example
+ * ```tsx
+ * <Metric large>1,234</Metric>
+ * ```
+ */
+export declare function Metric({ children, large, muted, as, className, ...props }: MetricProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Metric.d.ts.map

package/dist/components/typography/Metric.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Metric.d.ts","sourceRoot":"","sources":["../../../src/components/typography/Metric.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,cAAc,CAAC;IACjE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;;;;;;OASG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,GAAG,CAAC;CAC3B;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,KAAa,EACb,KAAa,EACb,EAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,WAAW,2CAgBb"}

package/dist/components/typography/Text.d.ts

@@ -0,0 +1,64 @@
+import type { HTMLAttributes, ReactNode } from "react";
+/**
+ * Text component props
+ */
+export interface TextProps extends HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * Содержимое текста
+     */
+    children?: ReactNode;
+    /**
+     * Усиленное начертание (medium weight)
+     *
+     * @default false
+     */
+    strong?: boolean;
+    /**
+     * Мелкий текст (12px)
+     *
+     * @default false
+     */
+    small?: boolean;
+    /**
+     * Стиль label (12px, uppercase)
+     *
+     * @default false
+     */
+    label?: boolean;
+    /**
+     * Приглушённый цвет
+     *
+     * @default false
+     */
+    muted?: boolean;
+    /**
+     * HTML элемент для рендера
+     *
+     * @default "p"
+     *
+     * @example
+     * ```tsx
+     * <Text as="span">Inline text</Text>
+     * ```
+     */
+    as?: "p" | "span" | "div";
+}
+/**
+ * Text — компонент для основного текста
+ *
+ * Использует Inter с поддержкой вариаций (strong, small, label).
+ *
+ * @props
+ * @strong {boolean} Усиленное начертание (medium weight)
+ * @small {boolean} Мелкий текст (12px)
+ * @label {boolean} Стиль label (12px, uppercase)
+ * @muted {boolean} Приглушённый цвет
+ * @as {string} HTML элемент для рендера
+ *
+ * @example
+ * ```tsx
+ * <Text>Regular text</Text>
+ * ```
+ */
+export declare function Text({ children, strong, small, label, muted, as, className, ...props }: TextProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Text.d.ts.map

package/dist/components/typography/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../src/components/typography/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,oBAAoB,CAAC;IACrE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;;;;;;OASG;IACH,EAAE,CAAC,EAAE,GAAG,GAAG,MAAM,GAAG,KAAK,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,MAAc,EACd,KAAa,EACb,KAAa,EACb,KAAa,EACb,EAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,SAAS,2CAkBX"}

package/dist/components/typography/index.d.ts

@@ -0,0 +1,7 @@
+export { Heading } from "./Heading";
+export type { HeadingProps } from "./Heading";
+export { Text } from "./Text";
+export type { TextProps } from "./Text";
+export { Metric } from "./Metric";
+export type { MetricProps } from "./Metric";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/typography/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/typography/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./tokens-Bab0xxwT.cjs"),t=require("react/jsx-runtime");function j({children:n,fullWidth:e,disabled:s,className:o,...i}){const r=["mbt-button",e&&"mbt-button--full-width",s&&"mbt-button--disabled",o].filter(Boolean).join(" ");return t.jsx("button",{type:"button",className:r,disabled:s,...i,children:n})}function b({className:n}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,children:[t.jsx("circle",{cx:"10.5",cy:"10.5",r:"6.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M15 15L19 19",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}function h({label:n,muted:e=!1,showSearchIcon:s=!1,icon:o,fullWidth:i=!1,className:r,...l}){const c=["mbt-input",i&&"mbt-input--full-width",r].filter(Boolean).join(" "),u=["mbt-input__label",e&&"mbt-input__label--muted"].filter(Boolean).join(" "),m=["mbt-input__wrapper",e&&"mbt-input__wrapper--muted"].filter(Boolean).join(" "),p=["mbt-input__field",e&&"mbt-input__field--muted"].filter(Boolean).join(" "),x=["mbt-input__icon",e&&"mbt-input__icon--muted"].filter(Boolean).join(" "),d=o||s&&t.jsx(b,{});return t.jsx("div",{className:c,children:t.jsxs("div",{className:"mbt-input__container",children:[n&&t.jsx("label",{className:u,children:n}),t.jsxs("div",{className:m,children:[t.jsx("input",{type:"text",className:p,...l}),d&&t.jsx("div",{className:x,children:d})]})]})})}function _({level:n,children:e,className:s,...o}){const i=`h${n}`,r=[`mbt-h${n}`,s].filter(Boolean).join(" ");return t.jsx(i,{className:r,...o,children:e})}function g({children:n,strong:e=!1,small:s=!1,label:o=!1,muted:i=!1,as:r="p",className:l,...c}){const u=r,m=["mbt-text",e&&"mbt-text--strong",s&&"mbt-text--small",o&&"mbt-text--label",i&&"mbt-text--muted",l].filter(Boolean).join(" ");return t.jsx(u,{className:m,...c,children:n})}function k({children:n,large:e=!1,muted:s=!1,as:o="div",className:i,...r}){const l=o,c=["mbt-metric",e&&"mbt-metric--large",s&&"mbt-metric--muted",i].filter(Boolean).join(" ");return t.jsx(l,{className:c,...r,children:n})}function f({className:n}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,children:[t.jsx("path",{d:"M2 9L12 4L22 9L12 14L2 9Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M6 11V16L12 19L18 16V11",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}function N({children:n,icon:e,selected:s=!1,small:o=!1,disabled:i,className:r,...l}){const c=["mbt-menu-button",s&&"mbt-menu-button--selected",o&&"mbt-menu-button--small",r].filter(Boolean).join(" "),u=e??t.jsx(f,{});return t.jsxs("button",{type:"button",className:c,disabled:i,"aria-pressed":s,...l,children:[t.jsx("div",{className:"mbt-menu-button__icon",children:u}),t.jsx("span",{className:"mbt-menu-button__text",children:n})]})}exports.colors=a.colors;exports.fontSizes=a.fontSizes;exports.fontWeights=a.fontWeights;exports.fonts=a.fonts;exports.radius=a.radius;exports.spacing=a.spacing;exports.tokens=a.tokens;exports.transitions=a.transitions;exports.zIndex=a.zIndex;exports.Button=j;exports.GraduationCapIcon=f;exports.Heading=_;exports.Input=h;exports.MenuButton=N;exports.Metric=k;exports.SearchIcon=b;exports.Text=g;

package/dist/index.d.ts

@@ -0,0 +1,14 @@
+import "./styles/index.scss";
+export { tokens, colors, fonts, fontSizes, fontWeights, spacing, radius, zIndex, transitions } from "./styles/tokens";
+export type { Color, Font, FontSize, FontWeight, Spacing, Radius, ZIndex, Transition } from "./styles/tokens";
+export { Button } from "./components/button";
+export type { ButtonProps } from "./components/button";
+export { Input } from "./components/input";
+export type { InputProps } from "./components/input";
+export { SearchIcon } from "./components/input";
+export { Heading, Text, Metric } from "./components/typography";
+export type { HeadingProps, TextProps, MetricProps, } from "./components/typography";
+export { MenuButton } from "./components/menu-button";
+export type { MenuButtonProps } from "./components/menu-button";
+export { GraduationCapIcon } from "./components/menu-button";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,qBAAqB,CAAC;AAG7B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACtH,YAAY,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAG9G,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,YAAY,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAEvD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,YAAY,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEhD,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAChE,YAAY,EACV,YAAY,EACZ,SAAS,EACT,WAAW,GACZ,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC"}