terminal-png 0.1.0

package/README.md

@@ -0,0 +1,27 @@
+# terminal-png
+
+Render PNG images from ANSI terminal output.
+
+## API
+
+```ts
+import { renderTerminalPng } from "terminal-png";
+
+await renderTerminalPng(ansiText, {
+  output: "example.png",
+  window: true,
+  padding: 20
+});
+```
+
+Options:
+
+- `output`: path to the output PNG file
+- `window`: include terminal window chrome
+- `padding`: padding around the rendered terminal content
+
+## CLI
+
+```sh
+terminal-png <input.ansi> -o <output.png> [--window] [--padding 20]
+```

package/bin/terminal-png

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+import { main } from "../dist/cli.js";
+
+const exitCode = await main();
+process.exitCode = exitCode;

package/dist/ansi-parser.d.ts

@@ -0,0 +1,23 @@
+export type Color = {
+    type: "ansi4";
+    index: number;
+} | {
+    type: "ansi8";
+    index: number;
+} | {
+    type: "rgb";
+    r: number;
+    g: number;
+    b: number;
+};
+export type StyledRun = {
+    text: string;
+    fg: Color | null;
+    bg: Color | null;
+    bold: boolean;
+    italic: boolean;
+    underline: boolean;
+    strikethrough: boolean;
+    dim: boolean;
+};
+export declare function parseAnsi(input: string): StyledRun[];

package/dist/ansi-parser.js

@@ -0,0 +1,247 @@
+const ESC = "\u001b";
+function createDefaultStyle() {
+    return {
+        fg: null,
+        bg: null,
+        bold: false,
+        italic: false,
+        underline: false,
+        strikethrough: false,
+        dim: false
+    };
+}
+function cloneStyle(style) {
+    return { ...style };
+}
+function stylesEqual(left, right) {
+    return (left.bold === right.bold &&
+        left.italic === right.italic &&
+        left.underline === right.underline &&
+        left.strikethrough === right.strikethrough &&
+        left.dim === right.dim &&
+        colorsEqual(left.fg, right.fg) &&
+        colorsEqual(left.bg, right.bg));
+}
+function colorsEqual(left, right) {
+    if (left === right) {
+        return true;
+    }
+    if (!left || !right || left.type !== right.type) {
+        return false;
+    }
+    if (left.type === "rgb" && right.type === "rgb") {
+        return left.r === right.r && left.g === right.g && left.b === right.b;
+    }
+    if ((left.type === "ansi4" || left.type === "ansi8") && left.type === right.type) {
+        return left.index === right.index;
+    }
+    return false;
+}
+function pushRun(runs, style, text) {
+    if (text.length === 0) {
+        return;
+    }
+    const previous = runs.at(-1);
+    if (previous && text !== "\n" && previous.text !== "\n" && stylesEqual(previous, style)) {
+        previous.text += text;
+        return;
+    }
+    runs.push({
+        text,
+        fg: style.fg,
+        bg: style.bg,
+        bold: style.bold,
+        italic: style.italic,
+        underline: style.underline,
+        strikethrough: style.strikethrough,
+        dim: style.dim
+    });
+}
+function parseCsi(input, start) {
+    let index = start + 2;
+    while (index < input.length) {
+        const code = input.charCodeAt(index);
+        if (code >= 0x40 && code <= 0x7e) {
+            return {
+                end: index + 1,
+                final: input[index],
+                params: input.slice(start + 2, index)
+            };
+        }
+        index += 1;
+    }
+    return {
+        end: input.length,
+        final: null,
+        params: input.slice(start + 2)
+    };
+}
+function toInteger(value) {
+    if (!value || value.length === 0) {
+        return null;
+    }
+    for (const char of value) {
+        if (char < "0" || char > "9") {
+            return null;
+        }
+    }
+    return Number.parseInt(value, 10);
+}
+function clampByte(value) {
+    if (value < 0) {
+        return 0;
+    }
+    if (value > 255) {
+        return 255;
+    }
+    return value;
+}
+function applyExtendedColor(params, start) {
+    const mode = params[start];
+    if (mode === 5) {
+        const index = params[start + 1];
+        if (index === undefined) {
+            return null;
+        }
+        return {
+            color: { type: "ansi8", index: clampByte(index) },
+            consumed: 2
+        };
+    }
+    if (mode === 2) {
+        const r = params[start + 1];
+        const g = params[start + 2];
+        const b = params[start + 3];
+        if (r === undefined || g === undefined || b === undefined) {
+            return null;
+        }
+        return {
+            color: { type: "rgb", r: clampByte(r), g: clampByte(g), b: clampByte(b) },
+            consumed: 4
+        };
+    }
+    return null;
+}
+function applySgr(style, paramsText) {
+    const nextStyle = cloneStyle(style);
+    const rawParams = paramsText.length === 0 ? ["0"] : paramsText.split(";");
+    const params = [];
+    for (const rawParam of rawParams) {
+        const value = toInteger(rawParam);
+        if (value === null) {
+            return nextStyle;
+        }
+        params.push(value);
+    }
+    for (let index = 0; index < params.length; index += 1) {
+        const value = params[index];
+        if (value === 0) {
+            Object.assign(nextStyle, createDefaultStyle());
+            continue;
+        }
+        if (value === 1) {
+            nextStyle.bold = true;
+            continue;
+        }
+        if (value === 2) {
+            nextStyle.dim = true;
+            continue;
+        }
+        if (value === 22) {
+            nextStyle.bold = false;
+            nextStyle.dim = false;
+            continue;
+        }
+        if (value === 3) {
+            nextStyle.italic = true;
+            continue;
+        }
+        if (value === 23) {
+            nextStyle.italic = false;
+            continue;
+        }
+        if (value === 4) {
+            nextStyle.underline = true;
+            continue;
+        }
+        if (value === 24) {
+            nextStyle.underline = false;
+            continue;
+        }
+        if (value === 9) {
+            nextStyle.strikethrough = true;
+            continue;
+        }
+        if (value === 29) {
+            nextStyle.strikethrough = false;
+            continue;
+        }
+        if (value === 39) {
+            nextStyle.fg = null;
+            continue;
+        }
+        if (value === 49) {
+            nextStyle.bg = null;
+            continue;
+        }
+        if (value >= 30 && value <= 37) {
+            nextStyle.fg = { type: "ansi4", index: value - 30 };
+            continue;
+        }
+        if (value >= 90 && value <= 97) {
+            nextStyle.fg = { type: "ansi4", index: value - 90 + 8 };
+            continue;
+        }
+        if (value >= 40 && value <= 47) {
+            nextStyle.bg = { type: "ansi4", index: value - 40 };
+            continue;
+        }
+        if (value >= 100 && value <= 107) {
+            nextStyle.bg = { type: "ansi4", index: value - 100 + 8 };
+            continue;
+        }
+        if (value === 38 || value === 48) {
+            const extended = applyExtendedColor(params, index + 1);
+            if (!extended) {
+                continue;
+            }
+            if (value === 38) {
+                nextStyle.fg = extended.color;
+            }
+            else {
+                nextStyle.bg = extended.color;
+            }
+            index += extended.consumed;
+        }
+    }
+    return nextStyle;
+}
+export function parseAnsi(input) {
+    const runs = [];
+    let style = createDefaultStyle();
+    let textStart = 0;
+    let index = 0;
+    while (index < input.length) {
+        const char = input[index];
+        if (char === "\n") {
+            pushRun(runs, style, input.slice(textStart, index));
+            pushRun(runs, style, "\n");
+            index += 1;
+            textStart = index;
+            continue;
+        }
+        if (char === ESC && input[index + 1] === "[") {
+            pushRun(runs, style, input.slice(textStart, index));
+            const sequence = parseCsi(input, index);
+            if (sequence.final === "m") {
+                style = applySgr(style, sequence.params);
+            }
+            index = sequence.end;
+            textStart = index;
+            continue;
+        }
+        index += 1;
+    }
+    pushRun(runs, style, input.slice(textStart));
+    return runs;
+}

package/dist/cli.d.ts

@@ -0,0 +1,8 @@
+interface CliWriter {
+    write(chunk: string | Uint8Array): boolean;
+}
+interface CliOutput {
+    stderr: CliWriter;
+}
+export declare function main(args?: string[], output?: CliOutput): Promise<number>;
+export {};

package/dist/cli.js

@@ -0,0 +1,59 @@
+import { readFile } from "node:fs/promises";
+import path from "node:path";
+import { pathToFileURL } from "node:url";
+import { Command, CommanderError, InvalidArgumentError } from "commander";
+import { renderTerminalPng } from "./index.js";
+const defaultOutput = {
+    stderr: process.stderr
+};
+function parsePadding(value) {
+    const padding = Number(value);
+    if (!Number.isInteger(padding) || padding < 0) {
+        throw new InvalidArgumentError("padding must be a non-negative integer");
+    }
+    return padding;
+}
+export async function main(args = process.argv.slice(2), output = defaultOutput) {
+    const program = new Command();
+    program
+        .name("terminal-png")
+        .description("Render a PNG image from ANSI terminal output")
+        .argument("<input>", "Path to the ANSI input file")
+        .requiredOption("-o, --output <output>", "Path to the output PNG file")
+        .option("--window", "Include terminal window chrome", true)
+        .option("--no-window", "Exclude terminal window chrome")
+        .option("--padding <n>", "Padding around terminal content", parsePadding)
+        .action(async (input, options) => {
+        const ansiText = await readFile(input, "utf8");
+        await renderTerminalPng(ansiText, {
+            output: options.output,
+            padding: options.padding,
+            window: options.window
+        });
+    });
+    program.configureOutput({
+        writeErr: value => {
+            output.stderr.write(value);
+        }
+    });
+    program.exitOverride();
+    try {
+        await program.parseAsync(args, { from: "user" });
+        return 0;
+    }
+    catch (error) {
+        if (error instanceof CommanderError) {
+            return error.exitCode;
+        }
+        const message = error instanceof Error ? error.message : String(error);
+        output.stderr.write(`Error: ${message}\n`);
+        return 1;
+    }
+}
+const entryPoint = process.argv[1]
+    ? pathToFileURL(path.resolve(process.argv[1])).href
+    : null;
+if (entryPoint === import.meta.url) {
+    const exitCode = await main();
+    process.exitCode = exitCode;
+}

package/dist/font.d.ts

@@ -0,0 +1,4 @@
+export declare const JETBRAINS_MONO_BASE64: string;
+export declare const JETBRAINS_MONO_FONT_FILES: readonly [string, string, string, string];
+export declare const JETBRAINS_MONO_TTF_PATH: string;
+export declare const FONT_FACE_CSS: string;

package/dist/font.js

@@ -0,0 +1,37 @@
+import { readFileSync } from "node:fs";
+import { createRequire } from "node:module";
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
+const require = createRequire(import.meta.url);
+// Full JetBrains Mono (all Unicode blocks including box-drawing and geometric shapes).
+// The @fontsource subsets only cover Latin and miss characters used by the design system.
+const fontPackageRoot = dirname(require.resolve("jetbrains-mono/package.json"));
+const webfontRoot = join(fontPackageRoot, "fonts/webfonts");
+function readWebfontBase64(filename) {
+    return readFileSync(join(webfontRoot, filename)).toString("base64");
+}
+function resolveAssetPath(filename) {
+    return fileURLToPath(new URL(`../assets/${filename}`, import.meta.url));
+}
+function createFontFace(base64, weight, style) {
+    return `@font-face {
+  font-family: 'JetBrains Mono';
+  font-style: ${style};
+  font-weight: ${weight};
+  src: url('data:font/woff2;base64,${base64}') format('woff2');
+}`;
+}
+export const JETBRAINS_MONO_BASE64 = readWebfontBase64("JetBrainsMono-Regular.woff2");
+export const JETBRAINS_MONO_FONT_FILES = [
+    resolveAssetPath("jetbrains-mono-400-normal.ttf"),
+    resolveAssetPath("jetbrains-mono-700-normal.ttf"),
+    resolveAssetPath("jetbrains-mono-400-italic.ttf"),
+    resolveAssetPath("jetbrains-mono-700-italic.ttf")
+];
+export const JETBRAINS_MONO_TTF_PATH = JETBRAINS_MONO_FONT_FILES[0];
+export const FONT_FACE_CSS = [
+    createFontFace(JETBRAINS_MONO_BASE64, 400, "normal"),
+    createFontFace(readWebfontBase64("JetBrainsMono-Bold.woff2"), 700, "normal"),
+    createFontFace(readWebfontBase64("JetBrainsMono-Italic.woff2"), 400, "italic"),
+    createFontFace(readWebfontBase64("JetBrainsMono-BoldItalic.woff2"), 700, "italic")
+].join("\n");

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export interface TerminalPngOptions {
+    padding?: number;
+    window?: boolean;
+    output?: string;
+}
+export declare function renderTerminalPng(ansiText: string, options?: TerminalPngOptions): Promise<Buffer>;
+export * from "./ansi-parser.js";
+export * from "./font.js";
+export * from "./png-renderer.js";
+export * from "./svg-renderer.js";

package/dist/index.js

@@ -0,0 +1,20 @@
+import { writeFile } from "node:fs/promises";
+import { parseAnsi } from "./ansi-parser.js";
+import { renderPng } from "./png-renderer.js";
+import { renderSvg } from "./svg-renderer.js";
+export async function renderTerminalPng(ansiText, options = {}) {
+    const runs = parseAnsi(ansiText);
+    const svg = renderSvg(runs, {
+        padding: options.padding,
+        window: options.window
+    });
+    const png = renderPng(svg);
+    if (options.output) {
+        await writeFile(options.output, png);
+    }
+    return png;
+}
+export * from "./ansi-parser.js";
+export * from "./font.js";
+export * from "./png-renderer.js";
+export * from "./svg-renderer.js";

package/dist/png-renderer.d.ts

@@ -0,0 +1 @@
+export declare function renderPng(svg: string): Buffer;

package/dist/png-renderer.js

@@ -0,0 +1,18 @@
+import { Resvg } from "@resvg/resvg-js";
+import { JETBRAINS_MONO_FONT_FILES } from "./font.js";
+export function renderPng(svg) {
+    const resvg = new Resvg(svg, {
+        font: {
+            defaultFontFamily: "JetBrains Mono",
+            fontFiles: [...JETBRAINS_MONO_FONT_FILES],
+            loadSystemFonts: false,
+            monospaceFamily: "JetBrains Mono"
+        },
+        fitTo: {
+            mode: "zoom",
+            value: 4
+        }
+    });
+    const png = resvg.render();
+    return Buffer.from(png.asPng());
+}

package/dist/svg-renderer.d.ts

@@ -0,0 +1,6 @@
+import type { StyledRun } from "./ansi-parser.js";
+export interface SvgOptions {
+    padding?: number;
+    window?: boolean;
+}
+export declare function renderSvg(runs: StyledRun[], options?: SvgOptions): string;

package/dist/svg-renderer.js

@@ -0,0 +1,225 @@
+import { FONT_FACE_CSS } from "./font.js";
+const ANSI_16_PALETTE = [
+    "#282a2e",
+    "#D74E6F",
+    "#31BB71",
+    "#D3E561",
+    "#8056FF",
+    "#ED61D7",
+    "#04D7D7",
+    "#C5C8C6",
+    "#4B4B4B",
+    "#FE5F86",
+    "#00D787",
+    "#EBFF71",
+    "#8F69FF",
+    "#FF7AEA",
+    "#00FEFE",
+    "#FFFFFF"
+];
+const XTERM_256_PALETTE = [
+    "#000000", "#800000", "#008000", "#808000", "#000080", "#800080", "#008080", "#c0c0c0",
+    "#808080", "#ff0000", "#00ff00", "#ffff00", "#0000ff", "#ff00ff", "#00ffff", "#ffffff",
+    "#000000", "#00005f", "#000087", "#0000af", "#0000d7", "#0000ff", "#005f00", "#005f5f",
+    "#005f87", "#005faf", "#005fd7", "#005fff", "#008700", "#00875f", "#008787", "#0087af",
+    "#0087d7", "#0087ff", "#00af00", "#00af5f", "#00af87", "#00afaf", "#00afd7", "#00afff",
+    "#00d700", "#00d75f", "#00d787", "#00d7af", "#00d7d7", "#00d7ff", "#00ff00", "#00ff5f",
+    "#00ff87", "#00ffaf", "#00ffd7", "#00ffff", "#5f0000", "#5f005f", "#5f0087", "#5f00af",
+    "#5f00d7", "#5f00ff", "#5f5f00", "#5f5f5f", "#5f5f87", "#5f5faf", "#5f5fd7", "#5f5fff",
+    "#5f8700", "#5f875f", "#5f8787", "#5f87af", "#5f87d7", "#5f87ff", "#5faf00", "#5faf5f",
+    "#5faf87", "#5fafaf", "#5fafd7", "#5fafff", "#5fd700", "#5fd75f", "#5fd787", "#5fd7af",
+    "#5fd7d7", "#5fd7ff", "#5fff00", "#5fff5f", "#5fff87", "#5fffaf", "#5fffd7", "#5fffff",
+    "#870000", "#87005f", "#870087", "#8700af", "#8700d7", "#8700ff", "#875f00", "#875f5f",
+    "#875f87", "#875faf", "#875fd7", "#875fff", "#878700", "#87875f", "#878787", "#8787af",
+    "#8787d7", "#8787ff", "#87af00", "#87af5f", "#87af87", "#87afaf", "#87afd7", "#87afff",
+    "#87d700", "#87d75f", "#87d787", "#87d7af", "#87d7d7", "#87d7ff", "#87ff00", "#87ff5f",
+    "#87ff87", "#87ffaf", "#87ffd7", "#87ffff", "#af0000", "#af005f", "#af0087", "#af00af",
+    "#af00d7", "#af00ff", "#af5f00", "#af5f5f", "#af5f87", "#af5faf", "#af5fd7", "#af5fff",
+    "#af8700", "#af875f", "#af8787", "#af87af", "#af87d7", "#af87ff", "#afaf00", "#afaf5f",
+    "#afaf87", "#afafaf", "#afafd7", "#afafff", "#afd700", "#afd75f", "#afd787", "#afd7af",
+    "#afd7d7", "#afd7ff", "#afff00", "#afff5f", "#afff87", "#afffaf", "#afffd7", "#afffff",
+    "#d70000", "#d7005f", "#d70087", "#d700af", "#d700d7", "#d700ff", "#d75f00", "#d75f5f",
+    "#d75f87", "#d75faf", "#d75fd7", "#d75fff", "#d78700", "#d7875f", "#d78787", "#d787af",
+    "#d787d7", "#d787ff", "#d7af00", "#d7af5f", "#d7af87", "#d7afaf", "#d7afd7", "#d7afff",
+    "#d7d700", "#d7d75f", "#d7d787", "#d7d7af", "#d7d7d7", "#d7d7ff", "#d7ff00", "#d7ff5f",
+    "#d7ff87", "#d7ffaf", "#d7ffd7", "#d7ffff", "#ff0000", "#ff005f", "#ff0087", "#ff00af",
+    "#ff00d7", "#ff00ff", "#ff5f00", "#ff5f5f", "#ff5f87", "#ff5faf", "#ff5fd7", "#ff5fff",
+    "#ff8700", "#ff875f", "#ff8787", "#ff87af", "#ff87d7", "#ff87ff", "#ffaf00", "#ffaf5f",
+    "#ffaf87", "#ffafaf", "#ffafd7", "#ffafff", "#ffd700", "#ffd75f", "#ffd787", "#ffd7af",
+    "#ffd7d7", "#ffd7ff", "#ffff00", "#ffff5f", "#ffff87", "#ffffaf", "#ffffd7", "#ffffff",
+    "#080808", "#121212", "#1c1c1c", "#262626", "#303030", "#3a3a3a", "#444444", "#4e4e4e",
+    "#585858", "#606060", "#666666", "#767676", "#808080", "#8a8a8a", "#949494", "#9e9e9e",
+    "#a8a8a8", "#b2b2b2", "#bcbcbc", "#c6c6c6", "#d0d0d0", "#dadada", "#e4e4e4", "#eeeeee"
+];
+const BACKGROUND = "#171717";
+const DEFAULT_FOREGROUND = "#c4c4c4";
+const FONT_FAMILY = "JetBrains Mono";
+const FONT_SIZE = 14;
+const LINE_HEIGHT = 1.2;
+const CHARACTER_WIDTH = 8.412666666666667;
+const TEXT_BOTTOM_PADDING = 11.6;
+const DEFAULT_PADDING = {
+    top: 20,
+    right: 40,
+    bottom: 20,
+    left: 20
+};
+const WINDOW_BAR_HEIGHT = 15;
+export function renderSvg(runs, options = {}) {
+    const padding = options.padding === undefined
+        ? DEFAULT_PADDING
+        : {
+            top: options.padding,
+            right: options.padding,
+            bottom: options.padding,
+            left: options.padding
+        };
+    const showWindow = options.window ?? true;
+    const titleBarHeight = showWindow ? WINDOW_BAR_HEIGHT : 0;
+    const textStartX = padding.left;
+    const lineHeightPx = FONT_SIZE * LINE_HEIGHT;
+    const textStartY = titleBarHeight + padding.top + lineHeightPx;
+    const lines = splitIntoLines(runs);
+    const contentWidth = measureLines(lines);
+    const width = padding.left + contentWidth + padding.right;
+    const height = titleBarHeight + padding.top + (lines.length * lineHeightPx) + padding.bottom + TEXT_BOTTOM_PADDING;
+    const svgWidth = formatNumber(width);
+    const svgHeight = formatNumber(height);
+    const viewBox = `0 0 ${svgWidth} ${svgHeight}`;
+    const textElements = renderLines(lines, textStartX, textStartY, lineHeightPx);
+    return [
+        `<svg xmlns="http://www.w3.org/2000/svg" width="${svgWidth}" height="${svgHeight}" viewBox="${viewBox}">`,
+        "<defs>",
+        "<style><![CDATA[",
+        FONT_FACE_CSS,
+        "]]></style>",
+        "</defs>",
+        `<rect x="0" y="0" width="${svgWidth}" height="${svgHeight}" fill="${BACKGROUND}" />`,
+        showWindow ? renderWindowControls() : "",
+        `<g font-family="${FONT_FAMILY}" font-size="${formatNumber(FONT_SIZE)}px" fill="${DEFAULT_FOREGROUND}">`,
+        textElements,
+        "</g>",
+        "</svg>"
+    ].join("");
+}
+function splitIntoLines(runs) {
+    const lines = [[]];
+    for (const run of runs) {
+        if (run.text === "\n") {
+            lines.push([]);
+            continue;
+        }
+        lines[lines.length - 1]?.push(run);
+    }
+    return lines;
+}
+function measureLines(lines) {
+    return Math.max(...lines.map(line => line.reduce((width, run) => width + (displayWidth(run.text) * CHARACTER_WIDTH), 0)), 0);
+}
+function displayWidth(text) {
+    const segmenter = new Intl.Segmenter();
+    let width = 0;
+    for (const { segment } of segmenter.segment(text)) {
+        const cp = segment.codePointAt(0);
+        width += cp !== undefined && isWideCodePoint(cp) ? 2 : 1;
+    }
+    return width;
+}
+function isWideCodePoint(cp) {
+    return ((cp >= 0x1100 && cp <= 0x115F) || // Hangul Jamo
+        cp === 0x2329 || cp === 0x232A || // Angle brackets
+        (cp >= 0x2E80 && cp <= 0x303E) || // CJK Radicals, Kangxi
+        (cp >= 0x3041 && cp <= 0x33BF) || // Hiragana, Katakana, CJK symbols
+        (cp >= 0x3400 && cp <= 0x4DBF) || // CJK Extension A
+        (cp >= 0x4E00 && cp <= 0xA4CF) || // CJK Unified Ideographs
+        (cp >= 0xA960 && cp <= 0xA97F) || // Hangul Jamo Extended-A
+        (cp >= 0xAC00 && cp <= 0xD7AF) || // Hangul Syllables
+        (cp >= 0xF900 && cp <= 0xFAFF) || // CJK Compatibility Ideographs
+        (cp >= 0xFE10 && cp <= 0xFE19) || // Vertical Forms
+        (cp >= 0xFE30 && cp <= 0xFE6F) || // CJK Compatibility Forms
+        (cp >= 0xFF00 && cp <= 0xFF60) || // Fullwidth Latin, Halfwidth Katakana
+        (cp >= 0xFFE0 && cp <= 0xFFE6) || // Fullwidth Signs
+        (cp >= 0x1B000 && cp <= 0x1B0FF) || // Kana Supplement
+        (cp >= 0x1F004 && cp <= 0x1F004) || // Mahjong tile
+        (cp >= 0x1F0CF && cp <= 0x1F0CF) || // Playing card black joker
+        (cp >= 0x1F200 && cp <= 0x1FFFD) || // Enclosed CJK + Emoji
+        (cp >= 0x20000 && cp <= 0x2FFFD) || // CJK Extension B–F
+        (cp >= 0x30000 && cp <= 0x3FFFD) // CJK Extension G–H
+    );
+}
+function renderLines(lines, textStartX, textStartY, lineHeightPx) {
+    return lines
+        .map((line, index) => {
+        const y = formatNumber(textStartY + (index * lineHeightPx));
+        if (line.length === 0) {
+            return `<text x="${formatNumber(textStartX)}" y="${y}" xml:space="preserve"/>`;
+        }
+        return [
+            `<text x="${formatNumber(textStartX)}" y="${y}" xml:space="preserve">`,
+            line.map(renderRun).join(""),
+            "</text>"
+        ].join("");
+    })
+        .join("");
+}
+function renderRun(run) {
+    const attributes = ['xml:space="preserve"'];
+    const color = resolveColor(run.fg);
+    const textDecorations = [];
+    if (color !== DEFAULT_FOREGROUND) {
+        attributes.push(`fill="${escapeXmlAttribute(color)}"`);
+    }
+    if (run.bold) {
+        attributes.push('font-weight="bold"');
+    }
+    if (run.italic) {
+        attributes.push('font-style="italic"');
+    }
+    if (run.underline) {
+        textDecorations.push("underline");
+    }
+    if (run.strikethrough) {
+        textDecorations.push("line-through");
+    }
+    if (textDecorations.length > 0) {
+        attributes.push(`text-decoration="${textDecorations.join(" ")}"`);
+    }
+    if (run.dim) {
+        attributes.push('opacity="0.7"');
+    }
+    return `<tspan ${attributes.join(" ")}>${escapeXmlText(run.text)}</tspan>`;
+}
+function renderWindowControls() {
+    return [
+        '<circle cx="13.5" cy="12" r="5.5" fill="#FF5A54" />',
+        '<circle cx="32.5" cy="12" r="5.5" fill="#E6BF29" />',
+        '<circle cx="51.5" cy="12" r="5.5" fill="#52C12B" />'
+    ].join("");
+}
+function resolveColor(color) {
+    if (color === null) {
+        return DEFAULT_FOREGROUND;
+    }
+    if (color.type === "ansi4") {
+        return ANSI_16_PALETTE[color.index] ?? DEFAULT_FOREGROUND;
+    }
+    if (color.type === "ansi8") {
+        if (color.index < ANSI_16_PALETTE.length) {
+            return ANSI_16_PALETTE[color.index] ?? DEFAULT_FOREGROUND;
+        }
+        return XTERM_256_PALETTE[color.index] ?? DEFAULT_FOREGROUND;
+    }
+    return `rgb(${color.r},${color.g},${color.b})`;
+}
+function escapeXmlText(value) {
+    return value
+        .replaceAll("&", "&amp;")
+        .replaceAll("<", "&lt;")
+        .replaceAll(">", "&gt;");
+}
+function escapeXmlAttribute(value) {
+    return escapeXmlText(value).replaceAll('"', "&quot;").replaceAll("'", "&apos;");
+}
+function formatNumber(value) {
+    return value.toFixed(2);
+}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "terminal-png",
+  "version": "0.1.0",
+  "description": "Render PNG images from ANSI terminal output.",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": "./dist/index.js",
+  "bin": {
+    "terminal-png": "./bin/terminal-png"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "compare": "tsx scripts/compare.ts"
+  },
+  "files": [
+    "dist",
+    "bin",
+    "assets"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/poe-platform/poe-code.git",
+    "directory": "packages/terminal-png"
+  },
+  "dependencies": {
+    "@resvg/resvg-js": "^2.6.2",
+    "commander": "^14.0.3",
+    "jetbrains-mono": "^1.0.6"
+  }
+}