@xynogen/pix-pretty 1.0.0

package/src/diff-render.ts

@@ -0,0 +1,892 @@
+// Split / unified / word-level diff rendering — ported from
+// @heyhuynhgiabuu/pi-diff (src/index.ts render core) and adapted to the
+// 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.
+
+import * as Diff from "diff";
+import { BG_BASE, BOLD, FG_DIM, FG_LNUM, 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";
+import type { BundledLanguage } from "./types.js";
+
+// ---------------------------------------------------------------------------
+// Env-overridable color/threshold helpers (mirror pi-diff)
+// ---------------------------------------------------------------------------
+
+function envInt(name: string, fallback: number): number {
+	const v = Number.parseInt(process.env[name] ?? "", 10);
+	return Number.isFinite(v) ? v : fallback;
+}
+
+function envFg(name: string, fallback: string): string {
+	const hex = process.env[name];
+	if (!hex || !/^#[0-9a-fA-F]{6}$/.test(hex)) return fallback;
+	const r = Number.parseInt(hex.slice(1, 3), 16);
+	const g = Number.parseInt(hex.slice(3, 5), 16);
+	const b = Number.parseInt(hex.slice(5, 7), 16);
+	return `\x1b[38;2;${r};${g};${b}m`;
+}
+
+function envBg(name: string, fallback: string): string {
+	const hex = process.env[name];
+	if (!hex || !/^#[0-9a-fA-F]{6}$/.test(hex)) return fallback;
+	const r = Number.parseInt(hex.slice(1, 3), 16);
+	const g = Number.parseInt(hex.slice(3, 5), 16);
+	const b = Number.parseInt(hex.slice(5, 7), 16);
+	return `\x1b[48;2;${r};${g};${b}m`;
+}
+
+// ---------------------------------------------------------------------------
+// Diff-specific ANSI (override via env, hex "#RRGGBB")
+// ---------------------------------------------------------------------------
+
+const DIM = "\x1b[2m";
+
+// Subtle diff backgrounds — muted tones to let syntax fg shine through.
+const BG_ADD = envBg("DIFF_BG_ADD", "\x1b[48;2;22;38;32m"); // muted teal-green
+const BG_DEL = envBg("DIFF_BG_DEL", "\x1b[48;2;45;25;25m"); // muted brown-red
+const BG_ADD_W = envBg("DIFF_BG_ADD_HL", "\x1b[48;2;35;75;50m"); // word emphasis
+const BG_DEL_W = envBg("DIFF_BG_DEL_HL", "\x1b[48;2;80;35;35m");
+const BG_GUTTER_ADD = envBg("DIFF_BG_GUTTER_ADD", "\x1b[48;2;18;32;26m");
+const BG_GUTTER_DEL = envBg("DIFF_BG_GUTTER_DEL", "\x1b[48;2;38;22;22m");
+const BG_EMPTY = "\x1b[48;2;18;18;18m"; // filler rows when one side is shorter
+
+const FG_ADD = envFg("DIFF_FG_ADD", "\x1b[38;2;100;180;120m"); // desaturated green
+const FG_DEL = envFg("DIFF_FG_DEL", "\x1b[38;2;200;100;100m"); // desaturated red
+const FG_STRIPE = "\x1b[38;2;40;40;40m"; // diagonal stripes on filler cells
+
+const BORDER_BAR = "▌";
+const DIVIDER = `${FG_RULE}│${RST}`;
+
+const ESC_RE = "\u001b";
+const ANSI_RE = new RegExp(`${ESC_RE}\\[[0-9;]*m`, "g");
+const ANSI_CAPTURE_RE = new RegExp(`${ESC_RE}\\[([^m]*)m`, "g");
+
+// ---------------------------------------------------------------------------
+// Terminal bounds + thresholds
+// ---------------------------------------------------------------------------
+
+const MAX_TERM_WIDTH = 210;
+const DEFAULT_TERM_WIDTH = 200;
+
+const MAX_PREVIEW_LINES = envInt("PRETTY_MAX_PREVIEW_LINES", 80);
+
+const SPLIT_MIN_WIDTH = envInt("DIFF_SPLIT_MIN_WIDTH", 150);
+const SPLIT_MIN_CODE_WIDTH = envInt("DIFF_SPLIT_MIN_CODE_WIDTH", 60);
+const SPLIT_MAX_WRAP_RATIO = 0.2;
+const SPLIT_MAX_WRAP_LINES = 8;
+
+const MAX_WRAP_ROWS_WIDE = 3; // >=180 cols
+const MAX_WRAP_ROWS_MED = 2; // 120-179 cols
+const MAX_WRAP_ROWS_NARROW = 1; // <120 cols (truncate)
+
+// ---------------------------------------------------------------------------
+// Theme-aware diff colors
+// ---------------------------------------------------------------------------
+
+export interface DiffColors {
+	fgAdd: string;
+	fgDel: string;
+	fgCtx: string;
+}
+
+export const DEFAULT_DIFF_COLORS: DiffColors = {
+	fgAdd: FG_ADD,
+	fgDel: FG_DEL,
+	fgCtx: FG_DIM,
+};
+
+// --- 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. */
+export function resolveDiffColors(theme?: {
+	getFgAnsi?: (key: string) => string;
+}): DiffColors {
+	if (!theme?.getFgAnsi) return DEFAULT_DIFF_COLORS;
+	try {
+		return {
+			fgAdd: ensureContrast(
+				theme.getFgAnsi("toolDiffAdded") || FG_ADD,
+				BG_GUTTER_ADD,
+			),
+			fgDel: ensureContrast(
+				theme.getFgAnsi("toolDiffRemoved") || FG_DEL,
+				BG_GUTTER_DEL,
+			),
+			fgCtx: theme.getFgAnsi("toolDiffContext") || FG_DIM,
+		};
+	} catch {
+		return DEFAULT_DIFF_COLORS;
+	}
+}
+
+/** Stable cache key for the resolved diff theme colors. */
+export function diffThemeCacheKey(theme?: {
+	getFgAnsi?: (key: string) => string;
+}): string {
+	const c = resolveDiffColors(theme);
+	return `${c.fgAdd}|${c.fgDel}|${c.fgCtx}|${BG_BASE}`;
+}
+
+// ---------------------------------------------------------------------------
+// Adaptive helpers + utilities
+// ---------------------------------------------------------------------------
+
+function adaptiveWrapRows(tw?: number): number {
+	const w = tw ?? termW();
+	if (w >= 180) return MAX_WRAP_ROWS_WIDE;
+	if (w >= 120) return MAX_WRAP_ROWS_MED;
+	return MAX_WRAP_ROWS_NARROW;
+}
+
+function strip(s: string): string {
+	return s.replace(ANSI_RE, "");
+}
+
+function tabs(s: string): string {
+	return s.replace(/\t/g, "  ");
+}
+
+function termW(): number {
+	const raw =
+		process.stdout.columns ||
+		(process.stderr as { columns?: number }).columns ||
+		Number.parseInt(process.env.COLUMNS ?? "", 10) ||
+		DEFAULT_TERM_WIDTH;
+	return Math.max(80, Math.min(raw - 4, MAX_TERM_WIDTH));
+}
+
+/** Pad/truncate `s` to exactly `w` visible chars. ANSI-aware. */
+function fit(s: string, w: number): string {
+	if (w <= 0) return "";
+	const plain = strip(s);
+	if (plain.length <= w) return s + " ".repeat(w - plain.length);
+	const showW = w > 2 ? w - 1 : w;
+	let vis = 0;
+	let i = 0;
+	while (i < s.length && vis < showW) {
+		if (s[i] === "\x1b") {
+			const e = s.indexOf("m", i);
+			if (e !== -1) {
+				i = e + 1;
+				continue;
+			}
+		}
+		vis++;
+		i++;
+	}
+	return w > 2
+		? `${s.slice(0, i)}${RST}${FG_DIM}›${RST}`
+		: `${s.slice(0, i)}${RST}`;
+}
+
+/** Extract last active fg + bg ANSI codes from a string (for wrap continuations). */
+function ansiState(s: string): string {
+	let fg = "";
+	let bg = "";
+	for (const match of s.matchAll(ANSI_CAPTURE_RE)) {
+		const p = match[1] ?? "";
+		const seq = match[0] ?? "";
+		if (p === "0") {
+			fg = "";
+			bg = "";
+		} else if (p === "39") {
+			fg = "";
+		} else if (p.startsWith("38;")) {
+			fg = seq;
+		} else if (p.startsWith("48;")) {
+			bg = seq;
+		}
+	}
+	return bg + fg;
+}
+
+/** Wrap ANSI-encoded string into rows of `w` visible chars. */
+function wrapAnsi(
+	s: string,
+	w: number,
+	maxRows = adaptiveWrapRows(),
+	fillBg = "",
+): string[] {
+	if (w <= 0) return [""];
+	const plain = strip(s);
+	if (plain.length <= w) {
+		const pad = w - plain.length;
+		return pad > 0 ? [s + fillBg + " ".repeat(pad) + (fillBg ? RST : "")] : [s];
+	}
+
+	const rows: string[] = [];
+	let row = "";
+	let vis = 0;
+	let i = 0;
+	let onLastRow = false;
+	let effW = w;
+
+	while (i < s.length) {
+		if (!onLastRow && rows.length >= maxRows - 1) {
+			onLastRow = true;
+			effW = w > 2 ? w - 1 : w;
+		}
+
+		if (s[i] === "\x1b") {
+			const end = s.indexOf("m", i);
+			if (end !== -1) {
+				row += s.slice(i, end + 1);
+				i = end + 1;
+				continue;
+			}
+		}
+
+		if (vis >= effW) {
+			if (onLastRow) {
+				let hasMore = false;
+				for (let j = i; j < s.length; j++) {
+					if (s[j] === "\x1b") {
+						const e2 = s.indexOf("m", j);
+						if (e2 !== -1) {
+							j = e2;
+							continue;
+						}
+					}
+					hasMore = true;
+					break;
+				}
+				if (hasMore && w > 2) row += `${RST}${FG_DIM}›${RST}`;
+				else row += fillBg + " ".repeat(Math.max(0, w - vis)) + RST;
+				rows.push(row);
+				return rows;
+			}
+			const state = ansiState(row);
+			rows.push(row + RST);
+			row = state + fillBg;
+			vis = 0;
+			if (rows.length >= maxRows - 1) {
+				onLastRow = true;
+				effW = w > 2 ? w - 1 : w;
+			}
+		}
+
+		row += s[i];
+		vis++;
+		i++;
+	}
+
+	if (row.length > 0 || rows.length === 0) {
+		rows.push(row + fillBg + " ".repeat(Math.max(0, w - vis)) + RST);
+	}
+	return rows;
+}
+
+/** Dense diagonal stripe fill for empty filler cells. */
+function stripes(w: number, _rowOffset: number): string {
+	return BG_BASE + FG_STRIPE + "╱".repeat(w) + RST;
+}
+
+function lnum(n: number | null, w: number, fg = FG_LNUM): string {
+	if (n === null) return " ".repeat(w);
+	const v = String(n);
+	return `${fg}${" ".repeat(Math.max(0, w - v.length))}${v}${RST}`;
+}
+
+function rule(w: number): string {
+	return `${BG_BASE}${FG_RULE}${"─".repeat(w)}${RST}`;
+}
+
+/** Compact "+a -d" summary string (or "no changes"). */
+export function summarize(a: number, d: number): string {
+	const p: string[] = [];
+	if (a > 0) p.push(`${FG_ADD}+${a}${RST}`);
+	if (d > 0) p.push(`${FG_DEL}-${d}${RST}`);
+	return p.length ? p.join(" ") : `${FG_DIM}no changes${RST}`;
+}
+
+// ---------------------------------------------------------------------------
+// Word diff + bg injection
+// ---------------------------------------------------------------------------
+
+function wordDiffAnalysis(
+	a: string,
+	b: string,
+): {
+	similarity: number;
+	oldRanges: Array<[number, number]>;
+	newRanges: Array<[number, number]>;
+} {
+	if (!a && !b) return { similarity: 1, oldRanges: [], newRanges: [] };
+	const parts = Diff.diffWords(a, b);
+	const oldRanges: Array<[number, number]> = [];
+	const newRanges: Array<[number, number]> = [];
+	let oPos = 0;
+	let nPos = 0;
+	let same = 0;
+	for (const p of parts) {
+		if (p.removed) {
+			oldRanges.push([oPos, oPos + p.value.length]);
+			oPos += p.value.length;
+		} else if (p.added) {
+			newRanges.push([nPos, nPos + p.value.length]);
+			nPos += p.value.length;
+		} else {
+			const len = p.value.length;
+			same += len;
+			oPos += len;
+			nPos += len;
+		}
+	}
+	const maxLen = Math.max(a.length, b.length);
+	return {
+		similarity: maxLen > 0 ? same / maxLen : 1,
+		oldRanges,
+		newRanges,
+	};
+}
+
+/** Inject diff background into fg-only highlighted output.
+ *  `baseBg` on unchanged spans, `hlBg` on changed char ranges.
+ *  Re-injects bg after any reset-like sequence. */
+function injectBg(
+	ansiLine: string,
+	ranges: Array<[number, number]>,
+	baseBg: string,
+	hlBg: string,
+): string {
+	if (!ranges.length) return baseBg + ansiLine + RST;
+
+	let out = baseBg;
+	let vis = 0;
+	let inHL = false;
+	let ri = 0;
+	let i = 0;
+
+	while (i < ansiLine.length) {
+		if (ansiLine[i] === "\x1b") {
+			const m = ansiLine.indexOf("m", i);
+			if (m !== -1) {
+				const seq = ansiLine.slice(i, m + 1);
+				out += seq;
+				if (seq === "\x1b[0m" || seq === "\x1b[39m" || seq === "\x1b[49m") {
+					out += inHL ? hlBg : baseBg;
+				}
+				i = m + 1;
+				continue;
+			}
+		}
+		while (ri < ranges.length && vis >= ranges[ri][1]) ri++;
+		const want =
+			ri < ranges.length && vis >= ranges[ri][0] && vis < ranges[ri][1];
+		if (want !== inHL) {
+			inHL = want;
+			out += inHL ? hlBg : baseBg;
+		}
+		out += ansiLine[i];
+		vis++;
+		i++;
+	}
+	return out + RST;
+}
+
+/** Simple word diff (no syntax hl) — fallback when highlighting is unavailable. */
+function plainWordDiff(
+	oldText: string,
+	newText: string,
+): { old: string; new: string } {
+	const parts = Diff.diffWords(oldText, newText);
+	let o = "";
+	let n = "";
+	for (const p of parts) {
+		if (p.removed) o += `${BG_DEL_W}${p.value}${RST}${BG_DEL}`;
+		else if (p.added) n += `${BG_ADD_W}${p.value}${RST}${BG_ADD}`;
+		else {
+			o += p.value;
+			n += p.value;
+		}
+	}
+	return { old: o, new: n };
+}
+
+// ---------------------------------------------------------------------------
+// Split-vs-unified decision
+// ---------------------------------------------------------------------------
+
+function shouldUseSplit(
+	diff: ParsedDiff,
+	tw: number,
+	maxRows = MAX_PREVIEW_LINES,
+): boolean {
+	if (!diff.lines.length) return false;
+	if (tw < SPLIT_MIN_WIDTH) return false;
+
+	const nw = Math.max(
+		2,
+		String(Math.max(...diff.lines.map((l) => l.oldNum ?? l.newNum ?? 0), 0))
+			.length,
+	);
+	const half = Math.floor((tw - 1) / 2);
+	const gw = nw + 5;
+	const cw = Math.max(12, half - gw);
+	if (cw < SPLIT_MIN_CODE_WIDTH) return false;
+
+	const vis = diff.lines.slice(0, maxRows);
+	let contentLines = 0;
+	let wrapCandidates = 0;
+	for (const l of vis) {
+		if (l.type === "sep") continue;
+		contentLines++;
+		if (tabs(l.content).length > cw) wrapCandidates++;
+	}
+	if (contentLines === 0) return true;
+
+	const wrapRatio = wrapCandidates / contentLines;
+	if (wrapCandidates >= SPLIT_MAX_WRAP_LINES) return false;
+	if (wrapRatio >= SPLIT_MAX_WRAP_RATIO) return false;
+	return true;
+}
+
+// ---------------------------------------------------------------------------
+// Unified (stacked) view
+// ---------------------------------------------------------------------------
+
+export async function renderUnified(
+	diff: ParsedDiff,
+	language: BundledLanguage | undefined,
+	max = MAX_RENDER_LINES,
+	dc: DiffColors = DEFAULT_DIFF_COLORS,
+): Promise<string> {
+	if (!diff.lines.length) return "";
+
+	const vis = diff.lines.slice(0, max);
+	const tw = termW();
+	const nw = Math.max(
+		2,
+		String(Math.max(...vis.map((l) => l.oldNum ?? l.newNum ?? 0), 0)).length,
+	);
+	const gw = nw + 5;
+	const cw = Math.max(20, tw - gw);
+	const canHL = diff.chars <= MAX_HL_CHARS && vis.length <= MAX_RENDER_LINES;
+
+	const oldSrc: string[] = [];
+	const newSrc: string[] = [];
+	for (const l of vis) {
+		if (l.type === "ctx" || l.type === "del") oldSrc.push(l.content);
+		if (l.type === "ctx" || l.type === "add") newSrc.push(l.content);
+	}
+	const [oldHL, newHL] = canHL
+		? await Promise.all([
+				hlBlock(oldSrc.join("\n"), language),
+				hlBlock(newSrc.join("\n"), language),
+			])
+		: [oldSrc, newSrc];
+
+	let oI = 0;
+	let nI = 0;
+	let idx = 0;
+	const out: string[] = [];
+	out.push(rule(tw));
+
+	function emitRow(
+		num: number | null,
+		sign: string,
+		gutterBg: string,
+		signFg: string,
+		body: string,
+		bodyBg = "",
+	): void {
+		const borderFg = sign === "-" ? dc.fgDel : sign === "+" ? dc.fgAdd : "";
+		const border = borderFg ? `${borderFg}${BORDER_BAR}${RST}` : `${BG_BASE} `;
+		const numFg = borderFg || FG_LNUM;
+		const gutter = `${border}${gutterBg}${lnum(num, nw, numFg)}${signFg}${sign}${RST} ${DIVIDER} `;
+		const contGutter = `${border}${gutterBg}${" ".repeat(nw + 1)}${RST} ${DIVIDER} `;
+		const rows = wrapAnsi(tabs(body), cw, adaptiveWrapRows(), bodyBg);
+		out.push(`${gutter}${rows[0]}${RST}`);
+		for (let r = 1; r < rows.length; r++)
+			out.push(`${contGutter}${rows[r]}${RST}`);
+	}
+
+	while (idx < vis.length) {
+		const l = vis[idx];
+
+		if (l.type === "sep") {
+			const gap = l.newNum;
+			const label = gap && gap > 0 ? ` ${gap} unmodified lines ` : "···";
+			const totalW = Math.min(tw, 72);
+			const pad = Math.max(0, totalW - label.length - 2);
+			const half1 = Math.floor(pad / 2);
+			const half2 = pad - half1;
+			out.push(
+				`${BG_BASE}${FG_DIM}${"─".repeat(half1)}${label}${"─".repeat(half2)}${RST}`,
+			);
+			idx++;
+			continue;
+		}
+
+		if (l.type === "ctx") {
+			const hl = oldHL[oI] ?? l.content;
+			emitRow(
+				l.newNum,
+				" ",
+				BG_BASE,
+				dc.fgCtx,
+				`${BG_BASE}${DIM}${hl}`,
+				BG_BASE,
+			);
+			oI++;
+			nI++;
+			idx++;
+			continue;
+		}
+
+		const dels: Array<{ l: DiffLine; hl: string }> = [];
+		while (idx < vis.length && vis[idx].type === "del") {
+			dels.push({ l: vis[idx], hl: oldHL[oI] ?? vis[idx].content });
+			oI++;
+			idx++;
+		}
+		const adds: Array<{ l: DiffLine; hl: string }> = [];
+		while (idx < vis.length && vis[idx].type === "add") {
+			adds.push({ l: vis[idx], hl: newHL[nI] ?? vis[idx].content });
+			nI++;
+			idx++;
+		}
+
+		const isPaired = dels.length === 1 && adds.length === 1;
+		const wd = isPaired
+			? wordDiffAnalysis(dels[0].l.content, adds[0].l.content)
+			: null;
+		const wdBalanced = wd && wd.oldRanges.length > 0 && wd.newRanges.length > 0;
+
+		if (isPaired && wdBalanced && wd.similarity >= WORD_DIFF_MIN_SIM && canHL) {
+			const delBody = injectBg(dels[0].hl, wd.oldRanges, BG_DEL, BG_DEL_W);
+			const addBody = injectBg(adds[0].hl, wd.newRanges, BG_ADD, BG_ADD_W);
+			emitRow(
+				dels[0].l.oldNum,
+				"-",
+				BG_GUTTER_DEL,
+				`${dc.fgDel}${BOLD}`,
+				delBody,
+				BG_DEL,
+			);
+			emitRow(
+				adds[0].l.newNum,
+				"+",
+				BG_GUTTER_ADD,
+				`${dc.fgAdd}${BOLD}`,
+				addBody,
+				BG_ADD,
+			);
+			continue;
+		}
+		if (
+			isPaired &&
+			wdBalanced &&
+			wd.similarity >= WORD_DIFF_MIN_SIM &&
+			!canHL
+		) {
+			const pwd = plainWordDiff(dels[0].l.content, adds[0].l.content);
+			emitRow(
+				dels[0].l.oldNum,
+				"-",
+				BG_GUTTER_DEL,
+				`${dc.fgDel}${BOLD}`,
+				`${BG_DEL}${pwd.old}`,
+				BG_DEL,
+			);
+			emitRow(
+				adds[0].l.newNum,
+				"+",
+				BG_GUTTER_ADD,
+				`${dc.fgAdd}${BOLD}`,
+				`${BG_ADD}${pwd.new}`,
+				BG_ADD,
+			);
+			continue;
+		}
+
+		for (const d of dels) {
+			const body = canHL ? `${BG_DEL}${d.hl}` : `${BG_DEL}${d.l.content}`;
+			emitRow(
+				d.l.oldNum,
+				"-",
+				BG_GUTTER_DEL,
+				`${dc.fgDel}${BOLD}`,
+				body,
+				BG_DEL,
+			);
+		}
+		for (const a of adds) {
+			const body = canHL ? `${BG_ADD}${a.hl}` : `${BG_ADD}${a.l.content}`;
+			emitRow(
+				a.l.newNum,
+				"+",
+				BG_GUTTER_ADD,
+				`${dc.fgAdd}${BOLD}`,
+				body,
+				BG_ADD,
+			);
+		}
+	}
+
+	out.push(rule(tw));
+	if (diff.lines.length > vis.length) {
+		out.push(
+			`${BG_BASE}${FG_DIM}  … ${diff.lines.length - vis.length} more lines${RST}`,
+		);
+	}
+	return out.join("\n");
+}
+
+// ---------------------------------------------------------------------------
+// Split view (auto-fallback to unified when narrow)
+// ---------------------------------------------------------------------------
+
+export async function renderSplit(
+	diff: ParsedDiff,
+	language: BundledLanguage | undefined,
+	max = MAX_PREVIEW_LINES,
+	dc: DiffColors = DEFAULT_DIFF_COLORS,
+): Promise<string> {
+	const tw = termW();
+	if (!shouldUseSplit(diff, tw, max))
+		return renderUnified(diff, language, max, dc);
+	if (!diff.lines.length) return "";
+
+	type Row = { left: DiffLine | null; right: DiffLine | null };
+	const rows: Row[] = [];
+	let i = 0;
+	while (i < diff.lines.length) {
+		const l = diff.lines[i];
+		if (l.type === "sep" || l.type === "ctx") {
+			rows.push({ left: l, right: l });
+			i++;
+			continue;
+		}
+		const dels: DiffLine[] = [];
+		const adds: DiffLine[] = [];
+		while (i < diff.lines.length && diff.lines[i].type === "del") {
+			dels.push(diff.lines[i]);
+			i++;
+		}
+		while (i < diff.lines.length && diff.lines[i].type === "add") {
+			adds.push(diff.lines[i]);
+			i++;
+		}
+		const n = Math.max(dels.length, adds.length);
+		for (let j = 0; j < n; j++)
+			rows.push({ left: dels[j] ?? null, right: adds[j] ?? null });
+	}
+
+	const vis = rows.slice(0, max);
+	const half = Math.floor((tw - 1) / 2);
+	const nw = Math.max(
+		2,
+		String(Math.max(...diff.lines.map((l) => l.oldNum ?? l.newNum ?? 0), 0))
+			.length,
+	);
+	const gw = nw + 5;
+	const cw = Math.max(12, half - gw);
+	const canHL =
+		diff.chars <= MAX_HL_CHARS && vis.length * 2 <= MAX_RENDER_LINES * 2;
+
+	const leftSrc: string[] = [];
+	const rightSrc: string[] = [];
+	for (const r of vis) {
+		if (r.left && r.left.type !== "sep") leftSrc.push(r.left.content);
+		if (r.right && r.right.type !== "sep") rightSrc.push(r.right.content);
+	}
+	const [leftHL, rightHL] = canHL
+		? await Promise.all([
+				hlBlock(leftSrc.join("\n"), language),
+				hlBlock(rightSrc.join("\n"), language),
+			])
+		: [leftSrc, rightSrc];
+
+	let lI = 0;
+	let rI = 0;
+	let stripeRow = 0;
+
+	type HalfResult = { gutter: string; contGutter: string; bodyRows: string[] };
+
+	function half_build(
+		line: DiffLine | null,
+		hl: string,
+		ranges: Array<[number, number]> | null,
+		side: "left" | "right",
+	): HalfResult {
+		if (!line) {
+			const gw2 = nw + 2;
+			const gPat = FG_STRIPE + "╱".repeat(gw2) + RST;
+			const g = ` ${gPat}${FG_RULE}│${RST} `;
+			return { gutter: g, contGutter: g, bodyRows: [stripes(cw, stripeRow)] };
+		}
+		if (line.type === "sep") {
+			const gap = line.newNum;
+			const label = gap && gap > 0 ? `··· ${gap} lines ···` : "···";
+			const g = `${BG_BASE} ${FG_DIM}${fit("", nw + 2)}${RST}${FG_RULE}│${RST} `;
+			return {
+				gutter: g,
+				contGutter: g,
+				bodyRows: [`${BG_BASE}${FG_DIM}${fit(label, cw)}${RST}`],
+			};
+		}
+
+		const isDel = line.type === "del";
+		const isAdd = line.type === "add";
+		const gBg = isDel ? BG_GUTTER_DEL : isAdd ? BG_GUTTER_ADD : BG_BASE;
+		const cBg = isDel ? BG_DEL : isAdd ? BG_ADD : BG_BASE;
+		const sFg = isDel ? dc.fgDel : isAdd ? dc.fgAdd : dc.fgCtx;
+		const sign = isDel ? "-" : isAdd ? "+" : " ";
+		const num = isDel
+			? line.oldNum
+			: isAdd
+				? line.newNum
+				: side === "left"
+					? line.oldNum
+					: line.newNum;
+
+		const borderFg = isDel ? dc.fgDel : isAdd ? dc.fgAdd : "";
+		const border = borderFg ? `${borderFg}${BORDER_BAR}${RST}` : ` ${BG_BASE}`;
+		const numFg = borderFg || FG_LNUM;
+
+		let body: string;
+		if (ranges && ranges.length > 0) {
+			body = injectBg(hl, ranges, cBg, isDel ? BG_DEL_W : BG_ADD_W);
+		} else if (isDel || isAdd) {
+			body = `${cBg}${hl}`;
+		} else {
+			body = `${BG_BASE}${DIM}${hl}`;
+		}
+
+		const gutter = `${border}${gBg}${lnum(num, nw, numFg)}${sFg}${BOLD}${sign}${RST} ${FG_RULE}│${RST} `;
+		const contGutter = `${border}${gBg}${" ".repeat(nw + 1)}${RST} ${FG_RULE}│${RST} `;
+		const bodyRows = wrapAnsi(tabs(body), cw, adaptiveWrapRows(), cBg);
+		return { gutter, contGutter, bodyRows };
+	}
+
+	const out: string[] = [];
+	const hdrOld = `${BG_BASE}${" ".repeat(Math.max(0, nw - 2))}${dc.fgDel}${DIM}old${RST}`;
+	const hdrNew = `${BG_BASE}${" ".repeat(Math.max(0, nw - 2))}${dc.fgAdd}${DIM}new${RST}`;
+	out.push(
+		`${BG_BASE}${hdrOld}${" ".repeat(Math.max(0, half - nw - 1))}${FG_RULE}┊${RST}${hdrNew}`,
+	);
+	out.push(`${rule(half)}${FG_RULE}┊${RST}${rule(half)}`);
+
+	for (const r of vis) {
+		const leftLine = r.left;
+		const rightLine = r.right;
+		const paired =
+			leftLine &&
+			rightLine &&
+			leftLine.type === "del" &&
+			rightLine.type === "add";
+		const wd = paired
+			? wordDiffAnalysis(leftLine.content, rightLine.content)
+			: null;
+
+		let lResult: HalfResult;
+		let rResult: HalfResult;
+
+		if (paired && wd && wd.similarity >= WORD_DIFF_MIN_SIM && canHL) {
+			const lhl = leftHL[lI++] ?? leftLine.content;
+			const rhl = rightHL[rI++] ?? rightLine.content;
+			lResult = half_build(leftLine, lhl, wd.oldRanges, "left");
+			rResult = half_build(rightLine, rhl, wd.newRanges, "right");
+		} else if (paired && wd && wd.similarity >= WORD_DIFF_MIN_SIM && !canHL) {
+			const pwd = plainWordDiff(leftLine.content, rightLine.content);
+			lI++;
+			rI++;
+			lResult = half_build(leftLine, pwd.old, null, "left");
+			rResult = half_build(rightLine, pwd.new, null, "right");
+		} else {
+			const lhl =
+				leftLine && leftLine.type !== "sep"
+					? (leftHL[lI++] ?? leftLine?.content ?? "")
+					: "";
+			const rhl =
+				rightLine && rightLine.type !== "sep"
+					? (rightHL[rI++] ?? rightLine?.content ?? "")
+					: "";
+			lResult = half_build(leftLine, lhl, null, "left");
+			rResult = half_build(rightLine, rhl, null, "right");
+		}
+
+		const maxRowsN = Math.max(lResult.bodyRows.length, rResult.bodyRows.length);
+		const leftIsEmpty = !r.left;
+		const rightIsEmpty = !r.right;
+		for (let row = 0; row < maxRowsN; row++) {
+			const lg = row === 0 ? lResult.gutter : lResult.contGutter;
+			const rg = row === 0 ? rResult.gutter : rResult.contGutter;
+			const lb =
+				lResult.bodyRows[row] ??
+				(leftIsEmpty
+					? stripes(cw, stripeRow)
+					: `${BG_EMPTY}${" ".repeat(cw)}${RST}`);
+			const rb =
+				rResult.bodyRows[row] ??
+				(rightIsEmpty
+					? stripes(cw, stripeRow)
+					: `${BG_EMPTY}${" ".repeat(cw)}${RST}`);
+			out.push(`${lg}${lb}${DIVIDER}${rg}${rb}`);
+			stripeRow++;
+		}
+	}
+
+	out.push(`${rule(half)}${FG_RULE}┊${RST}${rule(half)}`);
+	if (rows.length > vis.length) {
+		out.push(
+			`${BG_BASE}${FG_DIM}  … ${rows.length - vis.length} more lines${RST}`,
+		);
+	}
+	return out.join("\n");
+}