@svgrid/grid 2.6.21 → 2.6.22

package/dist/SvGrid.controller.svelte.js

@@ -275,9 +275,6 @@ export function createSvGridController(rawProps, domIdBase) {
     let editorSelectAll = true;
     /** Per-column width overrides set by the resize handles. */
     let columnWidths = $state({});
-    let resizingColumnId = $state(null);
-    let resizeStartX = 0;
-    let resizeStartWidth = 0;
     const MIN_COLUMN_WIDTH = 40;
     /** Columns pinned to the left or right edge of the grid (sticky positioning).
      *  Seeded from `props.initialColumnPinning` so demos / tests can show the
@@ -294,7 +291,26 @@ export function createSvGridController(rawProps, domIdBase) {
     let dataStateVersion = $state(0);
     const selectionColumnWidth = 44;
     const rowNumberColumnWidth = $derived(props.rowNumberWidth ?? 56);
-    const showRowNumbersEffective = $derived(props.showRowNumbers ?? false);
+    // A per-row `rowHeight` function already supplies heights, so auto-measuring
+    // would fight it. Fixed numbers are fine - they become the pre-measure estimate.
+    const autoRowHeightOn = $derived(props.autoRowHeight === true && typeof props.rowHeight !== "function");
+    // Auto height measures the row from its content, so a dragged height would be
+    // overwritten on the next measurement pass. Let auto height win rather than
+    // having the two fight.
+    const rowResizeOn = $derived(props.rowResize === true && !autoRowHeightOn);
+    /**
+     * The row-number gutter. Explicit `showRowNumbers` always wins; otherwise
+     * `rowResize` brings it in, because a resizable row needs a row header to
+     * grab - that is where the drag strip lives, and it is where a spreadsheet
+     * puts it. Dragging the edge of a data cell instead works but reads as an
+     * accident.
+     *
+     * Both derived above are declared here rather than beside the rest of the
+     * row-resize state further down: a `$derived` referenced before its
+     * declaration in a .svelte.ts silently compiles to an empty getter, so this
+     * gate would have read `undefined` and the gutter would never appear.
+     */
+    const showRowNumbersEffective = $derived(props.showRowNumbers ?? rowResizeOn);
     let columnMenuFor = $state(null);
     let columnMenuTab = $state("general");
     let columnMenuPos = $state({ x: 0, y: 0 });
@@ -318,11 +334,11 @@ export function createSvGridController(rawProps, domIdBase) {
     let commentEditFor = $state(null);
     let commentDraft = $state("");
     let valueFilters = $state({});
-    const viewportWidth = $derived.by(() => {
+    const viewportWidth = $derived.by(function viewportWidth_d() {
         viewportVersion;
         return scrollContainer ? scrollContainer.clientWidth : 0;
     });
-    const viewportHeight = $derived.by(() => {
+    const viewportHeight = $derived.by(function viewportHeight_d() {
         viewportVersion;
         return scrollContainer ? scrollContainer.clientHeight : 0;
     });
@@ -344,7 +360,7 @@ export function createSvGridController(rawProps, domIdBase) {
         const hb = column.columnDef?.hideBelow;
         return hb != null && viewportWidth > 0 && viewportWidth < hb;
     }
-    const scrollMetrics = $derived.by(() => {
+    const scrollMetrics = $derived.by(function scrollMetrics_d() {
         scrollVersion;
         viewportVersion;
         // Track the virtualizers' versions too so when data loads or row /
@@ -378,7 +394,7 @@ export function createSvGridController(rawProps, domIdBase) {
      *  - virtualizer.getTotalSize(): correct at initial load (before first paint)
      *  - scrollMetrics.scrollHeight: correct after detail rows expand (DOM is live,
      *    ResizeObserver on gridRootEl already bumps scrollVersion at that point) */
-    const hasVerticalOverflow = $derived.by(() => {
+    const hasVerticalOverflow = $derived.by(function hasVerticalOverflow_d() {
         virtualizer.version;
         const virtualizerSize = virtualizer.getTotalSize();
         // scrollMetrics.scrollHeight is 0 before initial paint; once the table
@@ -636,7 +652,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // Declared here rather than beside the other pagination/state derivations:
     // the auto-group column pipeline below reads it, and a `const` used above its
     // declaration is a type error even though `$derived` is lazy enough at runtime.
-    const groupingColumns = $derived.by(() => {
+    const groupingColumns = $derived.by(function groupingColumns_d() {
         gridStateVersion;
         return grid.getState().grouping ?? [];
     });
@@ -657,7 +673,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * any other column. They carry no `field` - their cell content is resolved
      * from the row's group state at render time.
      */
-    const autoGroupColumns = $derived.by(() => {
+    const autoGroupColumns = $derived.by(function autoGroupColumns_d() {
         if (!groupColumnMode)
             return [];
         const sourceById = new Map(grid.getAllColumns().map((c) => [c.id, c]));
@@ -723,7 +739,7 @@ export function createSvGridController(rawProps, domIdBase) {
             depth: columnId === "__autoGroup" ? depth : 0,
         };
     }
-    const allColumns = $derived.by(() => {
+    const allColumns = $derived.by(function allColumns_d() {
         let raw = grid
             .getAllColumns()
             .filter((column) => !hiddenColumns[column.id] &&
@@ -771,7 +787,7 @@ export function createSvGridController(rawProps, domIdBase) {
         return [...left, ...unpinned, ...right];
     });
     /** Header groups reordered to match {@link allColumns}. */
-    const headerGroups = $derived.by(() => {
+    const headerGroups = $derived.by(function headerGroups_d() {
         const base = grid.getHeaderGroups();
         if (!base.length)
             return base;
@@ -797,7 +813,7 @@ export function createSvGridController(rawProps, domIdBase) {
         }
         return [{ id: base[0].id, headers }];
     });
-    const groupHeaderRows = $derived.by(() => {
+    const groupHeaderRows = $derived.by(function groupHeaderRows_d() {
         const userCols = props.columns ?? [];
         // 1. Find max depth in the user-provided column tree.
         function maxDepth(defs) {
@@ -905,7 +921,7 @@ export function createSvGridController(rawProps, domIdBase) {
         return rows;
     });
     /** Cumulative pixel offsets for left- and right-pinned columns. */
-    const pinnedOffsets = $derived.by(() => {
+    const pinnedOffsets = $derived.by(function pinnedOffsets_d() {
         const rowNumberWidth = showRowNumbersEffective ? rowNumberColumnWidth : 0;
         const selectionWidth = showRowSelectionEffective ? selectionColumnWidth : 0;
         const left = {};
@@ -950,7 +966,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const hasConditionalFormats = $derived((props.conditionalFormats?.length ?? 0) > 0);
     // Per-column numeric min/max, needed only by colorScale / dataBar formats.
     // Lazy: this derived never runs unless `conditionalFormats` is set.
-    const conditionalColumnStats = $derived.by(() => {
+    const conditionalColumnStats = $derived.by(function conditionalColumnStats_d() {
         const map = new Map();
         const formats = props.conditionalFormats;
         if (!formats?.length || !formatsNeedingStats(formats))
@@ -990,14 +1006,14 @@ export function createSvGridController(rawProps, domIdBase) {
         }
         return map;
     });
-    const sortDirectionByColumn = $derived.by(() => {
+    const sortDirectionByColumn = $derived.by(function sortDirectionByColumn_d() {
         gridStateVersion;
         const directions = {};
         for (const column of allColumns)
             directions[column.id] = column.getIsSorted();
         return directions;
     });
-    const paginationState = $derived.by(() => {
+    const paginationState = $derived.by(function paginationState_d() {
         gridStateVersion;
         return grid.getState().pagination ?? { pageIndex: 0, pageSize: 10 };
     });
@@ -1006,7 +1022,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * compute the correct "X to Y of Z" range and total page count when
      * filters reduce the dataset.
      */
-    const allRowsBeforePagination = $derived.by(() => {
+    const allRowsBeforePagination = $derived.by(function allRowsBeforePagination_d() {
         // Depend on dataStateVersion (row-model-affecting store changes) NOT
         // gridStateVersion - so moving the active cell / selection does not force
         // this O(rows) pipeline to re-run. Filter-input state (globalFilter etc.)
@@ -1030,6 +1046,25 @@ export function createSvGridController(rawProps, domIdBase) {
                 .some((cell) => normalizeForFilter(String(cell.getValue() ?? ""), (props.filterLocale ?? props.localization?.locale))
                 .includes(needle)));
         }
+        /**
+         * Resolve a column ONCE and return a reader for it.
+         *
+         * `getRowColumnValue` finds the column with a linear scan over every
+         * column, which is fine for a one-off read and wrong inside a loop over
+         * 100,000 rows - it made each filtered column cost O(rows x columns).
+         * The id is fixed for the life of a filter, so the scan is hoisted here and
+         * the row loop gets a closure that only reads.
+         *
+         * Falls back to the row's own accessor when the id names no column, which
+         * is also what `getRowColumnValue` does - group rows override
+         * `getCellValueByColumnId` to return their aggregate.
+         */
+        const makeColumnReader = (columnId) => {
+            const column = allColumns.find((entry) => entry.id === columnId);
+            return column
+                ? (row) => getColumnBaseValue(row, column)
+                : (row) => row.getCellValueByColumnId(columnId);
+        };
         // A single condition is "active" if it has the value(s) it needs.
         const condActive = (op, value, valueTo) => {
             if (op === "isBlank" || op === "isNotBlank")
@@ -1054,6 +1089,11 @@ export function createSvGridController(rawProps, domIdBase) {
             // become compiled predicates before a single row is tested.
             const compiledMenuFilters = menuFilters.map(([columnId, f]) => ({
                 columnId,
+                // The column, resolved once. `getRowColumnValue` looks it up with a
+                // linear scan of every column, and the id is fixed per filter, so
+                // leaving that inside the row loop made it O(rows x columns) per
+                // filtered column for no reason.
+                readValue: makeColumnReader(columnId),
                 join: f.join,
                 a: condActive(f.operator, f.value, f.valueTo)
                     ? compileCond(columnId, f.operator, f.value, f.valueTo)
@@ -1062,8 +1102,8 @@ export function createSvGridController(rawProps, domIdBase) {
                     ? compileCond(columnId, f.operator2, f.value2 ?? "", f.valueTo2)
                     : null,
             }));
-            rows = rows.filter((row) => compiledMenuFilters.every(({ columnId, join, a, b }) => {
-                const cellValue = getRowColumnValue(row, columnId);
+            rows = rows.filter((row) => compiledMenuFilters.every(({ readValue, join, a, b }) => {
+                const cellValue = readValue(row);
                 const ra = a ? a(cellValue) : null;
                 const rb = b ? b(cellValue) : null;
                 if (ra === null)
@@ -1081,10 +1121,11 @@ export function createSvGridController(rawProps, domIdBase) {
             const bucketEntries = valueFilterEntries.map(([columnId, allowed]) => ({
                 columnId,
                 allowed,
+                readValue: makeColumnReader(columnId),
                 buckets: facetBucketsByColumn.get(columnId) ?? null,
             }));
-            rows = rows.filter((row) => bucketEntries.every(({ columnId, allowed, buckets }) => {
-                const raw = getRowColumnValue(row, columnId);
+            rows = rows.filter((row) => bucketEntries.every(({ allowed, buckets, readValue }) => {
+                const raw = readValue(row);
                 if (buckets) {
                     // Range-bucketed filter: find which bucket this row's value
                     // falls into and check whether that bucket's label is allowed.
@@ -1142,7 +1183,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * is active we page by DATA rows and reprint each page's ancestor banners.
      * Null when grouping is off, so the flat path stays a cheap slice.
      */
-    const groupedPage = $derived.by(() => {
+    const groupedPage = $derived.by(function groupedPage_d() {
         if (!paginationEnabled || externalPaginationEnabled)
             return null;
         if (!groupingColumns.length)
@@ -1211,7 +1252,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * the full dataset rather than the current page (see the comment above
      * `_rowModels`).
      */
-    const allRows = $derived.by(() => {
+    const allRows = $derived.by(function allRows_d() {
         const paged = (() => {
             const rows = allRowsBeforePagination;
             // External pagination: `data` already IS the current page - never slice.
@@ -1278,7 +1319,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const paginationTotalRows = $derived(externalPaginationEnabled ? (props.rowCount ?? 0) : paginatedRowTotal);
     const paginationPageIndex = $derived(externalPaginationEnabled ? (props.pageIndex ?? 0) : paginationState.pageIndex);
     const paginationPageSize = $derived(externalPaginationEnabled ? (props.pageSize ?? 10) : paginationState.pageSize);
-    const rowSelectionState = $derived.by(() => {
+    const rowSelectionState = $derived.by(function rowSelectionState_d() {
         gridStateVersion;
         return grid.getState().rowSelection ?? {};
     });
@@ -1331,7 +1372,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const statusBarAggregates = $derived(typeof props.statusBar === "object" && props.statusBar.aggregates
         ? props.statusBar.aggregates
         : ["count", "sum", "avg", "min", "max"]);
-    const statusBarStats = $derived.by(() => {
+    const statusBarStats = $derived.by(function statusBarStats_d() {
         if (!statusBarEnabled)
             return null;
         const a = selectionRange.anchor;
@@ -1390,7 +1431,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const toolPanelEnabled = $derived(props.toolPanel === true);
     // Every column (including hidden ones) in the user's current order, so the
     // panel can toggle/reorder anything. Group columns are flagged live.
-    const toolPanelColumns = $derived.by(() => {
+    const toolPanelColumns = $derived.by(function toolPanelColumns_d() {
         gridStateVersion;
         const all = grid.getAllColumns();
         if (!userColumnOrder.length)
@@ -1428,7 +1469,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // reveals. `a11y/grid-announcements.ts` documents what is deliberately left
     // unsaid, and why saying it would make the grid talk over itself.
     /** Data rows before any local filtering - the denominator in "12 of 250". */
-    const unfilteredRowTotal = $derived.by(() => {
+    const unfilteredRowTotal = $derived.by(function unfilteredRowTotal_d() {
         dataStateVersion;
         void internalData;
         return grid.getRowModel().rows.length;
@@ -1506,7 +1547,7 @@ export function createSvGridController(rawProps, domIdBase) {
         props.onPivotModeChange?.(next);
     }
     const pivotActive = $derived(!!pivotConfig && pivotModeOn && hasPivotEngine());
-    const pivotResult = $derived.by(() => {
+    const pivotResult = $derived.by(function pivotResult_d() {
         if (!pivotActive || !pivotConfig)
             return null;
         const engine = getPivotEngine();
@@ -1584,7 +1625,7 @@ export function createSvGridController(rawProps, domIdBase) {
         const h = col.columnDef.header;
         return typeof h === "string" && h ? h : (col.columnDef.field ?? col.id);
     };
-    const chartableColumns = $derived.by(() => {
+    const chartableColumns = $derived.by(function chartableColumns_d() {
         const dims = [];
         const measures = [];
         for (const col of allColumns) {
@@ -1599,7 +1640,7 @@ export function createSvGridController(rawProps, domIdBase) {
         }
         return { dims, measures };
     });
-    const chartColumnDefaults = $derived.by(() => {
+    const chartColumnDefaults = $derived.by(function chartColumnDefaults_d() {
         const { dims, measures } = chartableColumns;
         let dimId = dims[0]?.id ?? null;
         let seriesId = null;
@@ -1972,7 +2013,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // the virtualizer's own (real) numbers take over.
     const preMeasureRowHeight = $derived(typeof props.rowHeight === "number" ? props.rowHeight : 30);
     const preMeasureViewport = $derived(typeof props.containerHeight === "number" ? props.containerHeight : 520);
-    const virtualRows = $derived.by(() => {
+    const virtualRows = $derived.by(function virtualRows_d() {
         virtualizer.version;
         const items = virtualizer.getVirtualItems();
         if (items.length || allRows.length === 0)
@@ -1983,7 +2024,7 @@ export function createSvGridController(rawProps, domIdBase) {
         // only, and it matches what the server produced, so hydration is clean.
         return buildPreMeasureItems(allRows.length, preMeasureRowHeight, preMeasureViewport, props.overscan ?? 8);
     });
-    const virtualRowTotalSize = $derived.by(() => {
+    const virtualRowTotalSize = $derived.by(function virtualRowTotalSize_d() {
         virtualizer.version;
         const size = virtualizer.getTotalSize();
         // Keep the scroll height honest during the pre-measurement render, so the
@@ -2031,7 +2072,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // OWN committed scroll offset - not the live DOM scrollTop - so the spacer
     // shift and the rendered window are always computed from the same state and
     // can never skew by a frame (which would jitter at extreme scale).
-    const rowOffsetAdjustment = $derived.by(() => {
+    const rowOffsetAdjustment = $derived.by(function rowOffsetAdjustment_d() {
         if (!rowScrollScalingActive)
             return 0;
         virtualizer.version;
@@ -2042,11 +2083,11 @@ export function createSvGridController(rawProps, domIdBase) {
     // virtualRowStart / virtualRowBottomSpacer.
     const rowTopSpacer = $derived(Math.max(virtualRowStart - rowOffsetAdjustment, 0));
     const rowBottomSpacer = $derived(Math.max(rowDomTotalSize - (virtualRowEnd - rowOffsetAdjustment), 0));
-    const virtualColumns = $derived.by(() => {
+    const virtualColumns = $derived.by(function virtualColumns_d() {
         columnVirtualizerVersion;
         return columnVirtualizer.getVirtualItems();
     });
-    const virtualColumnTotalSize = $derived.by(() => {
+    const virtualColumnTotalSize = $derived.by(function virtualColumnTotalSize_d() {
         columnVirtualizerVersion;
         return columnVirtualizer.getTotalSize();
     });
@@ -2061,7 +2102,7 @@ export function createSvGridController(rawProps, domIdBase) {
             return item;
         });
     };
-    const renderedColumnItems = $derived.by(() => {
+    const renderedColumnItems = $derived.by(function renderedColumnItems_d() {
         if (!columnVirtualizationEnabled)
             return allColumnItems();
         // Column virtualization is ON by default and its virtualizer, like the row
@@ -2107,7 +2148,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const renderedColumns = $derived.by(() => renderedColumnItems
         .map((item) => ({ item, column: allColumns[item.index] }))
         .filter(hasRenderedColumn));
-    const totalColumnWidth = $derived.by(() => {
+    const totalColumnWidth = $derived.by(function totalColumnWidth_d() {
         if (columnVirtualizationEnabled)
             return virtualColumnTotalSize;
         let total = 0;
@@ -2124,7 +2165,7 @@ export function createSvGridController(rawProps, domIdBase) {
      *  column instead is reactive to both `columnWidths` and
      *  `fittedColumnWidths`, so the overflow decision settles in the same
      *  render where fit-scaling lands - no race, no scrollbar flash. */
-    const hasHorizontalOverflow = $derived.by(() => {
+    const hasHorizontalOverflow = $derived.by(function hasHorizontalOverflow_d() {
         const fixedCols = (showRowNumbersEffective ? rowNumberColumnWidth : 0) +
             (showRowSelectionEffective ? selectionColumnWidth : 0);
         let total = fixedCols;
@@ -2150,7 +2191,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * everything stays pixel-aligned. When virtualization is off this is a
      * pass-through.
      */
-    const groupHeaderRowsWindowed = $derived.by(() => {
+    const groupHeaderRowsWindowed = $derived.by(function groupHeaderRowsWindowed_d() {
         const base = groupHeaderRows;
         if (!columnVirtualizationEnabled || base.length === 0)
             return base;
@@ -2176,11 +2217,11 @@ export function createSvGridController(rawProps, domIdBase) {
             return { ...row, cells };
         });
     });
-    const activeCell = $derived.by(() => {
+    const activeCell = $derived.by(function activeCell_d() {
         gridStateVersion;
         return (grid.getState().activeCell ?? { rowIndex: 0, colIndex: 0, cellId: null });
     });
-    const activeDescendantId = $derived.by(() => {
+    const activeDescendantId = $derived.by(function activeDescendantId_d() {
         const active = activeCell;
         const inRows = active.rowIndex >= 0 && active.rowIndex < allRows.length;
         const inCols = active.colIndex >= 0 && active.colIndex < allColumns.length;
@@ -2222,7 +2263,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * `null` above the cell limit - that case stays on the rAF-deferred effect,
      * which keeps a huge grid painting before it totals.
      */
-    const eagerSummaries = $derived.by(() => {
+    const eagerSummaries = $derived.by(function eagerSummaries_d() {
         if (!summarize)
             return null;
         if (!rowSummariesEnabled)
@@ -2375,10 +2416,37 @@ export function createSvGridController(rawProps, domIdBase) {
     // is the reactive signal instead, bumped only when a height actually changes.
     const measuredRowHeights = new Map();
     let autoRowHeightVersion = $state(0);
-    // A per-row `rowHeight` function already supplies heights, so auto-measuring
-    // would fight it. Fixed numbers are fine - they become the pre-measure estimate.
-    const autoRowHeightOn = $derived(props.autoRowHeight === true && typeof props.rowHeight !== "function");
     const autoRowHeightFallback = $derived(typeof props.rowHeight === "number" ? props.rowHeight : 30);
+    // ----- Interactive row resize (`rowResize` prop) -----
+    // Heights the user has dragged, by row index. A plain Map plus a version
+    // counter, exactly like `measuredRowHeights` above and for the same reason:
+    // the reset effect below has to read this collection to know whether there is
+    // anything to clear, and if the collection were reactive that read would make
+    // every resize re-trigger the reset and wipe the height it just stored.
+    const rowResizeHeights = new Map();
+    let rowResizeVersion = $state(0);
+    function setRowResizeHeight(index, height) {
+        if (!rowResizeOn || !Number.isFinite(index) || height <= 0)
+            return;
+        rowResizeHeights.set(index, Math.round(height));
+        rowResizeVersion += 1;
+    }
+    /** A user-dragged height for this row, or undefined when it has not been
+     *  resized. Read by the view AND by the virtualizer's `estimateSize`. */
+    function rowResizeHeightPx(index) {
+        return rowResizeOn ? rowResizeHeights.get(index) : undefined;
+    }
+    // A row index means a different row once the data changes, so keeping the
+    // heights would size new rows by the old ones - the same reasoning as the
+    // measured-height reset below.
+    $effect(() => {
+        void allRows.length;
+        void internalData;
+        if (rowResizeHeights.size === 0)
+            return;
+        rowResizeHeights.clear();
+        rowResizeVersion += 1;
+    });
     /** Report a row's measured height. Called by the view's measuring action.
      *  Sub-pixel churn is ignored so a fractional layout can't loop. */
     function reportRowHeight(index, height) {
@@ -2450,11 +2518,19 @@ export function createSvGridController(rawProps, domIdBase) {
         // the estimate for rows that have not rendered yet. Touch the version so a
         // new measurement re-runs this effect (the Map itself is not reactive).
         autoRowHeightVersion;
-        const estimateSize = autoRowHeightOn
+        // Touch the version so a resize re-runs this effect: the virtualizer has to
+        // know the new size or every row below the resized one is positioned
+        // against a stale offset.
+        rowResizeVersion;
+        const base = autoRowHeightOn
             ? (index) => measuredRowHeights.get(index) ?? autoRowHeightFallback
             : typeof rh === "function"
                 ? rh
                 : (rh ?? 30);
+        const estimateSize = rowResizeOn
+            ? (index) => rowResizeHeights.get(index) ??
+                (typeof base === "function" ? base(index) : base)
+            : base;
         virtualizer.setOptions({
             count: allRows.length,
             estimateSize,
@@ -2552,7 +2628,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // Lets the resolver answer from cache without re-invoking the source, so an
     // async source fires one request per row instead of one per render.
     const asyncEditorColumns = new Set();
-    const headerSelectionState = $derived.by(() => {
+    const headerSelectionState = $derived.by(function headerSelectionState_d() {
         gridStateVersion;
         const selectable = allRows.filter((row) => !isGroupRow(row));
         if (!selectable.length)
@@ -2585,7 +2661,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * Returns `null` when fit scaling is not in effect (off, no room, total
      * already >= target). Callers then fall back to the base width.
      */
-    const fittedColumnWidths = $derived.by(() => {
+    const fittedColumnWidths = $derived.by(function fittedColumnWidths_d() {
         // Track viewport size (not scrollVersion) so we don't recompute on
         // every scroll - only when the container actually resizes.
         viewportVersion;
@@ -2650,12 +2726,10 @@ export function createSvGridController(rawProps, domIdBase) {
         widths[lastId] = Math.max(MIN_COLUMN_WIDTH, scalableTarget - runningSum);
         return widths;
     });
-    let resizePendingWidth = 0;
-    let resizeRaf = null;
     /** Where the fill handle should render: the bottom-right cell of the
      *  selection range (or the active cell if there's no range). Returns
      *  null when cell selection is off or there is no anchored selection. */
-    const fillHandleCell = $derived.by(() => {
+    const fillHandleCell = $derived.by(function fillHandleCell_d() {
         if (!(props.enableCellSelection ?? false))
             return null;
         const anchor = selectionRange.anchor;
@@ -2699,7 +2773,7 @@ export function createSvGridController(rawProps, domIdBase) {
      *  reused by both the facet UI and the row filter. Computing them lazily
      *  in a $derived means columns with no filter menu open and no active
      *  filter never pay the iteration cost. */
-    const facetBucketsByColumn = $derived.by(() => {
+    const facetBucketsByColumn = $derived.by(function facetBucketsByColumn_d() {
         const map = new Map();
         for (const column of allColumns) {
             const meta = isBucketableColumn(column);
@@ -2786,7 +2860,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const EMPTY_FACETS = [];
     const EMPTY_FACET_SET = new Set();
     let facetCache = null;
-    const columnMenuFacetValues = $derived.by(() => {
+    const columnMenuFacetValues = $derived.by(function columnMenuFacetValues_d() {
         // The funnel popover drives via `filterMenuFor`; the column menu's Filter
         // tab drives via `columnMenuFor`. Support whichever is open.
         const columnId = filterMenuFor ?? columnMenuFor;
@@ -2816,7 +2890,7 @@ export function createSvGridController(rawProps, domIdBase) {
         if (!(filterMenuFor ?? columnMenuFor))
             facetCache = null;
     });
-    const columnMenuVisibleFacets = $derived.by(() => {
+    const columnMenuVisibleFacets = $derived.by(function columnMenuVisibleFacets_d() {
         const query = columnMenuSearch.trim().toLowerCase();
         if (!query)
             return columnMenuFacetValues;
@@ -2832,7 +2906,7 @@ export function createSvGridController(rawProps, domIdBase) {
      * "everything checked", so that case materializes the set once here rather
      * than every consumer re-deriving it.
      */
-    const columnMenuSelectedFacets = $derived.by(() => {
+    const columnMenuSelectedFacets = $derived.by(function columnMenuSelectedFacets_d() {
         const columnId = filterMenuFor ?? columnMenuFor;
         if (!columnId)
             return EMPTY_FACET_SET;
@@ -2842,7 +2916,7 @@ export function createSvGridController(rawProps, domIdBase) {
     // active chip input, narrowed by whatever the user has typed. Uncapped - the
     // dropdown windows its rows, so a high-cardinality column costs a list of
     // strings, not thousands of nodes.
-    const inSuggestValues = $derived.by(() => {
+    const inSuggestValues = $derived.by(function inSuggestValues_d() {
         if (!inSuggestFor)
             return EMPTY_FACETS;
         const query = inSuggestQuery.trim().toLowerCase();
@@ -2950,12 +3024,6 @@ export function createSvGridController(rawProps, domIdBase) {
         set editorSelectAll(v) { editorSelectAll = v; },
         get columnWidths() { return columnWidths; },
         set columnWidths(v) { columnWidths = v; },
-        get resizingColumnId() { return resizingColumnId; },
-        set resizingColumnId(v) { resizingColumnId = v; },
-        get resizeStartX() { return resizeStartX; },
-        set resizeStartX(v) { resizeStartX = v; },
-        get resizeStartWidth() { return resizeStartWidth; },
-        set resizeStartWidth(v) { resizeStartWidth = v; },
         get MIN_COLUMN_WIDTH() { return MIN_COLUMN_WIDTH; },
         get columnPinning() { return columnPinning; },
         set columnPinning(v) { columnPinning = v; },
@@ -3278,6 +3346,15 @@ export function createSvGridController(rawProps, domIdBase) {
             autoRowHeightVersion;
             return (index) => measuredRowHeights.get(index);
         },
+        /** True when the `rowResize` prop is on and nothing overrides it. */
+        get rowResizeOn() { return rowResizeOn; },
+        /** Record the height the user dragged a row to. */
+        get setRowResizeHeight() { return setRowResizeHeight; },
+        /** A row's dragged height, or undefined when it has not been resized. */
+        get rowResizeHeightPx() {
+            rowResizeVersion;
+            return rowResizeHeightPx;
+        },
         get virtualRowTotalSize() { return virtualRowTotalSize; },
         get virtualRowStart() { return virtualRowStart; },
         get virtualRowEnd() { return virtualRowEnd; },
@@ -3340,13 +3417,6 @@ export function createSvGridController(rawProps, domIdBase) {
         get getColumnBaseWidth() { return getColumnBaseWidth; },
         get fittedColumnWidths() { return fittedColumnWidths; },
         get getColumnWidth() { return getColumnWidth; },
-        get resizePendingWidth() { return resizePendingWidth; },
-        set resizePendingWidth(v) { resizePendingWidth = v; },
-        get resizeRaf() { return resizeRaf; },
-        set resizeRaf(v) { resizeRaf = v; },
-        get startColumnResize() { return startColumnResize; },
-        get onColumnResizeMove() { return onColumnResizeMove; },
-        get endColumnResize() { return endColumnResize; },
         get setSelection() { return setSelection; },
         get extendSelection() { return extendSelection; },
         get isCellInSelectedRange() { return isCellInSelectedRange; },
@@ -3356,6 +3426,15 @@ export function createSvGridController(rawProps, domIdBase) {
         get isInFillPreview() { return isInFillPreview; },
         get fillMarqueeEdges() { return fillMarqueeEdges; },
         get findColumnById() { return findColumnById; },
+        /**
+         * Whether this column may be resized by the user, from its
+         * `ColumnDef.resizable`. Defaults to true, so a column only opts out by
+         * saying so; the grid-wide `columnResize` prop gates all of them above
+         * this. Used by the resize action and by the column menu's Autosize item.
+         */
+        columnResizable(columnId) {
+            return findColumnById(columnId)?.columnDef?.resizable !== false;
+        },
         get readCellRaw() { return readCellRaw; },
         get writeCellRaw() { return writeCellRaw; },
         get applyFillPattern() { return applyFillPattern; },
@@ -3465,7 +3544,7 @@ export function createSvGridController(rawProps, domIdBase) {
     const { cellConditionalFormat, computeRowClass, computeCellClass, computeCellTooltip, computeCellValidity, computeCellNote, getColumnEditorOptions, areEditorOptionsLoading, formatListCellValue, formatCellValue, formatPinnedValue, computePinnedCellClass } = createCellRender(ctx);
     const { isCellEditable, isCellEditableAt, getRowColumnValue, getCellDisplayValue, startEditingWithChar, startEditing, stopEditing, startFullRowEdit, setFullRowDraft, commitFullRowEdit, cancelFullRowEdit, saveEditingCell, applyHistoryStep, updateEditingCellValue, onEditorKeyDown, commitAndMoveByTab, focusOnMount, onCellDoubleClick, pasteFromClipboard, onGridPaste } = createEditing(ctx);
     const { isRowSelected, toggleRowSelectionById, toggleSelectAllRows, setActiveCell, scrollActiveCellIntoView, setSelection, extendSelection, isCellInSelectedRange, getCellRangeEdges, getSelectionRects, isInFillPreview, fillMarqueeEdges, findColumnById, onCellPointerDown, onCellPointerEnter, endDragSelection, onWindowPointerMove, onCellClick, emitCellDoubleClick } = createSelection(ctx);
-    const { cellPinStyle, isColumnPinned, getCurrentColumnOrder, emitColumnOrder, setColumnOrderInternal, applyColumnDrop, onColumnHeaderDragStart, onColumnHeaderDragOver, onColumnHeaderDragLeave, onColumnHeaderDrop, onColumnHeaderDragEnd, pinColumnLeft, pinColumnRight, unpinColumn, toggleColumnVisibleInPanel, moveColumnInPanel, toggleGroupInPanel, getColumnBaseWidth, getColumnWidth, startColumnResize, onColumnResizeMove, endColumnResize, measureText, autosizeColumn, autosizeAllColumns, resetColumns } = createColumns(ctx);
+    const { cellPinStyle, isColumnPinned, getCurrentColumnOrder, emitColumnOrder, setColumnOrderInternal, applyColumnDrop, onColumnHeaderDragStart, onColumnHeaderDragOver, onColumnHeaderDragLeave, onColumnHeaderDrop, onColumnHeaderDragEnd, pinColumnLeft, pinColumnRight, unpinColumn, toggleColumnVisibleInPanel, moveColumnInPanel, toggleGroupInPanel, getColumnBaseWidth, getColumnWidth, measureText, autosizeColumn, autosizeAllColumns, resetColumns } = createColumns(ctx);
     const { onRowDragStart, onRowDragOver, onRowDragLeave, onRowDrop, onRowsContainerDragOver, onRowsContainerDrop, onRowDragEnd, onRowPointerDown, destroyRowDrag } = createRowDrag(ctx);
     const { register: registerAlignedGrid, broadcastScroll: broadcastAlignedScroll, broadcastWidths: broadcastAlignedWidths } = createAlignedGrids(ctx);
     const { buildApi } = createGridApi(ctx);
@@ -3541,7 +3620,6 @@ export function createSvGridController(rawProps, domIdBase) {
     // this grid still owns (#68). Each of these is a no-op when idle.
     $effect(() => {
         return () => {
-            endColumnResize();
             hideTooltip();
             destroyRowDrag();
         };

package/dist/SvGrid.css

@@ -1573,7 +1573,7 @@ select.sv-grid-fr-editor {
   position: relative;
 }
 /* Declarative cell validation (column `validate` hook). Invalid cells get a
- * soft red wash and a red inset ring - Handsontable's `htInvalid` look. The
+ * soft red wash and a red inset ring - the conventional spreadsheet invalid-cell look. The
  * value keeps rendering as-is; the message (if any) shows as the tooltip. */
 .sv-grid-cell-invalid {
   background-color: var(--sg-invalid-bg, rgba(239, 68, 68, 0.14)) !important;