@hanzo/ui 8.27.19 → 8.27.20

package/dist/chat/SessionRail.cjs

@@ -3,43 +3,59 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StatusDot = StatusDot;
 exports.SessionRail = SessionRail;
+exports.RailNotice = RailNotice;
+exports.RailBar = RailBar;
 const jsx_runtime_1 = require("react/jsx-runtime");
 /**
- * SessionRail — the left rail of a sessions surface: start one, go somewhere,
- * reopen a recent one, and who you are.
+ * SessionRail — the left rail of a sessions surface: who it is, find one, start
+ * one, go somewhere, reopen a recent one, and who you are.
  *
+ *   Hanzo Build                 the brand; pressing it starts a new session
+ *   [⌕ Search              ]    finds a session
  *   + New                       the primary row; the current view on a fresh pane
  *   Artifacts · Customize …     the surface's own places, as `links`
  *   More ⌄                      a disclosure over `more`, when there are more
  *   Recents            ⇅        the sessions, newest first, each with a status dot
- *   (z) z@hanzo.ai ⌄   ⚙ ⌕      the account, then settings and search
+ *   [ Try Hanzo in Slack  × ]   `notice` — a `RailNotice`, when the host has one
+ *   (D) Dave            ⌄  ◧    the account and its menu, then collapse
+ *       acme
  *
  * Presentational: no routing, no fetching. `active` comes in, `onOpen` goes out.
  *
- * THE SIDEBAR CANON (console, hanzo.app, hanzo.chat, the extension):
+ * THE SIDEBAR CANON (console, hanzo.app, hanzo.chat, hanzo.build, the extension):
  *   - Collapse is an EXPLICIT toggle and the host persists it. `collapsed` in,
  *     `onCollapse` out. There is no hover-to-expand and no pin.
  *   - Collapsed is a narrow RAIL that stays on screen — icons only, labels as
  *     tooltips — and its top row is the expand control.
- *   - Below `md` there is no rail at all. The column hides, and the same
- *     contents open as a drawer from the left when the host says so (`open`,
- *     `onOpenChange`) — typically from a menu button only a phone shows.
+ *   - Below `md` there is no rail at all. The column hides, `RailBar` is the
+ *     pane's header (menu · brand · search), and its menu opens the same
+ *     contents as a drawer from the left (`open`, `onOpenChange`). Anything
+ *     chosen in the drawer closes it: the drawer is the way to a place, not a
+ *     place.
+ *
+ * ONE WAY to each thing. Search is the box in the head (an icon on the collapsed
+ * rail); settings, usage and signing out are rows of the account menu. There is
+ * no second search or settings control at the foot.
  *
  * Built from the chat `Sidebar` column and its icon button, so the rail is the
- * same material as every other chat surface's.
+ * same material as every other chat surface's. The account menu is the same
+ * body `UserMenu` draws (`product/account.tsx`), anchored to the account row
+ * itself — above it on the open rail, beside it on the collapsed one.
  */
 const gui_1 = require("@hanzo/gui");
 const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
 const react_1 = require("react");
+const button_1 = require("../backends/gui/button.cjs");
+const popover_1 = require("../backends/gui/popover.cjs");
+const press_1 = require("../backends/gui/press.cjs");
 const sheet_1 = require("../backends/gui/sheet.cjs");
 const slot_1 = require("../backends/gui/slot.cjs");
+const account_1 = require("../product/account.cjs");
 const Sidebar_1 = require("./Sidebar.cjs");
 /** Expanded width, px — the column's own width, its hairline outside it. */
 const WIDTH = 272;
 /** Collapsed width, px. The same rail width every chat surface collapses to. */
 const RAIL = 56;
-/** The keyboard focus ring every control in the package draws. */
-const RING = { outlineColor: '$outlineColor', outlineWidth: 2, outlineStyle: 'solid' };
 /** One row: 32px, the 8px radius, icon then label. */
 const ROW = { minH: 32, px: '$2', rounded: '$3', gap: '$2.5' };
 /** The status mark: a 6px dot, filled while something is happening. */
@@ -52,46 +68,158 @@ function StatusDot({ status = 'idle' }) {
 }
 /** Where a row starts: the 16px column every icon and dot sits centred in. */
 const Lead = ({ children }) => ((0, jsx_runtime_1.jsx)(gui_1.XStack, { width: 16, height: 16, shrink: 0, items: "center", justify: "center", children: children }));
+/**
+ * The surface's name, the head's first line and the phone bar's middle. A
+ * press when there is somewhere to go; the words alone otherwise.
+ */
+function Brand({ brand, onPress }) {
+    const face = typeof brand === 'string' ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$5", fontWeight: "600", color: "$ink", numberOfLines: 1, children: brand })) : (brand);
+    if (!onPress)
+        return (0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('rail-brand'), items: "center", minW: 0, children: face });
+    return ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('rail-brand'), ...(0, press_1.press)(onPress), items: "center", minW: 0, rounded: "$2", cursor: "pointer", focusVisibleStyle: press_1.RING, children: face }));
+}
 /** One nav row. On the rail it is the icon alone, the label its tooltip and name. */
-function Row({ label, icon, onPress, active, rail, quiet, expanded, controls, data = 'rail-row' }) {
-    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)(data), ...(rail ? (0, slot_1.tip)(label) : null), ...ROW, items: "center", justify: rail ? 'center' : 'flex-start', cursor: "pointer", role: "button", tabIndex: 0, "aria-label": rail ? label : undefined, "aria-current": active ? 'page' : undefined, "aria-expanded": expanded, "aria-controls": controls, bg: active ? '$raised' : undefined, hoverStyle: { bg: active ? '$raised' : '$hover' }, pressStyle: { bg: '$raised' }, focusVisibleStyle: RING, onPress: onPress, onKeyDown: (e) => {
-            if (e?.key !== 'Enter' && e?.key !== ' ')
-                return;
-            e.preventDefault?.();
-            onPress?.();
-        }, children: [(0, jsx_runtime_1.jsx)(Lead, { children: icon }), rail ? null : ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, flex: 1, color: quiet ? '$soft' : '$ink', children: label }))] }));
+function Item({ label, icon, onPress, active, rail, quiet, expanded, controls, data = 'rail-row' }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)(data), ...(rail ? (0, slot_1.tip)(label) : null), ...(0, press_1.press)(onPress), ...ROW, items: "center", justify: rail ? 'center' : 'flex-start', cursor: "pointer", "aria-label": rail ? label : undefined, "aria-current": active ? 'page' : undefined, "aria-expanded": expanded, "aria-controls": controls, bg: active ? '$raised' : undefined, hoverStyle: { bg: active ? '$raised' : '$hover' }, pressStyle: { bg: '$raised' }, focusVisibleStyle: press_1.RING, children: [(0, jsx_runtime_1.jsx)(Lead, { children: icon }), rail ? null : ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, flex: 1, color: quiet ? '$soft' : '$ink', children: label }))] }));
 }
-/** The account line: avatar, the name clamped, the caret. */
-function Account({ account, rail }) {
-    const face = ((0, jsx_runtime_1.jsx)(gui_1.XStack, { width: 24, height: 24, rounded: 9999, items: "center", justify: "center", bg: "$raised", overflow: "hidden", shrink: 0, children: account.avatar ?? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", fontWeight: "600", color: "$ink", children: account.name.charAt(0).toUpperCase() })) }));
-    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-account'), ...(rail ? (0, slot_1.tip)(account.name) : null), ...ROW, gap: "$2", px: "$1", flex: rail ? undefined : 1, minW: 0, items: "center", justify: rail ? 'center' : 'flex-start', cursor: account.onPress ? 'pointer' : undefined, role: account.onPress ? 'button' : undefined, tabIndex: account.onPress ? 0 : undefined, "aria-label": account.onPress ? `Account: ${account.name}` : undefined, "aria-haspopup": account.onPress ? 'menu' : undefined, hoverStyle: account.onPress ? { bg: '$hover' } : undefined, onPress: account.onPress, onKeyDown: (e) => {
-            if (!account.onPress || (e?.key !== 'Enter' && e?.key !== ' '))
-                return;
-            e.preventDefault?.();
-            account.onPress();
-        }, children: [face, rail ? null : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, flex: 1, minW: 0, color: "$ink", children: account.name }), account.onPress ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronDown, { size: 14, color: "$soft" }) : null] }))] }));
+/** The menu exists when there is something in it to do. */
+const hasMenu = (a) => Boolean(a.onSignOut || a.groups?.some((g) => (Array.isArray(g) ? g : g.items).length));
+/**
+ * The account row: avatar, the name over its second line, the caret — and the
+ * menu it opens, anchored to the row itself.
+ */
+function Who({ account, rail }) {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    // The row, so closing the menu can hand focus back to it: the popover's own
+    // return goes through a trigger ref that an `asChild` stack never fills.
+    const row = (0, react_1.useRef)(null);
+    const menu = hasMenu(account);
+    const acts = menu || Boolean(account.onPress);
+    const said = account.sub ? `${account.name} · ${account.sub}` : account.name;
+    const face = ((0, jsx_runtime_1.jsx)(gui_1.XStack, { width: 24, height: 24, rounded: 9999, items: "center", justify: "center", bg: "$raised", overflow: "hidden", shrink: 0, "aria-hidden": true, children: account.avatar ?? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", fontWeight: "600", color: "$ink", children: account.name.charAt(0).toUpperCase() })) }));
+    const look = {
+        ...(0, slot_1.slot)('rail-account'),
+        ...(rail ? (0, slot_1.tip)(said) : null),
+        ...ROW,
+        gap: '$2',
+        px: '$1',
+        flex: rail ? undefined : 1,
+        minW: 0,
+        items: 'center',
+        justify: rail ? 'center' : 'flex-start',
+        cursor: acts ? 'pointer' : undefined,
+        hoverStyle: acts ? { bg: '$hover' } : undefined,
+        focusVisibleStyle: acts ? press_1.RING : undefined,
+    };
+    const body = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [face, rail ? null : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(gui_1.YStack, { flex: 1, minW: 0, children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, color: "$ink", children: account.name }), account.sub ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { ...(0, slot_1.slot)('rail-account-sub'), size: "$1", numberOfLines: 1, color: "$soft", children: account.sub })) : null] }), acts ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronDown, { size: 14, color: "$soft" }) : null] }))] }));
+    if (!menu)
+        return account.onPress ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...look, ...(0, press_1.press)(account.onPress), "aria-label": `Account: ${said}`, children: body })) : ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...look, children: body }));
+    return ((0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: open, onOpenChange: setOpen, 
+        // Above the row on the open rail, where the row spans the column; beside
+        // it on the collapsed rail, where above would cover the rail's icons.
+        placement: rail ? 'right-end' : 'top-start', allowFlip: true, stayInFrame: true, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(gui_1.XStack, { ref: row, ...look, role: "button", tabIndex: 0, "aria-label": `Account: ${said}`, "aria-haspopup": "menu", "aria-expanded": open, 
+                    // The trigger opens on a press; the keyboard is this row's own (gui
+                    // does not activate role="button" on Enter).
+                    onKeyDown: (e) => {
+                        if (e?.key !== 'Enter' && e?.key !== ' ')
+                            return;
+                        e.preventDefault?.();
+                        setOpen(!open);
+                    }, children: body }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { ...(0, slot_1.slot)('rail-menu'), role: "menu", "aria-label": "Account", sideOffset: 6, 
+                // A menu's rows run its full width; gui's popper centres children.
+                // 260 fits a 390 phone's drawer, and the popper keeps it in frame.
+                items: "stretch", width: 260, p: "$1", rounded: "$3", elevation: "$2", onCloseAutoFocus: (e) => {
+                    e.preventDefault();
+                    row.current?.focus();
+                }, children: (0, jsx_runtime_1.jsx)(account_1.Account, { name: account.name, email: account.email, groups: account.groups, onSignOut: account.onSignOut, signOutLabel: account.signOutLabel, onDone: () => setOpen(false), component: "SessionRail" }) })] }));
 }
 /** The rail's contents — the same tree in the column and in the drawer. */
-function Contents({ onNew, newLabel = 'New', fresh = false, links = [], more = [], moreLabel = 'More', recents, recentsLabel = 'Recents', active = null, onOpen, onSort, sortLabel = 'Sort and filter', empty, notice, account, onSettings, onSearch, collapsed = false, onCollapse, mark, rail, }) {
+function Contents({ brand, onBrand, onSearch, searchLabel = 'Search', onNew, newLabel = 'New', fresh = false, links = [], more = [], moreLabel = 'More', recents, recentsLabel = 'Recents', active = null, onOpen, onSort, sortLabel = 'Sort and filter', empty, notice, account, collapsed = false, onCollapse, mark, rail, }) {
     const [unfolded, setUnfolded] = (0, react_1.useState)(false);
     const id = (0, react_1.useId)();
     const moreId = `${id}-more`;
     const headId = `${id}-recents`;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [rail ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { justify: "center", pb: "$1", children: (0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Expand sidebar", width: 36, height: 36, onPress: () => onCollapse?.(false), children: mark ?? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.PanelLeft, { size: 16 }) }) })) : null, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('rail-nav'), gap: "$0", role: "list", children: [onNew ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Row, { label: newLabel, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Plus, { size: 16 }), onPress: onNew, active: fresh, rail: rail, data: "rail-new" }) })) : null, links.map((link) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Row, { label: link.label, icon: link.icon, onPress: link.onPress, active: link.active, rail: rail }) }, link.id))), more.length ? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { role: "listitem", children: [(0, jsx_runtime_1.jsx)(Row, { label: moreLabel, icon: unfolded ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronUp, { size: 16 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronDown, { size: 16 }), onPress: () => setUnfolded((v) => !v), rail: rail, quiet: true, expanded: unfolded, controls: moreId, data: "rail-more" }), unfolded ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { id: moreId, role: "list", gap: "$0", children: more.map((link) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Row, { label: link.label, icon: link.icon, onPress: link.onPress, active: link.active, rail: rail }) }, link.id))) })) : null] })) : null] }), rail ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { flex: 1 })) : ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('rail-recents'), flex: 1, minH: 0, mt: "$5", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", justify: "space-between", height: 28, pl: "$2", pr: "$1", shrink: 0, children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { id: headId, size: "$2", color: "$soft", children: recentsLabel }), onSort ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: sortLabel, onPress: onSort, width: 24, height: 24, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ArrowDownUp, { size: 14 }) })) : null] }), (0, jsx_runtime_1.jsx)(gui_1.ScrollView, { flex: 1, showsVerticalScrollIndicator: false, children: recents.length === 0 ? (empty ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { px: "$2", py: "$2", children: typeof empty === 'string' ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$soft", children: empty })) : (empty) })) : null) : ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "list", "aria-labelledby": headId, gap: 1, children: recents.map((s) => {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [rail ? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { items: "center", gap: "$1", pb: "$1", children: [(0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Expand sidebar", width: 36, height: 36, onPress: () => onCollapse?.(false), children: mark ?? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.PanelLeft, { size: 16 }) }), onSearch ? ((0, jsx_runtime_1.jsx)(Item, { label: searchLabel, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Search, { size: 16 }), onPress: onSearch, rail: true, data: "rail-search" })) : null] })) : brand || onSearch ? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('rail-head'), gap: "$2.5", pt: 2, pb: "$4", shrink: 0, children: [brand ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { px: "$2.5", children: (0, jsx_runtime_1.jsx)(Brand, { brand: brand, onPress: onBrand ?? onNew }) })) : null, onSearch ? ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-search'), ...(0, press_1.press)(onSearch), "aria-label": searchLabel, items: "center", gap: "$2", px: "$2.5", height: 34, rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", cursor: "pointer", hoverStyle: { bg: '$hover' }, focusVisibleStyle: press_1.RING, children: [(0, jsx_runtime_1.jsx)(lucide_icons_2_1.Search, { size: 15, color: "$soft" }), (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$soft", children: searchLabel })] })) : null] })) : null, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('rail-nav'), gap: "$0", role: "list", children: [onNew ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Item, { label: newLabel, icon: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Plus, { size: 16 }), onPress: onNew, active: fresh, rail: rail, data: "rail-new" }) })) : null, links.map((link) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Item, { label: link.label, icon: link.icon, onPress: link.onPress, active: link.active, rail: rail }) }, link.id))), more.length ? ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { role: "listitem", children: [(0, jsx_runtime_1.jsx)(Item, { label: moreLabel, icon: unfolded ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronUp, { size: 16 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronDown, { size: 16 }), onPress: () => setUnfolded((v) => !v), rail: rail, quiet: true, expanded: unfolded, controls: moreId, data: "rail-more" }), unfolded ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { id: moreId, role: "list", gap: "$0", children: more.map((link) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsx)(Item, { label: link.label, icon: link.icon, onPress: link.onPress, active: link.active, rail: rail }) }, link.id))) })) : null] })) : null] }), rail ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { flex: 1 })) : ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('rail-recents'), flex: 1, minH: 0, mt: "$5", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", justify: "space-between", height: 28, pl: "$2", pr: "$1", shrink: 0, children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { id: headId, size: "$2", color: "$soft", children: recentsLabel }), onSort ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: sortLabel, onPress: onSort, width: 24, height: 24, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ArrowDownUp, { size: 14 }) })) : null] }), (0, jsx_runtime_1.jsx)(gui_1.ScrollView, { flex: 1, showsVerticalScrollIndicator: false, children: recents.length === 0 ? (empty ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { px: "$2", py: "$2", children: typeof empty === 'string' ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$soft", children: empty })) : (empty) })) : null) : ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "list", "aria-labelledby": headId, gap: 1, children: recents.map((s) => {
                                 const on = s.id === active;
-                                return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-session'), ...ROW, items: "center", cursor: "pointer", role: "button", tabIndex: 0, "aria-current": on ? 'page' : undefined, bg: on ? '$raised' : undefined, hoverStyle: { bg: on ? '$raised' : '$hover' }, pressStyle: { bg: '$raised' }, focusVisibleStyle: RING, onPress: () => onOpen(s.id), onKeyDown: (e) => {
-                                            if (e?.key !== 'Enter' && e?.key !== ' ')
-                                                return;
-                                            e.preventDefault?.();
-                                            onOpen(s.id);
-                                        }, children: [(0, jsx_runtime_1.jsx)(Lead, { children: (0, jsx_runtime_1.jsx)(StatusDot, { status: s.status }) }), (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, flex: 1, minW: 0, color: on ? '$ink' : '$quiet', children: s.title })] }) }, s.id));
-                            }) })) })] })), notice && !rail ? (0, jsx_runtime_1.jsx)(gui_1.YStack, { pt: "$2", children: notice }) : null, (0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-foot'), items: "center", gap: "$1", pt: "$2", mt: "$1", borderTopWidth: 1, borderColor: "$borderColor", flexDirection: rail ? 'column' : 'row', children: [account ? (0, jsx_runtime_1.jsx)(Account, { account: account, rail: rail }) : (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), onSettings ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Settings", onPress: onSettings, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Settings, { size: 16 }) })) : null, onSearch ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Search", onPress: onSearch, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Search, { size: 16 }) })) : null, onCollapse && !rail ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Collapse sidebar", onPress: () => onCollapse(!collapsed), children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.PanelLeft, { size: 16 }) })) : null] })] }));
+                                return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { role: "listitem", children: (0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-session'), ...(0, press_1.press)(() => onOpen(s.id)), ...ROW, items: "center", cursor: "pointer", "aria-current": on ? 'page' : undefined, bg: on ? '$raised' : undefined, hoverStyle: { bg: on ? '$raised' : '$hover' }, pressStyle: { bg: '$raised' }, focusVisibleStyle: press_1.RING, children: [(0, jsx_runtime_1.jsx)(Lead, { children: (0, jsx_runtime_1.jsx)(StatusDot, { status: s.status }) }), (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", numberOfLines: 1, flex: 1, minW: 0, color: on ? '$ink' : '$quiet', children: s.title })] }) }, s.id));
+                            }) })) })] })), notice && !rail ? (0, jsx_runtime_1.jsx)(gui_1.YStack, { pt: "$2", children: notice }) : null, (0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-foot'), items: "center", gap: "$1", pt: "$2", mt: "$1", borderTopWidth: 1, borderColor: "$borderColor", flexDirection: rail ? 'column' : 'row', children: [account ? (0, jsx_runtime_1.jsx)(Who, { account: account, rail: rail }) : (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), onCollapse && !rail ? ((0, jsx_runtime_1.jsx)(Sidebar_1.SidebarIconButton, { label: "Collapse sidebar", onPress: () => onCollapse(!collapsed), children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.PanelLeft, { size: 16 }) })) : null] })] }));
 }
+/** `run`, then close the drawer — or nothing, when there is nothing to run. */
+const closing = (close) => (run) => run ? (...args) => (close(), run(...args)) : undefined;
 function SessionRail(props) {
     const { 
     // Everything the contents read is named here, so none of it reaches the
     // column as a stray DOM attribute through `rest`.
-    onNew, newLabel, fresh, links, more, moreLabel, recents, recentsLabel, active, onOpen, onSort, sortLabel, empty, notice, account, onSettings, onSearch, collapsed = false, onCollapse, mark, open = false, onOpenChange, label = 'Sessions', width = WIDTH, ...rest } = props;
+    brand, onBrand, onSearch, searchLabel, onNew, newLabel, fresh, links, more, moreLabel, recents, recentsLabel, active, onOpen, onSort, sortLabel, empty, notice, account, collapsed = false, onCollapse, mark, open = false, onOpenChange, label = 'Sessions', width = WIDTH, ...rest } = props;
     const rail = collapsed;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Sidebar_1.Sidebar, { ...(0, slot_1.slot)('session-rail'), role: "navigation", "aria-label": label, "data-collapsed": rail ? 'true' : 'false', width: rail ? RAIL : width, gap: "$0", px: rail ? '$1.5' : '$2', py: "$2", "$max-md": { display: 'none' }, ...rest, children: (0, jsx_runtime_1.jsx)(Contents, { ...props, rail: rail }) }), open ? ((0, jsx_runtime_1.jsx)(sheet_1.Sheet, { open: open, onOpenChange: onOpenChange, children: (0, jsx_runtime_1.jsxs)(sheet_1.SheetContent, { side: "left", width: width, maxW: "86%", p: "$2", gap: "$0", bg: "$panel", children: [(0, jsx_runtime_1.jsx)(sheet_1.SheetTitle, { ...(0, slot_1.slot)('session-rail-title'), position: "absolute", opacity: 0, pointerEvents: "none", children: label }), (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('session-rail-drawer'), role: "navigation", "aria-label": label, flex: 1, minH: 0, children: (0, jsx_runtime_1.jsx)(Contents, { ...props, rail: false, collapsed: false, onCollapse: undefined, onNew: onNew ? () => (onOpenChange?.(false), onNew()) : undefined, onOpen: (sid) => (onOpenChange?.(false), onOpen(sid)) }) })] }) })) : null] }));
+    // Where focus was when the drawer opened — the phone bar's menu button — and
+    // where it goes back to when the drawer closes, by Escape or by a choice. A
+    // dialog returns focus to its own trigger, and this drawer has none: the host
+    // opens it from `RailBar`, which the dialog cannot see.
+    //
+    // Read in RENDER, on the one render where `open` turns true — before the
+    // drawer exists. gui's Dialog is a native `<dialog>`, and a browser moves focus
+    // into one the moment it opens, so by any effect (the focus scope's own
+    // `onOpenAutoFocus` included, which then never fires because focus is already
+    // inside) the opener is gone. jsdom's `<dialog>` moves nothing, which is why
+    // the unit suite could not see this and the consumer suite asserts it.
+    const back = (0, react_1.useRef)(null);
+    const was = (0, react_1.useRef)(false);
+    if (open && !was.current && typeof document !== 'undefined')
+        back.current = document.activeElement;
+    was.current = open;
+    // One way out, said ONCE per gesture. A choice closes the drawer, and the
+    // dialog can also report its own dismissal while it unmounts in that same
+    // turn; the host hears one `onOpenChange(false)`. The latch lets go after the
+    // turn, so a host that keeps the drawer open still hears the next choice.
+    const closed = (0, react_1.useRef)(false);
+    const close = () => {
+        if (closed.current)
+            return;
+        closed.current = true;
+        setTimeout(() => {
+            closed.current = false;
+        }, 0);
+        onOpenChange?.(false);
+    };
+    const shut = closing(close);
+    const relink = (list) => list?.map((l) => ({ ...l, onPress: shut(l.onPress) }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Sidebar_1.Sidebar, { ...(0, slot_1.slot)('session-rail'), role: "navigation", "aria-label": label, "data-collapsed": rail ? 'true' : 'false', width: rail ? RAIL : width, gap: "$0", px: rail ? '$1.5' : '$2', py: "$2", "$max-md": { display: 'none' }, ...rest, children: (0, jsx_runtime_1.jsx)(Contents, { ...props, rail: rail }) }), open ? ((0, jsx_runtime_1.jsx)(sheet_1.Sheet, { open: open, onOpenChange: (next) => (next ? onOpenChange?.(true) : close()), children: (0, jsx_runtime_1.jsxs)(sheet_1.SheetContent, { side: "left", width: width, maxW: "86%", p: "$2", gap: "$0", bg: "$panel", onCloseAutoFocus: (e) => {
+                        const to = back.current;
+                        if (!to?.isConnected)
+                            return;
+                        e.preventDefault();
+                        // After the event that closed it: a tap on the overlay dismisses on
+                        // pointerdown, and the mousedown that follows would blur this
+                        // focus straight back to the page.
+                        setTimeout(() => {
+                            if (to.isConnected)
+                                to.focus();
+                        }, 0);
+                    }, children: [(0, jsx_runtime_1.jsx)(sheet_1.SheetTitle, { ...(0, slot_1.slot)('session-rail-title'), position: "absolute", opacity: 0, pointerEvents: "none", children: label }), (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('session-rail-drawer'), role: "navigation", "aria-label": label, flex: 1, minH: 0, children: (0, jsx_runtime_1.jsx)(Contents, { ...props, rail: false, collapsed: false, onCollapse: undefined, onBrand: shut(onBrand ?? onNew), onSearch: shut(onSearch), onNew: shut(onNew), onOpen: shut(onOpen), links: relink(links), more: relink(more), account: account && {
+                                    ...account,
+                                    onPress: shut(account.onPress),
+                                    onSignOut: shut(account.onSignOut),
+                                    groups: account.groups?.map((g) => Array.isArray(g)
+                                        ? g.map((i) => ({ ...i, onPress: shut(i.onPress) }))
+                                        : { ...g, items: g.items.map((i) => ({ ...i, onPress: shut(i.onPress) })) }),
+                                } }) })] }) })) : null] }));
+}
+/**
+ * RailNotice — a small card at the rail's foot, above the account: an offer
+ * ("Try Hanzo in Slack"), its one action, and a way to put it away. Pass it as
+ * `SessionRail notice`; the host decides when it shows and remembers a dismissal.
+ */
+function RailNotice({ icon, title, action, onAction, onDismiss, dismissLabel = 'Dismiss', ...rest }) {
+    const id = (0, react_1.useId)();
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-notice'), items: "center", gap: "$2.5", px: "$3", py: "$2.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", ...rest, children: [icon ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { shrink: 0, "aria-hidden": true, children: icon })) : null, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { flex: 1, minW: 0, gap: "$0.5", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { id: `${id}-title`, size: "$2", color: "$ink", numberOfLines: 1, children: title }), action && onAction ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('rail-notice-action'), ...(0, press_1.press)(onAction), "aria-describedby": `${id}-title`, self: "flex-start", cursor: "pointer", rounded: "$1", focusVisibleStyle: press_1.RING, children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$soft", textDecorationLine: "underline", children: action }) })) : null] }), onDismiss ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('rail-notice-dismiss'), ...(0, press_1.press)(onDismiss), ...(0, slot_1.tip)(dismissLabel), "aria-label": dismissLabel, p: "$1", rounded: "$2", cursor: "pointer", hoverStyle: { bg: '$hover' }, focusVisibleStyle: press_1.RING, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.X, { size: 14 }) })) : null] }));
+}
+/**
+ * RailBar — the phone's header for a surface with a `SessionRail`: the menu
+ * that opens the rail's drawer, the brand, and search on the right. Only below
+ * `md`, where there is no rail; from `md` up it draws nothing and the rail's own
+ * head carries the same three. Place it at the top of the pane, in flow.
+ */
+function RailBar({ onMenu, menuLabel = 'Open menu', brand, onBrand, onSearch, searchLabel = 'Search', ...rest }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('rail-bar'), height: 44, px: "$2", gap: "$2", items: "center", shrink: 0, $md: { display: 'none' }, ...rest, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "ghost", size: "icon-sm", onPress: onMenu, "aria-label": menuLabel, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Menu, { size: 18 }) }), brand ? (0, jsx_runtime_1.jsx)(Brand, { brand: brand, onPress: onBrand }) : null, (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), onSearch ? ((0, jsx_runtime_1.jsx)(button_1.Button, { variant: "ghost", size: "icon-sm", onPress: onSearch, "aria-label": searchLabel, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Search, { size: 18 }) })) : null] }));
 }

package/dist/chat/SessionRail.d.ts

@@ -1,30 +1,44 @@
 /**
- * SessionRail — the left rail of a sessions surface: start one, go somewhere,
- * reopen a recent one, and who you are.
+ * SessionRail — the left rail of a sessions surface: who it is, find one, start
+ * one, go somewhere, reopen a recent one, and who you are.
  *
+ *   Hanzo Build                 the brand; pressing it starts a new session
+ *   [⌕ Search              ]    finds a session
  *   + New                       the primary row; the current view on a fresh pane
  *   Artifacts · Customize …     the surface's own places, as `links`
  *   More ⌄                      a disclosure over `more`, when there are more
  *   Recents            ⇅        the sessions, newest first, each with a status dot
- *   (z) z@hanzo.ai ⌄   ⚙ ⌕      the account, then settings and search
+ *   [ Try Hanzo in Slack  × ]   `notice` — a `RailNotice`, when the host has one
+ *   (D) Dave            ⌄  ◧    the account and its menu, then collapse
+ *       acme
  *
  * Presentational: no routing, no fetching. `active` comes in, `onOpen` goes out.
  *
- * THE SIDEBAR CANON (console, hanzo.app, hanzo.chat, the extension):
+ * THE SIDEBAR CANON (console, hanzo.app, hanzo.chat, hanzo.build, the extension):
  *   - Collapse is an EXPLICIT toggle and the host persists it. `collapsed` in,
  *     `onCollapse` out. There is no hover-to-expand and no pin.
  *   - Collapsed is a narrow RAIL that stays on screen — icons only, labels as
  *     tooltips — and its top row is the expand control.
- *   - Below `md` there is no rail at all. The column hides, and the same
- *     contents open as a drawer from the left when the host says so (`open`,
- *     `onOpenChange`) — typically from a menu button only a phone shows.
+ *   - Below `md` there is no rail at all. The column hides, `RailBar` is the
+ *     pane's header (menu · brand · search), and its menu opens the same
+ *     contents as a drawer from the left (`open`, `onOpenChange`). Anything
+ *     chosen in the drawer closes it: the drawer is the way to a place, not a
+ *     place.
+ *
+ * ONE WAY to each thing. Search is the box in the head (an icon on the collapsed
+ * rail); settings, usage and signing out are rows of the account menu. There is
+ * no second search or settings control at the foot.
  *
  * Built from the chat `Sidebar` column and its icon button, so the rail is the
- * same material as every other chat surface's.
+ * same material as every other chat surface's. The account menu is the same
+ * body `UserMenu` draws (`product/account.tsx`), anchored to the account row
+ * itself — above it on the open rail, beside it on the collapsed one.
  */
-import { YStack } from '@hanzo/gui';
+import { XStack, YStack } from '@hanzo/gui';
 import { type ComponentProps, type ReactNode } from 'react';
+import { type UserMenuGroup } from '../product/account.js';
 type Col = Omit<ComponentProps<typeof YStack>, 'children'>;
+type Row = Omit<ComponentProps<typeof XStack>, 'children'>;
 /** Where a session is. `running` pulses; finished and idle are an open ring. */
 export type SessionStatus = 'running' | 'paused' | 'done' | 'stopped' | 'error' | 'idle';
 export interface RailSession {
@@ -41,14 +55,41 @@ export interface RailLink {
     active?: boolean;
 }
 export interface RailAccount {
-    /** The line shown — an email or a name. */
+    /** The first line — the person's name, or their email. */
     name: string;
+    /** The second line, muted — the organization they act in. */
+    sub?: string;
     /** Avatar slot. Falls back to the first letter of `name`. */
     avatar?: ReactNode;
-    /** The caret beside the name: the account menu. */
+    /** Heads the menu, under the name, when it is not the name itself. */
+    email?: string;
+    /**
+     * The menu's rows, in groups with a rule between. A group whose every row
+     * carries `active` is a choice — a named group, the chosen row checked —
+     * which is how an organization switcher is drawn.
+     */
+    groups?: UserMenuGroup[];
+    /** Sign out, at the foot of the menu. */
+    onSignOut?: () => void;
+    signOutLabel?: string;
+    /**
+     * With no menu (no `groups`, no `onSignOut`), the row is this one action —
+     * a signed-out rail's "Sign in".
+     */
     onPress?: () => void;
 }
 export interface SessionRailProps extends Col {
+    /**
+     * The head's first line — the surface's name. A string is drawn as the
+     * wordmark; a node brings its own (and its own accessible name).
+     */
+    brand?: ReactNode;
+    /** Pressing the brand. Starts a new session (`onNew`) unless given. */
+    onBrand?: () => void;
+    /** Search. The head draws a search box; the collapsed rail an icon. */
+    onSearch?: () => void;
+    /** The search control's accessible name — "Search runs". */
+    searchLabel?: string;
     /** Starts a new session. */
     onNew?: () => void;
     newLabel?: string;
@@ -70,11 +111,10 @@ export interface SessionRailProps extends Col {
     sortLabel?: string;
     /** Shown in place of the list when there are no recents. */
     empty?: ReactNode;
-    /** Drawn above the account row — a notice, a setup card. */
+    /** Drawn above the account row — a `RailNotice`. */
     notice?: ReactNode;
+    /** Who is signed in, and their menu. */
     account?: RailAccount;
-    onSettings?: () => void;
-    onSearch?: () => void;
     /** Collapsed to the icon rail. The host owns and persists it. */
     collapsed?: boolean;
     onCollapse?: (collapsed: boolean) => void;
@@ -93,5 +133,43 @@ export declare function StatusDot({ status }: {
     status?: SessionStatus;
 }): import("react").JSX.Element;
 export declare function SessionRail(props: SessionRailProps): import("react").JSX.Element;
+export interface RailNoticeProps extends Row {
+    /** The notice's mark, ~16px. */
+    icon?: ReactNode;
+    /** What is on offer, one line. */
+    title: string;
+    /** The action's words — "Set up". */
+    action?: string;
+    onAction?: () => void;
+    /** Dismissing it. The host remembers that it was. */
+    onDismiss?: () => void;
+    dismissLabel?: string;
+}
+/**
+ * RailNotice — a small card at the rail's foot, above the account: an offer
+ * ("Try Hanzo in Slack"), its one action, and a way to put it away. Pass it as
+ * `SessionRail notice`; the host decides when it shows and remembers a dismissal.
+ */
+export declare function RailNotice({ icon, title, action, onAction, onDismiss, dismissLabel, ...rest }: RailNoticeProps): import("react").JSX.Element;
+export interface RailBarProps extends Row {
+    /** Opens the rail's drawer. */
+    onMenu: () => void;
+    /** The menu button's accessible name — "Open runs". */
+    menuLabel?: string;
+    /** The surface's name, as the rail's head draws it. */
+    brand?: ReactNode;
+    /** Pressing the brand. */
+    onBrand?: () => void;
+    /** Search, as the rail's head offers it. */
+    onSearch?: () => void;
+    searchLabel?: string;
+}
+/**
+ * RailBar — the phone's header for a surface with a `SessionRail`: the menu
+ * that opens the rail's drawer, the brand, and search on the right. Only below
+ * `md`, where there is no rail; from `md` up it draws nothing and the rail's own
+ * head carries the same three. Place it at the top of the pane, in flow.
+ */
+export declare function RailBar({ onMenu, menuLabel, brand, onBrand, onSearch, searchLabel, ...rest }: RailBarProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=SessionRail.d.ts.map

package/dist/chat/SessionRail.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionRail.d.ts","sourceRoot":"","sources":["../../src/chat/SessionRail.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,OAAO,EAAmC,MAAM,EAAE,MAAM,YAAY,CAAA;AAUpE,OAAO,EAAmB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAM5E,KAAK,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC,CAAA;AAc1D,gFAAgF;AAChF,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;AAExF,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,aAAa,CAAA;CACvB;AAED,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,SAAS,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,sCAAsC;IACtC,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,WAAW;IAC1B,2CAA2C;IAC3C,IAAI,EAAE,MAAM,CAAA;IACZ,6DAA6D;IAC7D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,gBAAiB,SAAQ,GAAG;IAC3C,4BAA4B;IAC5B,KAAK,CAAC,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2CAA2C;IAC3C,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAA;IAClB,oEAAoE;IACpE,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kCAAkC;IAClC,OAAO,EAAE,WAAW,EAAE,CAAA;IACtB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,iEAAiE;IACjE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;IACzC,sFAAsF;IACtF,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,sCAAsC;IACtC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,uEAAuE;AACvE,wBAAgB,SAAS,CAAC,EAAE,MAAe,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,aAAa,CAAA;CAAE,+BAmBxE;AA0SD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAqDlD"}
+{"version":3,"file":"SessionRail.d.ts","sourceRoot":"","sources":["../../src/chat/SessionRail.tsx"],"names":[],"mappings":"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"}