@hanzo/ui 8.1.2 → 8.1.4

package/dist/backends/gui/textarea.cjs

@@ -43,15 +43,47 @@ const slot_1 = require("./slot.cjs");
 /** Floor for the grown row count. */
 const MIN_ROWS = 3;
 const rowsOf = (v) => typeof v === "string" ? v.split("\n").length : 0;
-const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, value, defaultValue, ...props }, ref) {
+const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, value, defaultValue, style, ...props }, ref) {
     const [typed, setTyped] = React.useState(() => rowsOf(defaultValue));
     const uncontrolled = value === undefined;
     const invalid = props["aria-invalid"];
-    return ((0, jsx_runtime_1.jsx)(gui_1.TextArea, { ref: ref, ...(0, slot_1.slot)("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...control_1.FIELD, width: "100%", minH: 64, 
+    const node = React.useRef(null);
+    const [grown, setGrown] = React.useState(undefined);
+    // Both refs reach the same host: ours to measure it, the caller's because a
+    // caller that hands one over must still get it. Written as a callback so
+    // neither is dropped on the other's behalf.
+    const hold = React.useCallback((el) => {
+        node.current = el;
+        if (typeof ref === "function")
+            ref(el);
+        else if (ref)
+            ref.current = el;
+    }, [ref]);
+    // The value the field is actually showing — a controlled field is told, an
+    // uncontrolled one has to be watched, and both have to re-measure.
+    const shown = uncontrolled ? typed : value;
+    React.useLayoutEffect(() => {
+        const el = node.current;
+        if (!el || typeof el.scrollHeight !== "number")
+            return;
+        // Released to `auto` first, or `scrollHeight` reports the height it already
+        // has and the field can only ever grow. Restored in the same synchronous
+        // block, before paint, so nothing flashes.
+        const held = el.style.height;
+        el.style.height = "auto";
+        const measured = el.scrollHeight;
+        el.style.height = held;
+        setGrown((h) => (h === measured ? h : measured));
+    }, [shown]);
+    return ((0, jsx_runtime_1.jsx)(gui_1.TextArea, { ref: hold, ...(0, slot_1.slot)("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...control_1.FIELD, width: "100%", minH: 64, 
         // The gutter has to be NAMED. Left unsaid it came from gui's
         // `textAreaSizeVariant`, which computes its own horizontal padding and
         // landed on 20 — so the one field a form makes tall was also the one
         // indented differently from the two above it.
-        borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
+        borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props, 
+        // After the caller's props: the measurement is this component's answer to
+        // its own question, and a caller's `style` should not silently turn the
+        // growth off. A caller wanting a fixed height says so with `height`.
+        style: { ...style, ...(grown ? { height: grown } : null) } }));
 });
 exports.Textarea = Textarea;

package/dist/backends/gui/textarea.d.ts

@@ -1,12 +1,41 @@
 import * as React from "react";
 import { TextArea } from "@hanzo/gui";
 /**
- * Textarea — standard-token multiline field.
+ * Textarea — standard-token multiline field that grows with what is in it.
  *
- * Auto-grow is line-driven rather than DOM-measured, so web, native and desktop
- * grow identically: the row count follows the value and gui's
- * `textAreaSizeVariant` turns rows into height.
- * `rows` is the floor, not a fixed size.
+ * Growth used to be LINE-DRIVEN — `rows` from `value.split('\n').length` — on
+ * the stated grounds that counting newlines is the one measurement web, native
+ * and desktop agree on. It counts the wrong thing. A draft that wraps without
+ * ever containing a newline never raises the count, so the most ordinary input
+ * there is, one long paragraph, scrolls inside the floor while you type.
+ * Measured in Chromium at 420px wide: 700 characters and no `\n` gave
+ * `clientHeight 44` around `scrollHeight 160`.
+ *
+ * The fix is to measure the content. Two things that look like the measurement
+ * are not available here, and both were tried:
+ *
+ *   `onContentSizeChange` is the RN API for exactly this, and
+ *   react-native-web implements it by reading `scrollHeight`
+ *   (`dist/exports/TextInput/index.js:192`). It never fires through this
+ *   component — measured, zero calls, no warning. gui's `TextArea` is
+ *   `styled(Input, { render: 'textarea' })` from `@hanzogui/web`: a Tamagui
+ *   styled component over a real DOM `<textarea>`, so RNW's `TextInput` is not
+ *   on the path and neither is its implementation of that prop.
+ *
+ *   A `height` STYLE PROP would be compiled by gui into one atomic class per
+ *   distinct pixel value, so a field that grows through forty heights mints
+ *   forty rules at runtime — none of them in the packaged sheet.
+ *
+ * So the height is measured off the node and applied INLINE, which is the one
+ * channel that carries a per-render value without going through the atomic
+ * compiler. `rows` stays the floor and `maxH` stays the ceiling; CSS clamps
+ * between them and the field scrolls past the ceiling, so neither bound is
+ * re-implemented in script.
+ *
+ * The measurement is guarded on `scrollHeight` actually being a number, so on a
+ * target where the host is not a DOM element the effect no-ops and the
+ * line-driven floor is what remains — today's behaviour, unchanged, rather than
+ * a broken one.
  */
 /**
  * Typed from the gui component it renders, exactly as `Input` is — the field

package/dist/backends/gui/textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAUrC;;;;;;;GAOG;AACH;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,UAAU,CAAC,GACjF,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;AAE9D,QAAA,MAAM,QAAQ,wGA4Bb,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAUrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,UAAU,CAAC,GACjF,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;AAE9D,QAAA,MAAM,QAAQ,wGAiEb,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/backends/gui/textarea.js

@@ -7,16 +7,48 @@ import { slot } from "./slot.js";
 /** Floor for the grown row count. */
 const MIN_ROWS = 3;
 const rowsOf = (v) => typeof v === "string" ? v.split("\n").length : 0;
-const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, value, defaultValue, ...props }, ref) {
+const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, value, defaultValue, style, ...props }, ref) {
     const [typed, setTyped] = React.useState(() => rowsOf(defaultValue));
     const uncontrolled = value === undefined;
     const invalid = props["aria-invalid"];
-    return (_jsx(TextArea, { ref: ref, ...slot("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...FIELD, width: "100%", minH: 64, 
+    const node = React.useRef(null);
+    const [grown, setGrown] = React.useState(undefined);
+    // Both refs reach the same host: ours to measure it, the caller's because a
+    // caller that hands one over must still get it. Written as a callback so
+    // neither is dropped on the other's behalf.
+    const hold = React.useCallback((el) => {
+        node.current = el;
+        if (typeof ref === "function")
+            ref(el);
+        else if (ref)
+            ref.current = el;
+    }, [ref]);
+    // The value the field is actually showing — a controlled field is told, an
+    // uncontrolled one has to be watched, and both have to re-measure.
+    const shown = uncontrolled ? typed : value;
+    React.useLayoutEffect(() => {
+        const el = node.current;
+        if (!el || typeof el.scrollHeight !== "number")
+            return;
+        // Released to `auto` first, or `scrollHeight` reports the height it already
+        // has and the field can only ever grow. Restored in the same synchronous
+        // block, before paint, so nothing flashes.
+        const held = el.style.height;
+        el.style.height = "auto";
+        const measured = el.scrollHeight;
+        el.style.height = held;
+        setGrown((h) => (h === measured ? h : measured));
+    }, [shown]);
+    return (_jsx(TextArea, { ref: hold, ...slot("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...FIELD, width: "100%", minH: 64, 
         // The gutter has to be NAMED. Left unsaid it came from gui's
         // `textAreaSizeVariant`, which computes its own horizontal padding and
         // landed on 20 — so the one field a form makes tall was also the one
         // indented differently from the two above it.
-        borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
+        borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props, 
+        // After the caller's props: the measurement is this component's answer to
+        // its own question, and a caller's `style` should not silently turn the
+        // growth off. A caller wanting a fixed height says so with `height`.
+        style: { ...style, ...(grown ? { height: grown } : null) } }));
 });
 export { Textarea };
 //# sourceMappingURL=textarea.js.map

package/dist/backends/gui/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,qCAAqC;AACrC,MAAM,QAAQ,GAAG,CAAC,CAAA;AAElB,MAAM,MAAM,GAAG,CAAC,CAAU,EAAE,EAAE,CAC5B,OAAO,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;AAkBlD,MAAM,QAAQ,GAAG,eAAe,CAAC,KAAK,CAAC,UAAU,CAC/C,SAAS,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IAC9D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAA;IACpE,MAAM,YAAY,GAAG,KAAK,KAAK,SAAS,CAAA;IACxC,MAAM,OAAO,GAAG,KAAK,CAAC,cAAc,CAAC,CAAA;IACrC,OAAO,CACL,KAAC,QAAQ,IACP,GAAG,EAAE,GAAY,KACb,IAAI,CAAC,UAAU,CAAC,EACpB,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,QAAQ,EAAE,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACtE,KAAK,EAAE,KAA2B,EAClC,YAAY,EAAE,YAAkC,EAChD,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,CAAM,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,KACpE,KAAK,EACT,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,EAAE;QACR,6DAA6D;QAC7D,uEAAuE;QACvE,qEAAqE;QACrE,8CAA8C;QAC9C,WAAW,EAAE,OAAO,IAAI,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,cAAc,EACtE,oBAAoB,EAAC,UAAU,EAC/B,QAAQ,EAAC,IAAI,EACb,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAC5B,KAAiC,GACtC,CACH,CAAA;AACD,CAAC,CACF,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"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"}

package/dist/chat/Composer.cjs

@@ -15,6 +15,26 @@ const jsx_runtime_1 = require("react/jsx-runtime");
  * 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 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.
  */
 const gui_1 = require("@hanzo/gui");
 const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
@@ -23,6 +43,35 @@ const slot_1 = require("../backends/gui/slot.cjs");
 const send_1 = require("./send.cjs");
 const PAD = 8;
 const MIN_ROWS = 1;
+/**
+ * How tall the field may grow before it scrolls, px.
+ *
+ * 200 is the number three independent composers reached — hanzo.app `/chat`
+ * (`page.tsx:184`, `Math.min(el.scrollHeight, 200)`), hanzo/chat's
+ * `AnswerComposer.tsx:134`, and the extension's `answer/Composer.tsx:81`
+ * (`maxH={200}`). The two that differ are both fitting a NARROWER frame — the
+ * extension's in-page overlay caps at 110 (`content-script.ts:1340`) and its
+ * sidebar at 120 — and the one that differs upward, chat's main composer at
+ * `max-h-[45vh]`, is the full-page surface. So 200 is the default and the
+ * ceiling is a prop.
+ *
+ * Uncapped is not an option: the field would grow with the draft until a long
+ * paste owned the viewport and pushed the thread it belongs to off screen.
+ * Nothing capped it here before.
+ */
+const CEILING = 200;
+/**
+ * Floor for the field, px.
+ *
+ * `Textarea` is a form control and stands 64px tall by default, which is right
+ * for a message body in a form and wrong for a composer: it is three lines of
+ * chrome before anything is typed. Every surface sets its own — 44 in chat
+ * (`ChatForm.tsx:334`) and in the app builder (`COMPOSER_MIN_H`), 48 in the app
+ * `/chat`. 44 is both the mode and this package's touch-target floor, so the
+ * one-line composer is exactly as tall as the smallest thing you are allowed to
+ * tap.
+ */
+const FLOOR = 44;
 /**
  * The resting placeholder.
  *
@@ -32,7 +81,7 @@ const MIN_ROWS = 1;
  * 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, children, hint, }) {
+function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = exports.ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, }) {
     const sendable = (0, send_1.ready)(value, busy, disabled);
     const keyed = (e) => {
         const key = e.key ?? e.nativeEvent?.key ?? '';
@@ -52,5 +101,5 @@ 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, "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, 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 }) })] })] }));
 }

package/dist/chat/Composer.d.ts

@@ -21,10 +21,12 @@ export interface ComposerProps {
     placeholder?: string;
     /** Row floor for the field. It grows with the draft from here. */
     rows?: number;
+    /** Ceiling for that growth, px. Past it the field scrolls instead. */
+    maxHeight?: number;
     /** Toolbar slot, rendered at the start of the footer row. */
     children?: ReactNode;
     /** Hint shown at the end of the footer row. */
     hint?: string;
 }
-export declare function Composer({ value, onChange, onSend, onStop, busy, disabled, placeholder, rows, children, hint, }: ComposerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Composer({ value, onChange, onSend, onStop, busy, disabled, placeholder, rows, maxHeight, children, hint, }: ComposerProps): import("react/jsx-runtime").JSX.Element;
 //# 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":"AAgBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAStC;;;;;;;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,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,QAAQ,EACR,IAAI,GACL,EAAE,aAAa,2CA8Df"}
+{"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"}

package/dist/chat/Composer.js

@@ -11,6 +11,26 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * 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 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.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { ArrowUp, Square } from '@hanzogui/lucide-icons-2';
@@ -19,6 +39,35 @@ import { slot } from '../backends/gui/slot.js';
 import { ready, sends } from './send.js';
 const PAD = 8;
 const MIN_ROWS = 1;
+/**
+ * How tall the field may grow before it scrolls, px.
+ *
+ * 200 is the number three independent composers reached — hanzo.app `/chat`
+ * (`page.tsx:184`, `Math.min(el.scrollHeight, 200)`), hanzo/chat's
+ * `AnswerComposer.tsx:134`, and the extension's `answer/Composer.tsx:81`
+ * (`maxH={200}`). The two that differ are both fitting a NARROWER frame — the
+ * extension's in-page overlay caps at 110 (`content-script.ts:1340`) and its
+ * sidebar at 120 — and the one that differs upward, chat's main composer at
+ * `max-h-[45vh]`, is the full-page surface. So 200 is the default and the
+ * ceiling is a prop.
+ *
+ * Uncapped is not an option: the field would grow with the draft until a long
+ * paste owned the viewport and pushed the thread it belongs to off screen.
+ * Nothing capped it here before.
+ */
+const CEILING = 200;
+/**
+ * Floor for the field, px.
+ *
+ * `Textarea` is a form control and stands 64px tall by default, which is right
+ * for a message body in a form and wrong for a composer: it is three lines of
+ * chrome before anything is typed. Every surface sets its own — 44 in chat
+ * (`ChatForm.tsx:334`) and in the app builder (`COMPOSER_MIN_H`), 48 in the app
+ * `/chat`. 44 is both the mode and this package's touch-target floor, so the
+ * one-line composer is exactly as tall as the smallest thing you are allowed to
+ * tap.
+ */
+const FLOOR = 44;
 /**
  * The resting placeholder.
  *
@@ -28,7 +77,7 @@ const MIN_ROWS = 1;
  * 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, children, hint, }) {
+export function Composer({ value, onChange, onSend, onStop, busy = false, disabled = false, placeholder = ASK, rows = MIN_ROWS, maxHeight = CEILING, children, hint, }) {
     const sendable = ready(value, busy, disabled);
     const keyed = (e) => {
         const key = e.key ?? e.nativeEvent?.key ?? '';
@@ -48,6 +97,6 @@ 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, "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, 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 }) })] })] }));
 }
 //# 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/styles.css

@@ -2439,6 +2439,7 @@
 :root ._ls-f-letterSpa1360334205{letter-spacing:var(--f-letterSpacing-1);}
 :root ._maxH-0px{max-height:0px;}
 :root ._maxH-16px{max-height:16px;}
+:root ._maxH-200px{max-height:200px;}
 :root ._maxH-300px{max-height:300px;}
 :root ._maxH-32px{max-height:32px;}
 :root ._maxH-c-size-1{max-height:var(--c-size-1);}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.1.2",
+  "version": "8.1.4",
   "type": "module",
   "description": "Hanzo UI — the one canonical Hanzo component library, on @hanzo/gui + @hanzo/design. ONE substrate: every component renders through @hanzo/gui primitives, so the same import works on web, native (expo) and desktop (Tauri). Self-contained (theme.css), presentational, host-agnostic, clean-room.",
   "exports": {