@phpsoftbox/react-softbox 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 PhpSoftBox
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,271 @@
+# ReactSoftBox
+
+Минимальный набор UI‑компонентов для админки PhpSoftBox.
+
+## Подключение
+
+```ts
+import '@phpsoftbox/react-softbox/foundations/index.css';
+```
+
+```ts
+import { Alert, Badge, Breadcrumbs, Button, Card, CollapseButton, Drawer, Dropdown, FloatLabel, FormField, Grid, Heading, Input, Menu, Modal, Notifier, Pagination, Progress, Radio, Row, Select, Stack, Switch, Tabs, Text, Textarea } from '@phpsoftbox/react-softbox';
+```
+
+## Тема
+
+```ts
+import { initTheme, setThemeMode } from '@phpsoftbox/react-softbox';
+
+initTheme({ defaultMode: 'system' });
+setThemeMode('dark');
+```
+
+## Документация
+
+- `docs/README.md`
+- `docs/layout.md`
+- `docs/navigation.md`
+- `docs/forms.md`
+- `docs/overlays.md`
+- `docs/feedback.md`
+- `docs/card.md`
+- `docs/typography.md`
+- `docs/theme.md`
+- `docs/pagination.md`
+- `docs/tabs.md`
+- `docs/progress.md`
+- `docs/breadcrumbs.md`
+
+## Playground
+
+Локальная площадка для проверки компонентов:
+
+```bash
+cd packages-js/ReactSoftBox/playground
+yarn install
+yarn dev --host 0.0.0.0 --port 5174
+```
+
+## Сборка пакета
+
+```bash
+yarn install
+yarn build
+```
+
+## Краткий обзор компонентов
+
+### Button
+
+```tsx
+<Button variant="primary">Primary</Button>
+<Button variant="info" appearance="outline">Info</Button>
+<Button variant="danger" appearance="ghost">Danger</Button>
+```
+
+### Input / FloatLabel
+
+```tsx
+<Input>
+  <Input.Label>Email</Input.Label>
+  <Input.Field type="email" name="email" />
+</Input>
+
+<Input>
+  <Input.FloatLabel label="Password">
+    <Input.Field type="password" name="password" />
+  </Input.FloatLabel>
+</Input>
+```
+
+### Textarea / Radio
+
+```tsx
+<Textarea placeholder="Комментарий" />
+<Radio name="mode" label="Основной" />
+```
+
+### Switch
+
+```tsx
+<Switch label="Автообновления" defaultChecked />
+```
+
+### Select
+
+```tsx
+<Select label="Окружение" options={[{ value: 'dev', label: 'Development' }]} />
+<Select label="Сервисы" options={options} multiple searchable />
+```
+
+### Grid / Flex
+
+```tsx
+<Grid columns={12} columnsLg={8} columnsMd={4} columnsSm={1} gap="16px">
+  <div>One</div>
+  <div>Two</div>
+  <div>Three</div>
+</Grid>
+
+<Row gap="12px">
+  <div>A</div>
+  <div>B</div>
+</Row>
+
+<Stack gap="12px">
+  <div>Item</div>
+  <div>Item</div>
+</Stack>
+```
+
+### Menu / Dropdown
+
+```tsx
+const items = [
+  { label: 'Главная', href: '/', active: true },
+  { label: 'Документы', href: '#' },
+  { divider: true },
+  { label: 'Настройки', href: '#' },
+];
+
+<Menu items={items} />
+<Menu items={items} orientation="horizontal" />
+
+<Dropdown trigger={<span>Открыть</span>} items={items} orientation="vertical" />
+
+// Dropdown внутри горизонтального меню
+const topMenu = [
+  { label: 'Главная', href: '/' },
+  { label: 'Команда', children: [{ label: 'Участники' }, { label: 'Роли' }] },
+];
+<Menu items={topMenu} orientation="horizontal" />
+```
+
+### Collapsible Menu
+
+```tsx
+const collapsible = [
+  {
+    label: 'Сервисы',
+    open: true,
+    children: [
+      { label: 'Database' },
+      { label: 'Cache' },
+    ],
+  },
+];
+
+<Menu items={collapsible} />
+```
+
+### Badge
+
+```tsx
+<Badge>Default</Badge>
+<Badge variant="primary">Primary</Badge>
+<Badge variant="info">Info</Badge>
+<Badge variant="success">Success</Badge>
+<Badge variant="warning">Warning</Badge>
+<Badge variant="danger">Danger</Badge>
+```
+
+### Typography
+
+```tsx
+<Heading level={2}>Заголовок</Heading>
+<Text muted>Подпись</Text>
+<Text code>npm run dev</Text>
+```
+
+### Alert
+
+```tsx
+<Alert title="Info">Синхронизация завершится через 3 минуты.</Alert>
+<Alert variant="danger" title="Ошибка" onClose={() => {}}>
+  Ошибка доступа к сервису хранения.
+</Alert>
+```
+
+### Notifier
+
+```tsx
+<Notifier items={items} onDismiss={(id) => remove(id)} />
+```
+
+### Card
+
+```tsx
+<Card>
+  <Card.Header title="Заголовок" right={<Button appearance="ghost">...</Button>} />
+  <Card.Body>
+    Контент карточки
+  </Card.Body>
+  <Card.Footer>
+    <Button appearance="ghost">Отмена</Button>
+    <Button>Сохранить</Button>
+  </Card.Footer>
+</Card>
+```
+
+### CollapseButton
+
+```tsx
+<CollapseButton targetId="filters-panel" open={open} onClick={() => setOpen((prev) => !prev)}>
+  Фильтры
+</CollapseButton>
+```
+
+### Breadcrumbs
+
+```tsx
+<Breadcrumbs
+  items={[
+    { label: 'Главная', href: '/' },
+    { label: 'Проекты', href: '#' },
+    { label: 'Project', current: true },
+  ]}
+/>
+```
+
+### Tabs
+
+```tsx
+const items = [
+  { id: 'overview', label: 'Обзор', content: 'Основная информация' },
+  { id: 'metrics', label: 'Метрики', content: 'Показатели' },
+];
+
+<Tabs items={items} />
+```
+
+### Progress
+
+```tsx
+<Progress value={72} label="Сборка" variant="primary" />
+<Progress label="Синхронизация" indeterminate />
+```
+
+### Pagination
+
+```tsx
+<Pagination meta={pagination.meta} links={pagination.links} onNavigate={(page) => setPage(page)} />
+```
+
+### Modal / Drawer
+
+```tsx
+<Modal open={open} title="Новый релиз" onClose={() => setOpen(false)}>
+  Контент модалки
+</Modal>
+
+<Drawer open={open} title="Меню" onClose={() => setOpen(false)}>
+  Контент шторки
+</Drawer>
+```
+
+## Базовые состояния
+
+- `Button`: hover, focus-visible, active, disabled
+- `Input`: focus, error, placeholder, disabled
+- `Menu`: hover, active, disabled, divider, keyboard arrows

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { UiVariant } from '../../types';
+export type AlertVariant = UiVariant;
+type Props = React.HTMLAttributes<HTMLDivElement> & {
+    variant?: AlertVariant;
+    title?: React.ReactNode;
+    actions?: React.ReactNode;
+    onClose?: () => void;
+};
+export default function Alert({ variant, title, actions, onClose, className, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Alert/Alert.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Alert.module.css';
+const classMap = {
+    default: styles.default,
+    primary: styles.primary,
+    info: styles.info,
+    success: styles.success,
+    warning: styles.warning,
+    danger: styles.danger,
+};
+export default function Alert({ variant = 'info', title, actions, onClose, className, children, ...props }) {
+    const classes = [styles.alert, classMap[variant], className].filter(Boolean).join(' ');
+    return (_jsxs("div", { className: classes, role: "status", ...props, children: [_jsxs("div", { className: styles.main, children: [title ? _jsx("div", { className: styles.title, children: title }) : null, children ? _jsx("div", { className: styles.message, children: children }) : null, actions ? _jsx("div", { className: styles.actions, children: actions }) : null] }), onClose ? (_jsx("button", { type: "button", className: styles.close, onClick: onClose, "aria-label": "\u0417\u0430\u043A\u0440\u044B\u0442\u044C", children: "\u00D7" })) : null] }));
+}
+//# sourceMappingURL=Alert.js.map

package/dist/components/Alert/Alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,oBAAoB,CAAC;AAYxC,MAAM,QAAQ,GAAiC;IAC7C,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM;CACtB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAS;IAC/G,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEvF,OAAO,CACL,eAAK,SAAS,EAAE,OAAO,EAAE,IAAI,EAAC,QAAQ,KAAK,KAAK,aAC9C,eAAK,SAAS,EAAE,MAAM,CAAC,IAAI,aACxB,KAAK,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAO,CAAC,CAAC,CAAC,IAAI,EAC1D,QAAQ,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YAAG,QAAQ,GAAO,CAAC,CAAC,CAAC,IAAI,EAClE,OAAO,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YAAG,OAAO,GAAO,CAAC,CAAC,CAAC,IAAI,IAC7D,EACL,OAAO,CAAC,CAAC,CAAC,CACT,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,gBAAa,4CAAS,uBAE5E,CACV,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/components/Alert/Alert.module.css

@@ -0,0 +1,73 @@
+.alert {
+  display: flex;
+  gap: var(--spacing-4);
+  align-items: flex-start;
+  padding: var(--spacing-4);
+  border-radius: var(--radius-md);
+  border: 1px solid transparent;
+  background: var(--surface-panel-soft);
+  color: var(--color-text);
+}
+
+.main {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2);
+  flex: 1;
+  min-width: 0;
+}
+
+.title {
+  font-weight: 600;
+  font-size: 15px;
+}
+
+.message {
+  font-size: 14px;
+  color: var(--color-muted);
+}
+
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-2);
+}
+
+.close {
+  border: none;
+  background: transparent;
+  color: var(--color-muted);
+  font-size: 20px;
+  cursor: pointer;
+  line-height: 1;
+}
+
+.default {
+  border-color: rgba(30, 51, 85, 0.6);
+  box-shadow: 0 0 0 1px rgba(30, 51, 85, 0.2);
+}
+
+.primary {
+  border-color: rgba(20, 201, 214, 0.5);
+  box-shadow: 0 0 0 1px rgba(20, 201, 214, 0.2);
+}
+
+.info {
+  border-color: rgba(30, 99, 233, 0.4);
+  box-shadow: 0 0 0 1px rgba(30, 99, 233, 0.2);
+}
+
+.success {
+  border-color: rgba(79, 230, 163, 0.5);
+  box-shadow: 0 0 0 1px rgba(79, 230, 163, 0.2);
+}
+
+.warning {
+  border-color: rgba(246, 200, 106, 0.5);
+  box-shadow: 0 0 0 1px rgba(246, 200, 106, 0.2);
+}
+
+.danger {
+  border-color: rgba(255, 107, 107, 0.5);
+  box-shadow: 0 0 0 1px rgba(255, 107, 107, 0.2);
+}

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { UiVariant } from '../../types';
+type BadgeVariant = UiVariant;
+type Props = React.HTMLAttributes<HTMLSpanElement> & {
+    variant?: BadgeVariant;
+};
+export default function Badge({ variant, className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Badge/Badge.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styles from './Badge.module.css';
+const classMap = {
+    default: styles.default,
+    primary: styles.primary,
+    info: styles.info,
+    success: styles.success,
+    warning: styles.warning,
+    danger: styles.danger,
+};
+export default function Badge({ variant = 'default', className, ...props }) {
+    const classes = [styles.badge, classMap[variant], className].filter(Boolean).join(' ');
+    return _jsx("span", { className: classes, ...props });
+}
+//# sourceMappingURL=Badge.js.map

package/dist/components/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,oBAAoB,CAAC;AASxC,MAAM,QAAQ,GAAiC;IAC7C,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM;CACtB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,EAAE,SAAS,EAAE,GAAG,KAAK,EAAS;IAC/E,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEvF,OAAO,eAAM,SAAS,EAAE,OAAO,KAAM,KAAK,GAAI,CAAC;AACjD,CAAC"}

package/dist/components/Badge/Badge.module.css

@@ -0,0 +1,47 @@
+.badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 10px;
+  border-radius: 999px;
+  font-size: 12px;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  border: 1px solid transparent;
+}
+
+.default {
+  background: var(--badge-default-bg, rgba(30, 51, 85, 0.45));
+  color: var(--badge-default-color, var(--color-muted));
+  border-color: var(--badge-default-border, rgba(30, 51, 85, 0.7));
+}
+
+.primary {
+  background: var(--badge-primary-bg, rgba(79, 230, 163, 0.2));
+  color: var(--badge-primary-color, var(--color-mint));
+  border-color: var(--badge-primary-border, rgba(79, 230, 163, 0.4));
+}
+
+.info {
+  background: var(--badge-info-bg, rgba(30, 99, 233, 0.2));
+  color: var(--badge-info-color, #9cc0ff);
+  border-color: var(--badge-info-border, rgba(30, 99, 233, 0.45));
+}
+
+.success {
+  background: var(--badge-success-bg, rgba(79, 230, 163, 0.14));
+  color: var(--badge-success-color, var(--color-mint));
+  border-color: var(--badge-success-border, rgba(79, 230, 163, 0.4));
+}
+
+.warning {
+  background: var(--badge-warning-bg, rgba(246, 200, 106, 0.18));
+  color: var(--badge-warning-color, #f6c86a);
+  border-color: var(--badge-warning-border, rgba(246, 200, 106, 0.45));
+}
+
+.danger {
+  background: var(--badge-danger-bg, rgba(255, 107, 107, 0.18));
+  color: var(--badge-danger-color, #ff6b6b);
+  border-color: var(--badge-danger-border, rgba(255, 107, 107, 0.45));
+}

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+type LinkComponent = React.ElementType<{
+    href?: string;
+    className?: string;
+    onClick?: React.MouseEventHandler<HTMLElement>;
+    children?: React.ReactNode;
+}>;
+export type BreadcrumbItem = {
+    id?: string;
+    label: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+    disabled?: boolean;
+    current?: boolean;
+    as?: LinkComponent;
+};
+type Props = {
+    items: BreadcrumbItem[];
+    separator?: React.ReactNode;
+    className?: string;
+    as?: LinkComponent;
+};
+export default function Breadcrumbs({ items, separator, className, as }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Breadcrumbs.module.css';
+export default function Breadcrumbs({ items, separator = '›', className, as }) {
+    const hasExplicitCurrent = items.some((item) => item.current);
+    return (_jsx("nav", { className: [styles.breadcrumbs, className].filter(Boolean).join(' '), "aria-label": "Breadcrumbs", children: _jsx("ol", { className: styles.list, children: items.map((item, index) => {
+                const key = item.id ?? `${index}-${typeof item.label === 'string' ? item.label : 'item'}`;
+                const isLast = index === items.length - 1;
+                const isCurrent = item.current ?? (!hasExplicitCurrent && isLast);
+                const isDisabled = item.disabled ?? false;
+                const LinkTag = item.as ?? as ?? 'a';
+                const content = (_jsx("span", { className: styles.label, "aria-current": isCurrent ? 'page' : undefined, children: item.label }));
+                return (_jsxs("li", { className: styles.item, children: [item.href && !isDisabled && !isCurrent ? (_jsx(LinkTag, { href: item.href, className: styles.link, onClick: item.onClick, children: content })) : (_jsx("span", { className: [styles.link, isDisabled ? styles.disabled : null].filter(Boolean).join(' '), onClick: isDisabled ? undefined : item.onClick, "aria-disabled": isDisabled ? 'true' : undefined, children: content })), !isLast ? _jsx("span", { className: styles.separator, "aria-hidden": "true", children: separator }) : null] }, key));
+            }) }) }));
+}
+//# sourceMappingURL=Breadcrumbs.js.map

package/dist/components/Breadcrumbs/Breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,0BAA0B,CAAC;AA0B9C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,KAAK,EAAE,SAAS,GAAG,GAAG,EAAE,SAAS,EAAE,EAAE,EAAS;IAClF,MAAM,kBAAkB,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAE9D,OAAO,CACL,cAAK,SAAS,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAa,aAAa,YACjG,aAAI,SAAS,EAAE,MAAM,CAAC,IAAI,YACvB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBACzB,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,GAAG,KAAK,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;gBAC1F,MAAM,MAAM,GAAG,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;gBAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,kBAAkB,IAAI,MAAM,CAAC,CAAC;gBAClE,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC;gBAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,GAAG,CAAC;gBAErC,MAAM,OAAO,GAAG,CACd,eAAM,SAAS,EAAE,MAAM,CAAC,KAAK,kBAAgB,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,YACxE,IAAI,CAAC,KAAK,GACN,CACR,CAAC;gBAEF,OAAO,CACL,cAAc,SAAS,EAAE,MAAM,CAAC,IAAI,aACjC,IAAI,CAAC,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CACxC,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,YACpE,OAAO,GACA,CACX,CAAC,CAAC,CAAC,CACF,eACE,SAAS,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EACvF,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,mBAC/B,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,YAE7C,OAAO,GACH,CACR,EACA,CAAC,MAAM,CAAC,CAAC,CAAC,eAAM,SAAS,EAAE,MAAM,CAAC,SAAS,iBAAc,MAAM,YAAE,SAAS,GAAQ,CAAC,CAAC,CAAC,IAAI,KAdnF,GAAG,CAeP,CACN,CAAC;YACJ,CAAC,CAAC,GACC,GACD,CACP,CAAC;AACJ,CAAC"}

package/dist/components/Breadcrumbs/Breadcrumbs.module.css

@@ -0,0 +1,55 @@
+.breadcrumbs {
+  width: 100%;
+}
+
+.list {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 6px;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.item {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.link {
+  color: var(--color-muted);
+  text-decoration: none;
+  font-size: 13px;
+  transition: color 0.2s ease;
+}
+
+.link:hover {
+  color: var(--color-teal);
+}
+
+.label {
+  display: inline-flex;
+  align-items: center;
+}
+
+.separator {
+  color: var(--color-muted-2);
+  font-size: 12px;
+}
+
+.disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+[aria-current="page"] {
+  color: var(--color-text);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .link {
+    transition: none;
+  }
+}

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { UiVariant } from '../../types';
+type ButtonVariant = UiVariant;
+type ButtonAppearance = 'solid' | 'outline' | 'ghost';
+type Props = React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: ButtonVariant | 'ghost' | 'outline';
+    appearance?: ButtonAppearance;
+};
+export default function Button({ variant, appearance, className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Button/Button.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styles from './Button.module.css';
+const variantClass = {
+    default: styles.variantDefault,
+    primary: styles.variantPrimary,
+    info: styles.variantInfo,
+    success: styles.variantSuccess,
+    warning: styles.variantWarning,
+    danger: styles.variantDanger,
+};
+const appearanceClass = {
+    solid: styles.solid,
+    outline: styles.outline,
+    ghost: styles.ghost,
+};
+const normalizeVariant = (variant, appearance) => {
+    if (variant === 'ghost' || variant === 'outline') {
+        return { variant: 'primary', appearance: variant };
+    }
+    return {
+        variant: variant ?? 'primary',
+        appearance: appearance ?? 'solid',
+    };
+};
+export default function Button({ variant, appearance, className, ...props }) {
+    const resolved = normalizeVariant(variant, appearance);
+    const classes = [
+        styles.button,
+        variantClass[resolved.variant],
+        appearanceClass[resolved.appearance],
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return _jsx("button", { className: classes, ...props });
+}
+//# sourceMappingURL=Button.js.map

package/dist/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAWzC,MAAM,YAAY,GAAkC;IAClD,OAAO,EAAE,MAAM,CAAC,cAAc;IAC9B,OAAO,EAAE,MAAM,CAAC,cAAc;IAC9B,IAAI,EAAE,MAAM,CAAC,WAAW;IACxB,OAAO,EAAE,MAAM,CAAC,cAAc;IAC9B,OAAO,EAAE,MAAM,CAAC,cAAc;IAC9B,MAAM,EAAE,MAAM,CAAC,aAAa;CAC7B,CAAC;AAEF,MAAM,eAAe,GAAqC;IACxD,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,OAAO,EAAE,MAAM,CAAC,OAAO;IACvB,KAAK,EAAE,MAAM,CAAC,KAAK;CACpB,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,OAA6C,EAAE,UAA6B,EAAE,EAAE;IACxG,IAAI,OAAO,KAAK,OAAO,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QACjD,OAAO,EAAE,OAAO,EAAE,SAA0B,EAAE,UAAU,EAAE,OAAO,EAAE,CAAC;IACtE,CAAC;IAED,OAAO;QACL,OAAO,EAAE,OAAO,IAAI,SAAS;QAC7B,UAAU,EAAE,UAAU,IAAI,OAAO;KAClC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,KAAK,EAAS;IAChF,MAAM,QAAQ,GAAG,gBAAgB,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IACvD,MAAM,OAAO,GAAG;QACd,MAAM,CAAC,MAAM;QACb,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC;QAC9B,eAAe,CAAC,QAAQ,CAAC,UAAU,CAAC;QACpC,SAAS;KACV;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,iBAAQ,SAAS,EAAE,OAAO,KAAM,KAAK,GAAI,CAAC;AACnD,CAAC"}