@xynogen/pix-pretty 1.15.0 → 1.16.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@xynogen/pix-pretty",
-	"version": "1.15.0",
+	"version": "1.16.1",
 	"description": "Enhanced tool output rendering with syntax highlighting, file icons, tree views, diff rendering, and FFF search",
 	"type": "module",
 	"main": "src/index.ts",

package/src/types.ts

@@ -42,9 +42,11 @@ export type ToolContent = TextContent | ImageContent;
 
 export type ToolResultLike<TDetails = unknown> = AgentToolResult<TDetails | undefined>;
 
-type TextComponentLike = {
+export type TextComponentLike = {
 	setText(value: string): void;
 	getText?: () => string;
+	render?: (width: number) => string[];
+	invalidate?: () => void;
 };
 
 export type TextComponentCtor = new (text?: string, x?: number, y?: number) => TextComponentLike;

package/src/utils.test.ts

@@ -4,6 +4,7 @@ import { MAX_PREVIEW_LINES } from "./config.js";
 import type { FgTheme } from "./types.js";
 import {
 	dotJoin,
+	fillToolBackground,
 	formatCollapsedToolRow,
 	formatJson,
 	hideCollapsedToolCall,
@@ -13,8 +14,93 @@ import {
 	renderDimPreview,
 	ruleFrame,
 	setResultDetails,
+	viewportText,
 } from "./utils.js";
 
+class MockTextComponent {
+	private text = "";
+
+	setText(value: string): void {
+		this.text = value;
+	}
+
+	render(): string[] {
+		return this.text.split("\n");
+	}
+
+	invalidate(): void {}
+}
+
+// Counting variant: records how often the inner component is re-fitted, so a
+// regression that recomputes every frame (the pre-memo CPU bug) fails loudly.
+class CountingTextComponent {
+	static setCalls = 0;
+	private text = "";
+	setText(value: string): void {
+		CountingTextComponent.setCalls++;
+		this.text = value;
+	}
+	render(): string[] {
+		return this.text.split("\n");
+	}
+	invalidate(): void {}
+}
+
+describe("viewportText", () => {
+	it("trims a pre-filled row to Pi's narrower fullscreen viewport", () => {
+		const text = viewportText(MockTextComponent);
+		text.setText(fillToolBackground("tool", "", 10));
+
+		expect(plain(text.render(9)[0]!)).toBe("tool".padEnd(9));
+		expect(plain(text.render(10)[0]!)).toBe("tool".padEnd(10));
+	});
+
+	it("memoizes: repeat render at same width does not re-fit the inner component", () => {
+		CountingTextComponent.setCalls = 0;
+		const text = viewportText(CountingTextComponent);
+		text.setText("line one\nline two");
+
+		text.render(20);
+		text.render(20);
+		text.render(20);
+		// One fit for the width; repeats hit the cache. Pre-memo this was 3.
+		expect(CountingTextComponent.setCalls).toBe(1);
+	});
+
+	it("re-fits when width changes, and again when it returns", () => {
+		CountingTextComponent.setCalls = 0;
+		const text = viewportText(CountingTextComponent);
+		text.setText("abcdefghij");
+
+		text.render(20);
+		text.render(5); // width changed → re-fit
+		text.render(5); // same → cached
+		text.render(20); // changed back → re-fit
+		expect(CountingTextComponent.setCalls).toBe(3);
+	});
+
+	it("re-fits after setText changes the content", () => {
+		CountingTextComponent.setCalls = 0;
+		const text = viewportText(CountingTextComponent);
+		text.setText("first");
+		text.render(20);
+		text.render(20); // cached
+		text.setText("second"); // invalidates memo
+		text.render(20); // re-fit
+		expect(CountingTextComponent.setCalls).toBe(2);
+	});
+
+	it("setText with identical value is a no-op (no memo invalidation)", () => {
+		CountingTextComponent.setCalls = 0;
+		const text = viewportText(CountingTextComponent);
+		text.setText("same");
+		text.render(20);
+		text.setText("same"); // identical → must not invalidate
+		text.render(20); // still cached
+		expect(CountingTextComponent.setCalls).toBe(1);
+	});
+});
+
 // Strip ANSI escapes so assertions test content, not color codes.
 const ANSI = /\x1b\[[0-9;]*m/g;
 function plain(text: string): string {

package/src/utils.ts

@@ -14,6 +14,8 @@ import {
 import { MAX_PREVIEW_LINES } from "./config.js";
 import type {
 	FgTheme,
+	TextComponentCtor,
+	TextComponentLike,
 	ToolContent,
 	ToolImageContent,
 	ToolResultLike,
@@ -48,6 +50,62 @@ export function fillToolBackground(text: string, bg = BG_BASE, width?: number):
 		.join("\n");
 }
 
+export function viewportTextConstructor(TextComponent: TextComponentCtor): TextComponentCtor {
+	return function ViewportTextComponent(text = "") {
+		const component = viewportText(TextComponent);
+		component.setText(text);
+		return component;
+	} as unknown as TextComponentCtor;
+}
+
+export function viewportText(
+	TextComponent: TextComponentCtor,
+): TextComponentLike & ViewportComponent {
+	return new ViewportText(new TextComponent("", 0, 0));
+}
+
+type ViewportComponent = {
+	render(width: number): string[];
+	invalidate(): void;
+};
+
+class ViewportText implements TextComponentLike, ViewportComponent {
+	private text = "";
+	// Pi re-renders every frame (spinner/streaming). Without this cache each
+	// frame re-split + re-truncated the full text AND re-setText'd the inner
+	// component (re-dirtying it), burning CPU on unchanged content.
+	private fittedWidth = -1;
+	private fittedText = "";
+
+	constructor(private readonly component: TextComponentLike) {}
+
+	setText(value: string): void {
+		if (value === this.text) return;
+		this.text = value;
+		this.fittedWidth = -1; // invalidate memo
+	}
+
+	getText(): string {
+		return this.text;
+	}
+
+	render(width: number): string[] {
+		if (width !== this.fittedWidth) {
+			this.fittedText = this.text
+				.split("\n")
+				.map((line) => truncateToWidth(line, width, ""))
+				.join("\n");
+			this.fittedWidth = width;
+			this.component.setText(this.fittedText);
+		}
+		return this.component.render?.(width) ?? this.fittedText.split("\n");
+	}
+
+	invalidate(): void {
+		this.component.invalidate?.();
+	}
+}
+
 export function pluralize(count: number, noun: string, plural?: string): string {
 	return `${count} ${count === 1 ? noun : (plural ?? `${noun}s`)}`;
 }