@wrongstack/tui 0.3.3 → 0.3.4

package/dist/index.js

@@ -256,81 +256,6 @@ function FleetPanel({ entries, totalCost, roster }) {
     }
   );
 }
-function fmtElapsed(ms) {
-  if (ms < 1e3) return `${ms}ms`;
-  if (ms < 6e4) return `${(ms / 1e3).toFixed(1)}s`;
-  const m = Math.floor(ms / 6e4);
-  const s = Math.floor(ms % 6e4 / 1e3);
-  return `${m}m${s.toString().padStart(2, "0")}s`;
-}
-function fmtBytes2(n) {
-  if (n < 1024) return `${n}B`;
-  return `${(n / 1024).toFixed(1)}KB`;
-}
-function fmtRecentTool2(tool) {
-  const status = tool.ok === false ? "fail" : "ok";
-  const name = tool.name.length > 18 ? `${tool.name.slice(0, 17)}...` : tool.name;
-  const parts = [status, name];
-  if (typeof tool.durationMs === "number") parts.push(fmtElapsed(tool.durationMs));
-  if (typeof tool.outputBytes === "number" && tool.outputBytes > 0) parts.push(fmtBytes2(tool.outputBytes));
-  if (typeof tool.outputLines === "number" && tool.outputLines > 0) parts.push(`${tool.outputLines}L`);
-  return parts.join(" ");
-}
-function fmtRecentMessage2(message) {
-  const text = message.text.replace(/\s+/g, " ");
-  return text.length > 48 ? `${text.slice(0, 47)}...` : text;
-}
-function LiveActivityStrip({
-  entries,
-  nowTick,
-  maxRows = 4
-}) {
-  const running = Object.values(entries).filter((e) => e.status === "running").sort((a, b) => a.startedAt - b.startedAt).slice(0, maxRows);
-  if (running.length === 0) return null;
-  const now = Date.now();
-  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 1, children: [
-    running.map((e) => {
-      const toolElapsed = e.currentTool ? now - e.currentTool.startedAt : 0;
-      const taskElapsed = now - e.startedAt;
-      const toolSeg = e.currentTool ? `\u2192 ${e.currentTool.name} (${fmtElapsed(toolElapsed)})` : "idle between tools";
-      const recentTools = (e.recentTools ?? []).slice(-2).map(fmtRecentTool2).join(" | ");
-      const messageText = e.streamingText.trim() || (e.recentMessages ?? []).slice(-1).map(fmtRecentMessage2).join("");
-      return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", gap: 1, children: [
-        /* @__PURE__ */ jsx(Text, { color: "cyan", children: "\u25CF" }),
-        /* @__PURE__ */ jsx(Text, { children: e.name.slice(0, 14).padEnd(14) }),
-        /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\xB7" }),
-        /* @__PURE__ */ jsx(Text, { color: e.currentTool ? "green" : "yellow", children: toolSeg }),
-        /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\xB7" }),
-        /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
-          e.iterations,
-          "it ",
-          e.toolCalls,
-          "tc \xB7 ",
-          fmtElapsed(taskElapsed)
-        ] }),
-        recentTools ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "|" }),
-          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
-            "last: ",
-            recentTools
-          ] })
-        ] }) : null,
-        messageText ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "|" }),
-          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
-            "msg: ",
-            fmtRecentMessage2({ text: messageText})
-          ] })
-        ] }) : null
-      ] }, e.id);
-    }),
-    Object.values(entries).filter((e) => e.status === "running").length > maxRows ? /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
-      "\u2026+",
-      Object.values(entries).filter((e) => e.status === "running").length - maxRows,
-      " more"
-    ] }) }) : null
-  ] });
-}
 
 // src/markdown-table.ts
 function renderMarkdownTables(text, maxWidth) {
@@ -641,7 +566,7 @@ function Entry({
           parts.push(`${entry.outputLines} L`);
         }
         if (entry.outputBytes && entry.outputBytes > 0) {
-          parts.push(fmtBytes3(entry.outputBytes));
+          parts.push(fmtBytes2(entry.outputBytes));
         }
         if (entry.outputTokens && entry.outputTokens > 0) {
           parts.push(`\u2248${fmtTok(entry.outputTokens)} tok`);
@@ -925,7 +850,7 @@ function formatToolOutput(toolName, output, ok, _outputBytes, outputLines) {
       const bytes = numOf(o["bytes_written"]) ?? numOf(o["bytes"]);
       const created = o["created"] === true;
       const tag = created ? "created" : "updated";
-      if (bytes !== void 0) return [`${tag} \xB7 ${fmtBytes3(bytes)}`];
+      if (bytes !== void 0) return [`${tag} \xB7 ${fmtBytes2(bytes)}`];
       return [tag];
     }
   }
@@ -990,17 +915,17 @@ function formatToolOutput(toolName, output, ok, _outputBytes, outputLines) {
     if (json && typeof json === "object") {
       const o = json;
       const bytes = numOf(o["bytes"]);
-      if (bytes !== void 0) return [`${fmtBytes3(bytes)} read`];
+      if (bytes !== void 0) return [`${fmtBytes2(bytes)} read`];
     }
     const range = scanNumberedRange(text);
     if (range.count > 0 && range.first !== void 0 && range.last !== void 0) {
       if (range.first === range.last) {
-        return [`L${range.first} \xB7 ${fmtBytes3(text.length)}`];
+        return [`L${range.first} \xB7 ${fmtBytes2(text.length)}`];
       }
       const contiguous = range.count === range.last - range.first + 1;
       const head = `L${range.first}\u2013${range.last}`;
       const tail = contiguous ? `${range.count} line${range.count === 1 ? "" : "s"}` : `${range.count} lines (gaps)`;
-      return [`${head} \xB7 ${tail} \xB7 ${fmtBytes3(text.length)}`];
+      return [`${head} \xB7 ${tail} \xB7 ${fmtBytes2(text.length)}`];
     }
   }
   if (toolName === "grep" || toolName === "glob") {
@@ -1058,7 +983,7 @@ function formatToolOutput(toolName, output, ok, _outputBytes, outputLines) {
       const head = [];
       if (status !== void 0) head.push(`HTTP ${status}`);
       if (ct) head.push(ct.split(";")[0] ?? ct);
-      if (content) head.push(fmtBytes3(Buffer.byteLength(content, "utf8")));
+      if (content) head.push(fmtBytes2(Buffer.byteLength(content, "utf8")));
       const lines = [];
       if (head.length > 0) lines.push(head.join(" \xB7 "));
       if (url && status !== void 0 && (status < 200 || status >= 400)) {
@@ -1434,7 +1359,7 @@ function countLines(text) {
   if (!text) return 0;
   return text.replace(/\n$/, "").split("\n").length;
 }
-function fmtBytes3(n) {
+function fmtBytes2(n) {
   if (n < 1024) return `${n}B`;
   if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)}KB`;
   return `${(n / (1024 * 1024)).toFixed(1)}MB`;
@@ -1515,6 +1440,81 @@ function Input({
     hint ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: hint }) : null
   ] });
 }
+function fmtElapsed(ms) {
+  if (ms < 1e3) return `${ms}ms`;
+  if (ms < 6e4) return `${(ms / 1e3).toFixed(1)}s`;
+  const m = Math.floor(ms / 6e4);
+  const s = Math.floor(ms % 6e4 / 1e3);
+  return `${m}m${s.toString().padStart(2, "0")}s`;
+}
+function fmtBytes3(n) {
+  if (n < 1024) return `${n}B`;
+  return `${(n / 1024).toFixed(1)}KB`;
+}
+function fmtRecentTool2(tool) {
+  const status = tool.ok === false ? "fail" : "ok";
+  const name = tool.name.length > 18 ? `${tool.name.slice(0, 17)}...` : tool.name;
+  const parts = [status, name];
+  if (typeof tool.durationMs === "number") parts.push(fmtElapsed(tool.durationMs));
+  if (typeof tool.outputBytes === "number" && tool.outputBytes > 0) parts.push(fmtBytes3(tool.outputBytes));
+  if (typeof tool.outputLines === "number" && tool.outputLines > 0) parts.push(`${tool.outputLines}L`);
+  return parts.join(" ");
+}
+function fmtRecentMessage2(message) {
+  const text = message.text.replace(/\s+/g, " ");
+  return text.length > 48 ? `${text.slice(0, 47)}...` : text;
+}
+function LiveActivityStrip({
+  entries,
+  nowTick,
+  maxRows = 4
+}) {
+  const running = Object.values(entries).filter((e) => e.status === "running").sort((a, b) => a.startedAt - b.startedAt).slice(0, maxRows);
+  if (running.length === 0) return null;
+  const now = Date.now();
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 1, children: [
+    running.map((e) => {
+      const toolElapsed = e.currentTool ? now - e.currentTool.startedAt : 0;
+      const taskElapsed = now - e.startedAt;
+      const toolSeg = e.currentTool ? `\u2192 ${e.currentTool.name} (${fmtElapsed(toolElapsed)})` : "idle between tools";
+      const recentTools = (e.recentTools ?? []).slice(-2).map(fmtRecentTool2).join(" | ");
+      const messageText = e.streamingText.trim() || (e.recentMessages ?? []).slice(-1).map(fmtRecentMessage2).join("");
+      return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", gap: 1, children: [
+        /* @__PURE__ */ jsx(Text, { color: "cyan", children: "\u25CF" }),
+        /* @__PURE__ */ jsx(Text, { children: e.name.slice(0, 14).padEnd(14) }),
+        /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\xB7" }),
+        /* @__PURE__ */ jsx(Text, { color: e.currentTool ? "green" : "yellow", children: toolSeg }),
+        /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\xB7" }),
+        /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+          e.iterations,
+          "it ",
+          e.toolCalls,
+          "tc \xB7 ",
+          fmtElapsed(taskElapsed)
+        ] }),
+        recentTools ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "|" }),
+          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            "last: ",
+            recentTools
+          ] })
+        ] }) : null,
+        messageText ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "|" }),
+          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            "msg: ",
+            fmtRecentMessage2({ text: messageText})
+          ] })
+        ] }) : null
+      ] }, e.id);
+    }),
+    Object.values(entries).filter((e) => e.status === "running").length > maxRows ? /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+      "\u2026+",
+      Object.values(entries).filter((e) => e.status === "running").length - maxRows,
+      " more"
+    ] }) }) : null
+  ] });
+}
 function ModelPicker({
   step,
   providerOptions,
@@ -1526,7 +1526,7 @@ function ModelPicker({
   if (step === "provider") {
     return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 1, children: [
       /* @__PURE__ */ jsx(Text, { color: "cyan", bold: true, children: "\u2501\u2501 Switch model \u2014 Step 1/2: Pick provider \u2501\u2501" }),
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2191/\u2193 navigate \xB7 Enter select \xB7 Esc cancel" }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2191/\u2193 navigate \xB7 Enter select \xB7 Esc cancel \xB7 Ctrl+C exit" }),
       providerOptions.length === 0 ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: "(no providers with keys \u2014 add one via `wstack auth`)" }) : providerOptions.map((p, i) => /* @__PURE__ */ jsxs(Text, { color: i === selected ? "cyan" : void 0, inverse: i === selected, children: [
         i === selected ? "\u203A " : "  ",
         /* @__PURE__ */ jsx(Text, { bold: true, children: p.id.padEnd(28) }),
@@ -1551,7 +1551,7 @@ function ModelPicker({
       pickedProviderId,
       ") \u2501\u2501"
     ] }),
-    /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2191/\u2193 navigate \xB7 Enter select \xB7 Esc back \xB7 Ctrl-C cancel" }),
+    /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2191/\u2193 navigate \xB7 Enter select \xB7 Esc back \xB7 Ctrl+C exit" }),
     modelOptions.length === 0 ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: "(no models known for this provider)" }) : modelOptions.map((id, i) => /* @__PURE__ */ jsxs(Text, { color: i === selected ? "cyan" : void 0, inverse: i === selected, children: [
       i === selected ? "\u203A " : "  ",
       id
@@ -2050,6 +2050,11 @@ function oneLine(s, max) {
   const collapsed = s.replace(/\s+/g, " ").trim();
   return collapsed.length <= max ? collapsed : `${collapsed.slice(0, max - 1)}\u2026`;
 }
+function selectedSlashCommandLine(picker) {
+  if (!picker.open || picker.matches.length === 0) return null;
+  const picked = picker.matches[picker.selected];
+  return picked ? `/${picked.name}` : null;
+}
 function reducer(state, action) {
   switch (action.type) {
     case "addEntry": {
@@ -2066,6 +2071,7 @@ function reducer(state, action) {
         buffer: "",
         cursor: 0,
         placeholders: [],
+        historyIndex: 0,
         picker: { open: false, query: "", matches: [], selected: 0 },
         slashPicker: { open: false, query: "", matches: [], selected: 0 }
       };
@@ -2649,6 +2655,16 @@ function App({
   const flushTimerRef = useRef(null);
   const stateRef = useRef(state);
   stateRef.current = state;
+  const draftRef = useRef({ buffer: state.buffer, cursor: state.cursor });
+  draftRef.current = { buffer: state.buffer, cursor: state.cursor };
+  const setDraft = (buffer, cursor) => {
+    draftRef.current = { buffer, cursor };
+    dispatch({ type: "setBuffer", buffer, cursor });
+  };
+  const clearDraft = () => {
+    draftRef.current = { buffer: "", cursor: 0 };
+    dispatch({ type: "clearInput" });
+  };
   const startedAtRef = useRef(Date.now());
   const [nowTick, setNowTick] = React.useState(Date.now());
   useEffect(() => {
@@ -2838,7 +2854,7 @@ function App({
     }).slice(0, 12).map(({ cmd, owner }) => ({
       name: cmd.name,
       description: cmd.description,
-      argsHint: void 0,
+      argsHint: cmd.argsHint,
       isBuiltin: owner === "core"
     }));
     if (!state.slashPicker.open) {
@@ -2879,7 +2895,8 @@ function App({
     if (!picked) return;
     const builder = builderRef.current;
     if (!builder) return;
-    const tok = detectAtToken(state.buffer, state.cursor);
+    const draft = draftRef.current;
+    const tok = detectAtToken(draft.buffer, draft.cursor);
     if (!tok) {
       dispatch({ type: "pickerClose" });
       return;
@@ -2892,14 +2909,10 @@ function App({
         data,
         meta: { filename: picked, label: picked }
       });
-      const before = state.buffer.slice(0, tok.start);
-      const after = state.buffer.slice(tok.end);
+      const before = draft.buffer.slice(0, tok.start);
+      const after = draft.buffer.slice(tok.end);
       const next = `${before}${placeholder}${after}`;
-      dispatch({
-        type: "setBuffer",
-        buffer: next,
-        cursor: tok.start + placeholder.length
-      });
+      setDraft(next, tok.start + placeholder.length);
       dispatch({ type: "pickerClose" });
     } catch (err) {
       dispatch({
@@ -2918,7 +2931,7 @@ function App({
     const picked = matches[selected];
     if (!picked) return;
     const cmd = picked.argsHint !== void 0 ? `/${picked.name} ` : `/${picked.name}`;
-    dispatch({ type: "setBuffer", buffer: cmd, cursor: cmd.length });
+    setDraft(cmd, cmd.length);
     dispatch({ type: "slashPickerClose" });
   };
   useEffect(() => {
@@ -3461,8 +3474,9 @@ function App({
   }, [director]);
   useEffect(() => {
     const onSigint = () => {
-      if (state.interrupts >= 1) {
-        if (state.interrupts >= 2) {
+      const current = stateRef.current;
+      if (current.interrupts >= 1) {
+        if (current.interrupts >= 2) {
           process.exit(130);
         }
         try {
@@ -3480,6 +3494,22 @@ function App({
         return;
       }
       dispatch({ type: "interrupt" });
+      if (current.modelPicker.open) {
+        dispatch({ type: "modelPickerClose" });
+        dispatch({
+          type: "addEntry",
+          entry: { kind: "warn", text: "Model picker cancelled." }
+        });
+        return;
+      }
+      if (current.slashPicker.open) {
+        dispatch({ type: "slashPickerClose" });
+        dispatch({
+          type: "addEntry",
+          entry: { kind: "warn", text: "Cancelled." }
+        });
+        return;
+      }
       if (activeCtrlRef.current) {
         activeCtrlRef.current.abort();
         dispatch({ type: "status", status: "aborting" });
@@ -3520,7 +3550,7 @@ function App({
     return () => {
       process.off("SIGINT", onSigint);
     };
-  }, [state.interrupts, exit, onExit, director]);
+  }, [exit, onExit, director]);
   const handleKey = async (input, key) => {
     if (state.status === "aborting") return;
     if (inputGateRef.current) return;
@@ -3591,15 +3621,23 @@ function App({
         return;
       }
       if (isEnter) {
+        const now = Date.now();
+        if (now - lastEnterAtRef.current < 50) return;
+        lastEnterAtRef.current = now;
         inputGateRef.current = true;
-        acceptSlashPickerSelection();
+        const line = selectedSlashCommandLine(state.slashPicker);
+        if (line) {
+          void submit(line);
+        } else {
+          acceptSlashPickerSelection();
+        }
         inputGateRef.current = false;
         return;
       }
       if (key.tab && state.slashPicker.matches.length > 0) {
         const sel = state.slashPicker.matches[state.slashPicker.selected];
         if (sel) {
-          dispatch({ type: "setBuffer", buffer: `/${sel.name} `, cursor: sel.name.length + 2 });
+          setDraft(`/${sel.name} `, sel.name.length + 2);
           dispatch({ type: "slashPickerClose" });
         }
         return;
@@ -3675,64 +3713,60 @@ function App({
       void submit();
       return;
     }
+    const { buffer, cursor } = draftRef.current;
     if (key.backspace || key.delete) {
       if (key.ctrl) {
-        const { cursor, buffer } = state;
         if (key.backspace) {
           if (cursor === 0) return;
           const beforeCursor = buffer.slice(0, cursor);
           const lastWordStart = beforeCursor.lastIndexOf(" ") + 1;
           const next3 = buffer.slice(0, lastWordStart) + buffer.slice(cursor);
-          dispatch({ type: "setBuffer", buffer: next3, cursor: lastWordStart });
+          setDraft(next3, lastWordStart);
         } else {
           if (cursor >= buffer.length) return;
           const afterCursor = buffer.slice(cursor);
           const nextWordStart = afterCursor.indexOf(" ");
           const end = nextWordStart === -1 ? buffer.length : cursor + nextWordStart + 1;
           const next3 = buffer.slice(0, cursor) + buffer.slice(end);
-          dispatch({ type: "setBuffer", buffer: next3, cursor });
+          setDraft(next3, cursor);
         }
         return;
       }
-      if (state.cursor === 0) return;
-      const next2 = state.buffer.slice(0, state.cursor - 1) + state.buffer.slice(state.cursor);
-      dispatch({ type: "setBuffer", buffer: next2, cursor: state.cursor - 1 });
+      if (cursor === 0) return;
+      const next2 = buffer.slice(0, cursor - 1) + buffer.slice(cursor);
+      setDraft(next2, cursor - 1);
       return;
     }
     if (key.leftArrow) {
       if (key.ctrl) {
-        const { cursor, buffer } = state;
         if (cursor === 0) return;
         const beforeCursor = buffer.slice(0, cursor);
         const prevWordStart = beforeCursor.lastIndexOf(" ");
         const target = prevWordStart === -1 ? 0 : prevWordStart + 1;
-        dispatch({ type: "setBuffer", buffer, cursor: target });
+        setDraft(buffer, target);
         return;
       }
-      if (state.cursor > 0)
-        dispatch({ type: "setBuffer", buffer: state.buffer, cursor: state.cursor - 1 });
+      if (cursor > 0) setDraft(buffer, cursor - 1);
       return;
     }
     if (key.rightArrow) {
       if (key.ctrl) {
-        const { cursor, buffer } = state;
         if (cursor >= buffer.length) return;
         const afterCursor = buffer.slice(cursor);
         const nextWordStart = afterCursor.indexOf(" ");
         const target = nextWordStart === -1 ? buffer.length : cursor + nextWordStart + 1;
-        dispatch({ type: "setBuffer", buffer, cursor: target });
+        setDraft(buffer, target);
         return;
       }
-      if (state.cursor < state.buffer.length)
-        dispatch({ type: "setBuffer", buffer: state.buffer, cursor: state.cursor + 1 });
+      if (cursor < buffer.length) setDraft(buffer, cursor + 1);
       return;
     }
     if (key.home) {
-      dispatch({ type: "setBuffer", buffer: state.buffer, cursor: 0 });
+      setDraft(buffer, 0);
       return;
     }
     if (key.end) {
-      dispatch({ type: "setBuffer", buffer: state.buffer, cursor: state.buffer.length });
+      setDraft(buffer, buffer.length);
       return;
     }
     if (key.upArrow) {
@@ -3744,24 +3778,23 @@ function App({
       return;
     }
     if (key.ctrl && input === "a") {
-      dispatch({ type: "setBuffer", buffer: state.buffer, cursor: 0 });
+      setDraft(buffer, 0);
       return;
     }
     if (key.ctrl && input === "e") {
-      dispatch({ type: "setBuffer", buffer: state.buffer, cursor: state.buffer.length });
+      setDraft(buffer, buffer.length);
       return;
     }
     if (key.ctrl && input === "u") {
-      dispatch({ type: "setBuffer", buffer: "", cursor: 0 });
+      setDraft("", 0);
       return;
     }
     if (key.ctrl && input === "w") {
-      const { cursor, buffer } = state;
       if (cursor === 0) return;
       const beforeCursor = buffer.slice(0, cursor);
       const lastWordStart = beforeCursor.lastIndexOf(" ") + 1;
       const next2 = buffer.slice(0, lastWordStart) + buffer.slice(cursor);
-      dispatch({ type: "setBuffer", buffer: next2, cursor: lastWordStart });
+      setDraft(next2, lastWordStart);
       return;
     }
     if (key.meta && input === "v") {
@@ -3783,13 +3816,13 @@ function App({
         const lineCount = cleanInput.split("\n").length;
         dispatch({ type: "addPlaceholder", ph: `${ph} (${lineCount} lines)` });
       } else {
-        const next2 = state.buffer.slice(0, state.cursor) + cleanInput + state.buffer.slice(state.cursor);
-        dispatch({ type: "setBuffer", buffer: next2, cursor: state.cursor + cleanInput.length });
+        const next2 = buffer.slice(0, cursor) + cleanInput + buffer.slice(cursor);
+        setDraft(next2, cursor + cleanInput.length);
       }
       return;
     }
-    const next = state.buffer.slice(0, state.cursor) + cleanInput + state.buffer.slice(state.cursor);
-    dispatch({ type: "setBuffer", buffer: next, cursor: state.cursor + cleanInput.length });
+    const next = buffer.slice(0, cursor) + cleanInput + buffer.slice(cursor);
+    setDraft(next, cursor + cleanInput.length);
   };
   const runBlocks = async (blocks) => {
     const ctrl = new AbortController();
@@ -3871,21 +3904,24 @@ function App({
   };
   const runBlocksRef = useRef(runBlocks);
   runBlocksRef.current = runBlocks;
-  const submit = async () => {
-    const raw = state.buffer;
+  const submit = async (overrideRaw) => {
+    const raw = overrideRaw ?? draftRef.current.buffer;
     const trimmed = raw.trim();
     if (!trimmed && state.placeholders.length === 0) return;
     dispatch({ type: "resetInterrupts" });
+    const pushSubmittedHistory = () => {
+      if (trimmed) dispatch({ type: "historyPush", text: trimmed });
+    };
     if (trimmed === "/image" || trimmed === "/paste-image") {
-      dispatch({ type: "clearInput" });
+      pushSubmittedHistory();
+      clearDraft();
       await pasteClipboardImage();
-      if (state.historyIndex > 0) dispatch({ type: "historyPush", text: trimmed });
       return;
     }
     if (trimmed.startsWith("/")) {
       dispatch({ type: "addEntry", entry: { kind: "user", text: trimmed } });
-      if (state.historyIndex > 0) dispatch({ type: "historyPush", text: trimmed });
-      dispatch({ type: "clearInput" });
+      pushSubmittedHistory();
+      clearDraft();
       try {
         const res = await slashRegistry.dispatch(trimmed, agent.ctx);
         if (res?.message) {
@@ -3931,20 +3967,19 @@ function App({
       builder.appendText(toAppend);
     }
     if (steering) dispatch({ type: "steerConsume" });
-    const blocks = await builder.submit();
     const displayText = trimmed ? steering ? `\u21AF ${trimmed}` : trimmed : "(attachments only)";
-    dispatch({ type: "clearInput" });
+    pushSubmittedHistory();
+    clearDraft();
+    const blocks = await builder.submit();
     if (state.status !== "idle") {
       dispatch({
         type: "addEntry",
         entry: { kind: "user", text: displayText, queued: true }
       });
       dispatch({ type: "enqueue", item: { displayText, blocks } });
-      if (state.historyIndex > 0) dispatch({ type: "historyPush", text: trimmed });
       return;
     }
     dispatch({ type: "addEntry", entry: { kind: "user", text: displayText } });
-    if (state.historyIndex > 0) dispatch({ type: "historyPush", text: trimmed });
     await runBlocks(blocks);
   };
   const bootInjectedRef = useRef(false);