whale-code 6.4.0

package/dist/cli/chat/ChatInput.js

@@ -0,0 +1,509 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ChatInput — Custom input with bracketed paste + image attachments
+ *
+ * Replaces ink-text-input with raw stdin handling to fix:
+ * - Paste losing content on enter (newlines in paste triggered submit)
+ * - Multi-line paste mangled/unformatted
+ * - No drag-drop image support
+ *
+ * Features:
+ * - Bracketed paste mode — clean multi-line paste
+ * - Drag-drop images — detects image file paths, attaches as chips
+ * - Image chips above input like Claude Code: [image1.png] [image2.jpg]
+ * - Backspace on empty input removes last image
+ * - Slash command menu preserved
+ * - Multi-line input with ⎸ continuation markers
+ */
+import { useState, useEffect, useRef } from "react";
+import { Box, Text, useInput, useStdin } from "ink";
+import SelectInput from "ink-select-input";
+import { readFileSync, existsSync, statSync } from "fs";
+import { basename, extname } from "path";
+import { colors } from "../shared/Theme.js";
+import { loadKeybindings, bindingToControlChar } from "../services/keybinding-manager.js";
+export const SLASH_COMMANDS = [
+    { name: "/help", description: "Show available commands" },
+    { name: "/tools", description: "List all tools" },
+    { name: "/model", description: "Switch model (Anthropic/Bedrock/Gemini)" },
+    { name: "/compact", description: "Compress conversation context" },
+    { name: "/save", description: "Save session to disk" },
+    { name: "/sessions", description: "List saved sessions" },
+    { name: "/resume", description: "Resume a saved session" },
+    { name: "/mcp", description: "Server connection status" },
+    { name: "/store", description: "Switch active store" },
+    { name: "/status", description: "Show session info" },
+    { name: "/agents", description: "List available agent types" },
+    { name: "/remember", description: "Remember a fact across sessions" },
+    { name: "/forget", description: "Forget a remembered fact" },
+    { name: "/memory", description: "List all remembered facts" },
+    { name: "/mode", description: "Permission mode (default/plan/yolo)" },
+    { name: "/thinking", description: "Toggle extended thinking" },
+    { name: "/rewind", description: "Rewind conversation to earlier point" },
+    { name: "/init", description: "Generate project config (.whale/CLAUDE.md)" },
+    { name: "/update", description: "Check for updates & install" },
+    { name: "/clear", description: "Clear conversation" },
+    { name: "/exit", description: "Exit" },
+];
+// ── Constants ──
+const IMAGE_EXTENSIONS = {
+    ".png": "image/png",
+    ".jpg": "image/jpeg",
+    ".jpeg": "image/jpeg",
+    ".gif": "image/gif",
+    ".webp": "image/webp",
+};
+const MAX_IMAGE_SIZE = 20 * 1024 * 1024; // 20MB
+const MAX_DISPLAY_LINES = 8;
+// ── Helpers ──
+function dividerLine() {
+    const w = (process.stdout.columns || 80) - 2;
+    return "─".repeat(Math.max(20, w));
+}
+function isImagePath(text) {
+    const p = normalizePath(text);
+    if (!p || p.includes("\n"))
+        return false;
+    const ext = extname(p).toLowerCase();
+    return ext in IMAGE_EXTENSIONS && existsSync(p);
+}
+/** Normalize a terminal-pasted path (handles escapes, file:// URLs, quotes) */
+function normalizePath(raw) {
+    let p = raw.trim();
+    // Strip file:// URL prefix + percent-decode
+    if (p.startsWith("file://")) {
+        p = decodeURIComponent(p.replace(/^file:\/\//, ""));
+    }
+    // Strip surrounding quotes
+    p = p.replace(/^['"]|['"]$/g, "");
+    // Unescape backslash-escaped characters (spaces, parens, etc.)
+    p = p.replace(/\\(.)/g, "$1");
+    return p;
+}
+function isFilePath(text) {
+    const p = normalizePath(text);
+    if (!p || p.includes("\n"))
+        return false;
+    // Skip image paths — handled separately
+    const ext = extname(p).toLowerCase();
+    if (ext in IMAGE_EXTENSIONS)
+        return false;
+    try {
+        return existsSync(p) && statSync(p).isFile();
+    }
+    catch {
+        return false;
+    }
+}
+function loadImage(filePath) {
+    try {
+        const p = normalizePath(filePath);
+        const ext = extname(p).toLowerCase();
+        const mediaType = IMAGE_EXTENSIONS[ext];
+        if (!mediaType)
+            return null;
+        const stat = statSync(p);
+        if (stat.size > MAX_IMAGE_SIZE)
+            return null;
+        const data = readFileSync(p);
+        return { path: p, name: basename(p), base64: data.toString("base64"), mediaType };
+    }
+    catch {
+        return null;
+    }
+}
+function getCursorLineCol(text, cursor) {
+    let pos = 0;
+    const lines = text.split("\n");
+    for (let i = 0; i < lines.length; i++) {
+        if (cursor <= pos + lines[i].length) {
+            return { line: i, col: cursor - pos };
+        }
+        pos += lines[i].length + 1;
+    }
+    return { line: lines.length - 1, col: lines[lines.length - 1].length };
+}
+// ── Component ──
+export function ChatInput({ onSubmit, onCommand, disabled, agentName }) {
+    const { stdin } = useStdin();
+    // Input state — ref for synchronous handler access, state for render
+    const inputRef = useRef({ value: "", cursor: 0 });
+    const [displayValue, setDisplayValue] = useState("");
+    const [displayCursor, setDisplayCursor] = useState(0);
+    // Mode & attachments
+    const [menuMode, setMenuMode] = useState(false);
+    const [menuFilter, setMenuFilter] = useState("");
+    const [images, setImages] = useState([]);
+    const imagesRef = useRef([]);
+    const [files, setFiles] = useState([]);
+    const filesRef = useRef([]);
+    // Input history (up/down arrow recall)
+    const historyRef = useRef([]);
+    const historyIndexRef = useRef(-1);
+    const savedInputRef = useRef("");
+    const MAX_HISTORY = 50;
+    // Paste tracking
+    const isPasting = useRef(false);
+    const pasteBuffer = useRef("");
+    // Multi-line paste — stored separately, displayed as chip
+    const [pastedText, setPastedText] = useState(null);
+    const pastedTextRef = useRef(null);
+    // Sync refs
+    useEffect(() => { imagesRef.current = images; }, [images]);
+    useEffect(() => { filesRef.current = files; }, [files]);
+    useEffect(() => { pastedTextRef.current = pastedText; }, [pastedText]);
+    // ── Enable bracketed paste mode ──
+    useEffect(() => {
+        process.stdout.write("\x1b[?2004h");
+        return () => { process.stdout.write("\x1b[?2004l"); };
+    }, []);
+    // ── Update helper ──
+    function update(value, cursor) {
+        inputRef.current = { value, cursor };
+        setDisplayValue(value);
+        setDisplayCursor(cursor);
+    }
+    // ── Process paste content ──
+    function processPaste(text) {
+        const clean = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
+        // Check if ALL non-empty lines are image paths → attach them
+        const lines = clean.split("\n").map(l => l.trim()).filter(Boolean);
+        if (lines.length > 0 && lines.every(l => isImagePath(l))) {
+            const newImages = [];
+            for (const line of lines) {
+                const img = loadImage(line);
+                if (img)
+                    newImages.push(img);
+            }
+            if (newImages.length > 0) {
+                setImages(prev => [...prev, ...newImages]);
+                return;
+            }
+        }
+        // Check for non-image file paths → attach as file chips
+        if (lines.length > 0 && lines.length <= 4 && lines.every(l => isFilePath(l))) {
+            const newFiles = lines.map(l => {
+                const p = normalizePath(l);
+                return { path: p, name: basename(p) };
+            });
+            setFiles(prev => [...prev, ...newFiles]);
+            return;
+        }
+        // Slash command pasted directly (must look like /word, not an absolute path)
+        if (clean.startsWith("/") && !clean.includes("\n") && !clean.includes("/", 1) && inputRef.current.value === "") {
+            onCommand(clean.trim());
+            update("", 0);
+            return;
+        }
+        // Multi-line paste → store as chip, don't spam input
+        const pasteLines = clean.split("\n");
+        if (pasteLines.length >= 4) {
+            setPastedText(clean);
+            return;
+        }
+        // Short paste — insert inline as before
+        const { value: val, cursor: cur } = inputRef.current;
+        const newValue = val.slice(0, cur) + clean + val.slice(cur);
+        update(newValue, cur + clean.length);
+    }
+    // ── Handle submit ──
+    function handleSubmit() {
+        const typed = inputRef.current.value.trim();
+        const paste = pastedTextRef.current;
+        const imgs = imagesRef.current;
+        const fls = filesRef.current;
+        if (!typed && !paste && imgs.length === 0 && fls.length === 0)
+            return;
+        if (typed.startsWith("/") && !paste && imgs.length === 0 && fls.length === 0) {
+            update("", 0);
+            onCommand(typed);
+            return;
+        }
+        // Build file context prefix
+        const filePrefix = fls.length > 0
+            ? fls.map(f => f.path).join("\n") + "\n\n"
+            : "";
+        // Combine file prefix + typed text + pasted content
+        const body = paste
+            ? (typed ? `${typed}\n\n${paste}` : paste)
+            : typed;
+        const fullText = filePrefix + body;
+        // Record in history
+        if (fullText.trim()) {
+            historyRef.current.push(fullText.trim());
+            if (historyRef.current.length > MAX_HISTORY)
+                historyRef.current.shift();
+        }
+        historyIndexRef.current = -1;
+        onSubmit(fullText, imgs.length > 0 ? imgs : undefined);
+        update("", 0);
+        setImages([]);
+        setFiles([]);
+        setPastedText(null);
+    }
+    // ── Raw stdin handler ──
+    useEffect(() => {
+        if (!stdin || disabled || menuMode)
+            return;
+        const onData = (data) => {
+            const str = data.toString("utf-8");
+            // ── Bracketed paste detection ──
+            if (str.includes("\x1b[200~")) {
+                isPasting.current = true;
+                let text = str.replace(/\x1b\[200~/g, "").replace(/\x1b\[201~/g, "");
+                pasteBuffer.current += text;
+                if (str.includes("\x1b[201~")) {
+                    isPasting.current = false;
+                    const paste = pasteBuffer.current;
+                    pasteBuffer.current = "";
+                    processPaste(paste);
+                }
+                return;
+            }
+            if (isPasting.current) {
+                if (str.includes("\x1b[201~")) {
+                    isPasting.current = false;
+                    pasteBuffer.current += str.replace(/\x1b\[201~/g, "");
+                    const paste = pasteBuffer.current;
+                    pasteBuffer.current = "";
+                    processPaste(paste);
+                }
+                else {
+                    pasteBuffer.current += str;
+                }
+                return;
+            }
+            // ── Control chars handled by ChatApp (keybinding-aware) ──
+            const _kb = loadKeybindings();
+            const exitChar = bindingToControlChar(_kb.exit);
+            const expandChar = bindingToControlChar(_kb.toggle_expand);
+            const thinkingChar = bindingToControlChar(_kb.toggle_thinking);
+            if (str === exitChar || str === expandChar || str === thinkingChar)
+                return;
+            // ── Enter ──
+            if (str === "\r" || str === "\n") {
+                handleSubmit();
+                return;
+            }
+            // ── Tab ── (no-op in input)
+            if (str === "\t")
+                return;
+            // ── Backspace ──
+            if (str === "\x7f" || str === "\b") {
+                const { value: val, cursor: cur } = inputRef.current;
+                if (cur > 0) {
+                    update(val.slice(0, cur - 1) + val.slice(cur), cur - 1);
+                }
+                else if (val === "") {
+                    // Empty input + backspace → remove paste chip, then files, then images
+                    if (pastedTextRef.current) {
+                        setPastedText(null);
+                    }
+                    else if (filesRef.current.length > 0) {
+                        setFiles(prev => prev.slice(0, -1));
+                    }
+                    else if (imagesRef.current.length > 0) {
+                        setImages(prev => prev.slice(0, -1));
+                    }
+                }
+                return;
+            }
+            // ── Clear line (default: Ctrl+U) ──
+            if (str === bindingToControlChar(_kb.clear_line)) {
+                update("", 0);
+                setImages([]);
+                setFiles([]);
+                setPastedText(null);
+                return;
+            }
+            // ── Delete word (default: Ctrl+W) ──
+            if (str === bindingToControlChar(_kb.delete_word)) {
+                const { value: val, cursor: cur } = inputRef.current;
+                const before = val.slice(0, cur);
+                const match = before.match(/\S+\s*$/);
+                if (match) {
+                    const len = match[0].length;
+                    update(val.slice(0, cur - len) + val.slice(cur), cur - len);
+                }
+                return;
+            }
+            // ── Home (default: Ctrl+A) ──
+            if (str === bindingToControlChar(_kb.home)) {
+                update(inputRef.current.value, 0);
+                return;
+            }
+            // ── Escape sequences ──
+            if (str.startsWith("\x1b[")) {
+                const { value: val, cursor: cur } = inputRef.current;
+                if (str === "\x1b[C") { // Right
+                    update(val, Math.min(cur + 1, val.length));
+                }
+                else if (str === "\x1b[D") { // Left
+                    update(val, Math.max(cur - 1, 0));
+                }
+                else if (str === "\x1b[H" || str === "\x1b[1~") { // Home
+                    update(val, 0);
+                }
+                else if (str === "\x1b[F" || str === "\x1b[4~") { // End
+                    update(val, val.length);
+                }
+                else if (str === "\x1b[3~") { // Delete
+                    if (cur < val.length) {
+                        update(val.slice(0, cur) + val.slice(cur + 1), cur);
+                    }
+                }
+                else if (str === "\x1b[A" || str === "\x1b[B") { // Up/Down
+                    const lines = val.split("\n");
+                    if (lines.length > 1) {
+                        // Multi-line: navigate lines
+                        const { line: curLine, col: curCol } = getCursorLineCol(val, cur);
+                        const targetLine = str === "\x1b[A"
+                            ? Math.max(0, curLine - 1)
+                            : Math.min(lines.length - 1, curLine + 1);
+                        if (targetLine !== curLine) {
+                            const targetCol = Math.min(curCol, lines[targetLine].length);
+                            let newCursor = 0;
+                            for (let i = 0; i < targetLine; i++)
+                                newCursor += lines[i].length + 1;
+                            newCursor += targetCol;
+                            update(val, newCursor);
+                        }
+                    }
+                    else if (str === "\x1b[A") {
+                        // Up arrow — history recall
+                        if (historyRef.current.length === 0) { /* no history */ }
+                        else {
+                            if (historyIndexRef.current === -1)
+                                savedInputRef.current = val;
+                            const newIdx = Math.min(historyIndexRef.current + 1, historyRef.current.length - 1);
+                            historyIndexRef.current = newIdx;
+                            const hist = historyRef.current[historyRef.current.length - 1 - newIdx];
+                            update(hist, hist.length);
+                        }
+                    }
+                    else {
+                        // Down arrow — forward in history
+                        if (historyIndexRef.current <= -1) { /* already at current */ }
+                        else {
+                            const newIdx = historyIndexRef.current - 1;
+                            historyIndexRef.current = newIdx;
+                            if (newIdx < 0) {
+                                update(savedInputRef.current, savedInputRef.current.length);
+                            }
+                            else {
+                                const hist = historyRef.current[historyRef.current.length - 1 - newIdx];
+                                update(hist, hist.length);
+                            }
+                        }
+                    }
+                }
+                // Ignore unrecognized escape sequences
+                return;
+            }
+            // ── Standalone escape — clear input if non-empty ──
+            if (str === "\x1b") {
+                const { value } = inputRef.current;
+                if (value || filesRef.current.length > 0) {
+                    update("", 0);
+                    setImages([]);
+                    setFiles([]);
+                    setPastedText(null);
+                }
+                return;
+            }
+            // ── Multi-character non-escape = paste without brackets ──
+            if (str.length > 1 && !str.startsWith("\x1b")) {
+                const codePoints = [...str];
+                if (codePoints.length === 1) {
+                    // Single code point (emoji etc.)
+                    const { value: val, cursor: cur } = inputRef.current;
+                    update(val.slice(0, cur) + str + val.slice(cur), cur + str.length);
+                }
+                else {
+                    processPaste(str);
+                }
+                return;
+            }
+            // ── Single printable character ──
+            if (str.length === 1 && str.charCodeAt(0) >= 0x20) {
+                const { value: val, cursor: cur } = inputRef.current;
+                // Slash menu trigger
+                if (str === "/" && val === "") {
+                    setMenuMode(true);
+                    setMenuFilter("");
+                    return;
+                }
+                update(val.slice(0, cur) + str + val.slice(cur), cur + 1);
+            }
+        };
+        stdin.on("data", onData);
+        return () => { stdin.off("data", onData); };
+    }, [stdin, disabled, menuMode]); // eslint-disable-line react-hooks/exhaustive-deps
+    // ── Menu input — filter + dismiss (uses Ink's useInput for SelectInput compatibility) ──
+    useInput((input, key) => {
+        if (!menuMode || disabled)
+            return;
+        if (key.escape) {
+            setMenuMode(false);
+            setMenuFilter("");
+            return;
+        }
+        if (key.backspace || key.delete) {
+            setMenuFilter(prev => {
+                if (prev.length > 0)
+                    return prev.slice(0, -1);
+                setMenuMode(false);
+                return "";
+            });
+            return;
+        }
+        // Printable character → append to filter
+        if (input && !key.ctrl && !key.meta && !key.return && !key.tab) {
+            setMenuFilter(prev => prev + input);
+        }
+    }, { isActive: menuMode });
+    const handleMenuSelect = (item) => {
+        setMenuMode(false);
+        setMenuFilter("");
+        update("", 0);
+        onCommand(item.value);
+    };
+    // ── Render ──
+    const divider = dividerLine();
+    // Disabled — minimal divider
+    if (disabled) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: " " }), _jsx(Text, { color: colors.separator, children: divider })] }));
+    }
+    // Slash command menu
+    if (menuMode) {
+        const q = menuFilter.toLowerCase();
+        const filtered = q
+            ? SLASH_COMMANDS.filter(c => c.name.includes(q) || c.description.toLowerCase().includes(q))
+            : SLASH_COMMANDS;
+        const items = filtered.map((c) => ({
+            label: c.name,
+            value: c.name,
+        }));
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: " " }), _jsx(Text, { color: colors.separator, children: divider }), _jsxs(Box, { children: [_jsx(Text, { color: colors.brand, bold: true, children: "/ " }), menuFilter ? (_jsxs(Text, { children: [menuFilter, _jsx(Text, { inverse: true, children: " " })] })) : (_jsxs(Text, { children: [_jsx(Text, { inverse: true, children: " " }), _jsx(Text, { color: colors.dim, children: " type to filter" })] }))] }), items.length > 0 ? (_jsx(SelectInput, { items: items, onSelect: handleMenuSelect, indicatorComponent: ({ isSelected = false }) => (_jsxs(Text, { color: isSelected ? colors.brand : colors.quaternary, children: [isSelected ? "›" : " ", " "] })), itemComponent: ({ isSelected = false, label = "" }) => {
+                        const cmd = SLASH_COMMANDS.find((c) => c.name === label);
+                        return (_jsxs(Text, { children: [_jsx(Text, { color: isSelected ? colors.brand : colors.secondary, bold: isSelected, children: label }), _jsxs(Text, { color: colors.tertiary, children: ["  ", cmd?.description] })] }));
+                    } })) : (_jsx(Text, { color: colors.tertiary, children: "  no matching commands" })), _jsx(Text, { color: colors.quaternary, children: "  esc to dismiss" })] }));
+    }
+    // ── Normal input rendering ──
+    const lines = displayValue.split("\n");
+    const { line: cursorLine, col: cursorCol } = displayValue
+        ? getCursorLineCol(displayValue, displayCursor)
+        : { line: 0, col: 0 };
+    // Truncate display for very long pastes
+    const isTruncated = lines.length > MAX_DISPLAY_LINES;
+    const visibleLines = isTruncated
+        ? [...lines.slice(0, MAX_DISPLAY_LINES - 1), `… ${lines.length - MAX_DISPLAY_LINES + 1} more lines`]
+        : lines;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: " " }), (images.length > 0 || files.length > 0 || pastedText) && (_jsxs(Box, { children: [_jsx(Text, { children: "  " }), images.map((img, i) => (_jsxs(Text, { children: [_jsx(Text, { color: colors.indigo, children: "[" }), _jsx(Text, { color: colors.secondary, children: img.name }), _jsx(Text, { color: colors.indigo, children: "]" }), _jsx(Text, { children: " " })] }, `img-${i}`))), files.map((f, i) => (_jsxs(Text, { children: [_jsx(Text, { color: colors.purple, children: "[" }), _jsx(Text, { color: colors.secondary, children: f.name }), _jsx(Text, { color: colors.purple, children: "]" }), _jsx(Text, { children: " " })] }, `file-${i}`))), pastedText && (_jsxs(Text, { children: [_jsx(Text, { color: colors.indigo, children: "[" }), _jsxs(Text, { color: colors.secondary, children: ["pasted ", pastedText.split("\n").length, " lines"] }), _jsx(Text, { color: colors.indigo, children: "]" })] }))] })), _jsx(Text, { color: colors.separator, children: divider }), _jsx(Text, { children: " " }), lines.length <= 1 ? (_jsxs(Box, { children: [_jsx(Text, { color: colors.brand, bold: true, children: "❯ " }), !displayValue ? (_jsxs(Text, { children: [_jsx(Text, { inverse: true, children: " " }), _jsx(Text, { color: colors.dim, children: `Message ${agentName || "whale"}, or type / for commands` })] })) : (_jsxs(Text, { children: [displayValue.slice(0, displayCursor), _jsx(Text, { inverse: true, children: displayCursor < displayValue.length ? displayValue[displayCursor] : " " }), displayCursor < displayValue.length ? displayValue.slice(displayCursor + 1) : ""] }))] })) : (
+            /* Multi-line input */
+            _jsx(Box, { flexDirection: "column", children: visibleLines.map((line, i) => {
+                    const isRealLine = !isTruncated || i < MAX_DISPLAY_LINES - 1;
+                    const isCursorOnLine = isRealLine && i === cursorLine;
+                    return (_jsxs(Box, { children: [_jsx(Text, { color: colors.brand, bold: true, children: i === 0 ? "❯ " : "⎸ " }), isCursorOnLine ? (_jsxs(Text, { children: [line.slice(0, cursorCol), _jsx(Text, { inverse: true, children: cursorCol < line.length ? line[cursorCol] : " " }), cursorCol < line.length ? line.slice(cursorCol + 1) : ""] })) : (_jsx(Text, { color: isRealLine ? undefined : colors.tertiary, children: line }))] }, i));
+                }) }))] }));
+}

package/dist/cli/chat/MarkdownText.d.ts

@@ -0,0 +1,10 @@
+/**
+ * MarkdownText — renders markdown as ANSI-styled terminal output
+ */
+interface MarkdownTextProps {
+    text: string;
+    /** When true, closes incomplete fences for safe mid-stream display. Default: false. */
+    streaming?: boolean;
+}
+export declare function MarkdownText({ text, streaming }: MarkdownTextProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cli/chat/MarkdownText.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * MarkdownText — renders markdown as ANSI-styled terminal output
+ */
+import { useMemo } from "react";
+import { Text } from "ink";
+import { renderMarkdown } from "../shared/markdown.js";
+export function MarkdownText({ text, streaming = false }) {
+    const rendered = useMemo(() => {
+        if (!text)
+            return "";
+        try {
+            return renderMarkdown(text, streaming);
+        }
+        catch {
+            return text;
+        }
+    }, [text, streaming]);
+    return _jsx(Text, { children: rendered });
+}

package/dist/cli/chat/MessageList.d.ts

@@ -0,0 +1,37 @@
+/**
+ * MessageList — types and CompletedMessage component
+ *
+ * CompletedMessage is React.memo'd to prevent re-renders during streaming.
+ * Telemetry footer: tokens, cost estimate, tool count.
+ * Minimal Box usage — Text-first for reliable rendering.
+ */
+import React from "react";
+import { type CompletedSubagentInfo } from "./SubagentPanel.js";
+export interface ToolCall {
+    name: string;
+    status: "running" | "success" | "error";
+    result?: string;
+    input?: Record<string, unknown>;
+    durationMs?: number;
+}
+export interface ChatMessage {
+    role: "user" | "assistant";
+    text: string;
+    images?: string[];
+    toolCalls?: ToolCall[];
+    completedSubagents?: CompletedSubagentInfo[];
+    usage?: {
+        input_tokens: number;
+        output_tokens: number;
+        thinking_tokens?: number;
+        model?: string;
+        costUsd?: number;
+        cache_read_tokens?: number;
+        cache_creation_tokens?: number;
+    };
+}
+export declare const CompletedMessage: React.NamedExoticComponent<{
+    msg: ChatMessage;
+    index: number;
+    toolsExpanded: boolean;
+}>;

package/dist/cli/chat/MessageList.js

@@ -0,0 +1,80 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * MessageList — types and CompletedMessage component
+ *
+ * CompletedMessage is React.memo'd to prevent re-renders during streaming.
+ * Telemetry footer: tokens, cost estimate, tool count.
+ * Minimal Box usage — Text-first for reliable rendering.
+ */
+import React, { useMemo } from "react";
+import { Box, Text } from "ink";
+import { ToolIndicator } from "./ToolIndicator.js";
+import { MarkdownText } from "./MarkdownText.js";
+import { CompletedSubagentTree } from "./SubagentPanel.js";
+import { colors } from "../shared/Theme.js";
+import { contentWidth } from "../shared/markdown.js";
+import { MODEL_PRICING } from "../../shared/agent-core.js";
+// ============================================================================
+// HELPERS
+// ============================================================================
+function estimateCost(input, output, model, precomputedCost) {
+    // Use precomputed cost if available (accurate for all providers)
+    let cost = precomputedCost;
+    if (cost == null) {
+        // Fall back to model-specific pricing, then Sonnet as default
+        const pricing = (model && MODEL_PRICING[model])
+            || MODEL_PRICING[Object.keys(MODEL_PRICING).find(k => model?.startsWith(k)) ?? ""]
+            || MODEL_PRICING["claude-sonnet-4-6"];
+        cost = (input * pricing.inputPer1M + output * pricing.outputPer1M) / 1_000_000;
+    }
+    if (cost < 0.001)
+        return "<$0.001";
+    if (cost < 0.01)
+        return `$${cost.toFixed(4)}`;
+    return `$${cost.toFixed(3)}`;
+}
+function formatTokens(n) {
+    if (n < 1000)
+        return String(n);
+    if (n < 10000)
+        return `${(n / 1000).toFixed(1)}k`;
+    return `${Math.round(n / 1000)}k`;
+}
+function totalToolDuration(toolCalls) {
+    return toolCalls.reduce((sum, tc) => sum + (tc.durationMs || 0), 0);
+}
+function formatMs(ms) {
+    if (ms < 1000)
+        return `${ms}ms`;
+    if (ms < 10000)
+        return `${(ms / 1000).toFixed(1)}s`;
+    return `${Math.round(ms / 1000)}s`;
+}
+/**
+ * Group consecutive tool calls with the same name and input into groups.
+ * Identical consecutive calls collapse into one entry with count > 1.
+ * Caches previous key to avoid redundant JSON.stringify calls.
+ */
+function groupConsecutiveTools(toolCalls) {
+    const groups = [];
+    let prevKey = "";
+    for (const tc of toolCalls) {
+        const key = tc.name + "|" + tc.status + "|" + JSON.stringify(tc.input || {});
+        if (key === prevKey && groups.length > 0) {
+            groups[groups.length - 1].count++;
+        }
+        else {
+            groups.push({ tool: tc, count: 1 });
+            prevKey = key;
+        }
+    }
+    return groups;
+}
+// ============================================================================
+// COMPLETED MESSAGE — memoized, never re-renders during streaming
+// ============================================================================
+export const CompletedMessage = React.memo(function CompletedMessage({ msg, index, toolsExpanded }) {
+    const cw = Math.max(20, contentWidth());
+    const toolGroups = useMemo(() => msg.toolCalls ? groupConsecutiveTools(msg.toolCalls) : [], [msg.toolCalls]);
+    return (_jsxs(Box, { flexDirection: "column", children: [msg.role === "user" && index > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsx(Text, { color: colors.separator, children: "─".repeat(cw) })] })), msg.role === "user" ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: " " }), msg.images && msg.images.length > 0 && (_jsx(Box, { marginLeft: 2, children: msg.images.map((name, i) => (_jsxs(Text, { children: [_jsx(Text, { color: colors.indigo, children: "[" }), _jsx(Text, { color: colors.secondary, children: name }), _jsx(Text, { color: colors.indigo, children: "]" }), _jsx(Text, { children: " " })] }, i))) })), _jsxs(Text, { children: [_jsx(Text, { color: colors.brand, bold: true, children: "❯ " }), _jsx(Text, { color: colors.user, children: msg.text })] })] })) : (_jsxs(Box, { flexDirection: "column", children: [toolGroups.length > 0 && (_jsx(Box, { flexDirection: "column", marginLeft: 2, marginTop: 1, children: toolGroups.map((group, j) => (_jsx(ToolIndicator, { id: `done-${index}-${j}`, name: group.tool.name, status: group.tool.status, result: group.tool.result, input: group.tool.input, durationMs: group.tool.durationMs, expanded: toolsExpanded, count: group.count }, j))) })), msg.completedSubagents && msg.completedSubagents.length > 0 && (_jsx(CompletedSubagentTree, { agents: msg.completedSubagents })), msg.text && (_jsxs(Box, { flexDirection: "column", marginLeft: 2, children: [_jsx(Text, { children: " " }), _jsx(MarkdownText, { text: msg.text })] })), msg.usage && (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsxs(Text, { children: ["  ", _jsxs(Text, { color: colors.quaternary, children: [formatTokens(msg.usage.input_tokens), _jsx(Text, { color: colors.indigo, children: "\u2191" }), " ", formatTokens(msg.usage.output_tokens), _jsx(Text, { color: colors.purple, children: "\u2193" }), msg.usage.thinking_tokens ? (_jsxs(_Fragment, { children: [" ", formatTokens(msg.usage.thinking_tokens), _jsx(Text, { color: colors.warning, children: "T" })] })) : null, msg.usage.cache_read_tokens ? (_jsxs(_Fragment, { children: [" ", formatTokens(msg.usage.cache_read_tokens), _jsx(Text, { color: colors.success, children: "C" })] })) : null] }), _jsxs(Text, { color: colors.quaternary, children: ["  ", estimateCost(msg.usage.input_tokens, msg.usage.output_tokens, msg.usage.model, msg.usage.costUsd)] }), msg.toolCalls && msg.toolCalls.length > 0 ? (_jsxs(Text, { color: colors.quaternary, children: ["  ", msg.toolCalls.length, " tool", msg.toolCalls.length !== 1 ? "s" : "", "  ", formatMs(totalToolDuration(msg.toolCalls))] })) : null] })] }))] }))] }));
+});