@svgrid/grid 3.0.4 → 3.0.6

package/dist/grid-icons.d.ts

@@ -35,8 +35,8 @@ export type GridIconName = 'sort' | 'sort-asc' | 'sort-desc' | 'filter' | 'menu'
 export type GridIcons = Partial<Record<GridIconName, Snippet>>;
 /**
  * Icons whose built-in form is a character rather than an SVG path. Kept as
- * data so `<SvGrid>`, its footer and the standalone `SvRowGroupPanel` render
- * the same defaults instead of three copies drifting apart.
+ * data so `<SvGrid>`, its footer and the row-group panel in @svgrid/enterprise
+ * render the same defaults instead of three copies drifting apart.
  *
  * Each is the exact character that shipped inline before, so a grid that sets
  * no `icons` renders byte-for-byte what it always did.

package/dist/grid-icons.js

@@ -1,7 +1,7 @@
 /**
  * Icons whose built-in form is a character rather than an SVG path. Kept as
- * data so `<SvGrid>`, its footer and the standalone `SvRowGroupPanel` render
- * the same defaults instead of three copies drifting apart.
+ * data so `<SvGrid>`, its footer and the row-group panel in @svgrid/enterprise
+ * render the same defaults instead of three copies drifting apart.
  *
  * Each is the exact character that shipped inline before, so a grid that sets
  * no `icons` renders byte-for-byte what it always did.

package/dist/grid-messages.d.ts

@@ -74,8 +74,18 @@ export type GridChromeMessages = {
     bulkEditCancel: string;
     bulkEditNoFields: string;
     chartRange: string;
+    rowLoadFailed: string;
+    rowLoadRetry: string;
+    expandGroup: string;
+    collapseGroup: string;
+    openDetail: string;
+    closeDetail: string;
     pivotUpsellTitle: string;
     pivotUpsellBody: string;
+    ganttUpsellTitle: string;
+    ganttUpsellBody: string;
+    /** Placeholder in the Gantt view's search box. */
+    ganttSearchPlaceholder: string;
     /** Shared licensing line under every Enterprise upsell note. */
     upsellLicense: string;
     upsellLicenseLink: string;

package/dist/grid-messages.js

@@ -84,8 +84,17 @@ export const defaultGridMessages = {
     opBefore: 'Before',
     opAfter: 'After',
     chartRange: 'Chart selected range',
+    rowLoadFailed: 'Could not load these rows.',
+    rowLoadRetry: 'Retry',
+    expandGroup: 'Expand group',
+    collapseGroup: 'Collapse group',
+    openDetail: 'Open details',
+    closeDetail: 'Close details',
     pivotUpsellTitle: 'Pivot mode',
     pivotUpsellBody: 'Pivot mode is an Enterprise feature. Install @svgrid/enterprise and call enablePivot() to use it.',
+    ganttUpsellTitle: 'Gantt view',
+    ganttUpsellBody: 'The Gantt view is an Enterprise feature. Install @svgrid/enterprise and call enableGanttView() to render it.',
+    ganttSearchPlaceholder: 'Search tasks...',
     upsellLicense: 'A license key is required for production use. Without one the feature still works, but the grid renders an unlicensed watermark.',
     upsellLicenseLink: 'View licensing',
 };

package/dist/headless.d.ts

@@ -27,3 +27,8 @@ export { columnFilteringFeature, columnGroupingFeature, createCoreRowModel, crea
 export { createGrid, createSvGrid, type SvelteGrid } from './createGrid.svelte.js';
 export { createGridState, createSvGridState } from './createGridState.svelte.js';
 export { subscribeGrid, subscribeSvGrid } from './subscribe.js';
+export { createVirtualizer } from './virtualization/virtualizer.js';
+export { createSvelteVirtualizer } from './virtualization/svelte-virtualizer.svelte.js';
+export { createColumnVirtualizer } from './virtualization/column-virtualizer.js';
+export type { VirtualItem, VirtualizerOptions, VirtualizerState } from './virtualization/types.js';
+export { getGridCellDomId, getGridCellA11yProps, getGridHeaderA11yProps, getGridRootA11yProps, getGridRowA11yProps, type GridCellA11yInput, type GridColumnA11yInput, type GridSortDirection, } from './a11y.js';

package/dist/headless.js

@@ -27,3 +27,15 @@ export { columnFilteringFeature, columnGroupingFeature, createCoreRowModel, crea
 export { createGrid, createSvGrid } from './createGrid.svelte.js';
 export { createGridState, createSvGridState } from './createGridState.svelte.js';
 export { subscribeGrid, subscribeSvGrid } from './subscribe.js';
+// The virtualizers are pure window arithmetic (scroll offset in, visible
+// range out) with no DOM of their own, and a custom renderer over 50k rows
+// needs one. They were only on the barrel, so the Headless demos imported
+// the barrel to reach them and paid for the whole thing.
+export { createVirtualizer } from './virtualization/virtualizer.js';
+export { createSvelteVirtualizer } from './virtualization/svelte-virtualizer.svelte.js';
+export { createColumnVirtualizer } from './virtualization/column-virtualizer.js';
+// The WAI-ARIA attribute factories: plain objects to spread onto your own
+// markup (`role`, `aria-sort`, `aria-rowindex`, ...). No DOM is touched here
+// either; a custom renderer that wants keyboard navigation reads
+// `activeCell` from the store and spreads these.
+export { getGridCellDomId, getGridCellA11yProps, getGridHeaderA11yProps, getGridRootA11yProps, getGridRowA11yProps, } from './a11y.js';

package/dist/history.d.ts

@@ -38,6 +38,15 @@ export type HistoryStep = {
         undo: () => void;
         redo: () => void;
     };
+    /**
+     * The consumer's own mark on the step, copied from `api.setHistoryTag` at
+     * the moment it is recorded. The grid never reads it: it is there for a
+     * consumer that shows one of several data sets through the grid and has
+     * to know which one a step belongs to before it lets Ctrl+Z apply it (a
+     * workbook with several sheets, say). Kept as given, so an object tag
+     * compares by identity. Not serialised.
+     */
+    tag?: unknown;
 };
 /** Ctx surface these helpers touch. The controller satisfies it structurally. */
 type HistoryCtx = {
@@ -49,8 +58,20 @@ type HistoryCtx = {
      *  inside it joins that group, so a command does not have to thread a group
      *  id down through the writers it calls. */
     historyGroupId: string | undefined;
+    /** Stamped on every step recorded while it is set; see `HistoryStep.tag`. */
+    historyTag?: unknown;
     applyHistoryStep(step: HistoryStep, direction: 'undo' | 'redo'): void;
 };
+/** What the next undo would apply: the tag of the step Ctrl+Z takes next
+ *  (a group carries one tag, so its last step's is the group's). Null when
+ *  there is nothing to undo. */
+export declare function peekUndoHistory(ctx: HistoryCtx): {
+    tag: unknown;
+} | null;
+/** The redo counterpart of `peekUndoHistory`. */
+export declare function peekRedoHistory(ctx: HistoryCtx): {
+    tag: unknown;
+} | null;
 /** Undo one action. Returns false when there is nothing left to undo. */
 export declare function undoHistory(ctx: HistoryCtx): boolean;
 /** Redo one action. Returns false when there is nothing left to redo. */

package/dist/history.js

@@ -41,6 +41,34 @@ function groupEnd(history, start) {
         i += 1;
     return i;
 }
+/**
+ * The last `limit` ACTIONS of a history, whole groups kept. The cap used
+ * to count steps, and a sort of 5,000 rows is 20,000 steps in one group:
+ * it cut the group to its last 200 cells, so Ctrl+Z put a fifth of a
+ * column back and left the rest sorted. An action is one press of Ctrl+Z,
+ * so that is what the buffer counts; the steps inside are the cost of it.
+ */
+function lastActions(history, limit) {
+    let i = history.length;
+    let actions = 0;
+    while (i > 0 && actions < limit) {
+        i = groupStart(history, i - 1);
+        actions += 1;
+    }
+    return i === 0 ? history : history.slice(i);
+}
+/** What the next undo would apply: the tag of the step Ctrl+Z takes next
+ *  (a group carries one tag, so its last step's is the group's). Null when
+ *  there is nothing to undo. */
+export function peekUndoHistory(ctx) {
+    const step = ctx.historyPtr >= 0 ? ctx.history[ctx.historyPtr] : undefined;
+    return step ? { tag: step.tag } : null;
+}
+/** The redo counterpart of `peekUndoHistory`. */
+export function peekRedoHistory(ctx) {
+    const step = ctx.historyPtr < ctx.history.length - 1 ? ctx.history[ctx.historyPtr + 1] : undefined;
+    return step ? { tag: step.tag } : null;
+}
 /** Undo one action. Returns false when there is nothing left to undo. */
 export function undoHistory(ctx) {
     if (ctx.historyPtr < 0)
@@ -94,11 +122,13 @@ export function pushHistory(ctx, steps, groupId) {
     // Outside one, a group of one is just a step. Tagging it would make undo do
     // the same work through a slower path and would show up in serialized state.
     const id = ctx.historyGroupId ?? (groupId && steps.length > 1 ? groupId : undefined);
+    const tag = ctx.historyTag;
     let next = ctx.history.slice(0, ctx.historyPtr + 1);
-    for (const step of steps)
-        next.push(id ? { ...step, groupId: id } : step);
-    if (next.length > ctx.UNDO_LIMIT)
-        next = next.slice(next.length - ctx.UNDO_LIMIT);
+    for (const step of steps) {
+        const stamped = tag === undefined ? step : { ...step, tag };
+        next.push(id ? { ...stamped, groupId: id } : stamped);
+    }
+    next = lastActions(next, ctx.UNDO_LIMIT);
     ctx.history = next;
     ctx.historyPtr = ctx.history.length - 1;
     ctx.historyVersion += 1;

package/dist/index.d.ts

@@ -12,6 +12,8 @@ export * from './ai.js';
 export { registerExportProvider, getExportProvider, type GridExportProvider, type GridExportRunOptions, } from './export-provider.js';
 export type { SchedulerConfig, SchedulerDrawerConfig, SchedulerEventMoveEvent, SchedulerEventResizeEvent, SchedulerEventCommitEvent, SchedulerRangeSelection, SchedulerView, SchedulerResource, SchedulerCollisionMode, SchedulerException, SchedulerEditScope, SchedulerOccurrenceChangeEvent, } from './SvGrid.types.js';
 export { registerSchedulerView, getSchedulerView, hasSchedulerView } from './scheduler-view.svelte.js';
+export type { GanttConfig, GanttDrawerConfig, GanttTaskMoveEvent, GanttTaskResizeEvent, GanttProgressChangeEvent, GanttTaskCommitEvent, GanttDependency, GanttDependencyType, GanttZoom, } from './SvGrid.types.js';
+export { registerGanttView, getGanttView, hasGanttView } from './gantt-view.svelte.js';
 export { registerSelectionBarView, getSelectionBarView, hasSelectionBarView } from './selection-bar-view.svelte.js';
 export type { ChartViewConfig } from './SvGrid.types.js';
 export { registerChartView, getChartView, hasChartView } from './chart-view.svelte.js';
@@ -211,10 +213,9 @@ export { resolveColumnTypes, inferCellDataType, type CellDataType } from './colu
 export { computeColumnGroupMeta, hiddenLeavesForCollapse, type ColumnGroupMeta, type ColumnGroupShow, } from './column-groups.js';
 export { createHyperFormulaSheet, type HyperFormulaSheet, type HyperFormulaSheetConfig, type HyperFormulaInstance, } from './hyperformula-adapter.js';
 export { createCollaboration, broadcastChannelTransport, type CollabUser, type CollabCell, type CollabPresence, type CollabMessage, type CollabTransport, type Collaboration, } from './collaboration.js';
-export { createServerDataSource, type ServerDataSource, type ServerRequest, type ServerResult, type ServerController, type ServerState, type ServerSortModel, type ServerFilterModel, type ServerAggregation, type ServerGroupRow, type ServerLeafRow, type ServerMoreRow, type ServerFooterRow, type ServerSkeletonRow, type ServerDisplayRow, } from './server-data-source.js';
-export { createServerGroupModel, serverGroupRows, serverGroupNav, type ServerGroupController, type ServerGroupControllerOptions, type ServerGroupState, type ServerGroupGridRow, } from './server-group-model.js';
-export { default as SvGroupCell } from './SvGroupCell.svelte';
-export { default as SvRowGroupPanel } from './SvRowGroupPanel.svelte';
+export { createServerDataSource, type ServerDataSource, type ServerSelectionRule, type ServerRequest, type ServerResult, type ServerController, type ServerControllerOptions, type ServerState, type ServerSortModel, type ServerFilterModel, type ServerAggFn, type ServerAggregation, type ServerGroupRow, type ServerLeafRow, type ServerMoreRow, type ServerFooterRow, type ServerSkeletonRow, type ServerGrandTotalRow, type ServerPlaceholderRow, type ServerDisplayRow, type ServerDetailRow, } from './server-data-source.js';
+export { createBlockCache, createRowPlaceholder, rowPlaceholderState, type BlockCache, type BlockCacheOptions, type BlockCacheState, type BlockFetchResult, type BlockState, } from './server-block-cache.js';
+export { toServerFilterColumns, type GridRowModel, type GridFilterState, type GridRowModelSort, } from './row-model.js';
 export { createNamedViews, memoryViews, localStorageViews, attachAutoSavedView, type SavedView, type ViewStorage, type NamedViews, type AutoSavedViewOptions, } from './named-views.js';
 export { resolveCellFormat, computeColumnStat, lerpColor, rgba, contrastText, formatNeedsStats, formatsNeedingStats, type ConditionalFormat, type ConditionalFormatSpec, type ColorScaleFormat, type ColorScaleStop, type ScaleBounds, type DataBarFormat, type IconSetFormat, type RuleFormat, type ResolvedCellFormat, } from './conditional-formatting.js';
 export { defaultGridMessages, resolveGridMessages, type GridMessages, type GridChromeMessages, } from './grid-messages.js';

package/dist/index.js

@@ -15,6 +15,7 @@ export { registerBoardView, getBoardView, hasBoardView } from './board-view.svel
 export * from './ai.js';
 export { registerExportProvider, getExportProvider, } from './export-provider.js';
 export { registerSchedulerView, getSchedulerView, hasSchedulerView } from './scheduler-view.svelte.js';
+export { registerGanttView, getGanttView, hasGanttView } from './gantt-view.svelte.js';
 // Bulk-action bar over the row selection. Prop + types free, renderer Pro.
 export { registerSelectionBarView, getSelectionBarView, hasSelectionBarView } from './selection-bar-view.svelte.js';
 export { registerChartView, getChartView, hasChartView } from './chart-view.svelte.js';
@@ -253,9 +254,8 @@ export { computeColumnGroupMeta, hiddenLeavesForCollapse, } from './column-group
 export { createHyperFormulaSheet, } from './hyperformula-adapter.js';
 export { createCollaboration, broadcastChannelTransport, } from './collaboration.js';
 export { createServerDataSource, } from './server-data-source.js';
-export { createServerGroupModel, serverGroupRows, serverGroupNav, } from './server-group-model.js';
-export { default as SvGroupCell } from './SvGroupCell.svelte';
-export { default as SvRowGroupPanel } from './SvRowGroupPanel.svelte';
+export { createBlockCache, createRowPlaceholder, rowPlaceholderState, } from './server-block-cache.js';
+export { toServerFilterColumns, } from './row-model.js';
 export { createNamedViews, memoryViews, localStorageViews, attachAutoSavedView, } from './named-views.js';
 export { resolveCellFormat, computeColumnStat, lerpColor, rgba, contrastText, formatNeedsStats, formatsNeedingStats, } from './conditional-formatting.js';
 export { defaultGridMessages, resolveGridMessages, } from './grid-messages.js';

package/dist/keyboard-handlers.js

@@ -166,6 +166,28 @@ export function createKeyboard(ctx) {
                 row.toggleExpanded?.();
                 return;
             }
+            // The same key on a server-side tree: a group opens or closes, a leaf
+            // opens or closes its detail panel when the grid draws one.
+            const sg = ctx.props.serverGroup;
+            if (event.ctrlKey && sg && row) {
+                const data = row.original;
+                if (sg.isGroup(data)) {
+                    sg.onToggle(data);
+                    return;
+                }
+                if (sg.toggleDetail && ctx.props.renderDetailRow && (sg.hasDetail?.(data) ?? true)) {
+                    sg.toggleDetail(data);
+                    return;
+                }
+            }
+            // ...and on a client-side master-detail: the app's own toggle.
+            if (event.ctrlKey && row && ctx.props.onDetailToggle && ctx.props.renderDetailRow) {
+                const data = row.original;
+                if (!ctx.props.isDetailRow?.(data, current.rowIndex) && (ctx.props.hasDetail?.(data) ?? true)) {
+                    ctx.props.onDetailToggle(data, current.rowIndex);
+                    return;
+                }
+            }
             if (column?.columnDef.editorType === "checkbox") {
                 ctx.toggleBooleanCell(current.rowIndex, current.colIndex);
                 return;
@@ -257,7 +279,8 @@ export function createKeyboard(ctx) {
         ctx.setSelection(next.rowIndex, next.colIndex);
     }
     function onWindowKeydown(event) {
-        if (event.key === "Escape" && (ctx.columnMenuFor || ctx.operatorMenuFor)) {
+        if (event.key === "Escape" &&
+            (ctx.columnMenuFor || ctx.operatorMenuFor || ctx.filterMenuFor || ctx.inSuggestFor || ctx.chooseColumnsPos)) {
             ctx.closeMenus();
         }
     }

package/dist/keyboard.js

@@ -37,6 +37,10 @@ export function getKeyboardIntent(event) {
     //   Tab        → move right (Shift+Tab → left), wraps at row boundaries
     //   Delete     → clear contents of the selected cells
     //   F2 / Space → start editing the active cell
+    // Ctrl+Enter acts on the row rather than moving: a group opens or closes,
+    // a row with a detail panel shows or hides it (see the activate branch).
+    if (event.key === 'Enter' && (event.ctrlKey || event.metaKey))
+        return 'activate';
     if (event.key === 'Enter')
         return event.shiftKey ? 'moveUp' : 'moveDown';
     if (event.key === 'Tab')

package/dist/row-drag-touch.d.ts

@@ -3,7 +3,7 @@ export type TouchDragDeps = {
     ctx: any;
     managed: () => boolean;
     originalAt: (rowIndex: number) => unknown;
-    commitDropOnRow: (rowIndex: number, side: "before" | "after") => void;
+    commitDropOnRow: (rowIndex: number, side: "before" | "after" | "into") => void;
     clearIndicators: () => void;
     cancelPendingLeave: () => void;
     /** Publish the dragged row on the shared cross-grid bus. */

package/dist/row-drag.js

@@ -98,7 +98,27 @@ export function createRowDrag(ctx) {
             e.dataTransfer.dropEffect = "move";
         const rect = e.currentTarget.getBoundingClientRect();
         ctx.rowDropIndex = rowIndex;
-        ctx.rowDropSide = e.clientY < rect.top + rect.height / 2 ? "before" : "after";
+        ctx.rowDropSide = sideAt(rowIndex, rect, e.clientY);
+    }
+    /**
+     * Which edge the pointer is on. A custom drop handler also gets the middle
+     * of a group or tree row as "into" (the row becomes its child); the
+     * managed reorder only knows before and after.
+     */
+    function sideAt(rowIndex, rect, y) {
+        const rel = (y - rect.top) / Math.max(rect.height, 1);
+        if (ctx.props.onRowDrop && rel >= 0.25 && rel <= 0.75 && canNest(rowIndex))
+            return "into";
+        return rel < 0.5 ? "before" : "after";
+    }
+    function canNest(rowIndex) {
+        const row = ctx.allRows[rowIndex];
+        if (!row)
+            return false;
+        const sg = ctx.props.serverGroup;
+        if (sg)
+            return !!sg.isGroup(row.original);
+        return typeof row.getCanExpand === "function" && row.getCanExpand();
     }
     function onRowDragLeave(rowIndex) {
         // A leave from a row that is not the current target is already stale.
@@ -137,6 +157,15 @@ export function createRowDrag(ctx) {
         const sourceGridId = bus.gridId;
         const sameGrid = sourceGridId === gridId;
         clearIndicators();
+        // A custom handler owns the drop: the grid reports it and leaves its
+        // data alone (a row model's rows are not the grid's to splice).
+        if (sameGrid && ctx.props.onRowDrop) {
+            bus = null;
+            ctx.props.onRowDrop({ row: dragged, target, targetIndex: rowIndex, side });
+            return;
+        }
+        if (side === "into")
+            side = "after";
         const data = ctx.internalData.slice();
         if (sameGrid) {
             const from = data.indexOf(dragged);
@@ -183,6 +212,11 @@ export function createRowDrag(ctx) {
         const sourceGridId = bus.gridId;
         const sameGrid = sourceGridId === gridId;
         clearIndicators();
+        if (sameGrid && ctx.props.onRowDrop) {
+            bus = null;
+            ctx.props.onRowDrop({ row: dragged, target: null, targetIndex: null, side: "after" });
+            return;
+        }
         const data = ctx.internalData.slice();
         if (sameGrid) {
             const from = data.indexOf(dragged);

package/dist/row-model.d.ts

@@ -0,0 +1,139 @@
+/**
+ * `GridRowModel` - one prop instead of eleven.
+ *
+ * A grid backed by a server needs the same wiring every time: hand it the
+ * rows, tell it not to sort or filter locally, forward the sort and the filter
+ * to the backend, report which rows are on screen, say which rows have not
+ * loaded, and delegate selection. Written out by hand that is a dozen props
+ * and a filter-shape conversion that every app gets slightly differently:
+ *
+ * ```svelte
+ * <SvGrid data={s.rows} externalSort externalFilter loading={s.loading}
+ *   onSortingChange={(x) => ctl.setSort(x)}
+ *   onFiltersChange={(f) => ctl.setFilter({ global: f.global,
+ *     columns: Object.fromEntries(f.columns.map((c) => [c.id, { ... }])) })}
+ *   onVisibleRangeChange={(r) => ctl.setViewport(r.startIndex, r.endIndex)}
+ *   ... />
+ * ```
+ *
+ * An object that implements this interface carries all of it, so the same grid
+ * becomes:
+ *
+ * ```svelte
+ * <SvGrid rowModel={ctl} {columns} />
+ * ```
+ *
+ * `createServerDataSource` returns one, and so does the Enterprise server row
+ * model - which is the point of the interface rather than a concrete type: the
+ * grid depends on the SHAPE, never on either implementation, and an app with
+ * its own fetching can satisfy it too.
+ *
+ * Every member except `subscribe` / `getRows` / `isLoading` is optional, and a
+ * prop written explicitly on `<SvGrid>` always wins over the model's answer -
+ * so adopting this is never all-or-nothing.
+ */
+import type { FilterOperator } from './SvGrid.types.js';
+/** The filter state as the grid reports it, straight from `onFiltersChange`. */
+export type GridFilterState = {
+    global: string;
+    columns: Array<{
+        id: string;
+        operator: FilterOperator;
+        value: string;
+        valueTo?: string;
+        selectedValues?: Array<string>;
+    }>;
+};
+/** The sort the grid hands a row model: column id and direction, in priority order. */
+export type GridRowModelSort = Array<{
+    id: string;
+    desc: boolean;
+}>;
+/**
+ * What `<SvGrid rowModel>` consumes: rows, a loading flag, a change
+ * subscription, and whichever optional parts the model implements - sort,
+ * filter, viewport, placeholders, group accessors, selection, filter
+ * values, paging, pinned rows and pivot columns. `createServerDataSource`
+ * and the Enterprise `createServerRowModel` both satisfy it.
+ */
+export type GridRowModel<TData> = {
+    /**
+     * Register a callback for "something changed, re-read me". Returns an
+     * unsubscribe function, which the grid calls on unmount.
+     */
+    subscribe(onChange: () => void): () => void;
+    /** The rows to render, including any placeholders for unloaded ones. */
+    getRows(): ReadonlyArray<TData>;
+    /** True while a fetch is in flight, for the loading overlay. */
+    isLoading(): boolean;
+    /** Stable row id. Required once selection or editing is involved. */
+    getRowId?(row: TData, index: number): string;
+    /** Sort on the server. Present means "do not sort locally". */
+    setSort?(sort: GridRowModelSort): void;
+    /** Filter on the server. Present means "do not filter locally". */
+    setFilter?(filters: GridFilterState): void;
+    /** Which rows are on screen, so a block-loading model knows what to fetch. */
+    setViewport?(startIndex: number, endIndex: number): void;
+    /** Why a row has no data yet, or null when it does. */
+    rowPlaceholder?(row: TData, rowIndex: number): 'loading' | 'failed' | null;
+    /** Retry the failed block a placeholder row belongs to. */
+    retryRow?(row: TData, rowIndex: number): void;
+    /** Group / tree accessors, for the grid's treegrid keyboard and ARIA. */
+    group?: {
+        isGroup: (row: TData) => boolean;
+        level: (row: TData) => number;
+        expanded?: (row: TData) => boolean;
+        onToggle: (row: TData) => void;
+        /** Open or close the detail panel under a leaf. Ctrl+Enter on a row calls it when `renderDetailRow` is set, and so does the `showDetailToggle` chevron. */
+        toggleDetail?: (row: TData) => void;
+        /** Whether the detail under a leaf is open: the chevron's direction. */
+        detailOpen?: (row: TData) => boolean;
+        /** Whether a row can open a detail; the chevron is left out where this is false. */
+        hasDetail?: (row: TData) => boolean;
+    };
+    /** Selection the grid does not own - see the `rowSelectionModel` prop. */
+    selection?: {
+        isSelected: (rowId: string, row: TData) => boolean;
+        headerState: () => 'none' | 'some' | 'all';
+        toggle: (rowId: string, row: TData, next: boolean) => void;
+        toggleAll: (next: boolean) => void;
+        selectedCount?: () => number | null;
+        bulkUpdate?: (patch: Record<string, unknown>) => Promise<number>;
+    };
+    /** Distinct values for a column's set filter, fetched from the server. */
+    filterValues?(columnId: string): Promise<Array<string>>;
+    /** Server-side paging. Omit it for infinite scrolling. */
+    pagination?: {
+        pageIndex: number;
+        pageSize: number;
+        rowCount: number;
+        setPage(pageIndex: number): void;
+        setPageSize(pageSize: number): void;
+        /** Choices for the footer's page-size selector. */
+        pageSizes?: number[];
+        /**
+         * Ask the grid for as many rows as its body fits: it measures and calls
+         * `setPageSize` whenever the fit changes.
+         */
+        autoPageSize?: boolean;
+    };
+    /** Rows to pin above / below the scrolling body - a grand total, say. */
+    readonly pinnedTopRows?: ReadonlyArray<TData>;
+    readonly pinnedBottomRows?: ReadonlyArray<TData>;
+    /**
+     * Columns that replace the grid's `columns` while the model is in pivot
+     * mode, or null. Read after every change notification.
+     */
+    readonly pivotResultColumns?: ReadonlyArray<unknown> | null;
+};
+/**
+ * Turn the grid's filter payload into the column-keyed map a `ServerRequest`
+ * carries. Exported because a hand-written `GridRowModel` needs exactly this
+ * conversion, and copying it is how the two shapes drift apart.
+ */
+export declare function toServerFilterColumns(filters: GridFilterState): Record<string, {
+    operator: string;
+    value: string;
+    valueTo?: string;
+    selectedValues?: Array<string>;
+}>;

package/dist/row-model.js

@@ -0,0 +1,16 @@
+/**
+ * Turn the grid's filter payload into the column-keyed map a `ServerRequest`
+ * carries. Exported because a hand-written `GridRowModel` needs exactly this
+ * conversion, and copying it is how the two shapes drift apart.
+ */
+export function toServerFilterColumns(filters) {
+    return Object.fromEntries(filters.columns.map((c) => [
+        c.id,
+        {
+            operator: c.operator,
+            value: c.value,
+            ...(c.valueTo !== undefined ? { valueTo: c.valueTo } : {}),
+            ...(c.selectedValues !== undefined ? { selectedValues: c.selectedValues } : {}),
+        },
+    ]));
+}

package/dist/row-resize.js

@@ -31,6 +31,19 @@ export function rowResize(node, opts) {
     let drag = null;
     /** The last press on a strip, for telling a double-click from two drags. */
     let lastPress = null;
+    /**
+     * A focusable `role="separator"` is a splitter, and a splitter carries its
+     * position: axe's `aria-required-attr` fails one without `aria-valuenow`,
+     * and a screen reader reading the strip says nothing useful without it. The
+     * value is the row's height in pixels, between the action's min and max.
+     */
+    function setStripValue(strip, height) {
+        const min = current.min ?? 20;
+        const max = current.max ?? 320;
+        strip.setAttribute('aria-valuemin', String(min));
+        strip.setAttribute('aria-valuemax', String(max));
+        strip.setAttribute('aria-valuenow', String(Math.round(Math.max(min, Math.min(max, height || min)))));
+    }
     function rowIndexOf(tr) {
         const dataRow = tr.querySelector('[data-svgrid-row]');
         const val = dataRow?.dataset.svgridRow;
@@ -43,6 +56,7 @@ export function rowResize(node, opts) {
         const max = current.max ?? 320;
         const next = Math.max(min, Math.min(max, drag.startHeight + (e.clientY - drag.startY)));
         drag.trEl.style.height = `${Math.round(next)}px`;
+        setStripValue(drag.strip, next);
         current.onResizeMove?.(drag.rowIndex, Math.round(next));
     }
     function onPointerUp(e) {
@@ -94,6 +108,7 @@ export function rowResize(node, opts) {
         const max = current.max ?? 320;
         const next = Math.round(Math.max(min, Math.min(max, tr.getBoundingClientRect().height + delta)));
         tr.style.height = `${next}px`;
+        setStripValue(t, next);
         current.onResizeMove?.(rowIndex, next);
         current.onResize(rowIndex, next);
     }
@@ -164,8 +179,13 @@ export function rowResize(node, opts) {
                     : null);
             if (!gutter)
                 continue;
-            if (gutter.querySelector(`:scope > .${STRIP_CLASS}`))
+            const already = gutter.querySelector(`:scope > .${STRIP_CLASS}`);
+            if (already) {
+                // The row may have been resized from outside the action (a saved
+                // height, a double-click autofit); keep the separator's value honest.
+                setStripValue(already, tr.getBoundingClientRect().height);
                 continue;
+            }
             // Anchor the strip to the gutter cell + allow it to overflow
             // downward into the row gap so the hit-area straddles the
             // row boundary the way Excel does.
@@ -180,6 +200,7 @@ export function rowResize(node, opts) {
             // A separator used as an interactive splitter has to be focusable so
             // keyboard-only users can reach it and drive `onKeyDown` (#79).
             strip.tabIndex = 0;
+            setStripValue(strip, tr.getBoundingClientRect().height);
             // Inline the geometry + pointer-events so the strip works even
             // before SvGrid.css is parsed; the hover tint still comes from
             // the stylesheet. We keep the strip fully inside the gutter

package/dist/selection.d.ts

@@ -1,9 +1,10 @@
 import { type RowData, type TableFeatures } from "./index.js";
 import "./sv-grid-scrollbar.js";
 export declare function createSelection<TFeatures extends TableFeatures = TableFeatures, TData extends RowData = RowData>(ctx: any): {
-    isRowSelected: (rowId: string) => boolean;
+    isRowSelected: (rowId: string) => any;
     toggleRowSelectionById: (rowId: string) => void;
     toggleSelectAllRows: () => void;
+    setSelectAllRows: (select: boolean) => void;
     setActiveCell: (rowIndex: number, colIndex: number) => void;
     scrollActiveCellIntoView: (rowIndex: number, colIndex: number) => void;
     setSelection: (rowIndex: number, colIndex: number, additive?: boolean) => void;

package/dist/selection.js

@@ -7,14 +7,41 @@ import { getColumnBaseValue, isGroupRow, } from "./cell-values.js";
 import { expandRectToMerges, originOf, endOf } from "./merges.js";
 export function createSelection(ctx) {
     function isRowSelected(rowId) {
+        const model = ctx.props.rowSelectionModel;
+        if (model) {
+            const row = ctx.allRows.find((r) => r.id === rowId);
+            return row ? model.isSelected(rowId, row.original) : false;
+        }
         return Boolean(ctx.rowSelectionState[rowId]);
     }
     function toggleRowSelectionById(rowId) {
+        const model = ctx.props.rowSelectionModel;
+        if (model) {
+            const row = ctx.allRows.find((r) => r.id === rowId);
+            if (!row)
+                return;
+            model.toggle(rowId, row.original, !model.isSelected(rowId, row.original));
+            return;
+        }
         ctx.grid.setRowSelection((prev) => ({ ...prev, [rowId]: !prev[rowId] }));
     }
     function toggleSelectAllRows() {
-        const selectable = ctx.allRows.filter((row) => !isGroupRow(row));
-        const select = ctx.headerSelectionState !== "all";
+        setSelectAllRows(ctx.headerSelectionState !== "all");
+    }
+    /**
+     * Select or clear every row, for the header checkbox and for
+     * `api.selectAllRows()`.
+     */
+    function setSelectAllRows(select) {
+        // An external model decides what "all" means - possibly a million rows
+        // the grid has never seen - so it gets the intent, not a row list.
+        if (ctx.props.rowSelectionModel) {
+            ctx.props.rowSelectionModel.toggleAll(select);
+            return;
+        }
+        // Placeholder rows are excluded: there is no row there to select yet,
+        // and ticking one would leave a selected id that never resolves.
+        const selectable = ctx.allRows.filter((row) => !isGroupRow(row) && !ctx.placeholderStateOf(row));
         ctx.grid.setRowSelection((prev) => {
             const next = { ...prev };
             for (const row of selectable) {
@@ -495,7 +522,7 @@ export function createSelection(ctx) {
         // Also commit a fill-handle drag if one was in progress - the user
         // released the mouse, time to apply the pattern.
         if (ctx.fillDrag)
-            ctx.onFillPointerUp();
+            ctx.onFillPointerUp(event);
         if (ctx.moveDrag)
             ctx.onMovePointerUp(event);
     }
@@ -646,6 +673,7 @@ export function createSelection(ctx) {
         isRowSelected,
         toggleRowSelectionById,
         toggleSelectAllRows,
+        setSelectAllRows,
         setActiveCell,
         scrollActiveCellIntoView,
         setSelection,