@hanzo/ui 8.1.4 → 8.1.5

package/dist/chat/Code.cjs

@@ -30,7 +30,7 @@ const CopyButton_1 = require("../product/CopyButton.cjs");
 const MONO = {
     fontFamily: 'var(--font-geist-mono, ui-monospace, SFMono-Regular, Menlo, monospace)',
 };
-function Code({ children, language = 'text', value, actions }) {
+function Code({ children, language = 'text', value, actions, ...props }) {
     const text = value ?? (typeof children === 'string' ? children : '');
-    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('code'), width: "100%", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$color2", overflow: "hidden", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$1", px: "$3", py: "$1.5", borderBottomWidth: 1, borderColor: "$borderColor", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", style: MONO, color: "$color11", children: language }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), actions, text ? (0, jsx_runtime_1.jsx)(CopyButton_1.CopyButton, { value: text }) : null] }), (0, jsx_runtime_1.jsx)(gui_1.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: (0, jsx_runtime_1.jsx)(gui_1.YStack, { px: "$3", py: "$2.5", children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", style: MONO, lineHeight: 20, children: children }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('code'), width: "100%", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$color2", overflow: "hidden", ...props, children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$1", px: "$3", py: "$1.5", borderBottomWidth: 1, borderColor: "$borderColor", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", style: MONO, color: "$color11", children: language }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), actions, text ? (0, jsx_runtime_1.jsx)(CopyButton_1.CopyButton, { value: text }) : null] }), (0, jsx_runtime_1.jsx)(gui_1.ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: (0, jsx_runtime_1.jsx)(gui_1.YStack, { px: "$3", py: "$2.5", children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", style: MONO, lineHeight: 20, children: children }) }) })] }));
 }

package/dist/chat/Code.d.ts

@@ -1,5 +1,18 @@
-import { type ReactNode } from 'react';
-export interface CodeProps {
+/**
+ * Code — a labelled, copyable code region.
+ *
+ * The language label and the controls live in a bar above the code, never
+ * floating over it: an overlaid copy button covers the first line, which is
+ * where the prompt or the import sits and the part most often being read.
+ *
+ * Highlighting is not here. Surfaces disagree on the highlighter (and on whether
+ * they want one at all), and a package that picked would either impose a large
+ * dependency or be bypassed. `children` is rendered as-is, so a surface can pass
+ * plain text or its own highlighted nodes.
+ */
+import { YStack } from '@hanzo/gui';
+import { type ComponentProps, type ReactNode } from 'react';
+export interface CodeProps extends Omit<ComponentProps<typeof YStack>, 'children'> {
     children?: ReactNode;
     /** Shown in the label bar. */
     language?: string;
@@ -8,5 +21,5 @@ export interface CodeProps {
     /** Extra controls in the label bar, before copy. */
     actions?: ReactNode;
 }
-export declare function Code({ children, language, value, actions }: CodeProps): import("react/jsx-runtime").JSX.Element;
+export declare function Code({ children, language, value, actions, ...props }: CodeProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Code.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Code.d.ts","sourceRoot":"","sources":["../../src/chat/Code.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAkBtC,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAiB,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,SAAS,2CAyD9E"}
+{"version":3,"file":"Code.d.ts","sourceRoot":"","sources":["../../src/chat/Code.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,OAAO,EAAmC,MAAM,EAAE,MAAM,YAAY,CAAA;AACpE,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAkB3D,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC;IAChF,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAiB,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,2CA0DxF"}

package/dist/chat/Code.js

@@ -27,8 +27,8 @@ import { CopyButton } from '../product/CopyButton.js';
 const MONO = {
     fontFamily: 'var(--font-geist-mono, ui-monospace, SFMono-Regular, Menlo, monospace)',
 };
-export function Code({ children, language = 'text', value, actions }) {
+export function Code({ children, language = 'text', value, actions, ...props }) {
     const text = value ?? (typeof children === 'string' ? children : '');
-    return (_jsxs(YStack, { ...slot('code'), width: "100%", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$color2", overflow: "hidden", children: [_jsxs(XStack, { items: "center", gap: "$1", px: "$3", py: "$1.5", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", style: MONO, color: "$color11", children: language }), _jsx(XStack, { flex: 1 }), actions, text ? _jsx(CopyButton, { value: text }) : null] }), _jsx(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: _jsx(YStack, { px: "$3", py: "$2.5", children: _jsx(SizableText, { size: "$1", style: MONO, lineHeight: 20, children: children }) }) })] }));
+    return (_jsxs(YStack, { ...slot('code'), width: "100%", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$color2", overflow: "hidden", ...props, children: [_jsxs(XStack, { items: "center", gap: "$1", px: "$3", py: "$1.5", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", style: MONO, color: "$color11", children: language }), _jsx(XStack, { flex: 1 }), actions, text ? _jsx(CopyButton, { value: text }) : null] }), _jsx(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, children: _jsx(YStack, { px: "$3", py: "$2.5", children: _jsx(SizableText, { size: "$1", style: MONO, lineHeight: 20, children: children }) }) })] }));
 }
 //# sourceMappingURL=Code.js.map

package/dist/chat/Code.js.map

@@ -1 +1 @@
-{"version":3,"file":"Code.js","sourceRoot":"","sources":["../../src/chat/Code.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAGpE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAElD;;;;;;;;GAQG;AACH,MAAM,IAAI,GAAG;IACX,UAAU,EAAE,wEAAwE;CAC5E,CAAA;AAYV,MAAM,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAAG,MAAM,EAAE,KAAK,EAAE,OAAO,EAAa;IAC7E,MAAM,IAAI,GAAG,KAAK,IAAI,CAAC,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;IAEpE,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,MAAM,CAAC,EAChB,KAAK,EAAC,MAAM,EACZ,OAAO,EAAC,IAAI,EACZ,WAAW,EAAE,CAAC,EACd,WAAW,EAAC,cAAc,EAC1B,EAAE,EAAC,SAAS,EACZ,QAAQ,EAAC,QAAQ,aAEjB,MAAC,MAAM,IACL,KAAK,EAAC,QAAQ,EACd,GAAG,EAAC,IAAI,EACR,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,MAAM,EACT,iBAAiB,EAAE,CAAC,EACpB,WAAW,EAAC,cAAc,aAQ1B,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAC,UAAU,YACjD,QAAQ,GACG,EACd,KAAC,MAAM,IAAC,IAAI,EAAE,CAAC,GAAI,EAClB,OAAO,EACP,IAAI,CAAC,CAAC,CAAC,KAAC,UAAU,IAAC,KAAK,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,IAAI,IACnC,EAeT,KAAC,UAAU,IAAC,UAAU,QAAC,8BAA8B,EAAE,KAAK,YAC1D,KAAC,MAAM,IAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,MAAM,YACvB,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,YAC/C,QAAQ,GACG,GACP,GACE,IACN,CACV,CAAA;AACH,CAAC"}
+{"version":3,"file":"Code.js","sourceRoot":"","sources":["../../src/chat/Code.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAGpE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAElD;;;;;;;;GAQG;AACH,MAAM,IAAI,GAAG;IACX,UAAU,EAAE,wEAAwE;CAC5E,CAAA;AAYV,MAAM,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAAG,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,KAAK,EAAa;IACvF,MAAM,IAAI,GAAG,KAAK,IAAI,CAAC,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;IAEpE,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,MAAM,CAAC,EAChB,KAAK,EAAC,MAAM,EACZ,OAAO,EAAC,IAAI,EACZ,WAAW,EAAE,CAAC,EACd,WAAW,EAAC,cAAc,EAC1B,EAAE,EAAC,SAAS,EACZ,QAAQ,EAAC,QAAQ,KACb,KAAK,aAET,MAAC,MAAM,IACL,KAAK,EAAC,QAAQ,EACd,GAAG,EAAC,IAAI,EACR,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,MAAM,EACT,iBAAiB,EAAE,CAAC,EACpB,WAAW,EAAC,cAAc,aAQ1B,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAC,UAAU,YACjD,QAAQ,GACG,EACd,KAAC,MAAM,IAAC,IAAI,EAAE,CAAC,GAAI,EAClB,OAAO,EACP,IAAI,CAAC,CAAC,CAAC,KAAC,UAAU,IAAC,KAAK,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,IAAI,IACnC,EAeT,KAAC,UAAU,IAAC,UAAU,QAAC,8BAA8B,EAAE,KAAK,YAC1D,KAAC,MAAM,IAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,MAAM,YACvB,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,YAC/C,QAAQ,GACG,GACP,GACE,IACN,CACV,CAAA;AACH,CAAC"}

package/dist/chat/Composer.cjs

@@ -27,14 +27,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
  * nothing here for it to reach. Adding either would be inventing an interaction
  * and then asking three surfaces to adopt it.
  *
- * Growth is `Textarea`'s and it is LINE-DRIVEN, not DOM-measured: the row count
- * follows the newlines in the value, which is what lets web, native and desktop
- * grow identically. The tradeoff is real and worth knowing before you adopt —
- * a draft that soft-wraps without ever containing a `\n` does not raise the row
- * count, so a long unbroken paragraph scrolls inside the floor instead of
- * growing the field. Fixing that means measuring `scrollHeight`, which is the
- * DOM-only path the five hand-rolled composers each took and the reason none of
- * them runs on native. It is a `Textarea` decision, not a chat one.
+ * Growth is `Textarea`'s, and since 8.1.4 it follows the CONTENT rather than the
+ * newline count — so a long paragraph that wraps without ever containing a `\n`
+ * raises the field instead of scrolling inside it. `rows` is the floor and
+ * `maxHeight` the ceiling; both are bounds, and neither is re-implemented here.
  */
 const gui_1 = require("@hanzo/gui");
 const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
@@ -81,7 +77,7 @@ const FLOOR = 44;
  * changes — which is what a model-named placeholder forces a surface to do.
  */
 exports.ASK = 'Ask anything';
-function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = exports.ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, }) {
+function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = exports.ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, label, field, send, ...props }) {
     const sendable = (0, send_1.ready)(value, busy, disabled);
     const keyed = (e) => {
         const key = e.key ?? e.nativeEvent?.key ?? '';
@@ -101,5 +97,15 @@ function Composer({ value, onChange, onSend, onStop, busy = false, disabled = fa
         if (sendable)
             onSend();
     };
-    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('composer'), width: "100%", rounded: "$5", borderWidth: 1, borderColor: "$borderColor", bg: "$background", p: PAD, gap: PAD, children: [(0, jsx_runtime_1.jsx)(gui_2.Textarea, { ...(0, slot_1.slot)('composer-field'), rows: rows, value: value, placeholder: placeholder, disabled: disabled, onChangeText: onChange, onKeyDown: keyed, borderWidth: 0, minH: FLOOR, maxH: maxHeight, "aria-label": placeholder }), (0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: PAD, children: [children, (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), hint ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$color10", children: hint })) : null, (0, jsx_runtime_1.jsx)(gui_2.Button, { ...(0, slot_1.slot)('composer-send'), size: "sm", disabled: busy ? !onStop : !sendable, onPress: busy ? onStop : onSend, "aria-label": busy ? 'Stop' : 'Send', children: busy ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Square, { size: 14 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ArrowUp, { size: 16 }) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('composer'), width: "100%", rounded: "$5", borderWidth: 1, borderColor: "$borderColor", bg: "$background", p: PAD, gap: PAD, ...props, children: [(0, jsx_runtime_1.jsx)(gui_2.Textarea, { ...(0, slot_1.slot)('composer-field'), rows: rows, placeholder: placeholder, disabled: disabled, borderWidth: 0, minH: FLOOR, maxH: maxHeight, "aria-label": label ?? placeholder, ...field, 
+                // After `field`, and deliberately. These four ARE the composer; a
+                // caller's `onKeyDown` landing on top of `keyed` would take the Enter
+                // rule and the IME guard with it, type-check, and go on looking
+                // correct until a Japanese writer typed into it. So the caller's runs
+                // FIRST and this one defers to it if it claimed the key.
+                value: value, onChangeText: onChange, onKeyDown: (e) => {
+                    field?.onKeyDown?.(e);
+                    if (!e?.defaultPrevented)
+                        keyed(e);
+                } }), (0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: PAD, children: [children, (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), hint ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$color10", children: hint })) : null, send ?? ((0, jsx_runtime_1.jsx)(gui_2.Button, { ...(0, slot_1.slot)('composer-send'), size: "sm", disabled: busy ? !onStop : !sendable, onPress: busy ? onStop : onSend, "aria-label": busy ? 'Stop' : 'Send', children: busy ? (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Square, { size: 14 }) : (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ArrowUp, { size: 16 }) }))] })] }));
 }

package/dist/chat/Composer.d.ts

@@ -1,4 +1,38 @@
-import type { ReactNode } from 'react';
+/**
+ * Composer — the one chat input for every Hanzo surface.
+ *
+ * Presentational and controlled: it owns no draft, no transport and no model
+ * state. `children` is the toolbar slot, which is where a surface puts its
+ * `ModelSelector`, attachment control or mode chips — that keeps the shell the
+ * same everywhere while the affordances stay per-surface.
+ *
+ * The send control is the same button in both states: it submits, and while a
+ * turn is in flight it stops. Two buttons in one place was the thing every
+ * surface got subtly different.
+ *
+ * Two keys are deliberately absent, because the surfaces do not agree that they
+ * exist. ESCAPE is bound in none of the three main composers — only in chat's
+ * two SUB-composers, where it dismisses the thing they float over
+ * (`SelectionAsk.tsx:85`, `EditMessage.tsx:124`), which is the host's concern
+ * and not the field's. ARROWUP recalls the last turn in exactly one composer,
+ * chat's (`useHandleKeyUp.ts:117`), and it does it by finding
+ * `document.getElementById('edit-' + parentMessageId)` and clicking it — it is
+ * a binding to their edit-in-place, not a general history recall, and there is
+ * nothing here for it to reach. Adding either would be inventing an interaction
+ * and then asking three surfaces to adopt it.
+ *
+ * Growth is `Textarea`'s, and since 8.1.4 it follows the CONTENT rather than the
+ * newline count — so a long paragraph that wraps without ever containing a `\n`
+ * raises the field instead of scrolling inside it. `rows` is the floor and
+ * `maxHeight` the ceiling; both are bounds, and neither is re-implemented here.
+ */
+import { YStack } from '@hanzo/gui';
+import type { ComponentProps, ReactNode } from 'react';
+import { Textarea } from '../backends/gui/index.js';
+/** `onChange` is dropped: this component already has one and it carries the
+ *  draft, not a DOM change event. */
+type Stack = Omit<ComponentProps<typeof YStack>, 'children' | 'onChange'>;
+type FieldProps = Omit<ComponentProps<typeof Textarea>, 'value' | 'onChangeText'>;
 /**
  * The resting placeholder.
  *
@@ -8,7 +42,7 @@ import type { ReactNode } from 'react';
  * changes — which is what a model-named placeholder forces a surface to do.
  */
 export declare const ASK = "Ask anything";
-export interface ComposerProps {
+export interface ComposerProps extends Stack {
     value: string;
     onChange: (value: string) => void;
     /** Called when the draft is submitted. Clearing `value` is the host's job. */
@@ -27,6 +61,28 @@ export interface ComposerProps {
     children?: ReactNode;
     /** Hint shown at the end of the footer row. */
     hint?: string;
+    /**
+     * The accessible name of the field.
+     *
+     * Distinct from `placeholder`, which it used to be derived from. A surface
+     * whose placeholder rotates on a timer — hanzo.app's does — renamed the
+     * control on every tick, so a screen reader re-announced the field while the
+     * writer was typing into it. The name is stable and the placeholder is
+     * decoration; deriving one from the other conflates them.
+     */
+    label?: string;
+    /** The field's own props — a ref, a testid, focus handlers, a paste handler. */
+    field?: FieldProps;
+    /**
+     * Replaces the send control entirely.
+     *
+     * The default is the right one — one button that submits and stops, which is
+     * what every surface got subtly different — but a surface with a second
+     * commit mode has nowhere else to put it, and `children` is the START of the
+     * footer row.
+     */
+    send?: ReactNode;
 }
-export declare function Composer({ value, onChange, onSend, onStop, busy, disabled, placeholder, rows, maxHeight, children, hint, }: ComposerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Composer({ value, onChange, onSend, onStop, busy, disabled, placeholder, rows, maxHeight, children, hint, label, field, send, ...props }: ComposerProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=Composer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Composer.d.ts","sourceRoot":"","sources":["../../src/chat/Composer.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAwCtC;;;;;;;GAOG;AACH,eAAO,MAAM,GAAG,iBAAiB,CAAA;AAEjC,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,8EAA8E;IAC9E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yEAAyE;IACzE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,kEAAkE;IAClE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,QAAQ,EACR,MAAM,EACN,MAAM,EACN,IAAY,EACZ,QAAgB,EAChB,WAAiB,EACjB,IAAe,EACf,SAAmB,EACnB,QAAQ,EACR,IAAI,GACL,EAAE,aAAa,2CAgEf"}
+{"version":3,"file":"Composer.d.ts","sourceRoot":"","sources":["../../src/chat/Composer.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,OAAO,EAAuB,MAAM,EAAE,MAAM,YAAY,CAAA;AAExD,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,EAAU,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAIlD;qCACqC;AACrC,KAAK,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,CAAA;AACzE,KAAK,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC,CAAA;AAoCjF;;;;;;;GAOG;AACH,eAAO,MAAM,GAAG,iBAAiB,CAAA;AAEjC,MAAM,WAAW,aAAc,SAAQ,KAAK;IAC1C,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,8EAA8E;IAC9E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yEAAyE;IACzE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,kEAAkE;IAClE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;;OAQG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gFAAgF;IAChF,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;CACjB;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,QAAQ,EACR,MAAM,EACN,MAAM,EACN,IAAY,EACZ,QAAgB,EAChB,WAAiB,EACjB,IAAe,EACf,SAAmB,EACnB,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,aAAa,2CA4Ef"}

package/dist/chat/Composer.js

@@ -23,14 +23,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * nothing here for it to reach. Adding either would be inventing an interaction
  * and then asking three surfaces to adopt it.
  *
- * Growth is `Textarea`'s and it is LINE-DRIVEN, not DOM-measured: the row count
- * follows the newlines in the value, which is what lets web, native and desktop
- * grow identically. The tradeoff is real and worth knowing before you adopt —
- * a draft that soft-wraps without ever containing a `\n` does not raise the row
- * count, so a long unbroken paragraph scrolls inside the floor instead of
- * growing the field. Fixing that means measuring `scrollHeight`, which is the
- * DOM-only path the five hand-rolled composers each took and the reason none of
- * them runs on native. It is a `Textarea` decision, not a chat one.
+ * Growth is `Textarea`'s, and since 8.1.4 it follows the CONTENT rather than the
+ * newline count — so a long paragraph that wraps without ever containing a `\n`
+ * raises the field instead of scrolling inside it. `rows` is the floor and
+ * `maxHeight` the ceiling; both are bounds, and neither is re-implemented here.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { ArrowUp, Square } from '@hanzogui/lucide-icons-2';
@@ -77,7 +73,7 @@ const FLOOR = 44;
  * changes — which is what a model-named placeholder forces a surface to do.
  */
 export const ASK = 'Ask anything';
-export function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, }) {
+export function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, label, field, send, ...props }) {
     const sendable = ready(value, busy, disabled);
     const keyed = (e) => {
         const key = e.key ?? e.nativeEvent?.key ?? '';
@@ -97,6 +93,16 @@ export function Composer({ value, onChange, onSend, onStop, busy = false, disabl
         if (sendable)
             onSend();
     };
-    return (_jsxs(YStack, { ...slot('composer'), width: "100%", rounded: "$5", borderWidth: 1, borderColor: "$borderColor", bg: "$background", p: PAD, gap: PAD, children: [_jsx(Textarea, { ...slot('composer-field'), rows: rows, value: value, placeholder: placeholder, disabled: disabled, onChangeText: onChange, onKeyDown: keyed, borderWidth: 0, minH: FLOOR, maxH: maxHeight, "aria-label": placeholder }), _jsxs(XStack, { items: "center", gap: PAD, children: [children, _jsx(XStack, { flex: 1 }), hint ? (_jsx(SizableText, { size: "$1", color: "$color10", children: hint })) : null, _jsx(Button, { ...slot('composer-send'), size: "sm", disabled: busy ? !onStop : !sendable, onPress: busy ? onStop : onSend, "aria-label": busy ? 'Stop' : 'Send', children: busy ? _jsx(Square, { size: 14 }) : _jsx(ArrowUp, { size: 16 }) })] })] }));
+    return (_jsxs(YStack, { ...slot('composer'), width: "100%", rounded: "$5", borderWidth: 1, borderColor: "$borderColor", bg: "$background", p: PAD, gap: PAD, ...props, children: [_jsx(Textarea, { ...slot('composer-field'), rows: rows, placeholder: placeholder, disabled: disabled, borderWidth: 0, minH: FLOOR, maxH: maxHeight, "aria-label": label ?? placeholder, ...field, 
+                // After `field`, and deliberately. These four ARE the composer; a
+                // caller's `onKeyDown` landing on top of `keyed` would take the Enter
+                // rule and the IME guard with it, type-check, and go on looking
+                // correct until a Japanese writer typed into it. So the caller's runs
+                // FIRST and this one defers to it if it claimed the key.
+                value: value, onChangeText: onChange, onKeyDown: (e) => {
+                    field?.onKeyDown?.(e);
+                    if (!e?.defaultPrevented)
+                        keyed(e);
+                } }), _jsxs(XStack, { items: "center", gap: PAD, children: [children, _jsx(XStack, { flex: 1 }), hint ? (_jsx(SizableText, { size: "$1", color: "$color10", children: hint })) : null, send ?? (_jsx(Button, { ...slot('composer-send'), size: "sm", disabled: busy ? !onStop : !sendable, onPress: busy ? onStop : onSend, "aria-label": busy ? 'Stop' : 'Send', children: busy ? _jsx(Square, { size: 14 }) : _jsx(ArrowUp, { size: 16 }) }))] })] }));
 }
 //# sourceMappingURL=Composer.js.map

package/dist/chat/Composer.js.map

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

package/dist/chat/Failure.cjs

@@ -33,12 +33,12 @@ const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
 const gui_2 = require("../backends/gui/index.cjs");
 const ink_1 = require("../backends/gui/ink.cjs");
 const slot_1 = require("../backends/gui/slot.cjs");
-function Failure({ children, onRetry, retryLabel = 'Try again' }) {
+function Failure({ children, onRetry, retryLabel = 'Try again', ...props }) {
     return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('failure'), role: "alert", "aria-live": "assertive", width: "100%", gap: "$2", px: "$3", py: "$2.5", rounded: "$4", borderWidth: 1, 
         // The edge again — see `product/tone.ts`. Its `stopped` register is
         // `$color4` behind a `$color9` border for exactly this: with no hue to
         // spend, an outline is what separates "this one" from its neighbours.
-        borderColor: "$color9", bg: "$color4", children: [(0, ink_1.ink)(children, undefined, { size: '$2', color: '$color12' }), onRetry ? (
+        borderColor: "$color9", bg: "$color4", ...props, children: [(0, ink_1.ink)(children, undefined, { size: '$2', color: '$color12' }), onRetry ? (
             // The real Button, not a `role="button"` box with an `onPress`. A View
             // wearing the role takes focus and then does nothing on Enter or Space,
             // because the activation behaviour belongs to the element and not to

package/dist/chat/Failure.d.ts

@@ -1,10 +1,36 @@
-import type { ReactNode } from 'react';
-export interface FailureProps {
+/**
+ * Failure — the turn did not complete, and what to do about it.
+ *
+ * Distinct from a `Step` that errored: a step can fail inside an answer that
+ * still arrives, this is the answer not arriving. hanzo/chat keeps the same
+ * separation — `ToolCall`'s error state, and separately `MessageContent.tsx:153`
+ * swapping the whole body for `ErrorMessage`.
+ *
+ * Four surfaces draw this line and no two draw it the same way: chat's
+ * `ErrorBox` (`components/Messages/Content/Error.tsx`), the app builder's
+ * `$red8` text with the prose instruction "Something went wrong — please try
+ * again" (`ask-ai/chat-thread.tsx:258`), the extension's `.ae-error` div
+ * (`AnswerEngine.tsx:336`), and hanzo.app `/chat`, which is the interesting
+ * one: it sets `Message.error` at `app/chat/page.tsx:292` and never reads it
+ * anywhere in the render, so a stream that dies reports through a detached
+ * banner and the turn itself says nothing.
+ *
+ * Two of the four offer a way to try again. Both put it next to the message
+ * rather than in the hover strip, because a hover affordance on the thing that
+ * just failed is not reachable on a touch device.
+ *
+ * `role="alert"` with `aria-live="assertive"` is chat's, and it is right: a
+ * turn failing is the one event in a conversation that has to interrupt, since
+ * the reader is waiting on prose that is never going to come.
+ */
+import { YStack } from '@hanzo/gui';
+import type { ComponentProps, ReactNode } from 'react';
+export interface FailureProps extends Omit<ComponentProps<typeof YStack>, 'children'> {
     /** What went wrong, in the surface's own words. */
     children?: ReactNode;
     /** Offer to run the turn again. Omit and no control renders. */
     onRetry?: () => void;
     retryLabel?: string;
 }
-export declare function Failure({ children, onRetry, retryLabel }: FailureProps): import("react/jsx-runtime").JSX.Element;
+export declare function Failure({ children, onRetry, retryLabel, ...props }: FailureProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Failure.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Failure.d.ts","sourceRoot":"","sources":["../../src/chat/Failure.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtC,MAAM,WAAW,YAAY;IAC3B,mDAAmD;IACnD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAwB,EAAE,EAAE,YAAY,2CAkCpF"}
+{"version":3,"file":"Failure.d.ts","sourceRoot":"","sources":["../../src/chat/Failure.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,OAAO,EAAU,MAAM,EAAE,MAAM,YAAY,CAAA;AAE3C,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtD,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC;IACnF,mDAAmD;IACnD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAwB,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,2CAmC9F"}

package/dist/chat/Failure.js

@@ -30,12 +30,12 @@ import { RefreshCw } from '@hanzogui/lucide-icons-2';
 import { Button } from '../backends/gui/index.js';
 import { ink } from '../backends/gui/ink.js';
 import { slot } from '../backends/gui/slot.js';
-export function Failure({ children, onRetry, retryLabel = 'Try again' }) {
+export function Failure({ children, onRetry, retryLabel = 'Try again', ...props }) {
     return (_jsxs(YStack, { ...slot('failure'), role: "alert", "aria-live": "assertive", width: "100%", gap: "$2", px: "$3", py: "$2.5", rounded: "$4", borderWidth: 1, 
         // The edge again — see `product/tone.ts`. Its `stopped` register is
         // `$color4` behind a `$color9` border for exactly this: with no hue to
         // spend, an outline is what separates "this one" from its neighbours.
-        borderColor: "$color9", bg: "$color4", children: [ink(children, undefined, { size: '$2', color: '$color12' }), onRetry ? (
+        borderColor: "$color9", bg: "$color4", ...props, children: [ink(children, undefined, { size: '$2', color: '$color12' }), onRetry ? (
             // The real Button, not a `role="button"` box with an `onPress`. A View
             // wearing the role takes focus and then does nothing on Enter or Space,
             // because the activation behaviour belongs to the element and not to

package/dist/chat/Failure.js.map

@@ -1 +1 @@
-{"version":3,"file":"Failure.js","sourceRoot":"","sources":["../../src/chat/Failure.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGpD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAU3C,MAAM,UAAU,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,GAAG,WAAW,EAAgB;IACnF,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,SAAS,CAAC,EACnB,IAAI,EAAC,OAAO,eACF,WAAW,EACrB,KAAK,EAAC,MAAM,EACZ,GAAG,EAAC,IAAI,EACR,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,IAAI,EACZ,WAAW,EAAE,CAAC;QACd,oEAAoE;QACpE,uEAAuE;QACvE,sEAAsE;QACtE,WAAW,EAAC,SAAS,EACrB,EAAE,EAAC,SAAS,aAEX,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,EAC3D,OAAO,CAAC,CAAC,CAAC;YACT,uEAAuE;YACvE,wEAAwE;YACxE,qEAAqE;YACrE,uEAAuE;YACvE,+BAA+B;YAC/B,KAAC,MAAM,IAAC,IAAI,EAAC,YAAY,YACvB,MAAC,MAAM,OAAK,IAAI,CAAC,eAAe,CAAC,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,OAAO,aAC7E,KAAC,SAAS,IAAC,IAAI,EAAE,EAAE,GAAI,EACtB,UAAU,IACJ,GACF,CACV,CAAC,CAAC,CAAC,IAAI,IACD,CACV,CAAA;AACH,CAAC"}
+{"version":3,"file":"Failure.js","sourceRoot":"","sources":["../../src/chat/Failure.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGpD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAU3C,MAAM,UAAU,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,GAAG,WAAW,EAAE,GAAG,KAAK,EAAgB;IAC7F,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,SAAS,CAAC,EACnB,IAAI,EAAC,OAAO,eACF,WAAW,EACrB,KAAK,EAAC,MAAM,EACZ,GAAG,EAAC,IAAI,EACR,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,IAAI,EACZ,WAAW,EAAE,CAAC;QACd,oEAAoE;QACpE,uEAAuE;QACvE,sEAAsE;QACtE,WAAW,EAAC,SAAS,EACrB,EAAE,EAAC,SAAS,KACR,KAAK,aAER,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,EAC3D,OAAO,CAAC,CAAC,CAAC;YACT,uEAAuE;YACvE,wEAAwE;YACxE,qEAAqE;YACrE,uEAAuE;YACvE,+BAA+B;YAC/B,KAAC,MAAM,IAAC,IAAI,EAAC,YAAY,YACvB,MAAC,MAAM,OAAK,IAAI,CAAC,eAAe,CAAC,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,OAAO,aAC7E,KAAC,SAAS,IAAC,IAAI,EAAE,EAAE,GAAI,EACtB,UAAU,IACJ,GACF,CACV,CAAC,CAAC,CAAC,IAAI,IACD,CACV,CAAA;AACH,CAAC"}

package/dist/chat/Header.cjs

@@ -18,8 +18,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const gui_1 = require("@hanzo/gui");
 const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
 const slot_1 = require("../backends/gui/slot.cjs");
-function Header({ title, onOpenMenu, children }) {
-    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('chat-header'), width: "100%", height: 48, shrink: 0, items: "center", gap: "$2", px: "$3", borderBottomWidth: 1, borderColor: "$borderColor", bg: "$background", children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$1", shrink: 1, children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", fontWeight: "500", numberOfLines: 1, children: title }), onOpenMenu ? ((0, jsx_runtime_1.jsx)(HeaderButton, { label: "Conversation options", onPress: onOpenMenu, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Ellipsis, { size: 16 }) })) : null] }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), children] }));
+function Header({ title, onOpenMenu, children, leading, ...props }) {
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('chat-header'), width: "100%", height: 48, shrink: 0, items: "center", gap: "$2", px: "$3", borderBottomWidth: 1, borderColor: "$borderColor", bg: "$background", ...props, children: [leading, (0, jsx_runtime_1.jsxs)(gui_1.XStack, { items: "center", gap: "$1", shrink: 1, children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", fontWeight: "500", numberOfLines: 1, children: title }), onOpenMenu ? ((0, jsx_runtime_1.jsx)(HeaderButton, { label: "Conversation options", onPress: onOpenMenu, children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Ellipsis, { size: 16 }) })) : null] }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1 }), children] }));
 }
 function HeaderButton({ label, onPress, children }) {
     return ((0, jsx_runtime_1.jsx)(gui_1.XStack, { width: 32, height: 32, items: "center", justify: "center", rounded: "$3", cursor: "pointer", opacity: 0.7, onPress: onPress, role: "button", tabIndex: 0, "aria-label": label, ...(0, slot_1.tip)(label), hoverStyle: { bg: '$color4', opacity: 1 }, pressStyle: { bg: '$color5' }, children: children }));

package/dist/chat/Header.d.ts

@@ -1,12 +1,29 @@
-import type { ReactNode } from 'react';
-export interface HeaderProps {
+/**
+ * Header — the conversation title bar.
+ *
+ * Title on the left, `children` as the action slot on the right. The actions are
+ * a slot rather than a fixed set because what belongs there is per-surface:
+ * hanzo.chat shares and opens a details rail, the console shows the owning
+ * project, hanzo.app shows neither.
+ */
+import { XStack } from '@hanzo/gui';
+import type { ComponentProps, ReactNode } from 'react';
+export interface HeaderProps extends Omit<ComponentProps<typeof XStack>, 'children'> {
     title: string;
     /** Overflow menu next to the title. Omit to hide it. */
     onOpenMenu?: () => void;
     /** Action slot, rendered at the end of the row. */
     children?: ReactNode;
+    /**
+     * Slot BEFORE the title — a rail toggle, a back arrow.
+     *
+     * hanzo.app `/chat` leads with a sidebar toggle and kept its own header
+     * rather than adopt this one, because the row began at the title and there
+     * was nowhere to put it.
+     */
+    leading?: ReactNode;
 }
-export declare function Header({ title, onOpenMenu, children }: HeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function Header({ title, onOpenMenu, children, leading, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
 export interface HeaderButtonProps {
     /** Required — the accessible name for an icon-only control. */
     label: string;

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

@@ -1 +1 @@
-{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/chat/Header.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,wDAAwD;IACxD,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,WAAW,2CAiClE;AAED,MAAM,WAAW,iBAAiB;IAChC,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAqB3E;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAe,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAuBzE;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,wBAAgB,WAAW,CAAC,EAAE,KAA8B,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAMxF;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,KAAW,EAAE,EAAE,UAAU,2CAe1D"}
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/chat/Header.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,OAAO,EAAe,MAAM,EAAU,MAAM,YAAY,CAAA;AAExD,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItD,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC;IAClF,KAAK,EAAE,MAAM,CAAA;IACb,wDAAwD;IACxD,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAmCrF;AAED,MAAM,WAAW,iBAAiB;IAChC,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAqB3E;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAe,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAuBzE;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,wBAAgB,WAAW,CAAC,EAAE,KAA8B,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAMxF;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,KAAW,EAAE,EAAE,UAAU,2CAe1D"}

package/dist/chat/Header.js

@@ -11,8 +11,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { Ellipsis, PanelRight, Share2 } from '@hanzogui/lucide-icons-2';
 import { slot, tip } from '../backends/gui/slot.js';
-export function Header({ title, onOpenMenu, children }) {
-    return (_jsxs(XStack, { ...slot('chat-header'), width: "100%", height: 48, shrink: 0, items: "center", gap: "$2", px: "$3", borderBottomWidth: 1, borderColor: "$borderColor", bg: "$background", children: [_jsxs(XStack, { items: "center", gap: "$1", shrink: 1, children: [_jsx(SizableText, { size: "$2", fontWeight: "500", numberOfLines: 1, children: title }), onOpenMenu ? (_jsx(HeaderButton, { label: "Conversation options", onPress: onOpenMenu, children: _jsx(Ellipsis, { size: 16 }) })) : null] }), _jsx(XStack, { flex: 1 }), children] }));
+export function Header({ title, onOpenMenu, children, leading, ...props }) {
+    return (_jsxs(XStack, { ...slot('chat-header'), width: "100%", height: 48, shrink: 0, items: "center", gap: "$2", px: "$3", borderBottomWidth: 1, borderColor: "$borderColor", bg: "$background", ...props, children: [leading, _jsxs(XStack, { items: "center", gap: "$1", shrink: 1, children: [_jsx(SizableText, { size: "$2", fontWeight: "500", numberOfLines: 1, children: title }), onOpenMenu ? (_jsx(HeaderButton, { label: "Conversation options", onPress: onOpenMenu, children: _jsx(Ellipsis, { size: 16 }) })) : null] }), _jsx(XStack, { flex: 1 }), children] }));
 }
 export function HeaderButton({ label, onPress, children }) {
     return (_jsx(XStack, { width: 32, height: 32, items: "center", justify: "center", rounded: "$3", cursor: "pointer", opacity: 0.7, onPress: onPress, role: "button", tabIndex: 0, "aria-label": label, ...tip(label), hoverStyle: { bg: '$color4', opacity: 1 }, pressStyle: { bg: '$color5' }, children: children }));

package/dist/chat/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/chat/Header.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/chat/Header.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;GAOG;AACH,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAA;AAGvE,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAkBhD,MAAM,UAAU,MAAM,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAe;IACpF,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,aAAa,CAAC,EACvB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAE,EAAE,EACV,MAAM,EAAE,CAAC,EACT,KAAK,EAAC,QAAQ,EACd,GAAG,EAAC,IAAI,EACR,EAAE,EAAC,IAAI,EACP,iBAAiB,EAAE,CAAC,EACpB,WAAW,EAAC,cAAc,EAC1B,EAAE,EAAC,aAAa,KACZ,KAAK,aAER,OAAO,EACR,MAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,MAAM,EAAE,CAAC,aAKvC,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,aAAa,EAAE,CAAC,YACrD,KAAK,GACM,EACb,UAAU,CAAC,CAAC,CAAC,CACZ,KAAC,YAAY,IAAC,KAAK,EAAC,sBAAsB,EAAC,OAAO,EAAE,UAAU,YAC5D,KAAC,QAAQ,IAAC,IAAI,EAAE,EAAE,GAAI,GACT,CAChB,CAAC,CAAC,CAAC,IAAI,IACD,EAET,KAAC,MAAM,IAAC,IAAI,EAAE,CAAC,GAAI,EAClB,QAAQ,IACF,CACV,CAAA;AACH,CAAC;AASD,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAqB;IAC1E,OAAO,CACL,KAAC,MAAM,IACL,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAC,IAAI,EACZ,MAAM,EAAC,SAAS,EAChB,OAAO,EAAE,GAAG,EACZ,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,gBACC,KAAK,KACb,GAAG,CAAC,KAAK,CAAC,EACd,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,EACzC,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,YAE5B,QAAQ,GACF,CACV,CAAA;AACH,CAAC;AAOD;;;;;;GAMG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,EAAE,OAAO,EAAoB;IACxE,OAAO,CACL,MAAC,MAAM,OACD,IAAI,CAAC,YAAY,CAAC,EACtB,KAAK,EAAC,QAAQ,EACd,GAAG,EAAC,MAAM,EACV,EAAE,EAAC,MAAM,EACT,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,IAAI,EACZ,MAAM,EAAC,SAAS,EAChB,OAAO,EAAE,GAAG,EACZ,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,EACzC,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,aAE7B,KAAC,MAAM,IAAC,IAAI,EAAE,EAAE,GAAI,EACpB,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,KAAK,YACpC,KAAK,GACM,IACP,CACV,CAAA;AACH,CAAC;AAOD,MAAM,UAAU,WAAW,CAAC,EAAE,KAAK,GAAG,sBAAsB,EAAE,OAAO,EAAoB;IACvF,OAAO,CACL,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,YAC1C,KAAC,UAAU,IAAC,IAAI,EAAE,EAAE,GAAI,GACX,CAChB,CAAA;AACH,CAAC;AAOD;;;;;;GAMG;AACH,MAAM,UAAU,KAAK,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,GAAG,EAAc;IACzD,OAAO,CACL,KAAC,MAAM,OACD,IAAI,CAAC,YAAY,CAAC,EACtB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,CAAC,EACT,MAAM,EAAC,MAAM,EACb,CAAC,EAAC,IAAI,EACN,GAAG,EAAC,IAAI,EACR,eAAe,EAAE,CAAC,EAClB,WAAW,EAAC,cAAc,YAEzB,QAAQ,GACF,CACV,CAAA;AACH,CAAC"}

package/dist/chat/Message.cjs

@@ -43,11 +43,17 @@ const slot_1 = require("../backends/gui/slot.cjs");
 function Caret() {
     return (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('caret'), width: 2, height: 15, rounded: 1, bg: "$color12", "aria-hidden": true });
 }
-function Message({ role, children, actions, busy = false, icon }) {
+function Message({ role, children, actions, busy = false, icon, body, ...props }) {
     if (role === 'system')
-        return ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('message'), "data-role": "system", width: "100%", justify: "center", py: "$2", children: (0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$1", color: "$color10", text: "center", children: children }) }));
+        return ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('message'), "data-role": "system", width: "100%", justify: "center", py: "$2", ...props, children: (0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: "$1", color: "$color10", text: "center", children: children }) }));
     const mine = role === 'user';
-    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('message'), "data-role": role, width: "100%", justify: mine ? 'flex-end' : 'flex-start', gap: "$2", children: [icon && !mine ? (0, jsx_runtime_1.jsx)(gui_1.YStack, { pt: "$1", children: icon }) : null, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('message-body'), "data-bubble": mine ? 'true' : undefined, gap: "$2", 
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('message'), "data-role": role, width: "100%", justify: mine ? 'flex-end' : 'flex-start', gap: "$2", 
+        // The row is a hover group, so an action strip can be revealed with
+        // `$group-hover` instead of by a wrapper each surface adds itself. Both
+        // hanzo/chat and hanzo.app reveal theirs on hover and both had to supply
+        // the group. Unnamed on purpose: gui types `group` as a BOOLEAN here, so
+        // `group="turn"` type-errors rather than registering a named group.
+        group: true, ...props, children: [icon && !mine ? (0, jsx_runtime_1.jsx)(gui_1.YStack, { pt: "$1", children: icon }) : null, (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('message-body'), "data-bubble": mine ? 'true' : undefined, gap: "$2", 
                 // 85%, because that is the number three independent implementations
                 // reached: hanzo/chat's `USER_TURN` (`common/turn.ts:17`,
                 // `max-w-[85%]`), hanzo.app `/chat` (`app/chat/page.tsx:521`,
@@ -59,5 +65,5 @@ function Message({ role, children, actions, busy = false, icon }) {
                     rounded: '$5',
                     px: '$3',
                     py: '$2',
-                }), children: [(0, ink_1.ink)(children), busy ? (0, jsx_runtime_1.jsx)(Caret, {}) : null, actions ? (0, jsx_runtime_1.jsx)(gui_1.XStack, { gap: "$1", items: "center", children: actions }) : null] })] }));
+                }), ...body, children: [(0, ink_1.ink)(children), busy ? (0, jsx_runtime_1.jsx)(Caret, {}) : null, actions ? (0, jsx_runtime_1.jsx)(gui_1.XStack, { gap: "$1", items: "center", children: actions }) : null] })] }));
 }

package/dist/chat/Message.d.ts

@@ -1,5 +1,32 @@
-import type { ReactNode } from 'react';
+/**
+ * Message — one turn in a thread.
+ *
+ * Role drives presentation and nothing else: a user turn is a contained bubble
+ * that shrinks to its content, an assistant turn is full-bleed prose, a system
+ * turn is a muted aside. Content is `children`, so the surface keeps its own
+ * markdown pipeline — the surfaces disagree on remark plugins and none of that
+ * belongs in a presentational package.
+ *
+ * That arrangement is not this package's taste; it is what all six turn
+ * renderers across the estate independently arrived at. hanzo/chat states it
+ * outright in `client/src/components/Chat/Messages/ui/MessageRender.tsx:131`:
+ * "the user's turn is a glass bubble on the right, the reply plain and full
+ * width — the contrast is what says who is speaking." No avatar, no sender
+ * name, no timestamp — which is why `icon` is opt-in and there is no `name`
+ * prop. Only the read-only share view renders a name, and only one surface
+ * renders a timestamp.
+ */
+import { XStack } from '@hanzo/gui';
+import type { ComponentProps, ReactNode } from 'react';
 export type Role = 'user' | 'assistant' | 'system';
+/**
+ * What a gui stack accepts — id, className, style, the `$` style props.
+ *
+ * `role` is dropped because this component already has one and means something
+ * else by it: the ARIA role of the row is not the speaker of the turn. The row
+ * needs no ARIA role, and `aria-label` is still reachable for the name.
+ */
+type Stack = Omit<ComponentProps<typeof XStack>, 'children' | 'role'>;
 /**
  * The mark that says a turn is still arriving.
  *
@@ -16,7 +43,7 @@ export type Role = 'user' | 'assistant' | 'system';
  * noise on every token.
  */
 export declare function Caret(): import("react/jsx-runtime").JSX.Element;
-export interface MessageProps {
+export interface MessageProps extends Stack {
     role: Role;
     children?: ReactNode;
     /** Row rendered under the turn — copy, retry, feedback. */
@@ -25,6 +52,18 @@ export interface MessageProps {
     busy?: boolean;
     /** Leading affordance for an assistant turn: avatar or model mark. */
     icon?: ReactNode;
+    /**
+     * The bubble's own props — the inner box, not the row.
+     *
+     * The same reason `DialogContent` grew `overlay`: this component owns the
+     * body so a caller never has to assemble one, but owning is not hiding, and
+     * with nothing through, the fill, the corner and the width cap were
+     * unreachable from outside the package. hanzo/chat's turn is `glass hz-turn`
+     * with a `color-mix` fill it applies fleet-wide (`style.css:389`); it cannot
+     * adopt a bubble welded to `$color3`. Absent, nothing changes.
+     */
+    body?: Stack;
 }
-export declare function Message({ role, children, actions, busy, icon }: MessageProps): import("react/jsx-runtime").JSX.Element;
+export declare function Message({ role, children, actions, busy, icon, body, ...props }: MessageProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=Message.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../src/chat/Message.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,MAAM,MAAM,IAAI,GAAG,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAA;AAElD;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,KAAK,4CAEpB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,IAAI,CAAA;IACV,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,sEAAsE;IACtE,IAAI,CAAC,EAAE,SAAS,CAAA;CACjB;AAED,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAY,EAAE,IAAI,EAAE,EAAE,YAAY,2CA6CpF"}
+{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../src/chat/Message.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAQ,MAAM,EAAU,MAAM,YAAY,CAAA;AACjD,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtD,MAAM,MAAM,IAAI,GAAG,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAA;AAElD;;;;;;GAMG;AACH,KAAK,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,CAAA;AAErE;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,KAAK,4CAEpB;AAED,MAAM,WAAW,YAAa,SAAQ,KAAK;IACzC,IAAI,EAAE,IAAI,CAAA;IACV,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,sEAAsE;IACtE,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,KAAK,CAAA;CACb;AAED,wBAAgB,OAAO,CAAC,EACtB,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,IAAY,EACZ,IAAI,EACJ,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,YAAY,2CA4Dd"}

package/dist/chat/Message.js

@@ -39,11 +39,17 @@ import { slot } from '../backends/gui/slot.js';
 export function Caret() {
     return _jsx(YStack, { ...slot('caret'), width: 2, height: 15, rounded: 1, bg: "$color12", "aria-hidden": true });
 }
-export function Message({ role, children, actions, busy = false, icon }) {
+export function Message({ role, children, actions, busy = false, icon, body, ...props }) {
     if (role === 'system')
-        return (_jsx(XStack, { ...slot('message'), "data-role": "system", width: "100%", justify: "center", py: "$2", children: _jsx(Text, { fontSize: "$1", color: "$color10", text: "center", children: children }) }));
+        return (_jsx(XStack, { ...slot('message'), "data-role": "system", width: "100%", justify: "center", py: "$2", ...props, children: _jsx(Text, { fontSize: "$1", color: "$color10", text: "center", children: children }) }));
     const mine = role === 'user';
-    return (_jsxs(XStack, { ...slot('message'), "data-role": role, width: "100%", justify: mine ? 'flex-end' : 'flex-start', gap: "$2", children: [icon && !mine ? _jsx(YStack, { pt: "$1", children: icon }) : null, _jsxs(YStack, { ...slot('message-body'), "data-bubble": mine ? 'true' : undefined, gap: "$2", 
+    return (_jsxs(XStack, { ...slot('message'), "data-role": role, width: "100%", justify: mine ? 'flex-end' : 'flex-start', gap: "$2", 
+        // The row is a hover group, so an action strip can be revealed with
+        // `$group-hover` instead of by a wrapper each surface adds itself. Both
+        // hanzo/chat and hanzo.app reveal theirs on hover and both had to supply
+        // the group. Unnamed on purpose: gui types `group` as a BOOLEAN here, so
+        // `group="turn"` type-errors rather than registering a named group.
+        group: true, ...props, children: [icon && !mine ? _jsx(YStack, { pt: "$1", children: icon }) : null, _jsxs(YStack, { ...slot('message-body'), "data-bubble": mine ? 'true' : undefined, gap: "$2", 
                 // 85%, because that is the number three independent implementations
                 // reached: hanzo/chat's `USER_TURN` (`common/turn.ts:17`,
                 // `max-w-[85%]`), hanzo.app `/chat` (`app/chat/page.tsx:521`,
@@ -55,6 +61,6 @@ export function Message({ role, children, actions, busy = false, icon }) {
                     rounded: '$5',
                     px: '$3',
                     py: '$2',
-                }), children: [ink(children), busy ? _jsx(Caret, {}) : null, actions ? _jsx(XStack, { gap: "$1", items: "center", children: actions }) : null] })] }));
+                }), ...body, children: [ink(children), busy ? _jsx(Caret, {}) : null, actions ? _jsx(XStack, { gap: "$1", items: "center", children: actions }) : null] })] }));
 }
 //# sourceMappingURL=Message.js.map