@hanzo/ui 8.27.19 → 8.27.22

package/dist/product/UserMenu.d.ts

@@ -18,28 +18,9 @@
  * identity rather than a caption over a control.
  */
 import { type CSSProperties, type ReactNode } from 'react';
+import { type UserMenuGroup } from './account.js';
 import { displayName } from './name.js';
-/** 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;
-    /**
-     * Whether this row is the chosen one — for a group that is a CHOICE rather
-     * than a list of actions (which theme, which language). Its presence makes the
-     * group a `radiogroup` and the row a `radio`, so assistive tech is told that
-     * exactly one of them holds, and the chosen row carries a check.
-     */
-    active?: boolean;
-};
-/** A group of rows, optionally named. A bare array is the unnamed form. */
-export type UserMenuGroup = UserMenuItem[] | {
-    label?: string;
-    items: UserMenuItem[];
-};
+export type { UserMenuGroup, UserMenuItem } from './account.js';
 export type UserMenuProps = {
     /** The signed-in person's display name. Falls back to the email's local part. */
     name?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../src/product/UserMenu.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAY,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAOpE,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AAIpC,+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;IAChB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,2EAA2E;AAC3E,MAAM,MAAM,aAAa,GAAG,YAAY,EAAE,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,YAAY,EAAE,CAAA;CAAE,CAAA;AAKtF,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;gFAC4E;IAC5E,MAAM,CAAC,EAAE,aAAa,EAAE,CAAA;IACxB;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;IACf;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB;4EACwE;IACxE,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACvB,qEAAqE;IACrE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,yEAAyE;IACzE,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAsBD,OAAO,EAAE,WAAW,EAAE,CAAA;AAEtB,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAW,EACX,KAAK,EACL,SAAS,EACT,YAAyB,EACzB,QAAQ,EACR,KAAY,EACZ,MAAW,EACX,SAAkB,EAClB,KAAa,EACb,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,aAAa,+BA4Jf"}
+{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../src/product/UserMenu.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAoB,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAK5E,OAAO,EAAW,KAAK,aAAa,EAAE,MAAM,WAAW,CAAA;AAEvD,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AAMpC,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAE5D,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;gFAC4E;IAC5E,MAAM,CAAC,EAAE,aAAa,EAAE,CAAA;IACxB;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;IACf;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB;4EACwE;IACxE,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACvB,qEAAqE;IACrE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,yEAAyE;IACzE,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAKD,OAAO,EAAE,WAAW,EAAE,CAAA;AAEtB,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,MAAW,EACX,KAAK,EACL,SAAS,EACT,YAAyB,EACzB,QAAQ,EACR,KAAY,EACZ,MAAW,EACX,SAAkB,EAClB,KAAa,EACb,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,aAAa,+BAoHf"}

package/dist/product/UserMenu.js

@@ -1,5 +1,5 @@
 'use client';
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * UserMenu — the account control: who I am, and the things I do to my account.
  *
@@ -19,34 +19,26 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * 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 { useRef, useState } from 'react';
 import { sx } from '../sx.js';
-import { Popover, Separator, Text, XStack, YStack } from '@hanzo/gui';
-import { ChevronsUpDown, LogOut, UserRound } from '@hanzogui/lucide-icons-2';
+import { Popover, Text, XStack } from '@hanzo/gui';
+import { ChevronsUpDown, UserRound } from '@hanzogui/lucide-icons-2';
+import { Account } from './account.js';
 import { useEmit } from './instrument.js';
-import { MenuLabel, MenuRow } from './MenuRow.js';
 import { displayName } from './name.js';
 import { OrgMark } from './OrgMark.js';
 import { ThemeToggle } from './ThemeToggle.js';
-const itemsOf = (g) => (Array.isArray(g) ? g : g.items);
-const nameOf = (g) => (Array.isArray(g) ? undefined : g.label);
-function Row({ item, onDone }) {
-    const track = useEmit();
-    return (_jsx(MenuRow, { label: item.label, icon: item.icon, active: item.active, danger: item.danger, onPress: () => {
-            track({ component: 'UserMenu', action: 'select', id: item.id });
-            onDone();
-            item.onPress();
-        } }));
-}
 // The name to show is a rule over two strings, so it lives in `./name` and is
 // reachable without a gui runtime via `@hanzo/ui/product/pure`. Re-exported
 // here because it was published from this module.
 export { displayName };
 export function UserMenu({ name, email, avatar, groups = [], theme, onSignOut, signOutLabel = 'Sign out', children, label = true, height = 44, direction = 'down', align = 'end', aria, testId, className, style, }) {
     const [open, setOpen] = useState(false);
+    // Closing hands focus back to the trigger. The popover's own return goes
+    // through a trigger ref that an `asChild` stack never fills, so it is ours.
+    const trigger = useRef(null);
     const track = useEmit();
     const shown = displayName(name, email);
-    const filled = groups.filter((g) => itemsOf(g).length > 0);
     const close = () => setOpen(false);
     return (_jsxs(Popover, { open: open, onOpenChange: (next) => {
             track({ component: 'UserMenu', action: next ? 'open' : 'close' });
@@ -56,7 +48,15 @@ export function UserMenu({ name, email, avatar, groups = [], theme, onSignOut, s
         // `OrgSwitcher`. This is the control it bites: at the foot of a desktop
         // rail it opens upward, and the SAME mount near the top of a phone's
         // account sheet has nowhere to go upward at all.
-        allowFlip: true, stayInFrame: true, 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: '$edge' }, role: "button", tabIndex: 0, "data-testid": testId, "aria-label": aria ?? (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: "$ink", numberOfLines: 1, maxW: 160, children: shown })) : null, label && shown ? _jsx(ChevronsUpDown, { size: 16, color: "$faint" }) : null] }) }), _jsx(Popover.Content, { role: "menu", 
+        allowFlip: true, stayInFrame: true, children: [_jsx(Popover.Trigger, { asChild: true, children: _jsxs(XStack, { ref: trigger, cursor: "pointer", items: "center", gap: "$2.5", height: height, px: "$2", rounded: "$3", minW: 0, hoverStyle: { bg: '$edge' }, role: "button", tabIndex: 0, "data-testid": testId, "aria-label": aria ?? (shown ? `${shown} · account` : 'Account'), "aria-haspopup": "menu", "aria-expanded": open, 
+                    // gui opens a stack-drawn trigger on a press only; Enter and Space are
+                    // the trigger's own (see backends/gui/press.ts).
+                    onKeyDown: (e) => {
+                        if (e?.key !== 'Enter' && e?.key !== ' ')
+                            return;
+                        e.preventDefault?.();
+                        setOpen(!open);
+                    }, 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: "$ink", numberOfLines: 1, maxW: 160, children: shown })) : null, label && shown ? _jsx(ChevronsUpDown, { size: 16, color: "$faint" }) : null] }) }), _jsx(Popover.Content, { role: "menu", 
                 /* A menu sheet's rows run its full width. gui's PopperContent centres
                    its children, so each row is only as wide as its own text until the
                    class that stretches it lands a frame later: the sheet flashes a
@@ -71,19 +71,11 @@ export function UserMenu({ name, email, avatar, groups = [], theme, onSignOut, s
                    applied normally, and React logged "Received true for a non-boolean
                    attribute bordered". The siblings in this package have always used
                    borderWidth={1}. */
-                borderWidth: 1, elevation: "$2", px: "$1", py: "$1", width: 240, bg: "$panel", borderColor: "$borderColor", ...sx(className), style: style, 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: "$ink", numberOfLines: 1, children: shown })) : null, email && email !== shown ? (_jsx(Text, { fontSize: "$1", color: "$soft", numberOfLines: 1, children: email })) : null] })) : null, filled.map((group, i) => {
-                            const items = itemsOf(group);
-                            const groupName = nameOf(group);
-                            // A group whose every row carries a chosen-one is a CHOICE, so it
-                            // is a radiogroup — a heading alone would leave the rows unrelated.
-                            const choice = items.every((it) => it.active !== undefined);
-                            const rows = items.map((item) => _jsx(Row, { item: item, onDone: close }, item.id));
-                            return (_jsxs(YStack, { gap: "$1", children: [i > 0 || shown || email ? _jsx(Separator, { borderColor: "$borderColor", my: "$1" }) : null, groupName ? _jsx(MenuLabel, { children: groupName }) : null, choice ? (_jsx(YStack, { role: "radiogroup", "aria-label": groupName, gap: "$1", children: rows })) : (rows)] }, 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: "$ink", 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: 16 }),
-                                        onPress: onSignOut,
-                                    }, onDone: close })] })) : null] })) })] }));
+                borderWidth: 1, elevation: "$2", px: "$1", py: "$1", width: 240, bg: "$panel", borderColor: "$borderColor", onCloseAutoFocus: (e) => {
+                    e.preventDefault();
+                    trigger.current?.focus();
+                }, ...sx(className), style: style, children: children ?? (_jsx(Account, { name: name, email: email, groups: groups, 
+                    // The default toggle is this menu's, not the shared body's (see account.tsx).
+                    theme: theme === undefined ? _jsx(ThemeToggle, {}) : theme, onSignOut: onSignOut, signOutLabel: signOutLabel, onDone: close, component: "UserMenu" })) })] }));
 }
 //# sourceMappingURL=UserMenu.js.map

package/dist/product/UserMenu.js.map

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

package/dist/product/account.cjs

@@ -0,0 +1,37 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Account = Account;
+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");
+const roving_1 = require("./menu/roving.cjs");
+const MenuRow_1 = require("./MenuRow.cjs");
+const name_1 = require("./name.cjs");
+const itemsOf = (g) => (Array.isArray(g) ? g : g.items);
+const nameOf = (g) => (Array.isArray(g) ? undefined : g.label);
+function Row({ item, onDone, component }) {
+    const track = (0, instrument_1.useEmit)();
+    return ((0, jsx_runtime_1.jsx)(MenuRow_1.MenuRow, { label: item.label, icon: item.icon, active: item.active, danger: item.danger, onPress: () => {
+            track({ component, action: 'select', id: item.id });
+            onDone();
+            item.onPress();
+        } }));
+}
+/** A rule between groups — never above the first thing in the menu. */
+const Rule = () => (0, jsx_runtime_1.jsx)(gui_1.Separator, { borderColor: "$borderColor", my: "$1" });
+function Account({ name, email, groups = [], theme, onSignOut, signOutLabel = 'Sign out', onDone, component }) {
+    const shown = (0, name_1.displayName)(name, email);
+    const filled = groups.filter((g) => itemsOf(g).length > 0);
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", onKeyDown: (e) => (0, roving_1.menuKeyDown)(e), 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: "$ink", numberOfLines: 1, children: shown })) : null, email && email !== shown ? ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$1", color: "$soft", numberOfLines: 1, children: email })) : null] })) : null, filled.map((group, i) => {
+                const items = itemsOf(group);
+                const label = nameOf(group);
+                // A group whose every row carries a chosen-one is a CHOICE, so it is a
+                // named `group` of `menuitemradio` rows (see MenuRow) — a heading alone
+                // would leave the rows unrelated.
+                const choice = items.every((it) => it.active !== undefined);
+                const rows = items.map((item) => (0, jsx_runtime_1.jsx)(Row, { item: item, onDone: onDone, component: component }, item.id));
+                return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [i > 0 || shown || email ? (0, jsx_runtime_1.jsx)(Rule, {}) : null, label ? (0, jsx_runtime_1.jsx)(MenuRow_1.MenuLabel, { children: label }) : null, choice ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "group", "aria-label": label, gap: "$1", children: rows })) : (rows)] }, i));
+            }), theme != null ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Rule, {}), (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: "$ink", children: "Theme" }), theme] })] })) : null, onSignOut ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Rule, {}), (0, jsx_runtime_1.jsx)(Row, { item: { id: 'sign-out', label: signOutLabel, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.LogOut, { size: 16 }), onPress: onSignOut }, onDone: onDone, component: component })] })) : null] }));
+}

package/dist/product/account.d.ts

@@ -0,0 +1,55 @@
+/**
+ * The account menu's body — who is signed in, the host's groups of rows, the
+ * theme, and signing out.
+ *
+ * `UserMenu` draws it under its avatar trigger; `SessionRail` draws it over its
+ * account row. It is one body in one file so the two menus cannot drift apart —
+ * the same header, the same rules between groups, the same named group for a
+ * choice, the same sign-out at the foot.
+ *
+ * Off the product barrel on purpose: a host wants a whole menu, and gets one
+ * from either of those two. This is the part they share.
+ */
+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;
+    /**
+     * Whether this row is the chosen one — for a group that is a CHOICE rather
+     * than a list of actions (which theme, which language). Its presence makes the
+     * group a named `group` and the row a `menuitemradio`, so assistive tech is
+     * told that exactly one of them holds, and the chosen row carries a check.
+     */
+    active?: boolean;
+};
+/** A group of rows, optionally named. A bare array is the unnamed form. */
+export type UserMenuGroup = UserMenuItem[] | {
+    label?: string;
+    items: UserMenuItem[];
+};
+export type AccountProps = {
+    name?: string;
+    email?: string;
+    groups?: UserMenuGroup[];
+    /**
+     * The theme row's control. Absent, there is no theme row. `UserMenu` passes
+     * its default `<ThemeToggle/>`; this body does not import it, because that
+     * toggle reaches the optional `@hanzogui/next-theme` peer, and a rail that
+     * only wanted an account menu must not put that peer in its host's bundle —
+     * Vite 8 fails the build on the missing peer's export.
+     */
+    theme?: ReactNode;
+    onSignOut?: () => void;
+    signOutLabel?: string;
+    /** Called after any row runs — the host closes its popover. */
+    onDone: () => void;
+    /** The menu that drew this body, as analytics names it — `UserMenu`, `SessionRail`. */
+    component: string;
+};
+export declare function Account({ name, email, groups, theme, onSignOut, signOutLabel, onDone, component }: AccountProps): import("react").JSX.Element;
+//# sourceMappingURL=account.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"account.d.ts","sourceRoot":"","sources":["../../src/product/account.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;AASrD,+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;IAChB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,2EAA2E;AAC3E,MAAM,MAAM,aAAa,GAAG,YAAY,EAAE,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,YAAY,EAAE,CAAA;CAAE,CAAA;AAKtF,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,aAAa,EAAE,CAAA;IACxB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,uFAAuF;IACvF,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAsBD,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAW,EAAE,KAAK,EAAE,SAAS,EAAE,YAAyB,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,YAAY,+BAuEjI"}

package/dist/product/account.js

@@ -0,0 +1,35 @@
+'use client';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Separator, Text, XStack, YStack } from '@hanzo/gui';
+import { LogOut } from '@hanzogui/lucide-icons-2';
+import { useEmit } from './instrument.js';
+import { menuKeyDown } from './menu/roving.js';
+import { MenuLabel, MenuRow } from './MenuRow.js';
+import { displayName } from './name.js';
+const itemsOf = (g) => (Array.isArray(g) ? g : g.items);
+const nameOf = (g) => (Array.isArray(g) ? undefined : g.label);
+function Row({ item, onDone, component }) {
+    const track = useEmit();
+    return (_jsx(MenuRow, { label: item.label, icon: item.icon, active: item.active, danger: item.danger, onPress: () => {
+            track({ component, action: 'select', id: item.id });
+            onDone();
+            item.onPress();
+        } }));
+}
+/** A rule between groups — never above the first thing in the menu. */
+const Rule = () => _jsx(Separator, { borderColor: "$borderColor", my: "$1" });
+export function Account({ name, email, groups = [], theme, onSignOut, signOutLabel = 'Sign out', onDone, component }) {
+    const shown = displayName(name, email);
+    const filled = groups.filter((g) => itemsOf(g).length > 0);
+    return (_jsxs(YStack, { gap: "$1", onKeyDown: (e) => menuKeyDown(e), children: [shown || email ? (_jsxs(YStack, { gap: "$0.5", px: "$2", py: "$1.5", children: [shown ? (_jsx(Text, { fontSize: "$2", fontWeight: "700", color: "$ink", numberOfLines: 1, children: shown })) : null, email && email !== shown ? (_jsx(Text, { fontSize: "$1", color: "$soft", numberOfLines: 1, children: email })) : null] })) : null, filled.map((group, i) => {
+                const items = itemsOf(group);
+                const label = nameOf(group);
+                // A group whose every row carries a chosen-one is a CHOICE, so it is a
+                // named `group` of `menuitemradio` rows (see MenuRow) — a heading alone
+                // would leave the rows unrelated.
+                const choice = items.every((it) => it.active !== undefined);
+                const rows = items.map((item) => _jsx(Row, { item: item, onDone: onDone, component: component }, item.id));
+                return (_jsxs(YStack, { gap: "$1", children: [i > 0 || shown || email ? _jsx(Rule, {}) : null, label ? _jsx(MenuLabel, { children: label }) : null, choice ? (_jsx(YStack, { role: "group", "aria-label": label, gap: "$1", children: rows })) : (rows)] }, i));
+            }), theme != null ? (_jsxs(_Fragment, { children: [_jsx(Rule, {}), _jsxs(XStack, { items: "center", gap: "$2.5", px: "$2", py: "$1", rounded: "$3", children: [_jsx(Text, { flex: 1, fontSize: "$2", color: "$ink", children: "Theme" }), theme] })] })) : null, onSignOut ? (_jsxs(_Fragment, { children: [_jsx(Rule, {}), _jsx(Row, { item: { id: 'sign-out', label: signOutLabel, icon: _jsx(LogOut, { size: 16 }), onPress: onSignOut }, onDone: onDone, component: component })] })) : null] }));
+}
+//# sourceMappingURL=account.js.map

package/dist/product/account.js.map

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

package/dist/product/menu/roving.cjs

@@ -11,8 +11,11 @@ function menuKeyDown(e, onClose) {
         return;
     if (typeof document === 'undefined')
         return;
+    const target = e.target;
+    if (target && /^(INPUT|TEXTAREA)$/.test(target.tagName))
+        return;
     const panel = e.currentTarget;
-    const items = Array.from(panel.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])'));
+    const items = Array.from(panel.querySelectorAll(['menuitem', 'menuitemradio', 'menuitemcheckbox'].map((r) => `[role="${r}"]:not([aria-disabled="true"])`).join(', ')));
     if (items.length === 0)
         return;
     e.preventDefault();

package/dist/product/menu/roving.d.ts

@@ -1,8 +1,13 @@
 /**
  * Roving keyboard focus for a menu panel — ArrowUp/Down move focus between enabled
- * `[role="menuitem"]` children, Home/End jump to ends, Escape closes. Web/desktop
- * only (guards on `document`); native menus have no pointer-keyboard nav. Shared by
- * DropdownMenu and ContextMenu so navigation is identical.
+ * menu items (`menuitem`, `menuitemradio`, `menuitemcheckbox`), wrapping at the
+ * ends; Home/End jump to them; Escape closes. Web/desktop only (guards on
+ * `document`); native menus have no pointer-keyboard nav. Shared by DropdownMenu,
+ * ContextMenu and the account sheets (`UserMenu`, `OrgSwitcher`, `SessionRail`'s
+ * menu) so navigation is identical.
+ *
+ * A key typed into a field inside the panel — a sheet's search box — is the
+ * field's: Home and End move its caret, not the menu.
  */
 import type { KeyboardEvent } from 'react';
 export declare function menuKeyDown(e: KeyboardEvent, onClose?: () => void): void;

package/dist/product/menu/roving.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"roving.d.ts","sourceRoot":"","sources":["../../../src/product/menu/roving.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,wBAAgB,WAAW,CAAC,CAAC,EAAE,aAAa,EAAE,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,IAAI,CAuBxE"}
+{"version":3,"file":"roving.d.ts","sourceRoot":"","sources":["../../../src/product/menu/roving.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,wBAAgB,WAAW,CAAC,CAAC,EAAE,aAAa,EAAE,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,IAAI,CA2BxE"}

package/dist/product/menu/roving.js

@@ -8,8 +8,11 @@ export function menuKeyDown(e, onClose) {
         return;
     if (typeof document === 'undefined')
         return;
+    const target = e.target;
+    if (target && /^(INPUT|TEXTAREA)$/.test(target.tagName))
+        return;
     const panel = e.currentTarget;
-    const items = Array.from(panel.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])'));
+    const items = Array.from(panel.querySelectorAll(['menuitem', 'menuitemradio', 'menuitemcheckbox'].map((r) => `[role="${r}"]:not([aria-disabled="true"])`).join(', ')));
     if (items.length === 0)
         return;
     e.preventDefault();

package/dist/product/menu/roving.js.map

@@ -1 +1 @@
-{"version":3,"file":"roving.js","sourceRoot":"","sources":["../../../src/product/menu/roving.ts"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAUZ,MAAM,UAAU,WAAW,CAAC,CAAgB,EAAE,OAAoB;IAChE,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;QACvB,OAAO,EAAE,EAAE,CAAA;QACX,OAAM;IACR,CAAC;IACD,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,IAAI,CAAC,CAAC,GAAG,KAAK,MAAM,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;QAAE,OAAM;IAC/F,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAM;IAE3C,MAAM,KAAK,GAAG,CAAC,CAAC,aAA4B,CAAA;IAC5C,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CACtB,KAAK,CAAC,gBAAgB,CAAc,+CAA+C,CAAC,CACrF,CAAA;IACD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAM;IAC9B,CAAC,CAAC,cAAc,EAAE,CAAA;IAElB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAmC,CAAA;IAC3D,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IACnD,IAAI,IAAY,CAAA;IAChB,IAAI,CAAC,CAAC,GAAG,KAAK,MAAM;QAAE,IAAI,GAAG,CAAC,CAAA;SACzB,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;QAAE,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAA;SAC5C,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW;QAAE,IAAI,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAA;;QAChF,IAAI,GAAG,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,CAAC,CAAA;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,CAAA;AACtB,CAAC"}
+{"version":3,"file":"roving.js","sourceRoot":"","sources":["../../../src/product/menu/roving.ts"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAeZ,MAAM,UAAU,WAAW,CAAC,CAAgB,EAAE,OAAoB;IAChE,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;QACvB,OAAO,EAAE,EAAE,CAAA;QACX,OAAM;IACR,CAAC;IACD,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,IAAI,CAAC,CAAC,GAAG,KAAK,MAAM,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;QAAE,OAAM;IAC/F,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAM;IAC3C,MAAM,MAAM,GAAG,CAAC,CAAC,MAA4B,CAAA;IAC7C,IAAI,MAAM,IAAI,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QAAE,OAAM;IAE/D,MAAM,KAAK,GAAG,CAAC,CAAC,aAA4B,CAAA;IAC5C,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CACtB,KAAK,CAAC,gBAAgB,CACpB,CAAC,UAAU,EAAE,eAAe,EAAE,kBAAkB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,gCAAgC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CACrH,CACF,CAAA;IACD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAM;IAC9B,CAAC,CAAC,cAAc,EAAE,CAAA;IAElB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAmC,CAAA;IAC3D,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IACnD,IAAI,IAAY,CAAA;IAChB,IAAI,CAAC,CAAC,GAAG,KAAK,MAAM;QAAE,IAAI,GAAG,CAAC,CAAA;SACzB,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;QAAE,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAA;SAC5C,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW;QAAE,IAAI,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAA;;QAChF,IAAI,GAAG,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,CAAC,CAAA;IACzD,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,CAAA;AACtB,CAAC"}

package/dist/settings/Section.cjs

@@ -0,0 +1,71 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Heading = Heading;
+exports.Group = Group;
+exports.Card = Card;
+exports.Row = Row;
+exports.Field = Field;
+exports.Soft = Soft;
+exports.Note = Note;
+exports.Once = Once;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * What a settings section is drawn from, so every section reads as one page:
+ *
+ *   Heading   the section's title, what it is for, and its one action
+ *   Group     a small title over a run of rows or fields
+ *   Card      a bordered list; its `Row`s draw the rules between them
+ *   Row       one thing in a Card: what it is, a line about it, what can be done
+ *   Field     a labelled control, with a line under it when there is more to say
+ *   Soft      the quiet line for empty, loading, signed-out and refused
+ *   Note      what the last action did, said once, where it was done
+ *   Once      a credential the platform shows once: the value, and a copy
+ *
+ * Presentational. Every string is the host's; nothing here fetches or decides.
+ */
+const gui_1 = require("@hanzo/gui");
+const slot_1 = require("../backends/gui/slot.cjs");
+const CopyButton_1 = require("../product/CopyButton.cjs");
+/** A section's title, what it is for, and its one action. */
+function Heading({ title, detail, action, level = 2 }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('settings-heading'), items: "flex-start", gap: "$3", children: [(0, jsx_runtime_1.jsxs)(gui_1.YStack, { flex: 1, minW: 0, gap: "$1", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { role: "heading", "aria-level": level, size: "$6", color: "$ink", children: title }), detail ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$soft", children: detail })) : null] }), action] }));
+}
+/** A group inside a section: a small title over what it holds. */
+function Group({ title, detail, action, level = 3, children }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('settings-group'), gap: "$2", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$2", children: [(0, jsx_runtime_1.jsxs)(gui_1.YStack, { flex: 1, minW: 0, gap: "$0.5", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { role: "heading", "aria-level": level, size: "$3", color: "$ink", children: title }), detail ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$soft", children: detail })) : null] }), action] }), children] }));
+}
+/**
+ * A bordered box of rows. Its rows draw the rules between them; the first says
+ * `first`. It holds what a section needs in one frame — `Row`s, a form line, a
+ * `Soft` — so it claims no list role its children would have to live up to.
+ */
+function Card({ children }) {
+    return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('settings-card'), borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: children }));
+}
+/** One row of a Card: what it is, a line about it, and what can be done to it. */
+function Row({ title, detail, leading, trailing, first, mono }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('settings-row'), items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: first ? 0 : 1, borderColor: "$borderColor", children: [leading, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { flex: 1, minW: 0, gap: "$0.5", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$ink", numberOfLines: 1, fontFamily: mono ? '$mono' : undefined, children: title }), detail ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$soft", numberOfLines: 2, children: detail })) : null] }), trailing] }));
+}
+/** A labelled control, with a line under it when there is more to say. */
+function Field({ label, hint, children }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('settings-field'), gap: "$1.5", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$ink", children: label }), children, hint ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$soft", children: hint })) : null] }));
+}
+/** The quiet line for empty, loading, signed-out and refused — and the one thing to do about it. */
+function Soft({ children, action }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('settings-soft'), py: "$5", items: "center", gap: "$3", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$soft", text: "center", children: children }), action] }));
+}
+/**
+ * What the last action did, said once, where it was done.
+ *
+ * The live region is ALWAYS there, empty when there is nothing to say: a
+ * `role=status` that mounts together with its text is often not announced,
+ * because a reader watches regions it already knows about for changes.
+ */
+function Note({ children }) {
+    return ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { ...(0, slot_1.slot)('settings-note'), size: "$1", color: "$soft", role: "status", children: children }));
+}
+/** A credential the platform answers once: the value to copy, and what it is for. */
+function Once({ value, label, says = 'Copy it now. It is not shown again.', children }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('settings-once'), gap: "$2", px: "$3", py: "$3", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$2", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", fontFamily: "$mono", "aria-label": label, style: { wordBreak: 'break-all' }, children: value }), (0, jsx_runtime_1.jsx)(CopyButton_1.CopyButton, { value: value, label: `Copy ${label.toLowerCase()}` })] }), (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$soft", children: says }), children] }));
+}

package/dist/settings/Section.d.ts

@@ -0,0 +1,78 @@
+import type { ReactNode } from 'react';
+export interface HeadingProps {
+    title: string;
+    /** One or two lines on what the section is for. */
+    detail?: string;
+    /** The section's one action — an Add, a Save. */
+    action?: ReactNode;
+    /** The heading's outline level. The page's own title is the nav's, so 2. */
+    level?: 1 | 2 | 3;
+}
+/** A section's title, what it is for, and its one action. */
+export declare function Heading({ title, detail, action, level }: HeadingProps): import("react").JSX.Element;
+export interface GroupProps {
+    title: string;
+    detail?: string;
+    action?: ReactNode;
+    /** One level under the section's `Heading`. */
+    level?: 2 | 3 | 4;
+    children: ReactNode;
+}
+/** A group inside a section: a small title over what it holds. */
+export declare function Group({ title, detail, action, level, children }: GroupProps): import("react").JSX.Element;
+/**
+ * A bordered box of rows. Its rows draw the rules between them; the first says
+ * `first`. It holds what a section needs in one frame — `Row`s, a form line, a
+ * `Soft` — so it claims no list role its children would have to live up to.
+ */
+export declare function Card({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+export interface RowProps {
+    title: string;
+    detail?: string;
+    /** Before the words — a mark, an icon, a status. */
+    leading?: ReactNode;
+    /** After them — what can be done to this row. */
+    trailing?: ReactNode;
+    /** The Card's first row draws no rule above itself. */
+    first?: boolean;
+    /** The title is an identifier — a key name, a path — and is set in `$mono`. */
+    mono?: boolean;
+}
+/** One row of a Card: what it is, a line about it, and what can be done to it. */
+export declare function Row({ title, detail, leading, trailing, first, mono }: RowProps): import("react").JSX.Element;
+/** A labelled control, with a line under it when there is more to say. */
+export declare function Field({ label, hint, children }: {
+    label: string;
+    hint?: string;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The quiet line for empty, loading, signed-out and refused — and the one thing to do about it. */
+export declare function Soft({ children, action }: {
+    children: string;
+    action?: ReactNode;
+}): import("react").JSX.Element;
+/**
+ * What the last action did, said once, where it was done.
+ *
+ * The live region is ALWAYS there, empty when there is nothing to say: a
+ * `role=status` that mounts together with its text is often not announced,
+ * because a reader watches regions it already knows about for changes.
+ */
+export declare function Note({ children }: {
+    children: string;
+}): import("react").JSX.Element;
+export interface OnceProps {
+    /** The credential. */
+    value: string;
+    /** What it is — "API key". Names the value and its copy control. */
+    label: string;
+    /** The line under it. */
+    says?: string;
+    /** What follows — a Done. */
+    children?: ReactNode;
+}
+/** A credential the platform answers once: the value to copy, and what it is for. */
+export declare function Once({ value, label, says, children }: OnceProps): import("react").JSX.Element;
+//# sourceMappingURL=Section.d.ts.map

package/dist/settings/Section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../src/settings/Section.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iDAAiD;IACjD,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CAClB;AAED,6DAA6D;AAC7D,wBAAgB,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAS,EAAE,EAAE,YAAY,+BAgBzE;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACjB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,kEAAkE;AAClE,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAS,EAAE,QAAQ,EAAE,EAAE,UAAU,+BAmB/E;AAED;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAYzD;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,oDAAoD;IACpD,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,uDAAuD;IACvD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,+EAA+E;IAC/E,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AAED,kFAAkF;AAClF,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,QAAQ,+BAyB9E;AAED,0EAA0E;AAC1E,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAcrG;AAED,oGAAoG;AACpG,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,SAAS,CAAA;CAAE,+BASlF;AAED;;;;;;GAMG;AACH,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,+BAMtD;AAED,MAAM,WAAW,SAAS;IACxB,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,qFAAqF;AACrF,wBAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAA4C,EAAE,QAAQ,EAAE,EAAE,SAAS,+BAgCvG"}

package/dist/settings/Section.js

@@ -0,0 +1,62 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * What a settings section is drawn from, so every section reads as one page:
+ *
+ *   Heading   the section's title, what it is for, and its one action
+ *   Group     a small title over a run of rows or fields
+ *   Card      a bordered list; its `Row`s draw the rules between them
+ *   Row       one thing in a Card: what it is, a line about it, what can be done
+ *   Field     a labelled control, with a line under it when there is more to say
+ *   Soft      the quiet line for empty, loading, signed-out and refused
+ *   Note      what the last action did, said once, where it was done
+ *   Once      a credential the platform shows once: the value, and a copy
+ *
+ * Presentational. Every string is the host's; nothing here fetches or decides.
+ */
+import { SizableText, XStack, YStack } from '@hanzo/gui';
+import { slot } from '../backends/gui/slot.js';
+import { CopyButton } from '../product/CopyButton.js';
+/** A section's title, what it is for, and its one action. */
+export function Heading({ title, detail, action, level = 2 }) {
+    return (_jsxs(XStack, { ...slot('settings-heading'), items: "flex-start", gap: "$3", children: [_jsxs(YStack, { flex: 1, minW: 0, gap: "$1", children: [_jsx(SizableText, { role: "heading", "aria-level": level, size: "$6", color: "$ink", children: title }), detail ? (_jsx(SizableText, { size: "$2", color: "$soft", children: detail })) : null] }), action] }));
+}
+/** A group inside a section: a small title over what it holds. */
+export function Group({ title, detail, action, level = 3, children }) {
+    return (_jsxs(YStack, { ...slot('settings-group'), gap: "$2", children: [_jsxs(XStack, { items: "center", gap: "$2", children: [_jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { role: "heading", "aria-level": level, size: "$3", color: "$ink", children: title }), detail ? (_jsx(SizableText, { size: "$1", color: "$soft", children: detail })) : null] }), action] }), children] }));
+}
+/**
+ * A bordered box of rows. Its rows draw the rules between them; the first says
+ * `first`. It holds what a section needs in one frame — `Row`s, a form line, a
+ * `Soft` — so it claims no list role its children would have to live up to.
+ */
+export function Card({ children }) {
+    return (_jsx(YStack, { ...slot('settings-card'), borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: children }));
+}
+/** One row of a Card: what it is, a line about it, and what can be done to it. */
+export function Row({ title, detail, leading, trailing, first, mono }) {
+    return (_jsxs(XStack, { ...slot('settings-row'), items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: first ? 0 : 1, borderColor: "$borderColor", children: [leading, _jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 1, fontFamily: mono ? '$mono' : undefined, children: title }), detail ? (_jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 2, children: detail })) : null] }), trailing] }));
+}
+/** A labelled control, with a line under it when there is more to say. */
+export function Field({ label, hint, children }) {
+    return (_jsxs(YStack, { ...slot('settings-field'), gap: "$1.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: label }), children, hint ? (_jsx(SizableText, { size: "$1", color: "$soft", children: hint })) : null] }));
+}
+/** The quiet line for empty, loading, signed-out and refused — and the one thing to do about it. */
+export function Soft({ children, action }) {
+    return (_jsxs(YStack, { ...slot('settings-soft'), py: "$5", items: "center", gap: "$3", children: [_jsx(SizableText, { size: "$2", color: "$soft", text: "center", children: children }), action] }));
+}
+/**
+ * What the last action did, said once, where it was done.
+ *
+ * The live region is ALWAYS there, empty when there is nothing to say: a
+ * `role=status` that mounts together with its text is often not announced,
+ * because a reader watches regions it already knows about for changes.
+ */
+export function Note({ children }) {
+    return (_jsx(SizableText, { ...slot('settings-note'), size: "$1", color: "$soft", role: "status", children: children }));
+}
+/** A credential the platform answers once: the value to copy, and what it is for. */
+export function Once({ value, label, says = 'Copy it now. It is not shown again.', children }) {
+    return (_jsxs(YStack, { ...slot('settings-once'), gap: "$2", px: "$3", py: "$3", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", children: [_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", fontFamily: "$mono", "aria-label": label, style: { wordBreak: 'break-all' }, children: value }), _jsx(CopyButton, { value: value, label: `Copy ${label.toLowerCase()}` })] }), _jsx(SizableText, { size: "$1", color: "$soft", children: says }), children] }));
+}
+//# sourceMappingURL=Section.js.map

package/dist/settings/Section.js.map

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