material-react-table 1.8.1 → 1.8.3

package/dist/cjs/index.js

@@ -658,15 +658,18 @@ const MRT_FilterOptionMenu = ({ anchorEl, header, onSelect, setAnchorEl, setFilt
             }
             else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === 'multi-select' ||
                 ['arrIncludesSome', 'arrIncludesAll', 'arrIncludes'].includes(option)) {
-                if (currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.length) {
+                if (currentFilterValue instanceof String ||
+                    (currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.length)) {
                     column.setFilterValue([]);
                     setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue([]);
                 }
             }
             else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === 'range' ||
                 ['between', 'betweenInclusive', 'inNumberRange'].includes(option)) {
-                column.setFilterValue(['', '']);
-                setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
+                if (!(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.every((v) => v === ''))) {
+                    column.setFilterValue(['', '']);
+                    setFilterValue === null || setFilterValue === void 0 ? void 0 : setFilterValue('');
+                }
             }
             else {
                 if (!['', undefined].includes(currentFilterValue)) {
@@ -1124,7 +1127,7 @@ const MRT_ToggleRowActionMenuButton = ({ cell, row, table, }) => {
         setEditingRow(Object.assign({}, row));
         setAnchorEl(null);
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null, renderRowActions ? (React__default["default"].createElement(React__default["default"].Fragment, null, renderRowActions({ cell, row, table }))) : row.id === (editingRow === null || editingRow === void 0 ? void 0 : editingRow.id) && editingMode === 'row' ? (React__default["default"].createElement(MRT_EditActionButtons, { row: row, table: table })) : !renderRowActionMenuItems &&
+    return (React__default["default"].createElement(React__default["default"].Fragment, null, renderRowActions ? (renderRowActions({ cell, row, table })) : row.id === (editingRow === null || editingRow === void 0 ? void 0 : editingRow.id) && editingMode === 'row' ? (React__default["default"].createElement(MRT_EditActionButtons, { row: row, table: table })) : !renderRowActionMenuItems &&
         (enableEditing instanceof Function
             ? enableEditing(row)
             : enableEditing) ? (React__default["default"].createElement(Tooltip__default["default"], { placement: "right", arrow: true, title: localization.edit },
@@ -1564,7 +1567,7 @@ const MRT_TableHeadCellColumnActionsButton = ({ header, table, }) => {
 };
 
 const MRT_FilterTextField = ({ header, rangeFilterIndex, table, }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const { options: { enableColumnFilterModes, columnFilterModeOptions, icons: { FilterListIcon, CloseIcon }, localization, manualFiltering, muiTableHeadCellFilterTextFieldProps, }, refs: { filterInputRefs }, setColumnFilterFns, } = table;
     const { column } = header;
     const { columnDef } = column;
@@ -1749,28 +1752,27 @@ const MRT_FilterTextField = ({ header, rangeFilterIndex, table, }) => {
                 ? textFieldProps.sx(theme)
                 : textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.sx))) }),
             (isSelectFilter || isMultiSelectFilter) && (React__default["default"].createElement(MenuItem__default["default"], { divider: true, disabled: true, hidden: true, value: "" },
-                React__default["default"].createElement(Box__default["default"], { sx: { opacity: 0.5 } }, filterPlaceholder))), (_k = columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterSelectOptions) === null || _k === void 0 ? void 0 :
-            _k.map((option) => {
-                var _a;
-                let value;
-                let text;
-                if (typeof option !== 'object') {
-                    value = option;
-                    text = option;
-                }
-                else {
-                    value = option.value;
-                    text = option.text;
-                }
-                return (React__default["default"].createElement(MenuItem__default["default"], { key: value, sx: {
-                        display: 'flex',
-                        m: 0,
-                        alignItems: 'center',
-                        gap: '0.5rem',
-                    }, value: value },
-                    isMultiSelectFilter && (React__default["default"].createElement(Checkbox__default["default"], { checked: ((_a = column.getFilterValue()) !== null && _a !== void 0 ? _a : []).includes(value), sx: { mr: '0.5rem' } })),
-                    text));
-            })),
+                React__default["default"].createElement(Box__default["default"], { sx: { opacity: 0.5 } }, filterPlaceholder))), (_k = textFieldProps.children) !== null && _k !== void 0 ? _k : (_l = columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterSelectOptions) === null || _l === void 0 ? void 0 : _l.map((option) => {
+            var _a;
+            let value;
+            let text;
+            if (typeof option !== 'object') {
+                value = option;
+                text = option;
+            }
+            else {
+                value = option.value;
+                text = option.text;
+            }
+            return (React__default["default"].createElement(MenuItem__default["default"], { key: value, sx: {
+                    display: 'flex',
+                    m: 0,
+                    alignItems: 'center',
+                    gap: '0.5rem',
+                }, value: value },
+                isMultiSelectFilter && (React__default["default"].createElement(Checkbox__default["default"], { checked: ((_a = column.getFilterValue()) !== null && _a !== void 0 ? _a : []).includes(value), sx: { mr: '0.5rem' } })),
+                text));
+        })),
         React__default["default"].createElement(MRT_FilterOptionMenu, { anchorEl: anchorEl, header: header, setAnchorEl: setAnchorEl, table: table, setFilterValue: setFilterValue })));
 };
 
@@ -2126,7 +2128,7 @@ const MRT_TableHead = ({ table, virtualColumns, virtualPaddingLeft, virtualPaddi
 };
 
 const MRT_EditCellTextField = ({ cell, showLabel, table, }) => {
-    var _a, _b;
+    var _a, _b, _c;
     const { getState, options: { muiTableBodyCellEditTextFieldProps }, refs: { editInputRefs }, setEditingCell, setEditingRow, } = table;
     const { column, row } = cell;
     const { columnDef } = column;
@@ -2187,7 +2189,7 @@ const MRT_EditCellTextField = ({ cell, showLabel, table, }) => {
             var _a;
             e.stopPropagation();
             (_a = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.onClick) === null || _a === void 0 ? void 0 : _a.call(textFieldProps, e);
-        }, onBlur: handleBlur, onChange: handleChange, onKeyDown: handleEnterKeyDown }), (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.editSelectOptions) === null || _b === void 0 ? void 0 : _b.map((option) => {
+        }, onBlur: handleBlur, onChange: handleChange, onKeyDown: handleEnterKeyDown }), (_b = textFieldProps.children) !== null && _b !== void 0 ? _b : (_c = columnDef === null || columnDef === void 0 ? void 0 : columnDef.editSelectOptions) === null || _c === void 0 ? void 0 : _c.map((option) => {
         let value;
         let text;
         if (typeof option !== 'object') {
@@ -2751,7 +2753,7 @@ const MRT_Table = ({ table }) => {
             colSizes[`--col-${parseCSSVarId(header.column.id)}-size`] = colSize;
         }
         return colSizes;
-    }, [columns, columnSizing, columnSizingInfo]);
+    }, [columns, columnSizing, columnSizingInfo, columnVisibility]);
     //get first 16 column widths and average them
     const averageColumnWidth = React.useMemo(() => {
         var _a, _b, _c, _d;
@@ -3033,6 +3035,11 @@ const MRT_TableRoot = (props) => {
             tablePaperRef,
             topToolbarRef,
         }, setColumnFilterFns: (_0 = props.onColumnFilterFnsChange) !== null && _0 !== void 0 ? _0 : setColumnFilterFns, setDensity: (_1 = props.onDensityChange) !== null && _1 !== void 0 ? _1 : setDensity, setDraggingColumn: (_2 = props.onDraggingColumnChange) !== null && _2 !== void 0 ? _2 : setDraggingColumn, setDraggingRow: (_3 = props.onDraggingRowChange) !== null && _3 !== void 0 ? _3 : setDraggingRow, setEditingCell: (_4 = props.onEditingCellChange) !== null && _4 !== void 0 ? _4 : setEditingCell, setEditingRow: (_5 = props.onEditingRowChange) !== null && _5 !== void 0 ? _5 : setEditingRow, setGlobalFilterFn: (_6 = props.onGlobalFilterFnChange) !== null && _6 !== void 0 ? _6 : setGlobalFilterFn, setHoveredColumn: (_7 = props.onHoveredColumnChange) !== null && _7 !== void 0 ? _7 : setHoveredColumn, setHoveredRow: (_8 = props.onHoveredRowChange) !== null && _8 !== void 0 ? _8 : setHoveredRow, setIsFullScreen: (_9 = props.onIsFullScreenChange) !== null && _9 !== void 0 ? _9 : setIsFullScreen, setShowAlertBanner: (_10 = props.onShowAlertBannerChange) !== null && _10 !== void 0 ? _10 : setShowAlertBanner, setShowFilters: (_11 = props.onShowFiltersChange) !== null && _11 !== void 0 ? _11 : setShowFilters, setShowGlobalFilter: (_12 = props.onShowGlobalFilterChange) !== null && _12 !== void 0 ? _12 : setShowGlobalFilter, setShowToolbarDropZone: (_13 = props.onShowToolbarDropZoneChange) !== null && _13 !== void 0 ? _13 : setShowToolbarDropZone });
+    if (props.tableFeatures) {
+        props.tableFeatures.forEach((feature) => {
+            Object.assign(table, feature(table));
+        });
+    }
     if (props.tableInstanceRef) {
         props.tableInstanceRef.current = table;
     }