glassbox 0.3.0 → 0.3.2

package/README.md

@@ -65,13 +65,13 @@ Glassbox gives you a proper diff viewer with annotation categories designed for
 | **Note**              | Context for the AI to consider.                 |
 | **Remember**          | A rule to persist to the AI's long-term config. |
 
-When you're done, click **Complete Review** and tell your AI tool:
+As you annotate, `.glassbox/latest-review.md` is updated automatically. You can tell your AI tool at any time:
 
 ```
 Read .glassbox/latest-review.md and apply the feedback.
 ```
 
-The AI gets a structured file with every annotation, organized by file and line number, with clear instructions on how to interpret each category. It fixes the bugs, applies your style preferences, avoids the anti-patterns, and updates its own config with your "remember" items.
+The AI gets a structured file with every annotation, organized by file and line number, with clear instructions on how to interpret each category. It fixes the bugs, applies your style preferences, avoids the anti-patterns, and updates its own config with your "remember" items. You don't need to formally "complete" a review to share feedback — just annotate and switch to your AI tool.
 
 Then you run `glassbox` again. Your previous annotations carry forward — matched to the updated diff. Stale comments that no longer apply are flagged so you can keep or discard them. The loop continues until you're satisfied.
 

package/dist/cli.js

@@ -3083,6 +3083,17 @@ async function generateReviewExport(reviewId, repoRoot, isCurrent) {
   return archivePath;
 }
 
+// src/export/auto-export.ts
+var debounceTimer = null;
+var DEBOUNCE_MS = 2e3;
+function scheduleAutoExport(reviewId, repoRoot) {
+  if (debounceTimer !== null) clearTimeout(debounceTimer);
+  debounceTimer = setTimeout(() => {
+    debounceTimer = null;
+    void generateReviewExport(reviewId, repoRoot, true);
+  }, DEBOUNCE_MS);
+}
+
 // src/git/image.ts
 import { execSync as execSync4 } from "child_process";
 import { readFileSync as readFileSync5 } from "fs";
@@ -3227,27 +3238,10 @@ async function extractMetadata(data, filePath) {
       exif: null
     };
   }
-  const sharp = (await import("sharp")).default;
-  const meta = await sharp(data).metadata();
-  let exif = null;
-  if (meta.exif) {
-    try {
-      exif = {};
-      if (meta.orientation) exif["Orientation"] = String(meta.orientation);
-    } catch {
-    }
-  }
+  const parsed = parseImageHeaders(data, ext);
   return {
-    format: meta.format ?? ext.slice(1),
-    width: meta.width ?? null,
-    height: meta.height ?? null,
-    fileSize: data.length,
-    colorSpace: meta.space ?? null,
-    channels: meta.channels ?? null,
-    depth: meta.depth ?? null,
-    hasAlpha: meta.hasAlpha ?? null,
-    density: meta.density ?? null,
-    exif
+    ...parsed,
+    fileSize: data.length
   };
 }
 function formatMetadataLines(meta) {
@@ -3274,6 +3268,134 @@ function formatBytes(bytes) {
   if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
   return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
 }
+function parseImageHeaders(data, ext) {
+  try {
+    if (ext === ".png") return parsePng(data);
+    if (ext === ".jpg" || ext === ".jpeg") return parseJpeg(data);
+    if (ext === ".gif") return parseGif(data);
+    if (ext === ".webp") return parseWebp(data);
+  } catch {
+  }
+  return emptyMeta(ext.slice(1));
+}
+function emptyMeta(format) {
+  return { format, width: null, height: null, colorSpace: null, channels: null, depth: null, hasAlpha: null, density: null, exif: null };
+}
+function parsePng(data) {
+  if (data.length < 26) return emptyMeta("png");
+  const width = data.readUInt32BE(16);
+  const height = data.readUInt32BE(20);
+  const bitDepth = data[24];
+  const colorType = data[25];
+  let colorSpace = null;
+  let channels = null;
+  let hasAlpha = null;
+  switch (colorType) {
+    case 0:
+      colorSpace = "grayscale";
+      channels = 1;
+      hasAlpha = false;
+      break;
+    case 2:
+      colorSpace = "srgb";
+      channels = 3;
+      hasAlpha = false;
+      break;
+    case 3:
+      colorSpace = "indexed";
+      channels = 1;
+      hasAlpha = false;
+      break;
+    case 4:
+      colorSpace = "grayscale";
+      channels = 2;
+      hasAlpha = true;
+      break;
+    case 6:
+      colorSpace = "srgb";
+      channels = 4;
+      hasAlpha = true;
+      break;
+  }
+  const density = parsePngDensity(data);
+  return { format: "png", width, height, colorSpace, channels, depth: bitDepth ? String(bitDepth) : null, hasAlpha, density, exif: null };
+}
+function parsePngDensity(data) {
+  const marker = Buffer.from("pHYs");
+  const idx = data.indexOf(marker);
+  if (idx === -1 || idx + 13 > data.length) return null;
+  const unit = data[idx + 12];
+  if (unit !== 1) return null;
+  const ppuX = data.readUInt32BE(idx + 4);
+  return Math.round(ppuX / 39.3701);
+}
+function parseJpeg(data) {
+  let width = null;
+  let height = null;
+  let channels = null;
+  let depth = null;
+  let density = null;
+  let i = 2;
+  while (i < data.length - 1) {
+    if (data[i] !== 255) {
+      i++;
+      continue;
+    }
+    const marker = data[i + 1];
+    if (marker >= 192 && marker <= 195 || marker >= 197 && marker <= 199 || marker >= 201 && marker <= 203 || marker >= 205 && marker <= 207) {
+      if (i + 9 < data.length) {
+        depth = String(data[i + 4]);
+        height = data.readUInt16BE(i + 5);
+        width = data.readUInt16BE(i + 7);
+        channels = data[i + 9];
+      }
+      break;
+    }
+    if (marker === 224 && i + 14 < data.length) {
+      const units = data[i + 11];
+      const xDensity = data.readUInt16BE(i + 12);
+      if (units === 1) density = xDensity;
+      else if (units === 2) density = Math.round(xDensity * 2.54);
+    }
+    if (i + 3 < data.length) {
+      const len = data.readUInt16BE(i + 2);
+      i += 2 + len;
+    } else {
+      break;
+    }
+  }
+  const colorSpace = channels === 1 ? "grayscale" : channels === 3 ? "srgb" : null;
+  return { format: "jpeg", width, height, colorSpace, channels, depth, hasAlpha: false, density, exif: null };
+}
+function parseGif(data) {
+  if (data.length < 10) return emptyMeta("gif");
+  const width = data.readUInt16LE(6);
+  const height = data.readUInt16LE(8);
+  return { format: "gif", width, height, colorSpace: "indexed", channels: null, depth: null, hasAlpha: null, density: null, exif: null };
+}
+function parseWebp(data) {
+  if (data.length < 30) return emptyMeta("webp");
+  let width = null;
+  let height = null;
+  let hasAlpha = null;
+  const chunk = data.toString("ascii", 12, 16);
+  if (chunk === "VP8 " && data.length >= 30) {
+    width = data.readUInt16LE(26) & 16383;
+    height = data.readUInt16LE(28) & 16383;
+    hasAlpha = false;
+  } else if (chunk === "VP8L" && data.length >= 25) {
+    const bits = data.readUInt32LE(21);
+    width = (bits & 16383) + 1;
+    height = (bits >> 14 & 16383) + 1;
+    hasAlpha = (bits >> 28 & 1) === 1;
+  } else if (chunk === "VP8X" && data.length >= 30) {
+    const flags = data[20];
+    hasAlpha = (flags & 16) !== 0;
+    width = (data[24] | data[25] << 8 | data[26] << 16) + 1;
+    height = (data[27] | data[28] << 8 | data[29] << 16) + 1;
+  }
+  return { format: "webp", width, height, colorSpace: "srgb", channels: hasAlpha ? 4 : 3, depth: null, hasAlpha, density: null, exif: null };
+}
 
 // src/outline/parser.ts
 var BRACE_LANGS = /* @__PURE__ */ new Set([
@@ -3704,6 +3826,9 @@ apiRoutes.patch("/files/:fileId/status", async (c) => {
   await updateFileStatus(c.req.param("fileId"), status);
   return c.json({ ok: true });
 });
+function autoExport(c) {
+  scheduleAutoExport(c.get("reviewId"), c.get("repoRoot"));
+}
 apiRoutes.post("/annotations", async (c) => {
   const body = await c.req.json();
   const annotation = await addAnnotation(
@@ -3713,34 +3838,41 @@ apiRoutes.post("/annotations", async (c) => {
     body.category,
     body.content
   );
+  autoExport(c);
   return c.json(annotation, 201);
 });
 apiRoutes.patch("/annotations/:id", async (c) => {
   const { content, category } = await c.req.json();
   await updateAnnotation(c.req.param("id"), content, category);
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.delete("/annotations/:id", async (c) => {
   await deleteAnnotation(c.req.param("id"));
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.patch("/annotations/:id/move", async (c) => {
   const { lineNumber, side } = await c.req.json();
   await moveAnnotation(c.req.param("id"), lineNumber, side);
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.post("/annotations/:id/keep", async (c) => {
   await markAnnotationCurrent(c.req.param("id"));
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.post("/annotations/stale/delete-all", async (c) => {
   const reviewId = resolveReviewId(c);
   await deleteStaleAnnotations(reviewId);
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.post("/annotations/stale/keep-all", async (c) => {
   const reviewId = resolveReviewId(c);
   await keepAllStaleAnnotations(reviewId);
+  autoExport(c);
   return c.json({ ok: true });
 });
 apiRoutes.get("/annotations/all", async (c) => {
@@ -3955,16 +4087,14 @@ function ImageDiff({ file, diff }) {
           /* @__PURE__ */ jsx("div", { className: "slice-handle slice-handle-a" }),
           /* @__PURE__ */ jsx("div", { className: "slice-handle slice-handle-b" })
         ] }) }),
-        !hasComparison && /* @__PURE__ */ jsx("div", { className: "image-diff-single", children: [
-          /* @__PURE__ */ jsx(
-            "img",
-            {
-              src: `/api/image/${fileId}/${isAdded ? "new" : "old"}`,
-              alt: isAdded ? "New image" : "Deleted image"
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "image-diff-status", children: isAdded ? "New file" : "Deleted file" })
-        ] })
+        !hasComparison && /* @__PURE__ */ jsx("div", { className: "image-diff-panel image-diff-visual", "data-panel": "image", children: /* @__PURE__ */ jsx("div", { className: "image-visual-canvas", "data-zoomable": "true", children: /* @__PURE__ */ jsx("div", { className: "image-zoom-wrap", children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            className: "image-layer image-layer-old",
+            src: `/api/image/${fileId}/${isAdded ? "new" : "old"}`,
+            alt: isAdded ? "New image" : "Deleted image"
+          }
+        ) }) }) })
       ]
     }
   );
@@ -4526,55 +4656,58 @@ pageRoutes.get("/", async (c) => {
         /* @__PURE__ */ jsx("button", { id: "update-banner-dismiss", className: "btn btn-sm", children: "Later" })
       ] })
     ] }),
-    /* @__PURE__ */ jsx("aside", { className: "sidebar", children: [
-      /* @__PURE__ */ jsx("div", { className: "sidebar-header", children: [
-        /* @__PURE__ */ jsx("h2", { children: review.repo_name }),
-        /* @__PURE__ */ jsx("span", { className: "review-mode", children: [
-          review.mode,
-          review.mode_args !== null && review.mode_args !== "" ? `: ${review.mode_args}` : ""
+    /* @__PURE__ */ jsx("div", { className: "review-body", children: [
+      /* @__PURE__ */ jsx("aside", { className: "sidebar", children: [
+        /* @__PURE__ */ jsx("div", { className: "sidebar-header", children: [
+          /* @__PURE__ */ jsx("h2", { children: review.repo_name }),
+          /* @__PURE__ */ jsx("span", { className: "review-mode", children: [
+            review.mode,
+            review.mode_args !== null && review.mode_args !== "" ? `: ${review.mode_args}` : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "file-filter", children: /* @__PURE__ */ jsx("input", { type: "text", className: "file-filter-input", id: "file-filter", placeholder: "Filter files..." }) }),
+        /* @__PURE__ */ jsx(FileList, { files, annotationCounts, staleCounts: {} }),
+        /* @__PURE__ */ jsx("div", { className: "sidebar-footer", children: [
+          /* @__PURE__ */ jsx("button", { className: "btn btn-primary btn-complete", id: "complete-review", children: "Complete Review" }),
+          /* @__PURE__ */ jsx("a", { href: "/history", className: "btn btn-sm btn-link", children: "Review History" })
         ] })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: "file-filter", children: /* @__PURE__ */ jsx("input", { type: "text", className: "file-filter-input", id: "file-filter", placeholder: "Filter files..." }) }),
-      /* @__PURE__ */ jsx(FileList, { files, annotationCounts, staleCounts: {} }),
-      /* @__PURE__ */ jsx("div", { className: "sidebar-footer", children: [
-        /* @__PURE__ */ jsx("button", { className: "btn btn-primary btn-complete", id: "complete-review", children: "Complete Review" }),
-        /* @__PURE__ */ jsx("a", { href: "/history", className: "btn btn-sm btn-link", children: "Review History" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "sidebar-resize", id: "sidebar-resize" }),
-    /* @__PURE__ */ jsx("main", { className: "main-content", children: [
-      /* @__PURE__ */ jsx("div", { className: "welcome-message", children: [
-        /* @__PURE__ */ jsx("h3", { children: "Select a file to begin reviewing" }),
-        /* @__PURE__ */ jsx("p", { children: [
-          files.length,
-          " file(s) to review"
+      /* @__PURE__ */ jsx("div", { className: "sidebar-resize", id: "sidebar-resize" }),
+      /* @__PURE__ */ jsx("main", { className: "main-content", children: [
+        /* @__PURE__ */ jsx("div", { className: "welcome-message", children: [
+          /* @__PURE__ */ jsx("h3", { children: "Select a file to begin reviewing" }),
+          /* @__PURE__ */ jsx("p", { children: [
+            files.length,
+            " file(s) to review"
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "progress-summary", id: "progress-summary" })
         ] }),
-        /* @__PURE__ */ jsx("p", { className: "progress-summary", id: "progress-summary" })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: "diff-container", id: "diff-container", style: "display:none" }),
-      /* @__PURE__ */ jsx("div", { className: "diff-toolbar", id: "diff-toolbar", style: "display:none", children: [
-        /* @__PURE__ */ jsx("div", { className: "diff-toolbar-text", children: [
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: [
-            /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
-              /* @__PURE__ */ jsx("button", { className: "segment active", "data-diff-mode": "split", children: "Split" }),
-              /* @__PURE__ */ jsx("button", { className: "segment", "data-diff-mode": "unified", children: "Unified" })
+        /* @__PURE__ */ jsx("div", { className: "diff-container", id: "diff-container", style: "display:none" }),
+        /* @__PURE__ */ jsx("div", { className: "diff-toolbar", id: "diff-toolbar", style: "display:none", children: [
+          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-text", children: [
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: [
+              /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
+                /* @__PURE__ */ jsx("button", { className: "segment active", "data-diff-mode": "split", children: "Split" }),
+                /* @__PURE__ */ jsx("button", { className: "segment", "data-diff-mode": "unified", children: "Unified" })
+              ] }),
+              /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "wrap-toggle", children: "Wrap" }),
+              /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "whitespace-toggle", children: "Ignore Whitespace" })
             ] }),
-            /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "wrap-toggle", children: "Wrap" }),
-            /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "whitespace-toggle", children: "Ignore Whitespace" })
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "language-btn", children: "Plain Text" }) })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "language-btn", children: "Plain Text" }) })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "diff-toolbar-image", style: "display:none", children: [
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
-            /* @__PURE__ */ jsx("button", { className: "segment active", "data-image-mode": "metadata", children: "Metadata" }),
-            /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "difference", children: "Difference" }),
-            /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "slice", children: "Slice" })
-          ] }) }),
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: [
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: raw(zoomOutSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: raw(fitSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: raw(actualSizeSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: raw(zoomInSvg) })
+          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-image", style: "display:none", children: [
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
+              /* @__PURE__ */ jsx("button", { className: "segment active", "data-image-mode": "metadata", children: "Metadata" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "difference", children: "Difference" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "slice", children: "Slice" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "image", style: "display:none", children: "Image" })
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: [
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: raw(zoomOutSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: raw(fitSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: raw(actualSizeSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: raw(zoomInSvg) })
+            ] })
           ] })
         ] })
       ] })
@@ -4626,56 +4759,59 @@ pageRoutes.get("/review/:reviewId", async (c) => {
         /* @__PURE__ */ jsx("button", { id: "update-banner-dismiss", className: "btn btn-sm", children: "Later" })
       ] })
     ] }),
-    /* @__PURE__ */ jsx("aside", { className: "sidebar", children: [
-      /* @__PURE__ */ jsx("div", { className: "sidebar-header", children: [
-        /* @__PURE__ */ jsx("h2", { children: review.repo_name }),
-        /* @__PURE__ */ jsx("span", { className: "review-mode", children: [
-          review.mode,
-          review.mode_args !== null && review.mode_args !== "" ? `: ${review.mode_args}` : ""
+    /* @__PURE__ */ jsx("div", { className: "review-body", children: [
+      /* @__PURE__ */ jsx("aside", { className: "sidebar", children: [
+        /* @__PURE__ */ jsx("div", { className: "sidebar-header", children: [
+          /* @__PURE__ */ jsx("h2", { children: review.repo_name }),
+          /* @__PURE__ */ jsx("span", { className: "review-mode", children: [
+            review.mode,
+            review.mode_args !== null && review.mode_args !== "" ? `: ${review.mode_args}` : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "file-filter", children: /* @__PURE__ */ jsx("input", { type: "text", className: "file-filter-input", id: "file-filter", placeholder: "Filter files..." }) }),
+        /* @__PURE__ */ jsx(FileList, { files, annotationCounts, staleCounts: {} }),
+        /* @__PURE__ */ jsx("div", { className: "sidebar-footer", children: [
+          review.status === "completed" ? /* @__PURE__ */ jsx("button", { className: "btn btn-primary", id: "reopen-review", children: "Reopen Review" }) : /* @__PURE__ */ jsx("button", { className: "btn btn-primary btn-complete", id: "complete-review", children: "Complete Review" }),
+          /* @__PURE__ */ jsx("a", { href: "/history", className: "btn btn-sm btn-link", children: "Review History" }),
+          /* @__PURE__ */ jsx("a", { href: "/", className: "btn btn-sm btn-link", children: "Back to current review" })
         ] })
       ] }),
-      /* @__PURE__ */ jsx("div", { className: "file-filter", children: /* @__PURE__ */ jsx("input", { type: "text", className: "file-filter-input", id: "file-filter", placeholder: "Filter files..." }) }),
-      /* @__PURE__ */ jsx(FileList, { files, annotationCounts, staleCounts: {} }),
-      /* @__PURE__ */ jsx("div", { className: "sidebar-footer", children: [
-        review.status === "completed" ? /* @__PURE__ */ jsx("button", { className: "btn btn-primary", id: "reopen-review", children: "Reopen Review" }) : /* @__PURE__ */ jsx("button", { className: "btn btn-primary btn-complete", id: "complete-review", children: "Complete Review" }),
-        /* @__PURE__ */ jsx("a", { href: "/history", className: "btn btn-sm btn-link", children: "Review History" }),
-        /* @__PURE__ */ jsx("a", { href: "/", className: "btn btn-sm btn-link", children: "Back to current review" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "sidebar-resize", id: "sidebar-resize" }),
-    /* @__PURE__ */ jsx("main", { className: "main-content", children: [
-      /* @__PURE__ */ jsx("div", { className: "welcome-message", children: [
-        /* @__PURE__ */ jsx("h3", { children: "Select a file to begin reviewing" }),
-        /* @__PURE__ */ jsx("p", { children: [
-          files.length,
-          " file(s) to review"
+      /* @__PURE__ */ jsx("div", { className: "sidebar-resize", id: "sidebar-resize" }),
+      /* @__PURE__ */ jsx("main", { className: "main-content", children: [
+        /* @__PURE__ */ jsx("div", { className: "welcome-message", children: [
+          /* @__PURE__ */ jsx("h3", { children: "Select a file to begin reviewing" }),
+          /* @__PURE__ */ jsx("p", { children: [
+            files.length,
+            " file(s) to review"
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "progress-summary", id: "progress-summary" })
         ] }),
-        /* @__PURE__ */ jsx("p", { className: "progress-summary", id: "progress-summary" })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: "diff-container", id: "diff-container", style: "display:none" }),
-      /* @__PURE__ */ jsx("div", { className: "diff-toolbar", id: "diff-toolbar", style: "display:none", children: [
-        /* @__PURE__ */ jsx("div", { className: "diff-toolbar-text", children: [
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: [
-            /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
-              /* @__PURE__ */ jsx("button", { className: "segment active", "data-diff-mode": "split", children: "Split" }),
-              /* @__PURE__ */ jsx("button", { className: "segment", "data-diff-mode": "unified", children: "Unified" })
+        /* @__PURE__ */ jsx("div", { className: "diff-container", id: "diff-container", style: "display:none" }),
+        /* @__PURE__ */ jsx("div", { className: "diff-toolbar", id: "diff-toolbar", style: "display:none", children: [
+          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-text", children: [
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: [
+              /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
+                /* @__PURE__ */ jsx("button", { className: "segment active", "data-diff-mode": "split", children: "Split" }),
+                /* @__PURE__ */ jsx("button", { className: "segment", "data-diff-mode": "unified", children: "Unified" })
+              ] }),
+              /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "wrap-toggle", children: "Wrap" }),
+              /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "whitespace-toggle", children: "Ignore Whitespace" })
             ] }),
-            /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "wrap-toggle", children: "Wrap" }),
-            /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "whitespace-toggle", children: "Ignore Whitespace" })
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "language-btn", children: "Plain Text" }) })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: /* @__PURE__ */ jsx("button", { className: "toolbar-btn", id: "language-btn", children: "Plain Text" }) })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "diff-toolbar-image", style: "display:none", children: [
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
-            /* @__PURE__ */ jsx("button", { className: "segment active", "data-image-mode": "metadata", children: "Metadata" }),
-            /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "difference", children: "Difference" }),
-            /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "slice", children: "Slice" })
-          ] }) }),
-          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: [
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: raw(zoomOutSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: raw(fitSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: raw(actualSizeSvg) }),
-            /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: raw(zoomInSvg) })
+          /* @__PURE__ */ jsx("div", { className: "diff-toolbar-image", style: "display:none", children: [
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-left", children: /* @__PURE__ */ jsx("div", { className: "segmented-control", children: [
+              /* @__PURE__ */ jsx("button", { className: "segment active", "data-image-mode": "metadata", children: "Metadata" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "difference", children: "Difference" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "slice", children: "Slice" }),
+              /* @__PURE__ */ jsx("button", { className: "segment", "data-image-mode": "image", style: "display:none", children: "Image" })
+            ] }) }),
+            /* @__PURE__ */ jsx("div", { className: "diff-toolbar-right", children: [
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: raw(zoomOutSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: raw(fitSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: raw(actualSizeSvg) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: raw(zoomInSvg) })
+            ] })
           ] })
         ] })
       ] })
@@ -5129,7 +5265,7 @@ async function main() {
     console.log("AI service test mode enabled \u2014 using mock AI responses");
   }
   if (debug) {
-    console.log(`[debug] Build timestamp: ${"2026-03-16T07:44:26.425Z"}`);
+    console.log(`[debug] Build timestamp: ${"2026-03-16T09:50:09.819Z"}`);
   }
   if (projectDir) {
     process.chdir(projectDir);