min-agent 0.3.0 → 0.4.0

package/dist/tui/MessageList.js

@@ -2,10 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useMemo, useEffect, useRef, useState, useCallback } from "react";
 import { Box, Text, useInput, useStdin } from "ink";
 import { MarkdownRenderer } from "../markdown.js";
-import { wrapByWidth, charWidth, displayWidth } from "./text-width.js";
+import { wrapByWidth, clustersOf, displayWidth } from "./text-width.js";
+import { messageTextWidth } from "./layout.js";
 import { scanSgrMouse, WHEEL_UP, WHEEL_DOWN, MOTION } from "./mouse.js";
-import { applySelection, extractText, selectionRanges } from "./selection.js";
+import { applySelection, selectionRanges, stripAnsi, textFromSelection, wordRangeAt, mouseToCell, splitRangeAt, alignPartSelections, visualPrefix, } from "./selection.js";
 import { createDragMachine, clearDrag, stepDrag } from "./drag-state.js";
+import { createClickCounter, noteClick } from "./click-count.js";
 import { writeClipboard } from "../clipboard.js";
 const RESET = "\x1b[0m";
 /** Split a single ANSI-formatted line into physical rows of at most `maxWidth`
@@ -25,15 +27,14 @@ function splitAnsiRows(line, maxWidth) {
             current += token;
             continue;
         }
-        for (const ch of token) {
-            const w = charWidth(ch);
+        for (const { text: g, width: w } of clustersOf(token)) {
             if (width > 0 && width + w > maxWidth) {
                 rows.push(current + RESET);
-                current = prefix + ch;
+                current = prefix + g;
                 width = w;
             }
             else {
-                current += ch;
+                current += g;
                 width += w;
             }
         }
@@ -45,11 +46,10 @@ function splitAnsiRows(line, maxWidth) {
 function clipToWidth(text, maxWidth) {
     let shown = "";
     let width = 0;
-    for (const ch of text) {
-        const w = charWidth(ch);
+    for (const { text: g, width: w } of clustersOf(text)) {
         if (width + w > maxWidth)
             break;
-        shown += ch;
+        shown += g;
         width += w;
     }
     return shown;
@@ -74,34 +74,37 @@ function resultPreviewLines(result) {
  * default; clicking the row (see MessageList) toggles `expanded` to reveal the
  * full tool result. */
 export function messageLines(msg, columns, expanded) {
-    const textWidth = Math.max(1, columns - 1); // Box paddingLeft
+    const textWidth = messageTextWidth(columns);
     switch (msg.role) {
         case "user":
             return wrapByWidth(`> ${msg.content}`, textWidth);
         case "assistant": {
-            const md = new MarkdownRenderer();
-            const rendered = md.write(msg.content) + md.flush();
-            const raw = rendered.replace(/\n$/, "");
-            if (raw === "")
-                return [];
-            const lines = raw.split("\n");
-            // Drop leading/trailing blank lines (models often pad around tool calls)
-            // so a whitespace-only or padded message doesn't leave empty rows.
-            let start = 0;
-            let end = lines.length;
-            while (start < end && lines[start].trim() === "")
-                start++;
-            while (end > start && lines[end - 1].trim() === "")
-                end--;
-            if (start === end)
-                return [];
-            const rows = [];
-            for (let i = start; i < end; i++)
-                rows.push(...splitAnsiRows(lines[i], textWidth));
-            return rows;
+            try {
+                const md = new MarkdownRenderer();
+                const rendered = md.write(typeof msg.content === "string" ? msg.content : String(msg.content ?? "")) + md.flush();
+                const raw = rendered.replace(/\n$/, "");
+                if (raw === "")
+                    return [];
+                const lines = raw.split("\n");
+                let start = 0;
+                let end = lines.length;
+                while (start < end && lines[start].trim() === "")
+                    start++;
+                while (end > start && lines[end - 1].trim() === "")
+                    end--;
+                if (start === end)
+                    return [];
+                const rows = [];
+                for (let i = start; i < end; i++)
+                    rows.push(...splitAnsiRows(lines[i], textWidth));
+                return rows;
+            }
+            catch {
+                return wrapByWidth(typeof msg.content === "string" ? msg.content : String(msg.content ?? ""), textWidth);
+            }
         }
         case "thinking":
-            return msg.content && msg.content.trim() ? wrapByWidth(msg.content, textWidth) : [];
+            return msg.content?.trim() ? wrapByWidth(msg.content, textWidth) : [];
         case "tool": {
             const name = msg.toolName ?? "";
             // The call summary is a single logical line; collapse any stray newlines
@@ -111,14 +114,18 @@ export function messageLines(msg, columns, expanded) {
             const contentWidth = Math.max(1, textWidth - displayWidth(label));
             if (!expanded) {
                 const tail = msg.toolResultSummary ? ` → ${msg.toolResultSummary}` : "";
-                if (displayWidth(call + tail) <= contentWidth)
-                    return [`${label}${call}${tail}`];
-                // The result summary is the more informative half, so the arguments
-                // give way first.
-                const room = Math.max(1, contentWidth - displayWidth(tail) - 1);
-                return [`${label}${clipToWidth(call, room)}…${tail}`];
+                const packed = displayWidth(call + tail) <= contentWidth
+                    ? `${label}${call}${tail}`
+                    : `${label}${clipToWidth(call, Math.max(1, contentWidth - displayWidth(tail) - 1))}…${tail}`;
+                return [clipToWidth(packed, textWidth)];
             }
             const rows = wrapByWidth(`${label}${call}`, textWidth);
+            if (msg.toolChildren && msg.toolChildren.length > 0) {
+                for (const child of msg.toolChildren) {
+                    const summary = child.summary ? ` ${child.summary}` : "";
+                    rows.push(...wrapByWidth(`  ↳ ${child.name}${summary}`, textWidth));
+                }
+            }
             const result = msg.toolResult;
             if (result && result.trim() !== "") {
                 for (const line of resultPreviewLines(result)) {
@@ -158,6 +165,7 @@ function cacheKey(msg, columns, expanded) {
         expanded ? "1" : "0",
         msg.toolName ?? "",
         msg.toolResultSummary ?? "",
+        (msg.toolChildren ?? []).map((c) => `${c.name}:${c.summary}`).join("|"),
     ].join("\u0000");
 }
 function cachedMessageLines(msg, columns, expanded) {
@@ -179,11 +187,16 @@ const MARGIN = 1;
 function messageRowCount(msg, columns, expanded) {
     return cachedMessageLines(msg, columns, expanded).length + (msg.role === "user" ? MARGIN : 0);
 }
+/** Rows a window actually paints: content plus one indicator per hidden side. */
+export function slicePaintRows(slice) {
+    return slice.winBottom - slice.winTop + (slice.above > 0 ? 1 : 0) + (slice.below > 0 ? 1 : 0);
+}
 /**
  * Compute the visible window of a message list for `maxHeight` rows, given
  * the physical row count of each message and an optional scroll offset
- * (`null` = stick to the bottom). One row is reserved for the hidden
- * indicator when either side has hidden content.
+ * (`null` = stick to the bottom). Each hidden side (above / below) takes its
+ * own indicator row, and those rows are subtracted from the content budget
+ * so the painted window never exceeds `maxHeight`.
  */
 export function sliceWindow(messages, rowCounts, maxHeight, top) {
     const total = rowCounts.reduce((a, b) => a + b, 0);
@@ -196,13 +209,16 @@ export function sliceWindow(messages, rowCounts, maxHeight, top) {
             parts: messages.map((msg, i) => ({ msg, start: 0, count: rowCounts[i] ?? 0 })),
         };
     }
-    // The indicator row feeds back into the view height; two passes settle.
+    // Indicator rows depend on whether the window has hidden content on each
+    // side, which depends on view height — iterate until the chrome settles
+    // (0 → 1 → 2 indicators).
     let above = 0;
     let below = 0;
     let winTop = 0;
     let viewH = maxHeight;
-    for (let pass = 0; pass < 2; pass++) {
-        viewH = maxHeight - (above > 0 || below > 0 ? 1 : 0);
+    for (let pass = 0; pass < 3; pass++) {
+        const chrome = (above > 0 ? 1 : 0) + (below > 0 ? 1 : 0);
+        viewH = Math.max(1, maxHeight - chrome);
         const maxTop = Math.max(0, total - viewH);
         winTop = top === null ? maxTop : Math.min(top, maxTop);
         above = winTop;
@@ -228,7 +244,7 @@ export function sliceWindow(messages, rowCounts, maxHeight, top) {
  * lost. Without `maxHeight` (terminal height unknown) messages flow
  * naturally.
  */
-export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice }) {
+export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice, selectionMode, onExitSelectionMode, interactive = true, }) {
     const [windowTop, setWindowTop] = useState(null);
     const [expanded, setExpanded] = useState(new Set());
     const [selection, setSelection] = useState(null);
@@ -244,47 +260,29 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
     const area = useMemo(() => buildArea(slice, columns, expanded), [slice, columns, expanded]);
     const areaRef = useRef(area.rows);
     areaRef.current = area.rows;
+    const kindsRef = useRef(area.kinds);
+    kindsRef.current = area.kinds;
+    const partMetaRef = useRef(area.partMeta);
+    partMetaRef.current = area.partMeta;
     const onCopyRef = useRef(onCopyNotice);
     onCopyRef.current = onCopyNotice;
+    const selectionModeRef = useRef(Boolean(selectionMode));
+    selectionModeRef.current = Boolean(selectionMode);
+    const lastCellRef = useRef(null);
+    const clicks = useRef(createClickCounter());
     // Terminal coordinates (1-based) → selection module coordinates: rows index
     // into `area.rows`, columns start at terminal col 2 (paddingLeft=1).
-    const toCell = (p) => ({ row: p.row - 1, col: p.col - 2 });
+    const toCell = (p) => mouseToCell(area.rows, p.row, p.col);
     // Per-part highlight ranges, aligned with each part's shown lines. Null
     // while no selection is active so MessageRow keeps its memo hit.
     const ranges = selection ? selectionRanges(area.rows, toCell(selection.anchor), toCell(selection.cur)) : null;
-    const partSelections = (() => {
-        if (!ranges)
-            return null;
-        const map = new Map();
-        for (let i = 0; i < ranges.length; i++) {
-            const meta = area.partMeta[i];
-            const range = ranges[i];
-            if (!meta || !range)
-                continue;
-            let arr = map.get(meta.part);
-            if (!arr) {
-                arr = [];
-                map.set(meta.part, arr);
-            }
-            arr[meta.shown] = range;
-        }
-        return map;
-    })();
+    const partSelections = ranges ? alignPartSelections(ranges, area.partMeta) : null;
     // Mouse release after a drag: turn the terminal-coordinate selection into
     // the selected text and push it to the clipboard. The highlight stays until
     // the next click/key/wheel.
     const finalizeCopy = useCallback((sel) => {
         const rows = areaRef.current;
-        const ranges = selectionRanges(rows, toCell(sel.anchor), toCell(sel.cur));
-        const parts = [];
-        for (let i = 0; i < ranges.length; i++) {
-            const range = ranges[i];
-            if (range && rows[i])
-                parts.push(extractText(rows[i], range.start, range.end));
-        }
-        while (parts.length > 0 && parts[parts.length - 1] === "")
-            parts.pop();
-        const text = parts.join("\n");
+        const text = textFromSelection(rows, kindsRef.current, selectionRanges(rows, mouseToCell(rows, sel.anchor.row, sel.anchor.col), mouseToCell(rows, sel.cur.row, sel.cur.col)));
         if (text === "")
             onCopyRef.current?.("未选中文本");
         else if (writeClipboard(text))
@@ -294,6 +292,50 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
     }, []);
     const finalizeRef = useRef(finalizeCopy);
     finalizeRef.current = finalizeCopy;
+    const selectionRef = useRef(selection);
+    selectionRef.current = selection;
+    const onExitRef = useRef(onExitSelectionMode);
+    onExitRef.current = onExitSelectionMode;
+    const seedSelection = () => {
+        const current = selectionRef.current;
+        if (current)
+            return current;
+        if (lastCellRef.current)
+            return { anchor: lastCellRef.current, cur: lastCellRef.current };
+        const rows = areaRef.current;
+        const i = rows.findIndex((r) => r != null);
+        const cell = i >= 0 ? { row: i + 1, col: 2 } : { row: 1, col: 2 };
+        return { anchor: cell, cur: cell };
+    };
+    const clampSelection = (sel) => {
+        const n = Math.max(1, areaRef.current.length);
+        return {
+            anchor: sel.anchor,
+            cur: { row: Math.max(1, Math.min(n, sel.cur.row)), col: Math.max(1, sel.cur.col) },
+        };
+    };
+    const nudgeSelection = (drow, dcol) => {
+        const s = seedSelection();
+        const n = Math.max(1, areaRef.current.length);
+        let row = Math.max(1, Math.min(n, s.cur.row + drow));
+        if (drow !== 0) {
+            while (row >= 1 && row <= n && areaRef.current[row - 1] == null) {
+                const next = row + Math.sign(drow);
+                if (next < 1 || next > n)
+                    break;
+                row = next;
+            }
+        }
+        const line = areaRef.current[row - 1];
+        const width = line ? displayWidth(stripAnsi(line)) : 0;
+        const col = Math.max(1, Math.min(2 + width, s.cur.col + dcol));
+        setSelection({ anchor: s.anchor, cur: { row, col } });
+    };
+    useEffect(() => {
+        if (!selectionMode)
+            return;
+        setSelection((prev) => prev ?? seedSelection());
+    }, [selectionMode, seedSelection]);
     const toggleExpanded = (id) => {
         setExpanded((prev) => {
             const next = new Set(prev);
@@ -322,14 +364,61 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
     };
     const drag = useRef(createDragMachine());
     useInput((_input, key) => {
+        if (selectionModeRef.current) {
+            const inkKey = key;
+            if (key.escape) {
+                setSelection(null);
+                onExitRef.current?.();
+                return;
+            }
+            if (key.return) {
+                const sel = selectionRef.current ?? seedSelection();
+                finalizeRef.current(sel);
+                onExitRef.current?.();
+                return;
+            }
+            if (key.leftArrow) {
+                nudgeSelection(0, -1);
+                return;
+            }
+            if (key.rightArrow) {
+                nudgeSelection(0, 1);
+                return;
+            }
+            if (key.upArrow) {
+                nudgeSelection(-1, 0);
+                return;
+            }
+            if (key.downArrow) {
+                nudgeSelection(1, 0);
+                return;
+            }
+            if (inkKey.home) {
+                const s = seedSelection();
+                setSelection({ anchor: s.anchor, cur: { row: s.cur.row, col: 1 } });
+                return;
+            }
+            if (inkKey.end) {
+                const s = seedSelection();
+                const line = areaRef.current[s.cur.row - 1];
+                const width = line ? displayWidth(stripAnsi(line)) : 0;
+                setSelection({ anchor: s.anchor, cur: { row: s.cur.row, col: 2 + width } });
+                return;
+            }
+            if (key.pageUp) {
+                scrollUp(slice.winBottom - slice.winTop);
+                setSelection((prev) => (prev ? clampSelection(prev) : prev));
+            }
+            else if (key.pageDown) {
+                scrollDown(slice.winBottom - slice.winTop);
+                setSelection((prev) => (prev ? clampSelection(prev) : prev));
+            }
+            return;
+        }
         if (!_input.startsWith("[<") && !/^[\d;,]+[Mm]$/.test(_input)) {
             clearDrag(drag.current);
             setSelection(null);
         }
-        // Enter on a tool row toggles expansion (keyboard alternative to click)
-        if (key.return && !_input) {
-            // No-op: tool toggle is click-only; keep Enter for app-level shortcuts
-        }
         if (key.pageUp) {
             const step = slice.winBottom - slice.winTop;
             scrollUp(step);
@@ -338,7 +427,6 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
             const step = slice.winBottom - slice.winTop;
             scrollDown(step);
         }
-        // Keyboard expand/collapse: when a tool message is at window center, toggle it
         if ((_input === " " || _input === "o") && !key.ctrl && !key.meta) {
             const center = Math.floor((slice.winTop + slice.winBottom) / 2);
             let cursor = 0;
@@ -351,8 +439,8 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
                 cursor += len;
             }
         }
-    }, { isActive: Boolean(maxHeight && maxHeight > 0) });
-    // Scrolling back to the bottom when content shrinks (e.g. /clear, /undo)
+    }, { isActive: Boolean(interactive && maxHeight && maxHeight > 0) });
+    // Scrolling back to the bottom when content shrinks (e.g. /new, /undo)
     // so the view never hangs at a stale offset.
     const prevMessageCount = useRef(messages.length);
     useEffect(() => {
@@ -382,6 +470,42 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
             offset -= part.count;
         }
     };
+    const selectWord = (row, col) => {
+        const rows = areaRef.current;
+        const cell = mouseToCell(rows, row, col);
+        const line = rows[cell.row];
+        if (!line)
+            return;
+        const range = wordRangeAt(stripAnsi(line), cell.col);
+        if (range.end <= range.start)
+            return;
+        const sel = {
+            anchor: { row: cell.row + 1, col: range.start + 2 },
+            cur: { row: cell.row + 1, col: range.end + 1 },
+        };
+        setSelection(sel);
+        finalizeRef.current(sel);
+    };
+    const selectMessage = (row) => {
+        const rowIndex = row - 1;
+        const meta = partMetaRef.current[rowIndex];
+        if (!meta)
+            return;
+        let start = rowIndex;
+        let end = rowIndex;
+        while (start > 0 && partMetaRef.current[start - 1]?.part === meta.part)
+            start--;
+        while (end < partMetaRef.current.length - 1 && partMetaRef.current[end + 1]?.part === meta.part)
+            end++;
+        const lastLine = areaRef.current[end];
+        const width = lastLine ? displayWidth(stripAnsi(lastLine)) : 0;
+        const sel = {
+            anchor: { row: start + 1, col: 2 },
+            cur: { row: end + 1, col: Math.max(2, 1 + width) },
+        };
+        setSelection(sel);
+        finalizeRef.current(sel);
+    };
     // Mouse handling in the message area: drag with the left button selects text
     // and auto-copies on release; a click (press+release without motion) still
     // toggles tool rows; the wheel scrolls. The drag state machine (drag-state)
@@ -400,17 +524,23 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
             let scanned;
             while ((scanned = scanSgrMouse(wheelBuffer.current))) {
                 wheelBuffer.current = scanned.rest;
-                const { button, row, col } = scanned.event;
+                const { button, row } = scanned.event;
                 const areaHeight = areaRef.current.length;
                 // Wheel (base 64/65, or with the motion flag while a button is held).
-                if (button === WHEEL_UP || button === WHEEL_DOWN || button === WHEEL_UP + MOTION || button === WHEEL_DOWN + MOTION) {
+                if (button === WHEEL_UP ||
+                    button === WHEEL_DOWN ||
+                    button === WHEEL_UP + MOTION ||
+                    button === WHEEL_DOWN + MOTION) {
                     if (row >= 1 && row <= areaHeight + 2) {
                         clearDrag(drag.current);
-                        setSelection(null);
+                        if (!selectionModeRef.current)
+                            setSelection(null);
                         if (button === WHEEL_UP || button === WHEEL_UP + MOTION)
                             scrollUp(3);
                         else
                             scrollDown(3);
+                        if (selectionModeRef.current)
+                            setSelection((prev) => (prev ? clampSelection(prev) : prev));
                     }
                     continue;
                 }
@@ -419,8 +549,16 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
                     setSelection(outcome.selection);
                 else if (outcome?.type === "copy")
                     finalizeRef.current(outcome.selection);
-                else if (outcome?.type === "click")
-                    handleClick(outcome.row);
+                else if (outcome?.type === "click") {
+                    lastCellRef.current = { row: outcome.row, col: outcome.col };
+                    const count = noteClick(clicks.current, { row: outcome.row, col: outcome.col, at: Date.now() });
+                    if (count >= 3)
+                        selectMessage(outcome.row);
+                    else if (count === 2)
+                        selectWord(outcome.row, outcome.col);
+                    else
+                        handleClick(outcome.row);
+                }
             }
             if (wheelBuffer.current.length > 64) {
                 const esc = wheelBuffer.current.lastIndexOf("\x1b");
@@ -428,24 +566,32 @@ export function MessageList({ messages, maxHeight, columns = 80, onCopyNotice })
             }
         };
         stdin.on("data", handleData);
-        return () => { stdin.off("data", handleData); };
-    }, [stdin, maxHeight]);
+        return () => {
+            stdin.off("data", handleData);
+        };
+    }, [stdin, maxHeight, clampSelection, handleClick, scrollDown, scrollUp, selectMessage, selectWord]);
     if (!maxHeight || maxHeight <= 0) {
         return (_jsxs(Box, { flexDirection: "column", children: [messages.length === 0 && (_jsx(Box, { paddingLeft: 1, paddingTop: 1, children: _jsx(Text, { color: "gray", children: "\u8F93\u5165\u6D88\u606F\u5F00\u59CB\u5BF9\u8BDD\uFF0C\u8F93\u5165 /help \u67E5\u770B\u547D\u4EE4\uFF0CEsc \u53D6\u6D88\u8FD0\u884C" }) })), messages.map((msg) => (_jsx(MessageRow, { message: msg, lines: cachedMessageLines(msg, columns, expanded.has(msg.id)) }, msg.id)))] }));
     }
-    return (_jsxs(Box, { flexDirection: "column", children: [messages.length === 0 && (_jsx(Box, { paddingLeft: 1, paddingTop: 1, children: _jsx(Text, { color: "gray", children: "\u8F93\u5165\u6D88\u606F\u5F00\u59CB\u5BF9\u8BDD\uFF0C\u8F93\u5165 /help \u67E5\u770B\u547D\u4EE4\uFF0CEsc \u53D6\u6D88\u8FD0\u884C" }) })), slice.above > 0 && (_jsx(Box, { paddingLeft: 1, children: _jsxs(Text, { color: "gray", dimColor: true, children: ["\u2026 \u4EE5\u4E0A ", slice.above, " \u884C"] }) })), slice.parts.map(({ msg, start, count }, p) => (_jsx(MessageRow, { message: msg, lines: cachedMessageLines(msg, columns, expanded.has(msg.id)), start: start, count: count, selection: partSelections?.get(p) }, msg.id))), slice.below > 0 && (_jsx(Box, { paddingLeft: 1, children: _jsx(Text, { color: "gray", dimColor: true, children: "\u2193 \u6309 PageDown \u56DE\u5230\u5E95\u90E8" }) }))] }));
+    return (_jsxs(Box, { flexDirection: "column", height: maxHeight, overflow: "hidden", width: "100%", children: [messages.length === 0 && (_jsx(Box, { paddingLeft: 1, paddingTop: 1, children: _jsx(Text, { color: "gray", children: "\u8F93\u5165\u6D88\u606F\u5F00\u59CB\u5BF9\u8BDD\uFF0C\u8F93\u5165 /help \u67E5\u770B\u547D\u4EE4\uFF0CEsc \u53D6\u6D88\u8FD0\u884C" }) })), slice.above > 0 && (_jsx(Box, { paddingLeft: 1, flexShrink: 0, children: _jsxs(Text, { color: "gray", dimColor: true, children: ["\u2026 \u4EE5\u4E0A ", slice.above, " \u884C"] }) })), slice.parts.map(({ msg, start, count }, p) => (_jsx(MessageRow, { message: msg, lines: cachedMessageLines(msg, columns, expanded.has(msg.id)), start: start, count: count, selection: partSelections?.get(p) }, msg.id))), slice.below > 0 && (_jsx(Box, { paddingLeft: 1, flexShrink: 0, children: _jsx(Text, { color: "gray", dimColor: true, children: "\u2193 \u6309 PageDown \u56DE\u5230\u5E95\u90E8" }) }))] }));
 }
 /** Map a window slice (rows incl. margin) to renderable lines. */
 function sliceLines(msg, lines, start, count = lines.length) {
     if (msg.role !== "user")
-        return { lines: lines.slice(start, start + count), marginTop: false };
+        return { lines: lines.slice(start, start + count), marginTop: false, lineOffset: start };
     const margin = MARGIN;
     if (start === 0) {
-        // The window includes the margin row; content rows are one fewer.
-        return { lines: lines.slice(0, Math.max(0, count - margin)), marginTop: true };
+        return { lines: lines.slice(0, Math.max(0, count - margin)), marginTop: true, lineOffset: 0 };
     }
     const contentStart = start - margin;
-    return { lines: lines.slice(contentStart, contentStart + count), marginTop: false };
+    return { lines: lines.slice(contentStart, contentStart + count), marginTop: false, lineOffset: contentStart };
+}
+function copyKindFor(msg, lineIndex) {
+    if (msg.role === "user")
+        return lineIndex === 0 ? "user-head" : "plain";
+    if (msg.role === "tool")
+        return lineIndex === 0 ? "tool-head" : "tool-body";
+    return "plain";
 }
 /**
  * Rebuild the exact rows the message list renders, one entry per terminal row:
@@ -455,29 +601,34 @@ function sliceLines(msg, lines, start, count = lines.length) {
  */
 function buildArea(slice, columns, expanded) {
     const rows = [];
+    const kinds = [];
     const partMeta = [];
     if (slice.above > 0) {
         rows.push(null);
+        kinds.push("plain");
         partMeta.push(null);
     }
     for (let p = 0; p < slice.parts.length; p++) {
         const part = slice.parts[p];
         const lines = cachedMessageLines(part.msg, columns, expanded.has(part.msg.id));
-        const { lines: shown, marginTop } = sliceLines(part.msg, lines, part.start, part.count);
+        const { lines: shown, marginTop, lineOffset } = sliceLines(part.msg, lines, part.start, part.count);
         if (marginTop) {
             rows.push(null);
+            kinds.push("plain");
             partMeta.push(null);
         }
         for (let i = 0; i < shown.length; i++) {
             rows.push(shown[i]);
+            kinds.push(copyKindFor(part.msg, lineOffset + i));
             partMeta.push({ part: p, shown: i });
         }
     }
     if (slice.below > 0) {
         rows.push(null);
+        kinds.push("plain");
         partMeta.push(null);
     }
-    return { rows, partMeta };
+    return { rows, kinds, partMeta };
 }
 /** Message row — memoized so streaming updates to the last assistant message
  * don't re-render every row. `selection` (aligned with the shown lines) adds
@@ -485,57 +636,47 @@ function buildArea(slice, columns, expanded) {
  * the memo hit during streaming. */
 const MessageRow = React.memo(function MessageRow({ message, lines, start = 0, count, selection, }) {
     const { lines: shown, marginTop } = sliceLines(message, lines, start, count);
-    if (shown.length === 0 && !marginTop)
-        return null;
-    const sel = selection && selection.length === shown.length ? selection : undefined;
+    if (shown.length === 0) {
+        if (!marginTop)
+            return null;
+        return _jsx(Box, { height: 1, flexShrink: 0 });
+    }
+    const sel = selection;
     const apply = (i, line) => {
         const range = sel?.[i];
         return range && range.end > range.start ? applySelection(line, range.start, range.end) : line;
     };
-    // Selection on a decorated first line must be split: the prefix ("> " or
-    // "⚡ name ▸ ") is rendered as its own Text before the content slice.
-    const splitFirst = (prefixLen) => {
+    const splitFirst = (prefix) => {
         const range = sel?.[0];
         if (!range)
-            return { prefix: null, content: null };
-        const headRange = range.start < prefixLen && range.end > 0
-            ? { start: range.start, end: Math.min(prefixLen, range.end) }
-            : null;
-        const contentRange = range.end > prefixLen
-            ? { start: Math.max(0, range.start - prefixLen), end: range.end - prefixLen }
-            : null;
-        return { prefix: headRange, content: contentRange };
+            return { head: null, tail: null };
+        return splitRangeAt(range, displayWidth(prefix));
     };
+    const paintPrefix = (prefix, head) => head ? applySelection(prefix, head.start, head.end) : prefix;
+    const paintBody = (body, tail) => tail ? applySelection(body, tail.start, tail.end) : body;
     switch (message.role) {
         case "user": {
             const first = shown[0] ?? "";
             const rest = shown.slice(1);
-            const isHead = first.startsWith("> ");
-            const split = isHead ? splitFirst(2) : null;
-            return (_jsxs(Box, { paddingLeft: 1, marginTop: marginTop ? 1 : 0, children: [isHead && (_jsx(Text, { color: "cyan", bold: true, children: split.prefix ? applySelection("> ", split.prefix.start, split.prefix.end) : "> " })), _jsxs(Text, { children: [isHead
-                                ? split.content
-                                    ? applySelection(first.slice(2), split.content.start, split.content.end)
-                                    : first.slice(2)
-                                : apply(0, first), rest.length > 0 ? `\n${rest.map((l, k) => apply(k + 1, l)).join("\n")}` : ""] })] }));
+            const prefix = visualPrefix(first, "user");
+            const split = prefix ? splitFirst(prefix) : null;
+            const headBody = prefix ? paintBody(first.slice(prefix.length), split.tail) : apply(0, first);
+            return (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, marginTop: marginTop ? 1 : 0, flexShrink: 0, children: [_jsxs(Box, { flexWrap: "nowrap", children: [prefix !== "" && (_jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: "cyan", bold: true, children: paintPrefix(prefix, split.head) }) })), _jsx(Text, { wrap: "truncate-end", children: headBody })] }), rest.map((l, k) => (_jsx(Text, { wrap: "truncate-end", children: apply(k + 1, l) }, k)))] }));
         }
         case "assistant":
-            return (_jsx(Box, { paddingLeft: 1, children: _jsx(Text, { children: shown.map((l, i) => apply(i, l)).join("\n") }) }));
+            return (_jsx(Box, { flexDirection: "column", paddingLeft: 1, flexShrink: 0, children: shown.map((l, i) => (_jsx(Text, { wrap: "truncate-end", children: apply(i, l) }, i))) }));
         case "thinking":
-            return (_jsx(Box, { paddingLeft: 1, children: _jsx(Text, { dimColor: true, children: shown.map((l, i) => apply(i, l)).join("\n") }) }));
+            return (_jsx(Box, { flexDirection: "column", paddingLeft: 1, flexShrink: 0, children: shown.map((l, i) => (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: apply(i, l) }, i))) }));
         case "tool": {
             const first = shown[0] ?? "";
             const rest = shown.slice(1);
-            const isHead = first.startsWith("⚡ ");
-            const prefixLen = isHead ? first.indexOf(" ", 2) + 1 : 0;
-            const split = isHead ? splitFirst(prefixLen) : null;
-            return (_jsxs(Box, { paddingLeft: 1, children: [isHead && (_jsx(Text, { color: "yellow", children: split.prefix ? applySelection(first.slice(0, prefixLen), split.prefix.start, split.prefix.end) : first.slice(0, prefixLen) })), _jsxs(Text, { color: isHead ? (message.toolIsError ? "red" : "gray") : undefined, children: [isHead
-                                ? split.content
-                                    ? applySelection(first.slice(prefixLen), split.content.start, split.content.end)
-                                    : first.slice(prefixLen)
-                                : apply(0, first), rest.length > 0 ? `\n${rest.map((l, k) => apply(k + 1, l)).join("\n")}` : ""] })] }));
+            const prefix = visualPrefix(first, "tool");
+            const split = prefix ? splitFirst(prefix) : null;
+            const headBody = prefix ? paintBody(first.slice(prefix.length), split.tail) : apply(0, first);
+            return (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, flexShrink: 0, children: [_jsxs(Box, { flexWrap: "nowrap", children: [prefix !== "" && (_jsx(Box, { flexShrink: 0, children: _jsx(Text, { color: "yellow", children: paintPrefix(prefix, split.head) }) })), _jsx(Text, { color: prefix ? (message.toolIsError ? "red" : "gray") : undefined, wrap: "truncate-end", children: headBody })] }), rest.map((l, k) => (_jsx(Text, { color: message.toolIsError ? "red" : undefined, wrap: "truncate-end", children: apply(k + 1, l) }, k)))] }));
         }
         case "system":
-            return (_jsx(Box, { paddingLeft: 1, children: _jsx(Text, { children: shown.map((l, i) => apply(i, l)).join("\n") }) }));
+            return (_jsx(Box, { flexDirection: "column", paddingLeft: 1, flexShrink: 0, children: shown.map((l, i) => (_jsx(Text, { wrap: "truncate-end", children: apply(i, l) }, i))) }));
         default:
             return null;
     }