@oh-my-pi/pi-coding-agent 17.0.0 → 17.0.1

package/src/modes/components/hook-editor.ts

@@ -7,7 +7,7 @@
  *   (Ctrl+Q / Ctrl+Enter) submits, bordered popup
  * - Prompt-style (ask): Enter submits, Shift+Enter inserts newline, legacy ask chrome
  */
-import { Container, Editor, matchesKey, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
+import { Container, Editor, type Focusable, matchesKey, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
 import { getEditorTheme, theme } from "../../modes/theme/theme";
 import {
 	matchesAppExternalEditor,
@@ -22,12 +22,15 @@ export interface HookEditorOptions {
 	promptStyle?: boolean;
 }
 
-export class HookEditorComponent extends Container {
+/** Interactive multiline dialog used by hooks and the ask tool's Other response. */
+export class HookEditorComponent extends Container implements Focusable {
 	#editor: Editor;
 	#onSubmitCallback: (value: string) => void;
 	#onCancelCallback: () => void;
 	#tui: TUI;
 	#promptStyle: boolean;
+	/** Focus state mirrored to the nested editor during rendering. */
+	focused = false;
 
 	constructor(
 		tui: TUI,
@@ -75,6 +78,18 @@ export class HookEditorComponent extends Container {
 		this.addChild(new DynamicBorder());
 	}
 
+	/** Keep the nested editor's software/hardware cursor mode aligned with the dialog focus target. */
+	setUseTerminalCursor(useTerminalCursor: boolean): void {
+		if (this.#editor.getUseTerminalCursor() === useTerminalCursor) return;
+		this.#editor.setUseTerminalCursor(useTerminalCursor);
+	}
+
+	/** Render the dialog after forwarding its focus state to the nested editor. */
+	override render(width: number): readonly string[] {
+		this.#editor.focused = this.focused;
+		return super.render(width);
+	}
+
 	handleInput(keyData: string): void {
 		if (this.#promptStyle) {
 			this.#handlePromptStyleInput(keyData);

package/src/modes/components/login-dialog.test.ts

@@ -0,0 +1,56 @@
+import { beforeAll, describe, expect, it } from "bun:test";
+import type { TUI } from "@oh-my-pi/pi-tui";
+import { initTheme } from "../theme/theme";
+import { LoginDialogComponent } from "./login-dialog";
+
+/** Minimal TUI stub — the dialog only calls requestRender/setFocus. */
+function makeDialog(): LoginDialogComponent {
+	const tui = { requestRender() {}, setFocus() {} } as unknown as TUI;
+	return new LoginDialogComponent(tui, "openai-codex", () => {});
+}
+
+describe("LoginDialogComponent manual code input", () => {
+	beforeAll(async () => {
+		await initTheme();
+	});
+
+	it("captures a pasted fallback redirect URL and resolves on submit", async () => {
+		// Regression for #5339: paste-code providers (Codex) route the fallback
+		// URL through the focused dialog. Without a mounted input, the paste is
+		// dropped and login never completes.
+		const dialog = makeDialog();
+		dialog.showProgress("Waiting for callback");
+
+		const pending = dialog.showManualInput("Paste the authorization code:");
+		expect(dialog.render(80).join("\n")).toContain("Paste the authorization code");
+
+		const url = "http://localhost:1455/auth/callback?code=THECODE&state=abc";
+		dialog.pasteText(url);
+		dialog.handleInput("\r");
+
+		expect(await pending).toBe(url);
+	});
+
+	it("reuses the mounted input across re-prompts instead of stacking duplicates", async () => {
+		// The OAuth callback loop re-invokes onManualCodeInput after an invalid
+		// paste; the second prompt must not append a duplicate input/hint block.
+		const dialog = makeDialog();
+		dialog.showProgress("Waiting for callback");
+
+		const first = dialog.showManualInput("Paste the code:");
+		dialog.handleInput("garbage");
+		dialog.handleInput("\r");
+		expect(await first).toBe("garbage");
+
+		const second = dialog.showManualInput("Paste the code:");
+		const rendered = dialog.render(80).join("\n");
+		expect(rendered.split("Paste the code:").length - 1).toBe(1);
+		// A stale value from the first attempt must not leak into the retry.
+		expect(rendered).not.toContain("garbage");
+
+		const url = "http://localhost:1455/auth/callback?code=OK&state=abc";
+		dialog.pasteText(url);
+		dialog.handleInput("\r");
+		expect(await second).toBe(url);
+	});
+});

package/src/modes/components/login-dialog.ts

@@ -108,12 +108,16 @@ export class LoginDialogComponent extends Container {
 	 * Show input for manual code/URL entry (for callback server providers)
 	 */
 	showManualInput(prompt: string): Promise<string> {
-		this.#contentContainer.addChild(new Spacer(1));
-		this.#contentContainer.addChild(new Text(theme.fg("dim", prompt), 1, 0));
+		// Invalid pastes re-prompt (the OAuth callback loop calls this again), so
+		// reuse the already-mounted input instead of stacking duplicate prompt and
+		// hint lines beneath the dialog. Reset the value so each retry starts clean.
 		if (!this.#contentContainer.children.includes(this.#input)) {
+			this.#contentContainer.addChild(new Spacer(1));
+			this.#contentContainer.addChild(new Text(theme.fg("dim", prompt), 1, 0));
 			this.#contentContainer.addChild(this.#input);
+			this.#contentContainer.addChild(new Text(theme.fg("dim", "(Escape to cancel)"), 1, 0));
 		}
-		this.#contentContainer.addChild(new Text(theme.fg("dim", "(Escape to cancel)"), 1, 0));
+		this.#input.setValue("");
 		this.#tui.requestRender();
 
 		const { promise, resolve, reject } = Promise.withResolvers<string>();

package/src/modes/components/plan-review-overlay.ts

@@ -138,6 +138,8 @@ export class PlanReviewOverlay implements Component {
 	#tocCursor = 0;
 	#sidebarShown = false;
 	#pendingScrollToToc = false;
+	/** Last meaningful relative body position, retained while a frame cannot scroll. */
+	#scrollProgress = 0;
 
 	// Click hit-testing, rebuilt every render. Keys are 0-based rendered-line
 	// indices (== screen rows, since the fullscreen overlay paints from row 0).
@@ -196,6 +198,7 @@ export class PlanReviewOverlay implements Component {
 	setPlanContent(planContent: string): void {
 		this.#setSections(planContent);
 		this.#scrollView.scrollToTop();
+		this.#scrollProgress = 0;
 		this.#tocCursor = 0;
 		// A wholesale external-editor swap supersedes prior in-overlay deletions.
 		this.#deleted = [];
@@ -343,6 +346,7 @@ export class PlanReviewOverlay implements Component {
 			if (event.wheel !== null) {
 				// Scroll wheel: three rows per notch.
 				this.#scrollView.scroll(event.wheel * 3);
+				this.#captureScrollProgress();
 				return true;
 			}
 			if (event.release) return true;
@@ -445,13 +449,21 @@ export class PlanReviewOverlay implements Component {
 		// drops into the actions ("next step"); scrolling off the top steps back up
 		// to the ToC.
 		if (matchesSelectUp(data) || matchesKey(data, "k")) {
-			if (this.#scrollView.getScrollOffset() <= 0 && this.#sidebarShown) this.#setFocus("toc");
-			else this.#scrollView.scroll(-1);
+			if (this.#scrollView.getScrollOffset() <= 0 && this.#sidebarShown) {
+				this.#setFocus("toc");
+			} else {
+				this.#scrollView.scroll(-1);
+				this.#captureScrollProgress();
+			}
 			return;
 		}
 		if (matchesSelectDown(data) || matchesKey(data, "j")) {
-			if (this.#scrollView.getScrollOffset() >= this.#scrollView.getMaxScrollOffset()) this.#setFocus("actions");
-			else this.#scrollView.scroll(1);
+			if (this.#scrollView.getScrollOffset() >= this.#scrollView.getMaxScrollOffset()) {
+				this.#setFocus("actions");
+			} else {
+				this.#scrollView.scroll(1);
+				this.#captureScrollProgress();
+			}
 			return;
 		}
 		this.#handleBodyScroll(data);
@@ -464,9 +476,19 @@ export class PlanReviewOverlay implements Component {
 	 * before this runs, so here it only ever sees the paging/fast keys.
 	 */
 	#handleBodyScroll(data: string): void {
-		if (this.#scrollView.handleScrollKey(data)) return;
-		if (data === "g") this.#scrollView.scrollToTop();
-		else if (data === "G") this.#scrollView.scrollToBottom();
+		if (this.#scrollView.handleScrollKey(data)) {
+			if (matchesKey(data, "home")) this.#scrollProgress = 0;
+			else if (matchesKey(data, "end")) this.#scrollProgress = 1;
+			else this.#captureScrollProgress();
+			return;
+		}
+		if (data === "g") {
+			this.#scrollView.scrollToTop();
+			this.#scrollProgress = 0;
+		} else if (data === "G") {
+			this.#scrollView.scrollToBottom();
+			this.#scrollProgress = 1;
+		}
 	}
 
 	#handleToc(data: string): void {
@@ -517,7 +539,10 @@ export class PlanReviewOverlay implements Component {
 		const sectionIndex = this.#toc[this.#tocCursor];
 		if (sectionIndex === undefined) return;
 		const offset = this.#sectionOffsets[sectionIndex];
-		if (offset !== undefined) this.#scrollView.setScrollOffset(offset);
+		if (offset !== undefined) {
+			this.#scrollView.setScrollOffset(offset);
+			this.#captureScrollProgress();
+		}
 	}
 
 	/** Greatest ToC position whose section starts at or above the scroll offset. */
@@ -690,6 +715,23 @@ export class PlanReviewOverlay implements Component {
 		return parts.join(sep);
 	}
 
+	/**
+	 * Retain relative progress across reflow frames. A non-scrollable intermediate
+	 * frame has no meaningful offset, so it must not erase the last scroll position.
+	 */
+	#captureScrollProgress(): void {
+		const maxOffset = this.#scrollView.getMaxScrollOffset();
+		if (maxOffset > 0) this.#scrollProgress = this.#scrollView.getScrollOffset() / maxOffset;
+	}
+
+	#layoutBody(lines: readonly string[], height: number): void {
+		this.#captureScrollProgress();
+		this.#scrollView.setLines(lines);
+		this.#scrollView.setHeight(height);
+		const maxOffset = this.#scrollView.getMaxScrollOffset();
+		if (maxOffset > 0) this.#scrollView.setScrollOffset(Math.round(this.#scrollProgress * maxOffset));
+	}
+
 	/** Build the concatenated body lines and record each section's start row. */
 	#buildBody(bodyContentWidth: number): string[] {
 		const lines: string[] = [];
@@ -807,8 +849,7 @@ export class PlanReviewOverlay implements Component {
 		const regionRows = Math.max(MIN_BODY_ROWS, termHeight - chrome);
 
 		const bodyLines = this.#buildBody(bodyContentWidth);
-		this.#scrollView.setLines(bodyLines);
-		this.#scrollView.setHeight(regionRows);
+		this.#layoutBody(bodyLines, regionRows);
 		if (this.#pendingScrollToToc) {
 			this.#pendingScrollToToc = false;
 			this.#scrubBodyToToc();

package/src/modes/components/session-selector.ts

@@ -760,6 +760,7 @@ export class SessionSelectorComponent extends Container {
 	#globalSessions: SessionInfo[] | null = null;
 	#scope: "folder" | "all" = "folder";
 	#toggling = false;
+	#inputLocked = false;
 	// 0-based line where the session list begins within this component's own
 	// render, captured each frame. The fullscreen picker overlay paints from
 	// screen row 0, so a mouse row maps to `row - #listLineOffset` inside the
@@ -874,6 +875,10 @@ export class SessionSelectorComponent extends Container {
 	setOnRequestRender(callback: () => void): void {
 		this.#onRequestRender = callback;
 	}
+	/** Ignore input after selection while the host resumes the session. */
+	lockInput(): void {
+		this.#inputLocked = true;
+	}
 
 	/**
 	 * Dispose the session list explicitly: while the delete-confirmation dialog
@@ -972,6 +977,7 @@ export class SessionSelectorComponent extends Container {
 	}
 
 	handleInput(keyData: string): void {
+		if (this.#inputLocked) return;
 		if (keyData.startsWith("\x1b[<")) {
 			this.#handleMouse(keyData);
 			return;

package/src/modes/components/status-line/component.ts

@@ -1334,10 +1334,8 @@ export class StatusLineComponent implements Component {
 			return [];
 		}
 
-		const sortedStatuses = Array.from(this.#hookStatuses.entries())
+		return Array.from(this.#hookStatuses.entries())
 			.sort(([a], [b]) => a.localeCompare(b))
-			.map(([, text]) => sanitizeStatusText(text));
-		const hookLine = sortedStatuses.join(" ");
-		return [truncateToWidth(hookLine, width)];
+			.map(([, text]) => truncateToWidth(sanitizeStatusText(text), width));
 	}
 }

package/src/modes/components/tool-execution.test.ts

@@ -0,0 +1,101 @@
+import { beforeAll, describe, expect, it } from "bun:test";
+import type { AgentTool } from "@oh-my-pi/pi-agent-core";
+import { type Component, Text } from "@oh-my-pi/pi-tui";
+import { Settings } from "../../config/settings";
+import { getThemeByName, setThemeInstance, theme } from "../theme/theme";
+import { ToolExecutionComponent, type ToolExecutionUi } from "./tool-execution";
+
+class BoldTypeErrorComponent implements Component {
+	render(_width: number): readonly string[] {
+		throw new TypeError("th.bold is not a function");
+	}
+}
+
+function visibleText(lines: readonly string[]): string {
+	let text = lines.join("\n");
+	text = text.replace(/\x1b\]8;[^\x1b\x07]*(?:\x07|\x1b\\)/g, "");
+	text = text.replace(/\x1b\[[0-9;]*m/g, "");
+	return text;
+}
+
+describe("ToolExecutionComponent custom renderer failures", () => {
+	beforeAll(async () => {
+		await Settings.init({ inMemory: true });
+		const loaded = await getThemeByName("dark");
+		if (!loaded) throw new Error("theme unavailable");
+		setThemeInstance(loaded);
+	});
+
+	it("falls back to the custom tool label when a renderCall child component throws during render", () => {
+		const tool: AgentTool = {
+			name: "graphify_graph",
+			label: "Graphify Graph",
+			description: "renders a graph",
+			parameters: { type: "object", additionalProperties: true },
+			renderCall() {
+				return new BoldTypeErrorComponent();
+			},
+			async execute() {
+				return { content: [{ type: "text", text: "ok" }] };
+			},
+		};
+		const ui: ToolExecutionUi = {
+			requestRender() {},
+			requestComponentRender(_component: Component) {},
+			resetDisplay() {},
+		};
+		const component = new ToolExecutionComponent(
+			"graphify_graph",
+			{},
+			{ showImages: false },
+			tool,
+			ui,
+			process.cwd(),
+		);
+		let text = "";
+
+		expect(() => {
+			text = visibleText(component.render(80));
+		}).not.toThrow();
+		expect(text).toContain("Graphify Graph");
+	});
+
+	it("preserves raw result text when a renderResult child component throws during render", () => {
+		const rawResultText = "raw result survives child renderer failure";
+		const tool: AgentTool = {
+			name: "crashy_result_renderer",
+			label: "Crashy Result Renderer",
+			description: "renders result output",
+			parameters: { type: "object", additionalProperties: true },
+			renderCall() {
+				return new Text(theme.fg("toolTitle", theme.bold("Crashy Result Renderer")), 0, 0);
+			},
+			renderResult() {
+				return new BoldTypeErrorComponent();
+			},
+			async execute() {
+				return { content: [{ type: "text", text: rawResultText }] };
+			},
+		};
+		const ui: ToolExecutionUi = {
+			requestRender() {},
+			requestComponentRender(_component: Component) {},
+			resetDisplay() {},
+		};
+		const component = new ToolExecutionComponent(
+			"crashy_result_renderer",
+			{},
+			{ showImages: false },
+			tool,
+			ui,
+			process.cwd(),
+		);
+		component.updateResult({ content: [{ type: "text", text: rawResultText }] }, false);
+		let text = "";
+
+		expect(() => {
+			text = visibleText(component.render(80));
+		}).not.toThrow();
+		expect(text).toContain(rawResultText);
+	});
+});

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

@@ -40,7 +40,7 @@ import {
 } from "../../tools/render-utils";
 import { type FirstResultViewportRepaint, toolRenderers } from "../../tools/renderers";
 import { TODO_STRIKE_TOTAL_FRAMES, type TodoToolDetails } from "../../tools/todo";
-import { isFramedBlockComponent, renderStatusLine, WidthAwareText } from "../../tui";
+import { isFramedBlockComponent, markFramedBlockComponent, renderStatusLine, WidthAwareText } from "../../tui";
 import { sanitizeWithOptionalSixelPassthrough } from "../../utils/sixel";
 import { renderDiff } from "./diff";
 
@@ -148,6 +148,68 @@ function getArgsWithStreamedTextInput(args: unknown): unknown {
 	return input === undefined ? args : { ...record, input };
 }
 
+type ToolRendererStage = "call" | "result";
+
+class SafeToolRendererComponent implements Component {
+	#toolName: string;
+	#stage: ToolRendererStage;
+	#component: Component;
+	#fallback: () => Component | undefined;
+	#warned = false;
+	readonly wantsKeyRelease: boolean | undefined;
+
+	constructor(
+		toolName: string,
+		stage: ToolRendererStage,
+		component: Component,
+		fallback: () => Component | undefined,
+	) {
+		this.#toolName = toolName;
+		this.#stage = stage;
+		this.#component = component;
+		this.#fallback = fallback;
+		this.wantsKeyRelease = component.wantsKeyRelease;
+		if (isFramedBlockComponent(component)) {
+			markFramedBlockComponent(this);
+		}
+	}
+
+	render(width: number): readonly string[] {
+		try {
+			return this.#component.render(width);
+		} catch (err) {
+			if (!this.#warned) {
+				this.#warned = true;
+				logger.warn("Tool renderer failed", { tool: this.#toolName, stage: this.#stage, error: String(err) });
+			}
+			return this.#fallback()?.render(width) ?? [];
+		}
+	}
+
+	handleInput(data: string): void {
+		const handleInput = this.#component.handleInput;
+		if (handleInput === undefined) return;
+		handleInput.call(this.#component, data);
+	}
+
+	invalidate(): void {
+		const invalidate = this.#component.invalidate;
+		if (invalidate === undefined) return;
+		invalidate.call(this.#component);
+	}
+
+	setIgnoreTight(ignore: boolean): void {
+		const setIgnoreTight = this.#component.setIgnoreTight;
+		if (setIgnoreTight === undefined) return;
+		setIgnoreTight.call(this.#component, ignore);
+	}
+
+	dispose(): void {
+		const dispose = this.#component.dispose;
+		if (dispose === undefined) return;
+		dispose.call(this.#component);
+	}
+}
 /**
  * Transcript-side probe telling a block whether it is still inside the live
  * (repaintable) region. Implemented by `TranscriptContainer`; injected rather
@@ -157,6 +219,14 @@ export interface TranscriptLiveRegionProbe {
 	isBlockInLiveRegion(component: Component): boolean;
 }
 
+/** Minimal TUI surface ToolExecutionComponent uses to schedule repaints and share image budget. */
+export interface ToolExecutionUi {
+	requestRender(): void;
+	requestComponentRender(component: Component): void;
+	resetDisplay(): void;
+	imageBudget?: TUI["imageBudget"];
+}
+
 export interface ToolExecutionOptions {
 	snapshots?: SnapshotStore;
 	showImages?: boolean; // default: true (only used if terminal supports images)
@@ -240,7 +310,7 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 	// forcing the common image-free result to re-shape on every resize tick.
 	#renderedImageCount = 0;
 	#tool?: AgentTool;
-	#ui: TUI;
+	#ui: ToolExecutionUi;
 	#cwd: string;
 	#result?: {
 		content: Array<{ type: string; text?: string; data?: string; mimeType?: string }>;
@@ -308,7 +378,7 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 		args: any,
 		options: ToolExecutionOptions = {},
 		tool: AgentTool | undefined,
-		ui: TUI,
+		ui: ToolExecutionUi,
 		cwd: string = getProjectDir(),
 		_toolCallId?: string,
 	) {
@@ -902,8 +972,17 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 				if (tool.renderCall) {
 					try {
 						const callArgs = this.#getCallArgsForRender();
-						const callComponent = tool.renderCall(callArgs, this.#renderState, theme);
-						if (callComponent) this.#contentBox.addChild(callComponent as Component);
+						const callComponent = tool.renderCall(callArgs, this.#renderState, theme) as Component | undefined;
+						if (callComponent) {
+							this.#contentBox.addChild(
+								new SafeToolRendererComponent(
+									this.#toolName,
+									"call",
+									callComponent,
+									() => new Text(theme.fg("toolTitle", theme.bold(this.#toolLabel)), 0, 0),
+								),
+							);
+						}
 					} catch (err) {
 						logger.warn("Tool renderer failed", { tool: this.#toolName, error: String(err) });
 						// Fall back to default on error
@@ -934,7 +1013,15 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 						theme,
 						this.#args,
 					);
-					if (resultComponent) this.#contentBox.addChild(resultComponent);
+					if (resultComponent) {
+						this.#contentBox.addChild(
+							new SafeToolRendererComponent(this.#toolName, "result", resultComponent, () => {
+								const output = this.#getTextOutput();
+								if (!output) return undefined;
+								return new Text(theme.fg("toolOutput", replaceTabs(output)), 0, 0);
+							}),
+						);
+					}
 				} catch (err) {
 					logger.warn("Tool renderer failed", { tool: this.#toolName, error: String(err) });
 					// Fall back to showing raw output on error
@@ -991,7 +1078,11 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 							this.#renderState,
 							theme,
 						);
-						if (resultComponent) fileBox.addChild(resultComponent);
+						if (resultComponent) {
+							fileBox.addChild(
+								new SafeToolRendererComponent(this.#toolName, "result", resultComponent, () => undefined),
+							);
+						}
 					} catch (err) {
 						logger.warn("Tool renderer failed", { tool: this.#toolName, error: String(err) });
 					}
@@ -1038,7 +1129,16 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 					try {
 						const callArgs = this.#getCallArgsForRender();
 						const callComponent = renderer.renderCall(callArgs, this.#renderState, theme);
-						if (callComponent) this.#contentBox.addChild(callComponent);
+						if (callComponent) {
+							this.#contentBox.addChild(
+								new SafeToolRendererComponent(
+									this.#toolName,
+									"call",
+									callComponent,
+									() => new Text(theme.fg("toolTitle", theme.bold(this.#toolLabel)), 0, 0),
+								),
+							);
+						}
 					} catch (err) {
 						logger.warn("Tool renderer failed", { tool: this.#toolName, error: String(err) });
 						// Fall back to default on error
@@ -1059,7 +1159,15 @@ export class ToolExecutionComponent extends Container implements NativeScrollbac
 							theme,
 							this.#getCallArgsForRender(),
 						);
-						if (resultComponent) this.#contentBox.addChild(resultComponent);
+						if (resultComponent) {
+							this.#contentBox.addChild(
+								new SafeToolRendererComponent(this.#toolName, "result", resultComponent, () => {
+									const output = this.#getTextOutput();
+									if (!output) return undefined;
+									return new Text(theme.fg("toolOutput", replaceTabs(output)), 0, 0);
+								}),
+							);
+						}
 					} catch (err) {
 						logger.warn("Tool renderer failed", { tool: this.#toolName, error: String(err) });
 						// Fall back to showing raw output on error

package/src/modes/components/transcript-container.ts

@@ -79,6 +79,10 @@ function sealCommittedSnapshot(child: Component): void {
 	if (block.isDisplaceableBlock?.()) block.seal?.();
 }
 
+function setBlockCommittedRows(child: Component, rows: number): void {
+	(child as Component & Partial<NativeScrollbackCommittedRows>).setNativeScrollbackCommittedRows?.(rows);
+}
+
 // A "plain blank" row is empty or whitespace-only with no ANSI bytes. It marks
 // separation padding (a `Spacer`, or a no-background `paddingY` row) as opposed
 // to a background-colored padding row, whose escape sequences contain `\S` and
@@ -208,11 +212,35 @@ export class TranscriptContainer
 		this.#replayPending = false;
 	}
 
-	setNativeScrollbackCommittedRows(rows: number): void {
+	override setNativeScrollbackCommittedRows(rows: number): void {
 		this.#committedRows = Number.isFinite(rows) ? Math.max(0, Math.trunc(rows)) : 0;
+		for (let i = this.#compactedChildStart; i < this.children.length; i++) {
+			const child = this.children[i]!;
+			const segment = this.#segments[i];
+			if (segment === undefined || segment.component !== child) continue;
+			const committedContribution = Math.min(
+				segment.contribution.length,
+				Math.max(0, this.#committedRows - segment.startRow - segment.sep),
+			);
+			if (committedContribution === 0) {
+				setBlockCommittedRows(child, 0);
+				continue;
+			}
+			// Transcript assembly strips plain blank edges from each block. Map the
+			// committed contribution back into the child's raw render coordinates so
+			// nested containers can split the prefix against their exact child rows.
+			let leadingTrimmedRows = 0;
+			while (leadingTrimmedRows < segment.rawRef.length && isPlainBlank(segment.rawRef[leadingTrimmedRows]!)) {
+				leadingTrimmedRows++;
+			}
+			setBlockCommittedRows(child, Math.min(segment.rawRef.length, leadingTrimmedRows + committedContribution));
+		}
 	}
 
-	prepareNativeScrollbackReplay(): void {
+	override prepareNativeScrollbackReplay(): void {
+		// Replay retires the old terminal tape, so descendants may discard layout
+		// locks whose only purpose was keeping that immutable history byte-stable.
+		super.prepareNativeScrollbackReplay();
 		if (this.#compactedChildStart === 0) return;
 		this.#compactedChildStart = 0;
 		this.#replayPending = true;

package/src/modes/controllers/command-controller-shared.ts

@@ -105,5 +105,5 @@ export function showCommandMessage(ctx: InteractiveModeContext, text: string): v
 	block.addChild(new DynamicBorder());
 	block.addChild(new Text(text, 1, 1));
 	block.addChild(new DynamicBorder());
-	ctx.present(block);
+	ctx.presentCommandOutput(block);
 }

package/src/modes/controllers/command-controller.ts

@@ -64,7 +64,7 @@ function showMarkdownPanel(ctx: InteractiveModeContext, title: string, markdown:
 	block.addChild(new Spacer(1));
 	block.addChild(new Markdown(markdown.trim(), 1, 1, getMarkdownTheme()));
 	block.addChild(new DynamicBorder());
-	ctx.present(block);
+	ctx.presentCommandOutput(block);
 }
 
 export class CommandController {

package/src/modes/controllers/event-controller.ts

@@ -1187,6 +1187,7 @@ export class EventController {
 		// final history — seal it instead of letting its spinner tick while idle.
 		this.#resolveDisplaceablePoll();
 		this.#resolveDisplaceableTodo();
+		this.ctx.flushPendingCommandOutput();
 		this.#lastAssistantComponent = undefined;
 		this.ctx.ui.requestRender();
 		this.#scheduleIdleCompaction();