jvdm-ui 1.0.5

package/dist/molecules/index.d.ts

@@ -0,0 +1,309 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+
+type AccordionItem = {
+    id: string;
+    title: ReactNode;
+    content: ReactNode;
+    defaultOpen?: boolean;
+};
+declare function Accordion({ items, exclusive, name, className, }: {
+    items: readonly AccordionItem[];
+    exclusive?: boolean;
+    name?: string;
+    className?: string;
+}): react.JSX.Element;
+
+declare const TONES$2: {
+    readonly info: "border-info/40 bg-info-soft text-info";
+    readonly ok: "border-ok/40 bg-ok-soft text-ok";
+    readonly warn: "border-warn/40 bg-warn-soft text-warn";
+    readonly danger: "border-danger/40 bg-danger-soft text-danger";
+};
+type BannerTone = keyof typeof TONES$2;
+declare function Banner({ tone, title, children, action, className, }: {
+    tone?: BannerTone;
+    title: string;
+    children?: ReactNode;
+    action?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+type Crumb = {
+    id: string;
+    label: ReactNode;
+    href?: string;
+};
+declare function Breadcrumb({ items, label, className, }: {
+    items: readonly Crumb[];
+    label?: string;
+    className?: string;
+}): react.JSX.Element;
+
+declare const TONES$1: {
+    readonly info: "border-info/35 bg-info-soft text-info";
+    readonly ok: "border-ok/35 bg-ok-soft text-ok";
+    readonly warn: "border-warn/35 bg-warn-soft text-warn";
+    readonly danger: "border-danger/35 bg-danger-soft text-danger";
+};
+type CalloutTone = keyof typeof TONES$1;
+declare function Callout({ tone, title, children, className, }: {
+    tone?: CalloutTone;
+    title: string;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+declare function CardTitle({ children, hint }: {
+    children: ReactNode;
+    hint?: ReactNode;
+}): react.JSX.Element;
+
+declare function CodeBlock({ code, language, className, }: {
+    code: string;
+    language?: string;
+    className?: string;
+}): react.JSX.Element;
+
+type CommandItem = {
+    id: string;
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+};
+declare function CommandMenu({ items, onSelect, label, global, }: {
+    items: readonly CommandItem[];
+    onSelect?: (item: CommandItem) => void;
+    label?: string;
+    global?: boolean;
+}): react.JSX.Element;
+
+declare function ConfirmDialog({ open, title, description, confirmLabel, cancelLabel, pending, children, onConfirm, onCancel, }: {
+    open: boolean;
+    title: string;
+    description?: string;
+    confirmLabel: string;
+    cancelLabel: string;
+    pending?: boolean;
+    children?: ReactNode;
+    onConfirm: () => void;
+    onCancel: () => void;
+}): react.JSX.Element;
+
+declare function Drawer({ isOpen, onClose, title, children, closeLabel, }: {
+    isOpen: boolean;
+    onClose: () => void;
+    title: ReactNode;
+    children: ReactNode;
+    closeLabel?: string;
+}): react.JSX.Element;
+
+declare function DropdownMenu({ trigger, children, align, className, }: {
+    trigger: ReactNode;
+    children: ReactNode;
+    align?: "start" | "end";
+    className?: string;
+}): react.JSX.Element;
+
+declare function Empty({ title, description }: {
+    title: string;
+    description?: ReactNode;
+}): react.JSX.Element;
+
+declare function Field({ label, htmlFor, error, action, className, children, }: {
+    label: string;
+    htmlFor?: string;
+    error?: string;
+    action?: ReactNode;
+    className?: string;
+    children: ReactNode;
+}): react.JSX.Element;
+
+declare function FilterBar({ children, resultLabel, onClear, className, }: {
+    children: ReactNode;
+    resultLabel?: string;
+    onClear?: () => void;
+    className?: string;
+}): react.JSX.Element;
+
+declare function Gallery({ photos, alt, fallback, photoLabel, previousLabel, nextLabel, className, }: {
+    photos: string[];
+    alt: string;
+    fallback?: ReactNode;
+    photoLabel?: (index: number, total: number) => string;
+    previousLabel?: string;
+    nextLabel?: string;
+    className?: string;
+}): react.JSX.Element;
+
+declare function LoadError({ message, onRetry, retryLabel, }: {
+    message: string;
+    onRetry?: () => void;
+    retryLabel?: string;
+}): react.JSX.Element;
+
+declare function ImagePreview({ src, alt, fallback, className, }: {
+    src?: string;
+    alt: string;
+    fallback?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+type TreeNode = {
+    id: string;
+    label: ReactNode;
+    children?: readonly TreeNode[];
+};
+declare function TreeView({ nodes, className, }: {
+    nodes: readonly TreeNode[];
+    className?: string;
+}): react.JSX.Element;
+
+declare function MetricCard({ label, value, change, trend, hint, children, className, }: {
+    label: string;
+    value: ReactNode;
+    change?: string;
+    trend?: "neutral" | "up" | "down";
+    hint?: string;
+    children?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+declare const SIZE_CLASSES: {
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+};
+declare function Modal({ isOpen, onClose, title, children, size, closeLabel, }: {
+    isOpen: boolean;
+    onClose: () => void;
+    title?: ReactNode;
+    children: ReactNode;
+    size?: keyof typeof SIZE_CLASSES;
+    closeLabel?: string;
+}): react.JSX.Element;
+
+declare const ALIGNS: {
+    readonly start: "left-0";
+    readonly end: "right-0";
+};
+declare const WIDTHS: {
+    readonly sm: "w-48";
+    readonly md: "w-56";
+    readonly lg: "w-72";
+};
+type MenuAlign = keyof typeof ALIGNS;
+type MenuWidth = keyof typeof WIDTHS;
+declare function Menu({ label, trigger, align, width, className, children, }: {
+    label: string;
+    trigger: ReactNode;
+    align?: MenuAlign;
+    width?: MenuWidth;
+    className?: string;
+    children: ReactNode;
+}): react.JSX.Element;
+
+type MenuItemTone = "neutral" | "danger";
+type MenuItemOptions = {
+    tone?: MenuItemTone;
+    className?: string;
+};
+declare function menuItemClass({ tone, className }?: MenuItemOptions): string;
+
+declare function PageHeader({ title, subtitle, children, className, }: {
+    title: ReactNode;
+    subtitle?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+declare function Pagination({ page, pages, onPageChange, previousLabel, nextLabel, pageLabel, label, className, }: {
+    page: number;
+    pages: number;
+    onPageChange: (page: number) => void;
+    previousLabel?: string;
+    nextLabel?: string;
+    pageLabel?: (page: number) => string;
+    label?: string;
+    className?: string;
+}): react.JSX.Element;
+
+type Snackbar = {
+    id: string;
+    title: string;
+    message?: ReactNode;
+    tone?: "neutral" | "ok" | "warn" | "danger";
+};
+declare function SnackbarStack({ items, onDismiss, className, }: {
+    items: readonly Snackbar[];
+    onDismiss?: (id: string) => void;
+    className?: string;
+}): react.JSX.Element;
+
+declare function StatCard({ label, value, hint, color, attention, className, }: {
+    label: string;
+    value: ReactNode;
+    hint?: string;
+    color?: string;
+    attention?: boolean;
+    className?: string;
+}): react.JSX.Element;
+
+type Step = {
+    id: string;
+    label: string;
+    description?: string;
+};
+declare function Stepper({ steps, current, className, }: {
+    steps: readonly Step[];
+    current: number;
+    className?: string;
+}): react.JSX.Element;
+
+type Tab = {
+    value: string;
+    label: ReactNode;
+    content: ReactNode;
+    disabled?: boolean;
+};
+declare function Tabs({ items, value, onValueChange, label, className, }: {
+    items: Tab[];
+    value: string;
+    onValueChange: (value: string) => void;
+    label?: string;
+    className?: string;
+}): react.JSX.Element;
+
+declare const SIDES: {
+    readonly top: "bottom-full left-1/2 mb-2 -translate-x-1/2";
+    readonly bottom: "top-full left-1/2 mt-2 -translate-x-1/2";
+    readonly left: "right-full top-1/2 mr-2 -translate-y-1/2";
+    readonly right: "left-full top-1/2 ml-2 -translate-y-1/2";
+};
+type TooltipSide = keyof typeof SIDES;
+declare function Tooltip({ id, content, side, children, className, }: {
+    id: string;
+    content: ReactNode;
+    side?: TooltipSide;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+declare const TONES: {
+    readonly info: "border-info/35 bg-surface";
+    readonly ok: "border-ok/35 bg-surface";
+    readonly warn: "border-warn/35 bg-surface";
+    readonly danger: "border-danger/35 bg-surface";
+};
+type ToastTone = keyof typeof TONES;
+declare function Toast({ tone, title, children, onDismiss, dismissLabel, className, }: {
+    tone?: ToastTone;
+    title: string;
+    children?: ReactNode;
+    onDismiss?: () => void;
+    dismissLabel?: string;
+    className?: string;
+}): react.JSX.Element;
+
+export { Accordion, type AccordionItem, Banner, type BannerTone, Breadcrumb, Callout, type CalloutTone, CardTitle, CodeBlock, type CommandItem, CommandMenu, ConfirmDialog, type Crumb, Drawer, DropdownMenu, Empty, Field, FilterBar, Gallery, ImagePreview, LoadError, Menu, type MenuAlign, type MenuItemOptions, type MenuItemTone, MetricCard, Modal, PageHeader, Pagination, type Snackbar, SnackbarStack, StatCard, type Step, Stepper, type Tab, Tabs, Toast, type ToastTone, Tooltip, type TooltipSide, type TreeNode, TreeView, menuItemClass };

package/dist/molecules/index.js

@@ -0,0 +1,4 @@
+export { Accordion, Banner, Breadcrumb, Callout, CardTitle, CommandMenu, Drawer, DropdownMenu, Empty, Field, FilterBar, Gallery, ImagePreview, LoadError, Menu, MetricCard, PageHeader, Pagination, SnackbarStack, StatCard, Stepper, Tabs, Toast, Tooltip, TreeView, menuItemClass } from '../chunk-AHE2576G.js';
+import '../chunk-WWOXGKLF.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/molecules/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/organisms/index.d.ts

@@ -0,0 +1,113 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+
+type Bar = {
+    key: string;
+    label: string;
+    value: number;
+};
+
+declare function BarChart({ data, top, ticks, describe, tooltip, peakKey, zeroStub, }: {
+    data: Bar[];
+    top: number;
+    ticks: number[];
+    describe: (bar: Bar) => string;
+    tooltip: (bar: Bar) => ReactNode;
+    peakKey?: string;
+    zeroStub?: boolean;
+}): react.JSX.Element;
+
+declare function LineChart({ data, top, ticks, describe, tooltip, area, }: {
+    data: Bar[];
+    top: number;
+    ticks: number[];
+    describe: (point: Bar) => string;
+    tooltip: (point: Bar) => ReactNode;
+    area?: boolean;
+}): react.JSX.Element;
+
+type DonutDatum = {
+    id: string;
+    label: string;
+    value: number;
+    color: string;
+};
+declare function DonutChart({ data, total, label, children, }: {
+    data: readonly DonutDatum[];
+    total: number;
+    label: string;
+    children?: ReactNode;
+}): react.JSX.Element;
+
+type AreaPoint = {
+    label: string;
+    value: number;
+};
+declare function AreaChart({ data, top, label, }: {
+    data: readonly AreaPoint[];
+    top: number;
+    label: string;
+}): react.JSX.Element;
+
+declare function Sparkline({ data, describe }: {
+    data: Bar[];
+    describe: (bar: Bar) => string;
+}): react.JSX.Element;
+
+type Column<T = unknown> = {
+    key: string;
+    label: string;
+    width: string;
+    align?: "left" | "right";
+    render: (item: T) => ReactNode;
+    sortable?: boolean;
+    sortValue?: (item: T) => string | number;
+};
+declare const GRID_ROW = "grid grid-cols-[var(--cols)] items-center";
+declare function DataTable<T>({ columns, items, rowKey, headerClassName, bodyClassName, loading, empty, className, filter, onFilterChange, sort, onSortChange, }: {
+    columns: Column<T>[];
+    items?: T[];
+    rowKey: (item: T) => string;
+    headerClassName?: string;
+    bodyClassName?: string;
+    loading?: ReactNode;
+    empty?: ReactNode;
+    className?: string;
+    filter?: string;
+    onFilterChange?: (value: string) => void;
+    sort?: {
+        key: string;
+        direction: "asc" | "desc";
+    };
+    onSortChange?: (key: string) => void;
+}): react.JSX.Element;
+
+type KanbanCard = {
+    id: string;
+    title: string;
+    description?: ReactNode;
+    meta?: ReactNode;
+};
+type KanbanColumn = {
+    id: string;
+    title: string;
+    cards: readonly KanbanCard[];
+};
+declare function KanbanBoard({ columns, className, }: {
+    columns: readonly KanbanColumn[];
+    className?: string;
+}): react.JSX.Element;
+
+type TimelineItem = {
+    id: string;
+    title: string;
+    meta: string;
+    children?: ReactNode;
+    tone?: "neutral" | "accent" | "ok" | "warn" | "danger";
+};
+declare function Timeline({ items, className, }: {
+    items: readonly TimelineItem[];
+    className?: string;
+}): react.JSX.Element;
+
+export { AreaChart, type AreaPoint, type Bar, BarChart, type Column, DataTable, DonutChart, type DonutDatum, GRID_ROW, KanbanBoard, type KanbanCard, type KanbanColumn, LineChart, Sparkline, Timeline, type TimelineItem };

package/dist/organisms/index.js

@@ -0,0 +1,4 @@
+export { AreaChart, BarChart, DataTable, DonutChart, GRID_ROW, KanbanBoard, LineChart, Sparkline, Timeline } from '../chunk-JYNDKPAH.js';
+import '../chunk-WWOXGKLF.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/organisms/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/presets/gavel.css

@@ -0,0 +1,19 @@
+@theme {
+  --color-app: light-dark(oklch(0.972 0.006 255), oklch(0.19 0.032 255));
+  --color-rail: light-dark(oklch(0.948 0.009 255), oklch(0.15 0.03 255));
+  --color-panel: light-dark(oklch(0.948 0.009 255), oklch(0.17 0.03 255));
+  --color-surface: light-dark(oklch(1 0 0), oklch(0.235 0.033 255));
+  --color-field: light-dark(oklch(0.985 0.004 255), oklch(0.215 0.032 255));
+  --color-raised: light-dark(oklch(0.928 0.011 255), oklch(0.3 0.032 255));
+  --color-line: light-dark(oklch(0.902 0.013 255), oklch(0.275 0.032 255));
+  --color-line-strong: light-dark(oklch(0.845 0.018 255), oklch(0.35 0.031 255));
+  --color-ink: light-dark(oklch(0.24 0.04 255), oklch(0.96 0.008 255));
+  --color-ink-soft: light-dark(oklch(0.37 0.035 255), oklch(0.82 0.015 255));
+  --color-ink-muted: light-dark(oklch(0.52 0.032 255), oklch(0.65 0.022 255));
+  --color-ink-dim: light-dark(oklch(0.57 0.028 255), oklch(0.57 0.025 255));
+  --color-accent: light-dark(oklch(0.56 0.12 74), oklch(0.79 0.14 80));
+  --color-accent-ink: light-dark(oklch(0.47 0.1 72), oklch(0.86 0.13 82));
+  --color-accent-soft: light-dark(oklch(0.94 0.045 82), oklch(0.31 0.06 80));
+  --color-on-accent: light-dark(oklch(1 0 0), oklch(0.15 0.03 255));
+  --font-sans: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
+}

package/dist/theme/index.d.ts

@@ -0,0 +1,60 @@
+type ColorToken = "app" | "rail" | "panel" | "surface" | "field" | "raised" | "line" | "line-strong" | "ink" | "ink-soft" | "ink-muted" | "ink-dim" | "accent" | "accent-ink" | "accent-soft" | "on-accent" | "ok" | "ok-soft" | "warn" | "warn-soft" | "danger" | "danger-soft" | "info" | "info-soft";
+type TextStep = "2xs" | "xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "display";
+type RadiusStep = "xs" | "sm" | "md" | "lg" | "xl";
+type WeightStep = "normal" | "medium" | "bold";
+type TrackingStep = "caps" | "code" | "tight" | "display";
+type ShadowStep = "raised" | "popover" | "modal";
+type EaseStep = "out" | "in-out" | "over";
+type DurationStep = "instant" | "fast" | "base" | "slow";
+type ColorValue = string | {
+    light: string;
+    dark: string;
+};
+type TypographyConfig = {
+    font?: {
+        sans?: string;
+        mono?: string;
+    };
+    text?: {
+        [K in TextStep]?: string | [string, string | number];
+    };
+    tracking?: {
+        [K in TrackingStep]?: string;
+    };
+    weight?: {
+        [K in WeightStep]?: number;
+    };
+};
+type TokenConfig = {
+    spacing?: string;
+    radius?: {
+        [K in RadiusStep]?: string;
+    };
+    shadow?: {
+        [K in ShadowStep]?: string;
+    };
+    ease?: {
+        [K in EaseStep]?: string;
+    };
+    duration?: {
+        [K in DurationStep]?: string;
+    };
+};
+type ThemeConfig = {
+    colors?: {
+        [K in ColorToken]?: ColorValue;
+    } & {
+        [key: string]: ColorValue | undefined;
+    };
+    typography?: TypographyConfig;
+    tokens?: TokenConfig;
+};
+
+type DefineThemeOptions = {
+    selector?: string;
+};
+declare function defineTheme(config: ThemeConfig, options?: DefineThemeOptions): string;
+
+declare const gavel: ThemeConfig;
+
+export { type ColorToken, type ColorValue, type DefineThemeOptions, type DurationStep, type EaseStep, type RadiusStep, type ShadowStep, type TextStep, type ThemeConfig, type TokenConfig, type TrackingStep, type TypographyConfig, type WeightStep, defineTheme, gavel };

package/dist/theme/index.js

@@ -0,0 +1,85 @@
+// src/theme/define-theme.ts
+function color(value) {
+  if (typeof value === "string") return value;
+  return `light-dark(${value.light}, ${value.dark})`;
+}
+function entries(source) {
+  if (!source) return [];
+  return Object.entries(source).filter(([, value]) => value !== void 0);
+}
+function defineTheme(config, options = {}) {
+  const lines = [];
+  const typography = config.typography ?? {};
+  const tokens = config.tokens ?? {};
+  for (const [name, value] of entries(config.colors)) {
+    lines.push(`  --color-${name}: ${color(value)};`);
+  }
+  for (const [name, value] of entries(typography.font)) {
+    lines.push(`  --font-${name}: ${value};`);
+  }
+  for (const [step, value] of entries(typography.text)) {
+    const [size, lineHeight] = Array.isArray(value) ? value : [value, void 0];
+    lines.push(`  --text-${step}: ${size};`);
+    if (lineHeight !== void 0) {
+      lines.push(`  --text-${step}--line-height: ${lineHeight};`);
+    }
+  }
+  if (tokens.spacing !== void 0) {
+    lines.push(`  --spacing: ${tokens.spacing};`);
+  }
+  for (const [name, value] of entries(typography.tracking)) {
+    lines.push(`  --tracking-${name}: ${value};`);
+  }
+  for (const [step, value] of entries(typography.weight)) {
+    lines.push(`  --font-weight-${step}: ${value};`);
+  }
+  for (const [step, value] of entries(tokens.radius)) {
+    lines.push(`  --radius-${step}: ${value};`);
+  }
+  for (const [step, value] of entries(tokens.shadow)) {
+    lines.push(`  --shadow-${step}: ${value};`);
+  }
+  for (const [step, value] of entries(tokens.ease)) {
+    lines.push(`  --ease-${step}: ${value};`);
+  }
+  for (const [step, value] of entries(tokens.duration)) {
+    lines.push(`  --duration-${step}: ${value};`);
+  }
+  if (lines.length === 0) return "";
+  const wrapper = options.selector ?? "@theme";
+  return `${wrapper} {
+${lines.join("\n")}
+}
+`;
+}
+
+// src/theme/presets/gavel.ts
+var gavel = {
+  typography: {
+    font: {
+      sans: '"Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif'
+    }
+  },
+  colors: {
+    app: { light: "oklch(0.972 0.006 255)", dark: "oklch(0.19 0.032 255)" },
+    rail: { light: "oklch(0.948 0.009 255)", dark: "oklch(0.15 0.03 255)" },
+    panel: { light: "oklch(0.948 0.009 255)", dark: "oklch(0.17 0.03 255)" },
+    surface: { light: "oklch(1 0 0)", dark: "oklch(0.235 0.033 255)" },
+    field: { light: "oklch(0.985 0.004 255)", dark: "oklch(0.215 0.032 255)" },
+    raised: { light: "oklch(0.928 0.011 255)", dark: "oklch(0.3 0.032 255)" },
+    line: { light: "oklch(0.902 0.013 255)", dark: "oklch(0.275 0.032 255)" },
+    "line-strong": { light: "oklch(0.845 0.018 255)", dark: "oklch(0.35 0.031 255)" },
+    ink: { light: "oklch(0.24 0.04 255)", dark: "oklch(0.96 0.008 255)" },
+    "ink-soft": { light: "oklch(0.37 0.035 255)", dark: "oklch(0.82 0.015 255)" },
+    "ink-muted": { light: "oklch(0.52 0.032 255)", dark: "oklch(0.65 0.022 255)" },
+    "ink-dim": { light: "oklch(0.57 0.028 255)", dark: "oklch(0.57 0.025 255)" },
+    accent: { light: "oklch(0.56 0.12 74)", dark: "oklch(0.79 0.14 80)" },
+    "accent-ink": { light: "oklch(0.47 0.1 72)", dark: "oklch(0.86 0.13 82)" },
+    "accent-soft": { light: "oklch(0.94 0.045 82)", dark: "oklch(0.31 0.06 80)" },
+    "on-accent": { light: "oklch(1 0 0)", dark: "oklch(0.15 0.03 255)" }
+  }
+};
+
+export { defineTheme, gavel };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/define-theme.ts","../../src/theme/presets/gavel.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import type { ColorValue, ThemeConfig } from \"./types\";\n\nfunction color(value: ColorValue): string {\n  if (typeof value === \"string\") return value;\n  return `light-dark(${value.light}, ${value.dark})`;\n}\n\nfunction entries<T extends object>(source: T | undefined): [string, unknown][] {\n  if (!source) return [];\n  return Object.entries(source).filter(([, value]) => value !== undefined);\n}\n\nexport type DefineThemeOptions = { selector?: string };\n\nexport function defineTheme(config: ThemeConfig, options: DefineThemeOptions = {}): string {\n  const lines: string[] = [];\n  const typography = config.typography ?? {};\n  const tokens = config.tokens ?? {};\n\n  for (const [name, value] of entries(config.colors)) {\n    lines.push(`  --color-${name}: ${color(value as ColorValue)};`);\n  }\n\n  for (const [name, value] of entries(typography.font)) {\n    lines.push(`  --font-${name}: ${value as string};`);\n  }\n\n  for (const [step, value] of entries(typography.text)) {\n    const [size, lineHeight] = Array.isArray(value) ? value : [value as string, undefined];\n    lines.push(`  --text-${step}: ${size};`);\n    if (lineHeight !== undefined) {\n      lines.push(`  --text-${step}--line-height: ${lineHeight};`);\n    }\n  }\n\n  if (tokens.spacing !== undefined) {\n    lines.push(`  --spacing: ${tokens.spacing};`);\n  }\n\n  for (const [name, value] of entries(typography.tracking)) {\n    lines.push(`  --tracking-${name}: ${value as string};`);\n  }\n\n  for (const [step, value] of entries(typography.weight)) {\n    lines.push(`  --font-weight-${step}: ${value as number};`);\n  }\n\n  for (const [step, value] of entries(tokens.radius)) {\n    lines.push(`  --radius-${step}: ${value as string};`);\n  }\n\n  for (const [step, value] of entries(tokens.shadow)) {\n    lines.push(`  --shadow-${step}: ${value as string};`);\n  }\n\n  for (const [step, value] of entries(tokens.ease)) {\n    lines.push(`  --ease-${step}: ${value as string};`);\n  }\n\n  for (const [step, value] of entries(tokens.duration)) {\n    lines.push(`  --duration-${step}: ${value as string};`);\n  }\n\n  if (lines.length === 0) return \"\";\n\n  const wrapper = options.selector ?? \"@theme\";\n\n  return `${wrapper} {\\n${lines.join(\"\\n\")}\\n}\\n`;\n}\n","import type { ThemeConfig } from \"../types\";\n\nexport const gavel: ThemeConfig = {\n  typography: {\n    font: {\n      sans: '\"Space Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", sans-serif',\n    },\n  },\n  colors: {\n    app: { light: \"oklch(0.972 0.006 255)\", dark: \"oklch(0.19 0.032 255)\" },\n    rail: { light: \"oklch(0.948 0.009 255)\", dark: \"oklch(0.15 0.03 255)\" },\n    panel: { light: \"oklch(0.948 0.009 255)\", dark: \"oklch(0.17 0.03 255)\" },\n    surface: { light: \"oklch(1 0 0)\", dark: \"oklch(0.235 0.033 255)\" },\n    field: { light: \"oklch(0.985 0.004 255)\", dark: \"oklch(0.215 0.032 255)\" },\n    raised: { light: \"oklch(0.928 0.011 255)\", dark: \"oklch(0.3 0.032 255)\" },\n\n    line: { light: \"oklch(0.902 0.013 255)\", dark: \"oklch(0.275 0.032 255)\" },\n    \"line-strong\": { light: \"oklch(0.845 0.018 255)\", dark: \"oklch(0.35 0.031 255)\" },\n\n    ink: { light: \"oklch(0.24 0.04 255)\", dark: \"oklch(0.96 0.008 255)\" },\n    \"ink-soft\": { light: \"oklch(0.37 0.035 255)\", dark: \"oklch(0.82 0.015 255)\" },\n    \"ink-muted\": { light: \"oklch(0.52 0.032 255)\", dark: \"oklch(0.65 0.022 255)\" },\n    \"ink-dim\": { light: \"oklch(0.57 0.028 255)\", dark: \"oklch(0.57 0.025 255)\" },\n\n    accent: { light: \"oklch(0.56 0.12 74)\", dark: \"oklch(0.79 0.14 80)\" },\n    \"accent-ink\": { light: \"oklch(0.47 0.1 72)\", dark: \"oklch(0.86 0.13 82)\" },\n    \"accent-soft\": { light: \"oklch(0.94 0.045 82)\", dark: \"oklch(0.31 0.06 80)\" },\n    \"on-accent\": { light: \"oklch(1 0 0)\", dark: \"oklch(0.15 0.03 255)\" },\n  },\n};\n"]}

package/dist/tokens/index.d.ts

@@ -0,0 +1,8 @@
+type Theme = "dark" | "light";
+declare function applyStoredTheme(): void;
+declare function useTheme(): {
+    theme: Theme;
+    toggle: () => void;
+};
+
+export { type Theme, applyStoredTheme, useTheme };

package/dist/tokens/index.js

@@ -0,0 +1,3 @@
+export { applyStoredTheme, useTheme } from '../chunk-CGDYSB4G.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/tokens/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}