@xynogen/pix-pretty 1.15.0 → 1.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@xynogen/pix-pretty",
-	"version": "1.15.0",
+	"version": "1.16.0",
 	"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,33 @@ 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 {}
+}
+
+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));
+	});
+});
+
 // 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,53 @@ 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 = "";
+
+	constructor(private readonly component: TextComponentLike) {}
+
+	setText(value: string): void {
+		this.text = value;
+		this.component.setText(value);
+	}
+
+	getText(): string {
+		return this.text;
+	}
+
+	render(width: number): string[] {
+		const fitted = this.text
+			.split("\n")
+			.map((line) => truncateToWidth(line, width, ""))
+			.join("\n");
+		this.component.setText(fitted);
+		return this.component.render?.(width) ?? fitted.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`)}`;
 }