@hanzo/build 0.2.16 → 0.2.18

package/lib/settings/card.js

@@ -73,14 +73,14 @@ export function AddCard({ open, onOpenChange, onSaved }) {
             gone = true;
             const f = field.current;
             field.current = null;
+            setMounted(false);
             if (f)
                 void f.destroy().catch(() => { });
         };
     }, [open, box, p]);
+    // Save is offered only while the field is drawn.
     const add = async () => {
         const f = field.current;
-        if (!f)
-            return;
         setWorking(true);
         setNote('');
         try {

package/lib/settings/code.js

@@ -32,7 +32,7 @@ export function Code() {
     const now = { model: ENSO, effort: 'medium', mode: 'build', place: '', ...prefs.code };
     const keep = (change) => {
         setNote('');
-        save({ code: { ...prefs.code, ...change } }).catch((e) => setNote(e instanceof Error ? e.message : 'That was not saved'));
+        save({ code: { ...prefs.code, ...change } }).catch((e) => setNote(e.message));
     };
     const where = (places.value.length ? places.value : [SANDBOX]).map((p) => ({
         id: p.id || 'sandbox',
@@ -41,10 +41,13 @@ export function Code() {
         hint: p.id ? [p.status, p.capacity].filter(Boolean).join(' · ') : 'The platform’s own sandbox',
         place: p.id,
     }));
-    const place = where.find((w) => w.place === now.place) ?? { id: now.place, label: now.place || 'Default', place: now.place };
+    // The sandbox is always listed, so a place not found is a machine that is not: it reads as its id.
+    const place = where.find((w) => w.place === now.place) ?? { id: now.place, label: now.place, place: now.place };
     const model = catalog.value.find((m) => m.id === now.model) ?? { id: now.model, label: now.model === ENSO ? 'Enso' : now.model };
     const go = (section) => host.go(path({ kind: 'settings', section }));
-    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "Code", detail: "How a new run starts. New begins from these until you choose otherwise there." }), _jsxs(Group, { title: "Defaults", children: [_jsxs(Card, { children: [_jsx(Row, { first: true, title: "Model", detail: "Enso picks one for each step; any other model runs them all.", trailing: _jsx(ChipSelect, { name: "Default model", label: model.label, chosen: model, items: catalog.value, onChange: (m) => keep({ model: m.id }), placeholder: "Search models\u2026", placement: "bottom-end", loading: catalog.loading, error: catalog.error?.message ?? null }) }), _jsx(Row, { title: "Effort", detail: "How long the agent thinks before it acts.", trailing: _jsx(ChipSelect, { name: "Default effort", label: EFFORTS.find((e) => e.id === now.effort).label, chosen: EFFORTS.find((e) => e.id === now.effort) ?? null, items: EFFORTS, onChange: (e) => keep({ effort: e.id }), placement: "bottom-end", width: 180 }) }), _jsx(Row, { title: "Mode", detail: MODES.find((m) => m.id === now.mode).hint, trailing: _jsx(ChipSelect, { name: "Default mode", label: MODES.find((m) => m.id === now.mode).label, chosen: MODES.find((m) => m.id === now.mode) ?? null, items: MODES, onChange: (m) => keep({ mode: m.id }), placement: "bottom-end", width: 260 }) }), _jsx(Row, { title: "Where it runs", detail: "The Hanzo sandbox, or one of your organization\u2019s machines.", trailing: _jsx(ChipSelect, { name: "Default place", label: place.label, chosen: place, items: where, onChange: (w) => keep({ place: w.place }), placeholder: "Search machines\u2026", placement: "bottom-end", loading: places.loading, error: places.error?.message ?? null }) })] }), _jsx(Note, { children: unhonoured(now.mode, now.place) })] }), _jsx(Group, { title: "Workspace", children: _jsxs(Card, { children: [_jsx(Row, { first: true, title: "Environments", detail: "What a run installs and starts in each codebase, and the secrets it exports.", trailing: _jsx(Link, { label: "Environments", onPress: () => go('environments') }) }), _jsx(Row, { title: "Machines", detail: "Your organization\u2019s own computers that take runs.", trailing: _jsx(Link, { label: "Machines", onPress: () => go('machines') }) })] }) }), _jsx(Note, { children: note })] }));
+    const effort = EFFORTS.find((e) => e.id === now.effort);
+    const mode = MODES.find((m) => m.id === now.mode);
+    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "Code", detail: "How a new run starts. New begins from these until you choose otherwise there." }), _jsxs(Group, { title: "Defaults", children: [_jsxs(Card, { children: [_jsx(Row, { first: true, title: "Model", detail: "Enso picks one for each step; any other model runs them all.", trailing: _jsx(ChipSelect, { name: "Default model", label: model.label, chosen: model, items: catalog.value, onChange: (m) => keep({ model: m.id }), placeholder: "Search models\u2026", placement: "bottom-end", loading: catalog.loading, error: catalog.error?.message ?? null }) }), _jsx(Row, { title: "Effort", detail: "How long the agent thinks before it acts.", trailing: _jsx(ChipSelect, { name: "Default effort", label: effort.label, chosen: effort, items: EFFORTS, onChange: (e) => keep({ effort: e.id }), placement: "bottom-end", width: 180 }) }), _jsx(Row, { title: "Mode", detail: mode.hint, trailing: _jsx(ChipSelect, { name: "Default mode", label: mode.label, chosen: mode, items: MODES, onChange: (m) => keep({ mode: m.id }), placement: "bottom-end", width: 260 }) }), _jsx(Row, { title: "Where it runs", detail: "The Hanzo sandbox, or one of your organization\u2019s machines.", trailing: _jsx(ChipSelect, { name: "Default place", label: place.label, chosen: place, items: where, onChange: (w) => keep({ place: w.place }), placeholder: "Search machines\u2026", placement: "bottom-end", loading: places.loading, error: places.error?.message ?? null }) })] }), _jsx(Note, { children: unhonoured(now.mode, now.place) })] }), _jsx(Group, { title: "Workspace", children: _jsxs(Card, { children: [_jsx(Row, { first: true, title: "Environments", detail: "What a run installs and starts in each codebase, and the secrets it exports.", trailing: _jsx(Link, { label: "Environments", onPress: () => go('environments') }) }), _jsx(Row, { title: "Machines", detail: "Your organization\u2019s own computers that take runs.", trailing: _jsx(Link, { label: "Machines", onPress: () => go('machines') }) })] }) }), _jsx(Note, { children: note })] }));
 }
 function Link({ label, onPress }) {
     return (_jsx(YStack, { render: "button", "aria-label": `Open ${label}`, p: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, onPress: onPress, children: _jsx(ChevronRight, { size: 16 }) }));

package/lib/settings/general.js

@@ -34,11 +34,12 @@ export function General() {
     }
     const keep = (patch) => {
         setNote('');
-        save(patch).catch((e) => setNote(e instanceof Error ? e.message : 'That was not saved'));
+        save(patch).catch((e) => setNote(e.message));
     };
-    const theme = prefs.theme ?? host.theme ?? 'dark';
-    const text = prefs.text ?? 'medium';
-    const motion = prefs.motion ?? 'system';
+    // Each choice is one of its list: a saved one was read against it, and a host's theme is one of THEMES.
+    const theme = THEMES.find((x) => x.id === (prefs.theme ?? host.theme ?? 'dark'));
+    const text = TEXTS.find((x) => x.id === (prefs.text ?? 'medium'));
+    const motion = MOTIONS.find((x) => x.id === (prefs.motion ?? 'system'));
     const language = LANGUAGES.find((l) => l.id === prefs.language) ?? LANGUAGES.find((l) => l.id === spoken());
-    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "General", detail: "How Hanzo Build looks and listens. Saved to your account, so it follows you." }), _jsx(Group, { title: "Appearance", children: _jsxs(Card, { children: [host.chooseTheme ? (_jsx(Row, { first: true, title: "Theme", detail: "System follows this device\u2019s light or dark setting.", trailing: _jsx(ChipSelect, { name: "Theme", label: THEMES.find((x) => x.id === theme).label, chosen: THEMES.find((x) => x.id === theme) ?? null, items: THEMES, onChange: (x) => keep({ theme: x.id }), placement: "bottom-end", width: 200 }) })) : null, _jsx(Row, { first: !host.chooseTheme, title: "Text size", detail: "The transcript, the composer and every screen.", trailing: _jsx(ChipSelect, { name: "Text size", label: TEXTS.find((x) => x.id === text).label, chosen: TEXTS.find((x) => x.id === text) ?? null, items: TEXTS, onChange: (x) => keep({ text: x.id === 'medium' ? null : x.id }), placement: "bottom-end", width: 200 }) }), _jsx(Row, { title: "Motion", detail: "Reduced stops animations and transitions on this page.", trailing: _jsx(ChipSelect, { name: "Motion", label: MOTIONS.find((x) => x.id === motion).label, chosen: MOTIONS.find((x) => x.id === motion) ?? null, items: MOTIONS, onChange: (x) => keep({ motion: x.id === 'system' ? null : x.id }), placement: "bottom-end", width: 220 }) })] }) }), _jsx(Group, { title: "Voice", children: _jsx(Card, { children: _jsx(Row, { first: true, title: "Dictation language", detail: "What the microphone in the composer listens for.", trailing: _jsx(ChipSelect, { name: "Dictation language", label: language.label, chosen: language, items: LANGUAGES, onChange: (l) => keep({ language: l.id }), placeholder: "Search languages\u2026", placement: "bottom-end", width: 220 }) }) }) }), _jsx(Note, { children: note })] }));
+    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "General", detail: "How Hanzo looks and listens. Saved to your account, so it follows you." }), _jsx(Group, { title: "Appearance", children: _jsxs(Card, { children: [host.chooseTheme ? (_jsx(Row, { first: true, title: "Theme", detail: "System follows this device\u2019s light or dark setting.", trailing: _jsx(ChipSelect, { name: "Theme", label: theme.label, chosen: theme, items: THEMES, onChange: (x) => keep({ theme: x.id }), placement: "bottom-end", width: 200 }) })) : null, _jsx(Row, { first: !host.chooseTheme, title: "Text size", detail: "The transcript, the composer and every screen.", trailing: _jsx(ChipSelect, { name: "Text size", label: text.label, chosen: text, items: TEXTS, onChange: (x) => keep({ text: x.id === 'medium' ? null : x.id }), placement: "bottom-end", width: 200 }) }), _jsx(Row, { title: "Motion", detail: "Reduced stops animations and transitions on this page.", trailing: _jsx(ChipSelect, { name: "Motion", label: motion.label, chosen: motion, items: MOTIONS, onChange: (x) => keep({ motion: x.id === 'system' ? null : x.id }), placement: "bottom-end", width: 220 }) })] }) }), _jsx(Group, { title: "Voice", children: _jsx(Card, { children: _jsx(Row, { first: true, title: "Dictation language", detail: "What the microphone in the composer listens for.", trailing: _jsx(ChipSelect, { name: "Dictation language", label: language.label, chosen: language, items: LANGUAGES, onChange: (l) => keep({ language: l.id }), placeholder: "Search languages\u2026", placement: "bottom-end", width: 220 }) }) }) }), _jsx(Note, { children: note })] }));
 }

package/lib/settings/index.js

@@ -11,12 +11,11 @@ import { path } from '../route.js';
 import { ENTRIES, GROUPS } from './sections.js';
 export function Settings({ section }) {
     const host = useHost();
-    const entry = ENTRIES.find((e) => e.id === section) ?? ENTRIES[0];
+    // Every section the route grammar names has an entry.
+    const entry = ENTRIES.find((e) => e.id === section);
     const go = (id) => host.go(path({ kind: 'settings', section: id }));
     return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, children: [_jsxs(YStack, { role: "navigation", "aria-label": "Settings", width: 220, shrink: 0, borderRightWidth: 1, borderColor: "$borderColor", px: "$2", py: "$4", gap: "$4", overflow: "scroll", "$max-md": { display: 'none' }, children: [_jsx(SizableText, { size: "$4", color: "$ink", px: "$2", children: "Settings" }), GROUPS.map((g) => {
                         const list = ENTRIES.filter((e) => e.group === g);
-                        if (!list.length)
-                            return null;
                         return (_jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$1", color: "$soft", px: "$2", pb: "$1", children: g }), list.map((e) => (_jsx(XStack, { render: "button", "aria-label": e.label, "aria-current": e.id === entry.id ? 'page' : undefined, onPress: () => go(e.id), px: "$2", py: "$1.5", rounded: "$2", bg: e.id === entry.id ? '$hover' : 'transparent', hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$2", color: e.id === entry.id ? '$ink' : '$soft', children: e.label }) }, e.id)))] }, g));
                     })] }), _jsxs(YStack, { flex: 1, minW: 0, minH: 0, overflow: "scroll", children: [_jsx(XStack, { flexWrap: "wrap", gap: "$1.5", px: "$4", pt: "$3", $md: { display: 'none' }, children: ENTRIES.map((e) => (_jsx(XStack, { render: "button", "aria-label": e.label, onPress: () => go(e.id), px: "$2.5", py: "$1", rounded: "$10", borderWidth: 1, borderColor: e.id === entry.id ? '$ink' : '$borderColor', children: _jsx(SizableText, { size: "$1", color: e.id === entry.id ? '$ink' : '$soft', children: e.label }) }, e.id))) }), _jsx(YStack, { width: "100%", maxW: 760, self: "center", px: "$5", py: "$6", children: entry.body() })] })] }));
 }

package/lib/settings/integrations.js

@@ -39,7 +39,7 @@ export function Integrations() {
             setNote(done);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);
@@ -53,7 +53,7 @@ export function Integrations() {
             host.open(await where());
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'The connection did not start');
+            setNote(e.message);
             setWorking(false);
         }
     };

package/lib/settings/keys.js

@@ -50,9 +50,9 @@ export function Keys() {
                 }) })), _jsx(Note, { children: note }), _jsx(Making, { type: making, rotating: making ? Boolean(held(making)) : false, onClose: () => setMaking(null), onMade: (m) => {
                     setNote(`${NAME[m.type]} created`);
                     list.reload();
-                } }), _jsx(Confirm, { open: revoking !== null, onOpenChange: (o) => !o && setRevoking(null), title: `Revoke your ${revoking ?? 'secret'} key?`, says: "It stops working within a minute, and anything using it is refused until it has a new one.", act: "Revoke", run: async () => {
-                    if (!revoking)
-                        return;
+                } }), _jsx(Confirm, { open: revoking !== null, onOpenChange: (o) => !o && setRevoking(null), title: `Revoke your ${revoking ?? 'secret'} key?`, says: "It stops working within a minute, and anything using it is refused until it has a new one.", act: "Revoke", 
+                // It acts only while it is open, which is while a type is chosen.
+                run: async () => {
                     await revoke(t, revoking);
                     setNote(`${NAME[revoking]} revoked`);
                     list.reload();
@@ -73,16 +73,15 @@ function Making({ type, rotating, onClose, onMade }) {
         setNote('');
         onClose();
     };
-    const go = async () => {
-        if (!type)
-            return;
+    // Pressed only in the open dialog, which is open only for a type.
+    const go = async (type) => {
         setNote('');
         let list;
         try {
             list = limits(limit);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That is not a limit');
+            setNote(e.message);
             return;
         }
         setWorking(true);
@@ -92,11 +91,11 @@ function Making({ type, rotating, onClose, onMade }) {
             onMade(m);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);
         }
     };
-    return (_jsx(Dialog, { open: type !== null, onOpenChange: (o) => !o && close(), children: _jsxs(DialogContent, { maxW: 480, showCloseButton: false, children: [_jsx(DialogTitle, { children: made ? `Your new ${made.type} key` : `${rotating ? 'Rotate' : 'Create'} your ${type ?? ''} key` }), made ? (_jsxs(YStack, { gap: "$3", children: [made.type === 'secret' ? (_jsx(Once, { value: made.key, label: "Secret key" })) : (_jsxs(XStack, { items: "center", gap: "$2", px: "$3", py: "$3", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", children: [_jsx(SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", style: { fontFamily: 'var(--f-mono, ui-monospace, monospace)', wordBreak: 'break-all' }, children: made.key }), _jsx(CopyButton, { value: made.key, label: "Copy publishable key" })] })), made.limit.length ? (_jsxs(SizableText, { size: "$1", color: "$soft", children: ["It reaches ", made.limit.join(', '), " and nothing else."] })) : null, _jsx(XStack, { justify: "flex-end", children: _jsx(Button, { size: "sm", onPress: close, children: "Done" }) })] })) : (_jsxs(YStack, { gap: "$3", children: [rotating ? (_jsxs(SizableText, { size: "$2", color: "$soft", children: ["The ", type, " key you have now stops working."] })) : null, _jsx(Field, { label: "Limit", hint: "Optional. What it may reach, as kind:name \u2014 model:zen5, project:acme, product:commerce. Empty reaches whatever you do.", children: _jsx(Input, { value: limit, onChangeText: setLimit, placeholder: "model:zen5, project:acme", "aria-label": "Limit", autoCapitalize: "none" }) }), note ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note })) : null, _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", disabled: working, onPress: close, children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working, onPress: () => void go(), children: rotating ? 'Rotate' : 'Create' })] })] }))] }) }));
+    return (_jsx(Dialog, { open: type !== null, onOpenChange: (o) => !o && close(), children: _jsxs(DialogContent, { maxW: 480, showCloseButton: false, children: [_jsx(DialogTitle, { children: made ? `Your new ${made.type} key` : `${rotating ? 'Rotate' : 'Create'} your ${type ?? ''} key` }), made ? (_jsxs(YStack, { gap: "$3", children: [made.type === 'secret' ? (_jsx(Once, { value: made.key, label: "Secret key" })) : (_jsxs(XStack, { items: "center", gap: "$2", px: "$3", py: "$3", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", children: [_jsx(SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", style: { fontFamily: 'var(--f-mono, ui-monospace, monospace)', wordBreak: 'break-all' }, children: made.key }), _jsx(CopyButton, { value: made.key, label: "Copy publishable key" })] })), made.limit.length ? (_jsxs(SizableText, { size: "$1", color: "$soft", children: ["It reaches ", made.limit.join(', '), " and nothing else."] })) : null, _jsx(XStack, { justify: "flex-end", children: _jsx(Button, { size: "sm", onPress: close, children: "Done" }) })] })) : (_jsxs(YStack, { gap: "$3", children: [rotating ? (_jsxs(SizableText, { size: "$2", color: "$soft", children: ["The ", type, " key you have now stops working."] })) : null, _jsx(Field, { label: "Limit", hint: "Optional. What it may reach, as kind:name \u2014 model:zen5, project:acme, product:commerce. Empty reaches whatever you do.", children: _jsx(Input, { value: limit, onChangeText: setLimit, placeholder: "model:zen5, project:acme", "aria-label": "Limit", autoCapitalize: "none" }) }), note ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note })) : null, _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", disabled: working, onPress: close, children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working, onPress: () => void go(type), children: rotating ? 'Rotate' : 'Create' })] })] }))] }) }));
 }

package/lib/settings/machines.js

@@ -50,7 +50,7 @@ export function Machines() {
             list.reload();
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
     };
     return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "Machines", detail: "Your organization\u2019s own computers. A run sent to one runs there instead of in the Hanzo sandbox." }), _jsxs(Group, { title: "Link a machine", detail: "Run these on it. It registers under its hostname, and stays online while hanzo link runs.", children: [_jsxs(XStack, { items: "flex-start", gap: "$2", px: "$3", py: "$2.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$raised", children: [_jsx(SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", "aria-label": "Link commands", style: { ...mono, whiteSpace: 'pre-wrap' }, children: LINK }), _jsx(CopyButton, { value: LINK, label: "Copy the commands" })] }), _jsx(XStack, { children: _jsxs(Button, { size: "sm", variant: "ghost", onPress: () => setAdding(true), children: [_jsx(Plus, { size: 14 }), " Register one by hand"] }) })] }), _jsx(Group, { title: "Linked", children: list.error ? (_jsx(Soft, { children: list.error.message })) : list.loading && list.value.length === 0 ? (_jsx(Soft, { children: "Reading machines\u2026" })) : list.value.length === 0 ? (_jsx(Soft, { children: "No machine is linked yet." })) : (_jsx(Card, { children: list.value.map((m, i) => (_jsx(Row, { first: i === 0, leading: _jsx(Dot, { status: m.status }), title: m.label, detail: about(m), trailing: _jsx(DropdownMenu, { trigger: _jsx(XStack, { render: "button", "aria-label": `Actions for ${m.label}`, px: "$1.5", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, children: _jsx(MoreHorizontal, { size: 16 }) }), items: [
@@ -64,21 +64,17 @@ export function Machines() {
                             ] }) }, m.id))) })) }), _jsx(Note, { children: note }), _jsx(Adding, { open: adding, onOpenChange: setAdding, onAdded: (m) => {
                     setNote(`${m.label} is registered`);
                     list.reload();
-                } }), _jsx(Rename, { open: renaming !== null, onOpenChange: (o) => !o && setRenaming(null), title: "Rename machine", name: renaming?.label ?? '', run: async (label) => {
-                    if (!renaming)
-                        return;
+                } }), _jsx(Rename, { open: renaming !== null, onOpenChange: (o) => !o && setRenaming(null), title: "Rename machine", name: renaming?.label ?? '', 
+                // Each dialog acts only while it is open, which is while its machine is chosen.
+                run: async (label) => {
                     await change(t, renaming.id, { label });
                     setNote(`Renamed to ${label}`);
                     list.reload();
                 } }), _jsx(Confirm, { open: removing !== null, onOpenChange: (o) => !o && setRemoving(null), title: `Remove ${removing?.label ?? 'this machine'}?`, says: "Runs can no longer be sent to it, and its claim key stops working. Linking it again registers it anew.", act: "Remove", run: async () => {
-                    if (!removing)
-                        return;
                     await remove(t, removing.id);
                     setNote(`${removing.label} is removed`);
                     list.reload();
                 } }), _jsx(Confirm, { open: keying !== null, onOpenChange: (o) => !o && setKeying(null), title: `Mint a claim key for ${keying?.label ?? 'this machine'}?`, says: "A key it had before stops working, so a runner using it stops getting runs until it has the new one. The new key is shown once.", act: "Mint key", run: async () => {
-                    if (!keying)
-                        return;
                     const k = await key(t, keying.id);
                     setMinted({ machine: keying, key: k });
                 } }), _jsx(Dialog, { open: minted !== null, onOpenChange: (o) => !o && setMinted(null), children: _jsxs(DialogContent, { maxW: 480, showCloseButton: false, children: [_jsxs(DialogTitle, { children: ["Claim key for ", minted?.machine.label ?? ''] }), minted ? (_jsx(Once, { value: minted.key, label: "Claim key", children: _jsxs(SizableText, { size: "$1", color: "$soft", children: ["A runner on this machine sends it as X-Target-Key when it claims the runs sent here, at POST /v1/agent/targets/", minted.machine.id, "/claim."] }) })) : null, _jsx(XStack, { justify: "flex-end", children: _jsx(Button, { size: "sm", onPress: () => setMinted(null), children: "Done" }) })] }) })] }));
@@ -110,7 +106,7 @@ function Adding({ open, onOpenChange, onAdded }) {
             close();
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
             setWorking(false);
         }
     };

package/lib/settings/members.js

@@ -38,7 +38,7 @@ export function Members() {
             setNote(done);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);
@@ -46,8 +46,9 @@ export function Members() {
     };
     const send = () => {
         const address = email.trim();
+        // Invite is offered only once something is typed.
         if (!EMAIL.test(address)) {
-            setNote(`${address || 'That'} is not an email address`);
+            setNote(`${address} is not an email address`);
             return;
         }
         void act(() => invite(t, org, address), `${address} is invited. IAM sends no email: share the code with them.`, () => {

package/lib/settings/memory.js

@@ -39,7 +39,7 @@ export function Memory() {
             return true;
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
             return false;
         }
         finally {

package/lib/settings/notifications.js

@@ -37,7 +37,7 @@ export function Notifications() {
             setNote(await what());
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);

package/lib/settings/privacy.js

@@ -33,7 +33,7 @@ export function Privacy() {
             setShown(await setConsent(t, change));
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That was not saved');
+            setNote(e.message);
         }
         finally {
             setBusy('');
@@ -48,7 +48,7 @@ export function Privacy() {
             setNote(`${saved.name} is ${saved.visibility || 'saved'}`);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That was not saved');
+            setNote(e.message);
         }
         finally {
             setBusy('');

package/lib/settings/usage.js

@@ -14,9 +14,9 @@ import { useHost, useTarget } from '../host.js';
 import { path } from '../route.js';
 import { Card, day, Group, Heading, Note, Row, Soft } from './ui.js';
 const SPAN = { hour: 'This hour', day: 'Today', week: 'This week', month: 'This month' };
-/** A thin bar: how much of a whole is used. */
+/** A thin bar: how much of a whole is used. Every whole drawn is above zero: a limit of none is not drawn. */
 function Bar({ part, whole, limit }) {
-    const pct = whole > 0 ? Math.min(100, Math.max(0, (part / whole) * 100)) : 0;
+    const pct = Math.min(100, Math.max(0, (part / whole) * 100));
     return (_jsx(YStack, { height: 6, rounded: 999, bg: "$hover", overflow: "hidden", role: "progressbar", "aria-valuenow": Math.round(pct), "aria-valuemin": 0, "aria-valuemax": 100, children: _jsx(YStack, { height: 6, width: `${pct}%`, rounded: 999, bg: limit && pct >= 100 ? '$red10' : '$ink' }) }));
 }
 /**
@@ -67,7 +67,7 @@ export function Usage() {
             setNote(done);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);
@@ -80,15 +80,14 @@ export function Usage() {
     const others = ceilings.value.filter((c) => c !== cap);
     const s = spent.value;
     const top = Math.max(0, ...(s?.categories ?? []).map((c) => c.cents));
+    const adding = cents(amount);
+    // Offered only with a card to charge.
     const buy = () => {
-        const c = cents(amount);
-        if (!c) {
+        if (!adding) {
             setNote('Enter an amount in dollars');
             return;
         }
-        if (!card)
-            return;
-        void act(() => topup(t, c, card.id), `${money(c)} is added to the balance`, () => {
+        void act(() => topup(t, adding, card.id), `${money(adding)} is added to the balance`, () => {
             setBuying(false);
             left.reload();
         });
@@ -104,7 +103,7 @@ export function Usage() {
             ceilings.reload();
         });
     };
-    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "Usage", detail: `What ${host.org ?? 'this organization'} has used, has left, and may spend.` }), _jsx(Group, { title: "Plan usage limits", detail: m?.plan ? `Included with ${m.plan}.` : 'What the plan includes.', children: plan.error ? (_jsx(Soft, { children: plan.error.message })) : plan.loading && !m ? (_jsx(Soft, { children: "Reading the plan\u2019s limits\u2026" })) : !m || (windows.length === 0 && m.included === 0) ? (_jsx(Card, { children: _jsx(Soft, { children: "This plan sets no usage limits. Usage is paid from the balance." }) })) : (_jsxs(Card, { children: [m.included > 0 ? (_jsx(Meter, { first: true, title: "Included spend", used: m.used, of: m.included, says: `${money(m.used)} of ${money(m.included)}${m.overage ? ` · ${money(m.overage)} over` : ''}` })) : null, windows.map((w, i) => (_jsx(Meter, { first: i === 0 && m.included === 0, title: `${SPAN[w.span] ?? w.span} · ${w.used.toLocaleString()} of ${w.limit.toLocaleString()} requests`, used: w.used, of: w.limit, says: `${Math.round((Math.min(w.used, w.limit) / w.limit) * 100)}% used${resets(w.resets) ? ` · ${resets(w.resets)}` : ''}` }, w.span)))] })) }), _jsx(Group, { title: "Balance", detail: "Prepaid money pays for usage past the plan. Credits are spent first.", action: buying || !host.admin ? undefined : (_jsx(Button, { size: "sm", variant: "outline", onPress: () => setBuying(true), children: "Buy more" })), children: _jsxs(Card, { children: [_jsx(Row, { first: true, title: "Balance", detail: "What is left to spend", trailing: _jsx(Figure, { read: left }) }), _jsx(Row, { title: "Credits", detail: "Granted, and spent before the balance", trailing: _jsx(Figure, { read: granted }) }), _jsx(Row, { title: "Spent this month", detail: s && !s.known ? 'The ledger did not answer, so this is not a measurement' : undefined, trailing: _jsx(Figure, { read: { ...spent, value: s?.total ?? 0 } }) }), buying ? (_jsx(YStack, { gap: "$2", px: "$3", py: "$3", borderTopWidth: 1, borderColor: "$borderColor", children: card ? (_jsxs(_Fragment, { children: [_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", children: [_jsx(YStack, { width: 140, children: _jsx(Input, { value: amount, onChangeText: setAmount, "aria-label": "Amount in dollars", placeholder: "25", inputMode: "decimal" }) }), _jsxs(SizableText, { flex: 1, minW: 160, size: "$1", color: "$soft", children: ["Charged to ", label(card)] })] }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setBuying(false), children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working, onPress: buy, children: cents(amount) ? `Add ${money(cents(amount) ?? 0)}` : 'Add funds' })] })] })) : (_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", children: [_jsx(SizableText, { flex: 1, minW: 160, size: "$2", color: "$soft", children: cards.loading ? 'Reading cards…' : 'Add a card in Billing to buy more.' }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'settings', section: 'billing' })), children: "Billing" })] })) })) : null] }) }), _jsx(Group, { title: "Spend this month", detail: "By what it paid for.", children: spent.error ? (_jsx(Soft, { children: spent.error.message })) : !s ? (_jsx(Soft, { children: "Reading spend\u2026" })) : s.categories.length === 0 ? (_jsx(Card, { children: _jsx(Soft, { children: "Nothing spent this month." }) })) : (_jsx(Card, { children: s.categories.map((c, i) => (_jsx(Meter, { first: i === 0, title: c.name, used: c.cents, of: top, says: money(c.cents), limit: false }, c.name))) })) }), _jsxs(Group, { title: "Monthly limit", detail: "Spend past it is refused until the month starts over.", children: [ceilings.error ? (_jsx(Soft, { children: ceilings.error.message })) : (_jsxs(Card, { children: [cap ? (_jsx(Meter, { first: true, title: `${money(cap.threshold)} a month`, used: cap.spent ?? 0, of: cap.threshold, says: [cap.spent === null ? 'Spend unknown' : `${money(cap.spent)} spent`, resets(cap.resets)].filter(Boolean).join(' · ') })) : (_jsx(Row, { first: true, title: "No monthly limit", detail: "Spend is bounded by the balance alone." })), others.map((c) => (_jsx(Row, { title: c.title || 'Limit', detail: [c.project && `project ${c.project}`, c.service && `service ${c.service}`, c.enforce ? 'refuses spend past it' : 'warns only']
+    return (_jsxs(YStack, { gap: "$6", children: [_jsx(Heading, { title: "Usage", detail: `What ${host.org ?? 'this organization'} has used, has left, and may spend.` }), _jsx(Group, { title: "Plan usage limits", detail: m?.plan ? `Included with ${m.plan}.` : 'What the plan includes.', children: plan.error ? (_jsx(Soft, { children: plan.error.message })) : plan.loading && !m ? (_jsx(Soft, { children: "Reading the plan\u2019s limits\u2026" })) : !m || (windows.length === 0 && m.included === 0) ? (_jsx(Card, { children: _jsx(Soft, { children: "This plan sets no usage limits. Usage is paid from the balance." }) })) : (_jsxs(Card, { children: [m.included > 0 ? (_jsx(Meter, { first: true, title: "Included spend", used: m.used, of: m.included, says: `${money(m.used)} of ${money(m.included)}${m.overage ? ` · ${money(m.overage)} over` : ''}` })) : null, windows.map((w, i) => (_jsx(Meter, { first: i === 0 && m.included === 0, title: `${SPAN[w.span] ?? w.span} · ${w.used.toLocaleString()} of ${w.limit.toLocaleString()} requests`, used: w.used, of: w.limit, says: `${Math.round((Math.min(w.used, w.limit) / w.limit) * 100)}% used${resets(w.resets) ? ` · ${resets(w.resets)}` : ''}` }, w.span)))] })) }), _jsx(Group, { title: "Balance", detail: "Prepaid money pays for usage past the plan. Credits are spent first.", action: buying || !host.admin ? undefined : (_jsx(Button, { size: "sm", variant: "outline", onPress: () => setBuying(true), children: "Buy more" })), children: _jsxs(Card, { children: [_jsx(Row, { first: true, title: "Balance", detail: "What is left to spend", trailing: _jsx(Figure, { read: left }) }), _jsx(Row, { title: "Credits", detail: "Granted, and spent before the balance", trailing: _jsx(Figure, { read: granted }) }), _jsx(Row, { title: "Spent this month", detail: s && !s.known ? 'The ledger did not answer, so this is not a measurement' : undefined, trailing: _jsx(Figure, { read: { ...spent, value: s?.total ?? 0 } }) }), buying ? (_jsx(YStack, { gap: "$2", px: "$3", py: "$3", borderTopWidth: 1, borderColor: "$borderColor", children: card ? (_jsxs(_Fragment, { children: [_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", children: [_jsx(YStack, { width: 140, children: _jsx(Input, { value: amount, onChangeText: setAmount, "aria-label": "Amount in dollars", placeholder: "25", inputMode: "decimal" }) }), _jsxs(SizableText, { flex: 1, minW: 160, size: "$1", color: "$soft", children: ["Charged to ", label(card)] })] }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setBuying(false), children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working, onPress: buy, children: adding ? `Add ${money(adding)}` : 'Add funds' })] })] })) : (_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", children: [_jsx(SizableText, { flex: 1, minW: 160, size: "$2", color: "$soft", children: cards.loading ? 'Reading cards…' : 'Add a card in Billing to buy more.' }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'settings', section: 'billing' })), children: "Billing" })] })) })) : null] }) }), _jsx(Group, { title: "Spend this month", detail: "By what it paid for.", children: spent.error ? (_jsx(Soft, { children: spent.error.message })) : !s ? (_jsx(Soft, { children: "Reading spend\u2026" })) : s.categories.length === 0 ? (_jsx(Card, { children: _jsx(Soft, { children: "Nothing spent this month." }) })) : (_jsx(Card, { children: s.categories.map((c, i) => (_jsx(Meter, { first: i === 0, title: c.name, used: c.cents, of: top, says: money(c.cents), limit: false }, c.name))) })) }), _jsxs(Group, { title: "Monthly limit", detail: "Spend past it is refused until the month starts over.", children: [ceilings.error ? (_jsx(Soft, { children: ceilings.error.message })) : (_jsxs(Card, { children: [cap ? (_jsx(Meter, { first: true, title: `${money(cap.threshold)} a month`, used: cap.spent ?? 0, of: cap.threshold, says: [cap.spent === null ? 'Spend unknown' : `${money(cap.spent)} spent`, resets(cap.resets)].filter(Boolean).join(' · ') })) : (_jsx(Row, { first: true, title: "No monthly limit", detail: "Spend is bounded by the balance alone." })), others.map((c) => (_jsx(Row, { title: c.title || 'Limit', detail: [c.project && `project ${c.project}`, c.service && `service ${c.service}`, c.enforce ? 'refuses spend past it' : 'warns only']
                                     .filter(Boolean)
                                     .join(' · '), trailing: _jsx(SizableText, { size: "$2", color: "$ink", children: c.threshold ? money(c.threshold) : '—' }) }, c.id))), host.admin ? (_jsxs(XStack, { gap: "$2", items: "center", px: "$3", py: "$3", borderTopWidth: 1, borderColor: "$borderColor", flexWrap: "wrap", children: [_jsx(YStack, { width: 160, children: _jsx(Input, { value: ceiling, onChangeText: setCeiling, "aria-label": "Monthly limit in dollars", placeholder: cap ? String(cap.threshold / 100) : '500', inputMode: "decimal" }) }), _jsxs(XStack, { flex: 1, gap: "$2", justify: "flex-end", children: [cap ? (_jsx(Button, { size: "sm", variant: "ghost", disabled: working, onPress: () => void act(() => lift(t, cap.id), 'The monthly limit is lifted', ceilings.reload), children: "Remove" })) : null, _jsx(Button, { size: "sm", variant: "outline", disabled: working || !ceiling.trim(), onPress: setLimit, children: cap ? 'Change limit' : 'Set limit' })] })] })) : null] })), !host.admin ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "An org admin sets the monthly limit." })) : null] }), _jsx(Note, { children: note })] }));
 }

package/lib/shelf.js

@@ -42,7 +42,7 @@ function useFork() {
             host.go(made.slug || slug);
         }
         catch (e) {
-            setFailed(e instanceof Error ? e.message : 'Could not copy this template');
+            setFailed(e.message);
         }
         finally {
             setBusy('');
@@ -93,7 +93,7 @@ export function Artifacts() {
             list.reload();
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
     };
     const said = failed || note;
@@ -104,19 +104,15 @@ export function Artifacts() {
                                                     { key: 'visibility', label: p.visibility === 'private' ? 'Make public' : 'Make private', onSelect: () => void flip(p) },
                                                     { type: 'separator' },
                                                     { key: 'delete', label: 'Delete', destructive: true, onSelect: () => setDeleting(p) },
-                                                ] })] }, p.slug))) })] }, g.label))) }))] }), _jsx(Rename, { open: renaming !== null, onOpenChange: (o) => !o && setRenaming(null), title: "Rename", name: renaming?.name ?? '', run: async (name) => {
-                    if (!renaming)
-                        return;
+                                                ] })] }, p.slug))) })] }, g.label))) }))] }), renaming ? (_jsx(Rename, { open: true, onOpenChange: (o) => !o && setRenaming(null), title: "Rename", name: renaming.name, run: async (name) => {
                     await change(t, renaming.slug, { name });
                     setNote(`Renamed to ${name}`);
                     list.reload();
-                } }), _jsx(Confirm, { open: deleting !== null, onOpenChange: (o) => !o && setDeleting(null), title: `Delete ${deleting?.name ?? 'this project'}?`, says: "Its site stops answering, its releases are dropped, and its address is released. This cannot be undone.", act: "Delete", run: async () => {
-                    if (!deleting)
-                        return;
+                } })) : null, deleting ? (_jsx(Confirm, { open: true, onOpenChange: (o) => !o && setDeleting(null), title: `Delete ${deleting.name}?`, says: "Its site stops answering, its releases are dropped, and its address is released. This cannot be undone.", act: "Delete", run: async () => {
                     await remove(t, deleting.slug);
                     setNote(`${deleting.name} is deleted`);
                     list.reload();
-                } })] }));
+                } })) : null] }));
 }
 function Shot({ slug, height = 140 }) {
     const [gone, setGone] = useState(false);

package/lib/sync.js

@@ -17,9 +17,6 @@ import { useRead } from './data.js';
 import { useHost, useTarget } from './host.js';
 import { path } from './route.js';
 const EMPTY = { repos: [], unread: [] };
-function noteOf(e, fallback) {
-    return e instanceof Error ? e.message : fallback;
-}
 export function Sync() {
     const host = useHost();
     const t = useTarget();
@@ -57,7 +54,7 @@ export function Sync() {
             host.open(url);
         }
         catch (e) {
-            setError(noteOf(e, 'Could not open the GitHub connection'));
+            setError(e.message);
         }
     };
     const send = async () => {
@@ -73,7 +70,7 @@ export function Sync() {
             setSyncing(true);
         }
         catch (e) {
-            setError(noteOf(e, 'Could not queue those repositories'));
+            setError(e.message);
         }
         finally {
             setBusy(false);

package/lib/tools.js

@@ -45,8 +45,7 @@ export function Attach({ files, onFiles, onNote }) {
                 // `hidden` alone loses to a reset that sets `display` on inputs.
                 style: { display: 'none' }, tabIndex: -1, "aria-hidden": true, onChange: (e) => {
                     const input = e.currentTarget;
-                    if (!input.files)
-                        return;
+                    // A file input always holds a list, empty or not.
                     void read(files, input.files).then(({ files: next, note }) => {
                         onFiles(next);
                         onNote(note);
@@ -60,5 +59,5 @@ export function Files({ files, onFiles }) {
 }
 export function Dictate({ onText, onNote }) {
     const voice = useDictation(useTarget(), onText, onNote);
-    return (_jsxs(XStack, { items: "center", children: [_jsx(ComposerTool, { label: !voice.able ? 'Dictation needs a microphone this page can record' : voice.on ? 'Stop and transcribe' : voice.busy ? 'Transcribing…' : 'Dictate', icon: voice.on ? _jsx(MicOff, { size: 14 }) : _jsx(Mic, { size: 14 }), onPress: () => void voice.toggle(), disabled: !voice.able || voice.busy, "aria-pressed": voice.on }), _jsx(ChipSelect, { quiet: true, name: "Dictation language", icon: _jsx(ChevronDown, { size: 12 }), label: "", chosen: voice.languages.find((l) => l.id === voice.language) ?? null, items: voice.languages, onChange: (l) => voice.setLanguage(l.id), placeholder: "Search languages\u2026", disabled: !voice.able })] }));
+    return (_jsxs(XStack, { items: "center", children: [_jsx(ComposerTool, { label: !voice.able ? 'Dictation needs a microphone this page can record' : voice.on ? 'Stop and transcribe' : voice.busy ? 'Transcribing…' : 'Dictate', icon: voice.on ? _jsx(MicOff, { size: 14 }) : _jsx(Mic, { size: 14 }), onPress: () => void voice.toggle(), disabled: !voice.able || voice.busy, "aria-pressed": voice.on }), _jsx(ChipSelect, { quiet: true, name: "Dictation language", icon: _jsx(ChevronDown, { size: 12 }), label: "", chosen: voice.languages.find((l) => l.id === voice.language), items: voice.languages, onChange: (l) => voice.setLanguage(l.id), placeholder: "Search languages\u2026", disabled: !voice.able })] }));
 }

package/lib/transcript.d.ts

@@ -1,6 +1,7 @@
-import type { ReactNode } from 'react';
+import { type Verdict } from '@hanzo/ui/agents';
+import { type ReactNode } from 'react';
 import type { Card } from './api/turn.ts';
-export declare function Transcript({ cards, live, empty, header, onApprove, approving, }: {
+export declare function Transcript({ cards, live, empty, header, onApprove, approving, onVerdict, }: {
     cards: Card[];
     /** The run is still working: a card still running shows it; otherwise it was cut off. */
     live: boolean;
@@ -9,4 +10,6 @@ export declare function Transcript({ cards, live, empty, header, onApprove, appr
     /** Build what a plan says. Absent, a plan has no button. */
     onApprove?: (plan: string) => void;
     approving?: boolean;
+    /** Record a verdict on what the agent said; throws when it did not land. */
+    onVerdict: (v: Verdict) => Promise<void>;
 }): import("react").JSX.Element;

package/lib/transcript.js

@@ -4,6 +4,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * agent said as markdown, each command it ran as a card that opens onto its
  * output, the files it changed with their diff, the files it read as chips,
  * the run's own steps, and a plan run's plan with the button that builds it.
+ * What the agent said, and its plan, can be copied and judged, as a reply on
+ * claude.ai can: a thumb pressed again takes the verdict back.
  *
  * It follows the run to the bottom as it streams and stops when the reader
  * scrolls up (Thread). Everything drawn is text.
@@ -11,7 +13,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { FileText } from '@hanzogui/lucide-icons-2';
 import { Button } from '@hanzo/ui';
+import { Feedback } from '@hanzo/ui/agents';
 import { Code, Message, Step, Thread } from '@hanzo/ui/chat';
+import { useState } from 'react';
 import { Patch } from './git.js';
 import { Prose } from './prose.js';
 /** A card's output, its tail: what a command said last is why it stopped. */
@@ -30,7 +34,7 @@ function rows(cards) {
     }
     return out;
 }
-export function Transcript({ cards, live, empty, header, onApprove, approving = false, }) {
+export function Transcript({ cards, live, empty, header, onApprove, approving = false, onVerdict, }) {
     // A card the run never finished is cut off once the run has ended, not still going.
     const state = (ran) => (ran === 'running' && !live ? 'cancelled' : ran);
     return (_jsxs(Thread, { maxWidth: 0, gap: 14, column: { px: 0 }, "aria-label": "Transcript", children: [header, cards.length === 0 ? _jsx(YStack, { py: "$2", children: empty }) : null, rows(cards).map((row) => {
@@ -40,7 +44,7 @@ export function Transcript({ cards, live, empty, header, onApprove, approving =
                 const c = row;
                 switch (c.kind) {
                     case 'said':
-                        return c.who === 'person' ? (_jsx(Message, { role: "user", children: _jsx(SizableText, { size: "$3", color: "$ink", style: { whiteSpace: 'pre-wrap' }, children: c.text }) }, c.key)) : (_jsx(Message, { role: "assistant", children: _jsx(Prose, { text: c.text }) }, c.key));
+                        return c.who === 'person' ? (_jsx(Message, { role: "user", children: _jsx(SizableText, { size: "$3", color: "$ink", style: { whiteSpace: 'pre-wrap' }, children: c.text }) }, c.key)) : (_jsx(Message, { role: "assistant", actions: _jsx(Judge, { text: c.text, onVerdict: onVerdict }), children: _jsx(Prose, { text: c.text }) }, c.key));
                     case 'shell':
                         return (_jsx(Step, { name: "Shell", detail: c.command, status: state(c.ran), "aria-label": `Command ${c.command}`, children: _jsx(Code, { language: "shell", value: c.output ? `$ ${c.command}\n${c.output}` : `$ ${c.command}`, children: c.output ? `$ ${c.command}\n${tail(c.output)}` : `$ ${c.command}` }) }, c.key));
                     case 'edit':
@@ -50,7 +54,21 @@ export function Transcript({ cards, live, empty, header, onApprove, approving =
                     case 'note':
                         return (_jsx(SizableText, { size: "$1", color: "$soft", role: "note", children: c.text }, c.key));
                     case 'plan':
-                        return (_jsxs(YStack, { gap: "$3", p: "$4", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", "aria-label": "Plan", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: "Plan" }), _jsx(Prose, { text: c.text }), onApprove ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", disabled: approving, onPress: () => onApprove(c.text), children: approving ? 'Starting the build…' : 'Approve and build' }) })) : null] }, c.key));
+                        return (_jsxs(YStack, { gap: "$3", p: "$4", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", "aria-label": "Plan", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: "Plan" }), _jsx(Prose, { text: c.text }), _jsxs(XStack, { items: "center", gap: "$2", flexWrap: "wrap", children: [onApprove ? (_jsx(Button, { size: "sm", disabled: approving, onPress: () => onApprove(c.text), children: approving ? 'Starting the build…' : 'Approve and build' })) : null, _jsx(Judge, { text: c.text, onVerdict: onVerdict })] })] }, c.key));
                 }
             })] }));
 }
+/** Copy what the agent said, and say whether it was good. A verdict that did not land is taken back and says why. */
+function Judge({ text, onVerdict }) {
+    const [verdict, setVerdict] = useState(null);
+    const [note, setNote] = useState('');
+    const judge = (next) => {
+        setVerdict(next);
+        setNote('');
+        onVerdict(next).catch((e) => {
+            setVerdict(null);
+            setNote(e.message);
+        });
+    };
+    return (_jsxs(XStack, { items: "center", gap: "$2", flexWrap: "wrap", children: [_jsx(Feedback, { text: text, verdict: verdict, onVerdict: judge }), note ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note })) : null] }));
+}

package/lib/visit.d.ts

@@ -0,0 +1,31 @@
+import { type ReactNode } from 'react';
+export declare const PLACES: readonly [{
+    readonly label: 'Download';
+    readonly href: '/#features';
+}, {
+    readonly label: 'Enterprise';
+    readonly href: "https://hanzo.ai/enterprise";
+}, {
+    readonly label: 'Pricing';
+    readonly href: "https://hanzo.ai/pricing";
+}];
+export declare const RESOURCES: readonly [{
+    readonly label: 'Docs';
+    readonly href: 'https://docs.hanzo.ai';
+}, {
+    readonly label: 'Blog';
+    readonly href: "https://hanzo.ai/blog";
+}, {
+    readonly label: 'Customers';
+    readonly href: "https://hanzo.ai/customers";
+}, {
+    readonly label: 'Learn';
+    readonly href: "https://hanzo.ai/learn";
+}, {
+    readonly label: 'Support';
+    readonly href: "https://hanzo.ai/support";
+}];
+/** The header a visitor sees. `name` is the wordmark the rail shows once signed in. */
+export declare function Bar({ name }: {
+    name: ReactNode;
+}): import("react").JSX.Element;

package/lib/visit.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The page to a visitor: the product's header over New.
+ *
+ * Signed out there are no runs to list, so the rail gives way to a header —
+ * Download (Hanzo Dev, under New, pitch.tsx), Resources, Enterprise, Pricing — and the two
+ * doors in, which are one door: IAM's page offers both. New stays the page, and
+ * sending from it asks the visitor to sign in with the sentence kept
+ * (landing.tsx). Below md the four places fold into one menu beside Log in.
+ */
+import { Popover, SizableText, XStack, YStack } from '@hanzo/gui';
+import { ChevronDown, Menu } from '@hanzogui/lucide-icons-2';
+import { Button } from '@hanzo/ui';
+import { MenuLabel, MenuRow, MenuRule } from '@hanzo/ui/product';
+import { useState } from 'react';
+import { useHost } from './host.js';
+const SITE = 'https://hanzo.ai';
+export const PLACES = [
+    { label: 'Download', href: '/#features' },
+    { label: 'Enterprise', href: `${SITE}/enterprise` },
+    { label: 'Pricing', href: `${SITE}/pricing` },
+];
+export const RESOURCES = [
+    { label: 'Docs', href: 'https://docs.hanzo.ai' },
+    { label: 'Blog', href: `${SITE}/blog` },
+    { label: 'Customers', href: `${SITE}/customers` },
+    { label: 'Learn', href: `${SITE}/learn` },
+    { label: 'Support', href: `${SITE}/support` },
+];
+const leave = (href) => window.location.assign(href);
+/** One place in the header: an address, drawn as text. */
+function Place({ href, children }) {
+    return (_jsx("a", { href: href, style: { color: 'inherit', textDecoration: 'none' }, children: _jsx(XStack, { items: "center", height: 34, px: "$2.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$3", color: "$ink", children: children }) }) }));
+}
+function Resources() {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, placement: "bottom-start", offset: 6, children: [_jsx(Popover.Trigger, { asChild: true, children: _jsxs(XStack, { render: "button", "aria-label": "Resources", "aria-expanded": open, items: "center", gap: "$1", height: 34, px: "$2.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: [_jsx(SizableText, { size: "$3", color: "$ink", children: "Resources" }), _jsx(ChevronDown, { size: 14, color: "$soft" })] }) }), _jsx(Popover.Content, { role: "menu", "aria-label": "Resources", items: "stretch", borderWidth: 1, elevation: "$2", p: "$1", width: 220, bg: "$panel", borderColor: "$borderColor", children: _jsx(YStack, { gap: "$1", children: RESOURCES.map((r) => (_jsx(MenuRow, { label: r.label, onPress: () => leave(r.href) }, r.label))) }) })] }));
+}
+/** Below md: every place, the resources and the door, in one menu. */
+function Fold({ onEnter }) {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, placement: "bottom-end", offset: 6, stayInFrame: true, children: [_jsx(Popover.Trigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Menu", children: _jsx(Menu, { size: 18 }) }) }), _jsx(Popover.Content, { role: "menu", "aria-label": "Menu", items: "stretch", borderWidth: 1, elevation: "$2", p: "$1", width: 260, bg: "$panel", borderColor: "$borderColor", children: _jsxs(YStack, { gap: "$1", children: [PLACES.map((p) => (_jsx(MenuRow, { label: p.label, onPress: () => leave(p.href) }, p.label))), _jsx(MenuRule, {}), _jsx(MenuLabel, { children: "Resources" }), RESOURCES.map((r) => (_jsx(MenuRow, { label: r.label, onPress: () => leave(r.href) }, r.label))), _jsx(MenuRule, {}), _jsx(MenuRow, { label: "Sign up", onPress: () => {
+                                setOpen(false);
+                                onEnter();
+                            } })] }) })] }));
+}
+/** The header a visitor sees. `name` is the wordmark the rail shows once signed in. */
+export function Bar({ name }) {
+    const host = useHost();
+    const enter = () => host.signIn?.();
+    const [features, enterprise, pricing] = PLACES;
+    return (_jsxs(XStack, { role: "banner", height: 60, px: "$4", gap: "$2", items: "center", shrink: 0, $md: { px: '$6' }, children: [name, _jsxs(XStack, { role: "navigation", "aria-label": "Site", items: "center", gap: "$1", ml: "$4", "$max-md": { display: 'none' }, children: [_jsx(Place, { href: features.href, children: features.label }), _jsx(Resources, {}), _jsx(Place, { href: enterprise.href, children: enterprise.label }), _jsx(Place, { href: pricing.href, children: pricing.label })] }), _jsx(XStack, { flex: 1 }), _jsx(Button, { variant: "ghost", size: "sm", onPress: enter, children: "Log in" }), _jsx(XStack, { "$max-md": { display: 'none' }, children: _jsx(Button, { size: "sm", variant: "primary", onPress: enter, children: "Sign up" }) }), _jsx(XStack, { $md: { display: 'none' }, children: _jsx(Fold, { onEnter: enter }) })] }));
+}