figdiff 0.0.0-stage → 0.1.0-alpha.1

package/dist/html.js

@@ -0,0 +1,205 @@
+import { summarize } from "./diff/summary.js";
+import { formatSummary, formatValue } from "./report.js";
+/** Key used in `HtmlOptions.images` for a top-level frame. */
+export const frameKey = (page, frame) => `${page}\u0000${frame}`;
+const SEP = " › ";
+const KIND_SYMBOL = { added: "+", removed: "−", moved: ">", modified: "~", reordered: "↕" };
+const KIND_LABEL = { added: "Added", removed: "Removed", moved: "Moved", modified: "Changed", reordered: "Reordered" };
+export function escapeHtml(text) {
+    return text
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;")
+        .replace(/'/g, "&#39;");
+}
+/** Only embedded images and web URLs are accepted, never script-capable schemes. */
+function safeImageSrc(src) {
+    return /^(data:image\/(png|jpeg|webp|gif|svg\+xml);|https?:\/\/)/i.test(src) ? src : undefined;
+}
+/** Escape a value for display and add a small color swatch next to every hex color. */
+function valueHtml(value) {
+    let text = formatValue(value);
+    if (text.length > 240)
+        text = text.slice(0, 240) + "…";
+    return escapeHtml(text).replace(/#[0-9A-F]{6}(?:[0-9A-F]{2})?\b/g, (hex) => `<span class="sw" style="background:${hex}"></span><code>${hex}</code>`);
+}
+function rowBody(c) {
+    switch (c.kind) {
+        case "added":
+        case "removed":
+            return `<span class="type">${escapeHtml(c.type)}</span>`;
+        case "moved":
+            return `<span class="note">moved from ${escapeHtml(c.fromTrail.join(SEP) || "(root)")}</span>`;
+        case "reordered":
+            return `<span class="note">layer order changed</span>`;
+        case "modified":
+            return (`<ul class="props">` +
+                c.props
+                    .map((p) => `<li><span class="prop">${escapeHtml(p.prop)}</span>` +
+                    `<span class="from">${valueHtml(p.from)}</span><span class="arrow">→</span>` +
+                    `<span class="to">${valueHtml(p.to)}</span></li>`)
+                    .join("") +
+                `</ul>`);
+    }
+}
+function row(c, label) {
+    return (`<li class="chg ${c.kind}" data-kind="${c.kind}">` +
+        `<span class="badge" title="${KIND_LABEL[c.kind]}">${KIND_SYMBOL[c.kind]}</span>` +
+        `<div class="what"><span class="label">${escapeHtml(label)}</span>${rowBody(c)}</div></li>`);
+}
+function percent(ratio) {
+    const p = ratio * 100;
+    if (p === 0)
+        return "0%";
+    return p < 0.1 ? "<0.1%" : `${p < 10 ? p.toFixed(1) : Math.round(p)}%`;
+}
+function compare(images) {
+    if (!images)
+        return "";
+    const before = images.before && safeImageSrc(images.before);
+    const after = images.after && safeImageSrc(images.after);
+    const diff = images.diff && safeImageSrc(images.diff);
+    if (before && after) {
+        const tabs = `<div class="tabs"><button type="button" data-view="swipe" aria-pressed="true">Swipe</button>` +
+            `<button type="button" data-view="side" aria-pressed="false">Side by side</button>` +
+            (diff ? `<button type="button" data-view="diff" aria-pressed="false">Difference</button>` : "") +
+            (diff && images.changedRatio !== undefined
+                ? `<span class="ratio">${escapeHtml(percent(images.changedRatio))} of pixels differ</span>`
+                : "") +
+            `</div>`;
+        return (`<div class="cmp" data-view="swipe" style="--pos:50%">${tabs}` +
+            `<div class="stack"><img class="b" alt="Before" src="${escapeHtml(before)}">` +
+            `<img class="a" alt="After" src="${escapeHtml(after)}"></div>` +
+            (diff ? `<img class="diffimg" alt="Differences highlighted" src="${escapeHtml(diff)}" hidden>` : "") +
+            `<input type="range" min="0" max="100" value="50" aria-label="Slide between before and after">` +
+            `<div class="cap"><span>Before</span><span>After</span></div></div>`);
+    }
+    const only = after ?? before;
+    if (!only)
+        return "";
+    return (`<figure class="single"><img alt="${after ? "After" : "Before"}" src="${escapeHtml(only)}">` +
+        `<figcaption>${after ? "Added: only in the new version" : "Removed: only in the old version"}</figcaption></figure>`);
+}
+const CSS = `
+:root{--bg:#fff;--fg:#1c1c1e;--muted:#6b6b70;--line:#e3e3e8;--card:#f7f7f9;--add:#1a7f37;--rem:#c62828;--mod:#8a5a00;--mov:#5b3fc0;--reo:#00796b}
+@media (prefers-color-scheme:dark){:root{--bg:#161618;--fg:#ececf0;--muted:#9a9aa3;--line:#2e2e33;--card:#1f1f23;--add:#56d364;--rem:#ff7b72;--mod:#e3b341;--mov:#a99bff;--reo:#4fd1c5}}
+*{box-sizing:border-box}
+body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
+main{max-width:920px;margin:0 auto;padding:32px 16px 64px}
+h1{font-size:22px;margin:0 0 4px}
+.files{color:var(--muted);margin:0 0 16px;overflow-wrap:anywhere}
+.files code{color:var(--fg)}
+.summary{font-size:16px;margin:0 0 16px}
+.filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
+.filters button{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:999px;padding:4px 12px;cursor:pointer}
+.filters button[aria-pressed=false]{opacity:.45;text-decoration:line-through}
+h2{font-size:17px;margin:32px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
+details{border:1px solid var(--line);border-radius:10px;margin:12px 0;background:var(--card)}
+summary{cursor:pointer;padding:10px 14px;font-weight:600;display:flex;justify-content:space-between;gap:12px}
+summary .count{color:var(--muted);font-weight:400;white-space:nowrap}
+.body{padding:0 14px 12px}
+ul.list{list-style:none;margin:0;padding:0}
+.chg{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
+.chg[hidden]{display:none}
+.badge{flex:none;width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font:600 13px/1 ui-monospace,monospace;color:var(--bg)}
+.added .badge{background:var(--add)}.removed .badge{background:var(--rem)}.modified .badge{background:var(--mod)}.moved .badge{background:var(--mov)}.reordered .badge{background:var(--reo)}
+.what{min-width:0}
+.label{font-weight:600;overflow-wrap:anywhere}
+.type,.note{color:var(--muted);margin-left:8px;font-size:13px}
+ul.props{list-style:none;margin:4px 0 0;padding:0}
+ul.props li{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;padding:1px 0}
+.prop{color:var(--muted);min-width:84px}
+.arrow{color:var(--muted)}
+code{font:12.5px ui-monospace,SFMono-Regular,Menlo,monospace}
+.sw{display:inline-block;width:12px;height:12px;border-radius:3px;border:1px solid var(--line);vertical-align:-1px;margin-right:4px}
+.cmp{margin:4px 0 12px}
+.stack{position:relative;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--bg)}
+.stack img{display:block;width:100%;height:auto}
+.stack img.a{position:absolute;inset:0;clip-path:inset(0 0 0 var(--pos))}
+.cmp input{width:100%;margin:6px 0 0}
+.cap{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}
+.tabs{display:flex;align-items:center;gap:6px;margin:0 0 6px}
+.tabs button{font:inherit;font-size:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);border-radius:6px;padding:2px 10px;cursor:pointer}
+.tabs button[aria-pressed=true]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
+.tabs .ratio{margin-left:auto;color:var(--muted);font-size:12px}
+.diffimg{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px}
+.diffimg[hidden]{display:none}
+.cmp[data-view=diff] input,.cmp[data-view=diff] .cap,.cmp[data-view=diff] .stack,.cmp[data-view=side] input{display:none}
+.cmp[data-view=side] .stack{display:grid;grid-template-columns:1fr 1fr;gap:8px;border:0;border-radius:0;overflow:visible;background:none}
+.cmp[data-view=side] .stack img{border:1px solid var(--line);border-radius:8px;background:var(--bg)}
+.cmp[data-view=side] .stack img.a{position:static;clip-path:none}
+figure.single{margin:4px 0 12px}
+figure.single img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
+figure.single figcaption{color:var(--muted);font-size:12px;margin-top:4px}
+footer{margin-top:40px;color:var(--muted);font-size:12px}
+`;
+const SCRIPT = `
+document.querySelectorAll('.filters button').forEach(function(btn){
+  btn.addEventListener('click',function(){
+    var on=btn.getAttribute('aria-pressed')!=='true';
+    btn.setAttribute('aria-pressed',String(on));
+    var kind=btn.getAttribute('data-kind');
+    document.querySelectorAll('.chg[data-kind="'+kind+'"]').forEach(function(el){el.hidden=!on;});
+  });
+});
+document.querySelectorAll('.cmp').forEach(function(c){
+  var r=c.querySelector('input');
+  r.addEventListener('input',function(){c.style.setProperty('--pos',r.value+'%');});
+
+  c.querySelectorAll('.tabs button').forEach(function(t){
+    t.addEventListener('click',function(){
+      var view=t.getAttribute('data-view');
+      c.setAttribute('data-view',view);
+      var d=c.querySelector('.diffimg');
+      if(d)d.hidden=view!=='diff';
+      c.querySelectorAll('.tabs button').forEach(function(o){o.setAttribute('aria-pressed',String(o===t));});
+    });
+  });
+});
+`;
+/** A single self-contained HTML page describing the changes. No network access needed to view it. */
+export function formatHtml(changes, options = {}) {
+    const title = options.title ?? "figdiff report";
+    const summary = summarize(changes);
+    const pages = new Map();
+    for (const c of changes) {
+        const page = c.trail[0] ?? "(document)";
+        const frame = c.trail[1] ?? "";
+        const frames = pages.get(page) ?? new Map();
+        frames.set(frame, [...(frames.get(frame) ?? []), c]);
+        pages.set(page, frames);
+    }
+    const kinds = ["added", "removed", "modified", "moved", "reordered"].filter((k) => changes.some((c) => c.kind === k));
+    const filters = kinds
+        .map((k) => `<button type="button" data-kind="${k}" aria-pressed="true">${KIND_SYMBOL[k]} ${KIND_LABEL[k]}</button>`)
+        .join("");
+    let sections = "";
+    for (const [page, frames] of pages) {
+        sections += `<h2>Page “${escapeHtml(page)}”</h2>`;
+        for (const [frame, group] of frames) {
+            const heading = frame === "" ? "Page itself" : `Frame “${escapeHtml(frame)}”`;
+            const images = frame === "" ? undefined : options.images?.[frameKey(page, frame)];
+            const nodeCount = new Set(group.map((c) => c.id)).size;
+            const items = group
+                .map((c) => row(c, c.trail.length > 2 ? c.trail.slice(2).join(SEP) : frame === "" ? "(page)" : "(frame itself)"))
+                .join("");
+            sections +=
+                `<details open><summary><span>${heading}</span><span class="count">${nodeCount} ${nodeCount === 1 ? "node" : "nodes"}</span></summary>` +
+                    `<div class="body">${compare(images)}<ul class="list">${items}</ul></div></details>`;
+        }
+    }
+    const files = options.beforeName || options.afterName
+        ? `<p class="files"><code>${escapeHtml(options.beforeName ?? "before")}</code> → <code>${escapeHtml(options.afterName ?? "after")}</code></p>`
+        : "";
+    const body = changes.length === 0
+        ? `<p class="summary">No changes.</p>`
+        : `<p class="summary">${escapeHtml(formatSummary(summary))}</p><div class="filters">${filters}</div>${sections}`;
+    return (`<!doctype html><html lang="en"><head><meta charset="utf-8">` +
+        `<meta name="viewport" content="width=device-width,initial-scale=1">` +
+        `<title>${escapeHtml(title)}</title><style>${CSS}</style></head><body><main>` +
+        `<h1>${escapeHtml(title)}</h1>${files}${body}` +
+        `<footer>Generated by figdiff. Changes are matched by node id.</footer>` +
+        `</main><script>${SCRIPT}</script></body></html>\n`);
+}
+//# sourceMappingURL=html.js.map

package/dist/html.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"html.js","sourceRoot":"","sources":["../src/html.ts"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,18 @@
+export { diffTrees } from "./diff/diff.js";
+export { summarize } from "./diff/summary.js";
+export { parseFigcraft, readDocumentJson, documentToTree } from "./parser/index.js";
+export { formatText, formatSummary, formatValue } from "./report.js";
+export { run } from "./run.js";
+export type { Change, DesignNode, PropChange, Summary } from "./diff/types.js";
+export { formatHtml, frameKey, escapeHtml } from "./html.js";
+export type { FrameImages, HtmlOptions } from "./html.js";
+export { decodePng, encodePng } from "./render/png.js";
+export type { Image } from "./render/png.js";
+export { compareImages } from "./render/compare.js";
+export type { Comparison } from "./render/compare.js";
+export { createCliRenderer, findFigcraftCli, RendererUnavailableError } from "./render/figcraft-cli.js";
+export type { Renderer, Exec } from "./render/figcraft-cli.js";
+export { renderChangedFrames } from "./render/frames.js";
+export type { RenderOptions, RenderedFrames } from "./render/frames.js";
+export { extractFromGit } from "./git.js";
+export type { GitCopy, GitRun } from "./git.js";

package/dist/index.js

@@ -0,0 +1,12 @@
+export { diffTrees } from "./diff/diff.js";
+export { summarize } from "./diff/summary.js";
+export { parseFigcraft, readDocumentJson, documentToTree } from "./parser/index.js";
+export { formatText, formatSummary, formatValue } from "./report.js";
+export { run } from "./run.js";
+export { formatHtml, frameKey, escapeHtml } from "./html.js";
+export { decodePng, encodePng } from "./render/png.js";
+export { compareImages } from "./render/compare.js";
+export { createCliRenderer, findFigcraftCli, RendererUnavailableError } from "./render/figcraft-cli.js";
+export { renderChangedFrames } from "./render/frames.js";
+export { extractFromGit } from "./git.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACrE,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAE7D,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AAExG,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC"}

package/dist/parser/document.d.ts

@@ -0,0 +1,12 @@
+import type { DesignNode } from "../diff/types.js";
+/**
+ * Convert the contents of a `.figcraft` file's `document.json` into figdiff's tree.
+ *
+ * Format (observed in FigCraft's example files, document version 1):
+ * - `nodes` is a flat map from node id (a string key) to the node
+ * - each node lists child ids in `children`; the root of the tree is each page in `pages`
+ * - numeric ids; `next_id` is the id counter
+ *
+ * See docs/format-notes.md.
+ */
+export declare function documentToTree(doc: unknown): DesignNode;

package/dist/parser/document.js

@@ -0,0 +1,71 @@
+/** Keys that describe structure rather than appearance; they are not diffed as props. */
+const STRUCTURAL_KEYS = new Set(["id", "name", "type", "children", "parent"]);
+/** Number of decimals kept when comparing numbers (absorbs float noise like 8.000000000000002). */
+const PRECISION = 10_000;
+function normalize(value) {
+    if (typeof value === "number")
+        return Math.round(value * PRECISION) / PRECISION;
+    if (Array.isArray(value))
+        return value.map(normalize);
+    if (value !== null && typeof value === "object") {
+        const out = {};
+        for (const [k, v] of Object.entries(value))
+            out[k] = normalize(v);
+        return out;
+    }
+    return value;
+}
+/**
+ * Convert the contents of a `.figcraft` file's `document.json` into figdiff's tree.
+ *
+ * Format (observed in FigCraft's example files, document version 1):
+ * - `nodes` is a flat map from node id (a string key) to the node
+ * - each node lists child ids in `children`; the root of the tree is each page in `pages`
+ * - numeric ids; `next_id` is the id counter
+ *
+ * See docs/format-notes.md.
+ */
+export function documentToTree(doc) {
+    if (doc === null || typeof doc !== "object")
+        throw new Error("document.json is not an object");
+    const d = doc;
+    if (d.format !== "figcraft") {
+        throw new Error(`Not a FigCraft document (format: ${JSON.stringify(d.format)})`);
+    }
+    const nodes = d.nodes;
+    const pages = d.pages;
+    if (!nodes || typeof nodes !== "object" || !Array.isArray(pages)) {
+        throw new Error("document.json has no `nodes` map or `pages` list");
+    }
+    const seen = new Set();
+    const build = (id) => {
+        const key = String(id);
+        const raw = nodes[key];
+        if (!raw)
+            throw new Error(`Node ${key} is referenced but missing from document.json`);
+        if (seen.has(key))
+            throw new Error(`Node ${key} appears more than once in the tree`);
+        seen.add(key);
+        const props = {};
+        for (const [k, v] of Object.entries(raw)) {
+            if (!STRUCTURAL_KEYS.has(k))
+                props[k] = normalize(v);
+        }
+        const children = Array.isArray(raw.children) ? raw.children.map(build) : [];
+        return {
+            id: key,
+            type: String(raw.type ?? "unknown"),
+            name: String(raw.name ?? ""),
+            props,
+            children,
+        };
+    };
+    return {
+        id: "document",
+        type: "document",
+        name: String(d.name ?? "Untitled"),
+        props: {},
+        children: pages.map(build),
+    };
+}
+//# sourceMappingURL=document.js.map

package/dist/parser/document.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"document.js","sourceRoot":"","sources":["../../src/parser/document.ts"],"names":[],"mappings":"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"}

package/dist/parser/index.d.ts

@@ -0,0 +1,10 @@
+import type { DesignNode } from "../diff/types.js";
+export { documentToTree } from "./document.js";
+/**
+ * Read a .figcraft archive and return its parsed `document.json`.
+ *
+ * The archive is a zip containing `document.json`, and optionally
+ * `thumbnail.png`, `images/`, `versions/`, `branches/` and `library/`.
+ */
+export declare function readDocumentJson(path: string): unknown;
+export declare function parseFigcraft(path: string): DesignNode;

package/dist/parser/index.js

@@ -0,0 +1,21 @@
+import { readFileSync } from "node:fs";
+import { unzipSync, strFromU8 } from "fflate";
+import { documentToTree } from "./document.js";
+export { documentToTree } from "./document.js";
+/**
+ * Read a .figcraft archive and return its parsed `document.json`.
+ *
+ * The archive is a zip containing `document.json`, and optionally
+ * `thumbnail.png`, `images/`, `versions/`, `branches/` and `library/`.
+ */
+export function readDocumentJson(path) {
+    const files = unzipSync(new Uint8Array(readFileSync(path)));
+    const entry = files["document.json"];
+    if (!entry)
+        throw new Error(`${path}: no document.json found. Is this a .figcraft file?`);
+    return JSON.parse(strFromU8(entry));
+}
+export function parseFigcraft(path) {
+    return documentToTree(readDocumentJson(path));
+}
+//# sourceMappingURL=index.js.map

package/dist/parser/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/parser/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C;;;;;GAKG;AACH,MAAM,UAAU,gBAAgB,CAAC,IAAY;IAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAC5D,MAAM,KAAK,GAAG,KAAK,CAAC,eAAe,CAAC,CAAC;IACrC,IAAI,CAAC,KAAK;QAAE,MAAM,IAAI,KAAK,CAAC,GAAG,IAAI,qDAAqD,CAAC,CAAC;IAC1F,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;AACtC,CAAC;AAED,MAAM,UAAU,aAAa,CAAC,IAAY;IACxC,OAAO,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC;AAChD,CAAC"}

package/dist/render/compare.d.ts

@@ -0,0 +1,19 @@
+import type { Image } from "./png.js";
+export interface Comparison {
+    width: number;
+    height: number;
+    changedPixels: number;
+    totalPixels: number;
+    /** changedPixels / totalPixels, from 0 to 1. */
+    ratio: number;
+    /** Faded copy of the new image with changed pixels in solid red. */
+    diff: Image;
+}
+/**
+ * Compare two images pixel by pixel. If sizes differ, the comparison canvas is the larger of
+ * the two, and any area covered by only one image counts as changed.
+ *
+ * `tolerance` is the largest per-channel difference (0 to 255) still treated as unchanged,
+ * which absorbs anti-aliasing noise.
+ */
+export declare function compareImages(before: Image, after: Image, tolerance?: number): Comparison;

package/dist/render/compare.js

@@ -0,0 +1,61 @@
+const HIGHLIGHT = [255, 45, 85, 255];
+/**
+ * Compare two images pixel by pixel. If sizes differ, the comparison canvas is the larger of
+ * the two, and any area covered by only one image counts as changed.
+ *
+ * `tolerance` is the largest per-channel difference (0 to 255) still treated as unchanged,
+ * which absorbs anti-aliasing noise.
+ */
+export function compareImages(before, after, tolerance = 8) {
+    const width = Math.max(before.width, after.width);
+    const height = Math.max(before.height, after.height);
+    const out = new Uint8Array(width * height * 4);
+    let changed = 0;
+    const read = (img, x, y) => x < img.width && y < img.height ? (y * img.width + x) * 4 : undefined;
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            const a = read(before, x, y);
+            const b = read(after, x, y);
+            const o = (y * width + x) * 4;
+            let isChanged;
+            if (a === undefined || b === undefined) {
+                isChanged = a !== b;
+            }
+            else {
+                isChanged = false;
+                for (let c = 0; c < 4; c++) {
+                    if (Math.abs(before.data[a + c] - after.data[b + c]) > tolerance) {
+                        isChanged = true;
+                        break;
+                    }
+                }
+            }
+            if (isChanged) {
+                changed++;
+                out.set(HIGHLIGHT, o);
+            }
+            else if (b !== undefined) {
+                // Unchanged: show the pixel faded to 25% over white so the changes stand out.
+                const alpha = after.data[b + 3] / 255;
+                for (let c = 0; c < 3; c++) {
+                    const over = after.data[b + c] * alpha + 255 * (1 - alpha);
+                    out[o + c] = Math.round(255 - (255 - over) * 0.25);
+                }
+                out[o + 3] = 255;
+            }
+            else {
+                out.set([255, 255, 255, 255], o);
+            }
+        }
+    }
+    const totalPixels = width * height;
+    return {
+        width,
+        height,
+        changedPixels: changed,
+        totalPixels,
+        ratio: totalPixels === 0 ? 0 : changed / totalPixels,
+        diff: { width, height, data: out },
+    };
+}
+//# sourceMappingURL=compare.js.map

package/dist/render/compare.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compare.js","sourceRoot":"","sources":["../../src/render/compare.ts"],"names":[],"mappings":"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"}

package/dist/render/figcraft-cli.d.ts

@@ -0,0 +1,21 @@
+/** Runs a program; must throw if it cannot be started or exits with an error. */
+export type Exec = (command: string, args: string[]) => void;
+export declare const defaultExec: Exec;
+/** Renders one top-level frame of a design file to a PNG. */
+export interface Renderer {
+    /** Returns the PNG bytes, or undefined when the frame does not exist in that file. */
+    renderFrame(file: string, page: string, frame: string, scale: number): Uint8Array | undefined;
+}
+/** Thrown when figcraft-cli itself cannot be run, as opposed to a frame that is missing. */
+export declare class RendererUnavailableError extends Error {
+}
+/**
+ * Locate figcraft-cli. An explicit path wins; otherwise the FIGCRAFT_CLI environment
+ * variable, then `figcraft-cli` on the PATH. Returns undefined when it cannot be started.
+ */
+export declare function findFigcraftCli(explicit?: string, exec?: Exec, env?: Record<string, string | undefined>): string | undefined;
+/**
+ * Renderer backed by `figcraft-cli export`. The frame is selected by name; when the page
+ * is also passed and the CLI rejects that combination, it retries with the name alone.
+ */
+export declare function createCliRenderer(bin: string, exec?: Exec): Renderer;

package/dist/render/figcraft-cli.js

@@ -0,0 +1,63 @@
+import { execFileSync } from "node:child_process";
+import { mkdtempSync, readFileSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+export const defaultExec = (command, args) => {
+    execFileSync(command, args, { stdio: "ignore", timeout: 120_000 });
+};
+/** Thrown when figcraft-cli itself cannot be run, as opposed to a frame that is missing. */
+export class RendererUnavailableError extends Error {
+}
+const isNotFound = (err) => err?.code === "ENOENT";
+/**
+ * Locate figcraft-cli. An explicit path wins; otherwise the FIGCRAFT_CLI environment
+ * variable, then `figcraft-cli` on the PATH. Returns undefined when it cannot be started.
+ */
+export function findFigcraftCli(explicit, exec = defaultExec, env = process.env) {
+    const candidates = explicit ? [explicit] : [env.FIGCRAFT_CLI, "figcraft-cli"];
+    for (const candidate of candidates) {
+        if (!candidate)
+            continue;
+        try {
+            exec(candidate, ["--help"]);
+            return candidate;
+        }
+        catch (err) {
+            // Exists but did not like --help: still usable. Only "not found" rules it out.
+            if (!isNotFound(err))
+                return candidate;
+        }
+    }
+    return undefined;
+}
+/**
+ * Renderer backed by `figcraft-cli export`. The frame is selected by name; when the page
+ * is also passed and the CLI rejects that combination, it retries with the name alone.
+ */
+export function createCliRenderer(bin, exec = defaultExec) {
+    return {
+        renderFrame(file, page, frame, scale) {
+            const dir = mkdtempSync(join(tmpdir(), "figdiff-render-"));
+            const out = join(dir, "frame.png");
+            try {
+                const base = ["export", file, "-o", out, "--format", "png", "--scale", String(scale)];
+                for (const selector of [["--page", page, "--node", frame], ["--node", frame]]) {
+                    try {
+                        exec(bin, [...base, ...selector]);
+                        return new Uint8Array(readFileSync(out));
+                    }
+                    catch (err) {
+                        if (isNotFound(err))
+                            throw new RendererUnavailableError(`Cannot run ${bin}`);
+                        // Otherwise: this selector did not work, or the frame is not in this file.
+                    }
+                }
+                return undefined;
+            }
+            finally {
+                rmSync(dir, { recursive: true, force: true });
+            }
+        },
+    };
+}
+//# sourceMappingURL=figcraft-cli.js.map

package/dist/render/figcraft-cli.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"figcraft-cli.js","sourceRoot":"","sources":["../../src/render/figcraft-cli.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAKjC,MAAM,CAAC,MAAM,WAAW,GAAS,CAAC,OAAO,EAAE,IAAI,EAAE,EAAE;IACjD,YAAY,CAAC,OAAO,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;AACrE,CAAC,CAAC;AAQF,4FAA4F;AAC5F,MAAM,OAAO,wBAAyB,SAAQ,KAAK;CAAG;AAEtD,MAAM,UAAU,GAAG,CAAC,GAAY,EAAW,EAAE,CAAE,GAAgC,EAAE,IAAI,KAAK,QAAQ,CAAC;AAEnG;;;GAGG;AACH,MAAM,UAAU,eAAe,CAC7B,QAAiB,EACjB,OAAa,WAAW,EACxB,MAA0C,OAAO,CAAC,GAAG;IAErD,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC;IAC9E,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE,CAAC;QACnC,IAAI,CAAC,SAAS;YAAE,SAAS;QACzB,IAAI,CAAC;YACH,IAAI,CAAC,SAAS,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;YAC5B,OAAO,SAAS,CAAC;QACnB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,+EAA+E;YAC/E,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC;gBAAE,OAAO,SAAS,CAAC;QACzC,CAAC;IACH,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,iBAAiB,CAAC,GAAW,EAAE,OAAa,WAAW;IACrE,OAAO;QACL,WAAW,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK;YAClC,MAAM,GAAG,GAAG,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,iBAAiB,CAAC,CAAC,CAAC;YAC3D,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;YACnC,IAAI,CAAC;gBACH,MAAM,IAAI,GAAG,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;gBACtF,KAAK,MAAM,QAAQ,IAAI,CAAC,CAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC;oBAC9E,IAAI,CAAC;wBACH,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC;wBAClC,OAAO,IAAI,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC;oBAC3C,CAAC;oBAAC,OAAO,GAAG,EAAE,CAAC;wBACb,IAAI,UAAU,CAAC,GAAG,CAAC;4BAAE,MAAM,IAAI,wBAAwB,CAAC,cAAc,GAAG,EAAE,CAAC,CAAC;wBAC7E,2EAA2E;oBAC7E,CAAC;gBACH,CAAC;gBACD,OAAO,SAAS,CAAC;YACnB,CAAC;oBAAS,CAAC;gBACT,MAAM,CAAC,GAAG,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;YAChD,CAAC;QACH,CAAC;KACF,CAAC;AACJ,CAAC"}

package/dist/render/frames.d.ts

@@ -0,0 +1,19 @@
+import type { Change } from "../diff/types.js";
+import type { FrameImages } from "../html.js";
+import type { Renderer } from "./figcraft-cli.js";
+export interface RenderOptions {
+    /** Render scale passed to figcraft-cli. Default 1. */
+    scale?: number;
+    /** Most frames to render, to keep reports small and fast. Default 30. */
+    maxFrames?: number;
+}
+export interface RenderedFrames {
+    images: Record<string, FrameImages>;
+    warnings: string[];
+}
+/**
+ * Render every top-level frame that has changes, in both versions, and compare them.
+ * A frame missing from one version (added or removed) gets only the image that exists.
+ * Throws RendererUnavailableError if figcraft-cli cannot be run at all.
+ */
+export declare function renderChangedFrames(changes: Change[], beforePath: string, afterPath: string, renderer: Renderer, options?: RenderOptions): RenderedFrames;