glassbox 0.4.2 → 0.4.4

package/dist/cli.js

@@ -1403,9 +1403,9 @@ function createNewFileDiff(filePath, repoRoot) {
     isBinary: false
   };
 }
-function parseDiff(raw2) {
+function parseDiff(raw) {
   const files = [];
-  const fileChunks = raw2.split(/^diff --git /m).filter(Boolean);
+  const fileChunks = raw.split(/^diff --git /m).filter(Boolean);
   for (const chunk of fileChunks) {
     const headerEnd = chunk.indexOf("@@");
     const header = headerEnd === -1 ? chunk : chunk.slice(0, headerEnd);
@@ -1441,12 +1441,12 @@ function parseDiff(raw2) {
   }
   return files;
 }
-function parseHunks(raw2) {
+function parseHunks(raw) {
   const hunks = [];
   const hunkRegex = /^@@\s+-(\d+)(?:,(\d+))?\s+\+(\d+)(?:,(\d+))?\s+@@(.*)/gm;
   let match;
   const hunkStarts = [];
-  while ((match = hunkRegex.exec(raw2)) !== null) {
+  while ((match = hunkRegex.exec(raw)) !== null) {
     const groups = match;
     hunkStarts.push({
       index: match.index + match[0].length,
@@ -1458,8 +1458,8 @@ function parseHunks(raw2) {
   }
   for (let i = 0; i < hunkStarts.length; i++) {
     const start = hunkStarts[i];
-    const end = i + 1 < hunkStarts.length ? raw2.lastIndexOf("\n@@", hunkStarts[i + 1].index) : raw2.length;
-    const body = raw2.slice(start.index, end);
+    const end = i + 1 < hunkStarts.length ? raw.lastIndexOf("\n@@", hunkStarts[i + 1].index) : raw.length;
+    const body = raw.slice(start.index, end);
     const lines = [];
     let oldNum = start.oldStart;
     let newNum = start.newStart;
@@ -4175,24 +4175,7 @@ var SafeHtml = class {
     return this.__html;
   }
 };
-function raw(html) {
-  return new SafeHtml(html);
-}
-var VOID_TAGS = /* @__PURE__ */ new Set([
-  "area",
-  "base",
-  "br",
-  "col",
-  "embed",
-  "hr",
-  "img",
-  "input",
-  "link",
-  "meta",
-  "source",
-  "track",
-  "wbr"
-]);
+var VOID_TAGS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "source", "track", "wbr"]);
 function renderChildren(children) {
   if (children == null || typeof children === "boolean") return "";
   if (children instanceof SafeHtml) return children.__html;
@@ -4201,10 +4184,134 @@ function renderChildren(children) {
   if (Array.isArray(children)) return children.map(renderChildren).join("");
   return "";
 }
+var ATTR_ALIASES = {
+  // HTML attributes
+  className: "class",
+  htmlFor: "for",
+  httpEquiv: "http-equiv",
+  acceptCharset: "accept-charset",
+  accessKey: "accesskey",
+  autoCapitalize: "autocapitalize",
+  autoComplete: "autocomplete",
+  autoFocus: "autofocus",
+  autoPlay: "autoplay",
+  colSpan: "colspan",
+  contentEditable: "contenteditable",
+  crossOrigin: "crossorigin",
+  dateTime: "datetime",
+  defaultChecked: "checked",
+  defaultValue: "value",
+  encType: "enctype",
+  formAction: "formaction",
+  formEncType: "formenctype",
+  formMethod: "formmethod",
+  formNoValidate: "formnovalidate",
+  formTarget: "formtarget",
+  hrefLang: "hreflang",
+  inputMode: "inputmode",
+  maxLength: "maxlength",
+  minLength: "minlength",
+  noModule: "nomodule",
+  noValidate: "novalidate",
+  readOnly: "readonly",
+  referrerPolicy: "referrerpolicy",
+  rowSpan: "rowspan",
+  spellCheck: "spellcheck",
+  srcDoc: "srcdoc",
+  srcLang: "srclang",
+  srcSet: "srcset",
+  tabIndex: "tabindex",
+  useMap: "usemap",
+  // SVG presentation attributes (camelCase → kebab-case)
+  strokeWidth: "stroke-width",
+  strokeLinecap: "stroke-linecap",
+  strokeLinejoin: "stroke-linejoin",
+  strokeDasharray: "stroke-dasharray",
+  strokeDashoffset: "stroke-dashoffset",
+  strokeMiterlimit: "stroke-miterlimit",
+  strokeOpacity: "stroke-opacity",
+  fillOpacity: "fill-opacity",
+  fillRule: "fill-rule",
+  clipPath: "clip-path",
+  clipRule: "clip-rule",
+  colorInterpolation: "color-interpolation",
+  colorInterpolationFilters: "color-interpolation-filters",
+  floodColor: "flood-color",
+  floodOpacity: "flood-opacity",
+  lightingColor: "lighting-color",
+  stopColor: "stop-color",
+  stopOpacity: "stop-opacity",
+  shapeRendering: "shape-rendering",
+  imageRendering: "image-rendering",
+  textRendering: "text-rendering",
+  pointerEvents: "pointer-events",
+  vectorEffect: "vector-effect",
+  paintOrder: "paint-order",
+  // SVG text/font attributes
+  fontFamily: "font-family",
+  fontSize: "font-size",
+  fontStyle: "font-style",
+  fontVariant: "font-variant",
+  fontWeight: "font-weight",
+  fontStretch: "font-stretch",
+  textAnchor: "text-anchor",
+  textDecoration: "text-decoration",
+  dominantBaseline: "dominant-baseline",
+  alignmentBaseline: "alignment-baseline",
+  baselineShift: "baseline-shift",
+  letterSpacing: "letter-spacing",
+  wordSpacing: "word-spacing",
+  writingMode: "writing-mode",
+  glyphOrientationHorizontal: "glyph-orientation-horizontal",
+  glyphOrientationVertical: "glyph-orientation-vertical",
+  // SVG marker/gradient/filter attributes
+  markerStart: "marker-start",
+  markerMid: "marker-mid",
+  markerEnd: "marker-end",
+  gradientUnits: "gradientUnits",
+  gradientTransform: "gradientTransform",
+  spreadMethod: "spreadMethod",
+  patternUnits: "patternUnits",
+  patternContentUnits: "patternContentUnits",
+  patternTransform: "patternTransform",
+  maskUnits: "maskUnits",
+  maskContentUnits: "maskContentUnits",
+  filterUnits: "filterUnits",
+  primitiveUnits: "primitiveUnits",
+  clipPathUnits: "clipPathUnits",
+  // SVG xlink (legacy but still used)
+  xlinkHref: "xlink:href",
+  xlinkShow: "xlink:show",
+  xlinkActuate: "xlink:actuate",
+  xlinkType: "xlink:type",
+  xlinkRole: "xlink:role",
+  xlinkTitle: "xlink:title",
+  xlinkArcrole: "xlink:arcrole",
+  xmlBase: "xml:base",
+  xmlLang: "xml:lang",
+  xmlSpace: "xml:space",
+  xmlns: "xmlns",
+  xmlnsXlink: "xmlns:xlink",
+  // SVG filter primitive attributes
+  stdDeviation: "stdDeviation",
+  baseFrequency: "baseFrequency",
+  numOctaves: "numOctaves",
+  kernelMatrix: "kernelMatrix",
+  surfaceScale: "surfaceScale",
+  specularConstant: "specularConstant",
+  specularExponent: "specularExponent",
+  diffuseConstant: "diffuseConstant",
+  pointsAtX: "pointsAtX",
+  pointsAtY: "pointsAtY",
+  pointsAtZ: "pointsAtZ",
+  limitingConeAngle: "limitingConeAngle",
+  tableValues: "tableValues"
+  // viewBox, preserveAspectRatio stay as-is (already correct casing)
+};
 function renderAttr(key, value) {
+  const name = ATTR_ALIASES[key] ?? key;
   if (value == null || value === false) return "";
-  if (value === true) return ` ${key}`;
-  const name = key === "className" ? "class" : key === "htmlFor" ? "for" : key;
+  if (value === true) return ` ${name}`;
   let strValue;
   if (value instanceof SafeHtml) {
     strValue = value.__html;
@@ -4225,6 +4332,126 @@ function jsx(tag, props) {
   const childStr = children != null ? renderChildren(children) : "";
   return new SafeHtml(`<${tag}${attrStr}>${childStr}</${tag}>`);
 }
+function Fragment({ children }) {
+  return new SafeHtml(children != null ? renderChildren(children) : "");
+}
+
+// src/icons.tsx
+var S14 = { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" };
+var S12 = { ...S14, width: "12", height: "12" };
+var S16 = { ...S14, width: "16", height: "16" };
+function IconEdit() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: [
+    /* @__PURE__ */ jsx("path", { d: "M17 3a2.85 2.85 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" }),
+    /* @__PURE__ */ jsx("path", { d: "m15 5 4 4" })
+  ] });
+}
+function IconTrash() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ jsx("path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" }),
+    /* @__PURE__ */ jsx("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
+    /* @__PURE__ */ jsx("line", { x1: "14", y1: "11", x2: "14", y2: "17" })
+  ] });
+}
+function IconTrash16() {
+  return /* @__PURE__ */ jsx("svg", { ...S16, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ jsx("path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" }),
+    /* @__PURE__ */ jsx("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
+    /* @__PURE__ */ jsx("line", { x1: "14", y1: "11", x2: "14", y2: "17" })
+  ] });
+}
+function IconReveal() {
+  return /* @__PURE__ */ jsx("svg", { ...S12, children: [
+    /* @__PURE__ */ jsx("path", { d: "M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" }),
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "11", x2: "12", y2: "17" }),
+    /* @__PURE__ */ jsx("polyline", { points: "9 14 12 11 15 14" })
+  ] });
+}
+function IconZoomOut() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: /* @__PURE__ */ jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" }) });
+}
+function IconZoomIn() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: [
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
+    /* @__PURE__ */ jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
+  ] });
+}
+function IconFit() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: [
+    /* @__PURE__ */ jsx("path", { d: "M15 3h6v6" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 21H3v-6" }),
+    /* @__PURE__ */ jsx("path", { d: "M21 3l-7 7" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 21l7-7" })
+  ] });
+}
+function IconActualSize() {
+  return /* @__PURE__ */ jsx("svg", { ...S14, children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+    /* @__PURE__ */ jsx("text", { x: "12", y: "15.5", textAnchor: "middle", fontSize: "9", fontWeight: "bold", fill: "currentColor", stroke: "none", children: "1:1" })
+  ] });
+}
+
+// src/utils/charDiff.ts
+function charDiff(oldStr, newStr) {
+  if (!oldStr && !newStr) return null;
+  if (oldStr === newStr) return null;
+  const lcs = lcsTable(oldStr, newStr);
+  const lcsLen = lcs[oldStr.length][newStr.length];
+  const maxLen = Math.max(oldStr.length, newStr.length);
+  if (maxLen === 0) return null;
+  if (lcsLen / maxLen < 0.2) return null;
+  const oldCommon = /* @__PURE__ */ new Set();
+  const newCommon = /* @__PURE__ */ new Set();
+  let i = oldStr.length, j = newStr.length;
+  while (i > 0 && j > 0) {
+    if (oldStr[i - 1] === newStr[j - 1]) {
+      oldCommon.add(i - 1);
+      newCommon.add(j - 1);
+      i--;
+      j--;
+    } else if (lcs[i - 1][j] > lcs[i][j - 1]) {
+      i--;
+    } else {
+      j--;
+    }
+  }
+  return {
+    oldSegments: buildSegments(oldStr, oldCommon),
+    newSegments: buildSegments(newStr, newCommon)
+  };
+}
+function lcsTable(a, b) {
+  const m = a.length, n = b.length;
+  const dp = Array.from({ length: m + 1 }, () => new Array(n + 1).fill(0));
+  for (let i = 1; i <= m; i++) {
+    for (let j = 1; j <= n; j++) {
+      dp[i][j] = a[i - 1] === b[j - 1] ? dp[i - 1][j - 1] + 1 : Math.max(dp[i - 1][j], dp[i][j - 1]);
+    }
+  }
+  return dp;
+}
+function buildSegments(str, commonPositions) {
+  const segments = [];
+  let current = "";
+  let currentChanged = false;
+  for (let i = 0; i < str.length; i++) {
+    const changed = !commonPositions.has(i);
+    if (changed !== currentChanged && current.length > 0) {
+      segments.push({ text: current, changed: currentChanged });
+      current = "";
+    }
+    currentChanged = changed;
+    current += str[i];
+  }
+  if (current.length > 0) {
+    segments.push({ text: current, changed: currentChanged });
+  }
+  return segments;
+}
 
 // src/components/imageDiff.tsx
 function ImageDiff({ file, diff, fontWarning, baseWidth, baseHeight }) {
@@ -4274,7 +4501,6 @@ function ImageDiff({ file, diff, fontWarning, baseWidth, baseHeight }) {
 }
 
 // src/components/diffView.tsx
-var revealSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/><line x1="12" y1="11" x2="12" y2="17"/><polyline points="9 14 12 11 15 14"/></svg>';
 function DiffView({ file, diff, annotations, mode }) {
   const annotationsByLine = {};
   for (const a of annotations) {
@@ -4293,7 +4519,7 @@ function DiffView({ file, diff, annotations, mode }) {
         /* @__PURE__ */ jsx("div", { className: "diff-header", children: [
           /* @__PURE__ */ jsx("div", { className: "diff-header-file", children: [
             /* @__PURE__ */ jsx("span", { className: "file-path", children: diff.filePath }),
-            /* @__PURE__ */ jsx("button", { className: "reveal-btn", "data-file-id": file.id, title: "Reveal in file manager", children: raw(revealSvg) })
+            /* @__PURE__ */ jsx("button", { className: "reveal-btn", "data-file-id": file.id, title: "Reveal in file manager", children: /* @__PURE__ */ jsx(IconReveal, {}) })
           ] }),
           /* @__PURE__ */ jsx("div", { className: "diff-header-actions", children: /* @__PURE__ */ jsx("span", { className: `file-status ${diff.status}`, children: diff.status }) })
         ] }),
@@ -4354,7 +4580,7 @@ function SplitDiff({ hunks, annotationsByLine }) {
               "data-new-line": group.pair.left?.newNum ?? group.pair.right?.newNum ?? "",
               children: [
                 /* @__PURE__ */ jsx("span", { className: "gutter", "data-line-number": group.pair.left?.oldNum ?? "" }),
-                /* @__PURE__ */ jsx("span", { className: "code", children: group.pair.left ? raw(escapeHtml(group.pair.left.content)) : "" })
+                /* @__PURE__ */ jsx("span", { className: "code", children: renderPairContent(group.pair, "left") })
               ]
             }
           ),
@@ -4366,7 +4592,7 @@ function SplitDiff({ hunks, annotationsByLine }) {
               "data-side": "new",
               children: [
                 /* @__PURE__ */ jsx("span", { className: "gutter", "data-line-number": group.pair.right?.newNum ?? "" }),
-                /* @__PURE__ */ jsx("span", { className: "code", children: group.pair.right ? raw(escapeHtml(group.pair.right.content)) : "" })
+                /* @__PURE__ */ jsx("span", { className: "code", children: renderPairContent(group.pair, "right") })
               ]
             }
           )
@@ -4416,7 +4642,7 @@ function SplitDiff({ hunks, annotationsByLine }) {
             "data-new-line": pair.left?.newNum ?? pair.right?.newNum ?? "",
             children: [
               /* @__PURE__ */ jsx("span", { className: "gutter", "data-line-number": pair.left?.oldNum ?? "" }),
-              /* @__PURE__ */ jsx("span", { className: "code", children: pair.left ? raw(escapeHtml(pair.left.content)) : "" })
+              /* @__PURE__ */ jsx("span", { className: "code", children: renderPairContent(pair, "left") })
             ]
           }
         );
@@ -4461,7 +4687,7 @@ function SplitDiff({ hunks, annotationsByLine }) {
             "data-side": "new",
             children: [
               /* @__PURE__ */ jsx("span", { className: "gutter", "data-line-number": pair.right?.newNum ?? "" }),
-              /* @__PURE__ */ jsx("span", { className: "code", children: pair.right ? raw(escapeHtml(pair.right.content)) : "" })
+              /* @__PURE__ */ jsx("span", { className: "code", children: renderPairContent(pair, "right") })
             ]
           }
         );
@@ -4469,6 +4695,20 @@ function SplitDiff({ hunks, annotationsByLine }) {
     ] });
   }) });
 }
+function renderSegments(segments) {
+  return /* @__PURE__ */ jsx(Fragment, { children: segments.map((s) => s.changed ? /* @__PURE__ */ jsx("span", { className: "char-change", children: s.text }) : /* @__PURE__ */ jsx(Fragment, { children: s.text })) });
+}
+function renderPairContent(pair, side) {
+  const line = side === "left" ? pair.left : pair.right;
+  if (!line) return "";
+  if (pair.left && pair.right && pair.left.type === "remove" && pair.right.type === "add") {
+    const diff = charDiff(pair.left.content, pair.right.content);
+    if (diff) {
+      return renderSegments(side === "left" ? diff.oldSegments : diff.newSegments);
+    }
+  }
+  return line.content;
+}
 function pairLines(lines) {
   const pairs = [];
   let i = 0;
@@ -4502,55 +4742,88 @@ function pairLines(lines) {
   }
   return pairs;
 }
+function buildUnifiedCharDiffs(lines) {
+  const result = /* @__PURE__ */ new Map();
+  let i = 0;
+  while (i < lines.length) {
+    if (lines[i].type === "remove") {
+      const removes = [];
+      while (i < lines.length && lines[i].type === "remove") {
+        removes.push(lines[i]);
+        i++;
+      }
+      const adds = [];
+      while (i < lines.length && lines[i].type === "add") {
+        adds.push(lines[i]);
+        i++;
+      }
+      const pairCount = Math.min(removes.length, adds.length);
+      for (let j = 0; j < pairCount; j++) {
+        const diff = charDiff(removes[j].content, adds[j].content);
+        if (diff) {
+          result.set(removes[j], diff.oldSegments);
+          result.set(adds[j], diff.newSegments);
+        }
+      }
+    } else {
+      i++;
+    }
+  }
+  return result;
+}
 function UnifiedDiff({ hunks, annotationsByLine }) {
   const lastHunk = hunks[hunks.length - 1];
   const tailStart = lastHunk ? lastHunk.newStart + lastHunk.newCount : 1;
   return /* @__PURE__ */ jsx("div", { className: "diff-table-unified", children: [
-    hunks.map((hunk, hunkIdx) => /* @__PURE__ */ jsx("div", { className: "hunk-block", children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "hunk-separator",
-          "data-hunk-idx": hunkIdx,
-          "data-old-start": hunk.oldStart,
-          "data-old-count": hunk.oldCount,
-          "data-new-start": hunk.newStart,
-          "data-new-count": hunk.newCount,
-          children: [
-            "@@ -",
-            hunk.oldStart,
-            ",",
-            hunk.oldCount,
-            " +",
-            hunk.newStart,
-            ",",
-            hunk.newCount,
-            " @@"
-          ]
-        }
-      ),
-      hunk.lines.map((line) => {
-        const lineNum = line.type === "remove" ? line.oldNum : line.newNum;
-        const side = line.type === "remove" ? "old" : "new";
-        const anns = annotationsByLine[`${lineNum}:${side}`] ?? [];
-        return /* @__PURE__ */ jsx("div", { children: [
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: `diff-line ${line.type}${anns.length ? " has-annotation" : ""}`,
-              "data-line": lineNum,
-              "data-side": side,
-              children: [
-                /* @__PURE__ */ jsx("span", { className: "gutter-old", "data-line-number": line.oldNum ?? "" }),
-                /* @__PURE__ */ jsx("span", { className: "gutter-new", "data-line-number": line.newNum ?? "" }),
-                /* @__PURE__ */ jsx("span", { className: "code", children: raw(escapeHtml(line.content)) })
-              ]
-            }
-          ),
-          anns.length > 0 ? /* @__PURE__ */ jsx(AnnotationRows, { annotations: anns }) : null
-        ] });
-      })
-    ] })),
+    hunks.map((hunk, hunkIdx) => {
+      const charDiffs = buildUnifiedCharDiffs(hunk.lines);
+      return /* @__PURE__ */ jsx("div", { className: "hunk-block", children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "hunk-separator",
+            "data-hunk-idx": hunkIdx,
+            "data-old-start": hunk.oldStart,
+            "data-old-count": hunk.oldCount,
+            "data-new-start": hunk.newStart,
+            "data-new-count": hunk.newCount,
+            children: [
+              "@@ -",
+              hunk.oldStart,
+              ",",
+              hunk.oldCount,
+              " +",
+              hunk.newStart,
+              ",",
+              hunk.newCount,
+              " @@"
+            ]
+          }
+        ),
+        hunk.lines.map((line) => {
+          const lineNum = line.type === "remove" ? line.oldNum : line.newNum;
+          const side = line.type === "remove" ? "old" : "new";
+          const anns = annotationsByLine[`${lineNum}:${side}`] ?? [];
+          const segments = charDiffs.get(line);
+          return /* @__PURE__ */ jsx("div", { children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `diff-line ${line.type}${anns.length ? " has-annotation" : ""}`,
+                "data-line": lineNum,
+                "data-side": side,
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "gutter-old", "data-line-number": line.oldNum ?? "" }),
+                  /* @__PURE__ */ jsx("span", { className: "gutter-new", "data-line-number": line.newNum ?? "" }),
+                  /* @__PURE__ */ jsx("span", { className: "code", children: segments ? renderSegments(segments) : line.content })
+                ]
+              }
+            ),
+            anns.length > 0 ? /* @__PURE__ */ jsx(AnnotationRows, { annotations: anns }) : null
+          ] });
+        })
+      ] });
+    }),
     /* @__PURE__ */ jsx("div", { className: "hunk-separator hunk-expander-tail", "data-start": tailStart, children: "\u2195 Show remaining lines" })
   ] });
 }
@@ -4567,8 +4840,8 @@ function AnnotationRows({ annotations }) {
         /* @__PURE__ */ jsx("span", { className: "annotation-text", children: a.content }),
         /* @__PURE__ */ jsx("div", { className: "annotation-actions", children: [
           a.is_stale ? /* @__PURE__ */ jsx("button", { className: "btn btn-xs btn-keep", "data-action": "keep", children: "Keep" }) : null,
-          /* @__PURE__ */ jsx("button", { className: "btn btn-xs btn-icon", "data-action": "edit", title: "Edit", children: raw('<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.85 2.85 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/><path d="m15 5 4 4"/></svg>') }),
-          /* @__PURE__ */ jsx("button", { className: "btn btn-xs btn-icon btn-danger", "data-action": "delete", title: "Delete", children: raw('<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" y1="11" x2="10" y2="17"/><line x1="14" y1="11" x2="14" y2="17"/></svg>') })
+          /* @__PURE__ */ jsx("button", { className: "btn btn-xs btn-icon", "data-action": "edit", title: "Edit", children: /* @__PURE__ */ jsx(IconEdit, {}) }),
+          /* @__PURE__ */ jsx("button", { className: "btn btn-xs btn-icon btn-danger", "data-action": "delete", title: "Delete", children: /* @__PURE__ */ jsx(IconTrash, {}) })
         ] })
       ]
     }
@@ -4678,7 +4951,6 @@ function Layout({ title, reviewId, children }) {
 function titleCase(s) {
   return s.replace(/[_-]/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
 }
-var trashIcon = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" y1="11" x2="10" y2="17"/><line x1="14" y1="11" x2="14" y2="17"/></svg>';
 function shortenArgs(args) {
   const shaPattern = /\b([0-9a-f]{7,40})\b/gi;
   const result = { hasLong: false };
@@ -4726,7 +4998,7 @@ function ReviewHistory({ reviews, currentReviewId }) {
             " | Created: ",
             r.created_at
           ] }),
-          !isCurrent ? /* @__PURE__ */ jsx("button", { className: "delete-review-btn", "data-delete-id": r.id, title: "Delete review", children: raw(trashIcon) }) : null
+          !isCurrent ? /* @__PURE__ */ jsx("button", { className: "delete-review-btn", "data-delete-id": r.id, title: "Delete review", children: /* @__PURE__ */ jsx(IconTrash16, {}) }) : null
         ] }) }),
         isCurrent && hasOtherReviews ? /* @__PURE__ */ jsx("div", { className: "bulk-actions", children: [
           /* @__PURE__ */ jsx("span", { children: "Bulk actions:" }),
@@ -4736,94 +5008,12 @@ function ReviewHistory({ reviews, currentReviewId }) {
       ] });
     }) }),
     /* @__PURE__ */ jsx("a", { href: "/", className: "btn btn-link", style: "margin-top:16px;display:inline-block", children: "Back to current review" }),
-    /* @__PURE__ */ jsx("script", { children: raw(getHistoryScript()) })
+    /* @__PURE__ */ jsx("script", { src: "/static/history.js" })
   ] });
 }
-function getHistoryScript() {
-  return `
-(function() {
-  function esc(s) {
-    var d = document.createElement('div');
-    d.textContent = s;
-    return d.innerHTML;
-  }
-
-  function updateBulkVisibility() {
-    var bulk = document.querySelector('.bulk-actions');
-    if (bulk && !document.querySelector('.delete-review-btn')) {
-      bulk.remove();
-    }
-  }
-
-  // Single review delete
-  document.querySelectorAll('.delete-review-btn').forEach(function(btn) {
-    btn.addEventListener('click', function(e) {
-      e.preventDefault();
-      e.stopPropagation();
-      var id = btn.dataset.deleteId;
-      showConfirm('Delete this review? This cannot be undone.', function() {
-        fetch('/api/review/' + encodeURIComponent(id), { method: 'DELETE' })
-          .then(function(r) { return r.json(); })
-          .then(function() {
-            btn.closest('.history-item-link').parentElement.remove();
-            updateBulkVisibility();
-          });
-      });
-    });
-  });
-
-  // Bulk delete completed
-  var delCompletedBtn = document.getElementById('delete-completed-btn');
-  if (delCompletedBtn) {
-    delCompletedBtn.addEventListener('click', function() {
-      showConfirm('Delete all completed reviews (except current)? This cannot be undone.', function() {
-        fetch('/api/reviews/delete-completed', { method: 'POST', headers: { 'Content-Type': 'application/json' } })
-          .then(function(r) { return r.json(); })
-          .then(function() { location.reload(); });
-      });
-    });
-  }
-
-  // Bulk delete all
-  var delAllBtn = document.getElementById('delete-all-btn');
-  if (delAllBtn) {
-    delAllBtn.addEventListener('click', function() {
-      showConfirm('Delete ALL reviews except the current one? This cannot be undone.', function() {
-        fetch('/api/reviews/delete-all', { method: 'POST', headers: { 'Content-Type': 'application/json' } })
-          .then(function(r) { return r.json(); })
-          .then(function() { location.reload(); });
-      });
-    });
-  }
-
-  function showConfirm(message, onConfirm) {
-    var overlay = document.createElement('div');
-    overlay.className = 'modal-overlay';
-    overlay.innerHTML =
-      '<div class="modal">' +
-        '<h3>Confirm</h3>' +
-        '<p>' + esc(message) + '</p>' +
-        '<div class="modal-actions">' +
-          '<button class="btn btn-sm modal-cancel">Cancel</button>' +
-          '<button class="btn btn-sm btn-danger modal-confirm">Delete</button>' +
-        '</div>' +
-      '</div>';
-    overlay.querySelector('.modal-cancel').addEventListener('click', function() { overlay.remove(); });
-    overlay.querySelector('.modal-confirm').addEventListener('click', function() { overlay.remove(); onConfirm(); });
-    overlay.addEventListener('click', function(e) { if (e.target === overlay) overlay.remove(); });
-    document.body.appendChild(overlay);
-  }
-})();
-`;
-}
 
 // src/routes/pages.tsx
 init_queries();
-var zoomOutSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/></svg>';
-var zoomInSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>';
-var actualSizeSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><text x="12" y="15.5" text-anchor="middle" font-size="9" font-weight="bold" fill="currentColor" stroke="none">1:1</text></svg>';
-var fitSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h6v6"/><path d="M9 21H3v-6"/><path d="M21 3l-7 7"/><path d="M3 21l7-7"/></svg>';
-var revealSvgIcon = '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/><line x1="12" y1="11" x2="12" y2="17"/><polyline points="9 14 12 11 15 14"/></svg>';
 var pageRoutes = new Hono3();
 pageRoutes.get("/", async (c) => {
   const reviewId = c.get("reviewId");
@@ -4894,10 +5084,10 @@ pageRoutes.get("/", async (c) => {
               /* @__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) })
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: /* @__PURE__ */ jsx(IconZoomOut, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: /* @__PURE__ */ jsx(IconFit, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: /* @__PURE__ */ jsx(IconActualSize, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: /* @__PURE__ */ jsx(IconZoomIn, {}) })
             ] })
           ] })
         ] })
@@ -4938,7 +5128,7 @@ pageRoutes.get("/file/:fileId", async (c) => {
       /* @__PURE__ */ jsx("div", { className: "diff-header", children: [
         /* @__PURE__ */ jsx("div", { className: "diff-header-file", children: [
           /* @__PURE__ */ jsx("span", { className: "file-path", children: diff.filePath }),
-          /* @__PURE__ */ jsx("button", { className: "reveal-btn", "data-file-id": file.id, title: "Reveal in file manager", children: raw(revealSvgIcon) })
+          /* @__PURE__ */ jsx("button", { className: "reveal-btn", "data-file-id": file.id, title: "Reveal in file manager", children: /* @__PURE__ */ jsx(IconReveal, {}) })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "diff-header-actions", children: /* @__PURE__ */ jsx("span", { className: `file-status ${diff.status}`, children: diff.status }) })
       ] }),
@@ -5045,10 +5235,10 @@ pageRoutes.get("/review/:reviewId", async (c) => {
               /* @__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) })
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "out", title: "Zoom out", children: /* @__PURE__ */ jsx(IconZoomOut, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "fit", title: "Fit to view", children: /* @__PURE__ */ jsx(IconFit, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "actual", title: "Actual size (1:1)", children: /* @__PURE__ */ jsx(IconActualSize, {}) }),
+              /* @__PURE__ */ jsx("button", { className: "image-zoom-btn", "data-zoom-action": "in", title: "Zoom in", children: /* @__PURE__ */ jsx(IconZoomIn, {}) })
             ] })
           ] })
         ] })
@@ -5099,6 +5289,10 @@ async function startServer(port, reviewId, repoRoot, options) {
     const js = readFileSync8(join7(distDir, "app.global.js"), "utf-8");
     return c.text(js, 200, { "Content-Type": "application/javascript", "Cache-Control": "no-cache" });
   });
+  app.get("/static/history.js", (c) => {
+    const js = readFileSync8(join7(distDir, "history.global.js"), "utf-8");
+    return c.text(js, 200, { "Content-Type": "application/javascript", "Cache-Control": "no-cache" });
+  });
   app.route("/api", apiRoutes);
   app.route("/api/ai", aiApiRoutes);
   app.route("/", pageRoutes);
@@ -5503,7 +5697,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-20T01:33:08.659Z"}`);
+    console.log(`[debug] Build timestamp: ${"2026-03-21T23:17:12.455Z"}`);
   }
   if (projectDir) {
     process.chdir(projectDir);