@neuronection/assistant-ui 0.19.0 → 0.21.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @neuronection/assistant-ui
 
+## 0.21.0
+
+### Minor Changes
+
+- [`ead8dd8`](https://github.com/neuronection/assistant-ui/commit/ead8dd8297e1fe5b090fc1f92dead8d573a975c4) Thanks [@constLiakos](https://github.com/constLiakos)! - SettingsShell nav items accept an optional `trailing` node rendered at the
+  row's trailing edge — for status dots, counts or badges next to the label.
+
+## 0.20.0
+
+### Minor Changes
+
+- [`e973c82`](https://github.com/neuronection/assistant-ui/commit/e973c8242355efe8cf6748615d8638211274bc8f) Thanks [@constLiakos](https://github.com/constLiakos)! - New tier-2 "transport-injected hooks" modules: `dictation` (`useDictation` state machine + `DictationButton` + `DictationStrip` — the app injects `transcribe(blob)`, the library owns recording/timer/level/cancel UI) and `ai-text-transform` (`useAiTextTransform` — streaming transform state machine with delta coalescing, poll fallback, hard timeout and terminal-event guard; the app injects start/subscribe/cancel/poll closures). No fetching inside the library — ADR-006 holds.
+
+- [`c00baa9`](https://github.com/neuronection/assistant-ui/commit/c00baa97d3c6446e624bd8b9da30af2eb3fbf743) Thanks [@constLiakos](https://github.com/constLiakos)! - New `rich-text-editor` module: controlled tiptap-based markdown editor with a configurable toolbar (groups + `toolbarExtra` app slot), label/icon props with English defaults, caret-preserving external sync, and a markdown round-trip contract. Adds `@tiptap/react`, `@tiptap/starter-kit`, `@tiptap/pm` and `tiptap-markdown` as dependencies.
+
+- [`5d965d8`](https://github.com/neuronection/assistant-ui/commit/5d965d8425fe46f93da2ab24b52e36593fdbf965) Thanks [@constLiakos](https://github.com/constLiakos)! - New `text-diff-view` module: gitlens-style side-by-side diff view (line-level LCS diff with word-level intra-line highlighting, per-side line numbers, prev/next change navigation with active-block tint, expandable/re-collapsible unchanged-line folds, virtualized rows) plus exported `computeLineDiff` / `wordSegments` engine. Adds `@tanstack/react-virtual` as a dependency. Labels are props/callbacks with English defaults.
+
 ## 0.19.0
 
 ### Minor Changes

package/README.md

@@ -76,6 +76,9 @@ Visual reference: [gallery](https://neuronection.github.io/assistant-ui/).
 | [`tooltip`](./docs/components/tooltip.md) | `Tooltip` + parts, `InfoTooltip` | [stories](https://neuronection.github.io/assistant-ui/?story=overlay--tooltips) |
 | [`wizard`](./docs/components/wizard.md) | `Wizard` (steps config + `renderStep`, per-step validation gates, modal/drawer variants), `Stepper` (dots/labels) | [stories](https://neuronection.github.io/assistant-ui/?story=wizard--modal-wizard) |
 | [`input`](./docs/components/input.md) / [`textarea`](./docs/components/textarea.md) / [`search-input`](./docs/components/search-input.md) / [`expandable-search`](./docs/components/expandable-search.md) | `Input` (label/hint/error wiring) · `Textarea` · `SearchInput` · `ExpandableSearch` | [stories](https://neuronection.github.io/assistant-ui/?story=misc--inputs) |
+| [`rich-text-editor`](./docs/components/rich-text-editor.md) | `RichTextEditor` — controlled tiptap markdown editor: configurable toolbar groups + `toolbarExtra` slot, label/icon props, caret-preserving external sync | [stories](https://neuronection.github.io/assistant-ui/?story=rich-text-editor--default) |
+| [`dictation`](./docs/components/dictation.md) / [`ai-text-transform`](./docs/components/ai-text-transform.md) | `useDictation` + `DictationButton`/`DictationStrip` (transport-injected STT) · `useAiTextTransform` (streaming transform state machine) | [stories](https://neuronection.github.io/assistant-ui/?story=dictation--dictation) |
+| [`text-diff-view`](./docs/components/text-diff-view.md) | `TextDiffView` — side-by-side diff with word-level highlights, line numbers, change navigation, folds, virtualization (+ exported `computeLineDiff`/`wordSegments`) | [stories](https://neuronection.github.io/assistant-ui/?story=text-diff-view--default) |
 | [`chip-input`](./docs/components/chip-input.md) / [`chip-list`](./docs/components/chip-list.md) | `ChipInput` (Enter/comma commit, paste-splits, Backspace-removes) · `ChipList` (variant pills, clickable, removable) | [stories](https://neuronection.github.io/assistant-ui/?story=phase2--chip-editing) |
 | [`time-picker`](./docs/components/time-picker.md) / [`time-list`](./docs/components/time-list.md) | `TimePicker` (clock face, 24h value, 12h UI, editable fields) · `TimeList` (time chips with per-chip pickers) | [stories](https://neuronection.github.io/assistant-ui/?story=time-pickers--time-picker-story) |
 | [`date-picker`](./docs/components/date-picker.md) | `DatePicker` (popover calendar: days/months/years views, min/max, `allowClear`, arrow-key day grid, `unstyled` variant) | [stories](https://neuronection.github.io/assistant-ui/?story=phase2--date-pickers) |

package/dist/ai-text-transform.d.ts

@@ -0,0 +1,44 @@
+type AiTextTransformStatus = 'idle' | 'running' | 'done' | 'error' | 'cancelled';
+interface AiTextTransformEventHandlers {
+    onDelta: (text: string) => void;
+    onDone: (result: string) => void;
+    onError: (message: string) => void;
+}
+interface AiTextTransformTransport {
+    /** Begin the job and resolve with its handle (e.g. a job id). */
+    start: () => Promise<string>;
+    /** Subscribe to a job's events; returns an unsubscribe function. */
+    subscribe: (jobId: string, handlers: AiTextTransformEventHandlers) => () => void;
+    cancel?: (jobId: string) => Promise<void>;
+    /** Optional status fallback when events may be missed. */
+    poll?: (jobId: string) => Promise<{
+        status: 'running' | 'done' | 'error' | 'cancelled';
+        result?: string;
+        error?: string;
+    }>;
+}
+interface UseAiTextTransformOptions {
+    transport: AiTextTransformTransport;
+    /** Status-fallback interval when `poll` is provided. Default 800 ms. */
+    pollIntervalMs?: number;
+    /** Hard timeout for a running job. Default 90 000 ms. */
+    timeoutMs?: number;
+    /** Streaming delta coalescing window. Default 50 ms. */
+    flushMs?: number;
+}
+/**
+ * Streaming text-transform state machine (idle → running → done/error/
+ * cancelled). Transport-injected: the app provides start/subscribe/cancel/
+ * poll closures over its own gateway; this hook owns status transitions,
+ * delta coalescing, the poll fallback and the hard timeout.
+ */
+declare function useAiTextTransform(options: UseAiTextTransformOptions): {
+    status: AiTextTransformStatus;
+    result: string;
+    error: string | null;
+    start: () => Promise<void>;
+    stop: () => Promise<void>;
+    reset: () => void;
+};
+
+export { type AiTextTransformEventHandlers, type AiTextTransformStatus, type AiTextTransformTransport, type UseAiTextTransformOptions, useAiTextTransform };

package/dist/ai-text-transform.js

@@ -0,0 +1,3 @@
+export { useAiTextTransform } from './chunk-BKAO7BTU.js';
+//# sourceMappingURL=ai-text-transform.js.map
+//# sourceMappingURL=ai-text-transform.js.map

package/dist/ai-text-transform.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"ai-text-transform.js"}

package/dist/chunk-2PR6POP6.js

@@ -0,0 +1,543 @@
+import { cn } from './chunk-BLJWR4ZV.js';
+import * as React from 'react';
+import { useState, useMemo, useEffect } from 'react';
+import { useVirtualizer } from '@tanstack/react-virtual';
+import { Minus, ChevronUp, ChevronDown, Plus, ChevronRight } from 'lucide-react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/components/text-diff-view/lineDiff.ts
+var MAX_LCS_CELLS = 4e6;
+var MAX_WORD_CELLS = 4e4;
+function at(list, index) {
+  const value = list[index];
+  if (value === void 0) {
+    throw new Error(`lineDiff: index ${index} out of bounds`);
+  }
+  return value;
+}
+function atNum(list, index) {
+  const value = list[index];
+  if (value === void 0) {
+    throw new Error(`lineDiff: index ${index} out of bounds`);
+  }
+  return value;
+}
+function splitLines(text) {
+  if (text === "") {
+    return [];
+  }
+  return text.replace(/\r\n?/g, "\n").split("\n");
+}
+function diffOps(a, b, maxCells = MAX_LCS_CELLS) {
+  const n = a.length;
+  const m = b.length;
+  const ops = [];
+  if (n * m > maxCells) {
+    for (const text of a) {
+      ops.push({ type: "del", text });
+    }
+    for (const text of b) {
+      ops.push({ type: "add", text });
+    }
+    return ops;
+  }
+  const width = m + 1;
+  const lcs = new Int32Array((n + 1) * width);
+  for (let i2 = n - 1; i2 >= 0; i2 -= 1) {
+    for (let j2 = m - 1; j2 >= 0; j2 -= 1) {
+      lcs[i2 * width + j2] = at(a, i2) === at(b, j2) ? atNum(lcs, (i2 + 1) * width + j2 + 1) + 1 : Math.max(atNum(lcs, (i2 + 1) * width + j2), atNum(lcs, i2 * width + j2 + 1));
+    }
+  }
+  let i = 0;
+  let j = 0;
+  while (i < n && j < m) {
+    if (at(a, i) === at(b, j)) {
+      ops.push({ type: "equal", text: at(a, i) });
+      i += 1;
+      j += 1;
+    } else if (atNum(lcs, (i + 1) * width + j) >= atNum(lcs, i * width + j + 1)) {
+      ops.push({ type: "del", text: at(a, i) });
+      i += 1;
+    } else {
+      ops.push({ type: "add", text: at(b, j) });
+      j += 1;
+    }
+  }
+  while (i < n) {
+    ops.push({ type: "del", text: at(a, i) });
+    i += 1;
+  }
+  while (j < m) {
+    ops.push({ type: "add", text: at(b, j) });
+    j += 1;
+  }
+  return ops;
+}
+function tokenize(text) {
+  return text.match(/\S+|\s+/g) ?? [];
+}
+function isMeaningful(token) {
+  return /\S/.test(token);
+}
+function mergeSegments(segments) {
+  const merged = [];
+  for (const segment of segments) {
+    const last = merged[merged.length - 1];
+    if (last !== void 0 && last.changed === segment.changed) {
+      last.text += segment.text;
+    } else {
+      merged.push({ ...segment });
+    }
+  }
+  return merged;
+}
+function wordSegments(original, suggested) {
+  const a = tokenize(original);
+  const b = tokenize(suggested);
+  const ops = diffOps(a, b, MAX_WORD_CELLS);
+  const left = [];
+  const right = [];
+  for (const op of ops) {
+    if (op.type === "equal") {
+      left.push({ text: op.text, changed: false });
+      right.push({ text: op.text, changed: false });
+    } else if (op.type === "del") {
+      left.push({ text: op.text, changed: isMeaningful(op.text) });
+    } else {
+      right.push({ text: op.text, changed: isMeaningful(op.text) });
+    }
+  }
+  return { left: mergeSegments(left), right: mergeSegments(right) };
+}
+function pairRows(ops) {
+  const rows = [];
+  let index = 0;
+  while (index < ops.length) {
+    const op = at(ops, index);
+    if (op.type === "equal") {
+      rows.push({
+        kind: "pair",
+        left: { kind: "context", text: op.text },
+        right: { kind: "context", text: op.text }
+      });
+      index += 1;
+      continue;
+    }
+    const dels = [];
+    const adds = [];
+    while (index < ops.length && at(ops, index).type !== "equal") {
+      const current = at(ops, index);
+      if (current.type === "del") {
+        dels.push(current.text);
+      } else {
+        adds.push(current.text);
+      }
+      index += 1;
+    }
+    const pairCount = Math.max(dels.length, adds.length);
+    for (let k = 0; k < pairCount; k += 1) {
+      const leftText = k < dels.length ? at(dels, k) : null;
+      const rightText = k < adds.length ? at(adds, k) : null;
+      const leftCell = leftText !== null ? { kind: "del", text: leftText } : null;
+      const rightCell = rightText !== null ? { kind: "add", text: rightText } : null;
+      if (leftCell !== null && rightCell !== null && leftText !== null && rightText !== null && leftText !== rightText) {
+        const words = wordSegments(leftText, rightText);
+        leftCell.segments = words.left;
+        rightCell.segments = words.right;
+      }
+      rows.push({ kind: "pair", left: leftCell, right: rightCell });
+    }
+  }
+  return rows;
+}
+function numberRows(rows) {
+  let leftNo = 0;
+  let rightNo = 0;
+  for (const row of rows) {
+    if (row.kind !== "pair") {
+      continue;
+    }
+    if (row.left !== null) {
+      leftNo += 1;
+      row.left.no = leftNo;
+    }
+    if (row.right !== null) {
+      rightNo += 1;
+      row.right.no = rightNo;
+    }
+  }
+}
+function foldRows(rows, contextLines) {
+  const hasChange = rows.some((row) => {
+    if (row.kind !== "pair") {
+      return false;
+    }
+    return row.left?.kind !== "context" || row.right?.kind !== "context";
+  });
+  if (!hasChange || contextLines < 0) {
+    return rows;
+  }
+  const runs = [];
+  let start = -1;
+  for (let index2 = 0; index2 <= rows.length; index2 += 1) {
+    const row = rows[index2];
+    const isContext = index2 < rows.length && row !== void 0 && row.kind === "pair" && row.left?.kind === "context" && row.right?.kind === "context";
+    if (isContext) {
+      if (start === -1) {
+        start = index2;
+      }
+    } else if (start !== -1) {
+      runs.push({ start, end: index2 });
+      start = -1;
+    }
+  }
+  const hiddenAt = /* @__PURE__ */ new Map();
+  for (const run of runs) {
+    const length = run.end - run.start;
+    const isFirstRun = run.start === 0;
+    const isLastRun = run.end === rows.length;
+    const keepBefore = isFirstRun ? 0 : contextLines;
+    const keepAfter = isLastRun ? 0 : contextLines;
+    const foldCount = length - keepBefore - keepAfter;
+    if (foldCount <= 0) {
+      continue;
+    }
+    const hidden = rows.slice(run.start + keepBefore, run.start + keepBefore + foldCount);
+    hiddenAt.set(run.start + keepBefore, hidden);
+  }
+  const folded = [];
+  let index = 0;
+  while (index < rows.length) {
+    const hidden = hiddenAt.get(index);
+    if (hidden === void 0) {
+      folded.push(at(rows, index));
+      index += 1;
+    } else {
+      folded.push({ kind: "fold", count: hidden.length, hidden });
+      index += hidden.length;
+    }
+  }
+  return folded;
+}
+function computeLineDiff(original, suggested, options = {}) {
+  const contextLines = options.contextLines ?? 2;
+  const ops = diffOps(splitLines(original), splitLines(suggested));
+  const flatRows = pairRows(ops);
+  numberRows(flatRows);
+  const rows = foldRows(flatRows, contextLines);
+  let added = 0;
+  let removed = 0;
+  for (const row of flatRows) {
+    if (row.kind !== "pair") {
+      continue;
+    }
+    if (row.right?.kind === "add") {
+      added += 1;
+    }
+    if (row.left?.kind === "del") {
+      removed += 1;
+    }
+  }
+  return { rows, added, removed };
+}
+var DEFAULT_LABELS = {
+  original: "Original",
+  suggested: "Suggested",
+  unchangedLines: (count) => count === 1 ? "1 unchanged line" : `${count} unchanged lines`,
+  showLess: "Show less",
+  prevChange: "Previous change",
+  nextChange: "Next change",
+  changePosition: (index, total) => `${index}/${total}`
+};
+function isChangedRow(row) {
+  return row.kind === "pair" && (row.left?.kind === "del" || row.right?.kind === "add");
+}
+function CellContent({ cell }) {
+  if (cell.segments === void 0) {
+    return /* @__PURE__ */ jsx("span", { className: "whitespace-pre-wrap break-words", children: cell.text });
+  }
+  return /* @__PURE__ */ jsx("span", { className: "whitespace-pre-wrap break-words", children: cell.segments.map(
+    (segment, index) => segment.changed ? /* @__PURE__ */ jsx(
+      "mark",
+      {
+        className: cn(
+          "rounded-[2px] text-inherit",
+          cell.kind === "add" ? "bg-[var(--as-success)]/30" : "bg-[var(--as-danger)]/30"
+        ),
+        children: segment.text
+      },
+      index
+    ) : /* @__PURE__ */ jsx("span", { children: segment.text }, index)
+  ) });
+}
+var TextDiffView = React.forwardRef(
+  function TextDiffView2({
+    original,
+    suggested,
+    contextLines = 2,
+    showHeader = true,
+    showNav = true,
+    labels,
+    className,
+    bodyClassName
+  }, ref) {
+    const mergedLabels = { ...DEFAULT_LABELS, ...labels };
+    const [expanded, setExpanded] = useState(/* @__PURE__ */ new Set());
+    const [activeGroup, setActiveGroup] = useState(0);
+    const scrollRef = React.useRef(null);
+    const diff = useMemo(
+      () => computeLineDiff(original, suggested, { contextLines }),
+      [original, suggested, contextLines]
+    );
+    const flatRows = useMemo(() => {
+      const out = [];
+      diff.rows.forEach((row, index) => {
+        if (row.kind === "fold" && expanded.has(index)) {
+          row.hidden.forEach((hiddenRow, hiddenIndex) => {
+            out.push({ key: `${index}.${hiddenIndex}`, row: hiddenRow });
+          });
+          out.push({ key: `${index}.collapse`, row, collapseOf: index });
+        } else {
+          out.push({
+            key: String(index),
+            row,
+            foldOf: row.kind === "fold" ? index : void 0
+          });
+        }
+      });
+      return out;
+    }, [diff.rows, expanded]);
+    const changeGroups = useMemo(() => {
+      const groups = [];
+      let inGroup = false;
+      flatRows.forEach((entry, index) => {
+        const changed = isChangedRow(entry.row);
+        if (changed && !inGroup) {
+          groups.push(index);
+        }
+        inGroup = changed;
+      });
+      return groups;
+    }, [flatRows]);
+    const virtualizer = useVirtualizer({
+      count: flatRows.length,
+      getScrollElement: () => scrollRef.current,
+      estimateSize: () => 22,
+      overscan: 12,
+      getItemKey: (index) => flatRows[index]?.key ?? String(index)
+    });
+    useEffect(() => {
+      setExpanded(/* @__PURE__ */ new Set());
+      setActiveGroup(0);
+    }, [original, suggested]);
+    useEffect(() => {
+      if (activeGroup >= changeGroups.length) {
+        setActiveGroup(0);
+      }
+    }, [activeGroup, changeGroups.length]);
+    useEffect(() => {
+      const target = changeGroups[activeGroup];
+      if (target !== void 0) {
+        virtualizer.scrollToIndex(target, { align: "center" });
+      }
+    }, [activeGroup, changeGroups, virtualizer]);
+    if (diff.added === 0 && diff.removed === 0) {
+      return /* @__PURE__ */ jsx(
+        "p",
+        {
+          ref,
+          className: cn(
+            "text-[var(--as-muted-fg)] border-[var(--as-border)] bg-[var(--as-subtle)] rounded-md border p-3 text-xs",
+            className
+          ),
+          children: "No changes"
+        }
+      );
+    }
+    const activeGroupStart = changeGroups[activeGroup];
+    const activeGroupEnd = activeGroupStart === void 0 ? void 0 : (() => {
+      for (let index = activeGroupStart + 1; index < flatRows.length; index += 1) {
+        const entry = flatRows[index];
+        if (entry !== void 0 && isChangedRow(entry.row)) {
+          return index;
+        }
+      }
+      return flatRows.length;
+    })();
+    const renderRow = (entry, index) => {
+      const row = entry.row;
+      if (row.kind === "fold") {
+        if (entry.collapseOf !== void 0) {
+          const collapseOf = entry.collapseOf;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => setExpanded((current) => {
+                const next = new Set(current);
+                next.delete(collapseOf);
+                return next;
+              }),
+              className: "text-[var(--as-muted-fg)] hover:bg-[var(--as-subtle)] hover:text-[var(--as-fg)] flex w-full items-center gap-1 px-3 py-0.5 text-left text-[11px]",
+              children: [
+                /* @__PURE__ */ jsx(ChevronDown, { className: "size-3", "aria-hidden": true }),
+                mergedLabels.showLess
+              ]
+            },
+            entry.key
+          );
+        }
+        const foldOf = entry.foldOf;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              if (foldOf !== void 0) {
+                setExpanded((current) => {
+                  const next = new Set(current);
+                  next.add(foldOf);
+                  return next;
+                });
+              }
+            },
+            className: "text-[var(--as-muted-fg)] hover:bg-[var(--as-subtle)] hover:text-[var(--as-fg)] flex w-full items-center gap-1 px-3 py-0.5 text-left text-[11px]",
+            children: [
+              /* @__PURE__ */ jsx(ChevronRight, { className: "size-3", "aria-hidden": true }),
+              mergedLabels.unchangedLines(row.count)
+            ]
+          },
+          entry.key
+        );
+      }
+      const changed = isChangedRow(row);
+      const active = activeGroupStart !== void 0 && activeGroupEnd !== void 0 && index >= activeGroupStart && index < activeGroupEnd;
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn("grid grid-cols-2", active && "bg-[var(--as-primary)]/5"),
+          "data-changed": changed || void 0,
+          "data-active": active || void 0,
+          children: ["left", "right"].map((side) => {
+            const cell = row[side];
+            const isAdd = cell?.kind === "add";
+            const isDel = cell?.kind === "del";
+            return /* @__PURE__ */ jsxs(
+              "pre",
+              {
+                className: cn(
+                  "flex min-w-0 gap-1.5 px-2 py-0.5",
+                  isAdd && "bg-[var(--as-success)]/10 text-[var(--as-success)]",
+                  isDel && "bg-[var(--as-danger)]/10 text-[var(--as-danger)]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "w-7 shrink-0 select-none text-right text-[var(--as-muted-fg)] tabular-nums opacity-70", children: cell?.no ?? "" }),
+                  /* @__PURE__ */ jsx("span", { className: "w-2 shrink-0 select-none text-center", "aria-hidden": true, children: isAdd ? "+" : isDel ? "-" : "" }),
+                  /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", children: cell === null ? null : /* @__PURE__ */ jsx(CellContent, { cell }) })
+                ]
+              },
+              side
+            );
+          })
+        },
+        entry.key
+      );
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-as": "text-diff-view",
+        className: cn(
+          "bg-[var(--as-subtle)] border-[var(--as-border)] flex flex-col overflow-hidden rounded-md border font-mono text-xs leading-relaxed",
+          className
+        ),
+        children: [
+          showHeader ? /* @__PURE__ */ jsxs("div", { className: "border-[var(--as-border)] text-[var(--as-muted-fg)] grid grid-cols-[1fr_auto_1fr] items-center gap-2 border-b px-3 py-1.5 text-[11px] font-medium tracking-wide uppercase", children: [
+            /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx(Minus, { className: "size-3 text-[var(--as-danger)]", "aria-hidden": true }),
+              mergedLabels.original
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxs("span", { children: [
+                /* @__PURE__ */ jsxs("span", { className: "text-[var(--as-success)]", children: [
+                  "+",
+                  diff.added
+                ] }),
+                " ",
+                /* @__PURE__ */ jsxs("span", { className: "text-[var(--as-danger)]", children: [
+                  "\u2212",
+                  diff.removed
+                ] })
+              ] }),
+              showNav && changeGroups.length > 0 ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-0.5", children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": mergedLabels.prevChange,
+                    title: mergedLabels.prevChange,
+                    disabled: activeGroup === 0,
+                    onClick: () => setActiveGroup((value) => Math.max(0, value - 1)),
+                    className: "hover:bg-[var(--as-border)] hover:text-[var(--as-fg)] rounded p-0.5 disabled:opacity-40",
+                    children: /* @__PURE__ */ jsx(ChevronUp, { className: "size-3.5", "aria-hidden": true })
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "tabular-nums", children: mergedLabels.changePosition(activeGroup + 1, changeGroups.length) }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": mergedLabels.nextChange,
+                    title: mergedLabels.nextChange,
+                    disabled: activeGroup >= changeGroups.length - 1,
+                    onClick: () => setActiveGroup((value) => Math.min(changeGroups.length - 1, value + 1)),
+                    className: "hover:bg-[var(--as-border)] hover:text-[var(--as-fg)] rounded p-0.5 disabled:opacity-40",
+                    children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5", "aria-hidden": true })
+                  }
+                )
+              ] }) : null
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "flex items-center justify-end gap-1", children: [
+              mergedLabels.suggested,
+              /* @__PURE__ */ jsx(Plus, { className: "size-3 text-[var(--as-success)]", "aria-hidden": true })
+            ] })
+          ] }) : null,
+          /* @__PURE__ */ jsx("div", { ref: scrollRef, className: cn("min-h-0 flex-1 overflow-y-auto", bodyClassName), children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                height: virtualizer.getTotalSize(),
+                position: "relative",
+                width: "100%"
+              },
+              children: virtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-index": virtualItem.index,
+                  ref: virtualizer.measureElement,
+                  style: {
+                    position: "absolute",
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                    transform: `translateY(${virtualItem.start}px)`
+                  },
+                  children: (() => {
+                    const entry = flatRows[virtualItem.index];
+                    return entry === void 0 ? null : renderRow(entry, virtualItem.index);
+                  })()
+                },
+                virtualItem.key
+              ))
+            }
+          ) })
+        ]
+      }
+    );
+  }
+);
+
+export { TextDiffView, computeLineDiff, wordSegments };
+//# sourceMappingURL=chunk-2PR6POP6.js.map
+//# sourceMappingURL=chunk-2PR6POP6.js.map