@nanhara/hara 0.70.0 → 0.95.2

package/dist/tools/todo.js

@@ -7,6 +7,29 @@ let todos = [];
 export function currentTodos() {
     return todos;
 }
+const listeners = new Set();
+/** Subscribe to checklist changes. Returns an unsubscribe fn. */
+export function onTodosChange(fn) {
+    listeners.add(fn);
+    return () => {
+        listeners.delete(fn);
+    };
+}
+function emit() {
+    for (const fn of listeners) {
+        try {
+            fn(todos);
+        }
+        catch {
+            /* listeners must not break the tool */
+        }
+    }
+}
+/** Reset between sessions/turns if a runner wants a clean slate (not used by the tool itself). */
+export function clearTodos() {
+    todos = [];
+    emit();
+}
 const MARK = { pending: "☐", in_progress: "▶", done: "☑" };
 export function renderTodos(list) {
     if (!list.length)
@@ -16,9 +39,33 @@ export function renderTodos(list) {
 }
 registerTool({
     name: "todo_write",
-    description: "Maintain a short task checklist for the CURRENT work. Use it to plan a multi-step task up front, then " +
-        "update it as you go: keep exactly one item 'in_progress', flip items to 'done' as you finish, add items " +
-        "you discover. Pass the FULL list each call (it replaces the previous). Skip it for trivial one-step tasks.",
+    description: "Maintain a short task checklist for the CURRENT work. Pass the FULL list each call (it replaces the previous). " +
+        "Each item has `text` (imperative, e.g. 'Run tests') AND `activeForm` (present-continuous, e.g. 'Running tests') — " +
+        "the UI shows activeForm while the item is in_progress. Exactly ONE item should be in_progress at a time; flip " +
+        "items to 'done' as you finish; add items you discover. " +
+        "\n\n## Use this tool when" +
+        "\n  - the task takes 3+ distinct steps (refactor across files, new feature, multi-file fix, migrations)" +
+        "\n  - the user gave you a numbered/comma-separated list of things to do" +
+        "\n  - you discover mid-work that scope grew past a single edit" +
+        "\n  - the user explicitly asks for a plan/checklist" +
+        "\n\n## Skip this tool when" +
+        "\n  - reading one file or answering one question" +
+        "\n  - running one shell command and reporting output" +
+        "\n  - a single straight-line edit to one location" +
+        "\n  - pure conversation / explanation" +
+        "\n\n## Examples — use it" +
+        "\n  user: \"add a dark-mode toggle and run tests\" → 4-5 items (component, state, styles, tests)" +
+        "\n  user: \"rename getCwd to getCurrentWorkingDirectory across the project\" → one item per file after grepping" +
+        "\n  user: \"implement registration, catalog, cart, checkout\" → break each feature into 2-3 sub-items" +
+        "\n  user: \"optimize this slow React app\" → one item per identified bottleneck" +
+        "\n\n## Examples — skip it" +
+        "\n  user: \"how do I print 'hello' in python?\" → answer directly" +
+        "\n  user: \"what does git status do?\" → explain" +
+        "\n  user: \"add a comment to calculateTotal\" → one edit, no plan needed" +
+        "\n  user: \"run npm install\" → one exec, report output" +
+        "\n\n## After updating the list" +
+        "\nBriefly say what changed in one short line (e.g. \"marked 2 done, starting on tests\"); do NOT repeat the full " +
+        "checklist back to the user — the UI already renders it live.",
     input_schema: {
         type: "object",
         properties: {
@@ -28,7 +75,11 @@ registerTool({
                 items: {
                     type: "object",
                     properties: {
-                        text: { type: "string", description: "the task, a short imperative phrase" },
+                        text: { type: "string", description: "the task, a short imperative phrase (e.g. 'Run tests')" },
+                        activeForm: {
+                            type: "string",
+                            description: "present-continuous form shown while in_progress (e.g. 'Running tests'). Always provide.",
+                        },
                         status: { type: "string", enum: ["pending", "in_progress", "done"] },
                     },
                     required: ["text", "status"],
@@ -41,11 +92,17 @@ registerTool({
     async run(input) {
         const raw = Array.isArray(input.todos) ? input.todos : [];
         todos = raw
-            .map((t) => ({
-            text: String(t?.text ?? "").trim(),
-            status: (["pending", "in_progress", "done"].includes(t?.status) ? t.status : "pending"),
-        }))
+            .map((t) => {
+            const text = String(t?.text ?? "").trim();
+            const status = (["pending", "in_progress", "done"].includes(t?.status) ? t.status : "pending");
+            const activeFormRaw = typeof t?.activeForm === "string" ? t.activeForm.trim() : "";
+            const item = { text, status };
+            if (activeFormRaw)
+                item.activeForm = activeFormRaw;
+            return item;
+        })
             .filter((t) => t.text);
+        emit();
         return renderTodos(todos);
     },
 });

package/dist/tools/web.js

@@ -5,6 +5,7 @@
 import { registerTool } from "./registry.js";
 import { lookup } from "node:dns/promises";
 import { isIP } from "node:net";
+import { wrapUntrusted } from "../security/external-content.js";
 const MAX = 60_000;
 /** True for loopback / private / link-local / ULA / CGNAT addresses we must not let web_fetch reach. */
 export function isPrivateIp(ip) {
@@ -150,7 +151,7 @@ registerTool({
                     const j = (await res.json());
                     const rs = (j.results ?? []).map((x) => ({ title: String(x.title ?? x.url ?? ""), url: String(x.url ?? ""), snippet: String(x.content ?? "").slice(0, 200) }));
                     if (rs.length)
-                        return fmt(rs);
+                        return wrapUntrusted(fmt(rs), `web_search: ${q}`);
                 }
                 // Tavily failed → fall through to the keyless best-effort path.
             }
@@ -171,7 +172,7 @@ registerTool({
             const results = parseSearchResults(await res.text(), limit);
             if (!results.length)
                 return "(no results — the keyless endpoint is rate-limited or changed. Set HARA_SEARCH_API_KEY (Tavily) for reliable search, or web_fetch a known URL.)";
-            return fmt(results);
+            return wrapUntrusted(fmt(results), `web_search: ${q}`);
         }
         catch (e) {
             return `Search failed: ${e?.name === "AbortError" ? "timed out (20s)" : (e?.message ?? e)}`;
@@ -231,7 +232,7 @@ registerTool({
             let text = /html/i.test(ct) ? htmlToText(raw) : raw;
             if (text.length > cap)
                 text = text.slice(0, cap) + `\n…[truncated ${text.length - cap} chars]`;
-            return `# ${current.href} (HTTP ${res.status})\n\n${text || "(empty body)"}`;
+            return `# ${current.href} (HTTP ${res.status})\n\n${wrapUntrusted(text || "(empty body)", current.href)}`;
         }
         catch (e) {
             return `Error fetching ${url.href}: ${e?.name === "AbortError" ? "timed out (30s)" : (e?.message ?? e)}`;

package/dist/tui/App.js

@@ -7,13 +7,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // The agent machinery is injected via `onSubmit` (a turn runner) so this view is testable with
 // ink-testing-library against a fake runner — no provider/network needed.
-import { Box, Static, Text, useApp, useInput } from "ink";
+import { Box, Static, Text, useApp, useInput, useStdout } from "ink";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { InputBox } from "./InputBox.js";
 import { activity } from "../activity.js";
 import { ctxPctFor } from "../statusbar.js";
 import { accent } from "./theme.js";
 import { renderMarkdown } from "../md.js";
+import { currentTodos, onTodosChange } from "../tools/todo.js";
 let _id = 0;
 const nid = () => ++_id;
 const stripAnsi = (s) => s.replace(/\x1b\[[0-9;]*m/g, "");
@@ -24,12 +25,15 @@ function Block({ item, open }) {
         case "assistant":
             return _jsx(Text, { children: renderMarkdown(item.text) }); // headers/bold/inline-code/bullets + verbatim fences
         case "reasoning": {
-            // fixed-height window: show the last 5 lines while thinking; ctrl-r toggles the full text.
+            // Codex-style: stream the reasoning dim + italic with a leading "• " bullet; show the full text up to
+            // MAX lines, fold longer to the live tail with a "… +N lines" summary. ctrl-r expands/collapses.
+            const MAX = 10;
             const lines = item.text.replace(/\n+$/, "").split("\n");
-            const long = lines.length > 5;
-            const shown = open || !long ? lines : lines.slice(-5);
-            const hint = long ? (open ? " · ctrl-r collapse" : " · ctrl-r expand") : "";
-            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: accent(), dimColor: true, children: `✻ thinking … ${lines.length} line${lines.length === 1 ? "" : "s"}${hint}` }), shown.map((l, i) => (_jsx(Text, { dimColor: true, children: `│ ${l}` }, i)))] }));
+            const long = lines.length > MAX;
+            const shown = open || !long ? lines : lines.slice(-MAX); // short or expanded → all; long & collapsed → live tail
+            const omitted = long && !open ? lines.length - MAX : 0;
+            const hint = long ? (open ? " · ctrl-r collapse" : ` · … +${omitted} lines · ctrl-r expand`) : "";
+            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: accent(), dimColor: true, children: `✻ thinking … ${lines.length} line${lines.length === 1 ? "" : "s"}${hint}` }), shown.map((l, i) => (_jsx(Text, { dimColor: true, italic: true, children: `${i === 0 ? "• " : "  "}${l}` }, i)))] }));
         }
         case "tool":
             return _jsx(Text, { dimColor: true, children: "  " + item.text });
@@ -39,30 +43,173 @@ function Block({ item, open }) {
             return _jsx(Text, { dimColor: true, children: item.text });
     }
 }
-// ASCII rendering of the nanhara "Λi" mark (small peak + big peak + italic i), in the brand violet.
-// hara wordmark — FIGlet "ANSI Shadow". A recognizable banner reads better in a terminal than a
-// pixel-faithful logo. Printed once at the top of the session; scrolls away with the transcript.
-const BANNER = [
-    "██╗  ██╗ █████╗ ██████╗  █████╗",
-    "██║  ██║██╔══██╗██╔══██╗██╔══██╗",
-    "███████║███████║██████╔╝███████║",
-    "██╔══██║██╔══██║██╔══██╗██╔══██║",
-    "██║  ██║██║  ██║██║  ██║██║  ██║",
-    "╚═╝  ╚═╝╚═╝  ╚═╝╚═╝  ╚═╝╚═╝  ╚═╝",
-];
-function HeaderCard({ version, model, cwd, tip, vision, session }) {
-    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [BANNER.map((row, i) => (_jsx(Text, { color: accent(), children: row }, i))), _jsx(Text, { dimColor: true, children: ` the coding agent that runs like an org   ·   v${version}` }), _jsx(Text, { dimColor: true, children: ` ${model}  ·  ${cwd}` }), session ? _jsx(Text, { dimColor: true, children: ` session ${session}` }) : null, vision ? (_jsxs(Text, { children: [_jsx(Text, { color: accent(), children: " 👁 " }), _jsx(Text, { dimColor: true, children: vision })] })) : null, tip ? _jsx(Text, { dimColor: true, children: ` ${tip}` }) : null] }));
+function flattenTranscript(items) {
+    const out = [];
+    for (const it of items) {
+        const body = (it.full ?? it.text).replace(/\n+$/, "");
+        if (!body && it.kind !== "user")
+            continue;
+        out.push({ t: "" }); // blank line between blocks
+        if (it.kind === "user") {
+            body.split("\n").forEach((l, i) => out.push({ t: (i === 0 ? "› " : "  ") + l, color: "cyan" }));
+        }
+        else if (it.kind === "reasoning" || (it.kind === "notice" && it.full !== undefined)) {
+            const lines = body.split("\n");
+            out.push({ t: `✻ thinking (${lines.length} line${lines.length === 1 ? "" : "s"})`, dim: true, color: accent() });
+            lines.forEach((l, i) => out.push({ t: (i === 0 ? "• " : "  ") + l, dim: true, italic: true }));
+        }
+        else if (it.kind === "tool") {
+            out.push({ t: it.text, dim: true });
+            if (it.full && it.full !== it.text)
+                it.full.replace(/\n+$/, "").split("\n").forEach((l) => out.push({ t: "    " + l, dim: true }));
+        }
+        else if (it.kind === "diff") {
+            body.split("\n").forEach((l) => out.push({ t: l }));
+        }
+        else {
+            body.split("\n").forEach((l) => out.push({ t: l, dim: it.kind === "notice" }));
+        }
+    }
+    return out;
+}
+function Transcript({ items, onClose }) {
+    const { stdout } = useStdout();
+    const rows = Math.max(6, (stdout?.rows ?? 30) - 2); // leave a row for the header
+    const lines = flattenTranscript(items);
+    const maxScroll = Math.max(0, lines.length - rows);
+    const [scroll, setScroll] = useState(1e9); // open at the bottom (latest); clamped to maxScroll below
+    const at = Math.min(scroll, maxScroll);
+    useInput((input, key) => {
+        if (key.escape || (key.ctrl && input === "t"))
+            return onClose();
+        if (key.upArrow)
+            setScroll(Math.max(0, at - 1));
+        else if (key.downArrow)
+            setScroll(Math.min(maxScroll, at + 1));
+        else if (key.pageUp)
+            setScroll(Math.max(0, at - rows));
+        else if (key.pageDown)
+            setScroll(Math.min(maxScroll, at + rows));
+        else if (input === "g")
+            setScroll(0);
+        else if (input === "G")
+            setScroll(maxScroll);
+    });
+    const view = lines.slice(at, at + rows);
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: accent(), bold: true, children: ` TRANSCRIPT · full, nothing folded · ↑↓/PgUp·PgDn/g·G scroll · esc or ctrl+t closes · ${lines.length ? at + 1 : 0}–${Math.min(at + rows, lines.length)}/${lines.length}` }), view.map((l, i) => (_jsx(Text, { color: l.color, dimColor: l.dim, italic: l.italic, children: l.t || " " }, i)))] }));
+}
+// ─── header helpers ────────────────────────────────────────────────────────────
+// Pure functions so the view stays declarative and tests can pin the formatting
+// without rendering ink. Exported for unit tests (see test/tui-header.test.mjs).
+/** Extract the URL host (no scheme, no path, no query). Falls back to the raw
+ *  string when `url` isn't parseable — better to surface something than swallow it. */
+export function extractHost(url) {
+    if (!url)
+        return "";
+    try {
+        return new URL(url).host;
+    }
+    catch {
+        // Strip a leading scheme + leading // if present (handles "git@host:..." style which URL() rejects).
+        const noScheme = url.replace(/^[a-z][a-z0-9+.-]*:\/\//i, "");
+        return noScheme.split("/")[0].split("?")[0];
+    }
+}
+/** Tilde-collapse the user's home directory. If the path is too long, keep the
+ *  TAIL (most-specific segments) — the project name reads better than `~/work/…`.
+ *  `maxLen` clamps the displayed length; default 60 fits in a 80-col terminal next
+ *  to the "cwd       " label + an optional " · AGENTS.md" suffix. */
+export function shortenHome(abs, home = process.env.HOME ?? "", maxLen = 60) {
+    let p = abs;
+    if (home && (p === home || p.startsWith(home + "/"))) {
+        p = "~" + p.slice(home.length);
+    }
+    if (p.length <= maxLen)
+        return p;
+    // Keep the last `maxLen - 2` chars, prefixed with `…/` to signal truncation.
+    const tail = p.slice(-(maxLen - 2));
+    // If the truncation lands inside a segment, advance to the next `/` for a clean break.
+    const firstSlash = tail.indexOf("/");
+    const clean = firstSlash > 0 ? tail.slice(firstSlash) : tail;
+    return "…" + clean;
+}
+/** Render a session uuid (or any id) as its first 8 chars — same convention as `shortId`
+ *  in src/session/store.ts. A second helper here so the view never reaches into the session
+ *  module + so headers in tests can pass any string and get a stable display. */
+export function shortenSession(uuid) {
+    if (!uuid)
+        return "";
+    return uuid.slice(0, 8);
 }
-function Working() {
+/** Layout constants for the field grid. Field names live in a 10-char column;
+ *  values start at column 12 (after 2 spaces). The view uses `padField` to
+ *  pad a label so the values align vertically across rows. */
+const FIELD_PAD = 10;
+const padField = (name) => name.padEnd(FIELD_PAD, " ");
+function HeaderCard(props) {
+    const { version, modelLabel, cwd, agentsMdLoaded, session, kind } = props;
+    const home = process.env.HOME ?? "";
+    const cwdShort = shortenHome(cwd, home);
+    const sessionShort = shortenSession(session);
+    // Identity line — branches on kind. Personal collapses kind+model into one line;
+    // org splits identity (org/label/id/route) from model (with its source).
+    const identity = kind === "org" ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: `  ${padField("org")}` }), _jsx(Text, { children: props.orgLabel ?? props.orgId ?? "(unnamed)" }), props.orgId && props.orgLabel ? _jsx(Text, { dimColor: true, children: `  ·  ${props.orgId}` }) : null, props.routeHost ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: "  →  " }), _jsx(Text, { dimColor: true, children: props.routeHost })] })) : null] })) : (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: `  ${padField(props.profileId ? `personal:${props.profileId}` : "personal")}` }), _jsx(Text, { children: modelLabel }), props.routeHost ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: "  →  " }), _jsx(Text, { dimColor: true, children: props.routeHost })] })) : null] }));
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: accent(), children: "> " }), _jsx(Text, { color: accent(), bold: true, children: `hara` }), _jsx(Text, { dimColor: true, children: ` · v${version} — the coding agent that runs like an org` })] }), _jsx(Text, { children: " " }), identity, kind === "org" ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: `  ${padField("model")}` }), _jsx(Text, { children: modelLabel }), props.modelSource ? _jsx(Text, { dimColor: true, children: `  ·  from ${props.modelSource}` }) : null] })) : null, _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: `  ${padField("cwd")}` }), _jsx(Text, { dimColor: true, children: cwdShort }), agentsMdLoaded ? _jsx(Text, { dimColor: true, children: "  ·  AGENTS.md" }) : null] }), sessionShort ? (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: `  ${padField("session")}` }), _jsx(Text, { dimColor: true, children: sessionShort })] })) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "  /help · @file · shift+tab · esc" })] }));
+}
+// Spinner verb: while a turn is running, prefer the in_progress todo's activeForm (or its text),
+// so the bottom line reads "▶ updating tests…" instead of an abstract "working". Falls back to
+// the elapsed-seconds form when no checklist is active. Exported for unit testing.
+export function spinnerVerb(list, elapsedSec) {
+    const active = list.find((t) => t.status === "in_progress");
+    if (active) {
+        const phrase = active.activeForm?.trim() || active.text;
+        return `${phrase}… ${elapsedSec}s · esc to interrupt`;
+    }
+    return `working ${elapsedSec}s · esc to interrupt`;
+}
+function Working({ todos }) {
     const [n, setN] = useState(0);
     useEffect(() => {
         const id = setInterval(() => setN((x) => x + 1), 100);
         return () => clearInterval(id);
     }, []);
     const frames = "⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏";
-    return (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "yellow", children: frames[n % frames.length] }), _jsx(Text, { dimColor: true, children: ` working ${Math.floor(n / 10)}s · esc to interrupt` })] }));
+    return (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "yellow", children: frames[n % frames.length] }), _jsx(Text, { dimColor: true, children: ` ${spinnerVerb(todos, Math.floor(n / 10))}` })] }));
+}
+// Live task panel: renders the current todo_write checklist between the in-progress turn output
+// and the input box. Highlights the in_progress item; caps at 8 rows and folds the rest into
+// `… +N pending/done`. Hidden when the list is empty.
+const PANEL_MAX_ROWS = 8;
+const TODO_MARK = { pending: "☐", in_progress: "▶", done: "☑" };
+function TodoPanel({ todos }) {
+    if (!todos.length)
+        return null;
+    const doneCount = todos.filter((t) => t.status === "done").length;
+    // Prioritize visible rows: in_progress first, then pending, then done — show the most informative
+    // slice when the list outgrows the cap. Stable order within each group via the original index.
+    const indexed = todos.map((t, i) => ({ t, i }));
+    const rank = (s) => (s === "in_progress" ? 0 : s === "pending" ? 1 : 2);
+    const prioritized = [...indexed].sort((a, b) => rank(a.t.status) - rank(b.t.status) || a.i - b.i);
+    const visible = prioritized.slice(0, PANEL_MAX_ROWS).sort((a, b) => a.i - b.i).map((x) => x.t);
+    const hidden = todos.length - visible.length;
+    const hiddenSummary = hidden > 0 ? (() => {
+        const remaining = prioritized.slice(PANEL_MAX_ROWS).map((x) => x.t);
+        const p = remaining.filter((t) => t.status === "pending").length;
+        const d = remaining.filter((t) => t.status === "done").length;
+        const parts = [];
+        if (p)
+            parts.push(`${p} pending`);
+        if (d)
+            parts.push(`${d} done`);
+        return ` … +${parts.join(", ")}`;
+    })() : "";
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: accent(), children: `  Todos (${doneCount}/${todos.length} done)` }), visible.map((t, i) => {
+                const inProg = t.status === "in_progress";
+                const done = t.status === "done";
+                return (_jsx(Text, { color: inProg ? accent() : undefined, bold: inProg, dimColor: done, children: `  ${TODO_MARK[t.status]} ${t.text}` }, i));
+            }), hiddenSummary ? _jsx(Text, { dimColor: true, children: hiddenSummary }) : null] }));
 }
-export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval, onClipboardImage, vim }) {
+export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval, onClipboardImage, vim, visionNotice }) {
     const { exit } = useApp();
     const [history, setHistory] = useState([]);
     const [current, setCurrent] = useState([]);
@@ -71,6 +218,14 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
     const [prompt, setPrompt] = useState(null);
     const [promptSel, setPromptSel] = useState(0);
     const [reasoningOpen, setReasoningOpen] = useState(false);
+    const [showTranscript, setShowTranscript] = useState(false); // Ctrl+T full-transcript overlay
+    // Live checklist mirror: TodoPanel reads this, and `Working` derives its spinner verb from the
+    // in_progress item. The tool emits on every todo_write — keeps the UI in lockstep with the agent.
+    const [todos, setTodos] = useState(() => currentTodos());
+    // Collapse-after-turn: once a turn ends, leave the panel visible briefly (so the user sees the
+    // final state) then fold it into a single-line "Todos: N/M done" notice in history. Cleared if
+    // a new turn starts before the timer fires.
+    const collapseTimerRef = useRef(null);
     const ctrlRef = useRef(null);
     const queueRef = useRef([]); // type-ahead: FIFO of messages entered while working
     const [pool, setPool] = useState([]); // type-ahead pool: queued message lines, shown above the input
@@ -84,6 +239,22 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
         activity.onChange(fn);
         return () => activity.onChange(null);
     }, []);
+    // Subscribe to todo_write updates so the panel re-renders when the agent edits the checklist.
+    useEffect(() => {
+        const unsub = onTodosChange((list) => {
+            setTodos([...list]); // copy so React sees a new array (the tool reuses one)
+            // A change mid-turn cancels any pending collapse — the user is still working with this list.
+            if (collapseTimerRef.current) {
+                clearTimeout(collapseTimerRef.current);
+                collapseTimerRef.current = null;
+            }
+        });
+        return () => {
+            unsub();
+            if (collapseTimerRef.current)
+                clearTimeout(collapseTimerRef.current);
+        };
+    }, []);
     const pushCurrent = useCallback((kind, text, merge = false) => {
         setCurrent((cur) => {
             const last = cur[cur.length - 1];
@@ -92,6 +263,16 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
             return [...cur, { id: nid(), kind, text }];
         });
     }, []);
+    // Lazy vision notice: 顾雅 spec — the header no longer carries an always-on "👁 …" line.
+    // Instead, the first time an image attachment shows up in this session, we print the
+    // routing notice once (inline). `visionShownRef` is the session-scoped flag.
+    const visionShownRef = useRef(false);
+    const noteVisionIfNeeded = useCallback(() => {
+        if (visionShownRef.current || !visionNotice)
+            return;
+        visionShownRef.current = true;
+        setHistory((h) => [...h, { id: nid(), kind: "notice", text: `  ⓘ ${visionNotice}` }]);
+    }, [visionNotice]);
     // Type-ahead steering: hand the runner everything queued while the turn ran, showing each message
     // inline (as a user block) at the point it gets folded into the conversation. Drained mid-turn so an
     // addition reaches the model on its next call; whatever's still queued at turn end is the effect below.
@@ -101,10 +282,12 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
         const batch = queueRef.current;
         queueRef.current = [];
         setPool([]);
+        if (batch.some((b) => b.images?.length))
+            noteVisionIfNeeded();
         for (const b of batch)
             pushCurrent("user", b.line.trim() || "🖼 (image)");
         return batch;
-    }, [pushCurrent]);
+    }, [pushCurrent, noteVisionIfNeeded]);
     const handleSubmit = useCallback(async (line, images) => {
         const t = line.trim();
         if ((!t && !images?.length) || prompt)
@@ -115,6 +298,8 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
             setPool(queueRef.current.map((q) => q.line.trim() || "🖼 (image)"));
             return;
         }
+        if (images?.length)
+            noteVisionIfNeeded(); // one-shot inline notice on first image of the session
         setHistory((h) => [...h, { id: nid(), kind: "user", text: t }]); // t already carries any [Image #N] tokens
         const ctrl = new AbortController();
         ctrlRef.current = ctrl;
@@ -145,14 +330,34 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
         catch (e) {
             pushCurrent("notice", `error: ${e instanceof Error ? e.message : String(e)}`);
         }
-        const committed = currentRef.current.map((it) => it.kind === "reasoning"
-            ? { ...it, kind: "notice", text: `✻ thought · ${it.text.split("\n").filter((l) => l.trim()).length} lines` }
-            : it);
-        setHistory((h) => [...h, ...committed]);
-        setCurrent([]);
+        // Commit this turn's items to scrollback. Read the LIVE current via the updater — currentRef only
+        // syncs on render (line ~225), so a fast slash-only turn (/design, /help, /skills…) that pushes a
+        // notice and returns before any re-render would otherwise commit nothing and lose the notice.
+        setCurrent((cur) => {
+            const committed = cur.map((it) => it.kind === "reasoning"
+                ? { ...it, kind: "notice", text: `✻ thought · ${it.text.split("\n").filter((l) => l.trim()).length} lines`, full: it.text }
+                : it);
+            if (committed.length)
+                setHistory((h) => [...h, ...committed]);
+            return [];
+        });
         setWorking(false);
         ctrlRef.current = null;
-    }, [working, prompt, onSubmit, pushCurrent, model, exit, drainQueue]);
+        // Schedule a panel collapse: if there was a checklist this turn, fold it to a one-line summary
+        // in scrollback after ~30s of quiet (i.e. no new todo_write or new turn).
+        if (collapseTimerRef.current)
+            clearTimeout(collapseTimerRef.current);
+        if (currentTodos().length) {
+            collapseTimerRef.current = setTimeout(() => {
+                const list = currentTodos();
+                if (!list.length)
+                    return;
+                const done = list.filter((t) => t.status === "done").length;
+                setHistory((h) => [...h, { id: nid(), kind: "notice", text: `  ✓ Todos: ${done}/${list.length} done` }]);
+                collapseTimerRef.current = null;
+            }, 30_000);
+        }
+    }, [working, prompt, onSubmit, pushCurrent, model, exit, drainQueue, noteVisionIfNeeded]);
     // Drain the type-ahead pool: when the turn finishes (working → false) and nothing awaits a choice, COALESCE
     // every pooled message into ONE turn and send it — additions/clarifications go to the agent together, in order.
     useEffect(() => {
@@ -169,6 +374,10 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
         });
     }, [working, prompt, handleSubmit]);
     useInput((input, key) => {
+        if (key.ctrl && input === "t")
+            return setShowTranscript((x) => !x); // open/close the full-transcript overlay
+        if (showTranscript)
+            return; // while open, the overlay's own useInput owns every key (scroll / esc)
         if (prompt) {
             const opts = prompt.options;
             if (key.upArrow)
@@ -209,5 +418,7 @@ export function App({ initialStatus, model, cwd, header, onSubmit, cycleApproval
         else if (key.tab && key.shift && cycleApproval)
             setStatus((s) => ({ ...s, approval: cycleApproval(s.approval) }));
     });
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: header ? [{ id: -1, kind: "notice", text: "" }, ...history] : history, children: (item) => (item.id === -1 ? _jsx(HeaderCard, { ...header }, "hdr") : _jsx(Block, { item: item }, item.id)) }), current.map((item) => (_jsx(Block, { item: item, open: reasoningOpen }, item.id))), working && !prompt && _jsx(Working, {}), prompt && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: "yellow", children: `  ${stripAnsi(prompt.title)}` }), prompt.options.map((o, i) => (_jsx(Text, { color: i === promptSel ? "cyan" : undefined, bold: i === promptSel, children: (i === promptSel ? " ❯ " : "   ") + `${i + 1}. ` + o.label }, i))), _jsx(Text, { dimColor: true, children: `   ↑↓ or 1–${prompt.options.length} to choose · Enter · Esc cancels` })] })), pool.length > 0 && !prompt && (_jsx(Box, { flexDirection: "column", children: pool.map((l, i) => (_jsx(Text, { color: accent(), children: `  › ${l.length > 72 ? l.slice(0, 72) + "…" : l}` }, i))) })), _jsx(InputBox, { status: status, cwd: cwd, isActive: !prompt, working: working, queued: pool.length, vim: vim, onSubmit: handleSubmit, onClipboardImage: onClipboardImage })] }));
+    if (showTranscript)
+        return _jsx(Transcript, { items: [...history, ...current], onClose: () => setShowTranscript(false) });
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: header ? [{ id: -1, kind: "notice", text: "" }, ...history] : history, children: (item) => (item.id === -1 ? _jsx(HeaderCard, { ...header }, "hdr") : _jsx(Block, { item: item }, item.id)) }), current.map((item) => (_jsx(Block, { item: item, open: reasoningOpen }, item.id))), !prompt && _jsx(TodoPanel, { todos: todos }), working && !prompt && _jsx(Working, { todos: todos }), prompt && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: "yellow", children: `  ${stripAnsi(prompt.title)}` }), prompt.options.map((o, i) => (_jsx(Text, { color: i === promptSel ? "cyan" : undefined, bold: i === promptSel, children: (i === promptSel ? " ❯ " : "   ") + `${i + 1}. ` + o.label }, i))), _jsx(Text, { dimColor: true, children: `   ↑↓ or 1–${prompt.options.length} to choose · Enter · Esc cancels` })] })), pool.length > 0 && !prompt && (_jsx(Box, { flexDirection: "column", children: pool.map((l, i) => (_jsx(Text, { color: accent(), children: `  › ${l.length > 72 ? l.slice(0, 72) + "…" : l}` }, i))) })), _jsx(InputBox, { status: status, cwd: cwd, isActive: !prompt, working: working, queued: pool.length, vim: vim, onSubmit: handleSubmit, onClipboardImage: onClipboardImage })] }));
 }

package/dist/tui/run.js

@@ -1,10 +1,45 @@
 // Mounts the hara TUI (ink) and resolves when the user exits. Thin shell — all agent wiring
 // (provider, session history, slash commands, turn execution) is passed in via AppProps.onSubmit
 // from index.ts, which owns that state.
-import { render } from "ink";
+import { render, Box, Text, useApp, useInput } from "ink";
 import { createElement } from "react";
 import { App } from "./App.js";
 export async function runTui(props) {
     const instance = render(createElement(App, props));
     await instance.waitUntilExit();
 }
+// A tiny ink yes/no prompt for pre-TUI confirms (e.g. the first-run "create AGENTS.md?" offer).
+// MUST be ink, NOT readline: a readline question before the main TUI leaves stdin in a state ink
+// can't read from, which kills the input box. ink restores stdin cleanly on unmount, so the main
+// TUI mounted right after still gets working input. Resolves true on y/Enter, false on n/Esc.
+export async function askConfirm(question, def = true) {
+    return new Promise((resolve) => {
+        let done = false;
+        const finish = (v) => {
+            if (!done) {
+                done = true;
+                resolve(v);
+            }
+        };
+        function Prompt() {
+            const { exit } = useApp();
+            useInput((input, key) => {
+                const v = input.toLowerCase();
+                let ans = null;
+                if (key.return)
+                    ans = def;
+                else if (v === "y")
+                    ans = true;
+                else if (v === "n" || key.escape)
+                    ans = false;
+                if (ans !== null) {
+                    finish(ans);
+                    exit();
+                }
+            });
+            return createElement(Box, { marginY: 1 }, createElement(Text, { color: "yellow" }, `  ${question} `), createElement(Text, { dimColor: true }, def ? "[Y/n] " : "[y/N] "));
+        }
+        const inst = render(createElement(Prompt));
+        void inst.waitUntilExit().then(() => finish(def));
+    });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanhara/hara",
-  "version": "0.70.0",
+  "version": "0.95.2",
   "description": "hara — a coding agent CLI that runs like an engineering org.",
   "bin": {
     "hara": "dist/index.js"
@@ -51,6 +51,7 @@
   },
   "dependencies": {
     "@anthropic-ai/sdk": "^0.104.2",
+    "@larksuiteoapi/node-sdk": "^1.68.0",
     "@modelcontextprotocol/sdk": "^1.29.0",
     "commander": "^15.0.0",
     "ink": "^6.8.0",
@@ -65,6 +66,7 @@
     "typescript": "^6.0.3"
   },
   "optionalDependencies": {
-    "@zvec/zvec": "^0.5.0"
+    "@zvec/zvec": "^0.5.0",
+    "qrcode-terminal": "^0.12.0"
   }
 }