@hanzo/ui-shadcn 5.7.2

package/dist/src/charts/index.js

@@ -0,0 +1,76 @@
+// @hanzo/ui-shadcn/charts - Chart components powered by Recharts
+// Requires: npm install recharts
+// Core chart primitives
+export * from '../../primitives/chart';
+// Re-export chart components (using named re-exports to avoid
+// duplicate 'description' metadata collisions across chart modules)
+// Area charts
+export { default as ChartAreaDefault } from '../../primitives/charts/area/chart-area-default';
+export { default as ChartAreaGradient } from '../../primitives/charts/area/chart-area-gradient';
+export { default as ChartAreaIcons } from '../../primitives/charts/area/chart-area-icons';
+export { default as ChartAreaInteractive } from '../../primitives/charts/area/chart-area-interactive';
+export { default as ChartAreaLegend } from '../../primitives/charts/area/chart-area-legend';
+export { default as ChartAreaLinear } from '../../primitives/charts/area/chart-area-linear';
+export { default as ChartAreaStacked } from '../../primitives/charts/area/chart-area-stacked';
+export { default as ChartAreaStackedExpand } from '../../primitives/charts/area/chart-area-stacked-expand';
+export { default as ChartAreaStep } from '../../primitives/charts/area/chart-area-step';
+export { default as ChartAreaAxes } from '../../primitives/charts/area/chart-area-axes';
+// Bar charts
+export { default as ChartBarDefault } from '../../primitives/charts/bar/chart-bar-default';
+export { default as ChartBarHorizontal } from '../../primitives/charts/bar/chart-bar-horizontal';
+export { default as ChartBarInteractive } from '../../primitives/charts/bar/chart-bar-interactive';
+export { default as ChartBarLabel } from '../../primitives/charts/bar/chart-bar-label';
+export { default as ChartBarLabelCustom } from '../../primitives/charts/bar/chart-bar-label-custom';
+export { default as ChartBarMixed } from '../../primitives/charts/bar/chart-bar-mixed';
+export { default as ChartBarMultiple } from '../../primitives/charts/bar/chart-bar-multiple';
+export { default as ChartBarNegative } from '../../primitives/charts/bar/chart-bar-negative';
+export { default as ChartBarStacked } from '../../primitives/charts/bar/chart-bar-stacked';
+export { default as ChartBarActive } from '../../primitives/charts/bar/chart-bar-active';
+// Line charts
+export { default as ChartLineDefault } from '../../primitives/charts/line/chart-line-default';
+export { default as ChartLineDots } from '../../primitives/charts/line/chart-line-dots';
+export { default as ChartLineDotsColors } from '../../primitives/charts/line/chart-line-dots-colors';
+export { default as ChartLineDotsCustom } from '../../primitives/charts/line/chart-line-dots-custom';
+export { default as ChartLineInteractive } from '../../primitives/charts/line/chart-line-interactive';
+export { default as ChartLineLabel } from '../../primitives/charts/line/chart-line-label';
+export { default as ChartLineLabelCustom } from '../../primitives/charts/line/chart-line-label-custom';
+export { default as ChartLineLinear } from '../../primitives/charts/line/chart-line-linear';
+export { default as ChartLineMultiple } from '../../primitives/charts/line/chart-line-multiple';
+export { default as ChartLineStep } from '../../primitives/charts/line/chart-line-step';
+// Pie charts
+export { default as ChartPieDonut } from '../../primitives/charts/pie/chart-pie-donut';
+export { default as ChartPieDonutActive } from '../../primitives/charts/pie/chart-pie-donut-active';
+export { default as ChartPieDonutText } from '../../primitives/charts/pie/chart-pie-donut-text';
+export { default as ChartPieInteractive } from '../../primitives/charts/pie/chart-pie-interactive';
+export { default as ChartPieLabel } from '../../primitives/charts/pie/chart-pie-label';
+export { default as ChartPieLabelCustom } from '../../primitives/charts/pie/chart-pie-label-custom';
+export { default as ChartPieLabelList } from '../../primitives/charts/pie/chart-pie-label-list';
+export { default as ChartPieLegend } from '../../primitives/charts/pie/chart-pie-legend';
+export { default as ChartPieSeparatorNone } from '../../primitives/charts/pie/chart-pie-separator-none';
+// Radar charts
+export { default as ChartRadarDefault } from '../../primitives/charts/radar/chart-radar-default';
+export { default as ChartRadarDots } from '../../primitives/charts/radar/chart-radar-dots';
+export { default as ChartRadarGridCircle } from '../../primitives/charts/radar/chart-radar-grid-circle';
+export { default as ChartRadarGridCircleFill } from '../../primitives/charts/radar/chart-radar-grid-circle-fill';
+export { default as ChartRadarGridCircleNoLines } from '../../primitives/charts/radar/chart-radar-grid-circle-no-lines';
+export { default as ChartRadarGridCustom } from '../../primitives/charts/radar/chart-radar-grid-custom';
+export { default as ChartRadarGridFill } from '../../primitives/charts/radar/chart-radar-grid-fill';
+export { default as ChartRadarGridNone } from '../../primitives/charts/radar/chart-radar-grid-none';
+export { default as ChartRadarIcons } from '../../primitives/charts/radar/chart-radar-icons';
+// Radial charts
+export { default as ChartRadialGrid } from '../../primitives/charts/radial/chart-radial-grid';
+export { default as ChartRadialLabel } from '../../primitives/charts/radial/chart-radial-label';
+export { default as ChartRadialShape } from '../../primitives/charts/radial/chart-radial-shape';
+export { default as ChartRadialSimple } from '../../primitives/charts/radial/chart-radial-simple';
+export { default as ChartRadialStacked } from '../../primitives/charts/radial/chart-radial-stacked';
+export { default as ChartRadialText } from '../../primitives/charts/radial/chart-radial-text';
+// Tooltip charts
+export { default as ChartTooltipAdvanced } from '../../primitives/charts/tooltip/chart-tooltip-advanced';
+export { default as ChartTooltipDefault } from '../../primitives/charts/tooltip/chart-tooltip-default';
+export { default as ChartTooltipFormatter } from '../../primitives/charts/tooltip/chart-tooltip-formatter';
+export { default as ChartTooltipIcons } from '../../primitives/charts/tooltip/chart-tooltip-icons';
+export { default as ChartTooltipIndicatorLine } from '../../primitives/charts/tooltip/chart-tooltip-indicator-line';
+export { default as ChartTooltipIndicatorNone } from '../../primitives/charts/tooltip/chart-tooltip-indicator-none';
+export { default as ChartTooltipLabelCustom } from '../../primitives/charts/tooltip/chart-tooltip-label-custom';
+export { default as ChartTooltipLabelFormatter } from '../../primitives/charts/tooltip/chart-tooltip-label-formatter';
+export { default as ChartTooltipLabelNone } from '../../primitives/charts/tooltip/chart-tooltip-label-none';

package/dist/src/dash/crud.d.ts

@@ -0,0 +1,37 @@
+import { type Column, type TableProps } from './table';
+import { type FieldDef } from './form';
+export interface CrudProps<T> {
+    /** Resource name (e.g. "User", "API Key") used in UI labels */
+    resourceName: string;
+    /** Plural resource name (defaults to resourceName + "s") */
+    resourceNamePlural?: string;
+    /** Column definitions for the list table */
+    columns: Column<T>[];
+    /** Row data */
+    data: T[];
+    /** Unique key extractor per row */
+    rowKey: (row: T) => string;
+    /** Field definitions for create/edit form */
+    fields: FieldDef[];
+    /** Convert a row to form values for editing */
+    rowToValues?: (row: T) => Record<string, unknown>;
+    /** Called when creating a new record */
+    onCreate?: (values: Record<string, unknown>) => Promise<void>;
+    /** Called when updating an existing record */
+    onUpdate?: (key: string, values: Record<string, unknown>) => Promise<void>;
+    /** Called when deleting a record */
+    onDelete?: (key: string) => Promise<void>;
+    /** Whether create is available */
+    canCreate?: boolean;
+    /** Whether edit is available */
+    canEdit?: boolean;
+    /** Whether delete is available */
+    canDelete?: boolean;
+    /** Pass-through Table props */
+    tableProps?: Partial<TableProps<T>>;
+    /** Loading state */
+    loading?: boolean;
+    className?: string;
+}
+export declare function Crud<T>({ resourceName, resourceNamePlural, columns, data, rowKey, fields, rowToValues, onCreate, onUpdate, onDelete, canCreate, canEdit, canDelete, tableProps, loading, className, }: CrudProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=crud.d.ts.map

package/dist/src/dash/crud.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"crud.d.ts","sourceRoot":"","sources":["../../../src/dash/crud.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAS,KAAK,MAAM,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAC7D,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAM5C,MAAM,WAAW,SAAS,CAAC,CAAC;IAC1B,+DAA+D;IAC/D,YAAY,EAAE,MAAM,CAAA;IACpB,4DAA4D;IAC5D,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,4CAA4C;IAC5C,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAA;IACpB,eAAe;IACf,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,mCAAmC;IACnC,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAA;IAC1B,6CAA6C;IAC7C,MAAM,EAAE,QAAQ,EAAE,CAAA;IAClB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACjD,wCAAwC;IACxC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC7D,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC1E,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACzC,kCAAkC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gCAAgC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kCAAkC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,+BAA+B;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAA;IACnC,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAQD,wBAAgB,IAAI,CAAC,CAAC,EAAE,EACtB,YAAY,EACZ,kBAAkB,EAClB,OAAO,EACP,IAAI,EACJ,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,SAAgB,EAChB,OAAc,EACd,SAAgB,EAChB,UAAU,EACV,OAAe,EACf,SAAS,GACV,EAAE,SAAS,CAAC,CAAC,CAAC,2CAgJd"}

package/dist/src/dash/crud.js

@@ -0,0 +1,74 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../../utils';
+import { Table } from './table';
+import { Form } from './form';
+/* ------------------------------------------------------------------ */
+/*  Component                                                         */
+/* ------------------------------------------------------------------ */
+export function Crud({ resourceName, resourceNamePlural, columns, data, rowKey, fields, rowToValues, onCreate, onUpdate, onDelete, canCreate = true, canEdit = true, canDelete = true, tableProps, loading = false, className, }) {
+    const plural = resourceNamePlural ?? `${resourceName}s`;
+    const [view, setView] = React.useState('list');
+    const [editingKey, setEditingKey] = React.useState(null);
+    const [editValues, setEditValues] = React.useState({});
+    const [deleteKey, setDeleteKey] = React.useState(null);
+    const [submitting, setSubmitting] = React.useState(false);
+    /* ------ edit ------ */
+    function handleEdit(row) {
+        const key = rowKey(row);
+        setEditingKey(key);
+        setEditValues(rowToValues ? rowToValues(row) : row);
+        setView('edit');
+    }
+    /* ------ delete confirm ------ */
+    function handleDeleteConfirm(row) {
+        setDeleteKey(rowKey(row));
+    }
+    async function confirmDelete() {
+        if (!deleteKey || !onDelete)
+            return;
+        setSubmitting(true);
+        try {
+            await onDelete(deleteKey);
+        }
+        finally {
+            setSubmitting(false);
+            setDeleteKey(null);
+        }
+    }
+    /* ------ actions column ------ */
+    function actionsRenderer(row) {
+        return (_jsxs("div", { className: "flex items-center justify-end gap-1", children: [canEdit && onUpdate && (_jsx("button", { type: "button", onClick: () => handleEdit(row), className: "rounded-[var(--dash-radius-sm)] px-2 py-1 text-xs text-[var(--dash-text-muted)] hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)] transition-colors", children: "Edit" })), canDelete && onDelete && (_jsx("button", { type: "button", onClick: () => handleDeleteConfirm(row), className: "rounded-[var(--dash-radius-sm)] px-2 py-1 text-xs text-[var(--dash-error)] hover:bg-[var(--dash-error-dim)] transition-colors", children: "Delete" }))] }));
+    }
+    /* ------ list view ------ */
+    if (view === 'list') {
+        return (_jsxs("div", { className: cn('space-y-4', className), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h2", { className: "text-xl font-semibold text-[var(--dash-text)]", children: plural }), canCreate && onCreate && (_jsxs("button", { type: "button", onClick: () => {
+                                setEditingKey(null);
+                                setEditValues({});
+                                setView('create');
+                            }, className: cn('rounded-[var(--dash-radius)] px-3 py-1.5 text-sm font-medium transition-colors', 'bg-[var(--dash-primary)] text-[var(--dash-primary-text)]', 'hover:bg-[var(--dash-primary-hover)]'), children: ["Create ", resourceName] }))] }), _jsx(Table, { columns: columns, data: data, rowKey: rowKey, actions: (canEdit || canDelete) ? actionsRenderer : undefined, loading: loading, searchable: true, emptyMessage: `No ${plural.toLowerCase()} found`, ...tableProps }), deleteKey !== null && (_jsx(DeleteDialog, { resourceName: resourceName, loading: submitting, onConfirm: confirmDelete, onCancel: () => setDeleteKey(null) }))] }));
+    }
+    /* ------ create / edit view ------ */
+    return (_jsxs("div", { className: cn('space-y-4', className), children: [_jsxs("button", { type: "button", onClick: () => setView('list'), className: "inline-flex items-center gap-1 text-sm text-[var(--dash-text-muted)] hover:text-[var(--dash-text)] transition-colors", children: [_jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M10 4L6 8l4 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), "Back to ", plural] }), _jsx(Form, { title: view === 'create' ? `Create ${resourceName}` : `Edit ${resourceName}`, fields: fields, values: view === 'edit' ? editValues : undefined, loading: submitting, submitLabel: view === 'create' ? 'Create' : 'Save changes', onCancel: () => setView('list'), onSubmit: async (vals) => {
+                    setSubmitting(true);
+                    try {
+                        if (view === 'create' && onCreate) {
+                            await onCreate(vals);
+                        }
+                        else if (view === 'edit' && editingKey && onUpdate) {
+                            await onUpdate(editingKey, vals);
+                        }
+                        setView('list');
+                    }
+                    finally {
+                        setSubmitting(false);
+                    }
+                } })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  DeleteDialog (internal)                                           */
+/* ------------------------------------------------------------------ */
+function DeleteDialog({ resourceName, loading, onConfirm, onCancel, }) {
+    return (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60", children: _jsxs("div", { className: "w-full max-w-sm rounded-[var(--dash-radius-lg)] border border-[var(--dash-border)] bg-[var(--dash-surface)] p-6 shadow-lg", children: [_jsxs("h3", { className: "text-lg font-semibold text-[var(--dash-text)]", children: ["Delete ", resourceName, "?"] }), _jsxs("p", { className: "mt-2 text-sm text-[var(--dash-text-muted)]", children: ["This action cannot be undone. The ", resourceName.toLowerCase(), " will be permanently removed."] }), _jsxs("div", { className: "mt-6 flex items-center justify-end gap-3", children: [_jsx("button", { type: "button", onClick: onCancel, disabled: loading, className: cn('rounded-[var(--dash-radius)] px-4 py-2 text-sm font-medium transition-colors', 'border border-[var(--dash-border)] text-[var(--dash-text-muted)]', 'hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)]'), children: "Cancel" }), _jsx("button", { type: "button", onClick: onConfirm, disabled: loading, className: cn('rounded-[var(--dash-radius)] px-4 py-2 text-sm font-medium transition-colors', 'bg-[var(--dash-error)] text-white', 'hover:bg-red-600', 'disabled:opacity-50 disabled:cursor-not-allowed'), children: loading ? 'Deleting...' : 'Delete' })] })] }) }));
+}

package/dist/src/dash/form.d.ts

@@ -0,0 +1,52 @@
+export type FieldType = 'text' | 'number' | 'email' | 'password' | 'select' | 'toggle' | 'textarea' | 'json' | 'relation' | 'file';
+export interface FieldOption {
+    label: string;
+    value: string;
+}
+export interface FieldDef {
+    /** Field key (maps to form value key) */
+    name: string;
+    /** Display label */
+    label: string;
+    /** Field type */
+    type: FieldType;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Description shown below field */
+    description?: string;
+    /** Whether the field is required */
+    required?: boolean;
+    /** Select options (for type=select or type=relation) */
+    options?: FieldOption[];
+    /** Default value */
+    defaultValue?: unknown;
+    /** Disabled */
+    disabled?: boolean;
+    /** File accept pattern (for type=file) */
+    accept?: string;
+    /** Number of textarea rows */
+    rows?: number;
+    /** Zod-style validation function. Return error string or null. */
+    validate?: (value: unknown) => string | null;
+}
+export interface FormProps {
+    /** Form title */
+    title?: string;
+    /** Field definitions */
+    fields: FieldDef[];
+    /** Initial values */
+    values?: Record<string, unknown>;
+    /** Called on submit with validated values */
+    onSubmit: (values: Record<string, unknown>) => void | Promise<void>;
+    /** Called on cancel */
+    onCancel?: () => void;
+    /** Submit button label */
+    submitLabel?: string;
+    /** Cancel button label */
+    cancelLabel?: string;
+    /** Loading state */
+    loading?: boolean;
+    className?: string;
+}
+export declare function Form({ title, fields, values: initialValues, onSubmit, onCancel, submitLabel, cancelLabel, loading, className, }: FormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=form.d.ts.map

package/dist/src/dash/form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/dash/form.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,SAAS,GACjB,MAAM,GACN,QAAQ,GACR,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,UAAU,GACV,MAAM,GACN,UAAU,GACV,MAAM,CAAA;AAEV,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,QAAQ;IACvB,yCAAyC;IACzC,IAAI,EAAE,MAAM,CAAA;IACZ,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,iBAAiB;IACjB,IAAI,EAAE,SAAS,CAAA;IACf,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wDAAwD;IACxD,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;IACvB,oBAAoB;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,eAAe;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,kEAAkE;IAClE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,MAAM,GAAG,IAAI,CAAA;CAC7C;AAED,MAAM,WAAW,SAAS;IACxB,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,wBAAwB;IACxB,MAAM,EAAE,QAAQ,EAAE,CAAA;IAClB,qBAAqB;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAChC,6CAA6C;IAC7C,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACnE,uBAAuB;IACvB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAMD,wBAAgB,IAAI,CAAC,EACnB,KAAK,EACL,MAAM,EACN,MAAM,EAAE,aAAa,EACrB,QAAQ,EACR,QAAQ,EACR,WAAoB,EACpB,WAAsB,EACtB,OAAe,EACf,SAAS,GACV,EAAE,SAAS,2CAmGX"}

package/dist/src/dash/form.js

@@ -0,0 +1,90 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../../utils';
+/* ------------------------------------------------------------------ */
+/*  Component                                                         */
+/* ------------------------------------------------------------------ */
+export function Form({ title, fields, values: initialValues, onSubmit, onCancel, submitLabel = 'Save', cancelLabel = 'Cancel', loading = false, className, }) {
+    const [values, setValues] = React.useState(() => {
+        const init = {};
+        for (const f of fields) {
+            init[f.name] = initialValues?.[f.name] ?? f.defaultValue ?? (f.type === 'toggle' ? false : '');
+        }
+        return init;
+    });
+    const [errors, setErrors] = React.useState({});
+    function setValue(name, value) {
+        setValues((prev) => ({ ...prev, [name]: value }));
+        setErrors((prev) => {
+            if (!prev[name])
+                return prev;
+            const next = { ...prev };
+            delete next[name];
+            return next;
+        });
+    }
+    async function handleSubmit(e) {
+        e.preventDefault();
+        // Validate
+        const errs = {};
+        for (const f of fields) {
+            const v = values[f.name];
+            if (f.required && (v === '' || v === null || v === undefined)) {
+                errs[f.name] = `${f.label} is required`;
+            }
+            if (f.validate) {
+                const err = f.validate(v);
+                if (err)
+                    errs[f.name] = err;
+            }
+        }
+        if (Object.keys(errs).length > 0) {
+            setErrors(errs);
+            return;
+        }
+        await onSubmit(values);
+    }
+    return (_jsxs("form", { onSubmit: handleSubmit, className: cn('rounded-[var(--dash-radius-lg)] border border-[var(--dash-border)] bg-[var(--dash-surface)] p-6', className), children: [title && (_jsx("h3", { className: "mb-4 text-lg font-semibold text-[var(--dash-text)]", children: title })), _jsx("div", { className: "space-y-4", children: fields.map((field) => (_jsx(FieldRenderer, { field: field, value: values[field.name], error: errors[field.name], onChange: (v) => setValue(field.name, v) }, field.name))) }), _jsxs("div", { className: "mt-6 flex items-center gap-3", children: [_jsx("button", { type: "submit", disabled: loading, className: cn('rounded-[var(--dash-radius)] px-4 py-2 text-sm font-medium transition-colors', 'bg-[var(--dash-primary)] text-[var(--dash-primary-text)]', 'hover:bg-[var(--dash-primary-hover)]', 'disabled:opacity-50 disabled:cursor-not-allowed'), children: loading ? 'Saving...' : submitLabel }), onCancel && (_jsx("button", { type: "button", onClick: onCancel, disabled: loading, className: cn('rounded-[var(--dash-radius)] px-4 py-2 text-sm font-medium transition-colors', 'border border-[var(--dash-border)] text-[var(--dash-text-muted)]', 'hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)]'), children: cancelLabel }))] })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  FieldRenderer (internal)                                          */
+/* ------------------------------------------------------------------ */
+const inputBase = cn('w-full rounded-[var(--dash-radius-sm)] border border-[var(--dash-border)] bg-[var(--dash-bg)] px-3 py-2 text-sm text-[var(--dash-text)]', 'placeholder:text-[var(--dash-text-dim)]', 'focus:border-[var(--dash-primary)] focus:outline-none focus:ring-1 focus:ring-[var(--dash-primary)]', 'disabled:opacity-50 disabled:cursor-not-allowed', 'transition-colors');
+function FieldRenderer({ field, value, error, onChange, }) {
+    const id = `dash-field-${field.name}`;
+    const labelEl = (_jsxs("label", { htmlFor: id, className: "mb-1 block text-sm font-medium text-[var(--dash-text)]", children: [field.label, field.required && _jsx("span", { className: "ml-0.5 text-[var(--dash-error)]", children: "*" })] }));
+    const descEl = field.description ? (_jsx("p", { className: "mt-1 text-xs text-[var(--dash-text-dim)]", children: field.description })) : null;
+    const errEl = error ? (_jsx("p", { className: "mt-1 text-xs text-[var(--dash-error)]", children: error })) : null;
+    switch (field.type) {
+        case 'text':
+        case 'email':
+        case 'password':
+        case 'number':
+            return (_jsxs("div", { children: [labelEl, _jsx("input", { id: id, type: field.type, value: String(value ?? ''), placeholder: field.placeholder, disabled: field.disabled, onChange: (e) => onChange(field.type === 'number' ? Number(e.target.value) : e.target.value), className: cn(inputBase, error && 'border-[var(--dash-error)]') }), descEl, errEl] }));
+        case 'textarea':
+            return (_jsxs("div", { children: [labelEl, _jsx("textarea", { id: id, value: String(value ?? ''), placeholder: field.placeholder, disabled: field.disabled, rows: field.rows ?? 3, onChange: (e) => onChange(e.target.value), className: cn(inputBase, 'resize-y', error && 'border-[var(--dash-error)]') }), descEl, errEl] }));
+        case 'select':
+        case 'relation':
+            return (_jsxs("div", { children: [labelEl, _jsxs("select", { id: id, value: String(value ?? ''), disabled: field.disabled, onChange: (e) => onChange(e.target.value), className: cn(inputBase, error && 'border-[var(--dash-error)]'), children: [_jsx("option", { value: "", children: field.placeholder ?? 'Select...' }), (field.options ?? []).map((opt) => (_jsx("option", { value: opt.value, children: opt.label }, opt.value)))] }), descEl, errEl] }));
+        case 'toggle':
+            return (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("button", { id: id, type: "button", role: "switch", "aria-checked": Boolean(value), disabled: field.disabled, onClick: () => onChange(!value), className: cn('relative inline-flex h-5 w-9 flex-shrink-0 rounded-full transition-colors', 'focus:outline-none focus:ring-2 focus:ring-[var(--dash-primary)] focus:ring-offset-2 focus:ring-offset-[var(--dash-surface)]', value ? 'bg-[var(--dash-primary)]' : 'bg-[var(--dash-border)]', field.disabled && 'opacity-50 cursor-not-allowed'), children: _jsx("span", { className: cn('pointer-events-none inline-block h-4 w-4 rounded-full bg-white shadow transition-transform', value ? 'translate-x-4' : 'translate-x-0.5', 'mt-0.5') }) }), _jsx("label", { htmlFor: id, className: "text-sm text-[var(--dash-text)]", children: field.label }), descEl, errEl] }));
+        case 'json':
+            return (_jsxs("div", { children: [labelEl, _jsx("textarea", { id: id, value: typeof value === 'string' ? value : JSON.stringify(value, null, 2), placeholder: field.placeholder ?? '{}', disabled: field.disabled, rows: field.rows ?? 6, onChange: (e) => {
+                            try {
+                                onChange(JSON.parse(e.target.value));
+                            }
+                            catch {
+                                onChange(e.target.value);
+                            }
+                        }, className: cn(inputBase, 'font-mono text-xs resize-y', error && 'border-[var(--dash-error)]') }), descEl, errEl] }));
+        case 'file':
+            return (_jsxs("div", { children: [labelEl, _jsx("input", { id: id, type: "file", accept: field.accept, disabled: field.disabled, onChange: (e) => {
+                            const file = e.target.files?.[0];
+                            if (file)
+                                onChange(file);
+                        }, className: cn('w-full text-sm text-[var(--dash-text-muted)]', 'file:mr-3 file:rounded-[var(--dash-radius-sm)] file:border-0 file:bg-[var(--dash-primary)] file:px-3 file:py-1.5 file:text-sm file:font-medium file:text-[var(--dash-primary-text)]', 'file:cursor-pointer hover:file:bg-[var(--dash-primary-hover)]') }), descEl, errEl] }));
+        default:
+            return null;
+    }
+}

package/dist/src/dash/header.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+export interface BreadcrumbItem {
+    label: string;
+    href?: string;
+}
+export interface HeaderProps {
+    /** Breadcrumb trail */
+    breadcrumbs?: BreadcrumbItem[];
+    /** Search input placeholder */
+    searchPlaceholder?: string;
+    /** Called when search query changes */
+    onSearch?: (query: string) => void;
+    /** User avatar URL */
+    avatarUrl?: string;
+    /** User display name */
+    userName?: string;
+    /** Dropdown menu rendered on avatar click */
+    userDropdown?: React.ReactNode;
+    /** Toggle dark/light theme */
+    onToggleTheme?: () => void;
+    /** Current theme */
+    theme?: 'dark' | 'light';
+    /** Extra actions (buttons, etc.) rendered right of search */
+    actions?: React.ReactNode;
+    className?: string;
+}
+export declare function Header({ breadcrumbs, searchPlaceholder, onSearch, avatarUrl, userName, userDropdown, onToggleTheme, theme, actions, className, }: HeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=header.d.ts.map

package/dist/src/dash/header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/dash/header.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,WAAW;IAC1B,uBAAuB;IACvB,WAAW,CAAC,EAAE,cAAc,EAAE,CAAA;IAC9B,+BAA+B;IAC/B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,6CAA6C;IAC7C,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,8BAA8B;IAC9B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACxB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAMD,wBAAgB,MAAM,CAAC,EACrB,WAAW,EACX,iBAA+B,EAC/B,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,KAAc,EACd,OAAO,EACP,SAAS,GACV,EAAE,WAAW,2CAmIb"}

package/dist/src/dash/header.js

@@ -0,0 +1,24 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../../utils';
+/* ------------------------------------------------------------------ */
+/*  Component                                                         */
+/* ------------------------------------------------------------------ */
+export function Header({ breadcrumbs, searchPlaceholder = 'Search...', onSearch, avatarUrl, userName, userDropdown, onToggleTheme, theme = 'dark', actions, className, }) {
+    const [dropdownOpen, setDropdownOpen] = React.useState(false);
+    const dropdownRef = React.useRef(null);
+    // Close dropdown on outside click
+    React.useEffect(() => {
+        if (!dropdownOpen)
+            return;
+        function handleClick(e) {
+            if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
+                setDropdownOpen(false);
+            }
+        }
+        document.addEventListener('mousedown', handleClick);
+        return () => document.removeEventListener('mousedown', handleClick);
+    }, [dropdownOpen]);
+    return (_jsxs("div", { className: cn('flex h-[var(--dash-header-height)] items-center gap-4 px-4', 'bg-[var(--dash-surface)] text-[var(--dash-text)]', className), children: [breadcrumbs && breadcrumbs.length > 0 && (_jsx("nav", { className: "flex items-center gap-1 text-sm", "aria-label": "Breadcrumb", children: breadcrumbs.map((crumb, i) => (_jsxs(React.Fragment, { children: [i > 0 && (_jsx("span", { className: "text-[var(--dash-text-dim)]", children: "/" })), crumb.href ? (_jsx("a", { href: crumb.href, className: "text-[var(--dash-text-muted)] hover:text-[var(--dash-text)] transition-colors", children: crumb.label })) : (_jsx("span", { className: "text-[var(--dash-text)]", children: crumb.label }))] }, i))) })), _jsx("div", { className: "flex-1" }), onSearch && (_jsxs("div", { className: "relative hidden sm:block", children: [_jsxs("svg", { className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-[var(--dash-text-dim)]", width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", children: [_jsx("circle", { cx: "7", cy: "7", r: "5.5", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "M11 11l3 3", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }), _jsx("input", { type: "text", placeholder: searchPlaceholder, onChange: (e) => onSearch(e.target.value), className: cn('h-8 w-56 rounded-[var(--dash-radius-sm)] border border-[var(--dash-border)] bg-[var(--dash-bg)] pl-8 pr-3 text-sm text-[var(--dash-text)]', 'placeholder:text-[var(--dash-text-dim)]', 'focus:border-[var(--dash-primary)] focus:outline-none focus:ring-1 focus:ring-[var(--dash-primary)]', 'transition-colors') })] })), actions, onToggleTheme && (_jsx("button", { type: "button", onClick: onToggleTheme, className: "rounded-[var(--dash-radius-sm)] p-1.5 text-[var(--dash-text-dim)] hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)] transition-colors", "aria-label": `Switch to ${theme === 'dark' ? 'light' : 'dark'} mode`, children: theme === 'dark' ? (_jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [_jsx("circle", { cx: "8", cy: "8", r: "3.5", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "M8 1v2M8 13v2M1 8h2M13 8h2M3.05 3.05l1.41 1.41M11.54 11.54l1.41 1.41M3.05 12.95l1.41-1.41M11.54 4.46l1.41-1.41", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] })) : (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M14 9.5A6.5 6.5 0 016.5 2 5.5 5.5 0 1014 9.5z", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })) })), (avatarUrl || userName) && (_jsxs("div", { className: "relative", ref: dropdownRef, children: [_jsx("button", { type: "button", onClick: () => setDropdownOpen((o) => !o), className: "flex items-center gap-2 rounded-[var(--dash-radius-sm)] p-1 hover:bg-[var(--dash-surface-hover)] transition-colors", children: avatarUrl ? (_jsx("img", { src: avatarUrl, alt: userName ?? 'User', className: "h-7 w-7 rounded-full object-cover" })) : (_jsx("div", { className: "flex h-7 w-7 items-center justify-center rounded-full bg-[var(--dash-primary)] text-xs font-medium text-[var(--dash-primary-text)]", children: (userName ?? '?')[0].toUpperCase() })) }), dropdownOpen && userDropdown && (_jsx("div", { className: "absolute right-0 top-full z-50 mt-1 min-w-48 rounded-[var(--dash-radius)] border border-[var(--dash-border)] bg-[var(--dash-surface)] p-1 shadow-lg", children: userDropdown }))] }))] }));
+}

package/dist/src/dash/index.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @hanzo/ui-shadcn/dash
+ *
+ * Shared dash UI foundation. Dark-themed layout, navigation,
+ * data table, form builder, and CRUD components.
+ *
+ * Design tokens in tokens.css work in both React and Svelte.
+ */
+export { Layout } from './layout';
+export type { LayoutProps } from './layout';
+export { Sidebar } from './sidebar';
+export type { SidebarProps, NavItem, NavGroup } from './sidebar';
+export { Header } from './header';
+export type { HeaderProps, BreadcrumbItem } from './header';
+export { Table } from './table';
+export type { TableProps, Column } from './table';
+export { Form } from './form';
+export type { FormProps, FieldDef, FieldType, FieldOption } from './form';
+export { Crud } from './crud';
+export type { CrudProps } from './crud';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/dash/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dash/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAG3C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,YAAY,EAAE,YAAY,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAGhE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAG3D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,YAAY,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAGjD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AAGzE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA"}

package/dist/src/dash/index.js

@@ -0,0 +1,20 @@
+/**
+ * @hanzo/ui-shadcn/dash
+ *
+ * Shared dash UI foundation. Dark-themed layout, navigation,
+ * data table, form builder, and CRUD components.
+ *
+ * Design tokens in tokens.css work in both React and Svelte.
+ */
+// Layout
+export { Layout } from './layout';
+// Sidebar
+export { Sidebar } from './sidebar';
+// Header
+export { Header } from './header';
+// Data Table
+export { Table } from './table';
+// Form
+export { Form } from './form';
+// CRUD
+export { Crud } from './crud';

package/dist/src/dash/layout.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export interface LayoutProps {
+    /** Sidebar element (use Sidebar) */
+    sidebar: React.ReactNode;
+    /** Top header element (use Header) */
+    header?: React.ReactNode;
+    /** Main content */
+    children: React.ReactNode;
+    /** Whether the sidebar is collapsed */
+    sidebarCollapsed?: boolean;
+    /** Callback when sidebar collapse state changes */
+    onSidebarCollapse?: (collapsed: boolean) => void;
+    className?: string;
+}
+export declare function Layout({ sidebar, header, children, sidebarCollapsed, onSidebarCollapse, className, }: LayoutProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=layout.d.ts.map

package/dist/src/dash/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/dash/layout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,WAAW;IAC1B,oCAAoC;IACpC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,sCAAsC;IACtC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,mBAAmB;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,mDAAmD;IACnD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;IAChD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,MAAM,EACN,QAAQ,EACR,gBAAwB,EACxB,iBAAiB,EACjB,SAAS,GACV,EAAE,WAAW,2CAyCb"}

package/dist/src/dash/layout.js

@@ -0,0 +1,8 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../utils';
+export function Layout({ sidebar, header, children, sidebarCollapsed = false, onSidebarCollapse, className, }) {
+    return (_jsxs("div", { className: cn('flex h-screen overflow-hidden', 'bg-[var(--dash-bg)] text-[var(--dash-text)]', className), children: [_jsx("aside", { className: cn('flex-shrink-0 overflow-y-auto overflow-x-hidden transition-[width] duration-200', 'border-r border-[var(--dash-border)] bg-[var(--dash-surface)]', sidebarCollapsed
+                    ? 'w-[var(--dash-sidebar-collapsed-width)]'
+                    : 'w-[var(--dash-sidebar-width)]'), children: sidebar }), _jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [header && (_jsx("header", { className: "flex-shrink-0 border-b border-[var(--dash-border)] bg-[var(--dash-surface)]", children: header })), _jsx("main", { className: "flex-1 overflow-y-auto p-6", children: children })] }), !sidebarCollapsed && (_jsx("div", { className: "fixed inset-0 z-40 bg-black/60 lg:hidden", onClick: () => onSidebarCollapse?.(true) }))] }));
+}

package/dist/src/dash/sidebar.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+export interface NavItem {
+    label: string;
+    href: string;
+    icon?: React.ReactNode;
+    badge?: string | number;
+    active?: boolean;
+}
+export interface NavGroup {
+    title?: string;
+    items: NavItem[];
+    collapsible?: boolean;
+    defaultOpen?: boolean;
+}
+export interface SidebarProps {
+    /** Logo or brand element rendered at the top */
+    logo?: React.ReactNode;
+    /** Navigation groups */
+    groups: NavGroup[];
+    /** User menu rendered at the bottom */
+    userMenu?: React.ReactNode;
+    /** Whether the sidebar is collapsed (icon-only mode) */
+    collapsed?: boolean;
+    /** Toggle collapse */
+    onToggleCollapse?: () => void;
+    /** Called when a nav item is clicked */
+    onNavigate?: (href: string) => void;
+    className?: string;
+}
+export declare function Sidebar({ logo, groups, userMenu, collapsed, onToggleCollapse, onNavigate, className, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sidebar.d.ts.map

package/dist/src/dash/sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/dash/sidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,OAAO,EAAE,CAAA;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAED,MAAM,WAAW,YAAY;IAC3B,gDAAgD;IAChD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,wBAAwB;IACxB,MAAM,EAAE,QAAQ,EAAE,CAAA;IAClB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,sBAAsB;IACtB,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,wCAAwC;IACxC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA2BD,wBAAgB,OAAO,CAAC,EACtB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAiB,EACjB,gBAAgB,EAChB,UAAU,EACV,SAAS,GACV,EAAE,YAAY,2CA+Dd"}

package/dist/src/dash/sidebar.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../../utils';
+/* ------------------------------------------------------------------ */
+/*  Hanzo H mark (default logo)                                       */
+/* ------------------------------------------------------------------ */
+function HanzoMark({ size = 28 }) {
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M4 4h4v6h8V4h4v16h-4v-6H8v6H4V4z", fill: "currentColor" }) }));
+}
+/* ------------------------------------------------------------------ */
+/*  Component                                                         */
+/* ------------------------------------------------------------------ */
+export function Sidebar({ logo, groups, userMenu, collapsed = false, onToggleCollapse, onNavigate, className, }) {
+    return (_jsxs("nav", { className: cn('flex h-full flex-col', 'bg-[var(--dash-surface)] text-[var(--dash-text)]', className), children: [_jsxs("div", { className: cn('flex h-[var(--dash-header-height)] items-center border-b border-[var(--dash-border)]', collapsed ? 'justify-center px-2' : 'px-4'), children: [logo ?? _jsx(HanzoMark, {}), !collapsed && onToggleCollapse && (_jsx("button", { type: "button", onClick: onToggleCollapse, className: "ml-auto rounded p-1 text-[var(--dash-text-dim)] hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)]", "aria-label": "Collapse sidebar", children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M10 4L6 8l4 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })), collapsed && onToggleCollapse && (_jsx("button", { type: "button", onClick: onToggleCollapse, className: "absolute -right-3 top-4 z-50 hidden rounded-full border border-[var(--dash-border)] bg-[var(--dash-surface)] p-1 text-[var(--dash-text-dim)] hover:text-[var(--dash-text)] lg:flex", "aria-label": "Expand sidebar", children: _jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M6 4l4 4-4 4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) }))] }), _jsx("div", { className: "flex-1 overflow-y-auto py-2", children: groups.map((group, gi) => (_jsx(SidebarGroup, { group: group, collapsed: collapsed, onNavigate: onNavigate }, gi))) }), userMenu && (_jsx("div", { className: "border-t border-[var(--dash-border)] p-2", children: userMenu }))] }));
+}
+/* ------------------------------------------------------------------ */
+/*  SidebarGroup (internal)                                           */
+/* ------------------------------------------------------------------ */
+function SidebarGroup({ group, collapsed, onNavigate, }) {
+    const [open, setOpen] = React.useState(group.defaultOpen !== false);
+    const isCollapsible = group.collapsible !== false && !!group.title;
+    return (_jsxs("div", { className: "mb-1", children: [group.title && !collapsed && (_jsxs("button", { type: "button", onClick: () => isCollapsible && setOpen((o) => !o), className: cn('flex w-full items-center px-4 py-1.5 text-[11px] font-semibold uppercase tracking-wider text-[var(--dash-text-dim)]', isCollapsible && 'cursor-pointer hover:text-[var(--dash-text-muted)]'), children: [_jsx("span", { className: "flex-1 text-left", children: group.title }), isCollapsible && (_jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "none", className: cn('transition-transform', open ? 'rotate-0' : '-rotate-90'), children: _jsx("path", { d: "M4 6l4 4 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }))] })), (open || collapsed) && (_jsx("ul", { className: "space-y-0.5 px-2", children: group.items.map((item) => (_jsx("li", { children: _jsxs("button", { type: "button", onClick: () => onNavigate?.(item.href), title: collapsed ? item.label : undefined, className: cn('flex w-full items-center gap-2 rounded-[var(--dash-radius-sm)] px-2 py-1.5 text-sm transition-colors', item.active
+                            ? 'bg-[var(--dash-primary)] text-[var(--dash-primary-text)]'
+                            : 'text-[var(--dash-text-muted)] hover:bg-[var(--dash-surface-hover)] hover:text-[var(--dash-text)]', collapsed && 'justify-center px-0'), children: [item.icon && (_jsx("span", { className: "flex h-5 w-5 items-center justify-center flex-shrink-0", children: item.icon })), !collapsed && _jsx("span", { className: "flex-1 truncate text-left", children: item.label }), !collapsed && item.badge !== undefined && (_jsx("span", { className: "ml-auto rounded-full bg-[var(--dash-primary)] px-1.5 py-0.5 text-[10px] font-medium text-[var(--dash-primary-text)]", children: item.badge }))] }) }, item.href))) }))] }));
+}