styleproof 3.1.2 → 3.1.3

package/dist/report.js

@@ -20,6 +20,13 @@ const union = (a, b) => {
 };
 const intersects = (a, b) => a.x < b.x + b.w && b.x < a.x + a.w && a.y < b.y + b.h && b.y < a.y + a.h;
 const visible = (b) => !!b && b.w > 0 && b.h > 0;
+/** Bounding box that encloses every rect (the changed-element footprint). */
+function unionRects(rects) {
+    const boxes = rects.map(rectToBox).filter(visible);
+    if (!boxes.length)
+        return null;
+    return boxes.reduce(union);
+}
 /** Outermost changed paths: drop any path that has a changed strict ancestor.
  *  Used to ANCHOR a crop (zoom to the whole changed region, not a leaf). */
 function outermost(paths) {
@@ -161,6 +168,38 @@ function compositePair(before, after) {
     fillRect(canvas, PAD + w + GAP / 2 - 1, PAD, 2, h, [48, 54, 61]); // divider
     return canvas;
 }
+// Integer nearest-neighbor upscale. Nearest-neighbor (not smoothing) so the
+// zoom invents no colours that weren't captured — a magnified crop is still a
+// faithful pixel-for-pixel view, just bigger.
+function scalePng(src, s) {
+    if (s <= 1)
+        return src;
+    const out = new PNG({ width: src.width * s, height: src.height * s });
+    for (let y = 0; y < out.height; y++) {
+        const sy = Math.floor(y / s);
+        for (let x = 0; x < out.width; x++) {
+            const si = (sy * src.width + Math.floor(x / s)) << 2;
+            const oi = (y * out.width + x) << 2;
+            out.data[oi] = src.data[si];
+            out.data[oi + 1] = src.data[si + 1];
+            out.data[oi + 2] = src.data[si + 2];
+            out.data[oi + 3] = src.data[si + 3];
+        }
+    }
+    return out;
+}
+// A magnified crop centered on the changed box, for changes too small to see at
+// 1:1 (e.g. a 2px font bump on a caret). Crops the tight context box, upscales by
+// an integer factor, then outlines the changes (stroke scaled to stay visible).
+function zoomCrop(src, box, rects, factor) {
+    const crop = cropPng(src, box, box.w, box.h);
+    const scaled = scalePng(crop.png, factor);
+    const t = Math.max(2, factor);
+    for (const [rx, ry, rw, rh] of rects) {
+        strokeRect(scaled, (rx - crop.ox) * factor, (ry - crop.oy) * factor, rw * factor, rh * factor, t);
+    }
+    return scaled;
+}
 function readPng(file) {
     if (!fs.existsSync(file))
         return null;
@@ -378,9 +417,11 @@ function surfaceContext(...maps) {
     const metadata = maps.find((m) => m?.metadata)?.metadata;
     if (!metadata?.variantKey)
         return '';
-    return metadata.variantKind === 'live-state'
-        ? `live state \`${metadata.variantKey}\``
-        : `variant \`${metadata.variantKey}\``;
+    if (metadata.variantKind === 'live-state')
+        return `live state \`${metadata.variantKey}\``;
+    if (metadata.variantKind === 'popup')
+        return `popup \`${metadata.variantKey}\``;
+    return `variant \`${metadata.variantKey}\``;
 }
 function formatSurfaceWithContext(surface, ...maps) {
     const context = surfaceContext(...maps);
@@ -401,7 +442,9 @@ function liveCandidateLabel(candidate) {
     return `${label} (${candidate.reason})`;
 }
 function captureFiles(dir) {
-    return fs.existsSync(dir) ? fs.readdirSync(dir).filter((f) => /\.json(\.gz)?$/.test(f)) : [];
+    return fs.existsSync(dir)
+        ? fs.readdirSync(dir).filter((f) => f !== 'styleproof-manifest.json' && /\.json(\.gz)?$/.test(f))
+        : [];
 }
 function collectLiveCandidateLabels(beforeDir, afterDir) {
     const seen = new Set();
@@ -791,7 +834,7 @@ export function generateStyleMapReport(opts) {
     const { beforeDir, afterDir, outDir, imageBaseUrl = '', 
     // Tighter than before (was 24) so the change fills the frame — the annotation
     // box keeps enough context legible.
-    pad: padBy = 12, minWidth = 320, minHeight = 180, maxHeight = 1600, 
+    pad: padBy = 12, minWidth = 320, minHeight = 180, maxHeight = 1600, zoomBelow = 64, 
     // More, smaller crops before collapsing (was 6), so distinct changes get their
     // own focused frame rather than one wide merged one.
     maxCrops = 8, foldDetailsAt = 0, } = opts;
@@ -947,10 +990,37 @@ export function generateStyleMapReport(opts) {
                 const annotated = compositePair(annotateCrop(before, rectsA), annotateCrop(after, rectsB));
                 writePng(path.join(outDir, `${stem}-annotated.png`), annotated);
                 images = { composite: `${stem}-composite.png`, annotated: `${stem}-annotated.png` };
-                // Clean before|after shown by default (the real UI); the annotated twin —
-                // boxes marking each change — sits one click away under a toggle. Plain
-                // images (no link wrap) so a click opens the full-resolution file.
-                md.push('', `![before ◀ │ ▶ after](${img(images.composite)})`, '', `<sub>◀ before  ·  after ▶ — ${formatSurfaceWithContext(sd.surface, mapA, mapB)}</sub>`, '', '<details>', '<summary>🔍 Highlight what changed</summary>', '', `![annotated before ◀ │ ▶ after](${img(images.annotated)})`, '', `<sub>magenta boxes mark each change — ${formatSurfaceWithContext(sd.surface, mapA, mapB)}</sub>`, '', '</details>');
+                // Name the changed element(s) so the reviewer knows where to look without
+                // expanding anything (e.g. `changed: span.caret`).
+                const changedNames = [
+                    ...new Set(markPaths
+                        .map((p) => mapA.elements[p] ?? mapB.elements[p])
+                        .filter((e) => !!e)
+                        .map((e) => (e.cls ? `${e.tag}.${e.cls.split(/\s+/)[0]}` : e.tag))),
+                ].slice(0, 3);
+                const changedLabel = changedNames.length ? ` — changed: \`${changedNames.join('`, `')}\`` : '';
+                const ctxLabel = formatSurfaceWithContext(sd.surface, mapA, mapB);
+                // A sub-pixel change (e.g. a 2px font bump on a caret) is invisible at 1:1,
+                // so when the changed-element footprint is small, add a magnified crop that
+                // makes it obvious without the reviewer hunting. Anchored on the leaf rects.
+                const changed = unionRects([...rectsA, ...rectsB]);
+                const maxDim = changed ? Math.max(changed.w, changed.h) : 0;
+                let zoomFactor = 0;
+                if (zoomBelow > 0 && changed && maxDim > 0 && maxDim <= zoomBelow) {
+                    const zBox = pad(changed, Math.max(maxDim, 16)); // ~3× the change for context
+                    zoomFactor = Math.min(8, Math.max(2, Math.round(240 / Math.max(zBox.w, zBox.h))));
+                    const zoom = compositePair(zoomCrop(pngA, zBox, rectsA, zoomFactor), zoomCrop(pngB, zBox, rectsB, zoomFactor));
+                    writePng(path.join(outDir, `${stem}-zoom.png`), zoom);
+                    images.zoom = `${stem}-zoom.png`;
+                }
+                // Both views shown by default: the clean before|after (the real UI) and the
+                // highlighted twin (magenta boxes on each change) so a reviewer sees WHAT
+                // changed and WHERE without expanding anything. Plain images (no link wrap)
+                // so a click opens the full-resolution file.
+                md.push('', `![before ◀ │ ▶ after](${img(images.composite)})`, '', `<sub>◀ before  ·  after ▶ — ${ctxLabel}</sub>`, '', `![highlighted before ◀ │ ▶ after](${img(images.annotated)})`, '', `<sub>🔍 magenta boxes mark each change${changedLabel}</sub>`);
+                if (images.zoom) {
+                    md.push('', `![zoomed before ◀ │ ▶ after](${img(images.zoom)})`, '', `<sub>🔬 magnified ${zoomFactor}× — change too small to see at 1:1${changedLabel}</sub>`);
+                }
             }
             else if (!region) {
                 md.push('', '_Changed element is not visible in this state (zero-size box) — see the property list._');

package/dist/runner.d.ts

@@ -40,6 +40,12 @@ export type Surface = {
      * variants so reports and diagnostics can explain why the capture was split.
      */
     liveStates?: SurfaceLiveState[];
+    /**
+     * Opt in to automatically opening visible click-triggered popups after the base
+     * surface is captured. Captures persistent dialogs, popovers, menus, listboxes,
+     * tooltips, and open data-state overlays as `<surface>-popup-XX`.
+     */
+    popups?: boolean | PopupCaptureOptions;
 };
 export type SurfaceVariant = {
     /** Capture key suffix, joined as `<surface.key>-<variant.key>`. */
@@ -59,6 +65,18 @@ export type SurfaceVariant = {
     height?: number | ((width: number) => number);
 };
 export type SurfaceLiveState = SurfaceVariant;
+export type PopupCaptureOptions = {
+    /** Enable/disable popup discovery for this surface or capture run. */
+    enabled?: boolean;
+    /** Max visible trigger controls to try per surface/width (default 20). */
+    max?: number;
+    /** CSS selector for visible controls to click. */
+    triggers?: string;
+    /** CSS selector for visible popup/overlay roots that mean a click opened state. */
+    overlays?: string;
+    /** Max ms to wait for a clicked control to reveal an overlay (default 750). */
+    timeoutMs?: number;
+};
 export type DefineOptions = {
     surfaces: Surface[];
     /**
@@ -143,8 +161,15 @@ export type DefineOptions = {
      * Advisory only — never gates. See `CaptureOptions.captureComponent`.
      */
     captureComponent?: boolean;
+    /**
+     * Opt-in automatic popup/modal capture for every surface. Existing suites keep
+     * their exact capture set unless this is enabled.
+     */
+    popups?: boolean | PopupCaptureOptions;
 };
 export declare function selfCheckErrorMessage(surfaceKey: string, drift: Finding[], volatile?: string[], liveCandidates?: LiveRegionCandidate[]): string;
+type ResolvedPopupCaptureOptions = Required<PopupCaptureOptions>;
+export declare function resolvePopupCaptureOptions(input: boolean | PopupCaptureOptions | undefined): ResolvedPopupCaptureOptions;
 type ExpandedSurface = Omit<Surface, 'variants' | 'liveStates'> & {
     metadata?: CaptureMetadata;
 };
@@ -174,15 +199,14 @@ export declare function passLiveStreams(page: Page, url: string): Promise<void>;
 export declare function defaultSelfCheck(replayFrom: string | undefined, env?: string | undefined): boolean;
 /**
  * Output base dir: explicit `baseDir` wins, then `STYLEPROOF_BASEDIR`, then the
- * default. Lets a pre-push hook redirect capture into a COMMITTED dir (so main
- * always carries a base map and CI just diffs precomputed maps) without editing
- * the spec — same env-wiring philosophy as `STYLEPROOF_REPLAY_*`.
+ * default. Lets CLIs and CI redirect capture into cache/fallback dirs without
+ * editing the spec — same env-wiring philosophy as `STYLEPROOF_REPLAY_*`.
  */
 export declare function resolveBaseDir(baseDir: string | undefined, env?: string | undefined): string;
 /**
  * Whether to save full-page screenshots: explicit `screenshots` wins, else
- * `STYLEPROOF_SCREENSHOTS=0` turns them off — for committed maps you want the lean
- * `.json.gz` only, never PNGs in git history. On by default otherwise.
+ * `STYLEPROOF_SCREENSHOTS=0` turns them off. On by default so restored map bundles
+ * can generate reviewable reports without recapturing.
  */
 export declare function resolveScreenshots(screenshots: boolean | undefined, env?: string | undefined): boolean;
 /** The capture settings every capturer shares (everything bar the surface set). */
@@ -222,6 +246,8 @@ export type CrawlOptions = CaptureConfig & {
     variants?: SurfaceVariant[];
     /** First-class live product states captured for every discovered link surface. */
     liveStates?: SurfaceLiveState[];
+    /** Opt-in automatic popup/modal capture for every discovered link surface. */
+    popups?: boolean | PopupCaptureOptions;
     /** Max ms to wait for the crawl root's links to render before reading them
      *  (an SPA hydrates its nav client-side). Default 15000. */
     linkTimeout?: number;

package/dist/runner.js

@@ -56,6 +56,107 @@ function mergeIgnore(...groups) {
     const merged = [...new Set(groups.flatMap((g) => g ?? []))];
     return merged.length ? merged : undefined;
 }
+const POPUP_TRIGGER_ATTR = 'data-styleproof-popup-trigger';
+const DEFAULT_POPUP_TRIGGERS = [
+    'button:not([disabled]):not([type="submit"]):not([type="reset"])',
+    '[role="button"]:not([aria-disabled="true"])',
+    '[aria-haspopup]',
+    '[popovertarget]',
+    'summary',
+    'a[href^="#"]',
+].join(', ');
+const DEFAULT_POPUP_OVERLAYS = [
+    'dialog[open]',
+    '[popover]',
+    '[role="dialog"]',
+    '[role="alertdialog"]',
+    '[role="menu"]',
+    '[role="listbox"]',
+    '[role="tooltip"]',
+    '[data-state="open"]:not(button):not(a):not(summary)',
+].join(', ');
+export function resolvePopupCaptureOptions(input) {
+    if (input === false || input === undefined) {
+        return {
+            enabled: false,
+            max: 20,
+            triggers: DEFAULT_POPUP_TRIGGERS,
+            overlays: DEFAULT_POPUP_OVERLAYS,
+            timeoutMs: 750,
+        };
+    }
+    const options = input === true ? {} : input;
+    return {
+        enabled: options.enabled ?? true,
+        max: Math.max(0, Math.floor(options.max ?? 20)),
+        triggers: options.triggers ?? DEFAULT_POPUP_TRIGGERS,
+        overlays: options.overlays ?? DEFAULT_POPUP_OVERLAYS,
+        timeoutMs: Math.max(0, Math.floor(options.timeoutMs ?? 750)),
+    };
+}
+async function popupDomSnapshot(page, options) {
+    return page.evaluate(({ popupSelector, triggerSelector, attr, max = 0 }) => {
+        const qsa = (sel) => {
+            try {
+                return [...document.querySelectorAll(sel)];
+            }
+            catch {
+                return [];
+            }
+        };
+        const visible = (el) => {
+            const rect = el.getBoundingClientRect();
+            const style = getComputedStyle(el);
+            return rect.width > 0 && rect.height > 0 && style.display !== 'none' && style.visibility !== 'hidden';
+        };
+        const pathOf = (el) => {
+            const parts = [];
+            let cur = el;
+            while (cur && cur !== document.documentElement) {
+                const parent = cur.parentElement;
+                const tag = cur.tagName.toLowerCase();
+                const id = cur.id ? `#${cur.id}` : '';
+                const role = cur.getAttribute('role');
+                const sameTag = parent ? [...parent.children].filter((child) => child.tagName === cur.tagName) : [cur];
+                const nth = sameTag.length > 1 ? `:nth-of-type(${sameTag.indexOf(cur) + 1})` : '';
+                parts.unshift(`${tag}${id}${role ? `[role="${role}"]` : ''}${nth}`);
+                cur = cur.parentElement;
+            }
+            return parts.join(' > ');
+        };
+        const popups = qsa(popupSelector).filter(visible);
+        const keys = popups.map(pathOf);
+        if (!triggerSelector || !attr)
+            return { keys, indexes: [] };
+        const safeTrigger = (el) => {
+            const tag = el.tagName.toLowerCase();
+            if (el.matches(':disabled, [aria-disabled="true"]'))
+                return false;
+            if (tag === 'input' || tag === 'select' || tag === 'textarea')
+                return false;
+            if (tag === 'a')
+                return el.getAttribute('href')?.startsWith('#') ?? false;
+            return true;
+        };
+        for (const el of qsa(`[${attr}]`))
+            el.removeAttribute(attr);
+        const candidates = qsa(triggerSelector).filter((el) => visible(el) && !popups.some((popup) => popup !== el && popup.contains(el)) && safeTrigger(el));
+        candidates.slice(0, max).forEach((el, index) => el.setAttribute(attr, String(index)));
+        return { keys, indexes: candidates.slice(0, max).map((_, index) => index) };
+    }, options);
+}
+async function visiblePopupKeys(page, selector) {
+    return (await popupDomSnapshot(page, { popupSelector: selector })).keys;
+}
+async function markPopupCandidates(page, options) {
+    const snapshot = await popupDomSnapshot(page, {
+        triggerSelector: options.triggers,
+        popupSelector: options.overlays,
+        attr: POPUP_TRIGGER_ATTR,
+        max: options.max,
+    });
+    return snapshot.indexes.map((index) => ({ index }));
+}
 function expandOne(surface, variant, variantKind) {
     return {
         key: `${surface.key}-${variant.key}`,
@@ -67,6 +168,7 @@ function expandOne(surface, variant, variantKind) {
         ignore: mergeIgnore(surface.ignore, variant.ignore),
         widths: variant.widths ?? surface.widths,
         height: variant.height ?? surface.height,
+        popups: surface.popups,
         metadata: { surfaceKey: surface.key, variantKey: variant.key, variantKind },
     };
 }
@@ -152,6 +254,85 @@ async function assertDeterministic(page, surface, first, captureText, pending) {
         throw new Error(selfCheckErrorMessage(surface.key, drift, [...new Set([...(first.volatile ?? []), ...(again.volatile ?? [])])], liveCandidates));
     }
 }
+async function openPopupCandidate(page, surface, width, height, options, candidate) {
+    await page.setViewportSize({ width, height });
+    await page.keyboard.press('Escape').catch(() => { });
+    await surface.go(page);
+    const before = new Set(await visiblePopupKeys(page, options.overlays));
+    const candidates = await markPopupCandidates(page, options);
+    if (!candidates.some((c) => c.index === candidate.index))
+        return undefined;
+    await page
+        .locator(`[${POPUP_TRIGGER_ATTR}="${candidate.index}"]`)
+        .first()
+        .click({ timeout: Math.max(500, options.timeoutMs), noWaitAfter: true })
+        .catch(() => undefined);
+    const deadline = Date.now() + options.timeoutMs;
+    do {
+        const opened = (await visiblePopupKeys(page, options.overlays)).find((key) => !before.has(key));
+        if (opened)
+            return opened;
+        await page.waitForTimeout(50);
+    } while (Date.now() < deadline);
+    return undefined;
+}
+function popupMetadata(surface, popupId) {
+    return {
+        surfaceKey: surface.metadata?.surfaceKey ?? surface.key,
+        variantKey: surface.metadata?.variantKey ? `${surface.metadata.variantKey}/${popupId}` : popupId,
+        variantKind: 'popup',
+    };
+}
+async function captureOpenedPopupMap(page, surface, s, pending, popupId) {
+    return captureStyleMap(page, {
+        ignore: surface.ignore ?? [],
+        captureText: s.captureText,
+        captureComponent: s.captureComponent,
+        pendingRequests: pending,
+        metadata: popupMetadata(surface, popupId),
+    });
+}
+async function assertPopupDeterministic(page, surface, width, height, options, candidate, popupId, first, s, pending) {
+    const againKey = await openPopupCandidate(page, surface, width, height, options, candidate);
+    if (!againKey)
+        throw new Error(`styleproof self-check failed: ${surface.key}-${popupId} popup did not reopen`);
+    const again = await captureOpenedPopupMap(page, surface, s, pending, popupId);
+    const drift = diffStyleMaps(first, again);
+    if (drift.length) {
+        throw new Error(selfCheckErrorMessage(`${surface.key}-${popupId}`, drift, first.volatile, first.liveCandidates));
+    }
+}
+async function capturePopupCandidate(page, surface, width, height, s, options, candidate, seen) {
+    const requests = trackInflightRequests(page);
+    try {
+        const popupKey = await openPopupCandidate(page, surface, width, height, options, candidate);
+        if (!popupKey || seen.has(popupKey))
+            return;
+        seen.add(popupKey);
+        const popupId = `popup-${String(candidate.index + 1).padStart(2, '0')}`;
+        const map = await captureOpenedPopupMap(page, surface, s, requests.pending, popupId);
+        if (s.selfCheck)
+            await assertPopupDeterministic(page, surface, width, height, options, candidate, popupId, map, s, requests.pending);
+        const stem = path.join(s.baseDir, s.dir, `${surface.key}-${popupId}@${width}`);
+        saveStyleMap(`${stem}.json.gz`, map);
+        if (s.screenshots)
+            await page.screenshot({ path: `${stem}.png`, fullPage: true, animations: 'disabled' });
+    }
+    finally {
+        requests.dispose();
+    }
+}
+async function capturePopupSurfaces(page, surface, width, height, s) {
+    const options = resolvePopupCaptureOptions(surface.popups ?? s.popups);
+    if (!options.enabled || options.max === 0)
+        return;
+    await surface.go(page);
+    const candidates = await markPopupCandidates(page, options);
+    const seen = new Set();
+    for (const candidate of candidates) {
+        await capturePopupCandidate(page, surface, width, height, s, options, candidate, seen);
+    }
+}
 /** Drive one surface at one width to a settled state and save its style map (+ screenshot).
  *  The caller owns the test timeout (one-per-test for explicit surfaces, one budget for
  *  the whole crawl) so a multi-surface crawl can't reset its own deadline mid-loop. */
@@ -181,6 +362,7 @@ async function captureSurface(page, surface, width, s) {
             // state the map describes.
             await page.screenshot({ path: `${stem}.png`, fullPage: true, animations: 'disabled' });
         }
+        await capturePopupSurfaces(page, surface, width, height, s);
     }
     finally {
         requests.dispose();
@@ -198,17 +380,16 @@ export function defaultSelfCheck(replayFrom, env = process.env.STYLEPROOF_SELFCH
 }
 /**
  * Output base dir: explicit `baseDir` wins, then `STYLEPROOF_BASEDIR`, then the
- * default. Lets a pre-push hook redirect capture into a COMMITTED dir (so main
- * always carries a base map and CI just diffs precomputed maps) without editing
- * the spec — same env-wiring philosophy as `STYLEPROOF_REPLAY_*`.
+ * default. Lets CLIs and CI redirect capture into cache/fallback dirs without
+ * editing the spec — same env-wiring philosophy as `STYLEPROOF_REPLAY_*`.
  */
 export function resolveBaseDir(baseDir, env = process.env.STYLEPROOF_BASEDIR) {
     return baseDir ?? env ?? '__stylemaps__';
 }
 /**
  * Whether to save full-page screenshots: explicit `screenshots` wins, else
- * `STYLEPROOF_SCREENSHOTS=0` turns them off — for committed maps you want the lean
- * `.json.gz` only, never PNGs in git history. On by default otherwise.
+ * `STYLEPROOF_SCREENSHOTS=0` turns them off. On by default so restored map bundles
+ * can generate reviewable reports without recapturing.
  */
 export function resolveScreenshots(screenshots, env = process.env.STYLEPROOF_SCREENSHOTS) {
     return screenshots ?? env !== '0';
@@ -232,6 +413,7 @@ function resolveSettings(c) {
         selfCheck: c.selfCheck ?? defaultSelfCheck(replayFrom),
         captureText: c.captureText ?? false,
         captureComponent: c.captureComponent ?? false,
+        popups: resolvePopupCaptureOptions(c.popups),
     };
 }
 /**
@@ -314,7 +496,7 @@ export function defineStyleMapCapture(options) {
  * ```
  */
 export function defineCrawlCapture(options) {
-    const { from, match, key, widths, height, ignore, variants, liveStates, linkTimeout = 15_000, dir } = options;
+    const { from, match, key, widths, height, ignore, variants, liveStates, popups, linkTimeout = 15_000, dir } = options;
     const settings = resolveSettings(options);
     test.describe('styleproof crawl-capture', () => {
         test.skip(!dir, 'set STYLEMAP_DIR=<label> to capture computed-style maps');
@@ -339,6 +521,7 @@ export function defineCrawlCapture(options) {
                 height,
                 variants,
                 liveStates,
+                popups,
             }));
             // Budget the whole sweep up front: one test captures every surface, and
             // captureSurface no longer sets its own timeout, so size it to the work found.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "styleproof",
-  "version": "3.1.2",
+  "version": "3.1.3",
   "description": "Catch every CSS change before it ships — review PRs and certify refactors by the browser's computed styles, not pixels. Works with any styling system.",
   "keywords": [
     "playwright",
@@ -58,12 +58,14 @@
     "typecheck": "tsc --noEmit",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "format": "prettier --write \"{src,bin,test,example}/**/*.{ts,mjs,js}\" \"*.{ts,js,mjs,json,md}\"",
-    "format:check": "prettier --check \"{src,bin,test,example}/**/*.{ts,mjs,js}\" \"*.{ts,js,mjs,json,md}\"",
+    "format": "prettier --write \"{src,bin,test,example,scripts}/**/*.{ts,mjs,js}\" \"*.{ts,js,mjs,json,md}\"",
+    "format:check": "prettier --check \"{src,bin,test,example,scripts}/**/*.{ts,mjs,js}\" \"*.{ts,js,mjs,json,md}\"",
     "test": "npm run build && node --test test/*.test.mjs",
     "test:watch": "node --test --watch test/*.test.mjs",
     "test:e2e": "npm run build && playwright test",
     "bench": "npm run build && node bench/gate-speed.mjs",
+    "demo:report": "npm run build && node scripts/demo-report.mjs",
+    "demo:check": "npm run build && node scripts/demo-report.mjs --check",
     "init": "node ./bin/styleproof-init.mjs",
     "prepare": "npm run build && husky",
     "prepublishOnly": "npm run clean && npm run build && npm run typecheck && npm run lint && npm run format:check && npm test && npm run test:e2e"

package/dist/cli-base-ref.d.ts

@@ -1,15 +0,0 @@
-export interface BaseRefCaptureDirs {
-    beforeDir: string;
-    afterDir: string;
-    baseRef: string;
-    mapsDir: string;
-    tmpBase: string;
-}
-export declare function resolveBaseRefCaptureDirs(options: {
-    command: string;
-    baseRef: string | null;
-    mapsDir: string;
-    args: string[];
-    usage: string;
-}): BaseRefCaptureDirs;
-export declare function cleanupBaseRefCaptureDirs(captureDirs: BaseRefCaptureDirs | null): void;

package/dist/cli-base-ref.js

@@ -1,53 +0,0 @@
-import fs from 'node:fs';
-import { inferBaseRef, materializeRef, GitRefError } from './gitref.js';
-import { baseInferenceMessage, baseMapsMessage, missingWorkingMapsMessage } from './cli-errors.js';
-function errorMessage(error) {
-    return error instanceof Error ? error.message : String(error);
-}
-function exitUsage(usage) {
-    throw new Error(usage);
-}
-function inferBaseRefOrExit(command) {
-    try {
-        return inferBaseRef();
-    }
-    catch (e) {
-        throw new Error(e instanceof GitRefError ? baseInferenceMessage(command, e.message) : errorMessage(e), {
-            cause: e,
-        });
-    }
-}
-function selectBaseRef(options) {
-    const { command, args, usage } = options;
-    if (options.baseRef) {
-        if (args.length > 1)
-            exitUsage(usage);
-        return { baseRef: options.baseRef, mapsDir: args[0] ?? options.mapsDir };
-    }
-    if (args.length === 1)
-        return { baseRef: args[0], mapsDir: options.mapsDir };
-    return { baseRef: inferBaseRefOrExit(command), mapsDir: options.mapsDir };
-}
-function materializeBaseRefOrExit(command, baseRef, mapsDir) {
-    try {
-        return materializeRef(baseRef, mapsDir);
-    }
-    catch (e) {
-        throw new Error(e instanceof GitRefError ? baseMapsMessage(command, e.message, baseRef, mapsDir) : errorMessage(e), {
-            cause: e,
-        });
-    }
-}
-export function resolveBaseRefCaptureDirs(options) {
-    const { command } = options;
-    const { baseRef, mapsDir } = selectBaseRef(options);
-    if (!fs.existsSync(mapsDir)) {
-        throw new Error(missingWorkingMapsMessage(command, mapsDir));
-    }
-    const tmpBase = materializeBaseRefOrExit(command, baseRef, mapsDir);
-    return { beforeDir: tmpBase, afterDir: mapsDir, baseRef, mapsDir, tmpBase };
-}
-export function cleanupBaseRefCaptureDirs(captureDirs) {
-    if (captureDirs)
-        fs.rmSync(captureDirs.tmpBase, { recursive: true, force: true });
-}