@astryxdesign/lab 0.7.6-canary.fda92ac → 0.7.7-canary.0d1ddcd

package/dist/DiffViewer/DiffViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DiffViewer.d.ts","sourceRoot":"","sources":["../../src/DiffViewer/DiffViewer.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAQL,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,GAAG,EAET,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAGL,KAAK,YAAY,EAGlB,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,iCAAiC,CAAC;AAsBzC,OAAO,KAAK,EACV,cAAc,EAGd,iBAAiB,EAElB,MAAM,aAAa,CAAC;AAGrB,uEAAuE;AACvE,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,OAAO,CAAC;AAErD;;;;GAIG;AACH,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpE;;;GAGG;AACH,MAAM,MAAM,yBAAyB,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;AAEjE,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B;;;OAGG;IACH,IAAI,EAAE,cAAc,CAAC;IACrB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IAC5C;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,CAAC,GAAG,EAAE,iBAAiB,KAAK,SAAS,CAAC;IAC7D;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAClB,GAAG,EAAE,iBAAiB,EACtB,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KACjC,IAAI,CAAC;IACV,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AA++BD;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,EACzB,GAAG,EACH,IAAI,EACJ,QAAoB,EACpB,QAAQ,EAAE,YAAY,EACtB,aAAa,EACb,cAAqB,EACrB,SAAiB,EACjB,eAA2B,EAC3B,eAAwB,EACxB,mBAA0B,EAC1B,aAAoB,EACpB,WAAW,EAAE,eAAe,EAC5B,kBAA0B,EAC1B,iBAAiB,EACjB,SAAS,EACT,oBAAoB,EACpB,iBAAiB,EACjB,SAAS,EACT,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,eAAe,+BA0uBjB;yBAlwBe,UAAU"}
+{"version":3,"file":"DiffViewer.d.ts","sourceRoot":"","sources":["../../src/DiffViewer/DiffViewer.tsx"],"names":[],"mappings":"AAwCA,OAAO,EAQL,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,GAAG,EAET,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAGL,KAAK,YAAY,EAGlB,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,iCAAiC,CAAC;AAsBzC,OAAO,KAAK,EACV,cAAc,EAGd,iBAAiB,EAElB,MAAM,aAAa,CAAC;AAGrB,uEAAuE;AACvE,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,OAAO,CAAC;AAErD;;;;GAIG;AACH,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpE;;;GAGG;AACH,MAAM,MAAM,yBAAyB,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;AAEjE,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B;;;OAGG;IACH,IAAI,EAAE,cAAc,CAAC;IACrB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IAC5C;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,CAAC,GAAG,EAAE,iBAAiB,KAAK,SAAS,CAAC;IAC7D;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAClB,GAAG,EAAE,iBAAiB,EACtB,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KACjC,IAAI,CAAC;IACV,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAw/BD;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,EACzB,GAAG,EACH,IAAI,EACJ,QAAoB,EACpB,QAAQ,EAAE,YAAY,EACtB,aAAa,EACb,cAAqB,EACrB,SAAiB,EACjB,eAA2B,EAC3B,eAAwB,EACxB,mBAA0B,EAC1B,aAAoB,EACpB,WAAW,EAAE,eAAe,EAC5B,kBAA0B,EAC1B,iBAAiB,EACjB,SAAS,EACT,oBAAoB,EACpB,iBAAiB,EACjB,SAAS,EACT,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,eAAe,+BA6yBjB;yBAr0Be,UAAU"}

package/dist/DiffViewer/DiffViewer.js

@@ -12,8 +12,9 @@
  *
  * Renders one DiffViewerFile: a file header (path, status, +/- counts, a
  * caller slot, optional disclosure) over its hunks in unified or split view.
- * A hunk marked `isReplacedBlock` shows a labeled fold in place of its
- * changed lines until the reader opens it.
+ * A hunk marked `isReplacedBlock`, and a file with more than
+ * MAX_UNFOLDED_CHANGED_LINES other changed lines, show a labeled fold until
+ * the reader opens it.
  * Unified view is one table. Split view is two side-by-side panes (each an
  * ARIA table) whose rows share one grid's row tracks through `subgrid`, so a
  * row is as tall as its taller side while each pane scrolls sideways on its
@@ -148,30 +149,6 @@ function lineAnnotation(renderLineAnnotation, ref) {
   const note = renderLineAnnotation(ref);
   return isRenderable(note) ? note : null;
 }
-
-/**
- * Replaced blocks with an annotation on one of their changed lines. Such a
- * block starts open, so a review comment is never hidden behind the fold.
- */
-function findAnnotatedBlocks(file, renderLineAnnotation) {
-  const blocks = new Set();
-  if (renderLineAnnotation == null) {
-    return blocks;
-  }
-  file.hunks.forEach((hunk, hunkIndex) => {
-    if (hunk.isReplacedBlock !== true) {
-      return;
-    }
-    const isAnnotated = hunk.lines.some(line => {
-      const ref = line.kind === 'context' ? null : lineRef(line, hunkIndex);
-      return ref != null && lineAnnotation(renderLineAnnotation, ref) != null;
-    });
-    if (isAnnotated) {
-      blocks.add(hunkIndex);
-    }
-  });
-  return blocks;
-}
 function lineRef(line, hunkIndex) {
   if (line.kind === 'removed') {
     return line.oldLineNumber == null ? null : {
@@ -218,6 +195,39 @@ function addInlineEmphasis(cells, granularity) {
   }
 }
 
+/**
+ * Most changed lines a file shows before the reader asks for them. Rows are
+ * not virtualized, and each row costs render time. A file with more changed
+ * lines starts folded. Lines in replaced blocks do not count, because those
+ * blocks fold on their own.
+ */
+const MAX_UNFOLDED_CHANGED_LINES = 2000;
+
+/**
+ * Hunks with an annotation on one of their lines. A fold that would hide such
+ * a line starts open, so a review comment is never hidden.
+ */
+function findAnnotatedHunks(file, renderLineAnnotation) {
+  const hunks = new Set();
+  if (renderLineAnnotation == null) {
+    return hunks;
+  }
+  file.hunks.forEach((hunk, hunkIndex) => {
+    const isAnnotated = hunk.lines.some(line => {
+      // A replaced block's fold keeps its context lines in view.
+      if (hunk.isReplacedBlock === true && line.kind === 'context') {
+        return false;
+      }
+      const ref = lineRef(line, hunkIndex);
+      return ref != null && lineAnnotation(renderLineAnnotation, ref) != null;
+    });
+    if (isAnnotated) {
+      hunks.add(hunkIndex);
+    }
+  });
+  return hunks;
+}
+
 /**
  * Tokenize a run of hunk lines with its old and new side each as continuous
  * text, so constructs that span lines (block comments, template strings) keep
@@ -890,13 +900,36 @@ export function DiffViewer({
     }
     onCollapsedChange?.(next);
   };
+  let unfoldedChangedLines = 0;
+  let hasReplacedBlock = false;
+  for (const hunk of file.hunks) {
+    if (hunk.isReplacedBlock === true) {
+      hasReplacedBlock = true;
+      continue;
+    }
+    for (const line of hunk.lines) {
+      if (line.kind !== 'context') {
+        unfoldedChangedLines++;
+      }
+    }
+  }
+  const isLargeFile = unfoldedChangedLines > MAX_UNFOLDED_CHANGED_LINES;
+  const annotatedHunks = isLargeFile || hasReplacedBlock ? findAnnotatedHunks(file, renderLineAnnotation) : null;
 
-  // A replaced block starts folded unless one of its lines is annotated. The
-  // reader's toggles are kept per file; a new file starts over.
+  // A large file and a replaced block start folded unless a line they would
+  // hide is annotated. The reader's toggles are kept per file; a new file
+  // starts over.
+  const [fileToggle, setFileToggle] = useState(null);
+  const isFileFolded = isLargeFile && !(fileToggle?.file === file ? fileToggle.isExpanded : (annotatedHunks?.size ?? 0) > 0);
+  const toggleFile = () => {
+    setFileToggle({
+      file,
+      isExpanded: isFileFolded
+    });
+  };
   const [blockToggles, setBlockToggles] = useState(null);
   const toggles = blockToggles?.file === file ? blockToggles.isExpanded : null;
-  const annotatedBlocks = findAnnotatedBlocks(file, renderLineAnnotation);
-  const isBlockExpanded = hunkIndex => toggles?.get(hunkIndex) ?? annotatedBlocks.has(hunkIndex);
+  const isBlockExpanded = hunkIndex => toggles?.get(hunkIndex) ?? annotatedHunks?.has(hunkIndex) ?? false;
   const toggleBlock = hunkIndex => {
     const next = new Map(toggles);
     next.set(hunkIndex, !isBlockExpanded(hunkIndex));
@@ -909,9 +942,11 @@ export function DiffViewer({
   // cells are built again only when a block opens or closes.
   const expandedKey = file.hunks.flatMap((hunk, hunkIndex) => hunk.isReplacedBlock === true && isBlockExpanded(hunkIndex) ? [hunkIndex] : []).join(',');
   const expandedBlocks = useMemo(() => new Set(expandedKey === '' ? [] : expandedKey.split(',').map(Number)), [expandedKey]);
-  const cells = useMemo(() => buildCells(file, language, inlineHighlight, expandedBlocks), [file, language, inlineHighlight, expandedBlocks]);
-  const unifiedRows = useMemo(() => viewMode === 'unified' ? buildUnifiedRows(file, cells) : [], [viewMode, file, cells]);
-  const splitRows = useMemo(() => viewMode === 'split' ? buildSplitRows(file, cells) : [], [viewMode, file, cells]);
+
+  // A folded file builds no cells, so its lines are not tokenized.
+  const cells = useMemo(() => isFileFolded ? [] : buildCells(file, language, inlineHighlight, expandedBlocks), [isFileFolded, file, language, inlineHighlight, expandedBlocks]);
+  const unifiedRows = useMemo(() => viewMode === 'unified' && !isFileFolded ? buildUnifiedRows(file, cells) : [], [viewMode, isFileFolded, file, cells]);
+  const splitRows = useMemo(() => viewMode === 'split' && !isFileFolded ? buildSplitRows(file, cells) : [], [viewMode, isFileFolded, file, cells]);
   let addedCount = 0;
   let removedCount = 0;
   let maxLineNumber = 1;
@@ -1020,7 +1055,7 @@ export function DiffViewer({
       children: cell != null && buildSpans(cell.line.content, cell.tokens, cell.emphasis, [styles.change, kind === 'added' ? styles.changeAdded : styles.changeRemoved])
     }, key);
   };
-  const renderFold = fold => /*#__PURE__*/_jsxs("span", {
+  const renderFoldControl = (changedLines, isExpanded, onToggle, isSticky) => /*#__PURE__*/_jsxs("span", {
     ...{
       0: {
         className: "x3nfvp2 x6s0dn4 x1a02dak xjcht0a"
@@ -1028,19 +1063,20 @@ export function DiffViewer({
       1: {
         className: "x3nfvp2 x6s0dn4 x1a02dak xjcht0a x7wzq59 x1ybfrjj"
       }
-    }[!!isPinned << 0],
+    }[!!isSticky << 0],
     children: [/*#__PURE__*/_jsx("span", {
       children: t('@astryx.diffViewer.largeChange', {
-        count: fold.changedLines
+        count: changedLines
       })
     }), /*#__PURE__*/_jsx(Button, {
       size: "sm",
       variant: "secondary",
-      label: fold.isExpanded ? t('@astryx.diffViewer.hideFullDiff') : t('@astryx.diffViewer.showFullDiff'),
-      "aria-expanded": fold.isExpanded,
-      onClick: () => toggleBlock(fold.hunkIndex)
+      label: isExpanded ? t('@astryx.diffViewer.hideFullDiff') : t('@astryx.diffViewer.showFullDiff'),
+      "aria-expanded": isExpanded,
+      onClick: onToggle
     })]
   });
+  const renderFold = fold => renderFoldControl(fold.changedLines, fold.isExpanded, () => toggleBlock(fold.hunkIndex), isPinned);
   const renderHunkText = header => /*#__PURE__*/_jsx("span", {
     ...{
       0: {
@@ -1352,7 +1388,6 @@ export function DiffViewer({
       children: [renderSide('old'), renderSide('new')]
     });
   };
-  const table = viewMode === 'split' ? renderSplit() : renderUnified();
   let body;
   if (file.isBinary) {
     body = /*#__PURE__*/_jsx("div", {
@@ -1369,17 +1404,27 @@ export function DiffViewer({
       children: t('@astryx.diffViewer.noChanges')
     });
   } else {
-    body = /*#__PURE__*/_jsx("div", {
-      ...withoutInlineOverscroll(getViewportProps({
+    // The fold row stays first whether the file is folded or not, so its
+    // button keeps focus when it toggles.
+    body = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [isLargeFile && /*#__PURE__*/_jsx("div", {
+        "data-diff-fold": "",
         ...{
-          className: "xeuugli xzt5al7"
+          className: "xce4md1 xrrkdod x1yc453h x11ds9ch xv1l7n4 x9ynric x141an7d x1ltkj2j xszpfcc xykt701 xgtxpae"
         },
-        style: scrollStyle
-      })),
-      children: /*#__PURE__*/_jsx("div", {
-        ...getContentProps({}),
-        children: table
-      })
+        children: renderFoldControl(unfoldedChangedLines, !isFileFolded, toggleFile, false)
+      }), !isFileFolded && /*#__PURE__*/_jsx("div", {
+        ...withoutInlineOverscroll(getViewportProps({
+          ...{
+            className: "xeuugli xzt5al7"
+          },
+          style: scrollStyle
+        })),
+        children: /*#__PURE__*/_jsx("div", {
+          ...getContentProps({}),
+          children: viewMode === 'split' ? renderSplit() : renderUnified()
+        })
+      })]
     });
   }
 

package/dist/DiffViewer/createDiffFile.d.ts

@@ -6,11 +6,6 @@
  * @position Lab utility; computes a line diff (Myers) when the caller has two
  *   texts rather than a patch
  *
- * Shared leading and trailing lines are matched without a search. The minimal
- * search over the rest stops after MAX_EDIT_DISTANCE changed lines, so memory
- * stays bounded for any input; a middle that differs more than that becomes
- * one replaced block, marked with `isReplacedBlock` on its hunk.
- *
  * SYNC: When modified, update:
  * - /packages/lab/src/DiffViewer/createDiffFile.test.ts
  * - /packages/lab/src/DiffViewer/DiffViewer.doc.mjs (utilities section)

package/dist/DiffViewer/createDiffFile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createDiffFile.d.ts","sourceRoot":"","sources":["../../src/DiffViewer/createDiffFile.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAK,EACV,cAAc,EAIf,MAAM,aAAa,CAAC;AAErB,MAAM,WAAW,qBAAqB;IACpC,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,wBAAwB;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AA0JD;;;;;;;;;GASG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,OAAO,EAAE,aAAa,EACtB,OAAO,EAAE,aAAa,EACtB,YAAgB,GACjB,EAAE,qBAAqB,GAAG,cAAc,CA4GxC"}
+{"version":3,"file":"createDiffFile.d.ts","sourceRoot":"","sources":["../../src/DiffViewer/createDiffFile.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EACV,cAAc,EAIf,MAAM,aAAa,CAAC;AAErB,MAAM,WAAW,qBAAqB;IACpC,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,wBAAwB;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAqZD;;;;;;;;;GASG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,OAAO,EAAE,aAAa,EACtB,OAAO,EAAE,aAAa,EACtB,YAAgB,GACjB,EAAE,qBAAqB,GAAG,cAAc,CA4GxC"}

package/dist/DiffViewer/createDiffFile.js

@@ -8,11 +8,6 @@
  * @position Lab utility; computes a line diff (Myers) when the caller has two
  *   texts rather than a patch
  *
- * Shared leading and trailing lines are matched without a search. The minimal
- * search over the rest stops after MAX_EDIT_DISTANCE changed lines, so memory
- * stays bounded for any input; a middle that differs more than that becomes
- * one replaced block, marked with `isReplacedBlock` on its hunk.
- *
  * SYNC: When modified, update:
  * - /packages/lab/src/DiffViewer/createDiffFile.test.ts
  * - /packages/lab/src/DiffViewer/DiffViewer.doc.mjs (utilities section)
@@ -30,16 +25,33 @@ function splitLines(value) {
 }
 
 /**
- * Most changed lines the minimal search explores before giving up. The trace
- * it keeps grows with the square of this, so the cap bounds memory to a few
- * megabytes; past it the changed middle is shown as one replaced block.
+ * Most changed lines the search compares line by line; past it the changed
+ * middle is shown as one replaced block. The search keeps a few arrays the
+ * size of the input, so its memory does not grow with this limit.
+ */
+const MAX_EDIT_DISTANCE = 10_000;
+
+/**
+ * Most search work, counted as changed-middle lines times edits. The search
+ * time grows with both, so a long file gets a lower edit limit. A file of up
+ * to 50,000 lines keeps the full MAX_EDIT_DISTANCE.
  */
-const MAX_EDIT_DISTANCE = 2000;
+const MAX_SEARCH_WORK = 1_000_000_000;
+
+/**
+ * Most changed lines the traced search tries first. Most changes are small,
+ * and for them the traced search is faster than the linear-space one. Its
+ * trace grows with the square of the edits, so at this limit it stays near
+ * 4 MB.
+ */
+const TRACED_SEARCH_LIMIT = 1000;
 /**
  * Line edit script from `a` to `b`. Shared leading and trailing lines are
- * context without a search; the middle uses Myers' O(ND) shortest edit script,
- * or, when it needs more than MAX_EDIT_DISTANCE edits, removes the old middle
- * and adds the new one.
+ * context without a search. The middle uses a shortest edit script, or, when
+ * it needs more edits than the limit, removes the old middle and adds the new
+ * one. The limit is MAX_EDIT_DISTANCE, lowered for a long middle so the work
+ * stays under MAX_SEARCH_WORK. The traced search runs first; the linear-space
+ * search takes over when the change is larger than TRACED_SEARCH_LIMIT.
  */
 function diffLines(a, b) {
   let head = 0;
@@ -63,7 +75,8 @@ function diffLines(a, b) {
   // When one side of the middle is empty, adding or removing the other side
   // is already the minimal script.
   const isOneSided = tailA === head || tailB === head;
-  const middle = isOneSided ? null : myers(a, b, head, tailA, tailB);
+  const editLimit = Math.min(MAX_EDIT_DISTANCE, Math.floor(MAX_SEARCH_WORK / (tailA - head + (tailB - head))));
+  const middle = isOneSided ? null : tracedEditScript(a, b, head, tailA, tailB, Math.min(TRACED_SEARCH_LIMIT, editLimit)) ?? shortestEditScript(a, b, head, tailA, tailB, editLimit);
   if (middle != null) {
     // A loop, not a spread: one call argument per op overflows the stack on
     // long inputs.
@@ -98,11 +111,195 @@ function diffLines(a, b) {
 }
 
 /**
- * Myers' shortest edit script over `a[start, endA)` and `b[start, endB)`,
- * with absolute indexes in the ops; null when it needs more than
- * MAX_EDIT_DISTANCE edits.
+ * Shortest edit script over `a[start, endA)` and `b[start, endB)`, with
+ * absolute indexes in the ops; null when it needs more than `maxEdits` edits.
+ *
+ * This is Myers' O(ND) search in linear space. Each step searches forward
+ * from the start and backward from the end at the same time until the two
+ * searches meet. The meeting point is on a shortest path, so the step then
+ * solves the part before it and the part after it. Lines are compared as
+ * integer ids.
+ */
+function shortestEditScript(a, b, start, endA, endB, maxEdits) {
+  const ids = new Map();
+  const toIds = (lines, end) => {
+    const out = new Int32Array(end - start);
+    for (let i = start; i < end; i++) {
+      let id = ids.get(lines[i]);
+      if (id === undefined) {
+        id = ids.size;
+        ids.set(lines[i], id);
+      }
+      out[i - start] = id;
+    }
+    return out;
+  };
+  const oldIds = toIds(a, endA);
+  const newIds = toIds(b, endB);
+
+  // Each copy of a line that one side has more often than the other is an
+  // edit, so this count is a lower bound on the edits. When it is past the
+  // limit (a rewrite, for example), skip the search.
+  const surplus = new Int32Array(ids.size);
+  for (const id of oldIds) {
+    surplus[id]++;
+  }
+  for (const id of newIds) {
+    surplus[id]--;
+  }
+  let minEdits = 0;
+  for (const count of surplus) {
+    minEdits += Math.abs(count);
+  }
+  if (minEdits > maxEdits) {
+    return null;
+  }
+  // The furthest x each search reached on diagonal k (x - y), stored at
+  // index k + offset. The backward search counts x and y from the end.
+  const offset = oldIds.length + newIds.length + 1;
+  const forward = new Int32Array(2 * offset + 1);
+  const backward = new Int32Array(2 * offset + 1);
+  const ops = [];
+
+  // A point on a shortest path through the box, or null when the path needs
+  // more than `limit` edits.
+  const meetingPoint = (aLo, aHi, bLo, bHi, limit) => {
+    const n = aHi - aLo;
+    const m = bHi - bLo;
+    const delta = n - m;
+    const isOdd = (delta & 1) !== 0;
+    forward[offset + 1] = 0;
+    backward[offset + 1] = 0;
+    for (let d = 0; d <= Math.ceil((n + m) / 2); d++) {
+      // Forward step d can find a path of 2d - 1 edits, backward step d one
+      // of 2d edits.
+      if (2 * d - 1 > limit) {
+        return null;
+      }
+      for (let k = -d; k <= d; k += 2) {
+        let x = k === -d || k !== d && forward[offset + k - 1] < forward[offset + k + 1] ? forward[offset + k + 1] : forward[offset + k - 1] + 1;
+        let y = x - k;
+        while (x < n && y < m && oldIds[aLo + x] === newIds[bLo + y]) {
+          x++;
+          y++;
+        }
+        forward[offset + k] = x;
+        // The backward search has done d - 1 steps, so it holds diagonals
+        // -(d - 1)..d - 1, in its own coordinates.
+        const back = delta - k;
+        if (isOdd && x <= n && y <= m && back >= 1 - d && back <= d - 1 && x + backward[offset + back] >= n) {
+          return [aLo + x, bLo + y];
+        }
+      }
+      if (2 * d > limit) {
+        return null;
+      }
+      for (let k = -d; k <= d; k += 2) {
+        let x = k === -d || k !== d && backward[offset + k - 1] < backward[offset + k + 1] ? backward[offset + k + 1] : backward[offset + k - 1] + 1;
+        let y = x - k;
+        while (x < n && y < m && oldIds[aHi - 1 - x] === newIds[bHi - 1 - y]) {
+          x++;
+          y++;
+        }
+        backward[offset + k] = x;
+        const front = delta - k;
+        if (!isOdd && x <= n && y <= m && front >= -d && front <= d && x + forward[offset + front] >= n) {
+          const meetX = forward[offset + front];
+          return [aLo + meetX, bLo + meetX - front];
+        }
+      }
+    }
+    return null;
+  };
+
+  // Appends the script for the box to `ops`; false when the box needs more
+  // than `limit` edits. Only the outermost box sets a limit.
+  const solve = (aLo, aHi, bLo, bHi, limit) => {
+    while (aLo < aHi && bLo < bHi && oldIds[aLo] === newIds[bLo]) {
+      ops.push({
+        kind: 'context',
+        a: start + aLo,
+        b: start + bLo
+      });
+      aLo++;
+      bLo++;
+    }
+    let tail = 0;
+    while (aHi - tail > aLo && bHi - tail > bLo && oldIds[aHi - 1 - tail] === newIds[bHi - 1 - tail]) {
+      tail++;
+    }
+    const aEnd = aHi - tail;
+    const bEnd = bHi - tail;
+    if (aLo === aEnd || bLo === bEnd) {
+      if (aEnd - aLo + (bEnd - bLo) > limit) {
+        return false;
+      }
+      for (let i = aLo; i < aEnd; i++) {
+        ops.push({
+          kind: 'removed',
+          a: start + i
+        });
+      }
+      for (let j = bLo; j < bEnd; j++) {
+        ops.push({
+          kind: 'added',
+          b: start + j
+        });
+      }
+    } else {
+      const point = meetingPoint(aLo, aEnd, bLo, bEnd, limit);
+      if (point == null || !solve(aLo, point[0], bLo, point[1], Infinity) || !solve(point[0], aEnd, point[1], bEnd, Infinity)) {
+        return false;
+      }
+    }
+    for (let t = tail; t > 0; t--) {
+      ops.push({
+        kind: 'context',
+        a: start + aHi - t,
+        b: start + bHi - t
+      });
+    }
+    return true;
+  };
+  if (!solve(0, oldIds.length, 0, newIds.length, maxEdits)) {
+    return null;
+  }
+  return removalsFirst(ops);
+}
+
+/**
+ * Put the removals of each run of changes before its additions, so split view
+ * pairs each removed line with the added line that replaced it.
+ */
+function removalsFirst(ops) {
+  const sorted = [];
+  const added = [];
+  for (const op of ops) {
+    if (op.kind === 'added') {
+      added.push(op);
+      continue;
+    }
+    if (op.kind === 'context') {
+      for (const addedOp of added) {
+        sorted.push(addedOp);
+      }
+      added.length = 0;
+    }
+    sorted.push(op);
+  }
+  for (const addedOp of added) {
+    sorted.push(addedOp);
+  }
+  return sorted;
+}
+
+/**
+ * Myers' O(ND) shortest edit script over `a[start, endA)` and
+ * `b[start, endB)`, with absolute indexes in the ops; null when it needs more
+ * than `maxEdits` edits. It keeps every step's diagonals to trace the path
+ * back, so its memory grows with the square of the edits.
  */
-function myers(a, b, start, endA, endB) {
+function tracedEditScript(a, b, start, endA, endB, maxEdits) {
   const n = endA - start;
   const m = endB - start;
   const max = n + m;
@@ -111,7 +308,7 @@ function myers(a, b, start, endA, endB) {
   // trace[d] holds diagonals -d..d of v as it was before step d.
   const trace = [];
   outer: for (let d = 0; d <= max; d++) {
-    if (d > MAX_EDIT_DISTANCE) {
+    if (d > maxEdits) {
       return null;
     }
     trace.push(v.slice(offset - d, offset + d + 1));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astryxdesign/lab",
-  "version": "0.7.6-canary.fda92ac",
+  "version": "0.7.7-canary.0d1ddcd",
   "description": "Experimental Astryx components — published to npm only under the @canary dist-tag for early testing; never released as a stable (latest) version.",
   "author": "Meta Open Source",
   "license": "MIT",
@@ -49,7 +49,7 @@
   },
   "peerDependencies": {
     "@stylexjs/stylex": ">=0.10.0",
-    "@astryxdesign/core": "0.7.6-canary.fda92ac",
+    "@astryxdesign/core": "0.7.7-canary.0d1ddcd",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0"
   },
@@ -59,9 +59,9 @@
     "d3-shape": "^3.2.0"
   },
   "devDependencies": {
-    "@astryxdesign/a11y-spec": "0.7.6-canary.fda92ac",
-    "@astryxdesign/cli": "0.7.6-canary.fda92ac",
-    "@astryxdesign/interaction-harness": "0.7.6-canary.fda92ac",
+    "@astryxdesign/a11y-spec": "0.7.7-canary.0d1ddcd",
+    "@astryxdesign/cli": "0.7.7-canary.0d1ddcd",
+    "@astryxdesign/interaction-harness": "0.7.7-canary.0d1ddcd",
     "@babel/cli": "^7.29.7",
     "@babel/core": "^7.29.7",
     "@babel/preset-react": "^7.29.7",

package/src/DiffViewer/DiffViewer.doc.mjs

@@ -30,7 +30,7 @@ export const docs = {
 
   usage: {
     description:
-      'Read-only, syntax-highlighted diff of one file for code review surfaces. Renders a file header (path, Added/Deleted/Renamed token, +/− line counts, a headerEnd slot, and an optional disclosure) over the file\'s hunks in unified or split (side-by-side) view. Rows use the same syntax-theme diff slots as CodeBlock with isDiff, so one syntax theme styles both. renderLineAnnotation adds a full-width row under any line (for review comments) and onLineNumberClick turns line numbers into buttons. Build the file model with parseUnifiedDiff(patch), which returns one file per file in a git or diff -u patch, or with createDiffFile({oldValue, newValue}) when you hold two versions of a text. Display options cover how a change is marked (classic +/− glyphs, bars, or none), whether changed rows are tinted, and word- or character-level highlighting of what changed inside each removed/added line pair. Each changed line carries a visually hidden "Added"/"Removed" label, so the change reads without colour in every mode. Unwrapped, line numbers and change indicators stay pinned while the code scrolls; in split view each side is its own scroller, so the split stays fixed at half and half, the sides scroll sideways in lockstep, and a row is as tall as its taller side. While code overflows sideways, sideways overscroll is off, so trackpads neither bounce past a line nor swipe the browser back. In right-to-left pages the hunk area stays left-to-right, like a code editor: annotation content reads in the page direction, and annotation rows scroll with the code. When a change is too large to compare line by line, createDiffFile marks its hunk with isReplacedBlock: it lists every old line as removed and every new line as added. DiffViewer folds those lines behind a "Large change: N lines" row, where N counts the block\'s removed plus added lines, with a Show full diff button. A block opens by itself when one of its lines has an annotation, so no review comment is hidden. Rows are plain DOM with no virtualization: collapse or window very large files.',
+      'Read-only, syntax-highlighted diff of one file for code review surfaces. Renders a file header (path, Added/Deleted/Renamed token, +/− line counts, a headerEnd slot, and an optional disclosure) over the file\'s hunks in unified or split (side-by-side) view. Rows use the same syntax-theme diff slots as CodeBlock with isDiff, so one syntax theme styles both. renderLineAnnotation adds a full-width row under any line (for review comments) and onLineNumberClick turns line numbers into buttons. Build the file model with parseUnifiedDiff(patch), which returns one file per file in a git or diff -u patch, or with createDiffFile({oldValue, newValue}) when you hold two versions of a text. Display options cover how a change is marked (classic +/− glyphs, bars, or none), whether changed rows are tinted, and word- or character-level highlighting of what changed inside each removed/added line pair. Each changed line carries a visually hidden "Added"/"Removed" label, so the change reads without colour in every mode. Unwrapped, line numbers and change indicators stay pinned while the code scrolls; in split view each side is its own scroller, so the split stays fixed at half and half, the sides scroll sideways in lockstep, and a row is as tall as its taller side. While code overflows sideways, sideways overscroll is off, so trackpads neither bounce past a line nor swipe the browser back. In right-to-left pages the hunk area stays left-to-right, like a code editor: annotation content reads in the page direction, and annotation rows scroll with the code. When a change is too large to compare line by line, createDiffFile marks its hunk with isReplacedBlock: it lists every old line as removed and every new line as added. DiffViewer folds those lines behind a "Large change: N lines" row, where N counts the block\'s removed plus added lines, with a Show full diff button. A file with more than 2,000 other changed lines starts folded the same way, because every row costs render time. Its line diff is still there when the reader opens it. A fold opens by itself when a line it would hide has an annotation, so no review comment is hidden. Rows are plain DOM with no virtualization: collapse or window very large files.',
     bestPractices: [
       {
         guidance: true,

package/src/DiffViewer/DiffViewer.test.tsx

@@ -763,6 +763,80 @@ describe('DiffViewer', () => {
     });
   });
 
+  describe('large files', () => {
+    /** One hunk that adds `count` lines to an empty file. */
+    function addedFile(count: number): DiffViewerFile {
+      return {
+        oldPath: null,
+        newPath: 'generated.txt',
+        status: 'added',
+        isBinary: false,
+        hunks: [
+          {
+            header: `@@ -0,0 +1,${count} @@`,
+            oldStart: 0,
+            oldLines: 0,
+            newStart: 1,
+            newLines: count,
+            lines: Array.from({length: count}, (_, i) => ({
+              kind: 'added' as const,
+              content: `line ${i}`,
+              oldLineNumber: null,
+              newLineNumber: i + 1,
+            })),
+          },
+        ],
+      };
+    }
+
+    it('folds a file with more than 2,000 changed lines until the reader opens it', async () => {
+      const user = userEvent.setup();
+      const {container} = render(<DiffViewer file={addedFile(2001)} />);
+      expect(screen.getByText('Large change: 2,001 lines')).toBeTruthy();
+      expect(container.querySelector('table')).toBeNull();
+      // The header still counts every line.
+      expect(
+        screen.getByText('2,001 lines added, 0 lines removed'),
+      ).toBeTruthy();
+      const button = screen.getByRole('button', {name: 'Show full diff'});
+      button.focus();
+      await user.keyboard('{Enter}');
+      const hide = screen.getByRole('button', {name: 'Hide full diff'});
+      expect(hide.getAttribute('aria-expanded')).toBe('true');
+      expect(hide).toBe(document.activeElement);
+      expect(container.querySelectorAll('[data-diff="added"]')).toHaveLength(
+        2001,
+      );
+      await user.click(hide);
+      expect(container.querySelector('table')).toBeNull();
+    });
+
+    it('shows a file with 2,000 changed lines without a fold', () => {
+      const {container} = render(<DiffViewer file={addedFile(2000)} />);
+      expect(screen.queryByRole('button', {name: 'Show full diff'})).toBeNull();
+      expect(container.querySelectorAll('[data-diff="added"]')).toHaveLength(
+        2000,
+      );
+    });
+
+    it('opens a large file that has an annotated line', () => {
+      render(
+        <DiffViewer
+          file={addedFile(2001)}
+          renderLineAnnotation={ref =>
+            ref.lineNumber === 1500 ? <span>Generated?</span> : null
+          }
+        />,
+      );
+      expect(screen.getByText('Generated?')).toBeTruthy();
+      expect(
+        screen
+          .getByRole('button', {name: 'Hide full diff'})
+          .getAttribute('aria-expanded'),
+      ).toBe('true');
+    });
+  });
+
   it('shows a message for binary files', () => {
     const [binary] = parseUnifiedDiff(
       'diff --git a/x.png b/x.png\nBinary files a/x.png and b/x.png differ\n',