@esso0428/pi-subagents 0.15.5 → 0.15.6

package/dist/ui/conversation-viewer.js

@@ -1,27 +1,29 @@
-"use strict";
 /**
- * conversation-viewer.ts — Live conversation overlay for viewing agent sessions.
+ * conversation-viewer.ts — Live and historical conversation overlay.
  *
- * Displays a scrollable, live-updating view of an agent's conversation.
- * Subscribes to session events for real-time streaming updates.
+ * The viewer deliberately keeps rendering state separate from the transcript:
+ * blocks are formatted data, while Markdown/ANSI lines are a bounded cache.
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ConversationViewer = exports.VIEWPORT_HEIGHT_PCT = void 0;
-exports.createStaticConversationSource = createStaticConversationSource;
-const pi_tui_1 = require("@earendil-works/pi-tui");
-const context_js_1 = require("../context.js");
-const usage_js_1 = require("../usage.js");
-const agent_widget_js_1 = require("./agent-widget.js");
-const viewer_keys_js_1 = require("./viewer-keys.js");
-/** Base lines consumed by chrome: top border + header + header sep + footer sep + footer + bottom border. */
+import { copyToClipboard, getMarkdownTheme } from "@earendil-works/pi-coding-agent";
+import { Input, Key, Markdown, matchesKey, Text, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { getLifetimeTotal, getSessionContextPercent } from "../usage.js";
+import { buildInvocationTags, describeActivity, fgPreservingNestedStyles, formatDuration, formatSessionTokens, getDisplayName, getPromptModeLabel } from "./agent-widget.js";
+import { formatConversationMessages } from "./conversation-blocks.js";
+import { editLiveAssistantBlockInNvim, viewConversationBlockInNvim } from "./conversation-nvim.js";
+import { findConversationMatches, highlightConversationLine, nearestConversationMatchAfter, nearestConversationMatchBefore, stripAnsi } from "./conversation-search.js";
+import { createViewerKeys } from "./viewer-keys.js";
+/** Base lines consumed by the overlay: borders, header, separator and footer. */
 const CHROME_LINES_BASE = 6;
 const MIN_VIEWPORT = 3;
-/** Height ceiling shared by the overlay's `maxHeight` and the viewer's internal viewport cap. */
-exports.VIEWPORT_HEIGHT_PCT = 70;
-function createStaticConversationSource(messages) {
+export const VIEWPORT_HEIGHT_PCT = 70;
+const MAX_COPY_CHARS = 500_000;
+const MATCH_BG = "\x1b[48;5;238m";
+const MATCH_BG_CURRENT = "\x1b[48;5;220m\x1b[30m";
+const BG_RESET = "\x1b[49m\x1b[39m";
+export function createStaticConversationSource(messages) {
     return { messages, subscribe: () => () => { } };
 }
-class ConversationViewer {
+export class ConversationViewer {
     tui;
     session;
     record;
@@ -30,23 +32,37 @@ class ConversationViewer {
     done;
     onStop;
     onSteer;
+    operations;
+    blocks = [];
+    showTools = true;
+    selectedMessageIdx = 0;
+    cachedWidth = 0;
+    cachedLines = [];
+    cachedMessageStarts = [];
+    cachedMessageBlocks = [];
+    cacheVersion = 0;
+    cachedVersion = -1;
     scrollOffset = 0;
     autoScroll = true;
     unsubscribe;
     lastInnerW = 0;
     closed = false;
-    /** Two-press confirm guard for the stop key, so a stray key can't kill the agent. */
     stopArmed = false;
     keys;
-    /** Steering composer — present while the user is typing a message to the agent. */
     composer;
+    searchMode = false;
+    searchQuery = "";
+    searchMatches = [];
+    currentMatchIdx = -1;
     constructor(tui, session, record, activity, theme, done, 
-    /** Abort the agent shown here. Omitted → no stop affordance (e.g. read-only history). */
+    /** Abort the agent shown here. Omitted means read-only history. */
     onStop, 
-    /** User keybindings from `ctx.ui.custom()`. Omitted → hardcoded defaults. */
+    /** User keybindings from ctx.ui.custom(). */
     keybindings, 
-    /** Send a steering message to the agent. Omitted → no compose affordance. */
-    onSteer) {
+    /** Send a steering message to the agent. */
+    onSteer, 
+    /** Optional clipboard/nvim operation context, appended for compatibility. */
+    operations) {
         this.tui = tui;
         this.session = session;
         this.record = record;
@@ -55,37 +71,39 @@ class ConversationViewer {
         this.done = done;
         this.onStop = onStop;
         this.onSteer = onSteer;
-        this.keys = (0, viewer_keys_js_1.createViewerKeys)(keybindings);
+        this.operations = operations;
+        this.keys = createViewerKeys(keybindings);
+        this.blocks = formatConversationMessages(session.messages);
         this.unsubscribe = session.subscribe(() => {
             if (this.closed)
                 return;
+            this.blocks = formatConversationMessages(this.session.messages);
+            this.cacheVersion++;
+            this.invalidate();
             this.tui.requestRender();
         });
     }
     handleInput(data) {
-        // While composing a steer message, the input owns all keys (Enter sends,
-        // Esc cancels — both wired in openComposer()). Editing keys flow through.
         if (this.composer) {
             this.composer.handleInput(data);
             this.tui.requestRender();
             return;
         }
-        if ((0, pi_tui_1.matchesKey)(data, "escape") || (0, pi_tui_1.matchesKey)(data, "q")) {
+        if (this.searchMode) {
+            this.handleSearchInput(data);
+            return;
+        }
+        if (matchesKey(data, "escape") || matchesKey(data, "q")) {
             this.closed = true;
             this.done(undefined);
             return;
         }
-        // Enter opens the steering composer (only while the agent can still be
-        // steered) — then type + Enter sends, Esc or an empty submit returns. When
-        // not steerable, fall through so the key still disarms a pending stop.
-        if ((0, pi_tui_1.matchesKey)(data, "enter") && this.canSteer()) {
+        if (matchesKey(data, "enter") && this.canSteer()) {
             this.stopArmed = false;
             this.openComposer();
             return;
         }
-        // Stop/abort the agent (only while it can still be stopped). Two-press:
-        // first "x" arms, second confirms — any other key disarms.
-        if ((0, pi_tui_1.matchesKey)(data, "x")) {
+        if (matchesKey(data, "x")) {
             if (this.isStoppable()) {
                 if (this.stopArmed) {
                     this.stopArmed = false;
@@ -100,263 +118,428 @@ class ConversationViewer {
         }
         if (this.stopArmed)
             this.stopArmed = false;
-        const totalLines = this.buildContentLines(this.lastInnerW).length;
+        // Input can arrive before the first render in tests and in a freshly-opened overlay.
+        this.buildContentLines(this.lastInnerW || 80);
         const viewportHeight = this.viewportHeight();
-        const maxScroll = Math.max(0, totalLines - viewportHeight);
-        if (this.keys.scrollUp(data)) {
-            this.scrollOffset = Math.max(0, this.scrollOffset - 1);
-            this.autoScroll = this.scrollOffset >= maxScroll;
+        const maxScroll = Math.max(0, this.cachedLines.length - viewportHeight);
+        if (data === "t") {
+            this.showTools = !this.showTools;
+            this.invalidate();
+            this.tui.requestRender();
+        }
+        else if (data === "J" || matchesKey(data, Key.shift("j"))) {
+            this.jumpToMessage(1);
+        }
+        else if (data === "K" || matchesKey(data, Key.shift("k"))) {
+            this.jumpToMessage(-1);
+        }
+        else if (data === "g") {
+            this.scrollToTop();
+        }
+        else if (data === "G" || matchesKey(data, Key.shift("g"))) {
+            this.scrollToBottom();
+        }
+        else if (data === "/") {
+            this.enterSearch();
+        }
+        else if (data === "n") {
+            this.gotoMatch(1);
+        }
+        else if (data === "N") {
+            this.gotoMatch(-1);
+        }
+        else if (data === "M") {
+            void this.copyCurrentMessage();
+        }
+        else if (data === "o") {
+            void this.viewCurrentInNvim();
+        }
+        else if (data === "O" && this.isLive()) {
+            void this.editCurrentInNvim();
+        }
+        else if (this.keys.scrollUp(data)) {
+            this.scrollBy(-1);
         }
         else if (this.keys.scrollDown(data)) {
-            this.scrollOffset = Math.min(maxScroll, this.scrollOffset + 1);
-            this.autoScroll = this.scrollOffset >= maxScroll;
+            this.scrollBy(1);
         }
         else if (this.keys.pageUp(data)) {
-            this.scrollOffset = Math.max(0, this.scrollOffset - viewportHeight);
-            this.autoScroll = false;
+            this.scrollBy(-viewportHeight);
         }
         else if (this.keys.pageDown(data)) {
-            this.scrollOffset = Math.min(maxScroll, this.scrollOffset + viewportHeight);
-            this.autoScroll = this.scrollOffset >= maxScroll;
+            this.scrollBy(viewportHeight);
         }
-        else if ((0, pi_tui_1.matchesKey)(data, "home")) {
+        else if (matchesKey(data, "home")) {
             this.scrollOffset = 0;
+            this.selectedMessageIdx = 0;
             this.autoScroll = false;
+            this.tui.requestRender();
         }
-        else if ((0, pi_tui_1.matchesKey)(data, "end")) {
-            this.scrollOffset = maxScroll;
-            this.autoScroll = true;
+        else if (matchesKey(data, "end")) {
+            this.scrollToBottom();
         }
+        // Keep the computed max alive for the key path even when the cache is empty.
+        void maxScroll;
     }
     render(width) {
         if (width < 6)
-            return []; // too narrow for any meaningful rendering
+            return [];
         const th = this.theme;
-        const innerW = width - 4; // border + padding
+        const innerW = Math.max(1, width - 4);
         this.lastInnerW = innerW;
         const lines = [];
-        const pad = (s, len) => {
-            const vis = (0, pi_tui_1.visibleWidth)(s);
-            return s + " ".repeat(Math.max(0, len - vis));
-        };
-        const row = (content) => th.fg("border", "│") + " " + (0, pi_tui_1.truncateToWidth)(pad(content, innerW), innerW, "...", true) + " " + th.fg("border", "│");
-        const hrTop = th.fg("border", `╭${"─".repeat(width - 2)}╮`);
-        const hrBot = th.fg("border", `╰${"─".repeat(width - 2)}╯`);
+        const pad = (s, len) => s + " ".repeat(Math.max(0, len - visibleWidth(s)));
+        const row = (content) => th.fg("border", "│") + " " + truncateToWidth(pad(content, innerW), innerW, "...", true) + " " + th.fg("border", "│");
+        const hrTop = th.fg("border", `╭${"─".repeat(Math.max(0, width - 2))}╮`);
+        const hrBot = th.fg("border", `╰${"─".repeat(Math.max(0, width - 2))}╯`);
         const hrMid = row(th.fg("dim", "─".repeat(innerW)));
-        // Header
         lines.push(hrTop);
-        const name = (0, agent_widget_js_1.getDisplayName)(this.record.type);
-        const modeLabel = (0, agent_widget_js_1.getPromptModeLabel)(this.record.type);
+        const name = getDisplayName(this.record.type);
+        const modeLabel = getPromptModeLabel(this.record.type);
         const modeTag = modeLabel ? ` ${th.fg("dim", `(${modeLabel})`)}` : "";
-        const statusIcon = this.record.status === "running"
-            ? th.fg("accent", "●")
-            : this.record.status === "completed"
-                ? th.fg("success", "✓")
-                : this.record.status === "error"
-                    ? th.fg("error", "✗")
-                    : th.fg("dim", "○");
-        const duration = (0, agent_widget_js_1.formatDuration)(this.record.startedAt, this.record.completedAt);
+        const statusIcon = this.record.status === "running" ? th.fg("accent", "●") : this.record.status === "completed" ? th.fg("success", "✓") : this.record.status === "error" ? th.fg("error", "✗") : th.fg("dim", "○");
+        const duration = formatDuration(this.record.startedAt, this.record.completedAt);
         const headerParts = [duration];
         const toolUses = this.activity?.toolUses ?? this.record.toolUses;
         if (toolUses > 0)
             headerParts.unshift(`${toolUses} tool${toolUses === 1 ? "" : "s"}`);
-        const tokens = (0, usage_js_1.getLifetimeTotal)(this.activity?.lifetimeUsage);
+        const tokens = getLifetimeTotal(this.activity?.lifetimeUsage);
         if (tokens > 0) {
-            const percent = (0, usage_js_1.getSessionContextPercent)(this.activity?.session);
-            headerParts.push((0, agent_widget_js_1.formatSessionTokens)(tokens, percent, th, this.record.compactionCount));
+            const percent = getSessionContextPercent(this.activity?.session);
+            headerParts.push(formatSessionTokens(tokens, percent, th, this.record.compactionCount));
         }
-        lines.push(row(`${statusIcon} ${th.bold(name)}${modeTag}  ${th.fg("muted", this.record.description)} ${th.fg("dim", "·")} ${(0, agent_widget_js_1.fgPreservingNestedStyles)(th, "dim", headerParts.join(" · "))}`));
+        lines.push(row(`${statusIcon} ${th.bold(name)}${modeTag}  ${th.fg("muted", this.record.description)} ${th.fg("dim", "·")} ${fgPreservingNestedStyles(th, "dim", headerParts.join(" · "))}`));
         const invocationLine = this.invocationLine();
         if (invocationLine)
             lines.push(row(invocationLine));
         lines.push(hrMid);
-        // Content area — rebuild every render (live data, no cache needed)
         const contentLines = this.buildContentLines(innerW);
         const viewportHeight = this.viewportHeight();
         const maxScroll = Math.max(0, contentLines.length - viewportHeight);
-        if (this.autoScroll) {
+        if (this.autoScroll)
             this.scrollOffset = maxScroll;
-        }
         const visibleStart = Math.min(this.scrollOffset, maxScroll);
         const visible = contentLines.slice(visibleStart, visibleStart + viewportHeight);
-        for (let i = 0; i < viewportHeight; i++) {
-            lines.push(row(visible[i] ?? ""));
+        const currentBlockIdx = this.currentBlockGlobalIndex();
+        const headerLine = this.activeHeaderLine();
+        const showSticky = headerLine >= 0 && headerLine < visibleStart && visible.length > 0;
+        const displayed = visible.slice();
+        if (showSticky) {
+            const block = this.cachedMessageBlocks[this.currentMessageIndex()];
+            if (block)
+                displayed[0] = { text: ` ${block.header}`, plain: block.header, blockIndex: currentBlockIdx, railable: true };
         }
-        // Footer
+        for (let i = 0; i < displayed.length; i++) {
+            const line = displayed[i];
+            let text = line.text;
+            if (this.searchMatches.length > 0 && !(showSticky && i === 0)) {
+                const hits = this.searchMatches.filter((match) => match.lineIdx === visibleStart + i).map((match) => ({ lineIdx: match.lineIdx, col: match.col, len: match.len, current: this.searchMatches.indexOf(match) === this.currentMatchIdx }));
+                if (hits.length > 0)
+                    text = highlightConversationLine(text, hits, MATCH_BG, MATCH_BG_CURRENT, BG_RESET);
+            }
+            if (line.railable && line.blockIndex === currentBlockIdx) {
+                text = text.startsWith(" ") ? th.fg("accent", "▎") + text.slice(1) : th.fg("accent", "▎") + text;
+            }
+            lines.push(row(text));
+        }
+        for (let i = displayed.length; i < viewportHeight; i++)
+            lines.push(row(""));
         lines.push(hrMid);
         if (this.composer) {
-            // Composer row: the Input renders its own `> ` prompt and cursor.
             lines.push(row(this.composer.render(innerW)[0] ?? ""));
-            const composeHint = th.fg("dim", "Enter send · Esc cancel");
-            const composeLeft = th.fg("accent", "✎ steer");
-            const composeGap = Math.max(1, innerW - (0, pi_tui_1.visibleWidth)(composeLeft) - (0, pi_tui_1.visibleWidth)(composeHint));
-            lines.push(row(composeLeft + " ".repeat(composeGap) + composeHint));
+            const hint = th.fg("dim", "Enter send · Esc cancel");
+            const label = th.fg("accent", "✎ steer");
+            lines.push(row(label + " ".repeat(Math.max(1, innerW - visibleWidth(label) - visibleWidth(hint))) + hint));
         }
         else {
-            // Actions on the left, navigation on the right. The scroll hint keeps its
-            // full key list so the less-obvious bindings stay discoverable; it leads
-            // the right group so "Esc close" is the only part that truncates first.
-            const sep = th.fg("dim", " · ");
             const actions = [];
             if (this.canSteer())
                 actions.push(th.fg("dim", "Enter steer"));
-            if (this.isStoppable()) {
+            if (this.isStoppable())
                 actions.push(this.stopArmed ? th.fg("error", "x again to STOP") : th.fg("dim", "x stop"));
-            }
-            const footerRight = th.fg("dim", "↑↓ scroll · PgUp/PgDn or Shift+↑↓ · Esc close");
-            // Prepend the line-count/scroll-% readout only when there's spare width —
-            // it's the first thing dropped so it never crowds out the hints.
-            const scrollPct = contentLines.length <= viewportHeight
-                ? "100%"
-                : `${Math.round(((visibleStart + viewportHeight) / contentLines.length) * 100)}%`;
+            const editHint = this.isLive() ? " O" : "";
+            const shortcutHints = [
+                `j/k · J/K · g/G   t   M o${editHint}   /n N   q`,
+                `M o${editHint}   /n N   q`,
+                `M o${editHint} /n N q`,
+            ];
+            const scrollPct = contentLines.length <= viewportHeight ? "100%" : `${Math.round(((visibleStart + viewportHeight) / contentLines.length) * 100)}%`;
             const count = th.fg("dim", `${contentLines.length} lines · ${scrollPct}`);
-            const withCount = [count, ...actions].join(sep);
-            const footerLeft = (0, pi_tui_1.visibleWidth)(withCount) + (0, pi_tui_1.visibleWidth)(footerRight) + 1 <= innerW
-                ? withCount
-                : actions.join(sep);
-            const footerGap = Math.max(1, innerW - (0, pi_tui_1.visibleWidth)(footerLeft) - (0, pi_tui_1.visibleWidth)(footerRight));
-            lines.push(row(footerLeft + " ".repeat(footerGap) + footerRight));
+            const countWidth = visibleWidth(count);
+            let status = "";
+            for (const hint of shortcutHints) {
+                const styledHint = th.fg("dim", hint);
+                const withActions = [styledHint, ...actions].join("   ");
+                if (visibleWidth(withActions) <= innerW) {
+                    status = withActions;
+                    break;
+                }
+                if (visibleWidth(styledHint) <= innerW)
+                    status ||= styledHint;
+            }
+            if (!status)
+                status = th.fg("dim", shortcutHints[shortcutHints.length - 1]);
+            const statusWidth = visibleWidth(status);
+            const footer = statusWidth + countWidth + 1 <= innerW
+                ? status + " ".repeat(Math.max(1, innerW - statusWidth - countWidth)) + count
+                : status;
+            lines.push(row(truncateToWidth(footer, innerW, "...", true)));
         }
         lines.push(hrBot);
         return lines;
     }
-    /** Stoppable only when a stop handler exists and the agent is still active. */
-    isStoppable() {
-        return !!this.onStop && (this.record.status === "running" || this.record.status === "queued");
-    }
-    /** Steerable only when a steer handler exists and the agent is still active. */
-    canSteer() {
-        return !!this.onSteer && (this.record.status === "running" || this.record.status === "queued");
-    }
-    /** Open the inline steering composer and route subsequent input to it. */
-    openComposer() {
-        const input = new pi_tui_1.Input();
-        input.focused = true;
-        input.onSubmit = (value) => {
-            const message = value.trim();
-            this.composer = undefined;
-            if (message)
-                this.onSteer?.(message);
-            this.tui.requestRender();
-        };
-        input.onEscape = () => {
-            this.composer = undefined;
-            this.tui.requestRender();
-        };
-        this.composer = input;
-        this.tui.requestRender();
+    invalidate() {
+        this.cachedWidth = 0;
+        this.cachedLines = [];
+        this.cachedMessageStarts = [];
+        this.cachedMessageBlocks = [];
+        this.cachedVersion = -1;
     }
-    invalidate() { }
     dispose() {
         this.closed = true;
-        if (this.unsubscribe) {
-            this.unsubscribe();
-            this.unsubscribe = undefined;
-        }
+        this.unsubscribe?.();
+        this.unsubscribe = undefined;
     }
-    // ---- Private ----
     viewportHeight() {
-        // Cap mirrors the overlay's maxHeight — otherwise the viewer would render
-        // more lines than the overlay shows and clip the footer.
-        const maxRows = Math.floor((this.tui.terminal.rows * exports.VIEWPORT_HEIGHT_PCT) / 100);
+        const maxRows = Math.floor((this.tui.terminal.rows * VIEWPORT_HEIGHT_PCT) / 100);
         return Math.max(MIN_VIEWPORT, maxRows - this.chromeLines());
     }
     chromeLines() {
-        // The composer adds one row above the footer hint while it's open.
         return CHROME_LINES_BASE + (this.invocationLine() ? 1 : 0) + (this.composer ? 1 : 0);
     }
     invocationLine() {
-        const { modelName, tags } = (0, agent_widget_js_1.buildInvocationTags)(this.record.invocation);
+        const { modelName, tags } = buildInvocationTags(this.record.invocation);
         const parts = modelName ? [modelName, ...tags] : tags;
-        if (parts.length === 0)
-            return undefined;
-        return this.theme.fg("dim", `  ↳ ${parts.join(" · ")}`);
+        return parts.length === 0 ? undefined : this.theme.fg("dim", `  ↳ ${parts.join(" · ")}`);
     }
     buildContentLines(width) {
         if (width <= 0)
             return [];
-        const th = this.theme;
-        const messages = this.session.messages;
+        if (this.cachedVersion === this.cacheVersion && this.cachedWidth === width)
+            return this.cachedLines;
+        const visibleBlocks = this.blocks.filter((block) => this.showTools || block.kind !== "tool");
         const lines = [];
-        if (messages.length === 0) {
-            lines.push(th.fg("dim", "(waiting for first message...)"));
-            return lines;
-        }
-        let needsSeparator = false;
-        for (const msg of messages) {
-            if (msg.role === "user") {
-                const text = typeof msg.content === "string"
-                    ? msg.content
-                    : (0, context_js_1.extractText)(msg.content);
-                if (!text.trim())
-                    continue;
-                if (needsSeparator)
-                    lines.push(th.fg("dim", "───"));
-                lines.push(th.fg("accent", "[User]"));
-                for (const line of (0, pi_tui_1.wrapTextWithAnsi)(text.trim(), width)) {
-                    lines.push(line);
-                }
+        this.cachedMessageStarts = [];
+        this.cachedMessageBlocks = [];
+        if (visibleBlocks.length === 0) {
+            const empty = this.blocks.length === 0 ? "(waiting for first message...)" : "(tools hidden)";
+            lines.push({ text: this.theme.fg("dim", empty), plain: empty, blockIndex: -1 });
+        }
+        for (const block of visibleBlocks) {
+            const blockIndex = this.blocks.indexOf(block);
+            if (block.kind === "tool") {
+                const raw = (block.toolLine ?? block.copyText).replace(/^·\s*/, "");
+                const line = this.theme.fg("dim", `   └─ ${raw}`);
+                lines.push({ text: truncateToWidth(line, width), plain: stripAnsi(line), blockIndex });
+                continue;
             }
-            else if (msg.role === "assistant") {
-                const textParts = [];
-                const toolCalls = [];
-                for (const c of msg.content) {
-                    if (c.type === "text" && c.text)
-                        textParts.push(c.text);
-                    else if (c.type === "toolCall") {
-                        toolCalls.push(c.name ?? c.toolName ?? "unknown");
-                    }
-                }
-                if (needsSeparator)
-                    lines.push(th.fg("dim", "───"));
-                lines.push(th.bold("[Assistant]"));
-                if (textParts.length > 0) {
-                    for (const line of (0, pi_tui_1.wrapTextWithAnsi)(textParts.join("\n").trim(), width)) {
-                        lines.push(line);
-                    }
-                }
-                for (const name of toolCalls) {
-                    lines.push((0, pi_tui_1.truncateToWidth)(th.fg("muted", `  [Tool: ${name}]`), width));
-                }
+            if (lines.length > 0) {
+                const separator = this.theme.fg("border", `   ${"─ ".repeat(Math.max(1, Math.floor((width - 6) / 2)))}`.trimEnd());
+                lines.push({ text: truncateToWidth(separator, width), plain: stripAnsi(separator), blockIndex });
             }
-            else if (msg.role === "toolResult") {
-                const text = (0, context_js_1.extractText)(msg.content);
-                const truncated = text.length > 500 ? text.slice(0, 500) + "... (truncated)" : text;
-                if (!truncated.trim())
-                    continue;
-                if (needsSeparator)
-                    lines.push(th.fg("dim", "───"));
-                lines.push(th.fg("dim", "[Result]"));
-                for (const line of (0, pi_tui_1.wrapTextWithAnsi)(truncated.trim(), width)) {
-                    lines.push(th.fg("dim", line));
-                }
+            this.cachedMessageStarts.push(lines.length);
+            this.cachedMessageBlocks.push(block);
+            const header = ` ${block.header}`;
+            lines.push({ text: truncateToWidth(header, width), plain: block.header, blockIndex, railable: true });
+            try {
+                const markdown = new Markdown(block.markdown || "∅", 2, 0, getMarkdownTheme(), {
+                    color: (text) => this.theme.fg(block.role === "meta" ? "muted" : "text", text),
+                });
+                for (const text of markdown.render(Math.max(1, width)))
+                    lines.push({ text: truncateToWidth(text, width), plain: stripAnsi(text), blockIndex, railable: true });
             }
-            else if (msg.role === "bashExecution") {
-                const bash = msg;
-                if (needsSeparator)
-                    lines.push(th.fg("dim", "───"));
-                lines.push((0, pi_tui_1.truncateToWidth)(th.fg("muted", `  $ ${bash.command}`), width));
-                if (bash.output?.trim()) {
-                    const out = bash.output.length > 500
-                        ? bash.output.slice(0, 500) + "... (truncated)"
-                        : bash.output;
-                    for (const line of (0, pi_tui_1.wrapTextWithAnsi)(out.trim(), width)) {
-                        lines.push(th.fg("dim", line));
-                    }
+            catch {
+                try {
+                    for (const text of new Text(block.markdown || "∅").render(Math.max(1, width)))
+                        lines.push({ text: truncateToWidth(text, width), plain: stripAnsi(text), blockIndex, railable: true });
+                }
+                catch {
+                    const text = block.markdown || "∅";
+                    for (const line of text.split("\n"))
+                        lines.push({ text: truncateToWidth(line, width), plain: line, blockIndex, railable: true });
                 }
             }
-            else {
-                continue;
-            }
-            needsSeparator = true;
         }
-        // Streaming indicator for running agents
         if (this.record.status === "running" && this.activity) {
-            const act = (0, agent_widget_js_1.describeActivity)(this.activity.activeTools, this.activity.responseText);
-            lines.push("");
-            lines.push((0, pi_tui_1.truncateToWidth)(th.fg("accent", "▍ ") + th.fg("dim", act), width));
+            const act = describeActivity(this.activity.activeTools, this.activity.responseText);
+            const text = `▍ ${act}`;
+            lines.push({ text: truncateToWidth(this.theme.fg("accent", "▍ ") + this.theme.fg("dim", act), width), plain: text, blockIndex: -1 });
+        }
+        this.cachedWidth = width;
+        this.cachedVersion = this.cacheVersion;
+        this.cachedLines = lines;
+        if (this.searchMode || this.searchQuery)
+            this.recomputeMatches();
+        return lines;
+    }
+    currentMessageIndex() {
+        return this.cachedMessageStarts.length === 0 ? 0 : Math.max(0, Math.min(this.selectedMessageIdx, this.cachedMessageStarts.length - 1));
+    }
+    currentBlockGlobalIndex() {
+        const block = this.cachedMessageBlocks[this.currentMessageIndex()];
+        return block ? this.blocks.indexOf(block) : -1;
+    }
+    activeHeaderLine() {
+        return this.cachedMessageStarts[this.currentMessageIndex()] ?? -1;
+    }
+    currentBlock() {
+        return this.cachedMessageBlocks[this.currentMessageIndex()];
+    }
+    messageIndexForOffset(offset) {
+        let result = 0;
+        for (let i = 0; i < this.cachedMessageStarts.length; i++) {
+            if (this.cachedMessageStarts[i] <= offset)
+                result = i;
+            else
+                break;
+        }
+        return result;
+    }
+    jumpToMessage(dir) {
+        if (this.cachedMessageStarts.length === 0)
+            return;
+        const target = this.currentMessageIndex() + dir;
+        if (target < 0 || target >= this.cachedMessageStarts.length)
+            return;
+        this.selectedMessageIdx = target;
+        this.scrollOffset = Math.min(this.cachedMessageStarts[target], Math.max(0, this.cachedLines.length - this.viewportHeight()));
+        this.autoScroll = false;
+        this.tui.requestRender();
+    }
+    scrollBy(delta) {
+        const max = Math.max(0, this.cachedLines.length - this.viewportHeight());
+        this.scrollOffset = Math.max(0, Math.min(max, this.scrollOffset + delta));
+        this.selectedMessageIdx = this.messageIndexForOffset(this.scrollOffset);
+        this.autoScroll = this.scrollOffset >= max;
+        this.tui.requestRender();
+    }
+    scrollToTop() {
+        this.scrollOffset = 0;
+        this.selectedMessageIdx = 0;
+        this.autoScroll = false;
+        this.tui.requestRender();
+    }
+    scrollToBottom() {
+        this.scrollOffset = Math.max(0, this.cachedLines.length - this.viewportHeight());
+        this.selectedMessageIdx = Math.max(0, this.cachedMessageStarts.length - 1);
+        this.autoScroll = true;
+        this.tui.requestRender();
+    }
+    enterSearch() {
+        this.searchMode = true;
+        this.searchQuery = "";
+        this.searchMatches = [];
+        this.currentMatchIdx = -1;
+        this.tui.requestRender();
+    }
+    handleSearchInput(data) {
+        if (matchesKey(data, "escape") || matchesKey(data, Key.ctrl("c"))) {
+            this.searchMode = false;
+            this.searchQuery = "";
+            this.searchMatches = [];
+            this.currentMatchIdx = -1;
+        }
+        else if (matchesKey(data, "enter") || data === "\r" || data === "\n") {
+            this.searchMode = false;
+            if (this.searchMatches.length > 0)
+                this.scrollToMatch(this.currentMatchIdx < 0 ? 0 : this.currentMatchIdx);
+        }
+        else if (matchesKey(data, "backspace") || data === "\x7f" || data === "\b") {
+            this.searchQuery = this.searchQuery.slice(0, -1);
+            this.recomputeMatches();
+        }
+        else if (data.length === 1 && data >= " " && data !== "\x7f") {
+            this.searchQuery += data;
+            this.recomputeMatches();
+        }
+        this.tui.requestRender();
+    }
+    recomputeMatches() {
+        this.searchMatches = findConversationMatches(this.cachedLines, this.searchQuery);
+        this.currentMatchIdx = this.searchMatches.length > 0 ? Math.min(Math.max(this.currentMatchIdx, 0), this.searchMatches.length - 1) : -1;
+    }
+    gotoMatch(dir) {
+        if (this.searchMatches.length === 0)
+            return;
+        this.currentMatchIdx = this.currentMatchIdx < 0
+            ? (dir === 1 ? nearestConversationMatchAfter(this.searchMatches, this.scrollOffset) : nearestConversationMatchBefore(this.searchMatches, this.scrollOffset))
+            : (this.currentMatchIdx + dir + this.searchMatches.length) % this.searchMatches.length;
+        this.scrollToMatch(this.currentMatchIdx);
+        this.tui.requestRender();
+    }
+    scrollToMatch(index) {
+        const match = this.searchMatches[index];
+        if (!match)
+            return;
+        const max = Math.max(0, this.cachedLines.length - this.viewportHeight());
+        this.scrollOffset = Math.max(0, Math.min(max, match.lineIdx - Math.floor(this.viewportHeight() / 2)));
+        this.selectedMessageIdx = this.messageIndexForOffset(this.scrollOffset);
+        this.autoScroll = false;
+    }
+    async copyCurrentMessage() {
+        const block = this.currentBlock();
+        if (!block || !this.operations) {
+            if (!this.operations)
+                return;
+            return;
         }
-        return lines.map(l => (0, pi_tui_1.truncateToWidth)(l, width));
+        const source = `${stripAnsi(block.header)}\n${block.copyText}`.trimEnd();
+        const clipped = source.length > MAX_COPY_CHARS ? `${source.slice(0, MAX_COPY_CHARS)}\n… [truncated by subagent copy]` : source;
+        try {
+            await copyToClipboard(clipped);
+            this.operations.ctx.ui.notify(`Copied current message (${clipped.length} chars)`, "info");
+        }
+        catch (error) {
+            this.operations.ctx.ui.notify(`Copy failed: ${error instanceof Error ? error.message : String(error)}`, "error");
+        }
+    }
+    async viewCurrentInNvim() {
+        const block = this.currentBlock();
+        if (!block || !this.operations)
+            return;
+        await viewConversationBlockInNvim(this.tui, this.operations.ctx, block);
+        this.invalidate();
+        this.tui.requestRender(true);
+    }
+    async editCurrentInNvim() {
+        const block = this.currentBlock();
+        if (!block || !this.operations || !this.isLive() || block.role !== "assistant")
+            return;
+        const sent = await editLiveAssistantBlockInNvim(this.operations.pi, this.tui, this.operations.ctx, block);
+        if (sent)
+            this.done(undefined);
+        else {
+            this.invalidate();
+            this.tui.requestRender(true);
+        }
+    }
+    isReadOnly() {
+        return this.operations?.readOnly === true;
+    }
+    isLive() {
+        return !this.isReadOnly() && this.record.session !== undefined;
+    }
+    isStoppable() {
+        return !this.isReadOnly() && !!this.onStop && (this.record.status === "running" || this.record.status === "queued");
+    }
+    canSteer() {
+        return !this.isReadOnly() && !!this.onSteer && (this.record.status === "running" || this.record.status === "queued");
+    }
+    openComposer() {
+        const input = new Input();
+        input.focused = true;
+        input.onSubmit = (value) => {
+            const message = value.trim();
+            this.composer = undefined;
+            if (message)
+                this.onSteer?.(message);
+            this.tui.requestRender();
+        };
+        input.onEscape = () => {
+            this.composer = undefined;
+            this.tui.requestRender();
+        };
+        this.composer = input;
+        this.tui.requestRender();
     }
 }
-exports.ConversationViewer = ConversationViewer;