snice 7.8.0 → 7.9.0

package/dist/components/table/table-virtualizer.js

@@ -41,11 +41,24 @@ class TableVirtualizer {
         window.removeEventListener('resize', this.scrollHandler);
         cancelAnimationFrame(this.rafId);
     }
-    setTotalRows(total) {
+    /**
+     * Publish a new row count. `repaint` false updates the model only — the
+     * pending re-render is still armed (lastStartIndex is reset), so the caller's
+     * own paint (scrollToIndex / refresh) performs it. Callers that resolve a
+     * display index and then scroll MUST use that form: painting here runs
+     * `afterRender`, and a host whose afterRender restores keyboard focus would
+     * re-enter this method from inside its own update.
+     */
+    setTotalRows(total, repaint = true) {
         this.options.totalRows = total;
         this.invalidateOffsets();
         this.lastStartIndex = -1; // Force re-render
-        this.update();
+        if (repaint)
+            this.update();
+    }
+    /** Row count the virtualizer is currently windowing over. */
+    getTotalRows() {
+        return this.options.totalRows ?? 0;
     }
     /**
      * Force a full re-render of the visible range.
@@ -56,11 +69,30 @@ class TableVirtualizer {
         this.lastEndIndex = -1;
         this.update();
     }
+    /**
+     * The element that scrolls RIGHT NOW. A structural re-render of the host
+     * swaps the node captured at `attach()`; keep the listener and every lookup
+     * (notably the `<tbody>` we paint into) on the live one.
+     */
+    resolveContainer() {
+        const live = this.options.resolveScrollContainer?.() ?? null;
+        const current = this.options.scrollContainer;
+        if (live && live !== current) {
+            current?.removeEventListener('scroll', this.scrollHandler);
+            live.addEventListener('scroll', this.scrollHandler, { passive: true });
+            this.options.scrollContainer = live;
+            // The new container's tbody is empty — the range we believed painted is
+            // not on screen anymore.
+            this.lastStartIndex = -1;
+            this.lastEndIndex = -1;
+        }
+        return this.options.scrollContainer ?? null;
+    }
     /**
      * Calculate visible range and render if changed.
      */
     update() {
-        if (!this.enabled || !this.options.scrollContainer)
+        if (!this.enabled || !this.resolveContainer())
             return;
         const { bufferPx, totalRows, scrollContainer, renderRange } = this.options;
         const scrollTop = scrollContainer.scrollTop;
@@ -74,11 +106,12 @@ class TableVirtualizer {
         // Filtering, pagination, or collapsing a group can shrink the flattened
         // model while the container is scrolled near the old end. Clamp before
         // deriving indices so startIndex never sits beyond totalRows and blanks the
-        // body. Reflect the clamp to the element as well so its next scroll event
-        // observes the same state.
+        // body. Only an offset that overruns the whole content is written back to
+        // the element — a browser already clamps its own scrollTop, and rewriting a
+        // deliberate offset (scrollToRow) would undo the caller's request.
         const maxScrollTop = Math.max(0, totalHeight - viewportHeight);
         const effectiveScrollTop = Math.min(Math.max(0, scrollTop), maxScrollTop);
-        if (scrollTop !== effectiveScrollTop)
+        if (scrollTop > totalHeight || scrollTop < 0)
             scrollContainer.scrollTop = effectiveScrollTop;
         // Calculate visible range with buffer
         const startPx = Math.max(0, effectiveScrollTop - bufferPx);
@@ -88,75 +121,89 @@ class TableVirtualizer {
         // Skip if range hasn't changed
         if (startIndex === this.lastStartIndex && endIndex === this.lastEndIndex)
             return;
-        this.lastStartIndex = startIndex;
-        this.lastEndIndex = endIndex;
+        // Nothing to paint into yet (the host template has not committed its table,
+        // or a structural branch flip is mid-flight). Return WITHOUT recording the
+        // range: a dropped paint that looks like a completed one makes the guard
+        // above suppress every retry, and then only a viewport-height change (a
+        // window resize) ever repaints the rows.
+        const tbody = scrollContainer.querySelector('tbody');
+        if (!tbody)
+            return;
         // Update spacers
         const topHeight = offsets[startIndex] || 0;
         const bottomHeight = Math.max(0, totalHeight - (offsets[endIndex] || totalHeight));
         this.topSpacer.style.height = `${topHeight}px`;
         this.bottomSpacer.style.height = `${bottomHeight}px`;
+        // Span the columns that exist, never more (see resolveColumnSpan).
+        const columnSpan = Math.max(1, Math.round(this.options.resolveColumnSpan?.() ?? 1));
         // Render the visible range
         const fragment = renderRange(startIndex, endIndex);
         // Build the tbody content
-        const tbody = this.options.scrollContainer.querySelector('tbody');
-        if (tbody) {
-            tbody.innerHTML = '';
-            // Pinned-top rows render outside (above) the windowed range so they are
-            // always present. Rebuilt every window recompute since tbody is wiped.
-            const pinnedTop = this.options.renderPinnedTop?.();
-            if (pinnedTop)
-                tbody.appendChild(pinnedTop);
-            if (topHeight > 0) {
-                const topTd = document.createElement('td');
-                topTd.colSpan = 999;
-                topTd.style.height = `${topHeight}px`;
-                topTd.style.padding = '0';
-                topTd.style.border = 'none';
-                this.topSpacer.innerHTML = '';
-                this.topSpacer.appendChild(topTd);
-                tbody.appendChild(this.topSpacer);
-            }
-            tbody.appendChild(fragment);
-            if (bottomHeight > 0) {
-                const bottomTd = document.createElement('td');
-                bottomTd.colSpan = 999;
-                bottomTd.style.height = `${bottomHeight}px`;
-                bottomTd.style.padding = '0';
-                bottomTd.style.border = 'none';
-                this.bottomSpacer.innerHTML = '';
-                this.bottomSpacer.appendChild(bottomTd);
-                tbody.appendChild(this.bottomSpacer);
-            }
-            // Pinned-bottom rows render outside (below) the windowed range.
-            const pinnedBottom = this.options.renderPinnedBottom?.();
-            if (pinnedBottom)
-                tbody.appendChild(pinnedBottom);
-            this.options.afterRender?.();
+        tbody.innerHTML = '';
+        // Pinned-top rows render outside (above) the windowed range so they are
+        // always present. Rebuilt every window recompute since tbody is wiped.
+        const pinnedTop = this.options.renderPinnedTop?.();
+        if (pinnedTop)
+            tbody.appendChild(pinnedTop);
+        if (topHeight > 0) {
+            const topTd = document.createElement('td');
+            topTd.colSpan = columnSpan;
+            topTd.style.height = `${topHeight}px`;
+            topTd.style.padding = '0';
+            topTd.style.border = 'none';
+            this.topSpacer.innerHTML = '';
+            this.topSpacer.appendChild(topTd);
+            tbody.appendChild(this.topSpacer);
+        }
+        tbody.appendChild(fragment);
+        // Nothing to window over: hand the body back its empty/loading/error row
+        // instead of leaving the user staring at a blank frame.
+        if (totalRows === 0) {
+            const emptyBody = this.options.renderEmptyBody?.();
+            if (emptyBody)
+                tbody.appendChild(emptyBody);
         }
+        if (bottomHeight > 0) {
+            const bottomTd = document.createElement('td');
+            bottomTd.colSpan = columnSpan;
+            bottomTd.style.height = `${bottomHeight}px`;
+            bottomTd.style.padding = '0';
+            bottomTd.style.border = 'none';
+            this.bottomSpacer.innerHTML = '';
+            this.bottomSpacer.appendChild(bottomTd);
+            tbody.appendChild(this.bottomSpacer);
+        }
+        // Pinned-bottom rows render outside (below) the windowed range.
+        const pinnedBottom = this.options.renderPinnedBottom?.();
+        if (pinnedBottom)
+            tbody.appendChild(pinnedBottom);
+        // The window is on screen — only NOW does this range count as painted.
+        // Committed before afterRender so a re-entrant update() from that hook
+        // (keyboard focus restoration scrolls) sees the range it is looking at.
+        this.lastStartIndex = startIndex;
+        this.lastEndIndex = endIndex;
+        this.options.afterRender?.();
     }
     /** Get the currently visible row index range */
     getVisibleRange() {
         return { start: this.lastStartIndex, end: this.lastEndIndex };
     }
-    /** Scroll to bring a specific row into view */
-    scrollToRow(index) {
-        if (!this.options.scrollContainer)
-            return;
-        const top = this.offsetForIndex(index);
-        this.options.scrollContainer.scrollTop = top;
-    }
     /**
-     * Scroll a logical row index into view AND synchronously render its range.
-     * Unlike `scrollToRow`, this does not rely on a scroll event (a programmatic
-     * scrollTop assignment does not fire one) — it forces the window recompute
-     * immediately so the row is in the DOM by the time the caller focuses it.
+     * Scroll a row into view AND synchronously render the window around it.
+     * A programmatic `scrollTop` assignment fires no scroll event, so the window
+     * has to be recomputed here — otherwise the viewport lands on bare spacer and
+     * the requested row is never in the DOM.
      */
-    scrollToIndex(index) {
+    scrollToRow(index) {
         if (!this.options.scrollContainer)
             return;
         this.options.scrollContainer.scrollTop = this.offsetForIndex(index);
         this.refresh();
     }
+    /** Scroll to a logical (flattened display) row index. */
+    scrollToIndex(index) {
+        this.scrollToRow(index);
+    }
     /** Get current scroll position */
     getScrollPosition() {
         const el = this.options.scrollContainer;

package/dist/components/table/table-virtualizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-virtualizer.js","sources":["../../../../components/table/table-virtualizer.ts"],"sourcesContent":["/**\n * Row virtualization engine for snice-table.\n * Only renders visible rows + configurable buffer.\n * Uses spacer elements to maintain scroll height.\n */\n\nexport interface VirtualizerOptions {\n  /** Row height in pixels, or a per-logical-row height resolver. */\n  rowHeight: number | ((index: number) => number);\n  /** Buffer size in pixels above and below viewport */\n  bufferPx: number;\n  /** Total number of rows in the dataset */\n  totalRows: number;\n  /** Container element that scrolls */\n  scrollContainer: HTMLElement;\n  /** Callback to render a range of rows */\n  renderRange: (startIndex: number, endIndex: number) => DocumentFragment;\n  /**\n   * Optional: render pinned-top rows. These live OUTSIDE the windowed range\n   * (before the top spacer) so they are always present regardless of scroll\n   * position — the same guarantee the non-virtual path provides.\n   */\n  renderPinnedTop?: () => DocumentFragment;\n  /** Optional: render pinned-bottom rows (after the bottom spacer). */\n  renderPinnedBottom?: () => DocumentFragment;\n  /** Called after the new window has been inserted into tbody. */\n  afterRender?: () => void;\n}\n\nexport class TableVirtualizer {\n  private options: VirtualizerOptions;\n  private topSpacer: HTMLElement;\n  private bottomSpacer: HTMLElement;\n  private contentContainer: HTMLElement;\n  private scrollHandler: () => void;\n  private rafId = 0;\n  private lastStartIndex = -1;\n  private lastEndIndex = -1;\n  private enabled = false;\n  private offsets: number[] = [];\n  private offsetsTotalRows = -1;\n\n  constructor() {\n    this.topSpacer = document.createElement('tr');\n    this.topSpacer.className = 'virtual-spacer virtual-spacer--top';\n    this.topSpacer.style.display = 'table-row';\n\n    this.bottomSpacer = document.createElement('tr');\n    this.bottomSpacer.className = 'virtual-spacer virtual-spacer--bottom';\n    this.bottomSpacer.style.display = 'table-row';\n\n    this.contentContainer = document.createElement('tbody');\n    this.options = {} as VirtualizerOptions;\n\n    this.scrollHandler = () => {\n      if (this.rafId) cancelAnimationFrame(this.rafId);\n      this.rafId = requestAnimationFrame(() => this.update());\n    };\n  }\n\n  attach(options: VirtualizerOptions) {\n    this.options = options;\n    this.enabled = true;\n    this.lastStartIndex = -1;\n    this.lastEndIndex = -1;\n    this.invalidateOffsets();\n    this.options.scrollContainer.addEventListener('scroll', this.scrollHandler, { passive: true });\n    window.addEventListener('resize', this.scrollHandler, { passive: true });\n    this.update();\n  }\n\n  detach() {\n    this.enabled = false;\n    this.options.scrollContainer?.removeEventListener('scroll', this.scrollHandler);\n    window.removeEventListener('resize', this.scrollHandler);\n    cancelAnimationFrame(this.rafId);\n  }\n\n  setTotalRows(total: number) {\n    this.options.totalRows = total;\n    this.invalidateOffsets();\n    this.lastStartIndex = -1; // Force re-render\n    this.update();\n  }\n\n  /**\n   * Force a full re-render of the visible range.\n   */\n  refresh() {\n    this.invalidateOffsets();\n    this.lastStartIndex = -1;\n    this.lastEndIndex = -1;\n    this.update();\n  }\n\n  /**\n   * Calculate visible range and render if changed.\n   */\n  private update() {\n    if (!this.enabled || !this.options.scrollContainer) return;\n\n    const { bufferPx, totalRows, scrollContainer, renderRange } = this.options;\n    const scrollTop = scrollContainer.scrollTop;\n    const offsets = this.buildOffsets(totalRows);\n    const minimumViewport = totalRows > 0 ? Math.max(1, offsets[1] - offsets[0]) : 1;\n    // Layoutless DOMs report a zero-height viewport; treating one row as the\n    // minimum keeps range math valid and mirrors the smallest useful browser\n    // viewport.\n    const viewportHeight = Math.max(minimumViewport, scrollContainer.clientHeight);\n\n    const totalHeight = offsets[totalRows] || 0;\n\n    // Filtering, pagination, or collapsing a group can shrink the flattened\n    // model while the container is scrolled near the old end. Clamp before\n    // deriving indices so startIndex never sits beyond totalRows and blanks the\n    // body. Reflect the clamp to the element as well so its next scroll event\n    // observes the same state.\n    const maxScrollTop = Math.max(0, totalHeight - viewportHeight);\n    const effectiveScrollTop = Math.min(Math.max(0, scrollTop), maxScrollTop);\n    if (scrollTop !== effectiveScrollTop) scrollContainer.scrollTop = effectiveScrollTop;\n\n    // Calculate visible range with buffer\n    const startPx = Math.max(0, effectiveScrollTop - bufferPx);\n    const endPx = Math.min(totalHeight, effectiveScrollTop + viewportHeight + bufferPx);\n\n    const startIndex = this.findRowAtOffset(offsets, startPx);\n    const endIndex = Math.min(totalRows, this.findFirstOffsetAtOrAfter(offsets, endPx));\n\n    // Skip if range hasn't changed\n    if (startIndex === this.lastStartIndex && endIndex === this.lastEndIndex) return;\n\n    this.lastStartIndex = startIndex;\n    this.lastEndIndex = endIndex;\n\n    // Update spacers\n    const topHeight = offsets[startIndex] || 0;\n    const bottomHeight = Math.max(0, totalHeight - (offsets[endIndex] || totalHeight));\n\n    this.topSpacer.style.height = `${topHeight}px`;\n    this.bottomSpacer.style.height = `${bottomHeight}px`;\n\n    // Render the visible range\n    const fragment = renderRange(startIndex, endIndex);\n\n    // Build the tbody content\n    const tbody = this.options.scrollContainer.querySelector('tbody');\n    if (tbody) {\n      tbody.innerHTML = '';\n      // Pinned-top rows render outside (above) the windowed range so they are\n      // always present. Rebuilt every window recompute since tbody is wiped.\n      const pinnedTop = this.options.renderPinnedTop?.();\n      if (pinnedTop) tbody.appendChild(pinnedTop);\n      if (topHeight > 0) {\n        const topTd = document.createElement('td');\n        topTd.colSpan = 999;\n        topTd.style.height = `${topHeight}px`;\n        topTd.style.padding = '0';\n        topTd.style.border = 'none';\n        this.topSpacer.innerHTML = '';\n        this.topSpacer.appendChild(topTd);\n        tbody.appendChild(this.topSpacer);\n      }\n      tbody.appendChild(fragment);\n      if (bottomHeight > 0) {\n        const bottomTd = document.createElement('td');\n        bottomTd.colSpan = 999;\n        bottomTd.style.height = `${bottomHeight}px`;\n        bottomTd.style.padding = '0';\n        bottomTd.style.border = 'none';\n        this.bottomSpacer.innerHTML = '';\n        this.bottomSpacer.appendChild(bottomTd);\n        tbody.appendChild(this.bottomSpacer);\n      }\n      // Pinned-bottom rows render outside (below) the windowed range.\n      const pinnedBottom = this.options.renderPinnedBottom?.();\n      if (pinnedBottom) tbody.appendChild(pinnedBottom);\n      this.options.afterRender?.();\n    }\n  }\n\n  /** Get the currently visible row index range */\n  getVisibleRange(): { start: number; end: number } {\n    return { start: this.lastStartIndex, end: this.lastEndIndex };\n  }\n\n  /** Scroll to bring a specific row into view */\n  scrollToRow(index: number) {\n    if (!this.options.scrollContainer) return;\n    const top = this.offsetForIndex(index);\n    this.options.scrollContainer.scrollTop = top;\n  }\n\n  /**\n   * Scroll a logical row index into view AND synchronously render its range.\n   * Unlike `scrollToRow`, this does not rely on a scroll event (a programmatic\n   * scrollTop assignment does not fire one) — it forces the window recompute\n   * immediately so the row is in the DOM by the time the caller focuses it.\n   */\n  scrollToIndex(index: number) {\n    if (!this.options.scrollContainer) return;\n    this.options.scrollContainer.scrollTop = this.offsetForIndex(index);\n    this.refresh();\n  }\n\n  /** Get current scroll position */\n  getScrollPosition(): { top: number; left: number } {\n    const el = this.options.scrollContainer;\n    return { top: el?.scrollTop ?? 0, left: el?.scrollLeft ?? 0 };\n  }\n\n  isEnabled() {\n    return this.enabled;\n  }\n\n  private heightForIndex(index: number): number {\n    const configured = typeof this.options.rowHeight === 'function'\n      ? this.options.rowHeight(index)\n      : this.options.rowHeight;\n    return Number.isFinite(configured) && configured > 0 ? configured : 1;\n  }\n\n  private buildOffsets(totalRows: number): number[] {\n    if (this.offsetsTotalRows === totalRows && this.offsets.length === totalRows + 1) {\n      return this.offsets;\n    }\n    this.offsets = new Array(totalRows + 1);\n    this.offsets[0] = 0;\n    for (let index = 0; index < totalRows; index++) {\n      this.offsets[index + 1] = this.offsets[index] + this.heightForIndex(index);\n    }\n    this.offsetsTotalRows = totalRows;\n    return this.offsets;\n  }\n\n  private invalidateOffsets() {\n    this.offsets = [];\n    this.offsetsTotalRows = -1;\n  }\n\n  private offsetForIndex(index: number): number {\n    const clamped = Math.max(0, Math.min(index, this.options.totalRows));\n    return this.buildOffsets(this.options.totalRows)[clamped] || 0;\n  }\n\n  /** Index of the logical row containing the offset. */\n  private findRowAtOffset(offsets: number[], offset: number): number {\n    const totalRows = offsets.length - 1;\n    if (totalRows <= 0) return 0;\n    let low = 0;\n    let high = totalRows;\n    while (low < high) {\n      const mid = Math.floor((low + high) / 2);\n      if (offsets[mid + 1] <= offset) low = mid + 1;\n      else high = mid;\n    }\n    return Math.min(totalRows, low);\n  }\n\n  /** First prefix offset at or after the requested pixel. */\n  private findFirstOffsetAtOrAfter(offsets: number[], offset: number): number {\n    let low = 0;\n    let high = offsets.length - 1;\n    while (low < high) {\n      const mid = Math.floor((low + high) / 2);\n      if (offsets[mid] < offset) low = mid + 1;\n      else high = mid;\n    }\n    return low;\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"table-virtualizer.js","sources":["../../../../components/table/table-virtualizer.ts"],"sourcesContent":["/**\n * Row virtualization engine for snice-table.\n * Only renders visible rows + configurable buffer.\n * Uses spacer elements to maintain scroll height.\n */\n\nexport interface VirtualizerOptions {\n  /** Row height in pixels, or a per-logical-row height resolver. */\n  rowHeight: number | ((index: number) => number);\n  /** Buffer size in pixels above and below viewport */\n  bufferPx: number;\n  /** Total number of rows in the dataset */\n  totalRows: number;\n  /** Container element that scrolls */\n  scrollContainer: HTMLElement;\n  /**\n   * Optional: re-resolve the scrolling container on every update. A host whose\n   * template flips structural branches replaces the element captured at\n   * `attach()`; without this the virtualizer keeps painting into the DETACHED\n   * subtree's orphaned `<tbody>` while the live one stays empty.\n   */\n  resolveScrollContainer?: () => HTMLElement | null;\n  /** Callback to render a range of rows */\n  renderRange: (startIndex: number, endIndex: number) => DocumentFragment;\n  /**\n   * How many columns a spacer row spans. Required in practice: a spacer that\n   * over-spans invents columns, and `table-layout: fixed` then hands the\n   * frame's spare width to the phantom ones — the real columns stop short of\n   * the right edge with a dead strip beside them.\n   */\n  resolveColumnSpan?: () => number;\n  /**\n   * Optional: render pinned-top rows. These live OUTSIDE the windowed range\n   * (before the top spacer) so they are always present regardless of scroll\n   * position — the same guarantee the non-virtual path provides.\n   */\n  renderPinnedTop?: () => DocumentFragment;\n  /** Optional: render pinned-bottom rows (after the bottom spacer). */\n  renderPinnedBottom?: () => DocumentFragment;\n  /**\n   * Optional: the single message row a zero-row body shows (loading, error, or\n   * empty state). Called only when `totalRows` is 0, so the virtualized body\n   * carries the same states the ordinary render path does instead of being\n   * wiped to nothing.\n   */\n  renderEmptyBody?: () => Node | null;\n  /** Called after the new window has been inserted into tbody. */\n  afterRender?: () => void;\n}\n\nexport class TableVirtualizer {\n  private options: VirtualizerOptions;\n  private topSpacer: HTMLElement;\n  private bottomSpacer: HTMLElement;\n  private contentContainer: HTMLElement;\n  private scrollHandler: () => void;\n  private rafId = 0;\n  private lastStartIndex = -1;\n  private lastEndIndex = -1;\n  private enabled = false;\n  private offsets: number[] = [];\n  private offsetsTotalRows = -1;\n\n  constructor() {\n    this.topSpacer = document.createElement('tr');\n    this.topSpacer.className = 'virtual-spacer virtual-spacer--top';\n    this.topSpacer.style.display = 'table-row';\n\n    this.bottomSpacer = document.createElement('tr');\n    this.bottomSpacer.className = 'virtual-spacer virtual-spacer--bottom';\n    this.bottomSpacer.style.display = 'table-row';\n\n    this.contentContainer = document.createElement('tbody');\n    this.options = {} as VirtualizerOptions;\n\n    this.scrollHandler = () => {\n      if (this.rafId) cancelAnimationFrame(this.rafId);\n      this.rafId = requestAnimationFrame(() => this.update());\n    };\n  }\n\n  attach(options: VirtualizerOptions) {\n    this.options = options;\n    this.enabled = true;\n    this.lastStartIndex = -1;\n    this.lastEndIndex = -1;\n    this.invalidateOffsets();\n    this.options.scrollContainer.addEventListener('scroll', this.scrollHandler, { passive: true });\n    window.addEventListener('resize', this.scrollHandler, { passive: true });\n    this.update();\n  }\n\n  detach() {\n    this.enabled = false;\n    this.options.scrollContainer?.removeEventListener('scroll', this.scrollHandler);\n    window.removeEventListener('resize', this.scrollHandler);\n    cancelAnimationFrame(this.rafId);\n  }\n\n  /**\n   * Publish a new row count. `repaint` false updates the model only — the\n   * pending re-render is still armed (lastStartIndex is reset), so the caller's\n   * own paint (scrollToIndex / refresh) performs it. Callers that resolve a\n   * display index and then scroll MUST use that form: painting here runs\n   * `afterRender`, and a host whose afterRender restores keyboard focus would\n   * re-enter this method from inside its own update.\n   */\n  setTotalRows(total: number, repaint = true) {\n    this.options.totalRows = total;\n    this.invalidateOffsets();\n    this.lastStartIndex = -1; // Force re-render\n    if (repaint) this.update();\n  }\n\n  /** Row count the virtualizer is currently windowing over. */\n  getTotalRows() {\n    return this.options.totalRows ?? 0;\n  }\n\n  /**\n   * Force a full re-render of the visible range.\n   */\n  refresh() {\n    this.invalidateOffsets();\n    this.lastStartIndex = -1;\n    this.lastEndIndex = -1;\n    this.update();\n  }\n\n  /**\n   * The element that scrolls RIGHT NOW. A structural re-render of the host\n   * swaps the node captured at `attach()`; keep the listener and every lookup\n   * (notably the `<tbody>` we paint into) on the live one.\n   */\n  private resolveContainer(): HTMLElement | null {\n    const live = this.options.resolveScrollContainer?.() ?? null;\n    const current = this.options.scrollContainer;\n    if (live && live !== current) {\n      current?.removeEventListener('scroll', this.scrollHandler);\n      live.addEventListener('scroll', this.scrollHandler, { passive: true });\n      this.options.scrollContainer = live;\n      // The new container's tbody is empty — the range we believed painted is\n      // not on screen anymore.\n      this.lastStartIndex = -1;\n      this.lastEndIndex = -1;\n    }\n    return this.options.scrollContainer ?? null;\n  }\n\n  /**\n   * Calculate visible range and render if changed.\n   */\n  private update() {\n    if (!this.enabled || !this.resolveContainer()) return;\n\n    const { bufferPx, totalRows, scrollContainer, renderRange } = this.options;\n    const scrollTop = scrollContainer.scrollTop;\n    const offsets = this.buildOffsets(totalRows);\n    const minimumViewport = totalRows > 0 ? Math.max(1, offsets[1] - offsets[0]) : 1;\n    // Layoutless DOMs report a zero-height viewport; treating one row as the\n    // minimum keeps range math valid and mirrors the smallest useful browser\n    // viewport.\n    const viewportHeight = Math.max(minimumViewport, scrollContainer.clientHeight);\n\n    const totalHeight = offsets[totalRows] || 0;\n\n    // Filtering, pagination, or collapsing a group can shrink the flattened\n    // model while the container is scrolled near the old end. Clamp before\n    // deriving indices so startIndex never sits beyond totalRows and blanks the\n    // body. Only an offset that overruns the whole content is written back to\n    // the element — a browser already clamps its own scrollTop, and rewriting a\n    // deliberate offset (scrollToRow) would undo the caller's request.\n    const maxScrollTop = Math.max(0, totalHeight - viewportHeight);\n    const effectiveScrollTop = Math.min(Math.max(0, scrollTop), maxScrollTop);\n    if (scrollTop > totalHeight || scrollTop < 0) scrollContainer.scrollTop = effectiveScrollTop;\n\n    // Calculate visible range with buffer\n    const startPx = Math.max(0, effectiveScrollTop - bufferPx);\n    const endPx = Math.min(totalHeight, effectiveScrollTop + viewportHeight + bufferPx);\n\n    const startIndex = this.findRowAtOffset(offsets, startPx);\n    const endIndex = Math.min(totalRows, this.findFirstOffsetAtOrAfter(offsets, endPx));\n\n    // Skip if range hasn't changed\n    if (startIndex === this.lastStartIndex && endIndex === this.lastEndIndex) return;\n\n    // Nothing to paint into yet (the host template has not committed its table,\n    // or a structural branch flip is mid-flight). Return WITHOUT recording the\n    // range: a dropped paint that looks like a completed one makes the guard\n    // above suppress every retry, and then only a viewport-height change (a\n    // window resize) ever repaints the rows.\n    const tbody = scrollContainer.querySelector('tbody');\n    if (!tbody) return;\n\n    // Update spacers\n    const topHeight = offsets[startIndex] || 0;\n    const bottomHeight = Math.max(0, totalHeight - (offsets[endIndex] || totalHeight));\n\n    this.topSpacer.style.height = `${topHeight}px`;\n    this.bottomSpacer.style.height = `${bottomHeight}px`;\n\n    // Span the columns that exist, never more (see resolveColumnSpan).\n    const columnSpan = Math.max(1, Math.round(this.options.resolveColumnSpan?.() ?? 1));\n\n    // Render the visible range\n    const fragment = renderRange(startIndex, endIndex);\n\n    // Build the tbody content\n    tbody.innerHTML = '';\n    // Pinned-top rows render outside (above) the windowed range so they are\n    // always present. Rebuilt every window recompute since tbody is wiped.\n    const pinnedTop = this.options.renderPinnedTop?.();\n    if (pinnedTop) tbody.appendChild(pinnedTop);\n    if (topHeight > 0) {\n      const topTd = document.createElement('td');\n      topTd.colSpan = columnSpan;\n      topTd.style.height = `${topHeight}px`;\n      topTd.style.padding = '0';\n      topTd.style.border = 'none';\n      this.topSpacer.innerHTML = '';\n      this.topSpacer.appendChild(topTd);\n      tbody.appendChild(this.topSpacer);\n    }\n    tbody.appendChild(fragment);\n    // Nothing to window over: hand the body back its empty/loading/error row\n    // instead of leaving the user staring at a blank frame.\n    if (totalRows === 0) {\n      const emptyBody = this.options.renderEmptyBody?.();\n      if (emptyBody) tbody.appendChild(emptyBody);\n    }\n    if (bottomHeight > 0) {\n      const bottomTd = document.createElement('td');\n      bottomTd.colSpan = columnSpan;\n      bottomTd.style.height = `${bottomHeight}px`;\n      bottomTd.style.padding = '0';\n      bottomTd.style.border = 'none';\n      this.bottomSpacer.innerHTML = '';\n      this.bottomSpacer.appendChild(bottomTd);\n      tbody.appendChild(this.bottomSpacer);\n    }\n    // Pinned-bottom rows render outside (below) the windowed range.\n    const pinnedBottom = this.options.renderPinnedBottom?.();\n    if (pinnedBottom) tbody.appendChild(pinnedBottom);\n\n    // The window is on screen — only NOW does this range count as painted.\n    // Committed before afterRender so a re-entrant update() from that hook\n    // (keyboard focus restoration scrolls) sees the range it is looking at.\n    this.lastStartIndex = startIndex;\n    this.lastEndIndex = endIndex;\n    this.options.afterRender?.();\n  }\n\n  /** Get the currently visible row index range */\n  getVisibleRange(): { start: number; end: number } {\n    return { start: this.lastStartIndex, end: this.lastEndIndex };\n  }\n\n  /**\n   * Scroll a row into view AND synchronously render the window around it.\n   * A programmatic `scrollTop` assignment fires no scroll event, so the window\n   * has to be recomputed here — otherwise the viewport lands on bare spacer and\n   * the requested row is never in the DOM.\n   */\n  scrollToRow(index: number) {\n    if (!this.options.scrollContainer) return;\n    this.options.scrollContainer.scrollTop = this.offsetForIndex(index);\n    this.refresh();\n  }\n\n  /** Scroll to a logical (flattened display) row index. */\n  scrollToIndex(index: number) {\n    this.scrollToRow(index);\n  }\n\n  /** Get current scroll position */\n  getScrollPosition(): { top: number; left: number } {\n    const el = this.options.scrollContainer;\n    return { top: el?.scrollTop ?? 0, left: el?.scrollLeft ?? 0 };\n  }\n\n  isEnabled() {\n    return this.enabled;\n  }\n\n  private heightForIndex(index: number): number {\n    const configured = typeof this.options.rowHeight === 'function'\n      ? this.options.rowHeight(index)\n      : this.options.rowHeight;\n    return Number.isFinite(configured) && configured > 0 ? configured : 1;\n  }\n\n  private buildOffsets(totalRows: number): number[] {\n    if (this.offsetsTotalRows === totalRows && this.offsets.length === totalRows + 1) {\n      return this.offsets;\n    }\n    this.offsets = new Array(totalRows + 1);\n    this.offsets[0] = 0;\n    for (let index = 0; index < totalRows; index++) {\n      this.offsets[index + 1] = this.offsets[index] + this.heightForIndex(index);\n    }\n    this.offsetsTotalRows = totalRows;\n    return this.offsets;\n  }\n\n  private invalidateOffsets() {\n    this.offsets = [];\n    this.offsetsTotalRows = -1;\n  }\n\n  private offsetForIndex(index: number): number {\n    const clamped = Math.max(0, Math.min(index, this.options.totalRows));\n    return this.buildOffsets(this.options.totalRows)[clamped] || 0;\n  }\n\n  /** Index of the logical row containing the offset. */\n  private findRowAtOffset(offsets: number[], offset: number): number {\n    const totalRows = offsets.length - 1;\n    if (totalRows <= 0) return 0;\n    let low = 0;\n    let high = totalRows;\n    while (low < high) {\n      const mid = Math.floor((low + high) / 2);\n      if (offsets[mid + 1] <= offset) low = mid + 1;\n      else high = mid;\n    }\n    return Math.min(totalRows, low);\n  }\n\n  /** First prefix offset at or after the requested pixel. */\n  private findFirstOffsetAtOrAfter(offsets: number[], offset: number): number {\n    let low = 0;\n    let high = offsets.length - 1;\n    while (low < high) {\n      const mid = Math.floor((low + high) / 2);\n      if (offsets[mid] < offset) low = mid + 1;\n      else high = mid;\n    }\n    return low;\n  }\n}\n"],"names":[],"mappings":"AAAA;;;;AAIG;MA8CU,gBAAgB,CAAA;AAa3B,IAAA,WAAA,GAAA;QAPQ,IAAA,CAAA,KAAK,GAAG,CAAC;QACT,IAAA,CAAA,cAAc,GAAG,EAAE;QACnB,IAAA,CAAA,YAAY,GAAG,EAAE;QACjB,IAAA,CAAA,OAAO,GAAG,KAAK;QACf,IAAA,CAAA,OAAO,GAAa,EAAE;QACtB,IAAA,CAAA,gBAAgB,GAAG,EAAE;QAG3B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;AAC7C,QAAA,IAAI,CAAC,SAAS,CAAC,SAAS,GAAG,oCAAoC;QAC/D,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,WAAW;QAE1C,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;AAChD,QAAA,IAAI,CAAC,YAAY,CAAC,SAAS,GAAG,uCAAuC;QACrE,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,GAAG,WAAW;QAE7C,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AACvD,QAAA,IAAI,CAAC,OAAO,GAAG,EAAwB;AAEvC,QAAA,IAAI,CAAC,aAAa,GAAG,MAAK;YACxB,IAAI,IAAI,CAAC,KAAK;AAAE,gBAAA,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC;AAChD,YAAA,IAAI,CAAC,KAAK,GAAG,qBAAqB,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC;AACzD,QAAA,CAAC;IACH;AAEA,IAAA,MAAM,CAAC,OAA2B,EAAA;AAChC,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO;AACtB,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI;AACnB,QAAA,IAAI,CAAC,cAAc,GAAG,EAAE;AACxB,QAAA,IAAI,CAAC,YAAY,GAAG,EAAE;QACtB,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAC9F,QAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;QACxE,IAAI,CAAC,MAAM,EAAE;IACf;IAEA,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;AACpB,QAAA,IAAI,CAAC,OAAO,CAAC,eAAe,EAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC;QAC/E,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC;AACxD,QAAA,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC;IAClC;AAEA;;;;;;;AAOG;AACH,IAAA,YAAY,CAAC,KAAa,EAAE,OAAO,GAAG,IAAI,EAAA;AACxC,QAAA,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,KAAK;QAC9B,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;AACzB,QAAA,IAAI,OAAO;YAAE,IAAI,CAAC,MAAM,EAAE;IAC5B;;IAGA,YAAY,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,IAAI,CAAC;IACpC;AAEA;;AAEG;IACH,OAAO,GAAA;QACL,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,cAAc,GAAG,EAAE;AACxB,QAAA,IAAI,CAAC,YAAY,GAAG,EAAE;QACtB,IAAI,CAAC,MAAM,EAAE;IACf;AAEA;;;;AAIG;IACK,gBAAgB,GAAA;QACtB,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,sBAAsB,IAAI,IAAI,IAAI;AAC5D,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,eAAe;AAC5C,QAAA,IAAI,IAAI,IAAI,IAAI,KAAK,OAAO,EAAE;YAC5B,OAAO,EAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC;AAC1D,YAAA,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACtE,YAAA,IAAI,CAAC,OAAO,CAAC,eAAe,GAAG,IAAI;;;AAGnC,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;AACxB,YAAA,IAAI,CAAC,YAAY,GAAG,EAAE;QACxB;AACA,QAAA,OAAO,IAAI,CAAC,OAAO,CAAC,eAAe,IAAI,IAAI;IAC7C;AAEA;;AAEG;IACK,MAAM,GAAA;QACZ,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;YAAE;AAE/C,QAAA,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,OAAO;AAC1E,QAAA,MAAM,SAAS,GAAG,eAAe,CAAC,SAAS;QAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;AAC5C,QAAA,MAAM,eAAe,GAAG,SAAS,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;;;;AAIhF,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,eAAe,CAAC,YAAY,CAAC;QAE9E,MAAM,WAAW,GAAG,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC;;;;;;;AAQ3C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,GAAG,cAAc,CAAC;AAC9D,QAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC,EAAE,YAAY,CAAC;AACzE,QAAA,IAAI,SAAS,GAAG,WAAW,IAAI,SAAS,GAAG,CAAC;AAAE,YAAA,eAAe,CAAC,SAAS,GAAG,kBAAkB;;AAG5F,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,kBAAkB,GAAG,QAAQ,CAAC;AAC1D,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,kBAAkB,GAAG,cAAc,GAAG,QAAQ,CAAC;QAEnF,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,OAAO,CAAC;AACzD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,wBAAwB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;;QAGnF,IAAI,UAAU,KAAK,IAAI,CAAC,cAAc,IAAI,QAAQ,KAAK,IAAI,CAAC,YAAY;YAAE;;;;;;QAO1E,MAAM,KAAK,GAAG,eAAe,CAAC,aAAa,CAAC,OAAO,CAAC;AACpD,QAAA,IAAI,CAAC,KAAK;YAAE;;QAGZ,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC;AAC1C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,CAAC;QAElF,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,SAAS,CAAA,EAAA,CAAI;QAC9C,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,YAAY,CAAA,EAAA,CAAI;;QAGpD,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,IAAI,IAAI,CAAC,CAAC,CAAC;;QAGnF,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,EAAE,QAAQ,CAAC;;AAGlD,QAAA,KAAK,CAAC,SAAS,GAAG,EAAE;;;QAGpB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,eAAe,IAAI;AAClD,QAAA,IAAI,SAAS;AAAE,YAAA,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC;AAC3C,QAAA,IAAI,SAAS,GAAG,CAAC,EAAE;YACjB,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;AAC1C,YAAA,KAAK,CAAC,OAAO,GAAG,UAAU;YAC1B,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,SAAS,IAAI;AACrC,YAAA,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG;AACzB,YAAA,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;AAC3B,YAAA,IAAI,CAAC,SAAS,CAAC,SAAS,GAAG,EAAE;AAC7B,YAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC;AACjC,YAAA,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC;QACnC;AACA,QAAA,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC;;;AAG3B,QAAA,IAAI,SAAS,KAAK,CAAC,EAAE;YACnB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,eAAe,IAAI;AAClD,YAAA,IAAI,SAAS;AAAE,gBAAA,KAAK,CAAC,WAAW,CAAC,SAAS,CAAC;QAC7C;AACA,QAAA,IAAI,YAAY,GAAG,CAAC,EAAE;YACpB,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC;AAC7C,YAAA,QAAQ,CAAC,OAAO,GAAG,UAAU;YAC7B,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,CAAA,EAAG,YAAY,IAAI;AAC3C,YAAA,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG;AAC5B,YAAA,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;AAC9B,YAAA,IAAI,CAAC,YAAY,CAAC,SAAS,GAAG,EAAE;AAChC,YAAA,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,QAAQ,CAAC;AACvC,YAAA,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC;QACtC;;QAEA,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,IAAI;AACxD,QAAA,IAAI,YAAY;AAAE,YAAA,KAAK,CAAC,WAAW,CAAC,YAAY,CAAC;;;;AAKjD,QAAA,IAAI,CAAC,cAAc,GAAG,UAAU;AAChC,QAAA,IAAI,CAAC,YAAY,GAAG,QAAQ;AAC5B,QAAA,IAAI,CAAC,OAAO,CAAC,WAAW,IAAI;IAC9B;;IAGA,eAAe,GAAA;AACb,QAAA,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE;IAC/D;AAEA;;;;;AAKG;AACH,IAAA,WAAW,CAAC,KAAa,EAAA;AACvB,QAAA,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,eAAe;YAAE;AACnC,QAAA,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;QACnE,IAAI,CAAC,OAAO,EAAE;IAChB;;AAGA,IAAA,aAAa,CAAC,KAAa,EAAA;AACzB,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;IACzB;;IAGA,iBAAiB,GAAA;AACf,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,eAAe;AACvC,QAAA,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,SAAS,IAAI,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,UAAU,IAAI,CAAC,EAAE;IAC/D;IAEA,SAAS,GAAA;QACP,OAAO,IAAI,CAAC,OAAO;IACrB;AAEQ,IAAA,cAAc,CAAC,KAAa,EAAA;QAClC,MAAM,UAAU,GAAG,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,KAAK;cACjD,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK;AAC9B,cAAE,IAAI,CAAC,OAAO,CAAC,SAAS;AAC1B,QAAA,OAAO,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,UAAU,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC;IACvE;AAEQ,IAAA,YAAY,CAAC,SAAiB,EAAA;AACpC,QAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,KAAK,SAAS,GAAG,CAAC,EAAE;YAChF,OAAO,IAAI,CAAC,OAAO;QACrB;QACA,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC;AACvC,QAAA,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC;AACnB,QAAA,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,SAAS,EAAE,KAAK,EAAE,EAAE;YAC9C,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;QAC5E;AACA,QAAA,IAAI,CAAC,gBAAgB,GAAG,SAAS;QACjC,OAAO,IAAI,CAAC,OAAO;IACrB;IAEQ,iBAAiB,GAAA;AACvB,QAAA,IAAI,CAAC,OAAO,GAAG,EAAE;AACjB,QAAA,IAAI,CAAC,gBAAgB,GAAG,EAAE;IAC5B;AAEQ,IAAA,cAAc,CAAC,KAAa,EAAA;QAClC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;AACpE,QAAA,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC;IAChE;;IAGQ,eAAe,CAAC,OAAiB,EAAE,MAAc,EAAA;AACvD,QAAA,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC;QACpC,IAAI,SAAS,IAAI,CAAC;AAAE,YAAA,OAAO,CAAC;QAC5B,IAAI,GAAG,GAAG,CAAC;QACX,IAAI,IAAI,GAAG,SAAS;AACpB,QAAA,OAAO,GAAG,GAAG,IAAI,EAAE;AACjB,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,CAAC;AACxC,YAAA,IAAI,OAAO,CAAC,GAAG,GAAG,CAAC,CAAC,IAAI,MAAM;AAAE,gBAAA,GAAG,GAAG,GAAG,GAAG,CAAC;;gBACxC,IAAI,GAAG,GAAG;QACjB;QACA,OAAO,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,GAAG,CAAC;IACjC;;IAGQ,wBAAwB,CAAC,OAAiB,EAAE,MAAc,EAAA;QAChE,IAAI,GAAG,GAAG,CAAC;AACX,QAAA,IAAI,IAAI,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC;AAC7B,QAAA,OAAO,GAAG,GAAG,IAAI,EAAE;AACjB,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,CAAC;AACxC,YAAA,IAAI,OAAO,CAAC,GAAG,CAAC,GAAG,MAAM;AAAE,gBAAA,GAAG,GAAG,GAAG,GAAG,CAAC;;gBACnC,IAAI,GAAG,GAAG;QACjB;AACA,QAAA,OAAO,GAAG;IACZ;AACD;;;;"}

package/dist/components/theme/theme.css

@@ -129,6 +129,11 @@
   --snice-color-overlay-hover: hsl(0 0% 0% / 0.04);
   --snice-color-overlay-selected: hsl(var(--snice-color-blue-500) / 0.08);
   --snice-color-overlay-selected-hover: hsl(var(--snice-color-blue-500) / 0.12);
+  /* Zebra tint for alternating rows. Not a surface step: a solid surface token
+     lands within a couple of luminance points of the body on ONE of the two
+     themes and the striping disappears there. An alpha tint is tuned per
+     theme, and composites over pinned/selected/tinted cells alike. */
+  --snice-color-overlay-stripe: hsl(0 0% 0% / 0.02);
 
   --snice-color-primary-subtle: hsl(var(--snice-color-blue-50));
   --snice-color-primary-subtle-hover: hsl(var(--snice-color-blue-100));
@@ -342,6 +347,9 @@
   --snice-color-overlay-hover: hsl(0 0% 100% / 0.06);
   --snice-color-overlay-selected: hsl(var(--snice-color-blue-400) / 0.16);
   --snice-color-overlay-selected-hover: hsl(var(--snice-color-blue-400) / 0.22);
+  /* Dark surfaces need a much larger step than light ones: the same tint
+     that reads as a stripe on white is invisible on near-black. */
+  --snice-color-overlay-stripe: hsl(0 0% 100% / 0.11);
 
   --snice-color-primary-subtle: hsl(var(--snice-color-blue-950));
   --snice-color-primary-subtle-hover: hsl(var(--snice-color-blue-900));
@@ -405,6 +413,7 @@
     --snice-color-border-focus: hsl(var(--snice-color-blue-400));
 
     --snice-color-surface-hover: hsl(var(--snice-color-gray-700));
+    --snice-color-overlay-stripe: hsl(0 0% 100% / 0.11);
     --snice-color-surface-active: hsl(var(--snice-color-gray-600));
     --snice-color-surface-disabled: hsl(var(--snice-color-gray-800));
     --snice-color-text-disabled: hsl(var(--snice-color-gray-600));

package/dist/index.cjs

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/index.iife.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/react/SniceProvider.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/react/SniceRouter.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/react/index.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/react/matchRoute.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/react/useRequestHandler.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/symbols.cjs

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/symbols.esm.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/testing-dom.cjs

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/testing-dom.esm.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/transitions.cjs

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/dist/transitions.esm.js

@@ -1,5 +1,5 @@
 /*!
- * snice v7.7.0
+ * snice v7.8.0
  * A decorator-driven web component library with routing, controllers, daemons, and 130+ UI components. For better coding-agent results, run npx snice init-ai.
  * (c) 2024
  * Released under the MIT License.

package/docs/ai/DEVELOPMENT.md

@@ -35,6 +35,8 @@ npm run generate:react-tests     # Generate test files
 ```bash
 npm test                        # Required complete gate (source+built+browser+site)
 npm run test:source             # Tests importing package sources
+npm run test:matrix             # Component feature-combination matrices (fuzz tier, opt-in)
+npm run test:matrix:visual      # Same matrices in a real browser (on demand, chromium)
 npm run test:distribution       # Fresh build, then same tests against dist/
 npm run test:cdn                # Fresh CDN build + artifact/runtime tests
 npm run test:react              # Fresh adapters + React tests
@@ -52,6 +54,95 @@ npm run gauntlet                # Blind local-model checker gauntlet
 `repeat.ts`, `snice-element.ts`, and `template.ts`; every aggregate metric must
 be strictly greater than 90%. Browser commands manage their own local servers.
 
+## Test Tiers
+
+| Tier | Command | Cost | When |
+|------|---------|------|------|
+| Everyday | `vitest run` / `npm run test:source` | ~26s for `tests/components` | Every change |
+| Matrix (fuzz) | `npm run test:matrix` | Minutes; all components | Any component rendering change; once inside `npm test` |
+| Visual | Playwright (`tests/live`) | Slowest | On request |
+| Visual matrix | `npm run test:matrix:visual` | Minutes; every component's specs in `tests/live/matrix/` | On demand only; never in the gate |
+
+- Canonical layout: `tests/matrix/<component>/*.test.ts` (matrix),
+  `tests/matrix/<component>/smoke.test.ts` (default-loop slice),
+  `tests/matrix/*.ts` (shared oracles),
+  `tests/live/matrix/<component>/<component>-visual.spec.ts` (visual tier),
+  `tests/live/fixtures/<component>/` (fixtures).
+- `vitest.config.ts` `test.exclude` drops `tests/matrix/**/!(smoke).test.ts`
+  from the default include, the same way `tests/live` is dropped. Plain
+  `vitest run` pays for the smoke slices only.
+- `npm run test:matrix` = `vitest run --config vitest.matrix.config.ts`. That
+  config inherits `vitest.config.ts` and replaces `exclude` with the base list
+  minus the matrix pattern (mergeConfig concatenates arrays, so inheriting it
+  would keep the entry that hides the suites). It throws if the base config
+  stops excluding the pattern. Smoke slices run in both tiers — intended.
+- Each `smoke.test.ts` stays IN the default include: one combo per feature
+  family, plus the marquee regressions. Budget a few seconds per component —
+  add new combos to the matrix, not to the smoke file.
+- Helper modules under `tests/matrix/` (`matrix-utils.ts`, the per-slice
+  `*-support.ts`) stay importable from outside; the exclusion removes files
+  from test COLLECTION, not from module resolution.
+- `npm test` runs the matrices as their own `matrix suite` stage, exactly
+  once, source-flavoured (see `tooling/testing/run-full-tests.js`).
+
+## True-Visual Matrix (on demand)
+
+`tests/live/matrix/` — the real-browser twin of `tests/matrix/`.
+happy-dom does no layout, so the DOM matrix owns VALUE truth only; this tier
+owns VISUAL truth.
+
+```bash
+npm run test:matrix:visual                      # chromium only (default)
+npm run test:matrix:visual -- --all-engines     # chromium + firefox + webkit
+npm run test:matrix:visual -- --project=webkit  # explicit engine wins
+npm run test:matrix:visual -- --grep squish     # all other flags pass through
+```
+
+- ON DEMAND. Not in `npm test`; `tests/playwright.config.ts` sets
+  `testIgnore: ['live/matrix/**']` so `test:browser:framework` (targets all of
+  `tests/live`) cannot sweep it in. Own config: `tests/playwright.matrix.config.ts`.
+- Runner `tooling/testing/run-visual-matrix-tests.js` manages vite on :5566 —
+  probes `127.0.0.1` AND `[::1]` (servers bind v6), reuses a listener, kills
+  only a server it started. It then requires the fixture URL to return 200
+  before starting Playwright: a listener is not a server, and a wedged :5566
+  (vite rebuilds components synchronously on source change) otherwise surfaces
+  as hundreds of `net::ERR_ABORTED` specs instead of one clear message.
+- Layout: `tests/live/matrix/<component>/<component>-visual.spec.ts` (the table
+  alone splits into `matrix-{local,remote,marquee}.spec.ts`), each driving
+  `tests/live/fixtures/<component>/matrix.html` (fixtures, NOT showcases). A
+  fixture exposes `window.matrix.mount(combo)` and owns anything
+  carrying functions — column definitions, callbacks — which cannot cross the
+  Playwright boundary.
+- Size the specs to the component: the table is the ceiling, not the template.
+  Its combos are the FULL product `{local,remote}` x 6 pipelines x 3 delivery
+  patterns x 2^5 `{virtualize,height,squish,striped,selectable}` = 1152,
+  generated by `generateCombos()` in `tests/live/matrix/matrix-harness.ts`; a
+  divider's are two dozen. `--all-engines` triples the wall time.
+
+**Two layers per component** (the split is documented in the table harness
+header; every component's specs follow it):
+
+| Layer | Scope | What it asserts |
+|-------|-------|-----------------|
+| 1. geometry + computed style + `elementFromPoint` | every combo, one `page.evaluate` each on a shared open page | the component's own documented visual contract. Table: row/cell boxes disjoint + ascending + contained; squish right edge on the frame's inner edge and ellipsis not mid-glyph clip; sized host filled to bottom; virtual window contiguous between spacers; `striped` = 2 row colours, unstriped = 1; selection checkbox painted at non-zero size; three hit-test probes per visible cell must land inside that cell |
+| 2. real screenshots | a small pinned marquee set (table: 6 combos x 2 colour schemes) | table: striping, loading spinner, empty state, squished right edge, fill row, density — decoded in-browser, judged on WCAG contrast between painted samples; PNGs written to `test-results/matrix-visual/` |
+
+Layer 2 exists because layer 1 cannot tell a colour that DIFFERS from one that
+differs VISIBLY (`striped` once applied correctly while painting two luminance
+points from the dark surface). Keep every marquee set small — screenshots are
+the expensive layer. New combinations go in the layer-1 generator.
+
+**Known defects are pinned, never softened** (`.ai/fuzzing.md` policy). A
+component's specs pin theirs with `test.fail()` and the finding written above
+it — the Playwright counterpart of the DOM matrix's `it.fails`. The table
+harness uses `WAIVERS` in `matrix-harness.ts`, stricter still because one combo reports many
+problems: a waiver names the EXACT message it excuses, every other problem in
+the same combo still fails, and a waiver whose message stops appearing fails
+itself so it must be deleted. Currently pinned there:
+`VISUAL-MATRIX-fill-1` (96 combos) — a local, sized, non-virtualized table that
+renders its body a second time appends an inert filler even though the content
+already overflows the frame.
+
 ## Dumb-Agent Gauntlet
 
 Internal checker hardening: `npm run gauntlet` uses the comprehensive multi-file
@@ -63,7 +154,7 @@ application sample. Focused probes remain available with
 - Auto-downloads pinned llama.cpp + size/SHA-256-pinned GGUFs into `.local/`.
 - Produces blind raw output plus checker, TypeScript, and Vite logs per model.
 - No token/time cap; exact-output repetition is preserved and classified.
-- Full workflow/classification rules: `.ai/gauntlet.md`.
+- Full workflow/classification rules: `.ai/testing.md`.
 
 ## File Structure
 
@@ -140,7 +231,7 @@ All CDN builds use the shared runtime (external `snice` imports). Load `snice-ru
 - IIFE: `.js` + `.min.js`
 - Sourcemaps + README
 
-**Size:** Runtime ~34KB gzip, components ~1-111KB each
+**Size:** Runtime ~34KB gzip, components ~1-118KB each
 
 **Features:**
 - Shared runtime (external snice imports)