oma-coding-agent 1.1.4

package/src/modes/components/bash-execution.ts

@@ -0,0 +1,220 @@
+/**
+ * Component for displaying bash command execution with streaming output.
+ */
+
+import {
+	Container,
+	Ellipsis,
+	ImageProtocol,
+	type Loader,
+	TERMINAL,
+	Text,
+	type TUI,
+	truncateToWidth,
+	visibleWidth,
+} from "@oh-my-pi/pi-tui";
+import { sanitizeText } from "@oh-my-pi/pi-utils";
+import { theme } from "../../modes/theme/theme";
+import type { TruncationMeta } from "../../tools/output-meta";
+import { getSixelLineMask, isSixelPassthroughEnabled, sanitizeWithOptionalSixelPassthrough } from "../../utils/sixel";
+import {
+	buildExecutionFrame,
+	buildStatusFooter,
+	createCollapsedPreview,
+	type ExecutionStatus,
+	resolveExecutionStatus,
+} from "./execution-shared";
+
+// Preview line limit when not expanded (matches tool execution behavior)
+const PREVIEW_LINES = 20;
+const STREAMING_LINE_CAP = PREVIEW_LINES * 5;
+const MAX_DISPLAY_LINE_CHARS = 4000;
+// Minimum interval between processing incoming chunks for display (ms).
+// Chunks arriving faster than this are accumulated and processed in one batch.
+const CHUNK_THROTTLE_MS = 50;
+
+export class BashExecutionComponent extends Container {
+	#outputLines: string[] = [];
+	#status: ExecutionStatus = "running";
+	#exitCode: number | undefined = undefined;
+	#loader: Loader;
+	#truncation?: TruncationMeta;
+	#expanded = false;
+	#displayDirty = false;
+	#chunkGate = false;
+	#contentContainer: Container;
+	#headerText: Text;
+
+	constructor(
+		private readonly command: string,
+		ui: TUI,
+		excludeFromContext = false,
+	) {
+		super();
+
+		// Use dim border for excluded-from-context commands (!! prefix)
+		const colorKey = excludeFromContext ? "dim" : "bashMode";
+		const { contentContainer, loader } = buildExecutionFrame(this, ui, colorKey);
+		this.#contentContainer = contentContainer;
+		this.#loader = loader;
+
+		// Command header
+		this.#headerText = new Text(theme.fg(colorKey, theme.bold(`$ ${command}`)), 1, 0);
+		this.#contentContainer.addChild(this.#headerText);
+		this.#contentContainer.addChild(this.#loader);
+	}
+
+	/**
+	 * Set whether the output is expanded (shows full output) or collapsed (preview only).
+	 */
+	setExpanded(expanded: boolean): void {
+		this.#expanded = expanded;
+		this.#updateDisplay();
+	}
+
+	override invalidate(): void {
+		super.invalidate();
+		this.#displayDirty = false;
+		this.#updateDisplay();
+	}
+
+	appendOutput(chunk: string): void {
+		// During high-throughput output (e.g. seq 1 500M), processing every
+		// chunk would saturate the event loop. Instead, accept one chunk per
+		// throttle window and drop the rest — the OutputSink captures everything
+		// for the artifact, and setComplete() replaces with the final output.
+		if (this.#chunkGate) return;
+		this.#chunkGate = true;
+		setTimeout(() => {
+			this.#chunkGate = false;
+		}, CHUNK_THROTTLE_MS);
+
+		const incomingLines = chunk.split("\n");
+		if (this.#outputLines.length > 0 && incomingLines.length > 0) {
+			const lastIndex = this.#outputLines.length - 1;
+			const mergedLines = [`${this.#outputLines[lastIndex]}${incomingLines[0]}`, ...incomingLines.slice(1)];
+			const clampedMergedLines = this.#clampLinesPreservingSixel(mergedLines);
+			this.#outputLines[lastIndex] = clampedMergedLines[0] ?? "";
+			this.#outputLines.push(...clampedMergedLines.slice(1));
+		} else {
+			this.#outputLines.push(...this.#clampLinesPreservingSixel(incomingLines));
+		}
+
+		// Cap stored lines during streaming to avoid unbounded memory growth
+		if (this.#outputLines.length > STREAMING_LINE_CAP) {
+			this.#outputLines = this.#outputLines.slice(-STREAMING_LINE_CAP);
+		}
+
+		this.#displayDirty = true;
+	}
+
+	setComplete(
+		exitCode: number | undefined,
+		cancelled: boolean,
+		options?: { output?: string; truncation?: TruncationMeta },
+	): void {
+		this.#exitCode = exitCode;
+		this.#status = resolveExecutionStatus(exitCode, cancelled);
+		this.#truncation = options?.truncation;
+		if (options?.output !== undefined) {
+			this.#setOutput(options.output);
+		}
+
+		// Stop loader
+		this.#loader.stop();
+
+		this.#updateDisplay();
+	}
+
+	override render(width: number): readonly string[] {
+		if (this.#displayDirty) {
+			this.#displayDirty = false;
+			this.#updateDisplay();
+		}
+		return super.render(width);
+	}
+
+	#updateDisplay(): void {
+		const availableLines = this.#outputLines;
+
+		// Apply preview truncation based on expanded state
+		const previewLogicalLines = availableLines.slice(-PREVIEW_LINES);
+		const hiddenLineCount = availableLines.length - previewLogicalLines.length;
+		const sixelLineMask =
+			TERMINAL.imageProtocol === ImageProtocol.Sixel && isSixelPassthroughEnabled()
+				? getSixelLineMask(availableLines)
+				: undefined;
+		const hasSixelOutput = sixelLineMask?.some(Boolean) ?? false;
+
+		// Rebuild content container
+		this.#contentContainer.clear();
+
+		// Command header
+		this.#contentContainer.addChild(this.#headerText);
+
+		// Output
+		if (availableLines.length > 0) {
+			if (this.#expanded || hasSixelOutput) {
+				const displayText = availableLines
+					.map((line, index) => (sixelLineMask?.[index] ? line : theme.fg("muted", line)))
+					.join("\n");
+				this.#contentContainer.addChild(new Text(`\n${displayText}`, 1, 0));
+			} else {
+				// Use shared visual truncation utility, recomputed per render width
+				const styledOutput = previewLogicalLines.map(line => theme.fg("muted", line)).join("\n");
+				this.#contentContainer.addChild(createCollapsedPreview(`\n${styledOutput}`, PREVIEW_LINES));
+			}
+		}
+
+		// Loader or status
+		if (this.#status === "running") {
+			this.#contentContainer.addChild(this.#loader);
+		} else {
+			const footer = buildStatusFooter({
+				status: this.#status,
+				exitCode: this.#exitCode,
+				truncation: this.#truncation,
+				hiddenLineCount,
+				suppressHiddenCount: hasSixelOutput,
+			});
+			if (footer) this.#contentContainer.addChild(footer);
+		}
+	}
+
+	#clampDisplayLine(line: string): string {
+		const visible = visibleWidth(line);
+		if (visible <= MAX_DISPLAY_LINE_CHARS) {
+			return line;
+		}
+		const omitted = visible - MAX_DISPLAY_LINE_CHARS;
+		return `${truncateToWidth(line, MAX_DISPLAY_LINE_CHARS, Ellipsis.Omit)}… [${omitted} visible columns omitted]`;
+	}
+
+	#clampLinesPreservingSixel(lines: string[]): string[] {
+		if (lines.length === 0) return [];
+		const sixelLineMask = getSixelLineMask(lines);
+		if (!sixelLineMask.some(Boolean)) {
+			return lines.map(line => this.#clampDisplayLine(line));
+		}
+		return lines.map((line, index) => (sixelLineMask[index] ? line : this.#clampDisplayLine(line)));
+	}
+
+	#setOutput(output: string): void {
+		const clean = sanitizeWithOptionalSixelPassthrough(output, sanitizeText);
+		this.#outputLines = clean ? this.#clampLinesPreservingSixel(clean.split("\n")) : [];
+	}
+
+	/**
+	 * Get the raw output for creating BashExecutionMessage.
+	 */
+	getOutput(): string {
+		return this.#outputLines.join("\n");
+	}
+
+	/**
+	 * Get the command that was executed.
+	 */
+	getCommand(): string {
+		return this.command;
+	}
+}

package/src/modes/components/bordered-loader.ts

@@ -0,0 +1,41 @@
+import { CancellableLoader, Container, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
+import type { Theme } from "../../modes/theme/theme";
+import { DynamicBorder } from "./dynamic-border";
+
+/** Loader wrapped with borders for hook UI */
+export class BorderedLoader extends Container {
+	#loader: CancellableLoader;
+
+	constructor(tui: TUI, theme: Theme, message: string) {
+		super();
+		const borderColor = (s: string) => theme.fg("border", s);
+		this.addChild(new DynamicBorder(borderColor));
+		this.#loader = new CancellableLoader(
+			tui,
+			s => theme.fg("accent", s),
+			s => theme.fg("muted", s),
+			message,
+		);
+		this.addChild(this.#loader);
+		this.addChild(new Spacer(1));
+		this.addChild(new Text(theme.fg("muted", "esc cancel"), 1, 0));
+		this.addChild(new Spacer(1));
+		this.addChild(new DynamicBorder(borderColor));
+	}
+
+	get signal(): AbortSignal {
+		return this.#loader.signal;
+	}
+
+	set onAbort(fn: (() => void) | undefined) {
+		this.#loader.onAbort = fn;
+	}
+
+	handleInput(data: string): void {
+		this.#loader.handleInput(data);
+	}
+
+	dispose(): void {
+		this.#loader.dispose();
+	}
+}

package/src/modes/components/btw-panel.ts

@@ -0,0 +1,112 @@
+import { type Component, Container, Markdown, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
+import { replaceTabs } from "../../tools/render-utils";
+import { getMarkdownTheme, theme } from "../theme/theme";
+import { DynamicBorder } from "./dynamic-border";
+
+type BtwPanelState = "running" | "complete" | "aborted" | "error";
+
+interface BtwPanelComponentOptions {
+	question: string;
+	tui: TUI;
+}
+
+export class BtwPanelComponent extends Container {
+	#question: string;
+	#tui: TUI;
+	#state: BtwPanelState = "running";
+	#answer = "";
+	#errorMessage: string | undefined;
+	#closed = false;
+
+	constructor(options: BtwPanelComponentOptions) {
+		super();
+		this.#question = options.question;
+		this.#tui = options.tui;
+		this.#rebuild();
+	}
+
+	appendText(delta: string): void {
+		if (!delta || this.#closed) return;
+		this.#answer += delta;
+		this.#rebuild();
+	}
+
+	setAnswer(text: string): void {
+		if (this.#closed) return;
+		this.#answer = text;
+		this.#rebuild();
+	}
+
+	markComplete(): void {
+		if (this.#closed) return;
+		this.#state = "complete";
+		this.#errorMessage = undefined;
+		this.#rebuild();
+	}
+
+	markAborted(): void {
+		if (this.#closed) return;
+		this.#state = "aborted";
+		this.#errorMessage = undefined;
+		this.#rebuild();
+	}
+
+	markError(message: string): void {
+		if (this.#closed) return;
+		this.#state = "error";
+		this.#errorMessage = message;
+		this.#rebuild();
+	}
+
+	isBranchable(): boolean {
+		return this.#state === "complete" && this.#answer.trim().length > 0;
+	}
+
+	close(): void {
+		this.#closed = true;
+	}
+
+	#rebuild(): void {
+		this.clear();
+		this.addChild(new DynamicBorder(str => theme.fg("dim", str)));
+		this.addChild(new Spacer(1));
+		this.addChild(new Text(theme.fg("accent", replaceTabs(this.#question)), 1, 0));
+		this.addChild(new Spacer(1));
+		this.addChild(this.#contentComponent());
+		this.addChild(new Spacer(1));
+		this.addChild(new Text(this.#footerLine(), 1, 0));
+		this.addChild(new Spacer(1));
+		this.addChild(new DynamicBorder(str => theme.fg("dim", str)));
+		// Component-scoped: a rebuild replaces only this panel's own children
+		// (streaming deltas arrive per token, and a full compose would re-walk
+		// the whole transcript each time). Before the panel is mounted the TUI
+		// cannot resolve it and falls back to a full compose on its own.
+		this.#tui.requestComponentRender(this);
+	}
+
+	#footerLine(): string {
+		switch (this.#state) {
+			case "running":
+				return theme.fg("muted", "Esc cancel /btw");
+			case "complete":
+				return theme.fg("muted", this.isBranchable() ? "b branch · Esc dismiss" : "Esc dismiss");
+			case "aborted":
+				return theme.fg("warning", `${theme.status.warning} Cancelled · Esc dismiss`);
+			case "error":
+				return theme.fg("error", `${theme.status.error} Error · Esc dismiss`);
+		}
+	}
+
+	#contentComponent(): Component {
+		if (this.#state === "error") {
+			return new Text(theme.fg("error", replaceTabs(this.#errorMessage ?? "Unknown error")), 1, 0);
+		}
+		const text = replaceTabs(this.#answer).trim();
+		if (!text) {
+			const waiting =
+				this.#state === "running" ? `${theme.status.pending} Waiting for response…` : "No text returned.";
+			return new Text(theme.fg("dim", waiting), 1, 0);
+		}
+		return new Markdown(text, 1, 0, getMarkdownTheme());
+	}
+}

package/src/modes/components/cache-invalidation-marker.ts

@@ -0,0 +1,110 @@
+import type { Usage } from "@oh-my-pi/pi-ai";
+import type { Component } from "@oh-my-pi/pi-tui";
+import { formatNumber } from "@oh-my-pi/pi-utils";
+import { theme } from "../../modes/theme/theme";
+
+/**
+ * Minimum prefix the previous turn must have READ back from cache before a
+ * collapse on the current turn counts as an invalidation. Filters out tiny
+ * contexts and providers below the cacheable-prefix floor, where a zero
+ * `cacheRead` is expected rather than a reset.
+ */
+const MIN_CACHE_FOOTPRINT = 2048;
+
+/** A prompt-cache invalidation detected from a turn's usage. */
+export interface CacheInvalidation {
+	/** Prompt tokens the cold turn had to (re)process instead of reading from cache. */
+	reprocessedTokens: number;
+}
+
+/**
+ * Decide whether `current` turn lost a *working* prompt cache that `prev` was
+ * reusing.
+ *
+ * The provider reports a warm prefix as `cacheRead`; a model/thinking/tool/
+ * system-prompt change (or a history rewrite) breaks the prefix, so the next
+ * request reads nothing from cache and re-pays for the whole prompt. We flag
+ * only the transition where a demonstrably warm cache goes cold: the previous
+ * turn must have actually READ a meaningful prefix back, and this turn's
+ * `cacheRead` collapsed to zero while it still reprocessed a non-trivial prompt.
+ *
+ * Requiring a prior warm read is deliberate. A turn that merely WROTE the prefix
+ * (`cacheRead` 0) has not proven the cache is live — that is the session's first
+ * request, or a re-write after expiry — so a following cold turn there is
+ * expected, not an invalidation the user caused (e.g. a long-running first tool
+ * call outliving the provider's 5-minute cache TTL surfaced a spurious "cache
+ * miss" right under the opening message). It also collapses a run of consecutive
+ * cold turns to the single marker at the moment the cache actually broke, instead
+ * of repeating the banner on every turn while it re-warms.
+ *
+ * Returns `undefined` (no marker) for the first turn, turns whose predecessor
+ * never read a warm prefix, tiny contexts, turns that reused any cache, and —
+ * crucially — turns on providers with *implicit* best-effort caching. Only an
+ * explicit, prefix-controlled cache (Anthropic / Bedrock `cache_control`)
+ * re-creates the prefix on a cold turn (`cacheWrite > 0`); implicit caches
+ * (Google / OpenAI / Fireworks) report `cacheWrite: 0` and drop `cacheRead` to
+ * zero intermittently as routine propagation noise that self-heals the next
+ * turn, so flagging it would be a false positive.
+ */
+export function detectCacheInvalidation(prev: Usage | undefined, current: Usage): CacheInvalidation | undefined {
+	if (!prev) return undefined;
+	// Only flag a warm→cold transition: the previous turn must have actually read
+	// a meaningful prefix from cache. A write-only predecessor (first request, or
+	// a re-write after expiry) has not proven the cache is live, so a cold turn
+	// behind it is expected — not an invalidation worth surfacing.
+	if (prev.cacheRead < MIN_CACHE_FOOTPRINT) return undefined;
+	// Any cache reuse this turn means the prefix survived (at least partly).
+	if (current.cacheRead > 0) return undefined;
+	// Only an explicit, prefix-controlled cache re-creates the prefix on a cold
+	// turn — Anthropic/Bedrock report that as `cacheWrite`. Implicit best-effort
+	// caches (Google/OpenAI/Fireworks) report `cacheWrite: 0` and drop `cacheRead`
+	// to zero intermittently as propagation noise, not a real invalidation.
+	if (current.cacheWrite <= 0) return undefined;
+	const reprocessedTokens = current.cacheWrite + current.input;
+	if (reprocessedTokens < MIN_CACHE_FOOTPRINT) return undefined;
+	return { reprocessedTokens };
+}
+
+const CACHE_INVALIDATION_RULE_WIDTH = 10;
+
+/**
+ * Slim left-aligned divider rendered above an assistant turn whose request lost
+ * the prompt cache. Mirrors the compaction divider's banner styling but spans
+ * only a short rule plus label (not the full width) and carries no expandable
+ * detail:
+ *
+ *   ────────── ⊘ cache miss · 50.9k tokens
+ */
+export class CacheInvalidationMarkerComponent implements Component {
+	#cache?: { width: number; lines: string[] };
+
+	constructor(private readonly info: CacheInvalidation) {}
+
+	invalidate(): void {
+		this.#cache = undefined;
+	}
+
+	render(width: number): readonly string[] {
+		width = Math.max(1, width);
+		if (this.#cache?.width === width) {
+			return this.#cache.lines;
+		}
+		const lines = ["", this.#divider(width), ""];
+		this.#cache = { width, lines };
+		return lines;
+	}
+
+	#divider(width: number): string {
+		const icon = theme.icon.cacheMiss;
+		const head = icon ? `${icon} cache miss` : "cache miss";
+		const tokens = this.info.reprocessedTokens;
+		const label = tokens > 0 ? `${head} ${theme.sep.dot.trim()} ${formatNumber(tokens)} tokens` : head;
+		const labelWidth = Bun.stringWidth(label, { countAnsiEscapeCodes: false });
+		const ruleWidth = Math.min(CACHE_INVALIDATION_RULE_WIDTH, width - labelWidth - 1);
+		if (ruleWidth < 1) {
+			// Too narrow to frame — emit the bare label.
+			return theme.fg("muted", label);
+		}
+		return `${theme.fg("dim", theme.tree.horizontal.repeat(ruleWidth))} ${theme.fg("muted", label)}`;
+	}
+}

package/src/modes/components/chat-block.ts

@@ -0,0 +1,111 @@
+import { Container } from "@oh-my-pi/pi-tui";
+
+/**
+ * Capabilities a mounted {@link ChatBlock} may use against its host transcript.
+ * Kept minimal so blocks never reach into the full TUI/InteractiveMode surface.
+ */
+export interface ChatBlockHost {
+	/** Schedule a repaint of the transcript. */
+	requestRender(): void;
+}
+
+/**
+ * Lifecycle-aware transcript block — the "return a block, let the host mount it"
+ * primitive, modelled on React/Svelte component lifecycles.
+ *
+ * Producers build and return a `ChatBlock` instead of poking `chatContainer` and
+ * `ui.requestRender()` directly. The host (`ctx.present`) appends it and calls
+ * {@link mount}, which runs {@link onMount}; effects started there register
+ * teardown via {@link onCleanup}. The block repaints through {@link requestRender}
+ * — never touching the TUI — and tears down exactly once on {@link finish}
+ * (self-complete: stop the animation, keep the final frame in the transcript) or
+ * {@link dispose} (host discards it, e.g. a transcript reset).
+ *
+ * While mounted and unfinished a block reports `isTranscriptBlockFinalized() ===
+ * false` so {@link "../components/transcript-container".TranscriptContainer}
+ * keeps it in the live, repaintable region on ED3-risk terminals; after
+ * `finish()`/`dispose()` it reports `true` and freezes at its final content.
+ */
+export abstract class ChatBlock extends Container {
+	#host: ChatBlockHost | undefined;
+	#cleanups: Array<() => void> = [];
+	#active = false;
+	#disposed = false;
+
+	/**
+	 * Run setup after the block is in the transcript: start timers/subscriptions
+	 * and register their teardown with {@link onCleanup}. Default: no-op (a block
+	 * whose content is fixed at construction needs no mount work).
+	 */
+	protected onMount(): void {}
+
+	/**
+	 * Register a teardown to run on {@link finish}/{@link dispose}, à la a
+	 * `useEffect` cleanup. If the block is already disposed the cleanup runs
+	 * immediately so callers never leak.
+	 */
+	protected onCleanup(cleanup: () => void): void {
+		if (this.#disposed) {
+			cleanup();
+			return;
+		}
+		this.#cleanups.push(cleanup);
+	}
+
+	/** Ask the host to repaint. No-op before mount or after dispose. */
+	protected requestRender(): void {
+		this.#host?.requestRender();
+	}
+
+	/** True between {@link mount} and {@link finish}/{@link dispose}. */
+	protected get active(): boolean {
+		return this.#active;
+	}
+
+	/**
+	 * Host-only: attach the host and run {@link onMount}. Idempotent — a second
+	 * call (e.g. a transcript rebuild that re-presents the same instance) is a
+	 * no-op.
+	 */
+	mount(host: ChatBlockHost): void {
+		if (this.#host || this.#disposed) return;
+		this.#host = host;
+		this.#active = true;
+		this.onMount();
+	}
+
+	/**
+	 * Self-complete: stop ongoing effects and freeze the block at its current
+	 * content, leaving it rendered in the transcript. Use when the operation the
+	 * block represents finishes (connection resolved, download done).
+	 */
+	finish(): void {
+		if (!this.#active) return;
+		this.#active = false;
+		this.#runCleanups();
+		this.requestRender();
+	}
+
+	/**
+	 * Host-only teardown: release everything and propagate to children. Called
+	 * when the host permanently discards the block (transcript reset). Idempotent.
+	 */
+	override dispose(): void {
+		if (this.#disposed) return;
+		this.#disposed = true;
+		this.#active = false;
+		this.#runCleanups();
+		super.dispose();
+		this.#host = undefined;
+	}
+
+	/** Live blocks stay repaintable; finished/disposed ones may freeze. */
+	isTranscriptBlockFinalized(): boolean {
+		return !this.#active;
+	}
+
+	#runCleanups(): void {
+		const cleanups = this.#cleanups.splice(0);
+		for (const cleanup of cleanups) cleanup();
+	}
+}