@oh-my-pi/pi-coding-agent 15.10.12 → 15.11.1

package/src/modes/components/assistant-message.ts

@@ -36,6 +36,16 @@ export class AssistantMessageComponent extends Container {
 	 * transcript keeps the error in history.
 	 */
 	#errorPinned = false;
+	/**
+	 * Monotonic content version reported to the transcript container via
+	 * {@link getTranscriptBlockVersion}. Bumped by {@link updateContent} — the
+	 * choke point every mutator funnels through, including the post-finalize
+	 * ones: `setErrorPinned(false)` restoring the inline error at the next
+	 * turn's `agent_start`, late tool-result images, async Kitty conversions,
+	 * and `setUsageInfo`. Without it, the container's committed-scrollback
+	 * bypass would replay this block's pre-mutation bytes forever.
+	 */
+	#blockVersion = 0;
 	/** Whether the last updateContent carried an in-flight streaming partial; such
 	 *  renders bypass the markdown module LRU (see Markdown.transientRenderCache). */
 	#lastUpdateTransient = false;
@@ -86,6 +96,10 @@ export class AssistantMessageComponent extends Container {
 		return this.#transcriptBlockFinalized;
 	}
 
+	getTranscriptBlockVersion(): number {
+		return this.#blockVersion;
+	}
+
 	markTranscriptBlockFinalized(): void {
 		this.#transcriptBlockFinalized = true;
 	}
@@ -215,6 +229,7 @@ export class AssistantMessageComponent extends Container {
 	}
 
 	updateContent(message: AssistantMessage, opts?: { transient?: boolean }): void {
+		this.#blockVersion++;
 		this.#lastMessage = message;
 		this.#lastUpdateTransient = opts?.transient === true;
 

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

@@ -73,7 +73,11 @@ export class BtwPanelComponent extends Container {
 		this.addChild(new Text(this.#footerLine(), 1, 0));
 		this.addChild(new Spacer(1));
 		this.addChild(new DynamicBorder(str => theme.fg("dim", str)));
-		this.#tui.requestRender();
+		// 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 {

package/src/modes/components/compaction-summary-message.ts

@@ -1,51 +1,87 @@
-import { Box, Markdown, Spacer, Text } from "@oh-my-pi/pi-tui";
+import { Box, type Component, Markdown } from "@oh-my-pi/pi-tui";
 import { getMarkdownTheme, theme } from "../../modes/theme/theme";
 import type { CompactionSummaryMessage } from "../../session/messages";
 
 /**
- * Component that renders a compaction message with collapsed/expanded state.
- * Uses same background color as hook messages for visual consistency.
+ * Compaction point in the transcript, rendered as a slim horizontal divider:
+ *
+ *   ──────── 📷 compacted · ctrl+o ────────
+ *
+ * The conversation above the divider stays visible (display transcript keeps
+ * full history); only the LLM context was reset. Expanding (ctrl+o) reveals
+ * the compaction summary below the divider.
  */
-export class CompactionSummaryMessageComponent extends Box {
+export class CompactionSummaryMessageComponent implements Component {
 	#expanded = false;
+	#cache?: { width: number; lines: string[] };
+	#detail?: Box;
 
-	constructor(private readonly message: CompactionSummaryMessage) {
-		super(1, 1, t => theme.bg("customMessageBg", t));
-		this.#updateDisplay();
-	}
+	constructor(private readonly message: CompactionSummaryMessage) {}
 
 	setExpanded(expanded: boolean): void {
+		if (this.#expanded === expanded) return;
 		this.#expanded = expanded;
-		this.#updateDisplay();
+		this.#cache = undefined;
 	}
 
-	override invalidate(): void {
-		super.invalidate();
-		this.#updateDisplay();
+	invalidate(): void {
+		this.#cache = undefined;
+		// Theme may have changed — rebuild the detail box lazily on next render.
+		this.#detail = undefined;
 	}
 
-	#updateDisplay(): void {
-		this.clear();
+	render(width: number): readonly string[] {
+		width = Math.max(1, width);
+		if (this.#cache?.width === width) {
+			return this.#cache.lines;
+		}
+		const lines = this.#expanded
+			? ["", this.#divider(width), "", ...this.#detailBox().render(width)]
+			: ["", this.#divider(width), ""];
+		this.#cache = { width, lines };
+		return lines;
+	}
 
-		const tokenStr = this.message.tokensBefore.toLocaleString();
-		const label = theme.fg("customMessageLabel", theme.bold("[compaction]"));
-		this.addChild(new Text(label, 0, 0));
-		this.addChild(new Spacer(1));
+	#divider(width: number): string {
+		const rule = theme.tree.horizontal;
+		const label = `${theme.icon.camera} compacted`;
+		// sep.dot ships pre-padded (" · "); trim so the hint joins with single spaces.
+		const hint = `${theme.sep.dot.trim()} ctrl+o`;
+		const plainWidth = Bun.stringWidth(`${label} ${hint}`, { countAnsiEscapeCodes: false });
+		// ` label hint ` framed by rules on both sides.
+		const remaining = width - plainWidth - 2;
+		if (remaining < 4) {
+			// Too narrow for a framed rule — emit the bare label.
+			return theme.fg("muted", label);
+		}
+		const left = Math.floor(remaining / 2);
+		const right = remaining - left;
+		return (
+			theme.fg("dim", rule.repeat(left)) +
+			` ${theme.fg("muted", label)} ${theme.fg("dim", hint)} ` +
+			theme.fg("dim", rule.repeat(right))
+		);
+	}
 
-		if (this.#expanded) {
-			const header = `**Compacted from ${tokenStr} tokens**\n\n`;
-			this.addChild(
-				new Markdown(header + this.message.summary, 0, 0, getMarkdownTheme(), {
+	#detailBox(): Box {
+		if (this.#detail) return this.#detail;
+		const box = new Box(1, 1, t => theme.bg("customMessageBg", t));
+		const tokenStr = this.message.tokensBefore.toLocaleString();
+		const frameCount = this.message.images?.length ?? 0;
+		const frameNote =
+			frameCount > 0 ? `\n\n_${frameCount} snapcompact frame${frameCount === 1 ? "" : "s"} attached_` : "";
+		box.addChild(
+			new Markdown(
+				`**Compacted from ${tokenStr} tokens**\n\n${this.message.summary}${frameNote}`,
+				0,
+				0,
+				getMarkdownTheme(),
+				{
 					color: (text: string) => theme.fg("customMessageText", text),
-				}),
-			);
-		} else {
-			this.addChild(
-				new Text(theme.fg("customMessageText", `Compacted from ${tokenStr} tokens (ctrl+o to expand)`), 0, 0),
-			);
-			if (this.message.shortSummary) {
-				this.addChild(new Text(theme.fg("customMessageText", this.message.shortSummary), 0, 1));
-			}
-		}
+				},
+			),
+		);
+		this.#detail = box;
+		return box;
 	}
 }

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

@@ -175,6 +175,8 @@ export class CustomEditor extends Editor {
 	onDequeue?: () => void;
 	/** Called when Caps Lock is pressed. */
 	onCapsLock?: () => void;
+	/** Called when left-arrow is pressed while the editor is empty (cursor necessarily at start). */
+	onLeftAtStart?: () => void;
 
 	/** Custom key handlers from extensions and non-built-in app actions. */
 	#customKeyHandlers = new Map<KeyId, () => void>();
@@ -257,6 +259,14 @@ export class CustomEditor extends Editor {
 		const parsedKey = parseKey(data);
 		const canonical = parsedKey !== undefined ? canonicalKeyId(parsedKey) : undefined;
 
+		// Left-arrow on an empty editor: surface for the agent-hub double-tap
+		// gesture. Plain "left" only — modified arrows and any in-text cursor
+		// movement fall through to normal handling.
+		if (canonical === "left" && this.onLeftAtStart && this.getText().trim() === "") {
+			this.onLeftAtStart();
+			return;
+		}
+
 		if (canonical !== undefined) {
 			// Intercept configured image paste (async - fires and handles result)
 			if (this.#matchesAction(canonical, "app.clipboard.pasteImage") && this.onPasteImage) {

package/src/modes/components/mcp-add-wizard.ts

@@ -57,6 +57,7 @@ export interface MCPAddWizardOAuthResult {
 	credentialId: string;
 	clientId?: string;
 	clientSecret?: string;
+	resource?: string;
 }
 
 interface WizardState {
@@ -71,6 +72,7 @@ interface WizardState {
 	oauthClientId: string;
 	oauthClientSecret: string;
 	oauthScopes: string;
+	oauthResource: string;
 	oauthCredentialId: string | null;
 	apiKey: string;
 	authLocation: AuthLocation | null;
@@ -101,6 +103,7 @@ export class MCPAddWizard extends Container {
 		oauthClientId: "",
 		oauthClientSecret: "",
 		oauthScopes: "",
+		oauthResource: "",
 		oauthCredentialId: null,
 		apiKey: "",
 		authLocation: null,
@@ -122,6 +125,7 @@ export class MCPAddWizard extends Container {
 				clientId: string,
 				clientSecret: string,
 				scopes: string,
+				resource?: string,
 		  ) => Promise<MCPAddWizardOAuthResult>)
 		| null = null;
 	#onTestConnectionCallback: ((config: MCPServerConfig) => Promise<void>) | null = null;
@@ -136,6 +140,7 @@ export class MCPAddWizard extends Container {
 			clientId: string,
 			clientSecret: string,
 			scopes: string,
+			resource?: string,
 		) => Promise<MCPAddWizardOAuthResult>,
 		onTestConnection?: (config: MCPServerConfig) => Promise<void>,
 		onRender?: () => void,
@@ -987,6 +992,7 @@ export class MCPAddWizard extends Container {
 					this.#state.oauthTokenUrl = oauth.tokenUrl;
 					this.#state.oauthClientId = oauth.clientId || "";
 					this.#state.oauthScopes = oauth.scopes || "";
+					this.#state.oauthResource = oauth.resource || (this.#state.transport === "stdio" ? "" : this.#state.url);
 					this.#state.authMethod = "oauth";
 
 					this.#contentContainer.clear();
@@ -1054,6 +1060,7 @@ export class MCPAddWizard extends Container {
 					type: "oauth",
 					credentialId: this.#state.oauthCredentialId,
 					tokenUrl: this.#state.oauthTokenUrl || undefined,
+					resource: this.#state.oauthResource || undefined,
 					clientId: this.#state.oauthClientId || undefined,
 					clientSecret: this.#state.oauthClientSecret || undefined,
 				};
@@ -1081,6 +1088,7 @@ export class MCPAddWizard extends Container {
 				type: "oauth",
 				credentialId: this.#state.oauthCredentialId,
 				tokenUrl: this.#state.oauthTokenUrl || undefined,
+				resource: this.#state.oauthResource || undefined,
 				clientId: this.#state.oauthClientId || undefined,
 				clientSecret: this.#state.oauthClientSecret || undefined,
 			};
@@ -1142,12 +1150,14 @@ export class MCPAddWizard extends Container {
 
 		try {
 			// Call OAuth handler
+			const oauthResource = this.#state.oauthResource || (this.#state.transport === "stdio" ? "" : this.#state.url);
 			const oauthResult = await this.#onOAuthCallback(
 				this.#state.oauthAuthUrl,
 				this.#state.oauthTokenUrl,
 				this.#state.oauthClientId,
 				this.#state.oauthClientSecret,
 				this.#state.oauthScopes,
+				oauthResource || undefined,
 			);
 
 			// Store credential ID + any dynamically-registered client credentials,
@@ -1155,6 +1165,7 @@ export class MCPAddWizard extends Container {
 			this.#state.oauthCredentialId = oauthResult.credentialId;
 			if (oauthResult.clientId) this.#state.oauthClientId = oauthResult.clientId;
 			if (oauthResult.clientSecret) this.#state.oauthClientSecret = oauthResult.clientSecret;
+			this.#state.oauthResource = oauthResult.resource ?? oauthResource;
 
 			// Show success message
 			this.#contentContainer.clear();
@@ -1284,6 +1295,7 @@ export class MCPAddWizard extends Container {
 					type: "oauth",
 					credentialId: this.#state.oauthCredentialId,
 					tokenUrl: this.#state.oauthTokenUrl || undefined,
+					resource: this.#state.oauthResource || undefined,
 					clientId: this.#state.oauthClientId || undefined,
 					clientSecret: this.#state.oauthClientSecret || undefined,
 				};
@@ -1312,6 +1324,7 @@ export class MCPAddWizard extends Container {
 				type: "oauth",
 				credentialId: this.#state.oauthCredentialId,
 				tokenUrl: this.#state.oauthTokenUrl || undefined,
+				resource: this.#state.oauthResource || undefined,
 				clientId: this.#state.oauthClientId || undefined,
 				clientSecret: this.#state.oauthClientSecret || undefined,
 			};

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

@@ -196,6 +196,7 @@ export interface StatusLinePreviewSettings {
 	rightSegments?: StatusLineSegmentId[];
 	separator?: StatusLineSeparatorStyle;
 	sessionAccent?: boolean;
+	transparent?: boolean;
 }
 
 export interface SettingsCallbacks {
@@ -590,6 +591,7 @@ export class SettingsSelectorComponent extends Container {
 			rightSegments: settings.get("statusLine.rightSegments"),
 			separator: settings.get("statusLine.separator"),
 			sessionAccent: settings.get("statusLine.sessionAccent"),
+			transparent: settings.get("statusLine.transparent"),
 		};
 		this.callbacks.onStatusLinePreview?.(statusLineSettings);
 		this.#updateStatusPreview();

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

@@ -3,7 +3,7 @@ import * as path from "node:path";
 import type { AgentMessage } from "@oh-my-pi/pi-agent-core";
 import { estimateTokens } from "@oh-my-pi/pi-agent-core/compaction";
 import { type Component, truncateToWidth, visibleWidth } from "@oh-my-pi/pi-tui";
-import { formatCount, getProjectDir } from "@oh-my-pi/pi-utils";
+import { getProjectDir } from "@oh-my-pi/pi-utils";
 import { $ } from "bun";
 import { settings } from "../../../config/settings";
 import type { AgentSession } from "../../../session/agent-session";
@@ -196,6 +196,7 @@ export class StatusLineComponent implements Component {
 			showHookStatus: settings.get("statusLine.showHookStatus"),
 			segmentOptions: settings.getGroup("statusLine").segmentOptions,
 			sessionAccent: settings.get("statusLine.sessionAccent"),
+			transparent: settings.get("statusLine.transparent"),
 		};
 	}
 
@@ -713,7 +714,15 @@ export class StatusLineComponent implements Component {
 		const ctx = this.#buildSegmentContext(width, effectiveSettings.segmentOptions, includeContext);
 		const separatorDef = getSeparator(effectiveSettings.separator ?? "powerline-thin", theme);
 
-		const bgAnsi = theme.getBgAnsi("statusLineBg");
+		// `transparent` reuses the empty-string sentinel (`\x1b[49m`) so the bar
+		// inherits the terminal's default background, matching custom themes that
+		// set `statusLineBg: ""`. Powerline end caps need a contrasting fill to
+		// bridge the bar into the surrounding terminal; without one they read as
+		// stray glyphs, so the cap renderer drops them when the fill is empty.
+		const TRANSPARENT_BG_ANSI = "\x1b[49m";
+		const themeBgAnsi = theme.getBgAnsi("statusLineBg");
+		const bgAnsi = effectiveSettings.transparent ? TRANSPARENT_BG_ANSI : themeBgAnsi;
+		const transparentBg = bgAnsi === TRANSPARENT_BG_ANSI;
 		const fgAnsi = theme.getFgAnsi("text");
 		const sepAnsi = theme.getFgAnsi("statusLineSep");
 
@@ -738,9 +747,7 @@ export class StatusLineComponent implements Component {
 
 		const runningBackgroundJobs = this.session.getAsyncJobSnapshot()?.running.length ?? 0;
 		if (runningBackgroundJobs > 0) {
-			const icon = theme.icon.agents ? `${theme.icon.agents} ` : "";
-			const label = `${formatCount("job", runningBackgroundJobs)} running`;
-			rightParts.push(theme.fg("statusLineSubagents", `${icon}${label}`));
+			rightParts.unshift(theme.fg("statusLineSubagents", `${theme.icon.job} ${runningBackgroundJobs}`));
 		}
 		const topFillWidth = Math.max(0, width);
 		const left = [...leftParts];
@@ -748,8 +755,10 @@ export class StatusLineComponent implements Component {
 
 		const leftSepWidth = visibleWidth(separatorDef.left);
 		const rightSepWidth = visibleWidth(separatorDef.right);
-		const leftCapWidth = separatorDef.endCaps ? visibleWidth(separatorDef.endCaps.right) : 0;
-		const rightCapWidth = separatorDef.endCaps ? visibleWidth(separatorDef.endCaps.left) : 0;
+		// Transparent mode drops powerline caps (they need a bg fill to bridge),
+		// so the width budget excludes them too.
+		const leftCapWidth = separatorDef.endCaps && !transparentBg ? visibleWidth(separatorDef.endCaps.right) : 0;
+		const rightCapWidth = separatorDef.endCaps && !transparentBg ? visibleWidth(separatorDef.endCaps.left) : 0;
 
 		const groupWidth = (parts: string[], capWidth: number, sepWidth: number): number => {
 			if (parts.length === 0) return 0;
@@ -810,11 +819,12 @@ export class StatusLineComponent implements Component {
 		const renderGroup = (parts: string[], direction: "left" | "right"): string => {
 			if (parts.length === 0) return "";
 			const sep = direction === "left" ? separatorDef.left : separatorDef.right;
-			const cap = separatorDef.endCaps
-				? direction === "left"
-					? separatorDef.endCaps.right
-					: separatorDef.endCaps.left
-				: "";
+			const cap =
+				separatorDef.endCaps && !transparentBg
+					? direction === "left"
+						? separatorDef.endCaps.right
+						: separatorDef.endCaps.left
+					: "";
 			const capPrefix = separatorDef.endCaps?.useBgAsFg ? bgAnsi.replace("\x1b[48;", "\x1b[38;") : bgAnsi + sepAnsi;
 			const capText = cap ? `${capPrefix}${cap}\x1b[0m` : "";
 

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

@@ -18,6 +18,9 @@ export interface StatusLineSettings {
 	segmentOptions?: StatusLineSegmentOptions;
 	showHookStatus?: boolean;
 	sessionAccent?: boolean;
+	/** Drop the theme's `statusLineBg` fill and powerline caps so the bar
+	 *  inherits the terminal's default background. */
+	transparent?: boolean;
 }
 
 export type EffectiveStatusLineSettings = Required<

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

@@ -19,6 +19,7 @@ import type { Theme } from "../../modes/theme/theme";
 import { theme } from "../../modes/theme/theme";
 import { BASH_DEFAULT_PREVIEW_LINES } from "../../tools/bash";
 import { EVAL_DEFAULT_PREVIEW_LINES } from "../../tools/eval";
+import { isWaitingPollDetails } from "../../tools/job";
 import {
 	formatArgsInline,
 	JSON_TREE_MAX_DEPTH_COLLAPSED,
@@ -194,6 +195,11 @@ export class ToolExecutionComponent extends Container {
 	// sealed the block stays in the transcript's repaintable live region so a
 	// late result still repaints instead of stranding the streaming preview.
 	#sealed = false;
+	// A `job` poll result whose watched jobs are all still running. Such a
+	// block never finalizes (stays in the transcript live region) so a
+	// follow-up `job` call can displace it instead of stacking another
+	// "waiting on N jobs" frame. Cleared by `seal()`.
+	#displaceable = false;
 	#renderState: {
 		spinnerFrame?: number;
 		expanded: boolean;
@@ -359,6 +365,11 @@ export class ToolExecutionComponent extends Container {
 	): void {
 		this.#result = result;
 		this.#isPartial = isPartial;
+		// A `job` poll that found every watched job still running is transient
+		// "still waiting" chrome; keep the block displaceable so the next `job`
+		// call replaces it instead of stacking another waiting frame (see the
+		// event controller's displaceable-poll bookkeeping).
+		this.#displaceable = this.#toolName === "job" && result.isError !== true && isWaitingPollDetails(result.details);
 		// When tool is complete, ensure args are marked complete so spinner stops
 		if (!isPartial) {
 			this.#argsComplete = true;
@@ -425,7 +436,11 @@ export class ToolExecutionComponent extends Container {
 			(this.#result?.details as { async?: { state?: string } } | undefined)?.async?.state === "running";
 		const isBackgroundAsyncTask = this.#toolName === "task" && isBackgroundAsyncRunning;
 		const isPartialTask = this.#isPartial && this.#toolName === "task" && !isBackgroundAsyncTask;
-		const needsSpinner = isStreamingArgs || isPartialTask;
+		// A displaceable waiting poll keeps its spinner ticking: it reads as one
+		// persistent live poll, and the changing leading glyph keeps the
+		// transcript's stable-prefix ratchet from committing rows of a block
+		// that a follow-up `job` call may remove.
+		const needsSpinner = isStreamingArgs || isPartialTask || this.isDisplaceableBlock();
 		if (needsSpinner && !this.#spinnerInterval) {
 			const now = performance.now();
 			const frameCount = theme.spinnerFrames.length;
@@ -513,6 +528,9 @@ export class ToolExecutionComponent extends Container {
 	isTranscriptBlockFinalized(): boolean {
 		if (this.#sealed) return true;
 		if (this.#result === undefined) return false;
+		// A displaceable waiting poll stays live: its rows are kept out of
+		// native scrollback so a follow-up `job` call can remove the block.
+		if (this.#displaceable) return false;
 		if (!this.#isPartial) return true;
 		// Partial result: a background async tool is accepted to freeze (the agent
 		// continues while it runs and would otherwise pin an unbounded live region);
@@ -528,11 +546,23 @@ export class ToolExecutionComponent extends Container {
 	seal(): void {
 		if (this.#sealed) return;
 		this.#sealed = true;
+		this.#displaceable = false;
 		this.stopAnimation();
 		this.#updateDisplay();
 		this.#ui.requestRender();
 	}
 
+	/**
+	 * Whether this block is a waiting `job` poll (every watched job still
+	 * running) that has not been sealed. Such a block never finalized, so none
+	 * of its rows entered native scrollback (the ticking spinner keeps the
+	 * stable-prefix ratchet at zero) and the whole block can be removed when a
+	 * follow-up `job` call supersedes it.
+	 */
+	isDisplaceableBlock(): boolean {
+		return this.#displaceable && !this.#sealed;
+	}
+
 	/**
 	 * Stop spinner animation and cleanup resources.
 	 */