@hanzo/ui 8.0.55 → 8.0.57

package/dist/product/Pagination.cjs

@@ -0,0 +1,72 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GAP = void 0;
+exports.pages = pages;
+exports.Pagination = Pagination;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Pagination — page N of M, and the way to the others.
+ *
+ * Four implementations across the fleet (chat, the console's observability
+ * pager, and billing twice — in two spellings, in one repo), each with its own
+ * rule for what happens when there are eighty pages. `pages` is that rule,
+ * written once and testable without a browser: a fixed-width run of page numbers
+ * around the current one, with ellipses standing in for what was skipped and the
+ * first and last page always reachable.
+ *
+ * Fixed width is the requirement. A control that grows with the page count
+ * reflows the row it sits in every time you page, which is how a "next" button
+ * ends up under the cursor that was pressing "previous".
+ */
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const instrument_1 = require("./instrument.cjs");
+/** A gap in the run. Rendered as an ellipsis; never selectable. */
+exports.GAP = '…';
+/**
+ * The page numbers to show for `page` of `count`, 1-based.
+ *
+ * `around` is how many neighbours flank the current page (default 1 → at most
+ * 7 slots: first, gap, p-1, p, p+1, gap, last). Returns every page when they
+ * all fit, so a short list never grows an ellipsis it does not need.
+ */
+function pages(page, count, around = 1) {
+    if (count <= 0)
+        return [];
+    const width = around * 2 + 5; // first + gap + run + gap + last
+    if (count <= width)
+        return Array.from({ length: count }, (_, i) => i + 1);
+    const current = Math.min(Math.max(page, 1), count);
+    // First and last are always present, so the middle carries `width - 2` slots
+    // and each end that needs no ellipsis spends that slot on another page
+    // instead. Solving for the run that way is what keeps the total constant;
+    // clamping the run with Math.max/min alone lets it shrink near the edges, and
+    // then the control changes width as you page.
+    const middle = width - 2;
+    const nearStart = current <= around + 2;
+    const nearEnd = current >= count - around - 1;
+    const start = nearStart ? 2 : nearEnd ? count - middle + 1 : current - around;
+    const end = nearStart ? middle : nearEnd ? count - 1 : current + around;
+    const out = [1];
+    if (!nearStart)
+        out.push(exports.GAP);
+    for (let p = start; p <= end; p++)
+        out.push(p);
+    if (!nearEnd)
+        out.push(exports.GAP);
+    out.push(count);
+    return out;
+}
+function Pagination({ page, count, onChange, around = 1 }) {
+    const track = (0, instrument_1.useEmit)();
+    if (count <= 1)
+        return null;
+    const go = (to) => {
+        if (to === page || to < 1 || to > count)
+            return;
+        track({ component: 'Pagination', action: 'select', value: to });
+        onChange(to);
+    };
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", justify: "center", gap: "$1", flexWrap: "wrap", children: [(0, jsx_runtime_1.jsx)(gui_1.Button, { size: "$2", chromeless: true, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronLeft, { size: 15 }), onPress: () => go(page - 1), disabled: page <= 1, "aria-label": "Previous page" }), pages(page, count, around).map((slot, i) => slot === exports.GAP ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { px: "$1.5", fontSize: "$2", color: "$color10", "aria-hidden": true, children: exports.GAP }, `gap-${i}`)) : ((0, jsx_runtime_1.jsx)(gui_1.Button, { size: "$2", chromeless: slot !== page, onPress: () => go(slot), "aria-label": `Page ${slot}`, "aria-current": slot === page ? 'page' : undefined, bg: slot === page ? '$color4' : undefined, children: String(slot) }, slot))), (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "$2", chromeless: true, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronRight, { size: 15 }), onPress: () => go(page + 1), disabled: page >= count, "aria-label": "Next page" })] }));
+}

package/dist/product/Pagination.d.ts

@@ -0,0 +1,21 @@
+/** A gap in the run. Rendered as an ellipsis; never selectable. */
+export declare const GAP: "\u2026";
+/**
+ * The page numbers to show for `page` of `count`, 1-based.
+ *
+ * `around` is how many neighbours flank the current page (default 1 → at most
+ * 7 slots: first, gap, p-1, p, p+1, gap, last). Returns every page when they
+ * all fit, so a short list never grows an ellipsis it does not need.
+ */
+export declare function pages(page: number, count: number, around?: number): (number | typeof GAP)[];
+export type PaginationProps = {
+    /** Current page, 1-based. */
+    page: number;
+    /** Total pages. 1 or 0 renders nothing — there is nowhere to go. */
+    count: number;
+    onChange: (page: number) => void;
+    /** Neighbours flanking the current page. Default 1. */
+    around?: number;
+};
+export declare function Pagination({ page, count, onChange, around }: PaginationProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Pagination.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/product/Pagination.tsx"],"names":[],"mappings":"AAqBA,mEAAmE;AACnE,eAAO,MAAM,GAAG,EAAG,QAAY,CAAA;AAE/B;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,SAAI,GAAG,CAAC,MAAM,GAAG,OAAO,GAAG,CAAC,EAAE,CAwBtF;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,6BAA6B;IAC7B,IAAI,EAAE,MAAM,CAAA;IACZ,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAU,EAAE,EAAE,eAAe,kDAiDhF"}

package/dist/product/Pagination.js

@@ -0,0 +1,68 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Pagination — page N of M, and the way to the others.
+ *
+ * Four implementations across the fleet (chat, the console's observability
+ * pager, and billing twice — in two spellings, in one repo), each with its own
+ * rule for what happens when there are eighty pages. `pages` is that rule,
+ * written once and testable without a browser: a fixed-width run of page numbers
+ * around the current one, with ellipses standing in for what was skipped and the
+ * first and last page always reachable.
+ *
+ * Fixed width is the requirement. A control that grows with the page count
+ * reflows the row it sits in every time you page, which is how a "next" button
+ * ends up under the cursor that was pressing "previous".
+ */
+import { Button, Text, XStack } from '@hanzo/gui';
+import { ChevronLeft, ChevronRight } from '@hanzogui/lucide-icons-2';
+import { useEmit } from './instrument.js';
+/** A gap in the run. Rendered as an ellipsis; never selectable. */
+export const GAP = '…';
+/**
+ * The page numbers to show for `page` of `count`, 1-based.
+ *
+ * `around` is how many neighbours flank the current page (default 1 → at most
+ * 7 slots: first, gap, p-1, p, p+1, gap, last). Returns every page when they
+ * all fit, so a short list never grows an ellipsis it does not need.
+ */
+export function pages(page, count, around = 1) {
+    if (count <= 0)
+        return [];
+    const width = around * 2 + 5; // first + gap + run + gap + last
+    if (count <= width)
+        return Array.from({ length: count }, (_, i) => i + 1);
+    const current = Math.min(Math.max(page, 1), count);
+    // First and last are always present, so the middle carries `width - 2` slots
+    // and each end that needs no ellipsis spends that slot on another page
+    // instead. Solving for the run that way is what keeps the total constant;
+    // clamping the run with Math.max/min alone lets it shrink near the edges, and
+    // then the control changes width as you page.
+    const middle = width - 2;
+    const nearStart = current <= around + 2;
+    const nearEnd = current >= count - around - 1;
+    const start = nearStart ? 2 : nearEnd ? count - middle + 1 : current - around;
+    const end = nearStart ? middle : nearEnd ? count - 1 : current + around;
+    const out = [1];
+    if (!nearStart)
+        out.push(GAP);
+    for (let p = start; p <= end; p++)
+        out.push(p);
+    if (!nearEnd)
+        out.push(GAP);
+    out.push(count);
+    return out;
+}
+export function Pagination({ page, count, onChange, around = 1 }) {
+    const track = useEmit();
+    if (count <= 1)
+        return null;
+    const go = (to) => {
+        if (to === page || to < 1 || to > count)
+            return;
+        track({ component: 'Pagination', action: 'select', value: to });
+        onChange(to);
+    };
+    return (_jsxs(XStack, { items: "center", justify: "center", gap: "$1", flexWrap: "wrap", children: [_jsx(Button, { size: "$2", chromeless: true, icon: _jsx(ChevronLeft, { size: 15 }), onPress: () => go(page - 1), disabled: page <= 1, "aria-label": "Previous page" }), pages(page, count, around).map((slot, i) => slot === GAP ? (_jsx(Text, { px: "$1.5", fontSize: "$2", color: "$color10", "aria-hidden": true, children: GAP }, `gap-${i}`)) : (_jsx(Button, { size: "$2", chromeless: slot !== page, onPress: () => go(slot), "aria-label": `Page ${slot}`, "aria-current": slot === page ? 'page' : undefined, bg: slot === page ? '$color4' : undefined, children: String(slot) }, slot))), _jsx(Button, { size: "$2", chromeless: true, icon: _jsx(ChevronRight, { size: 15 }), onPress: () => go(page + 1), disabled: page >= count, "aria-label": "Next page" })] }));
+}
+//# sourceMappingURL=Pagination.js.map

package/dist/product/Pagination.js.map

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

package/dist/product/SecretInput.cjs

@@ -0,0 +1,59 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.masked = void 0;
+exports.SecretInput = SecretInput;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * SecretInput — a secret you can check, copy, and not leak over someone's
+ * shoulder.
+ *
+ * An API key, a token, a webhook signing secret. Masked by default, revealed
+ * deliberately, and copyable without ever being revealed — which is the point:
+ * the usual reason a person unmasks a key is to select it by hand, so a copy
+ * control that works while masked removes the reason to show it at all.
+ *
+ * Copying is `CopyButton`, not a second implementation. This component owns
+ * exactly one thing the others do not: the reveal.
+ *
+ * Nothing here reports the secret. The analytics event carries the LENGTH and
+ * whether it was revealed — never a character of the value, and it is never
+ * written to the console, which is where the previous implementation sent its
+ * clipboard failures.
+ */
+const react_1 = require("react");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const slot_1 = require("../backends/gui/slot.cjs");
+const CopyButton_1 = require("./CopyButton.cjs");
+const instrument_1 = require("./instrument.cjs");
+/**
+ * Masking, on both platforms.
+ *
+ * `secureTextEntry` is React Native's spelling and gui DROPS it on web — an
+ * input carrying only that prop renders the secret in plain text, which is the
+ * exact opposite of what the caller asked for. `type="password"` is the web
+ * spelling and gui forwards it, being an unrecognised prop. Native ignores
+ * `type` for the same reason. So masking needs BOTH names, and neither alone is
+ * safe. `readOnly` is the same story: `editable={false}` is dropped on web.
+ */
+const masked = (on) => (on ? { secureTextEntry: true, type: 'password' } : { secureTextEntry: false, type: 'text' });
+exports.masked = masked;
+function SecretInput({ value, onChange, placeholder, disabled, copy = true, id, }) {
+    const [shown, setShown] = (0, react_1.useState)(false);
+    const track = (0, instrument_1.useEmit)();
+    const toggle = () => {
+        track({ component: 'SecretInput', action: shown ? 'close' : 'open', id });
+        setShown((s) => !s);
+    };
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$1", px: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$background", opacity: disabled ? 0.5 : 1, children: [(0, jsx_runtime_1.jsx)(gui_1.Input, { flex: 1, minW: 0, borderWidth: 0, bg: "transparent", value: value, onChangeText: onChange
+                    ? (v) => {
+                        track({ component: 'SecretInput', action: 'change', id, value: v.length });
+                        onChange(v);
+                    }
+                    : undefined, 
+                // No handler means the caller is displaying a minted secret, not
+                // collecting one; a field that accepts keystrokes it then discards
+                // reads as broken. `readOnly`, not `editable` — see `masked`.
+                readOnly: !onChange, disabled: disabled, ...(0, exports.masked)(!shown), placeholder: placeholder, autoCapitalize: "none", autoCorrect: false, spellCheck: false }), copy && value ? (0, jsx_runtime_1.jsx)(CopyButton_1.CopyButton, { value: value, label: "Copy secret", id: id }) : null, (0, jsx_runtime_1.jsx)(gui_1.XStack, { width: 24, height: 24, items: "center", justify: "center", rounded: "$2", cursor: disabled ? 'not-allowed' : 'pointer', opacity: 0.7, onPress: disabled ? undefined : toggle, role: "button", tabIndex: 0, "aria-label": shown ? 'Hide secret' : 'Show secret', ...(0, slot_1.tip)(shown ? 'Hide' : 'Show'), hoverStyle: disabled ? undefined : { bg: '$color4', opacity: 1 }, pressStyle: disabled ? undefined : { bg: '$color5' }, children: shown ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.EyeOff, { size: 14 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Eye, { size: 14 }) })] }));
+}

package/dist/product/SecretInput.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Masking, on both platforms.
+ *
+ * `secureTextEntry` is React Native's spelling and gui DROPS it on web — an
+ * input carrying only that prop renders the secret in plain text, which is the
+ * exact opposite of what the caller asked for. `type="password"` is the web
+ * spelling and gui forwards it, being an unrecognised prop. Native ignores
+ * `type` for the same reason. So masking needs BOTH names, and neither alone is
+ * safe. `readOnly` is the same story: `editable={false}` is dropped on web.
+ */
+export declare const masked: (on: boolean) => object;
+export type SecretInputProps = {
+    value: string;
+    /** Omit to render read-only — the common case for a key the server minted. */
+    onChange?: (v: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    /** Show the copy control. Default true — copying is why the field exists. */
+    copy?: boolean;
+    /** Names the secret in analytics ("openai-key"). Never the value. */
+    id?: string;
+};
+export declare function SecretInput({ value, onChange, placeholder, disabled, copy, id, }: SecretInputProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SecretInput.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SecretInput.d.ts","sourceRoot":"","sources":["../../src/product/SecretInput.tsx"],"names":[],"mappings":"AA2BA;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM,GAAI,IAAI,OAAO,KACiE,MAAM,CAAA;AAEzG,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,qEAAqE;IACrE,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,IAAW,EACX,EAAE,GACH,EAAE,gBAAgB,2CAkElB"}

package/dist/product/SecretInput.js

@@ -0,0 +1,55 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * SecretInput — a secret you can check, copy, and not leak over someone's
+ * shoulder.
+ *
+ * An API key, a token, a webhook signing secret. Masked by default, revealed
+ * deliberately, and copyable without ever being revealed — which is the point:
+ * the usual reason a person unmasks a key is to select it by hand, so a copy
+ * control that works while masked removes the reason to show it at all.
+ *
+ * Copying is `CopyButton`, not a second implementation. This component owns
+ * exactly one thing the others do not: the reveal.
+ *
+ * Nothing here reports the secret. The analytics event carries the LENGTH and
+ * whether it was revealed — never a character of the value, and it is never
+ * written to the console, which is where the previous implementation sent its
+ * clipboard failures.
+ */
+import { useState } from 'react';
+import { Input, XStack } from '@hanzo/gui';
+import { Eye, EyeOff } from '@hanzogui/lucide-icons-2';
+import { tip } from '../backends/gui/slot.js';
+import { CopyButton } from './CopyButton.js';
+import { useEmit } from './instrument.js';
+/**
+ * Masking, on both platforms.
+ *
+ * `secureTextEntry` is React Native's spelling and gui DROPS it on web — an
+ * input carrying only that prop renders the secret in plain text, which is the
+ * exact opposite of what the caller asked for. `type="password"` is the web
+ * spelling and gui forwards it, being an unrecognised prop. Native ignores
+ * `type` for the same reason. So masking needs BOTH names, and neither alone is
+ * safe. `readOnly` is the same story: `editable={false}` is dropped on web.
+ */
+export const masked = (on) => (on ? { secureTextEntry: true, type: 'password' } : { secureTextEntry: false, type: 'text' });
+export function SecretInput({ value, onChange, placeholder, disabled, copy = true, id, }) {
+    const [shown, setShown] = useState(false);
+    const track = useEmit();
+    const toggle = () => {
+        track({ component: 'SecretInput', action: shown ? 'close' : 'open', id });
+        setShown((s) => !s);
+    };
+    return (_jsxs(XStack, { items: "center", gap: "$1", px: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$background", opacity: disabled ? 0.5 : 1, children: [_jsx(Input, { flex: 1, minW: 0, borderWidth: 0, bg: "transparent", value: value, onChangeText: onChange
+                    ? (v) => {
+                        track({ component: 'SecretInput', action: 'change', id, value: v.length });
+                        onChange(v);
+                    }
+                    : undefined, 
+                // No handler means the caller is displaying a minted secret, not
+                // collecting one; a field that accepts keystrokes it then discards
+                // reads as broken. `readOnly`, not `editable` — see `masked`.
+                readOnly: !onChange, disabled: disabled, ...masked(!shown), placeholder: placeholder, autoCapitalize: "none", autoCorrect: false, spellCheck: false }), copy && value ? _jsx(CopyButton, { value: value, label: "Copy secret", id: id }) : null, _jsx(XStack, { width: 24, height: 24, items: "center", justify: "center", rounded: "$2", cursor: disabled ? 'not-allowed' : 'pointer', opacity: 0.7, onPress: disabled ? undefined : toggle, role: "button", tabIndex: 0, "aria-label": shown ? 'Hide secret' : 'Show secret', ...tip(shown ? 'Hide' : 'Show'), hoverStyle: disabled ? undefined : { bg: '$color4', opacity: 1 }, pressStyle: disabled ? undefined : { bg: '$color5' }, children: shown ? _jsx(EyeOff, { size: 14 }) : _jsx(Eye, { size: 14 }) })] }));
+}
+//# sourceMappingURL=SecretInput.js.map

package/dist/product/SecretInput.js.map

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

package/dist/product/UserMenu.cjs

@@ -0,0 +1,63 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.displayName = displayName;
+exports.UserMenu = UserMenu;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * UserMenu — the account control: who I am, and the things I do to my account.
+ *
+ * It was written inside `AppHeader` and could not be reached from anywhere else,
+ * so every surface that wanted an account menu without adopting the whole header
+ * wrote one: hanzo.app twice, chat, console, billing. Five implementations of one
+ * menu, disagreeing on the trigger, the row order and the sign-out copy. This is
+ * that menu, extracted whole — `AppHeader` now renders it instead of owning it,
+ * so the header and a standalone account control cannot drift apart.
+ *
+ * Host-agnostic: identity is a value, every row is an injected handler, and a row
+ * renders only when its handler is provided — an honest menu, never a dead item.
+ * The surface keeps its own `useUser`/router in a thin wrapper; that wrapper is
+ * the seam the charter asks for, not a duplicate.
+ *
+ * The trigger is sized as the PEER of `OrgSwitcher` — same height, same mark,
+ * same type — so "which workspace" and "who I am" read as two halves of one
+ * identity rather than a caption over a control.
+ */
+const react_1 = require("react");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const instrument_1 = require("./instrument.cjs");
+const OrgMark_1 = require("./OrgMark.cjs");
+const ThemeToggle_1 = require("./ThemeToggle.cjs");
+function Row({ item, onDone }) {
+    const track = (0, instrument_1.useEmit)();
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { onPress: () => {
+            track({ component: 'UserMenu', action: 'select', id: item.id });
+            onDone();
+            item.onPress();
+        }, cursor: "pointer", items: "center", gap: "$2.5", px: "$2", py: "$2", rounded: "$3", hoverStyle: { bg: '$color5' }, children: [item.icon, (0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$2", color: item.danger ? '$red10' : '$color12', children: item.label })] }));
+}
+/** The name to show: the given one, else the email's local part, else nothing
+ *  fabricated — "User" is not a name and reads as a bug to the person it names. */
+function displayName(name, email) {
+    if (name?.trim())
+        return name.trim();
+    const local = email?.split('@')[0];
+    return local?.trim() || '';
+}
+function UserMenu({ name, email, avatar, groups = [], theme, onSignOut, signOutLabel = 'Sign out', children, label = true, height = 44, }) {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const track = (0, instrument_1.useEmit)();
+    const shown = displayName(name, email);
+    const filled = groups.filter((g) => g.length > 0);
+    const close = () => setOpen(false);
+    return ((0, jsx_runtime_1.jsxs)(gui_1.Popover, { open: open, onOpenChange: (next) => {
+            track({ component: 'UserMenu', action: next ? 'open' : 'close' });
+            setOpen(next);
+        }, placement: "bottom-end", children: [(0, jsx_runtime_1.jsx)(gui_1.Popover.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(gui_1.XStack, { cursor: "pointer", items: "center", gap: "$2.5", height: height, px: "$2", rounded: "$3", minW: 0, hoverStyle: { bg: '$color4' }, role: "button", tabIndex: 0, "aria-label": shown ? `${shown} · account` : 'Account', children: [avatar || shown ? ((0, jsx_runtime_1.jsx)(OrgMark_1.OrgMark, { org: { name: shown || 'Account', logo: avatar }, size: 30 })) : ((0, jsx_runtime_1.jsx)(lucide_icons_2_1.UserRound, { size: 18 })), label && shown ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$3", fontWeight: "600", color: "$color12", numberOfLines: 1, maxW: 160, children: shown })) : null] }) }), (0, jsx_runtime_1.jsx)(gui_1.Popover.Content, { bordered: true, elevate: true, p: "$2", width: 240, bg: "$color2", borderColor: "$borderColor", children: children ?? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [shown || email ? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$0.5", px: "$2", py: "$1.5", children: [shown ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$2", fontWeight: "700", color: "$color12", numberOfLines: 1, children: shown })) : null, email && email !== shown ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$1", color: "$color10", numberOfLines: 1, children: email })) : null] })) : null, filled.map((group, i) => ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [(i > 0 || shown || email) ? (0, jsx_runtime_1.jsx)(gui_1.Separator, { borderColor: "$borderColor", my: "$1" }) : null, group.map((item) => ((0, jsx_runtime_1.jsx)(Row, { item: item, onDone: close }, item.id)))] }, i))), theme !== null ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(gui_1.Separator, { borderColor: "$borderColor", my: "$1" }), (0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$2.5", px: "$2", py: "$1", rounded: "$3", children: [(0, jsx_runtime_1.jsx)(gui_1.Text, { flex: 1, fontSize: "$2", color: "$color12", children: "Theme" }), theme ?? (0, jsx_runtime_1.jsx)(ThemeToggle_1.ThemeToggle, {})] })] })) : null, onSignOut ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(gui_1.Separator, { borderColor: "$borderColor", my: "$1" }), (0, jsx_runtime_1.jsx)(Row, { item: {
+                                        id: 'sign-out',
+                                        label: signOutLabel,
+                                        icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.LogOut, { size: 15 }),
+                                        onPress: onSignOut,
+                                    }, onDone: close })] })) : null] })) })] }));
+}

package/dist/product/UserMenu.d.ts

@@ -0,0 +1,56 @@
+/**
+ * UserMenu — the account control: who I am, and the things I do to my account.
+ *
+ * It was written inside `AppHeader` and could not be reached from anywhere else,
+ * so every surface that wanted an account menu without adopting the whole header
+ * wrote one: hanzo.app twice, chat, console, billing. Five implementations of one
+ * menu, disagreeing on the trigger, the row order and the sign-out copy. This is
+ * that menu, extracted whole — `AppHeader` now renders it instead of owning it,
+ * so the header and a standalone account control cannot drift apart.
+ *
+ * Host-agnostic: identity is a value, every row is an injected handler, and a row
+ * renders only when its handler is provided — an honest menu, never a dead item.
+ * The surface keeps its own `useUser`/router in a thin wrapper; that wrapper is
+ * the seam the charter asks for, not a duplicate.
+ *
+ * The trigger is sized as the PEER of `OrgSwitcher` — same height, same mark,
+ * same type — so "which workspace" and "who I am" read as two halves of one
+ * identity rather than a caption over a control.
+ */
+import { type ReactNode } from 'react';
+/** One row. `id` names it in analytics; the label is what the person reads. */
+export type UserMenuItem = {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    onPress: () => void;
+    /** Draws the row in the destructive tone (sign out, delete account). */
+    danger?: boolean;
+};
+export type UserMenuProps = {
+    /** The signed-in person's display name. Falls back to the email's local part. */
+    name?: string;
+    email?: string;
+    /** Avatar URL. Absent → the monogram of the name, like an org's mark. */
+    avatar?: string;
+    /** Grouped rows — each group is separated by a rule, empty groups are dropped. */
+    groups?: UserMenuItem[][];
+    /** Theme row content — default `<ThemeToggle/>`; `null` hides the row (a
+     *  single-theme surface has nothing to toggle and should not pretend to). */
+    theme?: ReactNode;
+    /** Sign out. Omit on a surface that cannot sign out. */
+    onSignOut?: () => void;
+    /** Sign-out copy — "Sign out" everywhere unless a surface has a reason. */
+    signOutLabel?: string;
+    /** Replace the whole menu body, keeping the trigger. */
+    children?: ReactNode;
+    /** Show the name beside the avatar in the trigger. Default true. */
+    label?: boolean;
+    /** Trigger height. Default 44 — the peer of `OrgSwitcher`. */
+    height?: number;
+};
+/** The name to show: the given one, else the email's local part, else nothing
+ *  fabricated — "User" is not a name and reads as a bug to the person it names. */
+export declare function displayName(name?: string, email?: string): string;
+export declare function UserMenu({ name, email, avatar, groups, theme, onSignOut, signOutLabel, children, label, height, }: UserMenuProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UserMenu.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../src/product/UserMenu.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAQhD,+EAA+E;AAC/E,MAAM,MAAM,YAAY,GAAG;IACzB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,wEAAwE;IACxE,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,aAAa,GAAG;IAC1B,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yEAAyE;IACzE,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,kFAAkF;IAClF,MAAM,CAAC,EAAE,YAAY,EAAE,EAAE,CAAA;IACzB;iFAC6E;IAC7E,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,wDAAwD;IACxD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,oEAAoE;IACpE,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,8DAA8D;IAC9D,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AA2BD;mFACmF;AACnF,wBAAgB,WAAW,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAIjE;AAED,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAW,EACX,KAAK,EACL,SAAS,EACT,YAAyB,EACzB,QAAQ,EACR,KAAY,EACZ,MAAW,GACZ,EAAE,aAAa,2CAyGf"}

package/dist/product/UserMenu.js

@@ -0,0 +1,60 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * UserMenu — the account control: who I am, and the things I do to my account.
+ *
+ * It was written inside `AppHeader` and could not be reached from anywhere else,
+ * so every surface that wanted an account menu without adopting the whole header
+ * wrote one: hanzo.app twice, chat, console, billing. Five implementations of one
+ * menu, disagreeing on the trigger, the row order and the sign-out copy. This is
+ * that menu, extracted whole — `AppHeader` now renders it instead of owning it,
+ * so the header and a standalone account control cannot drift apart.
+ *
+ * Host-agnostic: identity is a value, every row is an injected handler, and a row
+ * renders only when its handler is provided — an honest menu, never a dead item.
+ * The surface keeps its own `useUser`/router in a thin wrapper; that wrapper is
+ * the seam the charter asks for, not a duplicate.
+ *
+ * The trigger is sized as the PEER of `OrgSwitcher` — same height, same mark,
+ * same type — so "which workspace" and "who I am" read as two halves of one
+ * identity rather than a caption over a control.
+ */
+import { useState } from 'react';
+import { Popover, Separator, Text, XStack, YStack } from '@hanzo/gui';
+import { LogOut, UserRound } from '@hanzogui/lucide-icons-2';
+import { useEmit } from './instrument.js';
+import { OrgMark } from './OrgMark.js';
+import { ThemeToggle } from './ThemeToggle.js';
+function Row({ item, onDone }) {
+    const track = useEmit();
+    return (_jsxs(XStack, { onPress: () => {
+            track({ component: 'UserMenu', action: 'select', id: item.id });
+            onDone();
+            item.onPress();
+        }, cursor: "pointer", items: "center", gap: "$2.5", px: "$2", py: "$2", rounded: "$3", hoverStyle: { bg: '$color5' }, children: [item.icon, _jsx(Text, { fontSize: "$2", color: item.danger ? '$red10' : '$color12', children: item.label })] }));
+}
+/** The name to show: the given one, else the email's local part, else nothing
+ *  fabricated — "User" is not a name and reads as a bug to the person it names. */
+export function displayName(name, email) {
+    if (name?.trim())
+        return name.trim();
+    const local = email?.split('@')[0];
+    return local?.trim() || '';
+}
+export function UserMenu({ name, email, avatar, groups = [], theme, onSignOut, signOutLabel = 'Sign out', children, label = true, height = 44, }) {
+    const [open, setOpen] = useState(false);
+    const track = useEmit();
+    const shown = displayName(name, email);
+    const filled = groups.filter((g) => g.length > 0);
+    const close = () => setOpen(false);
+    return (_jsxs(Popover, { open: open, onOpenChange: (next) => {
+            track({ component: 'UserMenu', action: next ? 'open' : 'close' });
+            setOpen(next);
+        }, placement: "bottom-end", children: [_jsx(Popover.Trigger, { asChild: true, children: _jsxs(XStack, { cursor: "pointer", items: "center", gap: "$2.5", height: height, px: "$2", rounded: "$3", minW: 0, hoverStyle: { bg: '$color4' }, role: "button", tabIndex: 0, "aria-label": shown ? `${shown} · account` : 'Account', children: [avatar || shown ? (_jsx(OrgMark, { org: { name: shown || 'Account', logo: avatar }, size: 30 })) : (_jsx(UserRound, { size: 18 })), label && shown ? (_jsx(Text, { fontSize: "$3", fontWeight: "600", color: "$color12", numberOfLines: 1, maxW: 160, children: shown })) : null] }) }), _jsx(Popover.Content, { bordered: true, elevate: true, p: "$2", width: 240, bg: "$color2", borderColor: "$borderColor", children: children ?? (_jsxs(YStack, { gap: "$1", children: [shown || email ? (_jsxs(YStack, { gap: "$0.5", px: "$2", py: "$1.5", children: [shown ? (_jsx(Text, { fontSize: "$2", fontWeight: "700", color: "$color12", numberOfLines: 1, children: shown })) : null, email && email !== shown ? (_jsx(Text, { fontSize: "$1", color: "$color10", numberOfLines: 1, children: email })) : null] })) : null, filled.map((group, i) => (_jsxs(YStack, { gap: "$1", children: [(i > 0 || shown || email) ? _jsx(Separator, { borderColor: "$borderColor", my: "$1" }) : null, group.map((item) => (_jsx(Row, { item: item, onDone: close }, item.id)))] }, i))), theme !== null ? (_jsxs(_Fragment, { children: [_jsx(Separator, { borderColor: "$borderColor", my: "$1" }), _jsxs(XStack, { items: "center", gap: "$2.5", px: "$2", py: "$1", rounded: "$3", children: [_jsx(Text, { flex: 1, fontSize: "$2", color: "$color12", children: "Theme" }), theme ?? _jsx(ThemeToggle, {})] })] })) : null, onSignOut ? (_jsxs(_Fragment, { children: [_jsx(Separator, { borderColor: "$borderColor", my: "$1" }), _jsx(Row, { item: {
+                                        id: 'sign-out',
+                                        label: signOutLabel,
+                                        icon: _jsx(LogOut, { size: 15 }),
+                                        onPress: onSignOut,
+                                    }, onDone: close })] })) : null] })) })] }));
+}
+//# sourceMappingURL=UserMenu.js.map

package/dist/product/UserMenu.js.map

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

package/dist/product/index.cjs

@@ -51,14 +51,19 @@ Object.defineProperty(exports, "DonutRing", { enumerable: true, get: function ()
 var ComboBox_1 = require("./ComboBox.cjs");
 Object.defineProperty(exports, "ComboBox", { enumerable: true, get: function () { return ComboBox_1.ComboBox; } });
 __exportStar(require("./combobox/filter.cjs"), exports);
-// The shared shell — brand mark, org scope + switcher, app header (the
-// console's org-scope contract + switcher hoisted here; hanzoai/ui#36).
+// The shared shell — brand mark, org scope + switcher, account menu, app header
+// (the console's org-scope contract + switcher hoisted here; hanzoai/ui#36).
 // `surfaces.data` is the ONE canonical cross-surface list every launcher consumes.
+//
+// `UserMenu` is the account half of the chrome trio (org · apps · account). It
+// was written inside `AppHeader` and unreachable from anywhere else, so five
+// surfaces wrote their own; `AppHeader` now renders this one.
 __exportStar(require("./surfaces.data.cjs"), exports);
 __exportStar(require("./AppHeader.cjs"), exports);
 __exportStar(require("./BrandMark.cjs"), exports);
 __exportStar(require("./OrgMark.cjs"), exports);
 __exportStar(require("./OrgSwitcher.cjs"), exports);
+__exportStar(require("./UserMenu.cjs"), exports);
 __exportStar(require("./scope.cjs"), exports);
 // Menu — the ONE menu system: portal-theme-safe DropdownMenu (click) + ContextMenu
 // (right-click), both rendering the SAME item spec (MenuPanel/MenuItemView) so every
@@ -83,6 +88,20 @@ __exportStar(require("./Filters.cjs"), exports);
 // `<InstrumentSurface value="billing">` to name the area, and `emit` for the
 // one-off moments no shared component can observe.
 __exportStar(require("./instrument.cjs"), exports);
+// Settings — `Fieldset` is the titled group the `Field*` rows sit in. It is not
+// `Panel` (a dashboard metric tile): a settings group runs full width, carries a
+// legend and has a destructive register. Every settings page drew its own.
+__exportStar(require("./Fieldset.cjs"), exports);
+// `CopyButton` and `SecretInput` — copying a value, and revealing one. CopyButton
+// lived in `chat/Code.tsx`, reachable only as `@hanzo/ui/chat`, so ~30 hand-rolled
+// copies grew across six surfaces; `Code` now imports it from here. SecretInput
+// composes it, because copying a key while it is still masked is the whole reason
+// the field exists.
+__exportStar(require("./CopyButton.cjs"), exports);
+__exportStar(require("./SecretInput.cjs"), exports);
+// `Pagination` — the fixed-width page run (`pages` is the pure rule, testable
+// without a browser).
+__exportStar(require("./Pagination.cjs"), exports);
 // The rest — every exported name below is unique across the layer.
 __exportStar(require("./AnimatedLogo.cjs"), exports);
 __exportStar(require("./brand.cjs"), exports);

package/dist/product/index.d.ts

@@ -8,6 +8,7 @@ export * from './AppHeader.js';
 export * from './BrandMark.js';
 export * from './OrgMark.js';
 export * from './OrgSwitcher.js';
+export * from './UserMenu.js';
 export * from './scope.js';
 export * from './menu/index.js';
 export * from './SiteNav.js';
@@ -18,6 +19,10 @@ export * from './CommerceResource.js';
 export * from './ConfirmDelete.js';
 export * from './Filters.js';
 export * from './instrument.js';
+export * from './Fieldset.js';
+export * from './CopyButton.js';
+export * from './SecretInput.js';
+export * from './Pagination.js';
 export * from './AnimatedLogo.js';
 export * from './brand.js';
 export * from './DataTable.js';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/product/index.ts"],"names":[],"mappings":"AAaA,cAAc,UAAU,CAAA;AAKxB,OAAO,EACL,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,IAAI,eAAe,EAC5B,QAAQ,EACR,OAAO,EACP,SAAS,EACT,UAAU,EACV,UAAU,EACV,KAAK,GACN,MAAM,UAAU,CAAA;AAGjB,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AAK/D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,cAAc,mBAAmB,CAAA;AAKjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,SAAS,CAAA;AAKvB,cAAc,QAAQ,CAAA;AAKtB,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAK5B,cAAc,QAAQ,CAAA;AACtB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,WAAW,CAAA;AAOzB,cAAc,cAAc,CAAA;AAG5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AASvB,cAAc,UAAU,CAAA;AAKxB,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/product/index.ts"],"names":[],"mappings":"AAaA,cAAc,UAAU,CAAA;AAKxB,OAAO,EACL,MAAM,EACN,aAAa,EACb,SAAS,EACT,SAAS,IAAI,eAAe,EAC5B,QAAQ,EACR,OAAO,EACP,SAAS,EACT,UAAU,EACV,UAAU,EACV,KAAK,GACN,MAAM,UAAU,CAAA;AAGjB,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AAK/D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,cAAc,mBAAmB,CAAA;AASjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AAKvB,cAAc,QAAQ,CAAA;AAKtB,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAK5B,cAAc,QAAQ,CAAA;AACtB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,WAAW,CAAA;AAOzB,cAAc,cAAc,CAAA;AAK5B,cAAc,YAAY,CAAA;AAO1B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAI7B,cAAc,cAAc,CAAA;AAG5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,eAAe,CAAA;AAC7B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AASvB,cAAc,UAAU,CAAA;AAKxB,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,aAAa,CAAA"}