@hanzo/rooms 0.1.73 → 0.1.75

package/dist/Chat.js

@@ -38,7 +38,7 @@ import { download, dropped, fileOf, pct, readable, refOf, retrieve } from "./lib
 import { channel, drop, hold, landed, localOf, spend, take, usePane, useWorkFile } from "./pane.js";
 import { Face, brief as roomBrief, join, roleOf, roomTurn, roster as rosterLine, rosterOf, speakers, speaksOf, voiceOf } from "./cast.js";
 import { cleanForSpeech, speakAgent } from "./speech.js";
-import { Crew, HOUSE, useCrew } from "./crew.js";
+import { AgentMaker, HOUSE, useAgentShelf, useCrew } from "./crew.js";
 import { called } from "./team.js";
 import { Anchor, Box, Button, Text, View, XStack, YStack } from "@hanzo/ui";
 import { useMedia } from "@hanzo/gui";
@@ -49,7 +49,7 @@ import { app, dev, go } from "./lib/host.js";
 import { useRooms } from "./host.js";
 import { chats, house, paidPlan, paused, setCreditsAfterAllowance, useLimits } from "./lib/limits.js";
 import { LimitedBanner } from "@hanzo/ui/product/LimitedBanner";
-import { WEB } from "./lib/web.js";
+import { RESEARCH, WEB } from "./lib/web.js";
 import { useHydrated } from "./lib/hydrated.js";
 import { base, served } from "./lib/ai.js";
 import { onServed } from "./lib/served.js";
@@ -63,7 +63,7 @@ import { Share } from "./Share.js";
 import { ConversationMenu, ThreadMore, useThreadList } from "./thread.js";
 import { Schedule } from "./Schedule.js";
 import { keepFile, useAttach, useKeep } from "./keep.js";
-import { artifacts, lead, nameOf, PAGE, Panel, PanelToggle, prompt, renders, Reply, Served, Summary, useDeck, useKey, useMind, usePanel, frames, name as tabName, } from "@hanzo/build";
+import { artifacts, lead, nameOf, PAGE, Panel, PanelToggle, prompt, renders, Reply, Served, Summary, useDeck, useKey, Suggestions, useCarry, useLanguage, useMind, useSuggestions, usePanel, frames, name as tabName, } from "@hanzo/build";
 import { checkoutUrl } from './lib/pay.js';
 import { Upgrade, useFree } from './Upgrade.js';
 import { enter, LOGIN } from './lib/destination.js';
@@ -88,26 +88,6 @@ const SCRIM = mix("var(--pure-black)", 72, "srgb");
  * room has always read at, so an untouched setting changes nothing.
  */
 const MEASURE = "var(--container-prose, 48rem)";
-/**
- * WHAT AN EMPTY ROOM OFFERS.
- *
- * A blank field asks the reader to invent the first move, and the commonest
- * answer to "what can I help with?" is not knowing what to ask for. These are
- * four shapes of question rather than four topics — read the code you have,
- * find the fault in what it printed, plan the thing you have not built, and
- * shorten something long — so between them they say what kind of help this is
- * without claiming a skill nobody verified.
- *
- * Pressing one FILLS the field and does not send it. Each is the opening of a
- * question the reader has to finish with their own material, and sending it as
- * written would ask about nothing.
- */
-const STARTERS = [
-    "Explain what this code does",
-    "Find the fault in this stack trace",
-    "Plan how to ship this feature",
-    "Summarise this document",
-];
 /**
  * The store, or null when the browser will not give us one.
  *
@@ -522,12 +502,24 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
     // (@hanzo/build `useMind`): the catalog from `GET /v1/models` and what the
     // reader kept, changed from the composer's chip or from Settings.
     const target = useMemo(() => ({ api: api(), token: bearer, org: org() }), [anonymous]); // eslint-disable-line react-hooks/exhaustive-deps
-    const mind = useMind(target);
+    // THE PLAN decides what the chip may offer: Free answers from the free lane
+    // alone, so it opens there and lists the rest as upgrades (@hanzo/build).
+    const catalog = useRef([]);
+    const { limits, notice, reload: reread } = useLimits(!anonymous, org(), (id) => nameOf(id, catalog.current));
+    const mind = useMind(target, anonymous ? "free" : limits?.plan);
+    catalog.current = mind.models;
     const ai = useAi();
     // In the app's frame the composer floats on the pane as a pane of its own.
     const framed = useContext(Framed);
     const opened = useOpen();
     const { thread: open, open: reopen, agents: room, openAgent, seat, emptied, aside, showAside, showSettings } = opened;
+    // What the conversation carries beside its words (@hanzo/build `useCarry`):
+    // the skills picked from `+`, what Hanzo remembers and the mode, said at the
+    // end of the room's system turn so every request carries them.
+    const carry = useCarry(target, open ?? "", (tab) => go(app(`-/customize/${tab}`)));
+    const agentShelf = useAgentShelf();
+    // Up to three things worth doing next, from the person's own activity (@hanzo/build).
+    const hints = useSuggestions(target);
     // THE HEADER'S ⋯ IS THE ROW'S MENU (thread.tsx): rename, pin, share, its
     // link, a new tab, archive and delete, kept by the server. A conversation not
     // in the list yet (just begun, or archived) has no menu until it is.
@@ -695,7 +687,6 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
     // bars and no near note — those live on Settings → Usage. It says something
     // only once the reader is turned away: a reply answered from a free model, or
     // a refusal.
-    const { limits, notice, reload: reread } = useLimits(!anonymous, org(), (id) => nameOf(id, listed));
     const held = paidPlan(limits);
     const pause = notice && (notice.fallback || notice.refused) ? notice : null;
     // The banner's words and ways: the plan by name, when it comes back, and the two ways on.
@@ -723,7 +714,10 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
         // web tools mark the turn, and the client's fetch (lib/web.ts) looks it up
         // before the model is asked and asks without them, so a question about the
         // world, in any language, is answered from what the web says now and streams.
-        params: { reasoning_effort: mind.effort, ...(!anonymous && house(rowOf(model)?.family) ? { tools: WEB } : {}) },
+        params: {
+            reasoning_effort: mind.effort,
+            ...(!anonymous && house(rowOf(model)?.family) ? { tools: carry.gear.gear.research ? [...WEB, RESEARCH] : WEB } : {}),
+        },
         ...(open ? { thread: open } : {}),
         onError: (e) => {
             const needs = planRequired(e);
@@ -763,7 +757,7 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
     // of them talks. It is the first turn every request carries and it follows the room, so
     // pressing a face adds them to the conversation that is open rather than
     // starting another; the turns already said stay where they are.
-    const turn = useMemo(() => roomTurn(room, brief), [room, brief]);
+    const turn = useMemo(() => [roomTurn(room, brief), carry.text].filter(Boolean).join("\n\n") || null, [room, brief, carry.text]);
     const turnNow = useRef(turn);
     turnNow.current = turn;
     const roomNow = useRef(room);
@@ -882,7 +876,9 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
     // as a transcript.
     const { token } = useIamToken();
     const ear = useMemo(() => speech({ ...base(), ...(token ? { token } : {}) }), [token]);
-    const voice = useVoice({ speech: ear, ...useDictation(draft, setDraft) });
+    // The language dictation listens in: the person's own (Settings › General), or the browser's.
+    const [spoken, speakIn] = useLanguage(target);
+    const voice = useVoice({ speech: ear, ...(spoken ? { language: spoken } : {}), ...useDictation(draft, setDraft) });
     // TALK MODE: a hands-free conversation on Hanzo's realtime socket, /v1/voice.
     // The mic streams up, the answer streams back as speech with its words in
     // `talk.reply`, and talking over it stops it. Its own conversation, so its
@@ -1248,7 +1244,7 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
                             : how?.provider
                                 ? `${familyOf(model) || nameOf(model, listed)} is unavailable right now.`
                                 : plainly(wrong, "this conversation");
-        return (_jsx(Failure, { onRetry: resign || bill?.code === "free_plan_cap" ? undefined : () => speak(text, question.id), children: _jsxs(YStack, { gap: "$2", children: [_jsxs(Text, { fontSize: "$3", color: "$ink", children: [whom.length ? `No answer from ${join(whom)}. ` : "", said] }), how?.provider && wrong ? _jsx(Why, { text: detail(wrong) }) : null, !bill && (resign || lift || how?.wallet || how?.visitor) ? (_jsx(XStack, { gap: "$2", flexWrap: "wrap", children: resign ? (_jsx(Button, { size: "sm", onClick: () => {
+        return (_jsx(Failure, { onRetry: resign || lift || bill?.code === "free_plan_cap" ? undefined : () => speak(text, question.id), children: _jsxs(YStack, { gap: "$2", children: [_jsxs(Text, { fontSize: "$3", color: "$ink", children: [whom.length ? `No answer from ${join(whom)}. ` : "", said] }), how?.provider && wrong ? _jsx(Why, { text: detail(wrong) }) : null, lift || (!bill && (resign || how?.wallet || how?.visitor)) ? (_jsx(XStack, { gap: "$2", flexWrap: "wrap", children: resign ? (_jsx(Button, { size: "sm", onClick: () => {
                                 if (typeof window !== "undefined") {
                                     localStorage.removeItem("hanzo_iam_access_token");
                                     localStorage.removeItem("hanzo_iam_refresh_token");
@@ -1337,12 +1333,12 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
                     if (!open)
                         setPlan(null);
                 }, prompt: plan ?? "", model: model, models: models.map((m) => ({ id: m.id, name: nameOf(m.id, listed) })) }), dragging ? (_jsx(YStack, { "aria-hidden": true, position: "absolute", t: 0, r: 0, b: 0, l: 0, z: 10, items: "center", justify: "center", bg: "var(--surface-scrim)", borderWidth: 2, borderStyle: "dashed", borderColor: "$borderColor", rounded: "var(--pane-round)", pointerEvents: "none", children: _jsxs(XStack, { items: "center", gap: "$2", px: "$4", py: "$2.5", rounded: "$10", bg: "$background", borderWidth: 1, borderColor: "$borderColor", children: [_jsx(Paperclip, { size: 15, "aria-hidden": true }), _jsx(Text, { fontSize: "$4", color: "$ink", children: "Drop files to attach" })] }) })) : null, _jsxs(XStack, { "data-slot": "conversation-head", height: 52, items: "center", justify: "space-between", gap: "$3", pl: "$4", pr: "$2", shrink: 0, children: [_jsxs(XStack, { items: "center", gap: "$2", minW: 0, flex: 1, children: [mine ? (_jsx(Text, { fontSize: 15, lineHeight: 20, color: "$ink", numberOfLines: 1, shrink: 1, minW: 0, children: mine.title || "Untitled" })) : null, room.length ? (_jsx(XStack, { role: "list", "aria-label": "Agents in this chat", items: "center", gap: "$1.5", minW: 0, overflowX: "auto", "$platform-web": { scrollbarWidth: "none" }, children: room.map((name) => (_jsxs(XStack, { role: "listitem", items: "center", gap: "$1.5", pl: "$1", pr: "$0.5", py: "$0.5", rounded: 999, borderWidth: 1, borderColor: "$borderColor", shrink: 0, children: [_jsx(Face, { src: faces[name]?.avatar ?? (name === withWhom ? portrait : undefined), emoji: faces[name]?.emoji ?? (name === withWhom ? persona?.emoji : undefined), name: name, size: 22 }), _jsx(Text, { fontSize: "$2", fontWeight: "600", color: "$color", numberOfLines: 1, display: "none", $sm: { display: "flex" }, children: name }), _jsx(Box, { render: "button", onClick: () => openAgent(name), "aria-label": `Remove ${name} from this chat`, title: `Remove ${name}`, width: 24, height: 24, rounded: 999, items: "center", justify: "center", hoverStyle: { bg: "$hover" }, children: _jsx(X, { size: 13, "aria-hidden": true, color: "var(--soft, var(--muted-foreground))" }) })] }, name))) })) : null] }), _jsxs(XStack, { "data-slot": "conversation-controls", items: "center", gap: 2, shrink: 0, children: [open ? _jsx(Share, { thread: open }) : null, mine ? (_jsx(ConversationMenu, { threads: alone, active: open, onSchedule: anonymous ? undefined : () => setPlan(lastAsked()), children: _jsx(XStack, { children: _jsx(ThreadMore, { t: mine }) }) })) : null, _jsx(Summary, { sections: sections, onOpen: () => setPanel(true) }), _jsx(PanelToggle, { open: panel, onToggle: () => setPanel(!panel) })] })] }), wide && aside !== null ? (_jsx(Beside, { children: _jsx(Panel, { side: deck, kinds: NONE, onHide: () => setPanel(false), label: "Tabs", ...browsing }) })) : null, !wide && panel ? _jsx(Panel, { side: deck, kinds: NONE, sheet: true, onHide: () => setPanel(false), label: "Tabs", ...browsing }) : null, isFree(model) ? (_jsxs(Text, { fontSize: "$2", color: "$soft", text: "center", maxW: MEASURE, mx: "auto", px: "$4", py: "$2", children: [freeCopy.notice, " ", _jsx(Anchor, { href: site("/legal/privacy"), children: freeCopy.noticeCta })] })) : null, _jsx(ChatSurface, { ...chat, messages: shown, send: guarded, 
-                // AN EMPTY ROOM CENTRES ITS COMPOSER. While nothing has been said the
-                // opening (the heading and the starters) and the composer sit as one
-                // group in the middle of the height, with or without the plan bars in
-                // the composer's foot; the moment a turn exists the transcript takes the
-                // height and the composer docks under it.
-                center: true, 
+                // AN EMPTY ROOM CENTRES ITS COMPOSER on a laptop. While nothing has been
+                // said the opening (the heading) and the composer sit as one group in the
+                // middle of the height; the moment a turn exists the transcript takes the
+                // height and the composer docks under it. A phone keeps it at the foot,
+                // over the keyboard, from the first moment.
+                center: media.sm, 
                 // AS IT WAS WRITTEN. The package renders a turn's words plainly and
                 // says so — it ships no markdown pipeline because the plugin set is the
                 // surface's to choose — so an answer arrived here reading "```ts" with
@@ -1400,9 +1396,7 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
                 // with it when it did. `Ask` passes its own, because the page embedding
                 // it already has an `<h1>` and a second is the defect that took the
                 // landings off /chat and /dev.
-                empty: heading === null ? undefined : (_jsxs(YStack, { "data-slot": "opening", items: "center", width: "100%", py: "$6", children: [room.length > 1 ? (_jsx(XStack, { items: "center", justify: "center", mb: "$4", children: room.map((name, i) => (_jsx(Box, { ml: i ? -16 : 0, rounded: 40, borderWidth: 2, borderColor: "$background", z: room.length - i, children: _jsx(Face, { src: faces[name]?.avatar, emoji: faces[name]?.emoji, name: name, size: 72 }) }, name))) })) : portrait ? (_jsx(Box, { width: 160, height: 160, rounded: 24, overflow: "hidden", borderWidth: 2, borderColor: "var(--white-15)", boxShadow: "0 10px 24px color-mix(in srgb, var(--pure-black) 70%, transparent)", mb: "$4", bg: "var(--neutral-900)", children: _jsx(View, { render: _jsx("img", { src: portrait, alt: withWhom }), width: "100%", height: "100%", objectFit: "cover" }) })) : null, room.length === 1 && !portrait ? (_jsx(Box, { mb: "$3", children: _jsx(Face, { emoji: mate?.emoji ?? persona?.emoji, name: withWhom, size: 72 }) })) : null, _jsx(Text, { render: "h1", fontSize: "$7", lineHeight: "$7", fontWeight: "700", color: "$ink", text: "center", mb: "$1", children: join(room) || heading || "What can I help with?" }), room.length === 1 && (mate?.description ?? persona?.description) ? (_jsx(Text, { fontSize: "$3", color: "$soft", text: "center", maxW: 500, mb: "$4", lineHeight: "$4", children: mate?.description ?? persona?.description })) : null, _jsx(XStack, { flexWrap: "wrap", justify: "center", gap: "$2", maxW: 560, px: "$3", pb: "$4", children: STARTERS.map((one) => (_jsx(Box, { render: "button", onClick: () => {
-                                    setDraft(`${one} `);
-                                }, px: "$3", py: "$2", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: "$raised" }, children: _jsx(Text, { fontSize: "$2", color: "$soft", children: one }) }, one))) })] })), 
+                empty: heading === null ? undefined : (_jsxs(YStack, { "data-slot": "opening", items: "center", width: "100%", py: "$6", children: [room.length > 1 ? (_jsx(XStack, { items: "center", justify: "center", mb: "$4", children: room.map((name, i) => (_jsx(Box, { ml: i ? -16 : 0, rounded: 40, borderWidth: 2, borderColor: "$background", z: room.length - i, children: _jsx(Face, { src: faces[name]?.avatar, emoji: faces[name]?.emoji, name: name, size: 72 }) }, name))) })) : portrait ? (_jsx(Box, { width: 160, height: 160, rounded: 24, overflow: "hidden", borderWidth: 2, borderColor: "var(--white-15)", boxShadow: "0 10px 24px color-mix(in srgb, var(--pure-black) 70%, transparent)", mb: "$4", bg: "var(--neutral-900)", children: _jsx(View, { render: _jsx("img", { src: portrait, alt: withWhom }), width: "100%", height: "100%", objectFit: "cover" }) })) : null, room.length === 1 && !portrait ? (_jsx(Box, { mb: "$3", children: _jsx(Face, { emoji: mate?.emoji ?? persona?.emoji, name: withWhom, size: 72 }) })) : null, _jsx(Text, { render: "h1", fontSize: "$7", lineHeight: "$7", fontWeight: "700", color: "$ink", text: "center", mb: "$1", children: join(room) || heading || "What can I help with?" }), room.length === 1 && (mate?.description ?? persona?.description) ? (_jsx(Text, { fontSize: "$3", color: "$soft", text: "center", maxW: 500, mb: "$4", lineHeight: "$4", children: mate?.description ?? persona?.description })) : null] })), 
                 // The transcript reads at the same measure. `Thread` defaults to 768
                 // itself; handing it the column here is what lets Width reach it.
                 column: { maxW: MEASURE }, composer: prompt({
@@ -1413,9 +1407,7 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
                     busy: chat.streaming,
                     // Files alone are a message: what is held goes with an empty draft too.
                     ready: Boolean(draft.trim() || files.length),
-                    // A CHARACTER IS WHO YOU ARE WRITING TO, so the field says so, and
-                    // `label` keeps the accessible name constant while it does.
-                    placeholder: room.length ? `Message ${join(room)}` : placeholder,
+                    // `label` keeps the accessible name constant; the placeholder is the composer's own.
                     label: ASK,
                     note: caution(),
                     // A phone's pill is the tall one: the field across the top, the controls under it.
@@ -1441,15 +1433,40 @@ function Thread({ placeholder = message(), initial, anonymous = false, heading,
                                         : talk.state === "listening"
                                             ? "Listening — speak, and Hanzo answers aloud."
                                             : "Connecting…" })) : null] })) : undefined,
-                    // THE PAPERCLIP is the Sources tab's "Attach files", one press closer:
-                    // the same `take`, into the same `hold`.
-                    onAttach: () => take(at, via),
-                    // The one model-and-effort chip Dev's composer has (@hanzo/build).
+                    // THE `+`: files (the Sources tab's "Attach files", one press closer),
+                    // who is in the conversation, the skills, and the two switches.
+                    plus: anonymous
+                        ? { upload: () => take(at, via) }
+                        : {
+                            upload: () => take(at, via),
+                            agents: agentShelf,
+                            skills: carry.skills,
+                            research: { on: carry.gear.gear.research, set: (on) => carry.gear.set({ research: on }) },
+                            memory: { on: carry.gear.gear.memory, set: (on) => carry.gear.set({ memory: on }) },
+                        },
+                    // Who is in the room, then what the conversation carries, as chips after `+`.
+                    on: [
+                        ...room.map((name) => ({
+                            id: `agent:${name}`,
+                            label: name,
+                            icon: _jsx(Face, { src: faces[name]?.avatar, emoji: faces[name]?.emoji, name: name, size: 16 }),
+                            onRemove: () => seat(room.filter((one) => one !== name)),
+                        })),
+                        ...(anonymous ? [] : carry.on),
+                    ],
+                    slash: anonymous ? undefined : carry.skills,
+                    mode: anonymous ? null : { value: carry.gear.gear.mode, set: (m) => carry.gear.set({ mode: m }) },
+                    // The model, the effort and the mode under the frame (@hanzo/build).
                     mind,
                     limits,
+                    onUpgrade: (id) => setAsk({ model: nameOf(id, listed) }),
                     voice,
+                    language: spoken,
+                    onLanguage: speakIn,
                     talk,
-                }) }), said.length === 0 ? _jsx(Crew, {}) : null, isFree(model) ? (_jsx(XStack, { items: "center", justify: "center", py: "$1", px: "$3", borderTopWidth: 1, borderColor: "$borderColor", bg: "$background", children: _jsxs(Text, { fontSize: "$1", color: "$soft", children: ["Free chat is data-shared to train models. ", _jsx(Anchor, { href: site("/privacy"), fontSize: "$1", color: "$ink", children: "Privacy" })] }) })) : null, consent, _jsx(Upgrade, { ask: ask, onClose: () => setAsk(null) })] }));
+                    // While nothing has been said: what is worth doing next.
+                    below: said.length === 0 && !anonymous ? _jsx(Suggestions, { rows: hints.rows, onPick: setDraft, onDismiss: hints.dismiss }) : undefined,
+                }) }), _jsx(AgentMaker, {}), isFree(model) ? (_jsx(XStack, { items: "center", justify: "center", py: "$1", px: "$3", borderTopWidth: 1, borderColor: "$borderColor", bg: "$background", children: _jsxs(Text, { fontSize: "$1", color: "$soft", children: ["Free chat is data-shared to train models. ", _jsx(Anchor, { href: site("/privacy"), fontSize: "$1", color: "$ink", children: "Privacy" })] }) })) : null, consent, _jsx(Upgrade, { ask: ask, onClose: () => setAsk(null) })] }));
 }
 /** The agreement free asks for, in @hanzo/ai's words so every surface says one thing. */
 function Consent({ question, onAgree, onCancel, }) {

package/dist/Column.d.ts

@@ -2,7 +2,7 @@ import { type Host } from '@hanzo/build';
 import { type RailLink } from '@hanzo/ui/chat';
 import { type ReactNode } from 'react';
 import { type Place } from './lib/host.js';
-export declare function Column({ host, mode, thread, go, onShut, seek, drawer, foot, places, }: {
+export declare function Column({ host, mode, thread, go, onShut, onSeek, drawer, foot, places, }: {
     host: Host;
     mode: Place['mode'];
     /** The Chat conversation the pane holds, or null. */
@@ -11,8 +11,8 @@ export declare function Column({ host, mode, thread, go, onShut, seek, drawer, f
     go: (address: string) => void;
     /** Shut the sidebar: its edge pulled in past the floor. */
     onShut: () => void;
-    /** Each new value asks for the search, focused (⌘K). */
-    seek?: number;
+    /** Opens the palette. */
+    onSeek?: () => void;
     /** Drawn in the phone's drawer: no edge, cut as a floating pane. */
     drawer?: boolean;
     /** What stands at its foot: the drawer's rail, laid flat. */

package/dist/Column.js

@@ -10,7 +10,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // The bell is the org's run activity (@hanzo/build `useSessions`): the runs
 // that moved last, each one press from its page, and Notifications in Settings.
-// The search opens the filter over Recents (⌘K / Ctrl+K from anywhere, `seek`).
+// The search opens the palette (Palette.tsx; ⌘K / Ctrl+K from anywhere).
 //
 // Dev's places are @hanzo/build's `nav`, the one list every rail draws, each a
 // row under a quiet group label.
@@ -19,11 +19,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // double-clicked back (@hanzo/build's `Grip`), kept per browser. Pulled in past
 // its floor it shuts (`onShut`), as the sidebar's toggle shuts it.
 import { Text, XStack, YStack } from '@hanzo/gui';
-import { Bell, Search, Settings2, SquarePen, X } from 'lucide-react';
+import { Bell, Search, Settings2, SquarePen } from 'lucide-react';
 import { DOTS, Grip, nav, NEW, path as written, useSessions } from '@hanzo/build';
 import { DropdownMenu } from '@hanzo/ui';
 import { Sidebar, SidebarIconButton, SidebarItem, StatusDot } from '@hanzo/ui/chat';
-import { useEffect, useId, useRef, useState } from 'react';
+import { useId } from 'react';
 import { Made } from './Me.js';
 import { Recents } from './Recents.js';
 import { Setup } from './Setup.js';
@@ -89,11 +89,7 @@ function Activity({ host }) {
     ];
     return (_jsx(DropdownMenu, { minWidth: 280, trigger: _jsx(XStack, { render: "button", "aria-label": "Activity", ...{ title: 'Activity' }, ...HEAD, items: "center", justify: "center", cursor: "pointer", opacity: 0.7, hoverStyle: { bg: '$hover', opacity: 1 }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: _jsx(Bell, { size: 16, "aria-hidden": true }) }), items: items }));
 }
-export function Column({ host, mode, thread, go, onShut, seek = 0, drawer = false, foot, places, }) {
-    const [words, setWords] = useState('');
-    // The search field shows once asked for, and while it holds words.
-    const [seeking, setSeeking] = useState(false);
-    const field = useRef(null);
+export function Column({ host, mode, thread, go, onShut, onSeek, drawer = false, foot, places, }) {
     // The desktop sidebar and a phone's drawer can both be in the page: each names its own group labels.
     const uid = useId();
     const span = useSpan(SPAN, WIDTH, FLOOR, CEIL);
@@ -105,27 +101,9 @@ export function Column({ host, mode, thread, go, onShut, seek = 0, drawer = fals
         empty();
         go(talk());
     };
-    const ask = () => {
-        setSeeking(true);
-        requestAnimationFrame(() => field.current?.focus());
-    };
-    const done = () => {
-        setWords('');
-        setSeeking(false);
-    };
-    useEffect(() => {
-        if (seek)
-            ask();
-    }, [seek]);
     return (_jsxs(YStack, { "data-slot": "app-column", ref: drawer ? undefined : span.ref, 
         // inline-style: `--span`, the width a drag rewrites on the element itself (span.ts); no prop sets a variable.
-        style: drawer ? undefined : span.style, position: "relative", flex: drawer ? 1 : undefined, shrink: drawer ? 1 : 0, minW: 0, height: "100%", width: drawer ? undefined : 'var(--span)', children: [_jsxs(Sidebar, { "data-slot": "app-rail", role: "navigation", "aria-label": brand(), ...(drawer ? { ...pane(), ...FLOAT } : { bg: 'transparent', borderWidth: 0 }), ...FILL, px: "$2", pt: drawer ? '$2' : 0, pb: "$2", gap: "$0", children: [_jsxs(XStack, { "data-slot": "app-head", items: "center", gap: "$1", pl: "$2", pr: 2, height: 52, shrink: 0, minW: 0, children: [_jsx(Text, { flex: 1, minW: 0, fontSize: 18, lineHeight: 24, fontWeight: "600", color: "$ink", numberOfLines: 1, children: wordmark(mode) }), _jsx(Activity, { host: host }), mode === 'studio' ? null : (_jsx(SidebarIconButton, { label: mode === 'chat' ? 'Search chats' : 'Search runs', onPress: seeking ? done : ask, "aria-expanded": seeking || !!words, ...HEAD, children: _jsx(Search, { size: 16, "aria-hidden": true }) }))] }), seeking || words ? (_jsxs(XStack, { "data-slot": "app-filter", items: "center", gap: "$2", pl: "$3", pr: "$1", height: 36, rounded: 999, borderWidth: 1, borderColor: "$borderColor", bg: "$edge", shrink: 0, mb: "$1.5", children: [_jsx(Search, { size: 15, "aria-hidden": true, color: "var(--soft, var(--muted-foreground))" }), _jsx(Text, { render: _jsx("input", { ref: field, value: words, onChange: (e) => setWords(e.target.value), onKeyDown: (e) => {
-                                        if (e.key === 'Escape')
-                                            done();
-                                    }, onBlur: () => {
-                                        if (!words)
-                                            setSeeking(false);
-                                    }, placeholder: mode === 'chat' ? 'Search chats' : 'Search runs', "aria-label": "Filter recents" }), flex: 1, minW: 0, bg: "transparent", borderWidth: 0, outlineStyle: "none", color: "inherit", fontSize: "$3" }), words ? (_jsx(SidebarIconButton, { label: "Clear search", onPress: done, width: 28, height: 28, rounded: 999, children: _jsx(X, { size: 14, "aria-hidden": true }) })) : null] })) : null, mode === 'chat' ? (_jsx(YStack, { role: "list", gap: 2, shrink: 0, children: _jsx(YStack, { role: "listitem", children: _jsx(SidebarItem, { "data-slot": "app-new", ...ROW, active: !thread, bg: "transparent", hoverStyle: { bg: '$hover' }, icon: _jsx(SquarePen, { size: 16, "aria-hidden": true }), onPress: create, ...keys(create), children: _jsx(Text, { fontSize: "$3", color: "$ink", children: "New chat" }) }) }) })) : (_jsx(YStack, { "data-slot": "app-places", shrink: 0, children: groups.map((g, i) => (_jsxs(YStack, { pt: i ? '$2' : 0, children: [i ? (_jsx(Text, { id: `${uid}-${g.id}`, pl: "$2", pb: 2, fontSize: "$3", color: "$soft", children: g.label })) : null, _jsx(YStack, { role: "list", "aria-labelledby": i ? `${uid}-${g.id}` : undefined, "aria-label": i ? undefined : g.label, gap: 1, children: g.links.map((link) => (_jsx(YStack, { role: "listitem", children: _jsx(SidebarItem, { ...ROW, ...(link.id === NEW ? { 'data-slot': 'app-new' } : {}), active: link.active, icon: link.id === NEW ? _jsx(SquarePen, { size: 16, "aria-hidden": true }) : link.icon, onPress: link.onPress, ...keys(() => link.onPress?.()), children: _jsx(Text, { fontSize: "$3", color: link.active ? '$ink' : '$quiet', children: link.label }) }) }, link.id))) })] }, g.id))) })), mode === 'studio' ? null : _jsx(Recents, { host: host, mode: mode, thread: thread, words: words, onOpen: open, onNew: create }), _jsxs(YStack, { gap: "$2", pt: "$2", shrink: 0, children: [_jsx(Made, {}), _jsx(Setup, {})] }), foot] }), drawer ? null : (_jsx(Grip, { side: "left", span: span.span, floor: FLOOR, ceil: CEIL, reset: WIDTH, onSpan: span.move, onKeep: span.keep, onShut: onShut, label: "Resize sidebar", 
+        style: drawer ? undefined : span.style, position: "relative", flex: drawer ? 1 : undefined, shrink: drawer ? 1 : 0, minW: 0, height: "100%", width: drawer ? undefined : 'var(--span)', children: [_jsxs(Sidebar, { "data-slot": "app-rail", role: "navigation", "aria-label": brand(), ...(drawer ? { ...pane(), ...FLOAT } : { bg: 'transparent', borderWidth: 0 }), ...FILL, px: "$2", pt: drawer ? '$2' : 0, pb: "$2", gap: "$0", children: [_jsxs(XStack, { "data-slot": "app-head", items: "center", gap: "$1", pl: "$2", pr: 2, height: 52, shrink: 0, minW: 0, children: [_jsx(Text, { flex: 1, minW: 0, fontSize: 18, lineHeight: 24, fontWeight: "600", color: "$ink", numberOfLines: 1, children: wordmark(mode) }), _jsx(Activity, { host: host }), _jsx(SidebarIconButton, { label: "Search", onPress: onSeek, "aria-haspopup": "dialog", ...HEAD, children: _jsx(Search, { size: 16, "aria-hidden": true }) })] }), mode === 'chat' ? (_jsx(YStack, { role: "list", gap: 2, shrink: 0, children: _jsx(YStack, { role: "listitem", children: _jsx(SidebarItem, { "data-slot": "app-new", ...ROW, active: !thread, bg: "transparent", hoverStyle: { bg: '$hover' }, icon: _jsx(SquarePen, { size: 16, "aria-hidden": true }), onPress: create, ...keys(create), children: _jsx(Text, { fontSize: "$3", color: "$ink", children: "New chat" }) }) }) })) : (_jsx(YStack, { "data-slot": "app-places", shrink: 0, children: groups.map((g, i) => (_jsxs(YStack, { pt: i ? '$2' : 0, children: [i ? (_jsx(Text, { id: `${uid}-${g.id}`, pl: "$2", pb: 2, fontSize: "$3", color: "$soft", children: g.label })) : null, _jsx(YStack, { role: "list", "aria-labelledby": i ? `${uid}-${g.id}` : undefined, "aria-label": i ? undefined : g.label, gap: 1, children: g.links.map((link) => (_jsx(YStack, { role: "listitem", children: _jsx(SidebarItem, { ...ROW, ...(link.id === NEW ? { 'data-slot': 'app-new' } : {}), active: link.active, icon: link.id === NEW ? _jsx(SquarePen, { size: 16, "aria-hidden": true }) : link.icon, onPress: link.onPress, ...keys(() => link.onPress?.()), children: _jsx(Text, { fontSize: "$3", color: link.active ? '$ink' : '$quiet', children: link.label }) }) }, link.id))) })] }, g.id))) })), mode === 'studio' ? null : _jsx(Recents, { host: host, mode: mode, thread: thread, onOpen: open, onNew: create }), _jsxs(YStack, { gap: "$2", pt: "$2", shrink: 0, children: [_jsx(Made, {}), _jsx(Setup, {})] }), foot] }), drawer ? null : (_jsx(Grip, { side: "left", span: span.span, floor: FLOOR, ceil: CEIL, reset: WIDTH, onSpan: span.move, onKeep: span.keep, onShut: onShut, label: "Resize sidebar", 
                 // In the gutter between the sidebar and the panel, not over the sidebar's own rows.
                 r: GUTTER_END, width: "var(--pane-gap)" }))] }));
 }

package/dist/Me.d.ts

@@ -1,4 +1,6 @@
 import { type Host } from '@hanzo/build';
+/** What the menu reads of its host: who is signed in, in which organization, and how they leave. */
+export type Who = Pick<Host, 'api' | 'token' | 'org' | 'person' | 'signOut'>;
 /** One organization as the menu draws it. */
 export interface Org {
     name: string;
@@ -10,7 +12,7 @@ export interface Org {
 export declare const initials: (name: string) => string;
 /** The person's picture, or their initials. */
 export declare function Face({ host, size }: {
-    host: Host;
+    host: Who;
     size?: number;
 }): import("react").JSX.Element;
 /**
@@ -20,10 +22,13 @@ export declare function Face({ host, size }: {
  */
 export declare const upgrade: (family: string | null | undefined) => string;
 export declare function Me({ host, narrow, above, onOrg, }: {
-    host: Host;
+    host: Who;
     /** The rail's: the face alone, the menu opening beside it. */
     narrow?: boolean;
-    /** The menu opens above the face, not beside it: the rail laid along a phone drawer's foot. */
+    /**
+     * The menu opens above the face, not beside it: the rail laid along a phone
+     * drawer's foot. That copy leaves ⌘/ to the rail's own, so one press opens one dialog.
+     */
     above?: boolean;
     /** Work in another organization: picked, then the app opened in it. */
     onOrg: (org: string) => void;