@wrongstack/tui 0.2.0 → 0.3.2

package/dist/index.js

@@ -1,117 +1,14 @@
 import { render, useApp, Box, useStdout, Static, Text, useInput, useStdin } from 'ink';
 import React, { useState, useReducer, useRef, useEffect, useMemo } from 'react';
-import * as fs from 'fs/promises';
-import * as path3 from 'path';
+import * as fs2 from 'fs/promises';
+import * as path2 from 'path';
 import { InputBuilder, formatTodosList } from '@wrongstack/core';
-import { spawn } from 'child_process';
-import * as os from 'os';
+import { routeImagesForModel } from '@wrongstack/runtime/vision';
+import { readClipboardImage } from '@wrongstack/runtime/clipboard';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { spawn } from 'child_process';
 
 // src/run-tui.ts
-var MAX_IMAGE_BYTES = 10 * 1024 * 1024;
-async function readClipboardImage() {
-  const platform = process.platform;
-  if (platform === "win32") return readWindows();
-  if (platform === "darwin") return readDarwin();
-  if (platform === "linux") return readLinux();
-  return null;
-}
-async function readWindows() {
-  const tmp = path3.join(os.tmpdir(), `wstack-clip-${Date.now()}.png`);
-  const ps = [
-    "Add-Type -AssemblyName System.Windows.Forms",
-    "Add-Type -AssemblyName System.Drawing",
-    "$img = [System.Windows.Forms.Clipboard]::GetImage()",
-    'if ($img -eq $null) { Write-Output "NO_IMAGE"; exit 0 }',
-    `$img.Save('${tmp.replace(/\\/g, "\\\\")}', [System.Drawing.Imaging.ImageFormat]::Png)`,
-    'Write-Output "OK"'
-  ].join("; ");
-  const out = await runCmd("powershell", ["-NoProfile", "-Command", ps]);
-  if (!out || out.trim() === "NO_IMAGE") return null;
-  if (!out.includes("OK")) return null;
-  return readPngFile(tmp);
-}
-async function readDarwin() {
-  const tmp = path3.join(os.tmpdir(), `wstack-clip-${Date.now()}.png`);
-  const script = [
-    "try",
-    `  set the_file to (open for access POSIX file "${tmp}" with write permission)`,
-    "  write (the clipboard as \xABclass PNGf\xBB) to the_file",
-    "  close access the_file",
-    "on error",
-    "  try",
-    '    close access POSIX file "' + tmp + '"',
-    "  end try",
-    '  return "NO_IMAGE"',
-    "end try",
-    'return "OK"'
-  ].join("\n");
-  const out = await runCmd("osascript", ["-e", script]);
-  if (!out || out.trim() !== "OK") return null;
-  return readPngFile(tmp);
-}
-async function readLinux() {
-  const tmp = path3.join(os.tmpdir(), `wstack-clip-${Date.now()}.png`);
-  const tries = [
-    ["wl-paste", ["--type", "image/png"]],
-    ["xclip", ["-selection", "clipboard", "-t", "image/png", "-o"]]
-  ];
-  for (const [cmd, args] of tries) {
-    const ok = await runCmdToFile(cmd, args, tmp).catch(() => false);
-    if (ok) return readPngFile(tmp);
-  }
-  return null;
-}
-async function readPngFile(p) {
-  try {
-    const buf = await fs.readFile(p);
-    if (buf.length === 0) {
-      await fs.unlink(p).catch(() => void 0);
-      return null;
-    }
-    if (buf.length > MAX_IMAGE_BYTES) {
-      await fs.unlink(p).catch(() => void 0);
-      throw new Error(`Clipboard image exceeds ${MAX_IMAGE_BYTES / 1024 / 1024}MB limit`);
-    }
-    if (buf[0] !== 137 || buf[1] !== 80 || buf[2] !== 78 || buf[3] !== 71) {
-      await fs.unlink(p).catch(() => void 0);
-      return null;
-    }
-    await fs.unlink(p).catch(() => void 0);
-    return { base64: buf.toString("base64"), mediaType: "image/png", bytes: buf.length };
-  } catch (err) {
-    if (err.code === "ENOENT") return null;
-    throw err;
-  }
-}
-function runCmd(cmd, args) {
-  return new Promise((resolve) => {
-    const child = spawn(cmd, args, { stdio: ["ignore", "pipe", "pipe"] });
-    let out = "";
-    child.stdout.on("data", (c) => {
-      out += String(c);
-    });
-    child.on("error", () => resolve(null));
-    child.on("exit", (code) => resolve(code === 0 ? out : null));
-  });
-}
-function runCmdToFile(cmd, args, outPath) {
-  return new Promise((resolve) => {
-    const child = spawn(cmd, args, { stdio: ["ignore", "pipe", "pipe"] });
-    const chunks = [];
-    child.stdout.on("data", (c) => chunks.push(c));
-    child.on("error", () => resolve(false));
-    child.on("exit", async (code) => {
-      if (code !== 0 || chunks.length === 0) return resolve(false);
-      try {
-        await fs.writeFile(outPath, Buffer.concat(chunks));
-        resolve(true);
-      } catch {
-        resolve(false);
-      }
-    });
-  });
-}
 function stringifyInput(input) {
   if (!input || typeof input !== "object") return "";
   const obj = input;
@@ -214,8 +111,8 @@ function FilePicker({ query, matches, selected }) {
     ] }, m))
   ] });
 }
-function highlight(path4, query) {
-  return path4;
+function highlight(path3, query) {
+  return path3;
 }
 var STATUS_ICON = {
   idle: { icon: "\u25CB", color: "gray" },
@@ -233,6 +130,27 @@ function fmtCount(n) {
   if (n === 0) return "\u2014";
   return String(n);
 }
+function fmtDuration(ms) {
+  if (ms < 1e3) return `${ms}ms`;
+  return `${(ms / 1e3).toFixed(1)}s`;
+}
+function fmtBytes(n) {
+  if (n < 1024) return `${n}B`;
+  return `${(n / 1024).toFixed(1)}KB`;
+}
+function fmtRecentTool(tool) {
+  const status = tool.ok === false ? "fail" : "ok";
+  const name = tool.name.length > 24 ? `${tool.name.slice(0, 23)}...` : tool.name;
+  const parts = [status, name];
+  if (typeof tool.durationMs === "number") parts.push(fmtDuration(tool.durationMs));
+  if (typeof tool.outputBytes === "number" && tool.outputBytes > 0) parts.push(fmtBytes(tool.outputBytes));
+  if (typeof tool.outputLines === "number" && tool.outputLines > 0) parts.push(`${tool.outputLines}L`);
+  return parts.join(" ");
+}
+function fmtRecentMessage(message) {
+  const text = message.text.replace(/\s+/g, " ");
+  return text.length > 80 ? `${text.slice(0, 79)}...` : text;
+}
 function fmtModel(provider, model) {
   if (!provider && !model) return "";
   const p = provider ?? "";
@@ -282,6 +200,8 @@ function FleetPanel({ entries, totalCost, roster }) {
           const si = STATUS_ICON[entry.status];
           const modelTag = fmtModel(entry.provider, entry.model);
           const name = resolveName(entry, roster);
+          const recentTools = (entry.recentTools ?? []).slice(-2).map(fmtRecentTool).join(" | ");
+          const recentMessages = (entry.recentMessages ?? []).slice(-2).map(fmtRecentMessage);
           return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
             /* @__PURE__ */ jsxs(Box, { flexDirection: "row", gap: 1, children: [
               /* @__PURE__ */ jsx(Text, { color: si.color, children: si.icon }),
@@ -313,6 +233,14 @@ function FleetPanel({ entries, totalCost, roster }) {
                 "ms)"
               ] })
             ] }) : null,
+            recentTools ? /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+              "tools: ",
+              recentTools
+            ] }) }) : null,
+            recentMessages.map((message, index) => /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+              "msg: ",
+              message
+            ] }) }, `${entry.id}-msg-${index}-${message}`)),
             entry.status === "running" && entry.streamingText ? /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
               ">",
               " ",
@@ -335,6 +263,23 @@ function fmtElapsed(ms) {
   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,
@@ -348,6 +293,8 @@ function LiveActivityStrip({
       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) }),
@@ -360,7 +307,21 @@ function LiveActivityStrip({
           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: [
@@ -594,7 +555,7 @@ function ToolStreamBox({
     /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
       /* @__PURE__ */ jsx(Text, { color: "yellow", children: "\u25C6 " }),
       /* @__PURE__ */ jsx(Text, { bold: true, color: "cyan", children: name }),
-      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \u23F1 ${fmtDuration(elapsedMs)}` }),
+      /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \u23F1 ${fmtDuration2(elapsedMs)}` }),
       hidden > 0 ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  (${totalLines} lines, showing last ${MAX_STREAM_LINES})` }) : null
     ] }),
     /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginLeft: 2, children: [
@@ -617,6 +578,15 @@ function tailForDisplay(text, maxChars) {
   return `\u2026 ${text.slice(cut)}`;
 }
 function DiffBlock({ rows, hidden }) {
+  let gutterWidth = 1;
+  for (const r of rows) {
+    const n = r.kind === "del" ? r.oldLine : r.newLine;
+    if (typeof n === "number") {
+      const w = String(n).length;
+      if (w > gutterWidth) gutterWidth = w;
+    }
+  }
+  const blank = " ".repeat(gutterWidth);
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginLeft: 4, marginTop: 0, children: [
     rows.map((row, i) => {
       const key = i;
@@ -624,16 +594,20 @@ function DiffBlock({ rows, hidden }) {
         return /* @__PURE__ */ jsx(Text, { color: "cyan", dimColor: true, children: row.text }, key);
       }
       if (row.kind === "meta") {
-        return /* @__PURE__ */ jsx(Text, { dimColor: true, children: row.text }, key);
+        return /* @__PURE__ */ jsx(Text, { dimColor: true, children: `${blank}  ${row.text}` }, key);
       }
+      const lnNumber = row.kind === "del" ? row.oldLine : row.newLine;
+      const lnText = typeof lnNumber === "number" ? String(lnNumber).padStart(gutterWidth, " ") : blank;
       if (row.kind === "ctx") {
-        return /* @__PURE__ */ jsx(Text, { dimColor: true, children: row.text }, key);
+        return /* @__PURE__ */ jsx(Text, { dimColor: true, children: `${lnText}  ${row.text}` }, key);
       }
-      const bg = row.kind === "add" ? "green" : "red";
-      const fg = row.kind === "add" ? "black" : "white";
-      return /* @__PURE__ */ jsx(Text, { backgroundColor: bg, color: fg, children: row.text }, key);
+      const bg = row.kind === "add" ? "greenBright" : "redBright";
+      return /* @__PURE__ */ jsxs(Text, { children: [
+        /* @__PURE__ */ jsx(Text, { dimColor: true, children: `${lnText}  ` }),
+        /* @__PURE__ */ jsx(Text, { backgroundColor: bg, color: "black", children: row.text })
+      ] }, key);
     }),
-    hidden > 0 ? /* @__PURE__ */ jsx(Text, { dimColor: true, italic: true, children: `  \u2026 ${hidden} more line${hidden === 1 ? "" : "s"}` }) : null
+    hidden > 0 ? /* @__PURE__ */ jsx(Text, { dimColor: true, italic: true, children: `${blank}  \u2026 ${hidden} more line${hidden === 1 ? "" : "s"}` }) : null
   ] });
 }
 function Entry({
@@ -667,7 +641,7 @@ function Entry({
           parts.push(`${entry.outputLines} L`);
         }
         if (entry.outputBytes && entry.outputBytes > 0) {
-          parts.push(fmtBytes(entry.outputBytes));
+          parts.push(fmtBytes3(entry.outputBytes));
         }
         if (entry.outputTokens && entry.outputTokens > 0) {
           parts.push(`\u2248${fmtTok(entry.outputTokens)} tok`);
@@ -683,7 +657,7 @@ function Entry({
             /* @__PURE__ */ jsx(Text, { children: "  " }),
             /* @__PURE__ */ jsx(Text, { dimColor: true, children: argSummary })
           ] }) : null,
-          /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \xB7  ${fmtDuration(entry.durationMs)}` }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \xB7  ${fmtDuration2(entry.durationMs)}` }),
           sizeChip ? /* @__PURE__ */ jsx(Text, { dimColor: true, children: `  \xB7  ${sizeChip}` }) : null
         ] }),
         outLines.map((line, i) => (
@@ -823,7 +797,7 @@ function fmtTok(n) {
   if (n >= 1e3) return `${(n / 1e3).toFixed(n >= 1e4 ? 0 : 1)}k`;
   return String(n);
 }
-function fmtDuration(ms) {
+function fmtDuration2(ms) {
   if (ms < 1e3) return `${ms}ms`;
   if (ms < 6e4) return `${(ms / 1e3).toFixed(1)}s`;
   const totalSec = Math.floor(ms / 1e3);
@@ -951,7 +925,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 ${fmtBytes(bytes)}`];
+      if (bytes !== void 0) return [`${tag} \xB7 ${fmtBytes3(bytes)}`];
       return [tag];
     }
   }
@@ -1016,17 +990,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 [`${fmtBytes(bytes)} read`];
+      if (bytes !== void 0) return [`${fmtBytes3(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 ${fmtBytes(text.length)}`];
+        return [`L${range.first} \xB7 ${fmtBytes3(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 ${fmtBytes(text.length)}`];
+      return [`${head} \xB7 ${tail} \xB7 ${fmtBytes3(text.length)}`];
     }
   }
   if (toolName === "grep" || toolName === "glob") {
@@ -1084,7 +1058,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(fmtBytes(Buffer.byteLength(content, "utf8")));
+      if (content) head.push(fmtBytes3(Buffer.byteLength(content, "utf8")));
       const lines = [];
       if (head.length > 0) lines.push(head.join(" \xB7 "));
       if (url && status !== void 0 && (status < 200 || status >= 400)) {
@@ -1175,7 +1149,7 @@ function formatToolOutput(toolName, output, ok, _outputBytes, outputLines) {
       if (runner && runner !== "none") head.push(runner);
       head.push(`${passed}/${total} passed`);
       if (failed > 0) head.push(`${failed} failed`);
-      if (duration !== void 0) head.push(fmtDuration(duration));
+      if (duration !== void 0) head.push(fmtDuration2(duration));
       return [head.join(" \xB7 ")];
     }
   }
@@ -1386,20 +1360,29 @@ function extractDiffPreview(toolName, output) {
 }
 function parseUnifiedDiff(diff, maxLines) {
   const all = [];
+  let oldLn = 0;
+  let newLn = 0;
   for (const raw of diff.split("\n")) {
     const line = raw.replace(/\r$/, "");
     if (line.startsWith("+++") || line.startsWith("---")) continue;
     if (line.startsWith("diff --git") || line.startsWith("index ")) continue;
     if (line.startsWith("@@")) {
+      const m = line.match(/^@@\s+-(\d+)(?:,\d+)?\s+\+(\d+)(?:,\d+)?\s+@@/);
+      if (m) {
+        oldLn = Number.parseInt(m[1] ?? "0", 10) || 0;
+        newLn = Number.parseInt(m[2] ?? "0", 10) || 0;
+      }
       all.push({ kind: "hunk", text: truncMid(line, 60) });
       continue;
     }
     if (line.startsWith("+")) {
-      all.push({ kind: "add", text: truncMid(line, 100) });
+      all.push({ kind: "add", text: truncMid(line, 100), newLine: newLn });
+      newLn++;
       continue;
     }
     if (line.startsWith("-")) {
-      all.push({ kind: "del", text: truncMid(line, 100) });
+      all.push({ kind: "del", text: truncMid(line, 100), oldLine: oldLn });
+      oldLn++;
       continue;
     }
     if (line.startsWith("\\ No newline")) {
@@ -1407,7 +1390,9 @@ function parseUnifiedDiff(diff, maxLines) {
       continue;
     }
     if (line.length === 0) continue;
-    all.push({ kind: "ctx", text: truncMid(line, 100) });
+    all.push({ kind: "ctx", text: truncMid(line, 100), oldLine: oldLn, newLine: newLn });
+    oldLn++;
+    newLn++;
   }
   if (all.length === 0) return { rows: [], hidden: 0 };
   if (all.length <= maxLines) return { rows: all, hidden: 0 };
@@ -1449,7 +1434,7 @@ function countLines(text) {
   if (!text) return 0;
   return text.replace(/\n$/, "").split("\n").length;
 }
-function fmtBytes(n) {
+function fmtBytes3(n) {
   if (n < 1024) return `${n}B`;
   if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)}KB`;
   return `${(n / (1024 * 1024)).toFixed(1)}MB`;
@@ -1886,10 +1871,10 @@ async function loadIndex(root) {
 async function walk(root, rel, depth, out) {
   if (out.length >= MAX_FILES_INDEXED) return;
   if (depth > MAX_DEPTH) return;
-  const dir = rel ? path3.join(root, rel) : root;
+  const dir = rel ? path2.join(root, rel) : root;
   let entries;
   try {
-    entries = await fs.readdir(dir, { withFileTypes: true });
+    entries = await fs2.readdir(dir, { withFileTypes: true });
   } catch {
     return;
   }
@@ -2308,7 +2293,13 @@ function reducer(state, action) {
     // --- Fleet ---
     case "fleetSeed": {
       const seeded = {};
-      for (const e of action.entries) seeded[e.id] = e;
+      for (const e of action.entries) {
+        seeded[e.id] = {
+          ...e,
+          recentTools: e.recentTools ?? [],
+          recentMessages: e.recentMessages ?? []
+        };
+      }
       return { ...state, fleet: seeded, fleetCost: action.cost };
     }
     case "fleetSpawn": {
@@ -2322,6 +2313,8 @@ function reducer(state, action) {
         streamingText: "",
         iterations: 0,
         toolCalls: 0,
+        recentTools: [],
+        recentMessages: [],
         cost: 0,
         startedAt: Date.now(),
         lastEventAt: Date.now(),
@@ -2383,14 +2376,45 @@ function reducer(state, action) {
         }
       };
     }
+    case "fleetMessage": {
+      const cur = state.fleet[action.id];
+      const text = action.text.trim().replace(/\s+/g, " ");
+      if (!cur || !text) return state;
+      const now = Date.now();
+      const recentMessages = [...cur.recentMessages ?? [], { text, at: now }].slice(-2);
+      return {
+        ...state,
+        fleet: {
+          ...state.fleet,
+          [action.id]: { ...cur, recentMessages, lastEventAt: now }
+        }
+      };
+    }
     case "fleetTool": {
       const cur = state.fleet[action.id];
       if (!cur) return state;
+      const now = Date.now();
+      const recentTools = action.name !== void 0 ? [
+        ...cur.recentTools ?? [],
+        {
+          name: action.name,
+          ok: action.ok,
+          durationMs: action.durationMs,
+          outputBytes: action.outputBytes,
+          outputLines: action.outputLines,
+          at: now
+        }
+      ].slice(-2) : cur.recentTools ?? [];
       return {
         ...state,
         fleet: {
           ...state.fleet,
-          [action.id]: { ...cur, toolCalls: cur.toolCalls + 1, lastEventAt: Date.now() }
+          [action.id]: {
+            ...cur,
+            toolCalls: cur.toolCalls + 1,
+            recentTools,
+            lastEventAt: now
+          }
         }
       };
     }
@@ -2416,6 +2440,7 @@ function reducer(state, action) {
             iterations: action.iterations,
             toolCalls: action.toolCalls,
             streamingText: "",
+            currentTool: void 0,
             lastEventAt: Date.now()
           }
         }
@@ -2539,6 +2564,8 @@ function App({
   attachments,
   events,
   tokenCounter,
+  visionAdapters = [],
+  supportsVision,
   model,
   banner = true,
   queueStore,
@@ -2614,8 +2641,8 @@ function App({
   const lastEnterAtRef = useRef(0);
   const projectRoot = agent.ctx.projectRoot;
   const projectName = React.useMemo(() => {
-    const base = path3.basename(projectRoot);
-    return base && base !== path3.sep ? base : void 0;
+    const base = path2.basename(projectRoot);
+    return base && base !== path2.sep ? base : void 0;
   }, [projectRoot]);
   const streamingTextRef = useRef("");
   const pendingDeltaRef = useRef("");
@@ -2725,7 +2752,7 @@ function App({
     let cancelled = false;
     const poll = async () => {
       try {
-        const data = await fs.readFile(planPath, "utf8");
+        const data = await fs2.readFile(planPath, "utf8");
         const parsed = JSON.parse(data);
         if (cancelled) return;
         if (!Array.isArray(parsed.items)) {
@@ -2857,9 +2884,9 @@ function App({
       dispatch({ type: "pickerClose" });
       return;
     }
-    const absPath = path3.isAbsolute(picked) ? picked : path3.join(projectRoot, picked);
+    const absPath = path2.isAbsolute(picked) ? picked : path2.join(projectRoot, picked);
     try {
-      const data = await fs.readFile(absPath, "utf8");
+      const data = await fs2.readFile(absPath, "utf8");
       const placeholder = await builder.appendFile({
         kind: "file",
         data,
@@ -3255,21 +3282,16 @@ function App({
       });
     });
     const offTool = events.on("subagent.tool_executed", (e) => {
-      const lbl = labelFor(e.subagentId);
-      dispatch({ type: "fleetTool", id: e.subagentId });
-      dispatch({ type: "fleetToolEnd", id: e.subagentId });
-      const bytesTag = typeof e.outputBytes === "number" && e.outputBytes > 0 ? ` \xB7 ${e.outputBytes < 1024 ? `${e.outputBytes}B` : `${(e.outputBytes / 1024).toFixed(1)}KB`}` : "";
+      if (director) return;
       dispatch({
-        type: "addEntry",
-        entry: {
-          kind: "subagent",
-          agentLabel: lbl.label,
-          agentColor: lbl.color,
-          icon: e.ok === false ? "\u2717" : "\u25CF",
-          text: e.name,
-          detail: `${e.durationMs}ms${bytesTag}`
-        }
+        type: "fleetTool",
+        id: e.subagentId,
+        name: e.name,
+        ok: e.ok,
+        durationMs: e.durationMs,
+        outputBytes: e.outputBytes
       });
+      dispatch({ type: "fleetToolEnd", id: e.subagentId });
     });
     return () => {
       offSpawned();
@@ -3277,7 +3299,7 @@ function App({
       offCompleted();
       offTool();
     };
-  }, [events]);
+  }, [events, director]);
   useEffect(() => {
     if (!fleetStreamController) return;
     fleetStreamController.enabled = state.streamFleet;
@@ -3301,18 +3323,22 @@ function App({
     let streamFlushTimer = null;
     const flushStreamBufs = () => {
       for (const [id, text] of streamBuf) {
-        if (!text.trim()) continue;
+        const trimmed = text.trim();
+        if (!trimmed) continue;
         const lbl = labelFor(id);
-        dispatch({
-          type: "addEntry",
-          entry: {
-            kind: "subagent",
-            agentLabel: lbl.label,
-            agentColor: lbl.color,
-            icon: "\u{1F4AC}",
-            text: text.trim()
-          }
-        });
+        dispatch({ type: "fleetMessage", id, text: trimmed });
+        if (streamFleetRef.current) {
+          dispatch({
+            type: "addEntry",
+            entry: {
+              kind: "subagent",
+              agentLabel: lbl.label,
+              agentColor: lbl.color,
+              icon: "\u{1F4AC}",
+              text: trimmed
+            }
+          });
+        }
       }
       streamBuf.clear();
       streamFlushTimer = null;
@@ -3377,10 +3403,9 @@ function App({
             const cur = pending.get(e.subagentId) ?? "";
             pending.set(e.subagentId, cur + p.text);
             if (!flushTimer) flushTimer = setTimeout(doFlush, FLUSH_MS);
-            if (streamFleetRef.current) {
-              streamBuf.set(e.subagentId, (streamBuf.get(e.subagentId) ?? "") + p.text);
-              if (!streamFlushTimer) streamFlushTimer = setTimeout(flushStreamBufs, FLUSH_MS * 4);
-            }
+            streamBuf.set(e.subagentId, (streamBuf.get(e.subagentId) ?? "") + p.text);
+            if (streamFlushTimer) clearTimeout(streamFlushTimer);
+            streamFlushTimer = setTimeout(flushStreamBufs, FLUSH_MS * 4);
           }
           break;
         }
@@ -3392,28 +3417,17 @@ function App({
           break;
         }
         case "tool.executed": {
-          dispatch({ type: "fleetTool", id: e.subagentId });
+          const p = e.payload;
+          dispatch({
+            type: "fleetTool",
+            id: e.subagentId,
+            name: p?.name,
+            ok: p?.ok,
+            durationMs: p?.durationMs,
+            outputBytes: p?.outputBytes,
+            outputLines: p?.outputLines
+          });
           dispatch({ type: "fleetToolEnd", id: e.subagentId });
-          if (streamFleetRef.current) {
-            if (streamFlushTimer) {
-              clearTimeout(streamFlushTimer);
-              flushStreamBufs();
-            }
-            const p = e.payload;
-            const args = p?.input ? formatToolArgs(p.name ?? "", p.input) : "";
-            const lbl = labelFor(e.subagentId);
-            dispatch({
-              type: "addEntry",
-              entry: {
-                kind: "subagent",
-                agentLabel: lbl.label,
-                agentColor: lbl.color,
-                icon: p?.ok === false ? "\u2717" : "\u25CF",
-                text: args ? `${p?.name ?? "tool"} ${args}` : p?.name ?? "tool",
-                detail: typeof p?.durationMs === "number" ? `${p.durationMs}ms` : void 0
-              }
-            });
-          }
           break;
         }
         case "provider.response": {
@@ -3431,7 +3445,7 @@ function App({
         toolCalls: payload.result.toolCalls
       });
       dispatch({ type: "fleetCost", cost: d.snapshot().total.cost });
-      if (streamFleetRef.current && streamFlushTimer) {
+      if (streamFlushTimer) {
         clearTimeout(streamFlushTimer);
         flushStreamBufs();
       }
@@ -3785,7 +3799,24 @@ function App({
       const startedAt = Date.now();
       const before = tokenCounter?.total();
       const costBefore = tokenCounter?.estimateCost().total ?? 0;
-      const result = await agent.run(blocks, { signal: ctrl.signal });
+      const routed = blocks.some((block) => block.type === "image") ? await routeImagesForModel(blocks, {
+        supportsVision: supportsVision ? await supportsVision() : agent.ctx.provider.capabilities.vision,
+        adapters: visionAdapters,
+        ctx: agent.ctx,
+        signal: ctrl.signal,
+        providerId: agent.ctx.provider.id,
+        model: agent.ctx.model
+      }) : { blocks, route: "none", convertedImages: 0 };
+      if (routed.route === "adapter") {
+        dispatch({
+          type: "addEntry",
+          entry: {
+            kind: "info",
+            text: `Image input analyzed via ${routed.adapterName ?? "vision adapter"} (${routed.convertedImages} image${routed.convertedImages === 1 ? "" : "s"}).`
+          }
+        });
+      }
+      const result = await agent.run(routed.blocks, { signal: ctrl.signal });
       const lingering = streamingTextRef.current;
       if (lingering.trim()) {
         dispatch({ type: "addEntry", entry: { kind: "assistant", text: lingering } });
@@ -3838,11 +3869,19 @@ function App({
       await runBlocks(head.blocks);
     }
   };
+  const runBlocksRef = useRef(runBlocks);
+  runBlocksRef.current = runBlocks;
   const submit = async () => {
     const raw = state.buffer;
     const trimmed = raw.trim();
     if (!trimmed && state.placeholders.length === 0) return;
     dispatch({ type: "resetInterrupts" });
+    if (trimmed === "/image" || trimmed === "/paste-image") {
+      dispatch({ type: "clearInput" });
+      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 });
@@ -3935,9 +3974,9 @@ function App({
         b.appendText(ask);
       }
       const blocks = await b.submit();
-      await runBlocks(blocks);
+      await runBlocksRef.current(blocks);
     })();
-  }, []);
+  }, [initialAsk, initialGoal]);
   const inputHint = useMemo(() => {
     if (state.status !== "idle") return "";
     if (state.buffer.startsWith("/")) return "slash command \u2014 Enter to dispatch";
@@ -4138,6 +4177,8 @@ async function runTui(opts) {
           attachments: opts.attachments,
           events: opts.events,
           tokenCounter: opts.tokenCounter,
+          visionAdapters: opts.visionAdapters,
+          supportsVision: opts.supportsVision,
           model: opts.model,
           banner: opts.banner ?? true,
           queueStore: opts.queueStore,