pi-claude-code-ui 1.0.87 → 1.0.89

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 > [!IMPORTANT]
 > **1.0.69 — package rename (permanent).** Canonical npm name is now [`pi-claude-code-ui`](https://www.npmjs.com/package/pi-claude-code-ui). `pi-claude-style-tools` is legacy and will not receive further releases. Install with `pi install npm:pi-claude-code-ui` or `npm i pi-claude-code-ui`.
 
+## 1.0.89 — 2026-10-19
+
+### Fixed
+
+- **Direct MCP tools show what they did** - `mcp__<server>__<tool>` rows showed only `MCP status` until expanded. They now show `server:tool` and the main argument (for example `MCP subagents:Agent Debug NaN`), and grouped headers list the tool names (`Agent, Ctx Reduce`) instead of `Mcp Subagents Agent`.
+- **Running tool rows no longer draw their header twice** - the first pending blink invalidated the row while Pi was still building it, which left the call line in the row twice until the next redraw (until the result arrived on expanded rows). Affected every tool, not only MCP.
+- **Theme switches repaint everything** - after `/theme` or a light/dark switch, diff previews kept the old diff palette, rows inside tool groups kept the old colors, and the spinner verb/status kept the old theme until restart. All three now follow the new theme.
+- **MCP output uses the same dim color as other tools** - MCP running previews and expanded output were drawn in `toolOutput`, brighter than read, bash, grep and other tools.
+
+### Performance
+
+- **Each diff preview renders once** - since 1.0.80 edit, write and apply_patch rows started their Shiki render at a guessed width and rendered again once the real row width was known. On resume every diff row paid twice. Rows now wait for their width: half the diff renders, and the first frame of a 60-row tool history dropped from about 37 ms to 8 ms in the benchmark.
+
+## 1.0.88 — 2026-10-19
+
+### Added
+
+- **`diffLayout` setting** ([#34](https://github.com/FammasMaz/pi-cc-tools/issues/34)) - `"auto"` (default) keeps the current behavior and uses split view only when it fits without heavy wrapping. `"split"` always shows side-by-side diffs when both code columns fit, and `"unified"` always stacks them. Applies to `edit`, `write` and `apply_patch` previews.
+
+### Fixed
+
+- **Finished edits keep their diff after resume, expand and resize** (Jerry, [#37](https://github.com/FammasMaz/pi-cc-tools/pull/37), fixes [#35](https://github.com/FammasMaz/pi-cc-tools/issues/35)) - edits are located once before they run and their start lines are saved in the result details, so a resumed session redraws the same diff at the same line numbers instead of only the stats line, and expanding or resizing no longer drops back to line 1. Sessions saved before this change are located from the patch Pi already stores with each edit result.
+
 ## 1.0.87 — 2026-10-19
 
 ### Fixed

package/README.md

@@ -57,6 +57,7 @@ Set in `.pi/settings.json` or the active Pi agent settings file (`$PI_CODING_AGE
   "liveToolPreview": true,
   "liveToolPreviewLines": 5,
   "diffCollapsedLines": 24,
+  "diffLayout": "auto",
   "themeAdaptive": true,
   "diffTheme": "github-dark"
 }
@@ -152,6 +153,7 @@ Use `/cc-tools` to control tool UI at runtime:
 | `liveToolPreview` | `true` | Show a small live output preview while tools are still running |
 | `liveToolPreviewLines` | `5` | Lines shown in the collapsed live preview |
 | `diffCollapsedLines` | `24` | Diff lines before collapsing |
+| `diffLayout` | `"auto"` | `"auto"` uses split view only when it fits without heavy wrapping; `"split"` always uses split view when both columns fit; `"unified"` always stacks |
 
 ## Notes
 

package/extensions/index.ts

@@ -89,6 +89,8 @@ const PATCH_FLAG = Symbol.for("pi-claude-style-tools:patched-container-render");
 const TOOL_RENDER_CACHE = Symbol.for("pi-claude-style-tools:tool-render-cache");
 const COMPONENT_PARENT = Symbol.for("pi-claude-style-tools:component-parent");
 const PARENT_TRACKING_PATCH_FLAG = Symbol.for("pi-claude-style-tools:patched-parent-tracking");
+const TOOL_UPDATE_DISPLAY_ACTIVE = Symbol("pi-claude-style-tools:update-display-active");
+const TOOL_UPDATE_DISPLAY_RERUN = Symbol("pi-claude-style-tools:update-display-rerun");
 const TOOL_CACHE_PATCH_FLAG = Symbol.for("pi-claude-style-tools:patched-tool-cache-invalidation");
 const TOOL_MOUSE_PATCH_FLAG = Symbol.for("pi-claude-style-tools:patched-tool-fullscreen-mouse");
 const FULLSCREEN_HOVER_PATCH_FLAG = Symbol.for("pi-claude-style-tools:patched-fullscreen-hover");
@@ -124,6 +126,8 @@ interface SettingsFile {
 	liveToolPreviewLines?: number;
 	showTruncationHints?: boolean;
 	diffCollapsedLines?: number;
+	/** Diff layout: "auto" (default) picks split only when it fits cleanly; "split" and "unified" force one layout. */
+	diffLayout?: "auto" | "split" | "unified";
 	diffTheme?: string;
 	diffColors?: Record<string, string>;
 	/**
@@ -613,7 +617,7 @@ function getGroupedToolName(tools: any[]): string | undefined {
 
 function getToolGroupLabel(tools: any[]): string {
 	const sameName = getGroupedToolName(tools);
-	return sameName ? humanizeToolName(sameName) : "Multiple Tools";
+	return sameName ? toolDisplayName(sameName) : "Multiple Tools";
 }
 
 function getToolGroupOverallStatus(tools: any[]): ToolStatus {
@@ -681,7 +685,7 @@ function formatToolNameList(tools: any[]): string {
 		counts.set(name, (counts.get(name) ?? 0) + 1);
 	}
 	return [...counts.entries()]
-		.map(([name, count]) => `${humanizeToolName(name)}${count > 1 ? `×${count}` : ""}`)
+		.map(([name, count]) => `${toolDisplayName(name)}${count > 1 ? `×${count}` : ""}`)
 		.join(", ");
 }
 
@@ -761,6 +765,7 @@ function getToolArgSummary(tool: any): string {
 	if (name === "grep") return `"${summarizeText(args.pattern ?? "", 40)}"${args.path ? ` in ${args.path}` : ""}`;
 	if (name === "find") return `"${summarizeText(args.pattern ?? "", 40)}"${args.path ? ` in ${args.path}` : ""}`;
 	if (name === "ls") return shortPath(process.cwd(), args.path ?? ".");
+	if (parseNamespacedMcpToolName(name)) return summarizeDirectMcpArgs(args);
 	return summarizeText(getStringArg(args, "path", "file_path", "url", "query", "name", "subject", "tool", "description", "prompt") || name, 72);
 }
 
@@ -771,7 +776,7 @@ function getToolCallLine(tool: any): string {
 		return line.replaceAll(WRAP_MARK, "").replaceAll(CLIP_MARK, "");
 	}
 	const summary = getToolArgSummary(tool);
-	const label = humanizeToolName(getToolName(tool));
+	const label = toolDisplayName(getToolName(tool));
 	return `${label}${summary ? ` ${summary}` : ""}`;
 }
 
@@ -915,6 +920,7 @@ class ToolGroupComponent extends Container {
 	private cachedStatusKey?: string;
 	private cachedToolCount?: number;
 	private cachedLines?: string[];
+	private paletteFingerprint?: string;
 
 	private clearRenderCache(): void {
 		this.dirty = true;
@@ -984,6 +990,15 @@ class ToolGroupComponent extends Container {
 		// only; children keep their own ToolText/TOOL_RENDER_CACHE entries and
 		// recompute only when their content actually changes.
 		this.clearRenderCache();
+		// Exception: a theme switch (Pi calls ui.invalidate()) changes colors the
+		// child renderers baked into their text, so those must re-run once.
+		// (Child invalidation re-enters here via clearToolRenderCache; the palette is
+		// recorded first so that re-entry is a no-op.)
+		const palette = currentThemePaletteFingerprint();
+		if (palette === undefined || palette === this.paletteFingerprint) return;
+		const changed = this.paletteFingerprint !== undefined;
+		this.paletteFingerprint = palette;
+		if (changed) for (const tool of this.tools) tool?.invalidate?.();
 	}
 
 	handleMouse(event: TuiMouseEvent): TuiMouseEventResult | undefined {
@@ -1009,6 +1024,8 @@ class ToolGroupComponent extends Container {
 		}
 		const safeWidth = Number.isFinite(width) ? Math.max(1, Math.floor(width)) : 1;
 		// Fast path: settled groups with a valid memo skip ALL child walks.
+		// Remember the palette this group was drawn with (see invalidate()).
+		if (this.paletteFingerprint === undefined) this.paletteFingerprint = currentThemePaletteFingerprint();
 		// Child mutations mark dirty via clearToolRenderCache → invalidate().
 		if (
 			!this.dirty
@@ -2965,6 +2982,11 @@ function syncLiveToolRenderState(component: any): void {
 		state._liveLineCount = collectNonEmptyLines(raw, 0).total;
 	} else if (component?.isPartial !== true) {
 		delete state._liveLineCount;
+		// renderCall never sees the result, so hand a finished edit's details over: its diff is redrawn from them, not from
+		// the file. A call aborted while streaming ends with a bare error instead of a toolResult; it never drew a diff.
+		if (component?.toolName === "edit" && component.result && (!ctxLike.isError || component.result.role === "toolResult")) {
+			state._editResult = component.result.details ?? {};
+		}
 	}
 }
 
@@ -2987,7 +3009,7 @@ function patchToolRenderCacheInvalidation(): void {
 	for (const method of methods) {
 		const original = proto[method];
 		if (typeof original !== "function") continue;
-		proto[method] = function patchedToolMutation(...args: any[]) {
+		const run = function patchedToolMutation(this: any, ...args: any[]) {
 			clearToolRenderCache(this);
 			if (method === "updateDisplay" || method === "updateResult" || method === "invalidate") {
 				syncLiveToolRenderState(this);
@@ -2996,6 +3018,28 @@ function patchToolRenderCacheInvalidation(): void {
 			clearToolRenderCache(this);
 			return result;
 		};
+		proto[method] = method !== "updateDisplay" ? run : function patchedToolUpdateDisplay(this: any, ...args: any[]) {
+			// A renderer can invalidate its own row while updateDisplay is building it
+			// (the first pending blink registration does). Pi's updateDisplay clears the
+			// content box and re-adds regions, so a nested pass leaves the call/result
+			// regions twice in the box until the next redraw. Defer it to one rerun.
+			if (this[TOOL_UPDATE_DISPLAY_ACTIVE]) {
+				this[TOOL_UPDATE_DISPLAY_RERUN] = true;
+				return undefined;
+			}
+			this[TOOL_UPDATE_DISPLAY_ACTIVE] = true;
+			try {
+				let result = run.apply(this, args);
+				if (this[TOOL_UPDATE_DISPLAY_RERUN]) {
+					this[TOOL_UPDATE_DISPLAY_RERUN] = false;
+					result = run.apply(this, args);
+				}
+				return result;
+			} finally {
+				this[TOOL_UPDATE_DISPLAY_ACTIVE] = false;
+				this[TOOL_UPDATE_DISPLAY_RERUN] = false;
+			}
+		};
 	}
 
 	proto[TOOL_CACHE_PATCH_FLAG] = true;
@@ -3269,6 +3313,7 @@ function fileExistsForTool(cwd: string, filePath: string): boolean {
 }
 
 const WRITE_EXISTED_BEFORE = new Map<string, boolean>();
+const EDIT_LOCALIZED = new Map<string, Promise<LocalizedEditDiff[] | null>>();
 
 interface RtkRewriteRecord {
 	original: string;
@@ -3780,6 +3825,9 @@ class ToolText extends Text {
 	private toolCachedLines?: string[];
 	private observedWidth?: number;
 	private pendingObservedWidth?: number;
+	getObservedWidth(): number | undefined {
+		return this.observedWidth;
+	}
 	private widthObserver?: (width: number) => void;
 	private widthObserverScheduled = false;
 
@@ -4145,6 +4193,13 @@ function themeBgRgb(theme: any, key: string): Rgb | null {
 let _themePaletteCacheTheme: unknown = null;
 let _themePaletteCacheName: string | null = null;
 let _themePaletteCacheFingerprint: string | null = null;
+// Pi passes the same global theme Proxy everywhere, so keeping the last one lets
+// non-render code (group invalidation) read the current palette.
+let _lastSeenTheme: unknown = null;
+
+function currentThemePaletteFingerprint(): string | undefined {
+	return _lastSeenTheme ? themePaletteFingerprint(_lastSeenTheme) : undefined;
+}
 
 /** Resolved-color fingerprint so palette re-derives when the active theme file changes under the same name/object. */
 function themePaletteFingerprint(theme: any): string {
@@ -4559,6 +4614,7 @@ function resetThemePalette(): void {
 
 function applyThemePaletteIfNeeded(theme: any): void {
 	if (!theme) return;
+	_lastSeenTheme = theme;
 	if (!themeAdaptiveEnabled()) {
 		applyToolBranchColor(theme);
 		syncOutlineChromeFromBranch(theme);
@@ -4749,10 +4805,26 @@ function branchDiffWidth(componentWidth?: number, chromeWidth = 2): number {
 	return Math.max(20, Math.min(width - chromeWidth, MAX_TERM_WIDTH));
 }
 
+// Diff preview cache keys also carry _toolBranchVisualEpoch, which applyThemePaletteIfNeeded
+// bumps when the theme palette changes: otherwise rows rendered before a /theme or light/dark
+// switch kept the old diff backgrounds and stat colors while new rows used the new ones.
 function contextDiffWidth(ctx: any, chromeWidth = 2): number {
 	return branchDiffWidth(ctx.state?._diffComponentWidth, chromeWidth);
 }
 
+// Diff previews are laid out for the row's real width, which is only known after the
+// row's text component has rendered once. Starting the async Shiki render before that
+// used the termW() guess and rendered every diff a second time once the real width
+// arrived (on resume: every edit/write row, twice). Wait for the width instead; the
+// width observer invalidates the row as soon as it is known.
+function diffWidthReady(ctx: any): boolean {
+	if (typeof ctx.state?._diffComponentWidth === "number") return true;
+	const seen = ctx.lastComponent instanceof ToolText ? ctx.lastComponent.getObservedWidth() : undefined;
+	if (seen === undefined || !ctx.state) return false;
+	ctx.state._diffComponentWidth = seen;
+	return true;
+}
+
 function adaptiveWrapRows(tw?: number): number {
 	const width = tw ?? termW();
 	if (width >= 180) return MAX_WRAP_ROWS_WIDE;
@@ -4955,12 +5027,20 @@ function maxLineNumber(lines: DiffLine[]): number {
 	return max;
 }
 
+function diffLayout(): "auto" | "split" | "unified" {
+	return getMode(readSettings().diffLayout, ["auto", "split", "unified"] as const, "auto");
+}
+
 function shouldUseSplit(diff: ParsedDiff, tw: number, maxRows = MAX_PREVIEW_LINES): boolean {
 	if (!diff.lines.length) return false;
-	if (tw < SPLIT_MIN_WIDTH) return false;
+	const layout = diffLayout();
+	if (layout === "unified") return false;
 	const nw = Math.max(2, String(maxLineNumber(diff.lines)).length);
 	const half = Math.floor((tw - 1) / 2);
 	const gw = nw + 5;
+	// Forced split still needs room for both code columns; below that it would overflow the row.
+	if (layout === "split") return half - gw >= 12;
+	if (tw < SPLIT_MIN_WIDTH) return false;
 	const cw = Math.max(12, half - gw);
 	if (cw < SPLIT_MIN_CODE_WIDTH) return false;
 	const vis = diff.lines.slice(0, maxRows);
@@ -5557,15 +5637,71 @@ function getFirstChangedNewLine(diff: ParsedDiff): number {
 	return 0;
 }
 
+// Where an edit's diff starts in the old and the new file, plus the text it replaced if that is not oldText verbatim
+// (a fuzzy match). Saved with the result: once the edit has run, the file no longer holds oldText to find these again.
+interface SavedEditPreview {
+	oldLine: number;
+	newLine: number;
+	oldText?: string;
+}
+
 interface LocalizedEditDiff {
 	diff: ParsedDiff;
 	line: number;
+	saved?: SavedEditPreview;
 }
 
-async function computeLocalizedEditDiffs(filePath: string, operations: Array<{ oldText: string; newText: string }>, cwd: string): Promise<LocalizedEditDiff[] | null> {
+function restoreLocalizedEditDiffs(saved: unknown, operations: Array<{ oldText: string; newText: string }>): LocalizedEditDiff[] | null {
+	if (!Array.isArray(saved) || saved.length !== operations.length) return null;
+	return operations.map((edit, i) => {
+		const { oldLine, newLine, oldText } = saved[i] as SavedEditPreview;
+		const diff = offsetParsedDiff(parseDiff(oldText ?? normalizeToLf(edit.oldText), normalizeToLf(edit.newText)), oldLine - 1, newLine - 1);
+		return { diff, line: getFirstChangedNewLine(diff) };
+	});
+}
+
+// Results saved before SavedEditPreview existed: the patch Pi saves with every edit result still holds the old lines
+// around each change, at their old line numbers. Lines it does not hold can match nothing.
+function oldContentFromPatch(patch: string, operations: Array<{ oldText: string; newText: string }>): string {
+	const known: string[] = [];
+	const changes: number[] = [];
+	for (const hunk of Diff.parsePatch(patch)[0]?.hunks ?? []) {
+		let at = hunk.oldStart - 1;
+		for (const line of hunk.lines) {
+			if (line[0] === "-" || line[0] === "+") changes.push(at);
+			if (line[0] === " " || line[0] === "-") known[at++] = line.slice(1);
+		}
+	}
+	// The patch keeps 4 lines around a change. An oldText reaching further supplies the missing lines itself, but only if
+	// it fits in exactly one place touching a change: a chance fit elsewhere would put the edit on the wrong line.
+	const fuzzy = known.map(normalizeTextForFuzzyMatch);
+	for (const { oldText } of operations) {
+		const own = normalizeToLf(oldText).split("\n");
+		const want = normalizeTextForFuzzyMatch(normalizeToLf(oldText)).split("\n");
+		const last = want.length - 1;
+		const starts = new Set<number>();
+		for (const change of changes) {
+			for (let at = Math.max(0, change - want.length); at <= change; at++) starts.add(at);
+		}
+		const fits = [...starts].filter((at) => {
+			let overlaps = false;
+			return want.every((line, i) => {
+				const have = fuzzy[at + i];
+				if (have === undefined) return true;
+				overlaps = true;
+				return i === 0 ? have.endsWith(line) : i === last ? have.startsWith(line) : have === line;
+			}) && overlaps;
+		});
+		// An empty first or last piece is only the line break before or after oldText, not a line of its own.
+		if (fits.length === 1) own.forEach((line, i) => { if (line || (i > 0 && i < last)) known[fits[0] + i] ??= line; });
+	}
+	return `${Array.from(known, (line) => line ?? "\u0000").join("\n")}\n`;
+}
+
+async function computeLocalizedEditDiffs(filePath: string, operations: Array<{ oldText: string; newText: string }>, cwd: string, savedPatch?: string): Promise<LocalizedEditDiff[] | null> {
 	if (!filePath || operations.length === 0) return null;
 	try {
-		const rawContent = await readFileAsync(resolve(cwd, filePath), "utf8");
+		const rawContent = savedPatch === undefined ? await readFileAsync(resolve(cwd, filePath), "utf8") : oldContentFromPatch(savedPatch, operations);
 		const normalizedContent = normalizeToLf(stripBomText(rawContent));
 		const normalizedOps = operations.map((edit) => ({ oldText: normalizeToLf(edit.oldText), newText: normalizeToLf(edit.newText) }));
 		const baseContent = normalizedOps.some((edit) => findEditMatch(normalizedContent, edit.oldText).usedFuzzyMatch)
@@ -5590,7 +5726,9 @@ async function computeLocalizedEditDiffs(filePath: string, operations: Array<{ o
 			const oldStartLine = lineNumberAtIndex(baseContent, match.matchIndex);
 			const newStartLine = oldStartLine + lineDelta;
 			const diff = offsetParsedDiff(parseDiff(oldChunk, match.newText), oldStartLine - 1, newStartLine - 1);
-			localized[match.editIndex] = { diff, line: getFirstChangedNewLine(diff) };
+			const saved: SavedEditPreview = { oldLine: oldStartLine, newLine: newStartLine };
+			if (oldChunk !== normalizedOps[match.editIndex].oldText) saved.oldText = oldChunk;
+			localized[match.editIndex] = { diff, line: getFirstChangedNewLine(diff), saved };
 			lineDelta += countLineBreaks(match.newText) - countLineBreaks(oldChunk);
 		}
 		return localized.every(Boolean) ? (localized as LocalizedEditDiff[]) : null;
@@ -5939,6 +6077,18 @@ function isMcpToolName(name: string): boolean {
 	return name === "mcp" || /^mcp[_:-]/i.test(name) || /[_:-]mcp[_:-]/i.test(name);
 }
 
+// Direct MCP tools are registered as `mcp__<server>__<tool>`; their args are the
+// tool's own args, not the gateway's `{ tool, server, ... }`.
+function parseNamespacedMcpToolName(name: string): { server: string; tool: string } | undefined {
+	const match = /^mcp__(.+?)__(.+)$/.exec(name);
+	return match ? { server: match[1], tool: match[2] } : undefined;
+}
+
+function toolDisplayName(name: string): string {
+	const direct = parseNamespacedMcpToolName(name);
+	return humanizeToolName(direct ? direct.tool : name);
+}
+
 function shouldUseGenericToolRenderer(name: unknown): boolean {
 	return typeof name === "string" && name.length > 0 && !CORE_TOOL_OVERRIDES.has(name);
 }
@@ -6445,8 +6595,11 @@ function renderApplyPatchCall(args: any, theme: Theme, ctx: any, sp: (path: stri
 	}
 	ctx.state._openAiPatchFiles = preview.changes.map((change) => change.displayPath);
 
+	if (!diffWidthReady(ctx)) {
+		return makeResponsiveDiffText(ctx, ctx.lastComponent, `${hdr}\n${withBranch(theme.fg("muted", "(rendering…)"), theme, false, true)}`);
+	}
 	const diffWidth = contextDiffWidth(ctx);
-	const key = `apply-preview:${ctx.state._applyPatchMetaKey ?? hashText(patchText)}:${diffWidth}:${ctx.expanded ? 1 : 0}`;
+	const key = `apply-preview:${ctx.state._applyPatchMetaKey ?? hashText(patchText)}:${diffWidth}:${ctx.expanded ? 1 : 0}:${_toolBranchVisualEpoch}`;
 	if (ctx.state._applyPatchPreviewKey !== key) {
 		ctx.state._applyPatchPreviewKey = key;
 		ctx.state._applyPatchPreviewBody = theme.fg("muted", "(rendering…)");
@@ -6529,7 +6682,37 @@ function renderApplyPatchResult(result: any, isPartial: boolean, theme: Theme, c
 	return makeText(ctx.lastComponent, withBranch(`${theme.fg("success", "Applied")} ${meta.changeCount} files ${summary}${meta.totalLines ? ` ${theme.fg("muted", `(${meta.totalLines} diff lines)`)}` : ""}`, theme));
 }
 
-function summarizeMcpToolCall(args: any, theme: Theme): string {
+const DIRECT_MCP_SUMMARY_KEYS = [
+	"description", "subject", "title", "query", "path", "file_path", "url", "command", "name",
+	"agent_id", "agentId", "taskId", "task_id", "threadId", "drop", "target", "message", "prompt", "task",
+] as const;
+
+function summarizeArgValue(value: unknown): string {
+	if (typeof value === "string") return value.trim();
+	if (typeof value === "number" || typeof value === "boolean") return String(value);
+	if (Array.isArray(value) && value.every((item) => typeof item === "string" || typeof item === "number")) return value.join(", ");
+	return "";
+}
+
+function summarizeDirectMcpArgs(args: any): string {
+	if (!args || typeof args !== "object") return "";
+	for (const key of DIRECT_MCP_SUMMARY_KEYS) {
+		const value = summarizeArgValue(args[key]);
+		if (value) return summarizeText(value, 72);
+	}
+	for (const [key, raw] of Object.entries(args)) {
+		const value = summarizeArgValue(raw);
+		if (value) return summarizeText(`${key}: ${value}`, 72);
+	}
+	return "";
+}
+
+function summarizeMcpToolCall(name: string, args: any, theme: Theme): string {
+	const direct = parseNamespacedMcpToolName(name);
+	if (direct) {
+		const detail = summarizeDirectMcpArgs(args);
+		return `${direct.server}:${direct.tool}${detail ? ` ${theme.fg("muted", detail)}` : ""}`;
+	}
 	const tool = getStringArg(args, "tool");
 	if (tool) return args?.server ? `${args.server}:${tool}` : tool;
 	const connect = getStringArg(args, "connect");
@@ -6540,14 +6723,14 @@ function summarizeMcpToolCall(args: any, theme: Theme): string {
 }
 
 function summarizeGenericToolCall(name: string, args: any, theme: Theme, sp: (path: string) => string): string {
-	if (isMcpToolName(name)) return summarizeMcpToolCall(args, theme);
+	if (isMcpToolName(name)) return summarizeMcpToolCall(name, args, theme);
 	return summarizeOpenAiToolCall(name, args, theme, sp);
 }
 
 function renderMcpToolResult(result: any, expanded: boolean, isPartial: boolean, theme: Theme, ctx: any): Text {
 	if (isPartial) {
 		return makeText(ctx.lastComponent, runningPreviewBlock(result, theme.fg("dim", "MCP running..."), expanded, theme, ctx, {
-			styleLine: (line) => theme.fg("toolOutput", line || " "),
+			styleLine: (line) => theme.fg("dim", line || " "),
 		}));
 	}
 	clearBlinkTimer(ctx);
@@ -6571,7 +6754,7 @@ function renderMcpToolResult(result: any, expanded: boolean, isPartial: boolean,
 		theme,
 		previewLimit(),
 		lines.length,
-		(line) => theme.fg(ctx.isError ? "error" : "toolOutput", line || " "),
+		(line) => theme.fg(ctx.isError ? "error" : "dim", line || " "),
 	);
 	return makeText(ctx.lastComponent, withBranch(`${statusText}\n${preview}`, theme));
 }
@@ -7631,10 +7814,14 @@ export default function (pi: ExtensionAPI) {
 			if (d?._type === "diff") {
 				const previewLines = ctx.expanded ? MAX_RENDER_LINES : diffCollapsedLimit();
 				const hunks = d.diff?.lines?.filter((l: any) => l.type === "sep").length + (d.diff?.lines?.length ? 1 : 0);
+				if (!diffWidthReady(ctx)) {
+					const pendingSummary = diffSummaryWithMeta(d.diff.added, d.diff.removed, hunks, "");
+					return makeResponsiveDiffText(ctx, ctx.lastComponent, withFinalBranchBlock(`${pendingSummary}\n${theme.fg("muted", "rendering diff…")}`, theme));
+				}
 				const diffWidth = contextDiffWidth(ctx);
 				const mode = shouldUseSplit(d.diff, diffWidth, previewLines) ? "split" : "unified";
 				const richSummary = diffSummaryWithMeta(d.diff.added, d.diff.removed, hunks, mode);
-				const key = `wd:${diffWidth}:${d.summary}:${d.diff?.lines?.length ?? 0}:${d.language ?? ""}:${ctx.expanded ? 1 : 0}`;
+				const key = `wd:${diffWidth}:${d.summary}:${d.diff?.lines?.length ?? 0}:${d.language ?? ""}:${ctx.expanded ? 1 : 0}:${_toolBranchVisualEpoch}`;
 				if (ctx.state._wdk !== key) {
 					ctx.state._wdk = key;
 					ctx.state._wdt = withFinalBranchBlock(`${richSummary}\n${theme.fg("muted", "rendering diff…")}`, theme);
@@ -7661,8 +7848,11 @@ export default function (pi: ExtensionAPI) {
 				const syntheticDiff = getCachedParsedDiff(ctx, `nf-diff:${d.filePath}:${contentHash}`, "", content);
 				const richSummary = diffSummaryWithMeta(syntheticDiff.added, 0, 1, "new file");
 				const previewLines = ctx.expanded ? MAX_RENDER_LINES : diffCollapsedLimit();
+				if (!diffWidthReady(ctx)) {
+					return makeResponsiveDiffText(ctx, ctx.lastComponent, withFinalBranchBlock(`${richSummary}\n${theme.fg("muted", "rendering diff…")}`, theme));
+				}
 				const diffWidth = contextDiffWidth(ctx);
-				const pk = `nf:${d.filePath}:${contentHash}:${diffWidth}:${ctx.expanded ? 1 : 0}`;
+				const pk = `nf:${d.filePath}:${contentHash}:${diffWidth}:${ctx.expanded ? 1 : 0}:${_toolBranchVisualEpoch}`;
 				if (ctx.state._nfk !== pk) {
 					ctx.state._nfk = pk;
 					ctx.state._nft = withFinalBranchBlock(`${richSummary}\n${theme.fg("muted", "rendering diff…")}`, theme);
@@ -7686,6 +7876,13 @@ export default function (pi: ExtensionAPI) {
 	});
 
 	const editTool = createEditTool(cwd);
+	// The live preview and execute() share one look at the file, taken before the edit runs: what the row shows live is
+	// then exactly what is saved with the result, and so what it shows again after a resume.
+	const localizeEditOnce = (toolCallId: string, filePath: string, operations: Array<{ oldText: string; newText: string }>) => {
+		let localized = EDIT_LOCALIZED.get(toolCallId);
+		if (!localized) EDIT_LOCALIZED.set(toolCallId, localized = computeLocalizedEditDiffs(filePath, operations, cwd));
+		return localized;
+	};
 	pi.registerTool({
 		name: "edit",
 		label: "edit",
@@ -7696,11 +7893,14 @@ export default function (pi: ExtensionAPI) {
 		async execute(toolCallId, params, signal, onUpdate, _ctx) {
 			const fp = params.path ?? (params as any).file_path ?? "";
 			const operations = getEditOperations(params);
-			const localizedDiffs = operations.length === 1 ? await computeLocalizedEditDiffs(fp, operations, cwd) : null;
+			const localizedDiffs = await localizeEditOnce(toolCallId, fp, operations);
+			EDIT_LOCALIZED.delete(toolCallId);
 			const result = await editTool.execute(toolCallId, params, signal, onUpdate);
 			if (operations.length === 0) return result;
 			const { diffs, summary, totalLines, totalHunks } = summarizeEditOperations(operations);
 			const baseDetails = (((result as any).details ?? {}) as Record<string, unknown>);
+			// null: the edits could not be located, and the row showed (and keeps showing) the diff without file line numbers.
+			const preview = localizedDiffs?.map((entry) => entry.saved) ?? null;
 			if (operations.length === 1) {
 				const localized = localizedDiffs?.[0];
 				const editLine = localized?.line ?? (typeof baseDetails.firstChangedLine === "number" ? baseDetails.firstChangedLine : 0);
@@ -7713,6 +7913,7 @@ export default function (pi: ExtensionAPI) {
 					hunks: countDiffHunks(diff),
 					added: diff?.added ?? 0,
 					removed: diff?.removed ?? 0,
+					preview,
 				};
 				return result;
 			}
@@ -7725,6 +7926,7 @@ export default function (pi: ExtensionAPI) {
 				hunks: totalHunks,
 				totalAdded: diffs.reduce((sum, diff) => sum + diff.added, 0),
 				totalRemoved: diffs.reduce((sum, diff) => sum + diff.removed, 0),
+				preview,
 			};
 			return result;
 		},
@@ -7735,16 +7937,28 @@ export default function (pi: ExtensionAPI) {
 			const summary = stableCallSummary(ctx, "_callSummary", () => shouldRevealCallArgs(ctx) && operations.length > 1 ? `${sp(fp)} ${theme.fg("muted", `(${operations.length} edits)`)}` : sp(fp), revealSummary);
 			syncToolCallStatus(ctx);
 			const hdr = toolHeader("Edit", summary, theme, ` ${toolStatusDot(ctx, theme)}`, liveLineCountTrailing(ctx, theme));
-			if (!(ctx.argsComplete && operations.length > 0)) return makeText(ctx.lastComponent, hdr);
+			// History replay never sets argsComplete; a finished edit is drawn from its result instead.
+			const finished = ctx.state._editResult as Record<string, unknown> | undefined;
+			if (!((ctx.argsComplete || finished) && operations.length > 0)) return makeText(ctx.lastComponent, hdr);
+			if (!diffWidthReady(ctx)) {
+				const pending = liveBranchDisplay(ctx.state, theme) ?? indentBranchBlock(withBranch(theme.fg("muted", "(rendering…)"), theme, false, true));
+				return makeResponsiveDiffText(ctx, ctx.lastComponent, `${hdr}\n${pending}`);
+			}
 			const diffWidth = contextDiffWidth(ctx, 3);
-			const key = `edit:${fp}:${hashText(operations.map((edit) => `${edit.oldText}\u0000${edit.newText}`).join("\u0001"))}:${diffWidth}:${ctx.expanded ? 1 : 0}`;
+			const key = `edit:${fp}:${hashText(operations.map((edit) => `${edit.oldText}\u0000${edit.newText}`).join("\u0001"))}:${diffWidth}:${ctx.expanded ? 1 : 0}:${_toolBranchVisualEpoch}`;
 			const { diffs: fallbackDiffs, summary: editSummary } = getCachedEditOperationSummary(ctx, key, operations);
 			if (ctx.state._pk !== key) {
 				ctx.state._pk = key;
 				ctx.state._ptBody = theme.fg("muted", "(rendering…)");
 				ctx.state._ptDisplay = indentBranchBlock(withBranch(ctx.state._ptBody, theme, false, true));
 				const lg = lang(fp);
-				void computeLocalizedEditDiffs(fp, operations, cwd)
+				// Located once per row: expanding or resizing must not look in the file again, it no longer holds oldText.
+				ctx.state._editLocalized ??= !finished
+					? localizeEditOnce(ctx.toolCallId, fp, operations)
+					: "preview" in finished
+						? Promise.resolve(restoreLocalizedEditDiffs(finished.preview, operations))
+						: computeLocalizedEditDiffs(fp, operations, cwd, typeof finished.patch === "string" ? finished.patch : "");
+				void (ctx.state._editLocalized as Promise<LocalizedEditDiff[] | null>)
 					.then((localizedDiffs) => {
 						if (ctx.state._pk !== key) return;
 						const diffs = localizedDiffs?.map((entry) => entry.diff) ?? fallbackDiffs;
@@ -7913,6 +8127,7 @@ export default function (pi: ExtensionAPI) {
 		clearAllBashDurationContexts();
 		clearRtkRewriteState();
 		WRITE_EXISTED_BEFORE.clear();
+		EDIT_LOCALIZED.clear();
 		clearHighlightCache();
 		invalidateThemePaletteCache();
 		bumpToolBranchVisualEpoch();

package/extensions/spinner.ts

@@ -73,7 +73,6 @@ function themeAdaptiveEnabled(): boolean {
 const _DEFAULT_CLAUDE_ORANGE = "\x1b[38;2;215;119;87m";
 const _DEFAULT_STATUS_DIM = "\x1b[38;2;153;153;153m";
 
-let _themeColorsCacheTheme: unknown = null;
 let _themeColorsLastAdaptive: boolean | null = null;
 let _themeColorsLastVerbKey: string | null = null;
 let _themeColorsLastStatusKey: string | null = null;
@@ -105,7 +104,6 @@ function applyThemeColors(theme: any): void {
 		_themeColorsLastAdaptive = adaptive;
 		_themeColorsLastVerbKey = verbColor;
 		_themeColorsLastStatusKey = statusColor;
-		_themeColorsCacheTheme = null;
 		if (!adaptive) {
 			CLAUDE_ORANGE = _DEFAULT_CLAUDE_ORANGE;
 			STATUS_DIM = _DEFAULT_STATUS_DIM;
@@ -113,9 +111,9 @@ function applyThemeColors(theme: any): void {
 	}
 
 	if (!theme || !adaptive) return;
-	if (_themeColorsCacheTheme === theme) return;
-	_themeColorsCacheTheme = theme;
-
+	// ctx.ui.theme is Pi's global theme Proxy: the same object before and after
+	// /theme or a light/dark switch, so an identity cache never refreshed the
+	// spinner colors. Resolving is two map lookups per tick; just do it.
 	const verb = resolveThemeColor(theme, verbColor, "accent");
 	if (verb) CLAUDE_ORANGE = verb;
 	const status = resolveThemeColor(theme, statusColor, "muted");
@@ -792,8 +790,7 @@ export default function (pi: ExtensionAPI) {
 		}
 		// Re-derive colors on every tick so /cc-spinner verb/status changes
 		// take effect within ~250 ms without waiting for the next pi event.
-		// applyThemeColors is identity-cached on (theme, verbKey, statusKey) so
-		// this is cheap when nothing changed.
+		// applyThemeColors only re-resolves two theme colors, so this is cheap.
 		applyThemeColors(activeCtx.ui?.theme);
 		const nextMessage = buildWorkingMessage();
 		if (!force && nextMessage === lastWorkingMessage) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-claude-code-ui",
-  "version": "1.0.87",
+  "version": "1.0.89",
   "description": "Claude Code-style grouped tool rows for pi with Ctrl+O/Ctrl+Shift+O previews, math rendering, and consistent built-in, MCP, and custom tool rendering",
   "keywords": [
     "pi-package",