react-glide-table 1.3.0 → 1.4.1

package/README.md

@@ -69,6 +69,7 @@ export function Products({ data }: { data: Product[] }) {
 | ---------------------------------------------------- | --------------------------------------------------------------------------------- |
 | `classNames`                                         | Per-part Tailwind/utility classes (`root`, `scroll`, `row`, `cell`, `toolbar`, …) |
 | `slots.Toolbar`                                      | Top summary / actions region                                                      |
+| `slots.Scroll`                                       | Scroll container (must attach `scrollRef` to the real overflow element)           |
 | `slots.Row`                                          | Full row replacement (cells, selection, edit UI)                                  |
 | `slots.Pending` / `slots.Empty`                      | Loading and empty states                                                          |
 | `className` / column `className` / `headerClassName` | Extra class hooks                                                                 |
@@ -84,6 +85,8 @@ Example: `row: "data-[selected]:bg-blue-600"`.
 
 Row-level UI → `slots.Row`. Cell content → `Column.render`. Header/Cell are not separate slots.
 
+`slots.Scroll` receives `{ scrollRef, className, children }`. Attach `scrollRef` to the element that owns overflow scrolling — virtualization depends on it. Styling-only changes can stay on `classNames.scroll`.
+
 ## Escape hatch (`useGlideTable`)
 
 ```tsx
@@ -253,7 +256,7 @@ Contiguous same-side freezes share one island (shadow only on the outer boundary
 | `DEFAULT_DATA_TABLE_LABELS` / `resolveDataTableLabels`                                | `/core`     | Optional English UI copy helpers                                  |
 | Tree field defaults                                                                   | `/core`     | `id` / `parentId` / `children` / `qty`                            |
 
-Root `react-glide-table` re-exports both surfaces. Related types: `TableProps`, `TableColumnProps`, `DataTableProps`, `DataTableSlots`, `TableCompoundComponent`, `ColumnDef`, `RowsPastePayload`, `PasteMode`, …
+Root `react-glide-table` re-exports both surfaces. Related types: `TableProps`, `TableColumnProps`, `DataTableProps`, `DataTableSlots`, `DataTableScrollSlotProps`, `TableCompoundComponent`, `ColumnDef`, `RowsPastePayload`, `PasteMode`, …
 
 ## Notable constraints
 

package/dist/compound.cjs

@@ -1131,6 +1131,7 @@ function DataTableRow({
             "data-merged": isMerged && cellIndex > 0 ? "" : void 0,
             "data-merged-edge-right": showMergedRightEdge ? "" : void 0,
             "data-merged-row-first": isMerged && cellIndex === 0 && showMergedRightEdge ? "" : void 0,
+            "data-selected": !enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-selected": enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-hovered": enableRowSpan && showCellHover && !showCellSelected ? "" : void 0,
             "data-selection-fill": isCellDragSelected ? "" : void 0,
@@ -2296,6 +2297,13 @@ function useGlideTable(options) {
 
 // src/components/ui/table/components/DataTable/DataTable.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
+function DefaultScroll({
+  scrollRef,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
+}
 function DefaultPending({
   loadingText,
   className,
@@ -2364,6 +2372,7 @@ function DataTable({
     clearHover
   } = useGlideTable(glideOptions);
   const ToolbarSlot = slots?.Toolbar ?? DataTableToolbar;
+  const ScrollSlot = slots?.Scroll ?? DefaultScroll;
   const RowSlot = slots?.Row ?? DataTableRow;
   const PendingSlot = slots?.Pending ?? DefaultPending;
   const EmptySlot = slots?.Empty ?? DefaultEmpty;
@@ -2406,7 +2415,7 @@ function DataTable({
             classNames
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", classNames?.scroll), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
           "table",
           {
             className: cn("data-table", classNames?.table),

package/dist/compound.d.cts

@@ -1,14 +1,15 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
-import { h as DataTableProps, T as TableColumnProps, k as TableProps } from './types-B4uHdkrY.cjs';
-export { b as ColumnFreezeMeta, d as ColumnFreezeSide, e as DataTableClassNames, g as DataTableLabels, i as DataTableSlots, P as PasteMode, R as RowSelectionMode, j as RowsPastePayload } from './types-B4uHdkrY.cjs';
+import { h as DataTableProps, T as TableColumnProps, l as TableProps } from './types-CHQnBz91.cjs';
+export { b as ColumnFreezeMeta, d as ColumnFreezeSide, e as DataTableClassNames, g as DataTableLabels, i as DataTableScrollSlotProps, j as DataTableSlots, P as PasteMode, R as RowSelectionMode, k as RowsPastePayload } from './types-CHQnBz91.cjs';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
 
 /**
  * Unstyled DataTable shell: semantic HTML + interaction behavior.
  * Class hooks (`DataTableJSX`, `data-table`, …) are opt-in — no CSS is shipped.
  * Customize via `className`, `classNames` (Tailwind-friendly part map), column
- * `className` / `headerClassName`, `labels`, `summary` / `toolbar`, `Column.render`, and `slots`.
+ * `className` / `headerClassName`, `labels`, `summary` / `toolbar`, `Column.render`, and `slots`
+ * (`Toolbar`, `Scroll`, `Row`, `Pending`, `Empty`).
  */
 declare function DataTable<T extends Record<string, unknown>>({ isPending, summary, toolbar, filteredCount, totalCount, className, classNames, slots, ...glideOptions }: DataTableProps<T>): react.JSX.Element;
 

package/dist/compound.d.ts

@@ -1,14 +1,15 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
-import { h as DataTableProps, T as TableColumnProps, k as TableProps } from './types-B4uHdkrY.js';
-export { b as ColumnFreezeMeta, d as ColumnFreezeSide, e as DataTableClassNames, g as DataTableLabels, i as DataTableSlots, P as PasteMode, R as RowSelectionMode, j as RowsPastePayload } from './types-B4uHdkrY.js';
+import { h as DataTableProps, T as TableColumnProps, l as TableProps } from './types-CHQnBz91.js';
+export { b as ColumnFreezeMeta, d as ColumnFreezeSide, e as DataTableClassNames, g as DataTableLabels, i as DataTableScrollSlotProps, j as DataTableSlots, P as PasteMode, R as RowSelectionMode, k as RowsPastePayload } from './types-CHQnBz91.js';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
 
 /**
  * Unstyled DataTable shell: semantic HTML + interaction behavior.
  * Class hooks (`DataTableJSX`, `data-table`, …) are opt-in — no CSS is shipped.
  * Customize via `className`, `classNames` (Tailwind-friendly part map), column
- * `className` / `headerClassName`, `labels`, `summary` / `toolbar`, `Column.render`, and `slots`.
+ * `className` / `headerClassName`, `labels`, `summary` / `toolbar`, `Column.render`, and `slots`
+ * (`Toolbar`, `Scroll`, `Row`, `Pending`, `Empty`).
  */
 declare function DataTable<T extends Record<string, unknown>>({ isPending, summary, toolbar, filteredCount, totalCount, className, classNames, slots, ...glideOptions }: DataTableProps<T>): react.JSX.Element;
 

package/dist/compound.js

@@ -1103,6 +1103,7 @@ function DataTableRow({
             "data-merged": isMerged && cellIndex > 0 ? "" : void 0,
             "data-merged-edge-right": showMergedRightEdge ? "" : void 0,
             "data-merged-row-first": isMerged && cellIndex === 0 && showMergedRightEdge ? "" : void 0,
+            "data-selected": !enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-selected": enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-hovered": enableRowSpan && showCellHover && !showCellSelected ? "" : void 0,
             "data-selection-fill": isCellDragSelected ? "" : void 0,
@@ -2279,6 +2280,13 @@ function useGlideTable(options) {
 
 // src/components/ui/table/components/DataTable/DataTable.tsx
 import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function DefaultScroll({
+  scrollRef,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx5("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
+}
 function DefaultPending({
   loadingText,
   className,
@@ -2347,6 +2355,7 @@ function DataTable({
     clearHover
   } = useGlideTable(glideOptions);
   const ToolbarSlot = slots?.Toolbar ?? DataTableToolbar;
+  const ScrollSlot = slots?.Scroll ?? DefaultScroll;
   const RowSlot = slots?.Row ?? DataTableRow;
   const PendingSlot = slots?.Pending ?? DefaultPending;
   const EmptySlot = slots?.Empty ?? DefaultEmpty;
@@ -2389,7 +2398,7 @@ function DataTable({
             classNames
           }
         ),
-        /* @__PURE__ */ jsx5("div", { ref: scrollRef, className: cn("data-table-scroll", classNames?.scroll), children: /* @__PURE__ */ jsxs4(
+        /* @__PURE__ */ jsx5(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ jsxs4(
           "table",
           {
             className: cn("data-table", classNames?.table),

package/dist/core.d.cts

@@ -1,5 +1,5 @@
-import { p as CellEditType, e as DataTableClassNames, R as RowSelectionMode, c as ColumnFreezeOffset, h as DataTableProps, g as DataTableLabels, f as DataTableCopyActions, P as PasteMode, j as RowsPastePayload } from './types-B4uHdkrY.cjs';
-export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, l as buildColumnFreezeOffsets, m as getColumnFreezeEdgeAttr, n as getColumnFreezeStyle, r as resolveColumnFreezeSide, o as resolveDataTableLabels } from './types-B4uHdkrY.cjs';
+import { q as CellEditType, e as DataTableClassNames, R as RowSelectionMode, c as ColumnFreezeOffset, h as DataTableProps, g as DataTableLabels, f as DataTableCopyActions, P as PasteMode, k as RowsPastePayload } from './types-CHQnBz91.cjs';
+export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, m as buildColumnFreezeOffsets, n as getColumnFreezeEdgeAttr, o as getColumnFreezeStyle, r as resolveColumnFreezeSide, p as resolveDataTableLabels } from './types-CHQnBz91.cjs';
 import { Row, ColumnDef, Table, Updater, RowSelectionState } from '@tanstack/react-table';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
 import { Virtualizer, VirtualItem } from '@tanstack/react-virtual';

package/dist/core.d.ts

@@ -1,5 +1,5 @@
-import { p as CellEditType, e as DataTableClassNames, R as RowSelectionMode, c as ColumnFreezeOffset, h as DataTableProps, g as DataTableLabels, f as DataTableCopyActions, P as PasteMode, j as RowsPastePayload } from './types-B4uHdkrY.js';
-export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, l as buildColumnFreezeOffsets, m as getColumnFreezeEdgeAttr, n as getColumnFreezeStyle, r as resolveColumnFreezeSide, o as resolveDataTableLabels } from './types-B4uHdkrY.js';
+import { q as CellEditType, e as DataTableClassNames, R as RowSelectionMode, c as ColumnFreezeOffset, h as DataTableProps, g as DataTableLabels, f as DataTableCopyActions, P as PasteMode, k as RowsPastePayload } from './types-CHQnBz91.js';
+export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, m as buildColumnFreezeOffsets, n as getColumnFreezeEdgeAttr, o as getColumnFreezeStyle, r as resolveColumnFreezeSide, p as resolveDataTableLabels } from './types-CHQnBz91.js';
 import { Row, ColumnDef, Table, Updater, RowSelectionState } from '@tanstack/react-table';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';
 import { Virtualizer, VirtualItem } from '@tanstack/react-virtual';

package/dist/index.cjs

@@ -2137,6 +2137,7 @@ function DataTableRow({
             "data-merged": isMerged && cellIndex > 0 ? "" : void 0,
             "data-merged-edge-right": showMergedRightEdge ? "" : void 0,
             "data-merged-row-first": isMerged && cellIndex === 0 && showMergedRightEdge ? "" : void 0,
+            "data-selected": !enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-selected": enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-hovered": enableRowSpan && showCellHover && !showCellSelected ? "" : void 0,
             "data-selection-fill": isCellDragSelected ? "" : void 0,
@@ -2365,6 +2366,13 @@ function DataTableToolbar({
 
 // src/components/ui/table/components/DataTable/DataTable.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
+function DefaultScroll({
+  scrollRef,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
+}
 function DefaultPending({
   loadingText,
   className,
@@ -2433,6 +2441,7 @@ function DataTable({
     clearHover
   } = useGlideTable(glideOptions);
   const ToolbarSlot = slots?.Toolbar ?? DataTableToolbar;
+  const ScrollSlot = slots?.Scroll ?? DefaultScroll;
   const RowSlot = slots?.Row ?? DataTableRow;
   const PendingSlot = slots?.Pending ?? DefaultPending;
   const EmptySlot = slots?.Empty ?? DefaultEmpty;
@@ -2475,7 +2484,7 @@ function DataTable({
             classNames
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { ref: scrollRef, className: cn("data-table-scroll", classNames?.scroll), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
           "table",
           {
             className: cn("data-table", classNames?.table),

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, c as ColumnFreezeOffset, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, e as DataTableClassNames, f as DataTableCopyActions, g as DataTableLabels, h as DataTableProps, i as DataTableSlots, P as PasteMode, R as RowSelectionMode, j as RowsPastePayload, T as TableColumnProps, k as TableProps, l as buildColumnFreezeOffsets, m as getColumnFreezeEdgeAttr, n as getColumnFreezeStyle, r as resolveColumnFreezeSide, o as resolveDataTableLabels } from './types-B4uHdkrY.cjs';
+export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, c as ColumnFreezeOffset, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, e as DataTableClassNames, f as DataTableCopyActions, g as DataTableLabels, h as DataTableProps, i as DataTableScrollSlotProps, j as DataTableSlots, P as PasteMode, R as RowSelectionMode, k as RowsPastePayload, T as TableColumnProps, l as TableProps, m as buildColumnFreezeOffsets, n as getColumnFreezeEdgeAttr, o as getColumnFreezeStyle, r as resolveColumnFreezeSide, p as resolveDataTableLabels } from './types-CHQnBz91.cjs';
 export { CELL_SELECTION_EDGES_CLASS, CellSelectionBounds, ColumnRowSpanMap, CopyRowEntry, CopySelectionMode, DEFAULT_TREE_CHILDREN_FIELD, DEFAULT_TREE_ID_FIELD, DEFAULT_TREE_PARENT_ID_FIELD, DEFAULT_TREE_QTY_FIELD, DragState, EditingCell, RowSpanInfo, TreeRow, UseConvertTreeDataParams, UseGlideTableOptions, UseGlideTableResult, applyCellEdit, applyFillData, applySelectionUpdater, buildColumnRowSpanMap, buildRowsPastePayload, canExpandRow, collectCopyRowEntries, collectCopyRows, collectFillChanges, collectRowSpanColumns, flattenSubtreeRows, getCellEditDraftValue, getCellSelectionEdgeStyle, getColumnEditType, getColumnSizeStyle, getRowIndexInMergedCell, hasCellSelectionEdges, isCellInSelection, isColumnEditable, isEditablePasteTarget, measureMergedSpanRowHeights, parseCellEditValue, parseClipboardTSV, parseClipboardTSVWithDepths, resolvePasteColumnIds, resolveRowSelection, resolveRowSpanAt, rowRangeToHeightRatios, serializeCopyRowsToTSV, serializeSelectionToTSV, toggleExpandedRowId, useCellEdit, useCellSelection, useConvertTreeData, useGlideTable, writeSelectionToClipboard } from './core.cjs';
 export { DataTable, Table, TableCompoundComponent, createTable } from './compound.cjs';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, c as ColumnFreezeOffset, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, e as DataTableClassNames, f as DataTableCopyActions, g as DataTableLabels, h as DataTableProps, i as DataTableSlots, P as PasteMode, R as RowSelectionMode, j as RowsPastePayload, T as TableColumnProps, k as TableProps, l as buildColumnFreezeOffsets, m as getColumnFreezeEdgeAttr, n as getColumnFreezeStyle, r as resolveColumnFreezeSide, o as resolveDataTableLabels } from './types-B4uHdkrY.js';
+export { C as ColumnFreezeColumnInput, a as ColumnFreezeEdgeSide, b as ColumnFreezeMeta, c as ColumnFreezeOffset, d as ColumnFreezeSide, D as DEFAULT_DATA_TABLE_LABELS, e as DataTableClassNames, f as DataTableCopyActions, g as DataTableLabels, h as DataTableProps, i as DataTableScrollSlotProps, j as DataTableSlots, P as PasteMode, R as RowSelectionMode, k as RowsPastePayload, T as TableColumnProps, l as TableProps, m as buildColumnFreezeOffsets, n as getColumnFreezeEdgeAttr, o as getColumnFreezeStyle, r as resolveColumnFreezeSide, p as resolveDataTableLabels } from './types-CHQnBz91.js';
 export { CELL_SELECTION_EDGES_CLASS, CellSelectionBounds, ColumnRowSpanMap, CopyRowEntry, CopySelectionMode, DEFAULT_TREE_CHILDREN_FIELD, DEFAULT_TREE_ID_FIELD, DEFAULT_TREE_PARENT_ID_FIELD, DEFAULT_TREE_QTY_FIELD, DragState, EditingCell, RowSpanInfo, TreeRow, UseConvertTreeDataParams, UseGlideTableOptions, UseGlideTableResult, applyCellEdit, applyFillData, applySelectionUpdater, buildColumnRowSpanMap, buildRowsPastePayload, canExpandRow, collectCopyRowEntries, collectCopyRows, collectFillChanges, collectRowSpanColumns, flattenSubtreeRows, getCellEditDraftValue, getCellSelectionEdgeStyle, getColumnEditType, getColumnSizeStyle, getRowIndexInMergedCell, hasCellSelectionEdges, isCellInSelection, isColumnEditable, isEditablePasteTarget, measureMergedSpanRowHeights, parseCellEditValue, parseClipboardTSV, parseClipboardTSVWithDepths, resolvePasteColumnIds, resolveRowSelection, resolveRowSpanAt, rowRangeToHeightRatios, serializeCopyRowsToTSV, serializeSelectionToTSV, toggleExpandedRowId, useCellEdit, useCellSelection, useConvertTreeData, useGlideTable, writeSelectionToClipboard } from './core.js';
 export { DataTable, Table, TableCompoundComponent, createTable } from './compound.js';
 export { ColumnDef, ColumnResizeMode, ColumnSizingState, RowSelectionState } from '@tanstack/react-table';

package/dist/index.js

@@ -2073,6 +2073,7 @@ function DataTableRow({
             "data-merged": isMerged && cellIndex > 0 ? "" : void 0,
             "data-merged-edge-right": showMergedRightEdge ? "" : void 0,
             "data-merged-row-first": isMerged && cellIndex === 0 && showMergedRightEdge ? "" : void 0,
+            "data-selected": !enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-selected": enableRowSpan && showCellSelected ? "" : void 0,
             "data-group-hovered": enableRowSpan && showCellHover && !showCellSelected ? "" : void 0,
             "data-selection-fill": isCellDragSelected ? "" : void 0,
@@ -2301,6 +2302,13 @@ function DataTableToolbar({
 
 // src/components/ui/table/components/DataTable/DataTable.tsx
 import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function DefaultScroll({
+  scrollRef,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx5("div", { ref: scrollRef, className: cn("data-table-scroll", className), children });
+}
 function DefaultPending({
   loadingText,
   className,
@@ -2369,6 +2377,7 @@ function DataTable({
     clearHover
   } = useGlideTable(glideOptions);
   const ToolbarSlot = slots?.Toolbar ?? DataTableToolbar;
+  const ScrollSlot = slots?.Scroll ?? DefaultScroll;
   const RowSlot = slots?.Row ?? DataTableRow;
   const PendingSlot = slots?.Pending ?? DefaultPending;
   const EmptySlot = slots?.Empty ?? DefaultEmpty;
@@ -2411,7 +2420,7 @@ function DataTable({
             classNames
           }
         ),
-        /* @__PURE__ */ jsx5("div", { ref: scrollRef, className: cn("data-table-scroll", classNames?.scroll), children: /* @__PURE__ */ jsxs4(
+        /* @__PURE__ */ jsx5(ScrollSlot, { scrollRef, className: classNames?.scroll, children: /* @__PURE__ */ jsxs4(
           "table",
           {
             className: cn("data-table", classNames?.table),

package/dist/{types-B4uHdkrY.d.cts → types-CHQnBz91.d.cts}

@@ -1,5 +1,5 @@
 import { ColumnDef, RowSelectionState, Updater, ColumnSizingState, OnChangeFn, ColumnResizeMode, Row } from '@tanstack/react-table';
-import { CSSProperties, ReactNode, InputHTMLAttributes, ComponentType } from 'react';
+import { CSSProperties, ReactNode, InputHTMLAttributes, ComponentType, Ref } from 'react';
 
 /** Sticky edge for a frozen column. Does not reorder columns. */
 type ColumnFreezeSide = "left" | "right";
@@ -312,6 +312,17 @@ type DataTableRowSlotProps<T extends Record<string, unknown>> = {
     virtualIndex?: number;
     measureElement?: (node: Element | null) => void;
 };
+/**
+ * Scroll-region slot props for the semantic DataTable shell.
+ *
+ * `scrollRef` must be attached to the element that actually owns overflow
+ * scrolling — row virtualization reads it via `getScrollElement`.
+ */
+type DataTableScrollSlotProps = {
+    children: ReactNode;
+    className?: string;
+    scrollRef: Ref<HTMLDivElement | null>;
+};
 /**
  * Slot replacements for the default DataTable shell (semantic HTML + behavior only).
  * Row-level custom UI → `Row`; cell content → `Table.Column` / column `render`.
@@ -320,6 +331,11 @@ type DataTableRowSlotProps<T extends Record<string, unknown>> = {
 type DataTableSlots<T extends Record<string, unknown>> = {
     /** Top summary / actions region */
     Toolbar?: ComponentType<DataTableToolbarSlotProps>;
+    /**
+     * Table scroll container. Must forward `scrollRef` to the real scroll element
+     * (required for virtualization).
+     */
+    Scroll?: ComponentType<DataTableScrollSlotProps>;
     /** Full row replacement (cells, selection, edit UI) */
     Row?: ComponentType<DataTableRowSlotProps<T>>;
     /** Replace the pending state view */
@@ -374,4 +390,4 @@ type TableProps<T extends Record<string, unknown>> = Omit<DataTableProps<T>, "co
     children: ReactNode;
 };
 
-export { type ColumnFreezeColumnInput as C, DEFAULT_DATA_TABLE_LABELS as D, type PasteMode as P, type RowSelectionMode as R, type TableColumnProps as T, type ColumnFreezeEdgeSide as a, type ColumnFreezeMeta as b, type ColumnFreezeOffset as c, type ColumnFreezeSide as d, type DataTableClassNames as e, type DataTableCopyActions as f, type DataTableLabels as g, type DataTableProps as h, type DataTableSlots as i, type RowsPastePayload as j, type TableProps as k, buildColumnFreezeOffsets as l, getColumnFreezeEdgeAttr as m, getColumnFreezeStyle as n, resolveDataTableLabels as o, type CellEditType as p, resolveColumnFreezeSide as r };
+export { type ColumnFreezeColumnInput as C, DEFAULT_DATA_TABLE_LABELS as D, type PasteMode as P, type RowSelectionMode as R, type TableColumnProps as T, type ColumnFreezeEdgeSide as a, type ColumnFreezeMeta as b, type ColumnFreezeOffset as c, type ColumnFreezeSide as d, type DataTableClassNames as e, type DataTableCopyActions as f, type DataTableLabels as g, type DataTableProps as h, type DataTableScrollSlotProps as i, type DataTableSlots as j, type RowsPastePayload as k, type TableProps as l, buildColumnFreezeOffsets as m, getColumnFreezeEdgeAttr as n, getColumnFreezeStyle as o, resolveDataTableLabels as p, type CellEditType as q, resolveColumnFreezeSide as r };

package/dist/{types-B4uHdkrY.d.ts → types-CHQnBz91.d.ts}

@@ -1,5 +1,5 @@
 import { ColumnDef, RowSelectionState, Updater, ColumnSizingState, OnChangeFn, ColumnResizeMode, Row } from '@tanstack/react-table';
-import { CSSProperties, ReactNode, InputHTMLAttributes, ComponentType } from 'react';
+import { CSSProperties, ReactNode, InputHTMLAttributes, ComponentType, Ref } from 'react';
 
 /** Sticky edge for a frozen column. Does not reorder columns. */
 type ColumnFreezeSide = "left" | "right";
@@ -312,6 +312,17 @@ type DataTableRowSlotProps<T extends Record<string, unknown>> = {
     virtualIndex?: number;
     measureElement?: (node: Element | null) => void;
 };
+/**
+ * Scroll-region slot props for the semantic DataTable shell.
+ *
+ * `scrollRef` must be attached to the element that actually owns overflow
+ * scrolling — row virtualization reads it via `getScrollElement`.
+ */
+type DataTableScrollSlotProps = {
+    children: ReactNode;
+    className?: string;
+    scrollRef: Ref<HTMLDivElement | null>;
+};
 /**
  * Slot replacements for the default DataTable shell (semantic HTML + behavior only).
  * Row-level custom UI → `Row`; cell content → `Table.Column` / column `render`.
@@ -320,6 +331,11 @@ type DataTableRowSlotProps<T extends Record<string, unknown>> = {
 type DataTableSlots<T extends Record<string, unknown>> = {
     /** Top summary / actions region */
     Toolbar?: ComponentType<DataTableToolbarSlotProps>;
+    /**
+     * Table scroll container. Must forward `scrollRef` to the real scroll element
+     * (required for virtualization).
+     */
+    Scroll?: ComponentType<DataTableScrollSlotProps>;
     /** Full row replacement (cells, selection, edit UI) */
     Row?: ComponentType<DataTableRowSlotProps<T>>;
     /** Replace the pending state view */
@@ -374,4 +390,4 @@ type TableProps<T extends Record<string, unknown>> = Omit<DataTableProps<T>, "co
     children: ReactNode;
 };
 
-export { type ColumnFreezeColumnInput as C, DEFAULT_DATA_TABLE_LABELS as D, type PasteMode as P, type RowSelectionMode as R, type TableColumnProps as T, type ColumnFreezeEdgeSide as a, type ColumnFreezeMeta as b, type ColumnFreezeOffset as c, type ColumnFreezeSide as d, type DataTableClassNames as e, type DataTableCopyActions as f, type DataTableLabels as g, type DataTableProps as h, type DataTableSlots as i, type RowsPastePayload as j, type TableProps as k, buildColumnFreezeOffsets as l, getColumnFreezeEdgeAttr as m, getColumnFreezeStyle as n, resolveDataTableLabels as o, type CellEditType as p, resolveColumnFreezeSide as r };
+export { type ColumnFreezeColumnInput as C, DEFAULT_DATA_TABLE_LABELS as D, type PasteMode as P, type RowSelectionMode as R, type TableColumnProps as T, type ColumnFreezeEdgeSide as a, type ColumnFreezeMeta as b, type ColumnFreezeOffset as c, type ColumnFreezeSide as d, type DataTableClassNames as e, type DataTableCopyActions as f, type DataTableLabels as g, type DataTableProps as h, type DataTableScrollSlotProps as i, type DataTableSlots as j, type RowsPastePayload as k, type TableProps as l, buildColumnFreezeOffsets as m, getColumnFreezeEdgeAttr as n, getColumnFreezeStyle as o, resolveDataTableLabels as p, type CellEditType as q, resolveColumnFreezeSide as r };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-glide-table",
-  "version": "1.3.0",
+  "version": "1.4.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/zpxlffjrm/react-glide-table.git"