@xynogen/pix-pretty 1.11.2 → 1.12.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@xynogen/pix-pretty",
-	"version": "1.11.2",
+	"version": "1.12.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/icon-catalog.ts

@@ -65,6 +65,8 @@ const CATALOG = {
 	// part of this set.
 	"status.ok": { nerd: "\u2713", unicode: `\u2713${VS}`, ascii: "ok" },
 	"status.error": { nerd: "\u2717", unicode: `\u2717${VS}`, ascii: "x" },
+	// `⚠` is East-Asian wide (2 cells); consumers that place it in an aligned
+	// marker column must normalize width via `padIcon` (pix-pretty/utils).
 	"status.warn": { nerd: "\u26A0", unicode: `\u26A0${VS}`, ascii: "!" },
 	"status.pending": { nerd: "\u25CB", unicode: `\u25CB${VS}`, ascii: "o" },
 	"status.running": { nerd: "\u25D0", unicode: `\u25D0${VS}`, ascii: "*" },

package/src/utils.test.ts

@@ -6,6 +6,7 @@ import {
 	formatCollapsedToolRow,
 	formatJson,
 	hideCollapsedToolCall,
+	padIcon,
 	pluralize,
 	renderCollapsedToolRow,
 	renderDimPreview,
@@ -108,11 +109,25 @@ describe("collapsed tool rows", () => {
 	const rowTheme = { fg: (_key: string, text: string) => text, bold: (text: string) => text };
 
 	it("renders a consistent status, tool, target, and metadata row", () => {
+		// The status marker is width-normalized to 2 cells (padIcon) so wide glyphs
+		// align with narrow ones; a 1-cell `✓` therefore carries one pad space.
 		expect(formatCollapsedToolRow(rowTheme, "read", "src/a.ts", "12 lines")).toBe(
-			"✓ read src/a.ts · 12 lines",
+			"✓  read src/a.ts · 12 lines",
 		);
 		const rendered = plain(renderCollapsedToolRow(rowTheme, "read", "src/a.ts", "12 lines"));
-		expect(rendered).toStartWith("✓ read src/a.ts · 12 lines");
+		expect(rendered).toStartWith("✓  read src/a.ts · 12 lines");
+	});
+
+	it("padIcon normalizes markers to a fixed cell width (per pi-tui visibleWidth)", () => {
+		// pi-tui's width table drives the actual TUI column math, so padIcon trusts
+		// it: `✓`/`✗`/`⚠` measure 1 cell and gain a pad space; `⚡` measures 2 and
+		// is left as-is. All markers then occupy the same 2-cell column.
+		expect(padIcon("✓")).toBe("✓ ");
+		expect(padIcon("✗")).toBe("✗ ");
+		expect(padIcon("⚠")).toBe("⚠ ");
+		expect(padIcon("⚡")).toBe("⚡"); // already 2 cells — unchanged
+		expect(padIcon("x", 4)).toBe("x   "); // explicit width
+		expect(padIcon("⚡", 1)).toBe("⚡"); // never truncated below its own width
 	});
 
 	it("hides only collapsed, non-expanded call rows", () => {

package/src/utils.ts

@@ -125,6 +125,37 @@ export function formatJson(value: unknown, options: FormatJsonOptions = {}): str
 
 export type CollapsedToolStatus = "success" | "error" | "warning";
 
+/**
+ * Status glyphs for collapsed tool rows. `⚠` (warning) is East-Asian *wide*
+ * (2 cells) while `✓`/`✗` are 1 cell — render them through `padIcon` so every
+ * marker occupies the same fixed column and rows stay vertically aligned.
+ * (`⚡` is reserved for strength / model-score badges, not warnings.)
+ */
+export const COLLAPSED_TOOL_GLYPH: Record<CollapsedToolStatus, string> = {
+	success: "✓",
+	warning: "⚠",
+	error: "✗",
+};
+
+/**
+ * Normalize a marker glyph to a fixed display width so mixed 1-cell and 2-cell
+ * (East-Asian wide / emoji) icons align in a column and the following text
+ * always starts at the same offset. Measures actual terminal cells via pi-tui's
+ * `visibleWidth` (ANSI-aware), then right-pads with spaces. A glyph already
+ * at/over `width` is returned unchanged (never truncated — clipping a marker is
+ * worse than a 1-cell overflow).
+ *
+ * The default width (2) makes every marker occupy exactly two cells, so with a
+ * single separator space the following text always starts at the same column:
+ *
+ *   `${padIcon("✓")} bash`   // "✓  bash"  (1 cell + 1 pad + separator)
+ *   `${padIcon("⚠")} bash`   // "⚠ bash"  (2 cells + separator — same column)
+ */
+export function padIcon(glyph: string, width = 2): string {
+	const pad = width - visibleWidth(glyph);
+	return pad > 0 ? glyph + " ".repeat(pad) : glyph;
+}
+
 type CollapsedToolTheme = {
 	fg: (
 		key: "success" | "error" | "warning" | "toolTitle" | "muted" | "dim",
@@ -141,7 +172,7 @@ export function formatCollapsedToolRow(
 	meta = "",
 	status: CollapsedToolStatus = "success",
 ): string {
-	const icon = status === "success" ? "✓" : status === "warning" ? "⚡" : "✗";
+	const icon = padIcon(COLLAPSED_TOOL_GLYPH[status]);
 	const parts = [
 		`${theme.fg(status, icon)} ${theme.fg("toolTitle", theme.bold(tool))}`,
 		target ? theme.fg("muted", target) : "",