@oh-my-pi/pi-tui 9.1.0 → 9.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@oh-my-pi/pi-tui",
-	"version": "9.1.0",
+	"version": "9.1.1",
 	"description": "Terminal User Interface library with differential rendering for efficient text-based applications",
 	"type": "module",
 	"main": "./src/index.ts",
@@ -47,7 +47,7 @@
 		"bun": ">=1.3.7"
 	},
 	"dependencies": {
-		"@oh-my-pi/pi-natives": "9.1.0",
+		"@oh-my-pi/pi-natives": "9.1.1",
 		"@types/mime-types": "^3.0.1",
 		"chalk": "^5.6.2",
 		"marked": "^17.0.1",

package/src/components/box.ts

@@ -1,6 +1,13 @@
 import type { Component } from "../tui";
 import { applyBackgroundToLine, visibleWidth } from "../utils";
 
+type Cache = {
+	key: string[];
+	width: number;
+	bgSample: string | undefined;
+	result: string[];
+};
+
 /**
  * Box component - a container that applies padding and background to all children
  */
@@ -11,10 +18,7 @@ export class Box implements Component {
 	private bgFn?: (text: string) => string;
 
 	// Cache for rendered output
-	private cachedWidth?: number;
-	private cachedChildLines?: string;
-	private cachedBgSample?: string;
-	private cachedLines?: string[];
+	private cached?: Cache;
 
 	constructor(paddingX = 1, paddingY = 1, bgFn?: (text: string) => string) {
 		this.paddingX = paddingX;
@@ -46,10 +50,18 @@ export class Box implements Component {
 	}
 
 	private invalidateCache(): void {
-		this.cachedWidth = undefined;
-		this.cachedChildLines = undefined;
-		this.cachedBgSample = undefined;
-		this.cachedLines = undefined;
+		this.cached = undefined;
+	}
+
+	private matchCache(width: number, childLines: string[], bgSample: string | undefined): boolean {
+		const cache = this.cached;
+		return (
+			!!cache &&
+			cache.width === width &&
+			cache.bgSample === bgSample &&
+			cache.key.length === childLines.length &&
+			cache.key.every((key, index) => key === childLines[index])
+		);
 	}
 
 	invalidate(): void {
@@ -84,14 +96,8 @@ export class Box implements Component {
 		const bgSample = this.bgFn ? this.bgFn("test") : undefined;
 
 		// Check cache validity
-		const childLinesKey = childLines.join("\n");
-		if (
-			this.cachedLines &&
-			this.cachedWidth === width &&
-			this.cachedChildLines === childLinesKey &&
-			this.cachedBgSample === bgSample
-		) {
-			return this.cachedLines;
+		if (this.matchCache(width, childLines, bgSample)) {
+			return this.cached!.result;
 		}
 
 		// Apply background and padding
@@ -113,10 +119,7 @@ export class Box implements Component {
 		}
 
 		// Update cache
-		this.cachedWidth = width;
-		this.cachedChildLines = childLinesKey;
-		this.cachedBgSample = bgSample;
-		this.cachedLines = result;
+		this.cached = { key: childLines, width, bgSample, result };
 
 		return result;
 	}

package/src/components/markdown.ts

@@ -134,7 +134,7 @@ export class Markdown implements Component {
 		const wrappedLines: string[] = [];
 		for (const line of renderedLines) {
 			// Skip wrapping for image protocol lines (would corrupt escape sequences)
-			if (this.containsImage(line)) {
+			if (TERMINAL_INFO.isImageLine(line)) {
 				wrappedLines.push(line);
 			} else {
 				wrappedLines.push(...wrapTextWithAnsi(line, contentWidth));
@@ -149,7 +149,7 @@ export class Markdown implements Component {
 
 		for (const line of wrappedLines) {
 			// Image lines must be output raw - no margins or background
-			if (this.containsImage(line)) {
+			if (TERMINAL_INFO.isImageLine(line)) {
 				contentLines.push(line);
 				continue;
 			}
@@ -761,10 +761,6 @@ export class Markdown implements Component {
 		return lines;
 	}
 
-	private containsImage(line: string): boolean {
-		return line.includes("\x1b_G") || line.includes("\x1b]1337;File=");
-	}
-
 	/**
 	 * Render a mermaid image using terminal graphics protocol.
 	 * Returns array of lines (image placeholder rows) or null if rendering fails.

package/src/terminal-image.ts

@@ -14,7 +14,7 @@ export class TerminalInfo {
 	) {}
 
 	isImageLine(line: string): boolean {
-		return !!this.imageProtocol && line.trimStart().startsWith(this.imageProtocol);
+		return !!this.imageProtocol && line.startsWith(this.imageProtocol);
 	}
 }
 

package/src/tui.ts

@@ -541,10 +541,6 @@ export class TUI extends Container {
 		return result;
 	}
 
-	static containsImage(line: string): boolean {
-		return TERMINAL_INFO.isImageLine(line);
-	}
-
 	/**
 	 * Resolve overlay layout from options.
 	 * Returns { width, row, col, maxHeight } for rendering.
@@ -766,7 +762,7 @@ export class TUI extends Container {
 		const reset = TUI.SEGMENT_RESET;
 		for (let i = 0; i < lines.length; i++) {
 			const line = lines[i];
-			if (!TUI.containsImage(line)) {
+			if (!TERMINAL_INFO.isImageLine(line)) {
 				lines[i] = line + reset;
 			}
 		}
@@ -845,7 +841,7 @@ export class TUI extends Container {
 		overlayWidth: number,
 		totalWidth: number,
 	): string {
-		if (TUI.containsImage(baseLine)) return baseLine;
+		if (TERMINAL_INFO.isImageLine(baseLine)) return baseLine;
 
 		// Single pass through baseLine extracts both before and after segments
 		const afterStart = startCol + overlayWidth;
@@ -1087,7 +1083,7 @@ export class TUI extends Container {
 			if (i > firstChanged) buffer += "\r\n";
 			buffer += "\x1b[2K"; // Clear current line
 			const line = newLines[i];
-			const isImageLine = TUI.containsImage(line);
+			const isImageLine = TERMINAL_INFO.isImageLine(line);
 			if (!isImageLine && visibleWidth(line) > width) {
 				// Log all lines to crash file for debugging
 				const crashLogPath = path.join(os.homedir(), ".omp", "agent", "omp-crash.log");