@hanzo/ui 8.0.26 → 8.0.28

package/dist/product/ComboBox.js

@@ -0,0 +1,42 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * ComboBox — a typeable select: a text input the user can type any value into, PLUS a
+ * menu of LIVE options (filtered by what's typed) they can pick from. The value is
+ * always exactly the input text, so a custom id is inherently supported. Prop-driven +
+ * self-contained (options/loading/error injected by the caller).
+ *
+ * Uses the ONE shared menu spec (MenuItemView) + FloatingMenu (gui Portal) so options look
+ * identical to every other menu and render correctly through the portal under a nested
+ * `<Theme>` on gui-native hosts. The input row is the anchor (excluded from dismiss) and
+ * the panel does NOT steal focus, so typing keeps filtering.
+ */
+import { useCallback, useMemo, useRef, useState } from 'react';
+import { Button, Input, Spinner, Text, XStack } from '@hanzo/gui';
+import { ChevronDown, RefreshCw } from '@hanzogui/lucide-icons-2';
+import { useEmit } from './instrument.js';
+import { filterOptions } from './combobox/filter.js';
+import { MenuItemView } from './menu/items.js';
+import { FloatingMenu } from './menu/FloatingMenu.js';
+export function ComboBox({ value, onChange, options, loading = false, error = null, onRetry, placeholder, disabled, emptyText = 'No matches — press to use what you typed.', minWidth = 240, }) {
+    const [open, setOpen] = useState(false);
+    const rowRef = useRef(null);
+    const anchorRect = useCallback(() => rowRef.current?.getBoundingClientRect() ?? null, []);
+    const anchorEl = useCallback(() => rowRef.current, []);
+    const filtered = useMemo(() => filterOptions(options, value), [options, value]);
+    const track = useEmit();
+    const pick = (v) => {
+        track({ component: 'ComboBox', action: 'select', id: v, value: filtered.length });
+        onChange(v);
+        setOpen(false);
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs(XStack, { ref: rowRef, items: "center", gap: "$2", minW: minWidth, children: [_jsx(Input, { flex: 1, value: value, onChangeText: (v) => {
+                            onChange(v);
+                            if (!open)
+                                setOpen(true);
+                        }, onFocus: () => setOpen(true), disabled: disabled, placeholder: placeholder, autoCapitalize: "none" }), _jsx(Button, { size: "$2", chromeless: true, disabled: disabled, icon: _jsx(ChevronDown, { size: 16, opacity: 0.7 }), onPress: () => {
+                            track({ component: 'ComboBox', action: open ? 'close' : 'open' });
+                            setOpen((o) => !o);
+                        }, "aria-label": "Show options" })] }), _jsx(FloatingMenu, { open: open, onClose: () => setOpen(false), anchorRect: anchorRect, anchorEl: anchorEl, autoFocus: false, minWidth: minWidth, maxHeight: 300, children: loading ? (_jsxs(XStack, { items: "center", gap: "$2", px: "$2", py: "$2", children: [_jsx(Spinner, { size: "small", color: "$color11" }), _jsx(Text, { fontSize: "$2", color: "$color10", children: "Loading options\u2026" })] })) : error ? (_jsxs(XStack, { items: "center", gap: "$2", px: "$2", py: "$2", children: [_jsx(Text, { fontSize: "$2", color: "$color10", flex: 1, numberOfLines: 2, children: error }), onRetry ? (_jsx(Button, { size: "$1", chromeless: true, icon: _jsx(RefreshCw, { size: 12 }), onPress: onRetry, "aria-label": "Retry" })) : null] })) : filtered.length === 0 ? (_jsx(Text, { fontSize: "$2", color: "$color10", px: "$2", py: "$2", children: emptyText })) : (filtered.map((o) => (_jsx(MenuItemView, { label: o.label ?? o.value, description: o.hint, selected: o.value === value, onSelect: () => pick(o.value) }, o.value)))) })] }));
+}
+//# sourceMappingURL=ComboBox.js.map

package/dist/product/ComboBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["../../src/product/ComboBox.tsx"],"names":[],"mappings":"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"}

package/dist/product/CommerceResource.cjs

@@ -0,0 +1,39 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CommerceResource = CommerceResource;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * CommerceResource — the ONE list surface every Commerce store page renders (Products,
+ * Orders, Customers, Inventory, Promotions). It owns the fetch → honest loading / empty
+ * / error lifecycle (identical to the Subscriptions/Functions modules) so each page is
+ * just a title + a `load()` + its columns; there is one way to render a store list.
+ *
+ * `load` is held in a ref so a page can pass an inline `() => CommerceApi.products()`
+ * without re-triggering the mount effect — the list fetches once and on explicit
+ * Refresh. Every row is real (the caller's org-scoped `/v1` fetch); an empty store
+ * shows the honest empty copy, never a placeholder row. Both the console's Store
+ * category and the standalone Commerce admin render THIS.
+ */
+const react_1 = require("react");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const PageHeader_1 = require("./PageHeader.cjs");
+const DataTable_1 = require("./DataTable.cjs");
+const BackendState_1 = require("./BackendState.cjs");
+function CommerceResource({ title, subtitle, load, columns, rowKey, empty, hint, actions, }) {
+    const [state, setState] = (0, react_1.useState)({ phase: 'loading' });
+    const loadRef = (0, react_1.useRef)(load);
+    loadRef.current = load;
+    const reload = (0, react_1.useCallback)(() => {
+        setState({ phase: 'loading' });
+        loadRef
+            .current()
+            .then((r) => setState({ phase: 'ready', data: r.rows }))
+            .catch((e) => setState({ phase: 'error', error: (0, BackendState_1.classifyBackend)(e) }));
+    }, []);
+    (0, react_1.useEffect)(() => {
+        reload();
+    }, [reload]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PageHeader_1.PageHeader, { title: title, subtitle: subtitle, actions: (0, jsx_runtime_1.jsxs)(gui_1.XStack, { gap: "$2", children: [actions?.(reload), (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "$2", icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.RefreshCw, { size: 15 }), onPress: reload, children: "Refresh" })] }) }), state.phase === 'error' ? ((0, jsx_runtime_1.jsx)(BackendState_1.BackendStateCard, { state: state.error, onRetry: reload, hint: hint })) : ((0, jsx_runtime_1.jsx)(DataTable_1.DataTable, { columns: columns, rows: state.phase === 'ready' ? state.data : [], loading: state.phase === 'loading', rowKey: rowKey, empty: empty }))] }));
+}

package/dist/product/CommerceResource.d.ts

@@ -11,7 +11,7 @@
  * category and the standalone Commerce admin render THIS.
  */
 import { type ReactNode } from 'react';
-import { type Column } from './DataTable';
+import { type Column } from './DataTable.js';
 /** A commerce list page — the rows on this page plus the total the backend reports. */
 export type CommerceList<T> = {
     rows: T[];
@@ -30,3 +30,4 @@ export declare function CommerceResource<T>({ title, subtitle, load, columns, ro
     /** Optional extra header actions (given the reload fn), left of Refresh. */
     actions?: (reload: () => void) => ReactNode;
 }): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CommerceResource.d.ts.map

package/dist/product/CommerceResource.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommerceResource.d.ts","sourceRoot":"","sources":["../../src/product/CommerceResource.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAKhF,OAAO,EAAa,KAAK,MAAM,EAAE,MAAM,aAAa,CAAA;AAGpD,uFAAuF;AACvF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI;IAAE,IAAI,EAAE,CAAC,EAAE,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAI1D,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,EAClC,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,KAAK,EACL,IAAI,EACJ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,sFAAsF;IACtF,IAAI,EAAE,MAAM,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAA;IACpC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAA;IACpB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAA;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,IAAI,EAAE,MAAM,CAAA;IACZ,4EAA4E;IAC5E,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,IAAI,KAAK,SAAS,CAAA;CAC5C,2CA6CA"}

package/dist/product/CommerceResource.js

@@ -0,0 +1,37 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * CommerceResource — the ONE list surface every Commerce store page renders (Products,
+ * Orders, Customers, Inventory, Promotions). It owns the fetch → honest loading / empty
+ * / error lifecycle (identical to the Subscriptions/Functions modules) so each page is
+ * just a title + a `load()` + its columns; there is one way to render a store list.
+ *
+ * `load` is held in a ref so a page can pass an inline `() => CommerceApi.products()`
+ * without re-triggering the mount effect — the list fetches once and on explicit
+ * Refresh. Every row is real (the caller's org-scoped `/v1` fetch); an empty store
+ * shows the honest empty copy, never a placeholder row. Both the console's Store
+ * category and the standalone Commerce admin render THIS.
+ */
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Button, XStack } from '@hanzo/gui';
+import { RefreshCw } from '@hanzogui/lucide-icons-2';
+import { PageHeader } from './PageHeader.js';
+import { DataTable } from './DataTable.js';
+import { BackendStateCard, classifyBackend } from './BackendState.js';
+export function CommerceResource({ title, subtitle, load, columns, rowKey, empty, hint, actions, }) {
+    const [state, setState] = useState({ phase: 'loading' });
+    const loadRef = useRef(load);
+    loadRef.current = load;
+    const reload = useCallback(() => {
+        setState({ phase: 'loading' });
+        loadRef
+            .current()
+            .then((r) => setState({ phase: 'ready', data: r.rows }))
+            .catch((e) => setState({ phase: 'error', error: classifyBackend(e) }));
+    }, []);
+    useEffect(() => {
+        reload();
+    }, [reload]);
+    return (_jsxs(_Fragment, { children: [_jsx(PageHeader, { title: title, subtitle: subtitle, actions: _jsxs(XStack, { gap: "$2", children: [actions?.(reload), _jsx(Button, { size: "$2", icon: _jsx(RefreshCw, { size: 15 }), onPress: reload, children: "Refresh" })] }) }), state.phase === 'error' ? (_jsx(BackendStateCard, { state: state.error, onRetry: reload, hint: hint })) : (_jsx(DataTable, { columns: columns, rows: state.phase === 'ready' ? state.data : [], loading: state.phase === 'loading', rowKey: rowKey, empty: empty }))] }));
+}
+//# sourceMappingURL=CommerceResource.js.map

package/dist/product/CommerceResource.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommerceResource.js","sourceRoot":"","sources":["../../src/product/CommerceResource.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AAChF,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,SAAS,EAAe,MAAM,aAAa,CAAA;AACpD,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAqB,MAAM,gBAAgB,CAAA;AAOrF,MAAM,UAAU,gBAAgB,CAAI,EAClC,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,KAAK,EACL,IAAI,EACJ,OAAO,GAaR;IACC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAa,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAA;IACpE,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAC5B,OAAO,CAAC,OAAO,GAAG,IAAI,CAAA;IAEtB,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,QAAQ,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAA;QAC9B,OAAO;aACJ,OAAO,EAAE;aACT,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;aACvD,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;IAC1E,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,CAAA;IACV,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEZ,OAAO,CACL,8BACE,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EACL,MAAC,MAAM,IAAC,GAAG,EAAC,IAAI,aACb,OAAO,EAAE,CAAC,MAAM,CAAC,EAClB,KAAC,MAAM,IAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,KAAC,SAAS,IAAC,IAAI,EAAE,EAAE,GAAI,EAAE,OAAO,EAAE,MAAM,wBAEvD,IACF,GAEX,EAED,KAAK,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,CACzB,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAI,CACtE,CAAC,CAAC,CAAC,CACF,KAAC,SAAS,IACR,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,KAAK,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAC/C,OAAO,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,EAClC,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,GACZ,CACH,IACA,CACJ,CAAA;AACH,CAAC"}

package/dist/product/ConfirmDelete.cjs

@@ -0,0 +1,42 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfirmDelete = ConfirmDelete;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * The console's ONE destructive-confirm panel, rendered inside a `SlideOver`.
+ *
+ * A delete is the only irreversible action a product module offers, so it gets a
+ * single shared shape: the consequence stated in full, a red confirm, a cancel, and
+ * an inline honest error (via `classifyBackend`) when the call fails — the panel
+ * stays open on failure so the user sees WHY instead of a silently-closed drawer.
+ */
+const react_1 = require("react");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const BackendState_1 = require("./BackendState.cjs");
+const instrument_1 = require("./instrument.cjs");
+function ConfirmDelete({ message, confirmLabel, run, onDone, }) {
+    const [busy, setBusy] = (0, react_1.useState)(false);
+    const [err, setErr] = (0, react_1.useState)(null);
+    const track = (0, instrument_1.useEmit)();
+    const go = async () => {
+        setBusy(true);
+        setErr(null);
+        track({ component: 'ConfirmDelete', action: 'confirm', id: confirmLabel });
+        try {
+            await run();
+            onDone();
+        }
+        catch (e) {
+            const message = (0, BackendState_1.classifyBackend)(e).message || 'Failed to delete.';
+            track({ component: 'ConfirmDelete', action: 'error', id: confirmLabel, value: message });
+            setErr(message);
+            setBusy(false);
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$3", children: [(0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$3", color: "$color11", children: message }), err ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$2", color: "$red10", children: err })) : null, (0, jsx_runtime_1.jsxs)(gui_1.XStack, { gap: "$2", flexWrap: "wrap", children: [(0, jsx_runtime_1.jsx)(gui_1.Button, { onPress: go, disabled: busy, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Trash2, { size: 15 }), style: { backgroundColor: '#dc2626', borderColor: '#dc2626', color: '#fff' }, children: busy ? 'Deleting…' : confirmLabel }), (0, jsx_runtime_1.jsx)(gui_1.Button, { chromeless: true, onPress: () => {
+                            track({ component: 'ConfirmDelete', action: 'cancel', id: confirmLabel });
+                            onDone();
+                        }, disabled: busy, children: "Cancel" })] })] }));
+}

package/dist/product/ConfirmDelete.d.ts

@@ -6,3 +6,4 @@ export declare function ConfirmDelete({ message, confirmLabel, run, onDone, }: {
     /** Called on success AND on cancel — the caller closes the drawer and reloads. */
     onDone: () => void;
 }): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ConfirmDelete.d.ts.map

package/dist/product/ConfirmDelete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmDelete.d.ts","sourceRoot":"","sources":["../../src/product/ConfirmDelete.tsx"],"names":[],"mappings":"AAiBA,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,YAAY,EACZ,GAAG,EACH,MAAM,GACP,EAAE;IACD,mFAAmF;IACnF,OAAO,EAAE,MAAM,CAAA;IACf,YAAY,EAAE,MAAM,CAAA;IACpB,GAAG,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IACxB,kFAAkF;IAClF,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB,2CAoDA"}

package/dist/product/ConfirmDelete.js

@@ -0,0 +1,40 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The console's ONE destructive-confirm panel, rendered inside a `SlideOver`.
+ *
+ * A delete is the only irreversible action a product module offers, so it gets a
+ * single shared shape: the consequence stated in full, a red confirm, a cancel, and
+ * an inline honest error (via `classifyBackend`) when the call fails — the panel
+ * stays open on failure so the user sees WHY instead of a silently-closed drawer.
+ */
+import { useState } from 'react';
+import { Button, Text, XStack, YStack } from '@hanzo/gui';
+import { Trash2 } from '@hanzogui/lucide-icons-2';
+import { classifyBackend } from './BackendState.js';
+import { useEmit } from './instrument.js';
+export function ConfirmDelete({ message, confirmLabel, run, onDone, }) {
+    const [busy, setBusy] = useState(false);
+    const [err, setErr] = useState(null);
+    const track = useEmit();
+    const go = async () => {
+        setBusy(true);
+        setErr(null);
+        track({ component: 'ConfirmDelete', action: 'confirm', id: confirmLabel });
+        try {
+            await run();
+            onDone();
+        }
+        catch (e) {
+            const message = classifyBackend(e).message || 'Failed to delete.';
+            track({ component: 'ConfirmDelete', action: 'error', id: confirmLabel, value: message });
+            setErr(message);
+            setBusy(false);
+        }
+    };
+    return (_jsxs(YStack, { gap: "$3", children: [_jsx(Text, { fontSize: "$3", color: "$color11", children: message }), err ? (_jsx(Text, { fontSize: "$2", color: "$red10", children: err })) : null, _jsxs(XStack, { gap: "$2", flexWrap: "wrap", children: [_jsx(Button, { onPress: go, disabled: busy, icon: _jsx(Trash2, { size: 15 }), style: { backgroundColor: '#dc2626', borderColor: '#dc2626', color: '#fff' }, children: busy ? 'Deleting…' : confirmLabel }), _jsx(Button, { chromeless: true, onPress: () => {
+                            track({ component: 'ConfirmDelete', action: 'cancel', id: confirmLabel });
+                            onDone();
+                        }, disabled: busy, children: "Cancel" })] })] }));
+}
+//# sourceMappingURL=ConfirmDelete.js.map

package/dist/product/ConfirmDelete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmDelete.js","sourceRoot":"","sources":["../../src/product/ConfirmDelete.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;GAOG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAA;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAEtC,MAAM,UAAU,aAAa,CAAC,EAC5B,OAAO,EACP,YAAY,EACZ,GAAG,EACH,MAAM,GAQP;IACC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACvC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IACnD,MAAM,KAAK,GAAG,OAAO,EAAE,CAAA;IAEvB,MAAM,EAAE,GAAG,KAAK,IAAI,EAAE;QACpB,OAAO,CAAC,IAAI,CAAC,CAAA;QACb,MAAM,CAAC,IAAI,CAAC,CAAA;QACZ,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,CAAA;QAC1E,IAAI,CAAC;YACH,MAAM,GAAG,EAAE,CAAA;YACX,MAAM,EAAE,CAAA;QACV,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,mBAAmB,CAAA;YACjE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAA;YACxF,MAAM,CAAC,OAAO,CAAC,CAAA;YACf,OAAO,CAAC,KAAK,CAAC,CAAA;QAChB,CAAC;IACH,CAAC,CAAA;IAED,OAAO,CACL,MAAC,MAAM,IAAC,GAAG,EAAC,IAAI,aACd,KAAC,IAAI,IAAC,QAAQ,EAAC,IAAI,EAAC,KAAK,EAAC,UAAU,YACjC,OAAO,GACH,EACN,GAAG,CAAC,CAAC,CAAC,CACL,KAAC,IAAI,IAAC,QAAQ,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,YAC/B,GAAG,GACC,CACR,CAAC,CAAC,CAAC,IAAI,EACR,MAAC,MAAM,IAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,aAC9B,KAAC,MAAM,IACL,OAAO,EAAE,EAAE,EACX,QAAQ,EAAE,IAAI,EACd,IAAI,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,EAAE,GAAI,EAC1B,KAAK,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,YAE3E,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,GAC3B,EACT,KAAC,MAAM,IACL,UAAU,QACV,OAAO,EAAE,GAAG,EAAE;4BACZ,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,CAAA;4BACzE,MAAM,EAAE,CAAA;wBACV,CAAC,EACD,QAAQ,EAAE,IAAI,uBAGP,IACF,IACF,CACV,CAAA;AACH,CAAC"}

package/dist/product/DataTable.cjs

@@ -0,0 +1,58 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataTable = DataTable;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const instrument_1 = require("./instrument.cjs");
+/** Skeleton rows in the real column layout — an honest "loading", never a void. */
+function SkeletonRows({ columns, count = 6 }) {
+    return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { children: Array.from({ length: count }).map((_, r) => ((0, jsx_runtime_1.jsx)(gui_1.XStack, { py: "$2.5", px: "$3", gap: "$3", borderTopWidth: 1, borderColor: "$borderColor", items: "center", children: columns.map((c, i) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, items: c.align === 'right' ? 'flex-end' : 'flex-start', children: (0, jsx_runtime_1.jsx)("div", { className: "hz-skeleton", style: { height: 12, borderRadius: 6, width: `${[62, 40, 54, 34, 48][(i + r) % 5]}%` }, "aria-hidden": true }) }, c.key))) }, r))) }));
+}
+function DataTable({ columns, rows, loading, empty = 'Nothing here yet.', rowKey, onRowPress, isRowExpanded, renderExpanded, sort, onSortChange, }) {
+    // Every table in the fleet reports the same two interactions with no app code.
+    const track = (0, instrument_1.useEmit)();
+    // Natural min-width of the table: the sum of the declared column widths, with a
+    // sensible floor for flex columns, plus row padding + inter-column gaps. On a
+    // narrow (mobile) viewport where this exceeds the container, the inner wrapper
+    // scrolls HORIZONTALLY instead of clipping the last columns (the old
+    // `overflow:hidden` cut the right edge off, e.g. the Status column). On desktop
+    // the flex columns still expand to fill, so wide screens are unchanged.
+    const minTableW = columns.reduce((sum, c) => sum + (c.width ?? FLEX_MIN_COL_W), 0) + (columns.length + 1) * 12;
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$4", overflow: "hidden", children: [(0, jsx_runtime_1.jsx)(gui_1.YStack, { style: { overflowX: 'auto', overflowY: 'visible' }, children: (0, jsx_runtime_1.jsxs)(gui_1.YStack, { minW: minTableW, children: [(0, jsx_runtime_1.jsx)(gui_1.XStack, { bg: "$color1", py: "$2.5", px: "$3", gap: "$3", borderBottomWidth: 1, borderColor: "$borderColor", role: "row", children: columns.map((c) => {
+                                // Sortable needs BOTH the column opt-in and a caller handler — a column
+                                // can never look clickable with nothing listening.
+                                const sortable = c.sortable === true && !!onSortChange;
+                                const active = sortable && sort?.key === c.key;
+                                const Caret = !sortable ? null : !active ? lucide_icons_2_1.ChevronsUpDown : sort?.dir === 'asc' ? lucide_icons_2_1.ChevronUp : lucide_icons_2_1.ChevronDown;
+                                return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, items: "center", gap: "$1", justify: c.align === 'right' ? 'flex-end' : 'flex-start', role: "columnheader", "aria-sort": sortable ? (active ? (sort?.dir === 'asc' ? 'ascending' : 'descending') : 'none') : undefined, "aria-label": sortable ? `Sort by ${c.header}` : undefined, cursor: sortable ? 'pointer' : undefined, hoverStyle: sortable ? { opacity: 0.75 } : undefined, onPress: sortable
+                                        ? () => {
+                                            track({ component: 'DataTable', action: 'sort', id: c.key, value: sort?.key === c.key && sort?.dir === 'asc' ? 'desc' : 'asc' });
+                                            onSortChange?.(c.key);
+                                        }
+                                        : undefined, children: [(0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$1", fontWeight: "500", color: active ? '$color12' : '$color10', text: c.align === 'right' ? 'right' : 'left', className: c.mono ? 'hz-tnum' : undefined, children: c.header }), Caret ? (0, jsx_runtime_1.jsx)(Caret, { size: 12, color: active ? '$color12' : '$color9' }) : null] }, c.key));
+                            }) }), loading ? ((0, jsx_runtime_1.jsx)(SkeletonRows, { columns: columns })) : rows.length > 0 ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { children: rows.map((row) => {
+                                const expanded = (isRowExpanded?.(row) ?? false) && !!renderExpanded;
+                                return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { children: [(0, jsx_runtime_1.jsx)(gui_1.XStack, { className: "hz-row", py: "$2.5", px: "$3", gap: "$3", borderTopWidth: 1, borderColor: "$borderColor", items: "center", bg: expanded ? '$color2' : undefined, hoverStyle: onRowPress ? { bg: '$color2' } : undefined, cursor: onRowPress ? 'pointer' : undefined, onPress: onRowPress
+                                                ? () => {
+                                                    track({ component: 'DataTable', action: 'select', id: rowKey(row), value: rows.length });
+                                                    onRowPress(row);
+                                                }
+                                                : undefined, children: columns.map((c) => {
+                                                // A cell value is either a column's rendered node or the raw
+                                                // `String(row[key])`. Whenever it resolves to a PRIMITIVE
+                                                // (string|number) — the default cell OR a `render()` that returns
+                                                // `String(count)` / `ttl` / `priority` — it is wrapped in the ONE
+                                                // styled Text below, so the primitive can never emit a bare text
+                                                // node (illegal under a native View → RN red-box + console spam)
+                                                // and always picks up the numeric mono/align styling. Element
+                                                // renders (Text/badges/cells) pass through untouched.
+                                                const cell = c.render ? c.render(row) : String(row[c.key] ?? '');
+                                                return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, justify: "center", items: c.align === 'right' ? 'flex-end' : 'flex-start', children: typeof cell === 'string' || typeof cell === 'number' ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$3", numberOfLines: 1, color: "$color12", text: c.align === 'right' ? 'right' : 'left', className: c.mono ? 'hz-mono' : undefined, children: cell })) : (cell) }, c.key));
+                                            }) }), expanded && renderExpanded ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { borderTopWidth: 1, borderColor: "$borderColor", bg: "$color1", children: renderExpanded(row) })) : null] }, rowKey(row)));
+                            }) })) : null] }) }), !loading && rows.length === 0 ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { py: "$8", px: "$4", items: "center", gap: "$1", borderTopWidth: 1, borderColor: "$borderColor", children: (0, jsx_runtime_1.jsx)(gui_1.Text, { color: "$color10", fontSize: "$3", text: "center", children: empty }) })) : null] }));
+}
+/** Min width for a flex (no explicit `width`) column, so the table has a natural
+ *  size to scroll to on mobile instead of squishing/clipping its cells. */
+const FLEX_MIN_COL_W = 120;

package/dist/product/DataTable.d.ts

@@ -50,3 +50,4 @@ export declare function DataTable<T>({ columns, rows, loading, empty, rowKey, on
     /** Called with the clicked column key; the caller owns the reordering. */
     onSortChange?: (key: string) => void;
 }): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DataTable.d.ts.map

package/dist/product/DataTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../src/product/DataTable.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtC,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI;IACtB,GAAG,EAAE,MAAM,CAAA;IACX,MAAM,EAAE,MAAM,CAAA;IACd,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,SAAS,CAAA;IAC9B,yDAAyD;IACzD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACxB,sFAAsF;IACtF,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,2DAA2D;AAC3D,MAAM,MAAM,SAAS,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE,CAAA;AAuB5D,wBAAgB,SAAS,CAAC,CAAC,EAAE,EAC3B,OAAO,EACP,IAAI,EACJ,OAAO,EACP,KAA2B,EAC3B,MAAM,EACN,UAAU,EACV,aAAa,EACb,cAAc,EACd,IAAI,EACJ,YAAY,GACb,EAAE;IACD,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAA;IACpB,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAA;IAC1B,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAA;IAC7B,+EAA+E;IAC/E,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,OAAO,CAAA;IACnC,wFAAwF;IACxF,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,SAAS,CAAA;IACtC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACrC,2CAuJA"}

package/dist/product/DataTable.js

@@ -0,0 +1,56 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text, XStack, YStack } from '@hanzo/gui';
+import { ChevronDown, ChevronsUpDown, ChevronUp } from '@hanzogui/lucide-icons-2';
+import { useEmit } from './instrument.js';
+/** Skeleton rows in the real column layout — an honest "loading", never a void. */
+function SkeletonRows({ columns, count = 6 }) {
+    return (_jsx(YStack, { children: Array.from({ length: count }).map((_, r) => (_jsx(XStack, { py: "$2.5", px: "$3", gap: "$3", borderTopWidth: 1, borderColor: "$borderColor", items: "center", children: columns.map((c, i) => (_jsx(YStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, items: c.align === 'right' ? 'flex-end' : 'flex-start', children: _jsx("div", { className: "hz-skeleton", style: { height: 12, borderRadius: 6, width: `${[62, 40, 54, 34, 48][(i + r) % 5]}%` }, "aria-hidden": true }) }, c.key))) }, r))) }));
+}
+export function DataTable({ columns, rows, loading, empty = 'Nothing here yet.', rowKey, onRowPress, isRowExpanded, renderExpanded, sort, onSortChange, }) {
+    // Every table in the fleet reports the same two interactions with no app code.
+    const track = useEmit();
+    // Natural min-width of the table: the sum of the declared column widths, with a
+    // sensible floor for flex columns, plus row padding + inter-column gaps. On a
+    // narrow (mobile) viewport where this exceeds the container, the inner wrapper
+    // scrolls HORIZONTALLY instead of clipping the last columns (the old
+    // `overflow:hidden` cut the right edge off, e.g. the Status column). On desktop
+    // the flex columns still expand to fill, so wide screens are unchanged.
+    const minTableW = columns.reduce((sum, c) => sum + (c.width ?? FLEX_MIN_COL_W), 0) + (columns.length + 1) * 12;
+    return (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$4", overflow: "hidden", children: [_jsx(YStack, { style: { overflowX: 'auto', overflowY: 'visible' }, children: _jsxs(YStack, { minW: minTableW, children: [_jsx(XStack, { bg: "$color1", py: "$2.5", px: "$3", gap: "$3", borderBottomWidth: 1, borderColor: "$borderColor", role: "row", children: columns.map((c) => {
+                                // Sortable needs BOTH the column opt-in and a caller handler — a column
+                                // can never look clickable with nothing listening.
+                                const sortable = c.sortable === true && !!onSortChange;
+                                const active = sortable && sort?.key === c.key;
+                                const Caret = !sortable ? null : !active ? ChevronsUpDown : sort?.dir === 'asc' ? ChevronUp : ChevronDown;
+                                return (_jsxs(XStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, items: "center", gap: "$1", justify: c.align === 'right' ? 'flex-end' : 'flex-start', role: "columnheader", "aria-sort": sortable ? (active ? (sort?.dir === 'asc' ? 'ascending' : 'descending') : 'none') : undefined, "aria-label": sortable ? `Sort by ${c.header}` : undefined, cursor: sortable ? 'pointer' : undefined, hoverStyle: sortable ? { opacity: 0.75 } : undefined, onPress: sortable
+                                        ? () => {
+                                            track({ component: 'DataTable', action: 'sort', id: c.key, value: sort?.key === c.key && sort?.dir === 'asc' ? 'desc' : 'asc' });
+                                            onSortChange?.(c.key);
+                                        }
+                                        : undefined, children: [_jsx(Text, { fontSize: "$1", fontWeight: "500", color: active ? '$color12' : '$color10', text: c.align === 'right' ? 'right' : 'left', className: c.mono ? 'hz-tnum' : undefined, children: c.header }), Caret ? _jsx(Caret, { size: 12, color: active ? '$color12' : '$color9' }) : null] }, c.key));
+                            }) }), loading ? (_jsx(SkeletonRows, { columns: columns })) : rows.length > 0 ? (_jsx(YStack, { children: rows.map((row) => {
+                                const expanded = (isRowExpanded?.(row) ?? false) && !!renderExpanded;
+                                return (_jsxs(YStack, { children: [_jsx(XStack, { className: "hz-row", py: "$2.5", px: "$3", gap: "$3", borderTopWidth: 1, borderColor: "$borderColor", items: "center", bg: expanded ? '$color2' : undefined, hoverStyle: onRowPress ? { bg: '$color2' } : undefined, cursor: onRowPress ? 'pointer' : undefined, onPress: onRowPress
+                                                ? () => {
+                                                    track({ component: 'DataTable', action: 'select', id: rowKey(row), value: rows.length });
+                                                    onRowPress(row);
+                                                }
+                                                : undefined, children: columns.map((c) => {
+                                                // A cell value is either a column's rendered node or the raw
+                                                // `String(row[key])`. Whenever it resolves to a PRIMITIVE
+                                                // (string|number) — the default cell OR a `render()` that returns
+                                                // `String(count)` / `ttl` / `priority` — it is wrapped in the ONE
+                                                // styled Text below, so the primitive can never emit a bare text
+                                                // node (illegal under a native View → RN red-box + console spam)
+                                                // and always picks up the numeric mono/align styling. Element
+                                                // renders (Text/badges/cells) pass through untouched.
+                                                const cell = c.render ? c.render(row) : String(row[c.key] ?? '');
+                                                return (_jsx(YStack, { width: c.width, flex: c.width ? undefined : 1, minW: c.width ? undefined : FLEX_MIN_COL_W, justify: "center", items: c.align === 'right' ? 'flex-end' : 'flex-start', children: typeof cell === 'string' || typeof cell === 'number' ? (_jsx(Text, { fontSize: "$3", numberOfLines: 1, color: "$color12", text: c.align === 'right' ? 'right' : 'left', className: c.mono ? 'hz-mono' : undefined, children: cell })) : (cell) }, c.key));
+                                            }) }), expanded && renderExpanded ? (_jsx(YStack, { borderTopWidth: 1, borderColor: "$borderColor", bg: "$color1", children: renderExpanded(row) })) : null] }, rowKey(row)));
+                            }) })) : null] }) }), !loading && rows.length === 0 ? (_jsx(YStack, { py: "$8", px: "$4", items: "center", gap: "$1", borderTopWidth: 1, borderColor: "$borderColor", children: _jsx(Text, { color: "$color10", fontSize: "$3", text: "center", children: empty }) })) : null] }));
+}
+/** Min width for a flex (no explicit `width`) column, so the table has a natural
+ *  size to scroll to on mobile instead of squishing/clipping its cells. */
+const FLEX_MIN_COL_W = 120;
+//# sourceMappingURL=DataTable.js.map

package/dist/product/DataTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/product/DataTable.tsx"],"names":[],"mappings":"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"}

package/dist/product/Donut.cjs

@@ -0,0 +1,25 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Donut = Donut;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function Donut({ segments, size = 160, thickness = 18, centerValue, centerLabel, trackColor = '#2a2d2e', valueColor = '#ecedee', labelColor = '#9ba1a6', }) {
+    const total = segments.reduce((n, s) => n + Math.max(0, s.value), 0);
+    if (total <= 0)
+        return null;
+    const r = (size - thickness) / 2;
+    const cx = size / 2;
+    const cy = size / 2;
+    const circ = 2 * Math.PI * r;
+    let offset = 0;
+    const arcs = segments
+        .filter((s) => s.value > 0)
+        .map((s) => {
+        const frac = s.value / total;
+        const dash = frac * circ;
+        const node = ((0, jsx_runtime_1.jsx)("circle", { cx: cx, cy: cy, r: r, fill: "none", stroke: s.color, strokeWidth: thickness, strokeDasharray: `${dash} ${circ - dash}`, strokeDashoffset: -offset }, s.label));
+        offset += dash;
+        return node;
+    });
+    return ((0, jsx_runtime_1.jsxs)("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, role: "img", "aria-label": "Donut chart", children: [(0, jsx_runtime_1.jsx)("circle", { cx: cx, cy: cy, r: r, fill: "none", stroke: trackColor, strokeWidth: thickness }), (0, jsx_runtime_1.jsx)("g", { transform: `rotate(-90 ${cx} ${cy})`, children: arcs }), centerValue ? ((0, jsx_runtime_1.jsx)("text", { x: cx, y: cy - 2, textAnchor: "middle", fontSize: size * 0.2, fontWeight: "800", fill: valueColor, children: centerValue })) : null, centerLabel ? ((0, jsx_runtime_1.jsx)("text", { x: cx, y: cy + size * 0.13, textAnchor: "middle", fontSize: size * 0.08, fill: labelColor, children: centerLabel })) : null] }));
+}

package/dist/product/Donut.d.ts

@@ -23,3 +23,4 @@ export declare function Donut({ segments, size, thickness, centerValue, centerLa
     valueColor?: string;
     labelColor?: string;
 }): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Donut.d.ts.map

package/dist/product/Donut.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Donut.d.ts","sourceRoot":"","sources":["../../src/product/Donut.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,MAAM,MAAM,YAAY,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAE1E,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,IAAU,EACV,SAAc,EACd,WAAW,EACX,WAAW,EACX,UAAsB,EACtB,UAAsB,EACtB,UAAsB,GACvB,EAAE;IACD,QAAQ,EAAE,YAAY,EAAE,CAAA;IACxB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iFAAiF;IACjF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,kDAkDA"}

package/dist/product/Donut.js

@@ -0,0 +1,23 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function Donut({ segments, size = 160, thickness = 18, centerValue, centerLabel, trackColor = '#2a2d2e', valueColor = '#ecedee', labelColor = '#9ba1a6', }) {
+    const total = segments.reduce((n, s) => n + Math.max(0, s.value), 0);
+    if (total <= 0)
+        return null;
+    const r = (size - thickness) / 2;
+    const cx = size / 2;
+    const cy = size / 2;
+    const circ = 2 * Math.PI * r;
+    let offset = 0;
+    const arcs = segments
+        .filter((s) => s.value > 0)
+        .map((s) => {
+        const frac = s.value / total;
+        const dash = frac * circ;
+        const node = (_jsx("circle", { cx: cx, cy: cy, r: r, fill: "none", stroke: s.color, strokeWidth: thickness, strokeDasharray: `${dash} ${circ - dash}`, strokeDashoffset: -offset }, s.label));
+        offset += dash;
+        return node;
+    });
+    return (_jsxs("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, role: "img", "aria-label": "Donut chart", children: [_jsx("circle", { cx: cx, cy: cy, r: r, fill: "none", stroke: trackColor, strokeWidth: thickness }), _jsx("g", { transform: `rotate(-90 ${cx} ${cy})`, children: arcs }), centerValue ? (_jsx("text", { x: cx, y: cy - 2, textAnchor: "middle", fontSize: size * 0.2, fontWeight: "800", fill: valueColor, children: centerValue })) : null, centerLabel ? (_jsx("text", { x: cx, y: cy + size * 0.13, textAnchor: "middle", fontSize: size * 0.08, fill: labelColor, children: centerLabel })) : null] }));
+}
+//# sourceMappingURL=Donut.js.map

package/dist/product/Donut.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Donut.js","sourceRoot":"","sources":["../../src/product/Donut.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAWZ,MAAM,UAAU,KAAK,CAAC,EACpB,QAAQ,EACR,IAAI,GAAG,GAAG,EACV,SAAS,GAAG,EAAE,EACd,WAAW,EACX,WAAW,EACX,UAAU,GAAG,SAAS,EACtB,UAAU,GAAG,SAAS,EACtB,UAAU,GAAG,SAAS,GAavB;IACC,MAAM,KAAK,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;IACpE,IAAI,KAAK,IAAI,CAAC;QAAE,OAAO,IAAI,CAAA;IAE3B,MAAM,CAAC,GAAG,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,CAAC,CAAA;IAChC,MAAM,EAAE,GAAG,IAAI,GAAG,CAAC,CAAA;IACnB,MAAM,EAAE,GAAG,IAAI,GAAG,CAAC,CAAA;IACnB,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;IAE5B,IAAI,MAAM,GAAG,CAAC,CAAA;IACd,MAAM,IAAI,GAAG,QAAQ;SAClB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;SAC1B,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;QACT,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,GAAG,KAAK,CAAA;QAC5B,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;QACxB,MAAM,IAAI,GAAG,CACX,iBAEE,EAAE,EAAE,EAAE,EACN,EAAE,EAAE,EAAE,EACN,CAAC,EAAE,CAAC,EACJ,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,CAAC,CAAC,KAAK,EACf,WAAW,EAAE,SAAS,EACtB,eAAe,EAAE,GAAG,IAAI,IAAI,IAAI,GAAG,IAAI,EAAE,EACzC,gBAAgB,EAAE,CAAC,MAAM,IARpB,CAAC,CAAC,KAAK,CASZ,CACH,CAAA;QACD,MAAM,IAAI,IAAI,CAAA;QACd,OAAO,IAAI,CAAA;IACb,CAAC,CAAC,CAAA;IAEJ,OAAO,CACL,eAAK,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,IAAI,IAAI,IAAI,EAAE,EAAE,IAAI,EAAC,KAAK,gBAAY,aAAa,aAEjG,iBAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,GAAI,EAExF,YAAG,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,YAAG,IAAI,GAAK,EAClD,WAAW,CAAC,CAAC,CAAC,CACb,eAAM,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,UAAU,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,GAAG,GAAG,EAAE,UAAU,EAAC,KAAK,EAAC,IAAI,EAAE,UAAU,YAChG,WAAW,GACP,CACR,CAAC,CAAC,CAAC,IAAI,EACP,WAAW,CAAC,CAAC,CAAC,CACb,eAAM,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,GAAG,IAAI,GAAG,IAAI,EAAE,UAAU,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,GAAG,IAAI,EAAE,IAAI,EAAE,UAAU,YAC1F,WAAW,GACP,CACR,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAA;AACH,CAAC"}

package/dist/product/EmptyState.cjs

@@ -0,0 +1,30 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmptyState = EmptyState;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const PrimaryButton_1 = require("./PrimaryButton.cjs");
+/** Open an external URL in a new tab (no-opener), guarded for SSR. */
+function openHref(href) {
+    if (typeof window !== 'undefined')
+        window.open(href, '_blank', 'noopener');
+}
+const instrument_1 = require("./instrument.cjs");
+function EmptyState({ icon: Icon, title, description, bullets, primary, secondary, }) {
+    const track = (0, instrument_1.useEmit)();
+    return ((0, jsx_runtime_1.jsxs)(gui_1.Card, { borderWidth: 1, borderColor: "$borderColor", borderStyle: "dashed", p: "$6", gap: "$4", items: "center", maxWidth: 640, self: "center", width: "100%", children: [(0, jsx_runtime_1.jsx)(gui_1.YStack, { width: 48, height: 48, items: "center", justify: "center", rounded: "$4", bg: "$color3", children: (0, jsx_runtime_1.jsx)(Icon, { size: 24 }) }), (0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$2", items: "center", maxW: 480, children: [(0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$6", fontWeight: "500", text: "center", letterSpacing: -0.3, children: title }), (0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$3", color: "$color11", text: "center", children: description })] }), bullets && bullets.length ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { gap: "$2", self: "stretch", maxW: 420, mx: "auto", children: bullets.map((b) => ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { gap: "$2", items: "flex-start", children: [(0, jsx_runtime_1.jsx)(gui_1.YStack, { pt: "$1", children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Check, { size: 14, color: "$color10" }) }), (0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$3", color: "$color11", flex: 1, children: b })] }, b))) })) : null, primary || secondary ? ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { gap: "$2", items: "center", flexWrap: "wrap", justify: "center", children: [primary ? ((0, jsx_runtime_1.jsx)(PrimaryButton_1.PrimaryButton, { icon: primary.icon, iconAfter: primary.href ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ExternalLink, { size: 15 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ArrowRight, { size: 15 }), onPress: () => {
+                            track({ component: 'EmptyState', action: 'click', id: title, value: primary.label });
+                            if (primary.href)
+                                openHref(primary.href);
+                            else
+                                primary.onPress?.();
+                        }, children: primary.label })) : null, secondary ? ((0, jsx_runtime_1.jsx)(gui_1.Button, { chromeless: true, icon: secondary.icon, iconAfter: secondary.href ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ExternalLink, { size: 14 }) : undefined, onPress: () => {
+                            track({ component: 'EmptyState', action: 'click', id: title, value: secondary.label });
+                            if (secondary.href)
+                                openHref(secondary.href);
+                            else
+                                secondary.onPress?.();
+                        }, children: secondary.label })) : null] })) : null] }));
+}

package/dist/product/EmptyState.d.ts

@@ -12,7 +12,7 @@
  * surface a module shows in place of its table.
  */
 import type { ReactElement } from 'react';
-import type { IconLike } from './color';
+import type { IconLike } from './color.js';
 /** A single call-to-action — primary (filled) or a secondary/external link. */
 export type EmptyAction = {
     label: string;
@@ -34,3 +34,4 @@ export declare function EmptyState({ icon: Icon, title, description, bullets, pr
     /** An optional lower-emphasis action (Docs / CLI / Learn more). */
     secondary?: EmptyAction;
 }): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/product/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/product/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AACH,OAAO,KAAK,EAAE,YAAY,EAAa,MAAM,OAAO,CAAA;AAIpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,+EAA+E;AAC/E,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB,CAAA;AASD,wBAAgB,UAAU,CAAC,EACzB,IAAI,EAAE,IAAI,EACV,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,SAAS,GACV,EAAE;IACD,oFAAoF;IACpF,IAAI,EAAE,QAAQ,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,mEAAmE;IACnE,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,mEAAmE;IACnE,SAAS,CAAC,EAAE,WAAW,CAAA;CACxB,2CAkFA"}

package/dist/product/EmptyState.js

@@ -0,0 +1,28 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Card, Text, XStack, YStack } from '@hanzo/gui';
+import { ArrowRight, Check, ExternalLink } from '@hanzogui/lucide-icons-2';
+import { PrimaryButton } from './PrimaryButton.js';
+/** Open an external URL in a new tab (no-opener), guarded for SSR. */
+function openHref(href) {
+    if (typeof window !== 'undefined')
+        window.open(href, '_blank', 'noopener');
+}
+import { useEmit } from './instrument.js';
+export function EmptyState({ icon: Icon, title, description, bullets, primary, secondary, }) {
+    const track = useEmit();
+    return (_jsxs(Card, { borderWidth: 1, borderColor: "$borderColor", borderStyle: "dashed", p: "$6", gap: "$4", items: "center", maxWidth: 640, self: "center", width: "100%", children: [_jsx(YStack, { width: 48, height: 48, items: "center", justify: "center", rounded: "$4", bg: "$color3", children: _jsx(Icon, { size: 24 }) }), _jsxs(YStack, { gap: "$2", items: "center", maxW: 480, children: [_jsx(Text, { fontSize: "$6", fontWeight: "500", text: "center", letterSpacing: -0.3, children: title }), _jsx(Text, { fontSize: "$3", color: "$color11", text: "center", children: description })] }), bullets && bullets.length ? (_jsx(YStack, { gap: "$2", self: "stretch", maxW: 420, mx: "auto", children: bullets.map((b) => (_jsxs(XStack, { gap: "$2", items: "flex-start", children: [_jsx(YStack, { pt: "$1", children: _jsx(Check, { size: 14, color: "$color10" }) }), _jsx(Text, { fontSize: "$3", color: "$color11", flex: 1, children: b })] }, b))) })) : null, primary || secondary ? (_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", justify: "center", children: [primary ? (_jsx(PrimaryButton, { icon: primary.icon, iconAfter: primary.href ? _jsx(ExternalLink, { size: 15 }) : _jsx(ArrowRight, { size: 15 }), onPress: () => {
+                            track({ component: 'EmptyState', action: 'click', id: title, value: primary.label });
+                            if (primary.href)
+                                openHref(primary.href);
+                            else
+                                primary.onPress?.();
+                        }, children: primary.label })) : null, secondary ? (_jsx(Button, { chromeless: true, icon: secondary.icon, iconAfter: secondary.href ? _jsx(ExternalLink, { size: 14 }) : undefined, onPress: () => {
+                            track({ component: 'EmptyState', action: 'click', id: title, value: secondary.label });
+                            if (secondary.href)
+                                openHref(secondary.href);
+                            else
+                                secondary.onPress?.();
+                        }, children: secondary.label })) : null] })) : null] }));
+}
+//# sourceMappingURL=EmptyState.js.map

package/dist/product/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../src/product/EmptyState.tsx"],"names":[],"mappings":"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"}

package/dist/product/FadeIn.cjs

@@ -0,0 +1,9 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FadeIn = FadeIn;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function FadeIn({ children, index = 0, step = 50, delayMs, style, }) {
+    const delay = delayMs ?? index * step;
+    return ((0, jsx_runtime_1.jsx)("div", { className: "hz-fade-up", style: { animationDelay: `${delay}ms`, ...style }, children: children }));
+}

package/dist/product/FadeIn.d.ts

@@ -20,3 +20,4 @@ export declare function FadeIn({ children, index, step, delayMs, style, }: {
     /** Extra styles for the wrapper (e.g. layout/centering). */
     style?: CSSProperties;
 }): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FadeIn.d.ts.map