material-react-table 1.0.0-beta.1 → 1.0.0-beta.2

package/dist/cjs/body/MRT_EditRowModal.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { MRT_Row, MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> {
     open: boolean;

package/dist/cjs/body/MRT_TableBody.d.ts

@@ -1,8 +1,7 @@
-import { FC, RefObject } from 'react';
+import { FC } from 'react';
 import type { MRT_TableInstance } from '..';
 interface Props {
     table: MRT_TableInstance;
-    tableContainerRef: RefObject<HTMLDivElement>;
 }
 export declare const MRT_TableBody: FC<Props>;
 export {};

package/dist/cjs/buttons/MRT_ColumnPinningButtons.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { MRT_Column, MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> {
     column: MRT_Column<TData>;

package/dist/cjs/buttons/MRT_EditActionButtons.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { MRT_Row, MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> {
     row: MRT_Row<TData>;

package/dist/cjs/buttons/MRT_FullScreenToggleButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from '@mui/material';
 import { MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> extends IconButtonProps {

package/dist/cjs/buttons/MRT_ShowHideColumnsButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from '@mui/material';
 import { MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> extends IconButtonProps {

package/dist/cjs/buttons/MRT_ToggleDensePaddingButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from '@mui/material';
 import { MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> extends IconButtonProps {

package/dist/cjs/buttons/MRT_ToggleFiltersButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from '@mui/material';
 import { MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> extends IconButtonProps {

package/dist/cjs/buttons/MRT_ToggleGlobalFilterButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from '@mui/material';
 import { MRT_TableInstance } from '..';
 interface Props<TData extends Record<string, any> = {}> extends IconButtonProps {

package/dist/cjs/index.js

@@ -1083,7 +1083,7 @@ const MRT_TablePagination = ({ table, position }) => {
                 enableToolbarInternalActions &&
                 !showGlobalFilter
                 ? '3.5rem'
-                : '-0.25rem', position: 'relative', zIndex: 2 }, ((tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx) instanceof Function
+                : undefined, position: 'relative', zIndex: 2 }, ((tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx) instanceof Function
             ? tablePaginationProps.sx(theme)
             : tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx))) })));
 };
@@ -1513,7 +1513,11 @@ const MRT_FilterTextField = ({ header, rangeFilterIndex, table, }) => {
                 if (textFieldProps.inputRef) {
                     textFieldProps.inputRef = inputRef;
                 }
-            }, sx: (theme) => (Object.assign({ p: 0, minWidth: !filterChipLabel ? '120px' : 'auto', width: '100%', '&	.MuiSelect-icon': {
+            }, sx: (theme) => (Object.assign({ p: 0, minWidth: columnDef.filterVariant === 'range'
+                    ? '90px'
+                    : !filterChipLabel
+                        ? '120px'
+                        : 'auto', width: '100%', '&	.MuiSelect-icon': {
                     mr: '1.5rem',
                 } }, ((textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.sx) instanceof Function
                 ? textFieldProps.sx(theme)
@@ -1704,7 +1708,7 @@ const MRT_TableHeadCell = ({ header, table }) => {
         return column.getIsPinned() === 'right' && column.getPinnedIndex() === 0;
     };
     const getTotalRight = () => {
-        return ((table.getRightLeafHeaders().length - 1 - column.getPinnedIndex()) * 150);
+        return ((table.getRightLeafHeaders().length - 1 - column.getPinnedIndex()) * 180);
     };
     const handleDragEnter = (_e) => {
         if (enableGrouping && (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === 'drop-zone') {
@@ -2169,8 +2173,8 @@ const MRT_TableBodyRow = ({ row, rowIndex, table, virtualRow, }) => {
         renderDetailPanel && !row.getIsGrouped() && (React__default["default"].createElement(MRT_TableDetailPanel, { row: row, table: table }))));
 };
 
-const MRT_TableBody = ({ table, tableContainerRef }) => {
-    const { getRowModel, getPrePaginationRowModel, getState, options: { enableGlobalFilterRankedResults, enablePagination, enableRowVirtualization, manualFiltering, manualSorting, muiTableBodyProps, virtualizerInstanceRef, virtualizerProps, }, } = table;
+const MRT_TableBody = ({ table }) => {
+    const { getRowModel, getPrePaginationRowModel, getState, options: { enableGlobalFilterRankedResults, enablePagination, enableRowVirtualization, manualFiltering, manualSorting, muiTableBodyProps, virtualizerInstanceRef, virtualizerProps, }, refs: { tableContainerRef }, } = table;
     const { globalFilter, pagination, sorting } = getState();
     const tableBodyProps = muiTableBodyProps instanceof Function
         ? muiTableBodyProps({ table })
@@ -2311,7 +2315,7 @@ const MRT_TableFooter = ({ table }) => {
             : tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx))) }), getFooterGroups().map((footerGroup) => (React__default["default"].createElement(MRT_TableFooterRow, { footerGroup: footerGroup, key: footerGroup.id, table: table })))));
 };
 
-const MRT_Table = ({ tableContainerRef, table }) => {
+const MRT_Table = ({ table }) => {
     const { getState, options: { enableColumnResizing, enableRowVirtualization, enableStickyHeader, enableTableFooter, enableTableHead, muiTableProps, }, } = table;
     const { isFullScreen } = getState();
     const tableProps = muiTableProps instanceof Function
@@ -2321,7 +2325,7 @@ const MRT_Table = ({ tableContainerRef, table }) => {
             ? tableProps.sx(theme)
             : tableProps === null || tableProps === void 0 ? void 0 : tableProps.sx))) }),
         enableTableHead && React__default["default"].createElement(MRT_TableHead, { table: table }),
-        React__default["default"].createElement(MRT_TableBody, { tableContainerRef: tableContainerRef, table: table }),
+        React__default["default"].createElement(MRT_TableBody, { table: table }),
         enableTableFooter && React__default["default"].createElement(MRT_TableFooter, { table: table })));
 };
 
@@ -2356,7 +2360,7 @@ const MRT_TableContainer = ({ table }) => {
             : tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.sx))), style: Object.assign({ maxHeight: isFullScreen
                 ? `calc(100vh - ${totalToolbarHeight}px)`
                 : undefined }, tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.style) }),
-        React__default["default"].createElement(MRT_Table, { tableContainerRef: tableContainerRef, table: table })));
+        React__default["default"].createElement(MRT_Table, { table: table })));
 };
 
 const MRT_TablePaper = ({ table }) => {
@@ -2534,9 +2538,9 @@ const MRT_TableRoot = (props) => {
         props.tableInstanceRef.current = table;
     }
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(material.Dialog, { PaperComponent: material.Box, TransitionComponent: material.Grow, disablePortal: true, fullScreen: true, keepMounted: false, onClose: () => setIsFullScreen(false), open: isFullScreen, transitionDuration: 400 },
+        React__default["default"].createElement(material.Dialog, { PaperComponent: material.Box, TransitionComponent: material.Grow, disablePortal: true, fullScreen: true, keepMounted: false, onClose: () => table.setIsFullScreen(false), open: table.getState().isFullScreen, transitionDuration: 400 },
             React__default["default"].createElement(MRT_TablePaper, { table: table })),
-        !isFullScreen && React__default["default"].createElement(MRT_TablePaper, { table: table }),
+        !table.getState().isFullScreen && React__default["default"].createElement(MRT_TablePaper, { table: table }),
         editingRow && props.editingMode === 'modal' && (React__default["default"].createElement(MRT_EditRowModal, { row: editingRow, table: table, open: true }))));
 };