material-react-table 0.19.0-alpha.1 → 0.21.0

package/dist/MaterialReactTable.d.ts

@@ -6,6 +6,7 @@ import { MRT_Localization } from './localization';
 import { MRT_Icons } from './icons';
 import { MRT_FilterFns } from './filtersFns';
 import { MRT_SortingFns } from './sortingFns';
+declare type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 export declare type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<Omit<TableOptions<D>, 'columns' | 'data' | 'initialState' | 'state' | 'expandRowsFn'>> & {
     columns: MRT_ColumnDef<D>[];
     data: D[];
@@ -105,7 +106,7 @@ export declare type MRT_ColumnDef<D extends Record<string, any> = {}> = Omit<Col
      *
      * @example accessorKey: 'username'
      */
-    accessorKey?: keyof D;
+    accessorKey?: LiteralUnion<string & keyof D>;
     /**
      * Specify what type of column this is. Either `data`, `display`, or `group`. Defaults to `data`.
      * Leave this blank if you are just creating a normal data column.
@@ -131,12 +132,14 @@ export declare type MRT_ColumnDef<D extends Record<string, any> = {}> = Omit<Col
     header: string;
     /**
      * Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
+     *
      * If you have also specified an `accessorFn`, MRT still needs to have a valid `id` to be able to identify the column uniquely.
+     *
      * `id` defaults to the `accessorKey` or `header` if not specified.
      *
      * @default gets set to the same value as `accessorKey` by default
      */
-    id?: string;
+    id?: LiteralUnion<string & keyof D>;
     muiTableBodyCellCopyButtonProps?: ButtonProps | (({ table, cell, }: {
         table: MRT_TableInstance<D>;
         cell: MRT_Cell<D>;

package/dist/material-react-table.cjs.development.js

@@ -7263,13 +7263,20 @@ var MRT_TableBody = function MRT_TableBody(_ref) {
     return enablePagination ? getRowModel().rows : getPrePaginationRowModel().rows;
   }, [enableGlobalFilterRankedResults, enableGlobalFilterRankedResults && globalFilter || !enablePagination ? getPrePaginationRowModel().rows : getRowModel().rows, globalFilter]);
   var rowVirtualizer = enableRowVirtualization ? useVirtual(_extends({
-    overscan: density === 'compact' ? 20 : 10,
-    size: rows.length,
-    parentRef: tableContainerRef
+    // estimateSize: () => (density === 'compact' ? 25 : 50),
+    overscan: density === 'compact' ? 30 : 10,
+    parentRef: tableContainerRef,
+    size: rows.length
   }, virtualizerProps)) : {};
-  var virtualRows = rowVirtualizer.virtualItems;
-  var paddingTop = (virtualRows == null ? void 0 : virtualRows.length) > 0 ? virtualRows[0].start : 0;
-  var paddingBottom = (virtualRows == null ? void 0 : virtualRows.length) > 0 ? rowVirtualizer.totalSize - virtualRows[virtualRows.length - 1].end : 0;
+  var virtualRows = enableRowVirtualization ? rowVirtualizer.virtualItems : [];
+  var paddingTop = 0;
+  var paddingBottom = 0;
+
+  if (enableRowVirtualization) {
+    paddingTop = virtualRows.length > 0 ? virtualRows[0].start : 0;
+    paddingBottom = virtualRows.length > 0 ? rowVirtualizer.totalSize - virtualRows[virtualRows.length - 1].end : 0;
+  }
+
   return React__default.createElement(material.TableBody, Object.assign({}, tableBodyProps), enableRowVirtualization && paddingTop > 0 && React__default.createElement("tr", null, React__default.createElement("td", {
     style: {
       height: paddingTop + "px"