@nghyane/arcane-tui 0.1.0

package/src/buffer/ansi-parser.ts

@@ -0,0 +1,349 @@
+import { Buffer } from "./buffer.js";
+import { type Cell, DEFAULT_STYLE, emptyCell, Mod, NO_COLOR, packRgb, palette256ToRgb, type Style } from "./cell.js";
+
+const STANDARD_COLORS: [number, number, number][] = [
+	[0, 0, 0], // 0 black
+	[187, 0, 0], // 1 red
+	[0, 187, 0], // 2 green
+	[187, 187, 0], // 3 yellow
+	[0, 0, 187], // 4 blue
+	[187, 0, 187], // 5 magenta
+	[0, 187, 187], // 6 cyan
+	[187, 187, 187], // 7 white
+];
+
+const BRIGHT_COLORS: [number, number, number][] = [
+	[85, 85, 85], // 8
+	[255, 85, 85], // 9
+	[85, 255, 85], // 10
+	[255, 255, 85], // 11
+	[85, 85, 255], // 12
+	[255, 85, 255], // 13
+	[85, 255, 255], // 14
+	[255, 255, 255], // 15
+];
+
+function standardColor(index: number): number {
+	const [r, g, b] = STANDARD_COLORS[index]!;
+	return packRgb(r, g, b);
+}
+
+function brightColor(index: number): number {
+	const [r, g, b] = BRIGHT_COLORS[index]!;
+	return packRgb(r, g, b);
+}
+
+const segmenter = new Intl.Segmenter();
+
+function cloneStyle(s: Style): Style {
+	return { fg: s.fg, bg: s.bg, mods: s.mods, link: s.link };
+}
+
+function parseSgr(params: number[], style: Style): void {
+	let i = 0;
+	while (i < params.length) {
+		const p = params[i]!;
+		switch (p) {
+			case 0:
+				style.fg = NO_COLOR;
+				style.bg = NO_COLOR;
+				style.mods = 0;
+				style.link = "";
+				break;
+			case 1:
+				style.mods |= Mod.Bold;
+				break;
+			case 2:
+				style.mods |= Mod.Dim;
+				break;
+			case 3:
+				style.mods |= Mod.Italic;
+				break;
+			case 4:
+				style.mods |= Mod.Underline;
+				break;
+			case 5:
+				style.mods |= Mod.Blink;
+				break;
+			case 7:
+				style.mods |= Mod.Reverse;
+				break;
+			case 8:
+				style.mods |= Mod.Hidden;
+				break;
+			case 9:
+				style.mods |= Mod.Strikethrough;
+				break;
+			case 22:
+				style.mods &= ~(Mod.Bold | Mod.Dim);
+				break;
+			case 23:
+				style.mods &= ~Mod.Italic;
+				break;
+			case 24:
+				style.mods &= ~Mod.Underline;
+				break;
+			case 25:
+				style.mods &= ~Mod.Blink;
+				break;
+			case 27:
+				style.mods &= ~Mod.Reverse;
+				break;
+			case 28:
+				style.mods &= ~Mod.Hidden;
+				break;
+			case 29:
+				style.mods &= ~Mod.Strikethrough;
+				break;
+			case 30:
+			case 31:
+			case 32:
+			case 33:
+			case 34:
+			case 35:
+			case 36:
+			case 37:
+				style.fg = standardColor(p - 30);
+				break;
+			case 38: {
+				const mode = params[i + 1];
+				if (mode === 5 && i + 2 < params.length) {
+					const idx = params[i + 2]!;
+					style.fg = palette256ToRgb(idx);
+					i += 2;
+				} else if (mode === 2 && i + 4 < params.length) {
+					style.fg = packRgb(params[i + 2]!, params[i + 3]!, params[i + 4]!);
+					i += 4;
+				} else {
+					i = params.length; // malformed, skip rest
+				}
+				break;
+			}
+			case 39:
+				style.fg = NO_COLOR;
+				break;
+			case 40:
+			case 41:
+			case 42:
+			case 43:
+			case 44:
+			case 45:
+			case 46:
+			case 47:
+				style.bg = standardColor(p - 40);
+				break;
+			case 48: {
+				const mode = params[i + 1];
+				if (mode === 5 && i + 2 < params.length) {
+					const idx = params[i + 2]!;
+					style.bg = palette256ToRgb(idx);
+					i += 2;
+				} else if (mode === 2 && i + 4 < params.length) {
+					style.bg = packRgb(params[i + 2]!, params[i + 3]!, params[i + 4]!);
+					i += 4;
+				} else {
+					i = params.length;
+				}
+				break;
+			}
+			case 49:
+				style.bg = NO_COLOR;
+				break;
+			case 90:
+			case 91:
+			case 92:
+			case 93:
+			case 94:
+			case 95:
+			case 96:
+			case 97:
+				style.fg = brightColor(p - 90);
+				break;
+			case 100:
+			case 101:
+			case 102:
+			case 103:
+			case 104:
+			case 105:
+			case 106:
+			case 107:
+				style.bg = brightColor(p - 100);
+				break;
+		}
+		i++;
+	}
+}
+
+export function parseAnsiLine(line: string, width: number, style?: Style): Cell[] {
+	const cells: Cell[] = [];
+	const cur: Style = style ? cloneStyle(style) : cloneStyle(DEFAULT_STYLE);
+	let col = 0;
+	let cachedStyle: Style | null = null;
+	let i = 0;
+	const len = line.length;
+
+	// Pre-strip ANSI to get visible text, but we need to process inline
+	// Process character by character
+	while (i < len && col < width) {
+		const ch = line.charCodeAt(i);
+
+		// ESC sequence
+		if (ch === 0x1b) {
+			const next = line.charCodeAt(i + 1);
+			// CSI: \x1b[
+			if (next === 0x5b) {
+				// '['
+				i += 2;
+				// Parse parameters
+				const params: number[] = [];
+				let num = -1;
+				while (i < len) {
+					const c = line.charCodeAt(i);
+					if (c >= 0x30 && c <= 0x39) {
+						// digit
+						num = (num === -1 ? 0 : num) * 10 + (c - 0x30);
+						i++;
+					} else if (c === 0x3b) {
+						// ';'
+						params.push(num === -1 ? 0 : num);
+						num = -1;
+						i++;
+					} else if (c >= 0x40 && c <= 0x7e) {
+						// final byte
+						params.push(num === -1 ? 0 : num);
+						if (c === 0x6d) {
+							// 'm' = SGR
+							parseSgr(params, cur);
+							cachedStyle = null;
+						}
+						i++;
+						break;
+					} else {
+						// intermediate bytes (0x20-0x2f), skip
+						i++;
+					}
+				}
+				continue;
+			}
+			// OSC: \x1b]
+			if (next === 0x5d) {
+				// ']'
+				i += 2;
+				// Read until BEL (0x07) or ST (\x1b\\)
+				let oscContent = "";
+				while (i < len) {
+					if (line.charCodeAt(i) === 0x07) {
+						i++;
+						break;
+					}
+					if (line.charCodeAt(i) === 0x1b && line.charCodeAt(i + 1) === 0x5c) {
+						i += 2;
+						break;
+					}
+					oscContent += line[i];
+					i++;
+				}
+				// Check for OSC 8 hyperlink
+				if (oscContent.startsWith("8;")) {
+					const semiIdx = oscContent.indexOf(";", 2);
+					if (semiIdx !== -1) {
+						cur.link = oscContent.slice(semiIdx + 1);
+						cachedStyle = null;
+					}
+				}
+				continue;
+			}
+			// Other ESC sequences - skip until we find a letter or run out
+			i += 2;
+			while (i < len) {
+				const c = line.charCodeAt(i);
+				if (c >= 0x40 && c <= 0x7e) {
+					i++;
+					break;
+				}
+				i++;
+			}
+			continue;
+		}
+
+		// Tab
+		if (ch === 0x09) {
+			const spaces = Math.min(3, width - col);
+			for (let s = 0; s < spaces; s++) {
+				if (!cachedStyle) cachedStyle = cloneStyle(cur);
+				cells.push({ char: " ", width: 1, style: cachedStyle });
+				col++;
+			}
+			i++;
+			continue;
+		}
+
+		// Control characters
+		if (ch < 0x20) {
+			i++;
+			continue;
+		}
+
+		// ASCII fast path: printable ASCII (0x20-0x7E) is always width 1, single char
+		if (ch >= 0x20 && ch <= 0x7e) {
+			if (col >= width) break;
+			if (!cachedStyle) cachedStyle = cloneStyle(cur);
+			cells.push({ char: line[i]!, width: 1, style: cachedStyle });
+			col++;
+			i++;
+			continue;
+		}
+
+		// Non-ASCII: use segmenter for grapheme cluster detection
+		const remaining = line.slice(i);
+		const seg = segmenter.segment(remaining);
+		const first = seg[Symbol.iterator]().next();
+		if (first.done) {
+			i++;
+			continue;
+		}
+
+		const grapheme = first.value.segment;
+		const charWidth = Bun.stringWidth(grapheme);
+
+		if (charWidth === 0) {
+			i += grapheme.length;
+			continue;
+		}
+
+		if (col + charWidth > width) {
+			break;
+		}
+
+		if (!cachedStyle) cachedStyle = cloneStyle(cur);
+		cells.push({ char: grapheme, width: charWidth, style: cachedStyle });
+		col++;
+
+		if (charWidth === 2) {
+			if (!cachedStyle) cachedStyle = cloneStyle(cur);
+			cells.push({ char: "", width: 0, style: cachedStyle });
+			col++;
+		}
+
+		i += grapheme.length;
+	}
+
+	// Pad to width
+	while (cells.length < width) {
+		cells.push(emptyCell());
+	}
+
+	return cells;
+}
+
+export function linesToBuffer(lines: string[], width: number, height: number): Buffer {
+	const buf = new Buffer(width, height);
+	const rowCount = Math.min(lines.length, height);
+	for (let row = 0; row < rowCount; row++) {
+		const cells = parseAnsiLine(lines[row]!, width);
+		for (let col = 0; col < width; col++) {
+			buf.set(col, row, cells[col]!);
+		}
+	}
+	return buf;
+}

package/src/buffer/buffer.ts

@@ -0,0 +1,120 @@
+import { type Cell, cellsEqual, emptyCell, type Style } from "./cell.js";
+
+export interface Rect {
+	x: number;
+	y: number;
+	width: number;
+	height: number;
+}
+
+export interface CellChange {
+	col: number;
+	row: number;
+	cell: Cell;
+}
+
+const segmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+
+export class Buffer {
+	readonly width: number;
+	readonly height: number;
+	#cells: Cell[];
+
+	constructor(width: number, height: number) {
+		this.width = width;
+		this.height = height;
+		this.#cells = new Array(width * height);
+		for (let i = 0; i < this.#cells.length; i++) {
+			this.#cells[i] = emptyCell();
+		}
+	}
+
+	get(col: number, row: number): Cell {
+		if (col < 0 || col >= this.width || row < 0 || row >= this.height) return emptyCell();
+		return this.#cells[row * this.width + col];
+	}
+
+	set(col: number, row: number, cell: Cell): void {
+		if (col < 0 || col >= this.width || row < 0 || row >= this.height) return;
+		this.#cells[row * this.width + col] = cell;
+	}
+
+	setChar(col: number, row: number, char: string, charWidth: number, style: Style): void {
+		if (row < 0 || row >= this.height || col < 0 || col >= this.width) return;
+		if (charWidth === 2 && col + 1 >= this.width) {
+			// Wide char at last column — can't fit placeholder
+			this.#cells[row * this.width + col] = { char: " ", width: 1, style: { ...style } };
+			return;
+		}
+		this.#cells[row * this.width + col] = { char, width: charWidth, style: { ...style } };
+		if (charWidth === 2) {
+			this.#cells[row * this.width + col + 1] = { char: "", width: 0, style: { ...style } };
+		}
+	}
+
+	writeString(col: number, row: number, text: string, style: Style): number {
+		let c = col;
+		for (const { segment } of segmenter.segment(text)) {
+			const w = Bun.stringWidth(segment);
+			if (w === 0) continue;
+			if (c + w > this.width) break;
+			this.setChar(c, row, segment, w, style);
+			c += w;
+		}
+		return c - col;
+	}
+
+	fill(rect: Rect, cell: Cell): void {
+		const x0 = Math.max(0, rect.x);
+		const y0 = Math.max(0, rect.y);
+		const x1 = Math.min(this.width, rect.x + rect.width);
+		const y1 = Math.min(this.height, rect.y + rect.height);
+		for (let r = y0; r < y1; r++) {
+			for (let c = x0; c < x1; c++) {
+				this.#cells[r * this.width + c] = { char: cell.char, width: cell.width, style: { ...cell.style } };
+			}
+		}
+	}
+
+	clear(): void {
+		for (let i = 0; i < this.#cells.length; i++) {
+			this.#cells[i] = emptyCell();
+		}
+	}
+
+	copyFrom(source: Buffer, srcRect: Rect, destCol: number, destRow: number): void {
+		const sx0 = Math.max(0, srcRect.x);
+		const sy0 = Math.max(0, srcRect.y);
+		const sx1 = Math.min(source.width, srcRect.x + srcRect.width);
+		const sy1 = Math.min(source.height, srcRect.y + srcRect.height);
+
+		for (let sr = sy0; sr < sy1; sr++) {
+			const dr = destRow + (sr - srcRect.y);
+			if (dr < 0 || dr >= this.height) continue;
+			for (let sc = sx0; sc < sx1; sc++) {
+				const dc = destCol + (sc - srcRect.x);
+				if (dc < 0 || dc >= this.width) continue;
+				const cell = source.get(sc, sr);
+				this.#cells[dr * this.width + dc] = { char: cell.char, width: cell.width, style: { ...cell.style } };
+			}
+		}
+	}
+
+	diff(prev: Buffer): CellChange[] {
+		const changes: CellChange[] = [];
+		const maxW = Math.max(this.width, prev.width);
+		const maxH = Math.max(this.height, prev.height);
+		const empty = emptyCell();
+
+		for (let r = 0; r < maxH; r++) {
+			for (let c = 0; c < maxW; c++) {
+				const cur = r < this.height && c < this.width ? this.#cells[r * this.width + c] : empty;
+				const old = r < prev.height && c < prev.width ? prev.get(c, r) : empty;
+				if (!cellsEqual(cur, old)) {
+					changes.push({ col: c, row: r, cell: cur });
+				}
+			}
+		}
+		return changes;
+	}
+}

package/src/buffer/cell.ts

@@ -0,0 +1,103 @@
+export const enum Mod {
+	Bold = 1,
+	Dim = 2,
+	Italic = 4,
+	Underline = 8,
+	Blink = 16,
+	Reverse = 32,
+	Hidden = 64,
+	Strikethrough = 128,
+}
+
+export const NO_COLOR = 0;
+
+export function packRgb(r: number, g: number, b: number): number {
+	return (1 << 24) | (r << 16) | (g << 8) | b;
+}
+
+export function unpackRgb(packed: number): [r: number, g: number, b: number] {
+	return [(packed >> 16) & 0xff, (packed >> 8) & 0xff, packed & 0xff];
+}
+
+export function hasColor(packed: number): boolean {
+	return (packed & (1 << 24)) !== 0;
+}
+
+export interface Style {
+	fg: number;
+	bg: number;
+	mods: number;
+	link: string;
+}
+
+export const DEFAULT_STYLE: Style = { fg: NO_COLOR, bg: NO_COLOR, mods: 0, link: "" };
+
+export interface Cell {
+	char: string;
+	width: number;
+	style: Style;
+}
+
+export function emptyCell(): Cell {
+	return { char: " ", width: 1, style: { ...DEFAULT_STYLE } };
+}
+
+export function cellsEqual(a: Cell, b: Cell): boolean {
+	if (a.char !== b.char || a.width !== b.width) return false;
+	if (a.style === b.style) return true;
+	return (
+		a.style.fg === b.style.fg &&
+		a.style.bg === b.style.bg &&
+		a.style.mods === b.style.mods &&
+		a.style.link === b.style.link
+	);
+}
+
+// 256-color palette → packed RGB
+const PALETTE_256: number[] = (() => {
+	const p: number[] = new Array(256);
+
+	// Standard 16 colors (xterm defaults)
+	const base16: [number, number, number][] = [
+		[0, 0, 0],
+		[128, 0, 0],
+		[0, 128, 0],
+		[128, 128, 0],
+		[0, 0, 128],
+		[128, 0, 128],
+		[0, 128, 128],
+		[192, 192, 192],
+		[128, 128, 128],
+		[255, 0, 0],
+		[0, 255, 0],
+		[255, 255, 0],
+		[0, 0, 255],
+		[255, 0, 255],
+		[0, 255, 255],
+		[255, 255, 255],
+	];
+	for (let i = 0; i < 16; i++) {
+		p[i] = packRgb(base16[i][0], base16[i][1], base16[i][2]);
+	}
+
+	// 6x6x6 color cube (indices 16-231)
+	const vals = [0, 95, 135, 175, 215, 255];
+	for (let i = 0; i < 216; i++) {
+		const r = vals[Math.floor(i / 36)];
+		const g = vals[Math.floor(i / 6) % 6];
+		const b = vals[i % 6];
+		p[16 + i] = packRgb(r, g, b);
+	}
+
+	// Grayscale ramp (indices 232-255)
+	for (let i = 0; i < 24; i++) {
+		const v = 8 + i * 10;
+		p[232 + i] = packRgb(v, v, v);
+	}
+
+	return p;
+})();
+
+export function palette256ToRgb(index: number): number {
+	return PALETTE_256[index] ?? NO_COLOR;
+}

package/src/buffer/index.ts

@@ -0,0 +1,16 @@
+export { linesToBuffer, parseAnsiLine } from "./ansi-parser.js";
+export { Buffer, type CellChange, type Rect } from "./buffer.js";
+export {
+	type Cell,
+	cellsEqual,
+	DEFAULT_STYLE,
+	emptyCell,
+	hasColor,
+	Mod,
+	NO_COLOR,
+	packRgb,
+	palette256ToRgb,
+	type Style,
+	unpackRgb,
+} from "./cell.js";
+export { renderBuffer, renderDiff } from "./render.js";