@xynogen/pix-pretty 1.7.22 → 1.7.24

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@xynogen/pix-pretty",
-	"version": "1.7.22",
+	"version": "1.7.24",
 	"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/ansi.test.ts

@@ -2,24 +2,9 @@ import { describe, expect, test } from "bun:test";
 import * as ansi from "./ansi.ts";
 import { resolveBaseBackground } from "./ansi.ts";
 
-const bg = (r: number, g: number, b: number) => `\x1b[48;2;${r};${g};${b}m`;
-
-describe("themed tool surfaces", () => {
-	test("uses semantic success and error backgrounds from the active theme", () => {
-		resolveBaseBackground({
-			getBgAnsi: (key) => {
-				if (key === "toolSuccessBg") return bg(10, 20, 30);
-				if (key === "toolErrorBg") return bg(40, 50, 60);
-				return "";
-			},
-		});
-		expect(ansi.BG_BASE).toBe(bg(10, 20, 30));
-		expect(ansi.BG_ERROR).toBe(bg(40, 50, 60));
-		expect(ansi.RST).toContain(bg(10, 20, 30));
-	});
-
-	test("resets stale theme backgrounds when no raw theme accessor exists", () => {
-		resolveBaseBackground(undefined);
+describe("tool surfaces", () => {
+	test("always preserves terminal background", () => {
+		resolveBaseBackground({ getBgAnsi: () => "\x1b[48;2;10;20;30m" });
 		expect(ansi.BG_BASE).toBe("\x1b[49m");
 		expect(ansi.BG_ERROR).toBe("\x1b[49m");
 		expect(ansi.RST).toBe("\x1b[0m");

package/src/ansi.ts

@@ -1,5 +1,3 @@
-import type { BgTheme } from "./types.js";
-
 export let RST = "\x1b[0m";
 export const BOLD = "\x1b[1m";
 
@@ -13,47 +11,17 @@ export const FG_BLUE = "\x1b[38;2;100;140;220m";
 const FG_MUTED = "\x1b[38;2;139;148;158m";
 
 const BG_DEFAULT = "\x1b[49m";
-export let BG_BASE = BG_DEFAULT; // tool box success/base bg — updated from theme's toolSuccessBg
-export let BG_ERROR = BG_DEFAULT; // tool box error bg — updated from theme's toolErrorBg
-
-/** Parse an ANSI 24-bit color escape into { r, g, b }. Handles both fg (38;2) and bg (48;2). */
-function parseAnsiRgb(ansi: string): { r: number; g: number; b: number } | null {
-	const m = ansi.match(new RegExp(`${ESC_RE}\\[(?:38|48);2;(\\d+);(\\d+);(\\d+)m`));
-	return m ? { r: +(m[1] ?? 0), g: +(m[2] ?? 0), b: +(m[3] ?? 0) } : null;
-}
-
-function getThemeBgAnsi(theme: BgTheme, key: string): string | null {
-	try {
-		const bgAnsi = theme.getBgAnsi?.(key);
-		return bgAnsi && parseAnsiRgb(bgAnsi) ? bgAnsi : null;
-	} catch {
-		return null;
-	}
+export let BG_BASE = BG_DEFAULT;
+export let BG_ERROR = BG_DEFAULT;
+
+/** Tool and diff renderers always preserve the terminal background. */
+export function resolveBaseBackground(_theme: unknown): void {
+	BG_BASE = BG_DEFAULT;
+	BG_ERROR = BG_DEFAULT;
+	RST = "\x1b[0m";
 }
 
-/** Read themed tool backgrounds and update BG_BASE / BG_ERROR + RST.
- *  Recompute on each render so runtime theme changes are respected. */
-export function resolveBaseBackground(theme: BgTheme | null | undefined): void {
-	if (!theme?.getBgAnsi) {
-		BG_BASE = BG_DEFAULT;
-		BG_ERROR = BG_DEFAULT;
-		RST = "\x1b[0m";
-		return;
-	}
-
-	BG_BASE =
-		getThemeBgAnsi(theme, "toolSuccessBg") ??
-		getThemeBgAnsi(theme, "toolPendingBg") ??
-		getThemeBgAnsi(theme, "toolBg") ??
-		getThemeBgAnsi(theme, "background") ??
-		BG_DEFAULT;
-	BG_ERROR = getThemeBgAnsi(theme, "toolErrorBg") ?? BG_BASE;
-	RST = `\x1b[0m${BG_BASE}`;
-}
-
-const ESC_RE = "\u001b";
-
-export const ANSI_CAPTURE_RE = new RegExp(`${ESC_RE}\\[([0-9;]*)m`, "g");
+export const ANSI_CAPTURE_RE = /\x1b\[([0-9;]*)m/g;
 
 // ---------------------------------------------------------------------------
 // Low-contrast fix (same as pi-diff)

package/src/diff-render.ts

@@ -3,14 +3,12 @@
 // vendored pretty extension's primitives (cli-highlight `hlBlock`, shared
 // theme-aware `RST`/`BG_BASE` from ansi.ts).
 //
-// Engine note: pi-diff used Shiki's codeToANSI (fg-only output). pretty's
-// hlBlock (cli-highlight) likewise emits only fg codes, so the bg-injection
-// technique below works unchanged — diff backgrounds layer underneath and
-// persist through fg switches.
+// Engine note: pi-diff used Shiki's codeToANSI. pretty uses cli-highlight,
+// shared with other pix-pretty renderers, and paints foreground tokens only.
 
 import { pixConfig } from "@xynogen/pix-data/pix-config";
 import * as Diff from "diff";
-import { BG_BASE, BOLD, FG_DIM, FG_LNUM, FG_RULE, RST } from "./ansi.js";
+import { BG_BASE, BOLD, FG_DIM, FG_GREEN, FG_LNUM, FG_RED, FG_RULE, RST } from "./ansi.js";
 import { MAX_HL_CHARS, MAX_RENDER_LINES, WORD_DIFF_MIN_SIM } from "./config.js";
 import type { DiffLine, ParsedDiff } from "./diff.js";
 import { hlBlock } from "./highlight.js";
@@ -34,14 +32,9 @@ function envInt(name: string, fallback: number): number {
 const DIM = "\x1b[2m";
 const dc = pixConfig().pretty.diff;
 
-const FALLBACK_BG_ADD = "\x1b[48;2;22;38;32m";
-const FALLBACK_BG_DEL = "\x1b[48;2;45;25;25m";
-const FALLBACK_BG_ADD_W = "\x1b[48;2;35;75;50m";
-const FALLBACK_BG_DEL_W = "\x1b[48;2;80;35;35m";
-const FALLBACK_BG_GUTTER_ADD = "\x1b[48;2;18;32;26m";
-const FALLBACK_BG_GUTTER_DEL = "\x1b[48;2;38;22;22m";
-const FG_ADD = "\x1b[38;2;100;180;120m";
-const FG_DEL = "\x1b[38;2;200;100;100m";
+// Diff add/remove share the canonical green/red from ansi.ts (single source).
+const FG_ADD = FG_GREEN;
+const FG_DEL = FG_RED;
 const FG_STRIPE = "\x1b[38;2;40;40;40m"; // diagonal stripes on filler cells
 
 const BORDER_BAR = "▌";
@@ -90,68 +83,17 @@ export const DEFAULT_DIFF_COLORS: DiffColors = {
 	fgAdd: FG_ADD,
 	fgDel: FG_DEL,
 	fgCtx: FG_DIM,
-	bgAdd: FALLBACK_BG_ADD,
-	bgDel: FALLBACK_BG_DEL,
-	bgAddHighlight: FALLBACK_BG_ADD_W,
-	bgDelHighlight: FALLBACK_BG_DEL_W,
-	bgGutterAdd: FALLBACK_BG_GUTTER_ADD,
-	bgGutterDel: FALLBACK_BG_GUTTER_DEL,
+	bgAdd: BG_BASE,
+	bgDel: BG_BASE,
+	bgAddHighlight: BG_BASE,
+	bgDelHighlight: BG_BASE,
+	bgGutterAdd: BG_BASE,
+	bgGutterDel: BG_BASE,
 };
 
-// --- contrast helpers -------------------------------------------------------
-// The gutter (line number + sign) paints the diff fg over a dark gutter bg.
-// A theme whose diff fg is itself dark renders the number/sign as black-on-
-// black. We keep the theme's hue but lift its luminance until it clears a
-// minimum contrast ratio against the gutter background it sits on.
-
-type Rgb = [number, number, number];
-
-function parseAnsiRgb(seq: string, kind: "38" | "48"): Rgb | null {
-	const m = seq.match(new RegExp(`\\x1b\\[${kind};2;(\\d+);(\\d+);(\\d+)m`));
-	if (!m) return null;
-	return [Number(m[1]), Number(m[2]), Number(m[3])];
-}
-
-function relLuminance([r, g, b]: Rgb): number {
-	const f = (c: number) => {
-		const s = c / 255;
-		return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
-	};
-	return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);
-}
-
-function contrastRatio(a: Rgb, b: Rgb): number {
-	const la = relLuminance(a);
-	const lb = relLuminance(b);
-	const [hi, lo] = la > lb ? [la, lb] : [lb, la];
-	return (hi + 0.05) / (lo + 0.05);
-}
-
-/** Keep hue, raise lightness toward white until contrast >= min (or capped). */
-function ensureContrast(fg: string, bgSeq: string, min = 3): string {
-	const rgb = parseAnsiRgb(fg, "38");
-	const bg = parseAnsiRgb(bgSeq, "48");
-	if (!rgb || !bg) return fg; // can't reason about it — leave theme value
-	if (contrastRatio(rgb, bg) >= min) return fg; // already legible
-	let [r, g, b] = rgb;
-	for (let i = 0; i < 12 && contrastRatio([r, g, b], bg) < min; i++) {
-		r = Math.round(r + (255 - r) * 0.25);
-		g = Math.round(g + (255 - g) * 0.25);
-		b = Math.round(b + (255 - b) * 0.25);
-	}
-	return `\x1b[38;2;${r};${g};${b}m`;
-}
-
-/** Resolve diff fg colors from pi's theme (if it exposes getFgAnsi), falling
- *  back to hardcoded ANSI. BG_BASE is already kept in sync by ansi.ts's
- *  resolveBaseBackground (called from the tool renderers).
- *
- *  Theme hue is preserved, but each add/del fg is contrast-checked against the
- *  gutter bg it is painted on and lifted if it would render too dark to read. */
 type DiffTheme = {
 	fg?: FgTheme["fg"];
 	getFgAnsi?: (key: string) => string;
-	getBgAnsi?: (key: string) => string;
 };
 
 function themeFg(theme: DiffTheme, key: string, fallback: string): string {
@@ -162,32 +104,19 @@ function themeFg(theme: DiffTheme, key: string, fallback: string): string {
 	}
 }
 
-function tintedBackground(fg: string, strength: number, fallback: string): string {
-	const rgb = parseAnsiRgb(fg, "38");
-	if (!rgb) return fallback;
-	const [r, g, b] = rgb.map((channel) => Math.round(channel * strength)) as Rgb;
-	return `\x1b[48;2;${r};${g};${b}m`;
-}
-
 export function resolveDiffColors(theme?: DiffTheme): DiffColors {
 	if (!theme) return DEFAULT_DIFF_COLORS;
-	const rawFgAdd = themeFg(theme, "toolDiffAdded", FG_ADD);
-	const rawFgDel = themeFg(theme, "toolDiffRemoved", FG_DEL);
-	const bgAdd = tintedBackground(rawFgAdd, 0.2, FALLBACK_BG_ADD);
-	const bgDel = tintedBackground(rawFgDel, 0.2, FALLBACK_BG_DEL);
-	const bgGutterAdd = tintedBackground(rawFgAdd, 0.15, FALLBACK_BG_GUTTER_ADD);
-	const bgGutterDel = tintedBackground(rawFgDel, 0.15, FALLBACK_BG_GUTTER_DEL);
 	return {
-		fgAdd: ensureContrast(rawFgAdd, bgGutterAdd),
-		fgDel: ensureContrast(rawFgDel, bgGutterDel),
+		fgAdd: themeFg(theme, "toolDiffAdded", FG_ADD),
+		fgDel: themeFg(theme, "toolDiffRemoved", FG_DEL),
 		fgCtx: themeFg(theme, "toolDiffContext", FG_DIM),
 		theme: typeof theme.fg === "function" ? (theme as FgTheme) : undefined,
-		bgAdd,
-		bgDel,
-		bgAddHighlight: tintedBackground(rawFgAdd, 0.35, FALLBACK_BG_ADD_W),
-		bgDelHighlight: tintedBackground(rawFgDel, 0.35, FALLBACK_BG_DEL_W),
-		bgGutterAdd,
-		bgGutterDel,
+		bgAdd: BG_BASE,
+		bgDel: BG_BASE,
+		bgAddHighlight: BG_BASE,
+		bgDelHighlight: BG_BASE,
+		bgGutterAdd: BG_BASE,
+		bgGutterDel: BG_BASE,
 	};
 }
 

package/src/diff.test.ts

@@ -1,9 +1,15 @@
 import { describe, expect, it } from "bun:test";
 import { parseDiff } from "./diff.js";
-import { diffThemeCacheKey, renderDiffSummary, resolveDiffColors } from "./diff-render.js";
+import {
+	diffThemeCacheKey,
+	renderDiffSummary,
+	renderUnified,
+	resolveDiffColors,
+} from "./diff-render.js";
 
 const OLD = "line1\nline2\nline3";
 const NEW = "line1\nCHANGED\nline3";
+const ANSI_RE = /\x1b\[[0-9;]*m|<\/?syntax\w+>/g;
 
 describe("theme-derived diff rendering", () => {
 	const theme = {
@@ -16,13 +22,21 @@ describe("theme-derived diff rendering", () => {
 		},
 	};
 
-	it("derives foregrounds and tint backgrounds from semantic theme tokens", () => {
+	it("uses semantic foregrounds without tint backgrounds", () => {
 		const colors = resolveDiffColors(theme);
 		expect(colors.fgAdd).toBe("\x1b[38;2;120;210;150m");
 		expect(colors.fgDel).toBe("\x1b[38;2;230;120;130m");
 		expect(colors.fgCtx).toBe("\x1b[38;2;130;140;150m");
-		expect(colors.bgAdd).toBe("\x1b[48;2;24;42;30m");
-		expect(colors.bgDel).toBe("\x1b[48;2;46;24;26m");
+		for (const key of [
+			"bgAdd",
+			"bgDel",
+			"bgAddHighlight",
+			"bgDelHighlight",
+			"bgGutterAdd",
+			"bgGutterDel",
+		] as const) {
+			expect(colors[key]).toBe("\x1b[49m");
+		}
 	});
 
 	it("includes semantic theme colors in cache identity", () => {
@@ -38,6 +52,25 @@ describe("theme-derived diff rendering", () => {
 			"<toolDiffContext>no changes</toolDiffContext>",
 		);
 	});
+
+	it("keeps the foreground-only diff style", async () => {
+		const rendered = await renderUnified(
+			parseDiff("const oldValue = 1;", "const newValue = 2;"),
+			"typescript",
+			80,
+			resolveDiffColors({ ...theme, fg: (_key, text) => text }),
+		);
+		const lines = rendered.replace(ANSI_RE, "").split("\n");
+
+		expect(lines).toHaveLength(4);
+		expect(lines[0]).toMatch(/^─+$/);
+		expect(lines[1]).toMatch(/^▌\s+1- │ const oldValue = 1;\s*$/);
+		expect(lines[2]).toMatch(/^▌\s+1\+ │ const newValue = 2;\s*$/);
+		expect(lines[3]).toMatch(/^─+$/);
+		expect(rendered).toContain(theme.getFgAnsi("toolDiffRemoved"));
+		expect(rendered).toContain(theme.getFgAnsi("toolDiffAdded"));
+		expect(rendered).not.toMatch(/\x1b\[48(?:;[^m]*)?m/);
+	});
 });
 
 describe("parseDiff baseLine", () => {

package/src/types.ts

@@ -28,8 +28,7 @@ export type BgTheme = { getBgAnsi?: (key: string) => string };
 
 export type FgTheme = {
 	fg: (key: string, text: string) => string;
-	// Optional raw-ANSI accessors exposed by Pi's theme. Diff foregrounds and
-	// generated tint backgrounds derive from these semantic theme colors.
+	// Optional raw-ANSI accessor exposed by Pi's theme for semantic foregrounds.
 	getFgAnsi?: (key: string) => string;
 };