@astryxdesign/lab 0.7.6-canary.021bfb5 → 0.7.6-canary.032c4a1

package/dist/CodeEditor/CodeEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../src/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAkBlD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,8BAA8B,CAAC;AAuF5D,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,uBAAuB;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sFAAsF;IACtF,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,+BAA+B;IAC/B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,uBAAuB;IACvB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,EAAE,CAAC;IAC5D;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAsED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,QAAsB,EACtB,cAAsB,EACtB,UAAkB,EAClB,WAAW,EACX,SAAS,EACT,IAAW,EACX,SAAS,EAAE,eAAe,EAC1B,KAAK,EACL,UAAqE,EACrE,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAsVjB;yBAvWe,UAAU"}
+{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../src/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAkBlD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,8BAA8B,CAAC;AA2F5D,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,uBAAuB;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sFAAsF;IACtF,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,+BAA+B;IAC/B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,uBAAuB;IACvB,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,EAAE,CAAC;IAC5D;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAsED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,QAAQ,EACR,QAAsB,EACtB,cAAsB,EACtB,UAAkB,EAClB,WAAW,EACX,SAAS,EACT,IAAW,EACX,SAAS,EAAE,eAAe,EAC1B,KAAK,EACL,UAAqE,EACrE,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAsVjB;yBAvWe,UAAU"}

package/dist/CodeEditor/CodeEditor.js

@@ -35,6 +35,9 @@ const styles = {
     k1xSpc: "x78zum5",
     kaIpWk: "xh6dtrn",
     kWkggS: "xwmxj5m",
+    kMzoRj: "x1litavf",
+    ksu8eU: "x1y0btm7",
+    kVAM5u: "x14i3s5s",
     kVQacm: "xb3r6kr",
     $$css: true
   },
@@ -51,6 +54,9 @@ const styles = {
     k9WMMc: "xp4054r",
     kfSwDN: "x87ps6o",
     kMwMTN: "xnbbluu",
+    kWqL5O: "x1pcaw5z",
+    kSWEuD: "x32b0ac",
+    k26BEO: "xtgwc6q",
     $$css: true
   },
   editor: {

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

@@ -1 +1 @@
-{"version":3,"file":"DiffViewer.d.ts","sourceRoot":"","sources":["../../src/DiffViewer/DiffViewer.tsx"],"names":[],"mappings":"AAqCA,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;AAOtC,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,iCAAiC,CAAC;AAqBzC,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;AAq2BD;;;;;;;;;;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,+BAopBjB;yBA5qBe,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

@@ -4,7 +4,7 @@
  * @file DiffViewer.tsx
  * @input Uses React, StyleX, theme tokens, the shared CodeBlock tokenizer and
  *   syntax-theme slots (incl. the diff row slots), useScrollableArea,
- *   Token, Icon, VisuallyHidden, and the i18n translator
+ *   Token, Icon, Button, VisuallyHidden, and the i18n translator
  * @output Exports DiffViewer component, DiffViewerProps, DiffViewerViewMode,
  *   DiffViewerChangeIndicator, DiffViewerInlineHighlight
  * @position Lab implementation; read-only, syntax-highlighted file diff for
@@ -12,6 +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`, 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
@@ -39,12 +42,13 @@ import { Fragment, useId, useInsertionEffect, useMemo, useRef, useState } from '
 import * as stylex from '@stylexjs/stylex';
 import { ensureHighlightStyles, tokenize } from '@astryxdesign/core/CodeBlock';
 import { useScrollableArea } from '@astryxdesign/core/hooks';
+import { Button } from '@astryxdesign/core/Button';
 import { useTranslator } from '@astryxdesign/core/i18n';
 import { Icon } from '@astryxdesign/core/Icon';
 import { SyntaxTheme } from '@astryxdesign/core/theme/syntax';
 import '@astryxdesign/core/theme/tokens.stylex';
 import { borderVars, colorVars, durationVars, easeVars, fontWeightVars, radiusVars, spacingVars, typeScaleVars, typographyVars } from '@astryxdesign/core/theme/tokens.stylex';
-import { focusOutlineProps, mergeProps, rtlStyles, themeProps } from '@astryxdesign/core/utils';
+import { focusOutlineProps, isRenderable, mergeProps, rtlStyles, themeProps } from '@astryxdesign/core/utils';
 import { Token } from '@astryxdesign/core/Token';
 import { VisuallyHidden } from '@astryxdesign/core/VisuallyHidden';
 import { diffInlineRanges } from "./inlineDiff.js";
@@ -134,6 +138,17 @@ function inferLanguage(path, codeLanguages) {
 // Row model
 // ---------------------------------------------------------------------------
 
+/** The control that folds a replaced block's changed lines. */
+
+/**
+ * The caller's annotation for a line, or null when it renders nothing. An
+ * annotation row is drawn only for a note that renders, so
+ * `hasThread && <Thread />` adds no empty row.
+ */
+function lineAnnotation(renderLineAnnotation, ref) {
+  const note = renderLineAnnotation(ref);
+  return isRenderable(note) ? note : null;
+}
 function lineRef(line, hunkIndex) {
   if (line.kind === 'removed') {
     return line.oldLineNumber == null ? null : {
@@ -181,44 +196,129 @@ function addInlineEmphasis(cells, granularity) {
 }
 
 /**
- * Tokenize each hunk's old and new side as continuous text, so constructs
- * that span lines (block comments, template strings) keep their paint within
- * the hunk, then hand each line the tokens of the side it renders from.
+ * 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.
  */
-function buildCells(file, language, inlineHighlight) {
-  return file.hunks.map((hunk, hunkIndex) => {
-    const oldLines = hunk.lines.filter(line => line.kind !== 'added');
-    const newLines = hunk.lines.filter(line => line.kind !== 'removed');
-    const highlight = language !== 'plaintext';
-    const oldTokens = highlight ? tokenize(oldLines.map(line => line.content).join('\n'), language) : [];
-    const newTokens = highlight ? tokenize(newLines.map(line => line.content).join('\n'), language) : [];
-    let oldIndex = 0;
-    let newIndex = 0;
-    const cells = [];
-    for (const line of hunk.lines) {
-      let tokens;
-      if (line.kind === 'removed') {
-        tokens = oldTokens[oldIndex++] ?? [];
-      } else if (line.kind === 'added') {
-        tokens = newTokens[newIndex++] ?? [];
-      } else {
-        oldIndex++;
-        tokens = newTokens[newIndex++] ?? [];
+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);
-      if (ref != null) {
-        cells.push({
-          line,
-          ref,
-          tokens,
-          emphasis: []
-        });
+      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
+ * their paint within the run, and give each line the tokens of the side it
+ * renders from.
+ */
+function tokenizeRun(lines, language) {
+  if (language === 'plaintext') {
+    return lines.map(() => []);
+  }
+  const sideText = kind => lines.filter(line => line.kind !== kind).map(line => line.content).join('\n');
+  const oldTokens = tokenize(sideText('added'), language);
+  const newTokens = tokenize(sideText('removed'), language);
+  let oldIndex = 0;
+  let newIndex = 0;
+  return lines.map(line => {
+    if (line.kind === 'removed') {
+      return oldTokens[oldIndex++] ?? [];
+    }
+    if (line.kind === 'added') {
+      return newTokens[newIndex++] ?? [];
+    }
+    oldIndex++;
+    return newTokens[newIndex++] ?? [];
+  });
+}
+
+/**
+ * Build each hunk's line cells. A folded replaced block keeps only the
+ * context around it, and its changed lines are not tokenized.
+ */
+function buildCells(file, language, inlineHighlight, expandedBlocks) {
+  return file.hunks.map((hunk, hunkIndex) => {
+    const cells = [];
+    const addRun = lines => {
+      const tokens = tokenizeRun(lines, language);
+      lines.forEach((line, i) => {
+        const ref = lineRef(line, hunkIndex);
+        if (ref != null) {
+          cells.push({
+            line,
+            ref,
+            tokens: tokens[i],
+            emphasis: []
+          });
+        }
+      });
+    };
+    const changeStart = hunk.isReplacedBlock === true ? hunk.lines.findIndex(line => line.kind !== 'context') : -1;
+    if (changeStart === -1) {
+      addRun(hunk.lines);
+      if (inlineHighlight !== 'none') {
+        addInlineEmphasis(cells, inlineHighlight);
       }
+      return {
+        cells,
+        fold: null
+      };
     }
-    if (inlineHighlight !== 'none') {
-      addInlineEmphasis(cells, inlineHighlight);
+
+    // A replaced block's removed and added lines are not edits of each
+    // other, so they get no inline highlight.
+    const isExpanded = expandedBlocks.has(hunkIndex);
+    const changedLines = hunk.lines.filter(line => line.kind !== 'context').length;
+    if (isExpanded) {
+      addRun(hunk.lines);
+      const at = cells.findIndex(cell => cell.line.kind !== 'context');
+      return {
+        cells,
+        fold: {
+          hunkIndex,
+          at,
+          changedLines,
+          isExpanded
+        }
+      };
     }
-    return cells;
+    // Leading and trailing context are tokenized apart: the hidden lines
+    // between them can open or close a comment or a string.
+    addRun(hunk.lines.slice(0, changeStart));
+    const at = cells.length;
+    addRun(hunk.lines.slice(changeStart + changedLines));
+    return {
+      cells,
+      fold: {
+        hunkIndex,
+        at,
+        changedLines,
+        isExpanded
+      }
+    };
   });
 }
 function buildUnifiedRows(file, cells) {
@@ -229,13 +329,31 @@ function buildUnifiedRows(file, cells) {
       key: `h${h}`,
       header: hunk.header
     });
-    cells[h].forEach((cell, i) => {
+    const {
+      cells: hunkCells,
+      fold
+    } = cells[h];
+    hunkCells.forEach((cell, i) => {
+      if (fold != null && fold.at === i) {
+        rows.push({
+          type: 'fold',
+          key: `h${h}f`,
+          fold
+        });
+      }
       rows.push({
         type: 'line',
         key: `h${h}l${i}`,
         cell
       });
     });
+    if (fold != null && fold.at === hunkCells.length) {
+      rows.push({
+        type: 'fold',
+        key: `h${h}f`,
+        fold
+      });
+    }
   });
   return rows;
 }
@@ -252,9 +370,20 @@ function buildSplitRows(file, cells) {
       key: `h${h}`,
       header: hunk.header
     });
-    const hunkCells = cells[h];
+    const {
+      cells: hunkCells,
+      fold
+    } = cells[h];
     let i = 0;
     while (i < hunkCells.length) {
+      // The fold sits where a run of changes starts or ends, never inside one.
+      if (fold != null && fold.at === i) {
+        rows.push({
+          type: 'fold',
+          key: `h${h}f`,
+          fold
+        });
+      }
       const cell = hunkCells[i];
       if (cell.line.kind === 'context') {
         rows.push({
@@ -284,6 +413,13 @@ function buildSplitRows(file, cells) {
         });
       }
     }
+    if (fold != null && fold.at === hunkCells.length) {
+      rows.push({
+        type: 'fold',
+        key: `h${h}f`,
+        fold
+      });
+    }
   });
   return rows;
 }
@@ -764,9 +900,53 @@ export function DiffViewer({
     }
     onCollapsedChange?.(next);
   };
-  const cells = useMemo(() => buildCells(file, language, inlineHighlight), [file, language, inlineHighlight]);
-  const unifiedRows = useMemo(() => viewMode === 'unified' ? buildUnifiedRows(file, cells) : [], [viewMode, file, cells]);
-  const splitRows = useMemo(() => viewMode === 'split' ? buildSplitRows(file, cells) : [], [viewMode, file, cells]);
+  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 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 isBlockExpanded = hunkIndex => toggles?.get(hunkIndex) ?? annotatedHunks?.has(hunkIndex) ?? false;
+  const toggleBlock = hunkIndex => {
+    const next = new Map(toggles);
+    next.set(hunkIndex, !isBlockExpanded(hunkIndex));
+    setBlockToggles({
+      file,
+      isExpanded: next
+    });
+  };
+  // A key of the open blocks keeps the set stable across renders, so the
+  // 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]);
+
+  // 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;
@@ -875,6 +1055,28 @@ export function DiffViewer({
       children: cell != null && buildSpans(cell.line.content, cell.tokens, cell.emphasis, [styles.change, kind === 'added' ? styles.changeAdded : styles.changeRemoved])
     }, key);
   };
+  const renderFoldControl = (changedLines, isExpanded, onToggle, isSticky) => /*#__PURE__*/_jsxs("span", {
+    ...{
+      0: {
+        className: "x3nfvp2 x6s0dn4 x1a02dak xjcht0a"
+      },
+      1: {
+        className: "x3nfvp2 x6s0dn4 x1a02dak xjcht0a x7wzq59 x1ybfrjj"
+      }
+    }[!!isSticky << 0],
+    children: [/*#__PURE__*/_jsx("span", {
+      children: t('@astryx.diffViewer.largeChange', {
+        count: changedLines
+      })
+    }), /*#__PURE__*/_jsx(Button, {
+      size: "sm",
+      variant: "secondary",
+      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: {
@@ -886,16 +1088,7 @@ export function DiffViewer({
     }[!!isPinned << 0],
     children: header
   });
-
-  // `null`, `undefined` and booleans render nothing in React, so they draw no
-  // row either; that keeps `hasThread && <Thread />` from adding empty rows.
-  const annotationFor = cell => {
-    if (cell == null || renderLineAnnotation == null) {
-      return null;
-    }
-    const note = renderLineAnnotation(cell.ref);
-    return typeof note === 'boolean' ? null : note;
-  };
+  const annotationFor = cell => cell == null || renderLineAnnotation == null ? null : lineAnnotation(renderLineAnnotation, cell.ref);
 
   // Name every column so a screen reader moving across a row hears which
   // number is which (and, in split view, which side's code it is in).
@@ -955,6 +1148,17 @@ export function DiffViewer({
               })
             }, row.key);
           }
+          if (row.type === 'fold') {
+            return /*#__PURE__*/_jsx("tr", {
+              children: /*#__PURE__*/_jsx("td", {
+                colSpan: columns,
+                ...{
+                  className: "xce4md1 xrrkdod x1yc453h x11ds9ch xv1l7n4 x9ynric x141an7d x1ltkj2j xszpfcc xykt701 xgtxpae"
+                },
+                children: renderFold(row.fold)
+              })
+            }, row.key);
+          }
           const note = annotationFor(row.cell);
           return /*#__PURE__*/_jsxs(Fragment, {
             children: [/*#__PURE__*/_jsxs("tr", {
@@ -1021,7 +1225,7 @@ export function DiffViewer({
     };
   };
   const renderSplit = () => {
-    const items = splitRows.map(row => row.type === 'hunk' ? {
+    const items = splitRows.map(row => row.type !== 'pair' ? {
       row,
       oldNote: null,
       newNote: null
@@ -1033,7 +1237,7 @@ export function DiffViewer({
       newNote: annotationFor(row.new)
     });
     const hasSizer = !isWrapped;
-    const sizerText = hasSizer ? widestLine(cells.flatMap(hunkCells => hunkCells.map(cell => cell.line.content))) : '';
+    const sizerText = hasSizer ? widestLine(cells.flatMap(hunk => hunk.cells.map(cell => cell.line.content))) : '';
     const rowCount = 1 + (hasSizer ? 1 : 0) + items.reduce((count, item) => count + 1 + (item.oldNote != null || item.newNote != null ? 1 : 0), 0);
     const columns = `${hasLineNumbers ? `${gutter} ` : ''}${markerWidth} ${isWrapped ? 'minmax(0, 1fr)' : '1fr'}`;
     const markerPin = hasLineNumbers ? gutter : '0px';
@@ -1084,6 +1288,41 @@ export function DiffViewer({
           }, row.key));
           continue;
         }
+        if (row.type === 'fold') {
+          // Only the old side holds the control; the new side keeps its row
+          // as tall and gives its own table's readers the label.
+          rows.push(/*#__PURE__*/_jsx("div", {
+            role: "row",
+            ...{
+              className: "xrvj5dj x1osaytk x4w6khx"
+            },
+            children: /*#__PURE__*/_jsx("div", {
+              role: "cell",
+              ...{
+                0: {
+                  className: "xce4md1 xrrkdod x1yc453h x11ds9ch xv1l7n4 x9ynric x141an7d x1ltkj2j xszpfcc xykt701 xgtxpae x1osaytk"
+                },
+                1: {
+                  className: "xce4md1 xrrkdod x1yc453h x11ds9ch xv1l7n4 x9ynric x141an7d x1ltkj2j xszpfcc xykt701 xgtxpae x1osaytk x126k92a x1lldw8n xj0a0fe x5ujdhh"
+                }
+              }[!!isWrapped << 0],
+              children: isOld ? renderFold(row.fold) : /*#__PURE__*/_jsxs(_Fragment, {
+                children: [/*#__PURE__*/_jsx("span", {
+                  "aria-hidden": "true",
+                  ...{
+                    className: "xlshs6z"
+                  },
+                  children: renderFold(row.fold)
+                }), /*#__PURE__*/_jsx(VisuallyHidden, {
+                  children: t('@astryx.diffViewer.largeChange', {
+                    count: row.fold.changedLines
+                  })
+                })]
+              })
+            })
+          }, row.key));
+          continue;
+        }
         const cell = isOld ? row.old : row.new;
         rows.push(/*#__PURE__*/_jsxs("div", {
           role: "row"
@@ -1149,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", {
@@ -1166,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 is shown
- * as one replaced block rather than a minimal diff.
- *
  * 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;AAiJD;;;;;;;;;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,CA0GxC"}
+{"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"}