material-react-table 0.8.9 → 0.8.10

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

@@ -373,6 +373,12 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
       currentFilterFns = _getState.currentFilterFns,
       currentGlobalFilterFn = _getState.currentGlobalFilterFn;
 
+  var _ref2 = header != null ? header : {},
+      column = _ref2.column;
+
+  var _ref3 = column != null ? column : {},
+      columnDef = _ref3.columnDef;
+
   var filterOptions = React.useMemo(function () {
     return [{
       option: MRT_FILTER_OPTION.FUZZY,
@@ -430,12 +436,12 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
       divider: false,
       fn: notEmpty
     }].filter(function (filterType) {
-      return header ? !header.column.enabledColumnFilterOptions || header.column.enabledColumnFilterOptions.includes(filterType.option) : (!enabledGlobalFilterOptions || enabledGlobalFilterOptions.includes(filterType.option)) && [MRT_FILTER_OPTION.FUZZY, MRT_FILTER_OPTION.CONTAINS].includes(filterType.option);
+      return columnDef ? !columnDef.enabledColumnFilterOptions || columnDef.enabledColumnFilterOptions.includes(filterType.option) : (!enabledGlobalFilterOptions || enabledGlobalFilterOptions.includes(filterType.option)) && [MRT_FILTER_OPTION.FUZZY, MRT_FILTER_OPTION.CONTAINS].includes(filterType.option);
     });
   }, []);
 
   var handleSelectFilterType = function handleSelectFilterType(value) {
-    if (header) {
+    if (header && column) {
       setCurrentFilterFns(function (prev) {
         var _extends2;
 
@@ -443,11 +449,11 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
       });
 
       if ([MRT_FILTER_OPTION.EMPTY, MRT_FILTER_OPTION.NOT_EMPTY].includes(value)) {
-        header.column.setFilterValue(' ');
+        column.setFilterValue(' ');
       } else if (value === MRT_FILTER_OPTION.BETWEEN) {
-        header.column.setFilterValue(['', '']);
+        column.setFilterValue(['', '']);
       } else {
-        header.column.setFilterValue('');
+        column.setFilterValue('');
       }
     } else {
       setCurrentGlobalFilterFn(value);
@@ -471,11 +477,11 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
     MenuListProps: {
       dense: isDensePadding
     }
-  }, filterOptions.map(function (_ref2, index) {
-    var option = _ref2.option,
-        label = _ref2.label,
-        divider = _ref2.divider,
-        fn = _ref2.fn;
+  }, filterOptions.map(function (_ref4, index) {
+    var option = _ref4.option,
+        label = _ref4.label,
+        divider = _ref4.divider,
+        fn = _ref4.fn;
     return React__default.createElement(material.MenuItem, {
       divider: divider,
       key: index,
@@ -630,7 +636,7 @@ var MRT_ShowHideColumnsMenu = function MRT_ShowHideColumnsMenu(_ref) {
 
   var hideAllColumns = function hideAllColumns() {
     getAllLeafColumns().filter(function (col) {
-      return col.enableHiding !== false;
+      return col.columnDef.enableHiding !== false;
     }).forEach(function (col) {
       return col.toggleVisibility(false);
     });
@@ -743,6 +749,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
       localization = _tableInstance$option.localization,
       setShowFilters = tableInstance.setShowFilters;
   var column = header.column;
+  var columnDef = column.columnDef;
 
   var _getState = getState(),
       columnSizing = _getState.columnSizing,
@@ -849,7 +856,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
     sx: commonMenuItemStyles$1
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
-  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(SortIcon, null)), (_localization$sortByC = localization.sortByColumnAsc) == null ? void 0 : _localization$sortByC.replace('{column}', String(column.columnDef.header)))), React__default.createElement(material.MenuItem, {
+  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(SortIcon, null)), (_localization$sortByC = localization.sortByColumnAsc) == null ? void 0 : _localization$sortByC.replace('{column}', String(columnDef.header)))), React__default.createElement(material.MenuItem, {
     divider: enableColumnFilters || enableGrouping || enableHiding,
     key: 2,
     disabled: column.getIsSorted() === 'desc',
@@ -861,7 +868,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
     style: {
       transform: 'rotate(180deg) scaleX(-1)'
     }
-  })), (_localization$sortByC2 = localization.sortByColumnDesc) == null ? void 0 : _localization$sortByC2.replace('{column}', String(column.columnDef.header))))], enableColumnFilters && column.getCanFilter() && [React__default.createElement(material.MenuItem, {
+  })), (_localization$sortByC2 = localization.sortByColumnDesc) == null ? void 0 : _localization$sortByC2.replace('{column}', String(columnDef.header))))], enableColumnFilters && column.getCanFilter() && [React__default.createElement(material.MenuItem, {
     disabled: !column.getFilterValue(),
     key: 0,
     onClick: handleClearFilter,
@@ -875,7 +882,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
     sx: commonMenuItemStyles$1
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
-  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(FilterListIcon, null)), (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(column.columnDef.header))), !column.filterSelectOptions && React__default.createElement(material.IconButton, {
+  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(FilterListIcon, null)), (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(columnDef.header))), !columnDef.filterSelectOptions && React__default.createElement(material.IconButton, {
     onClick: handleOpenFilterModeMenu,
     onMouseEnter: handleOpenFilterModeMenu,
     size: "small",
@@ -896,7 +903,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
     sx: commonMenuItemStyles$1
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
-  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(DynamicFeedIcon, null)), (_localization = localization[column.getIsGrouped() ? 'ungroupByColumn' : 'groupByColumn']) == null ? void 0 : _localization.replace('{column}', String(column.columnDef.header))))], enablePinning && column.getCanPin() && [React__default.createElement(material.MenuItem, {
+  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(DynamicFeedIcon, null)), (_localization = localization[column.getIsGrouped() ? 'ungroupByColumn' : 'groupByColumn']) == null ? void 0 : _localization.replace('{column}', String(columnDef.header))))], enablePinning && column.getCanPin() && [React__default.createElement(material.MenuItem, {
     disabled: column.getIsPinned() === 'left' || !column.getCanPin(),
     key: 0,
     onClick: function onClick() {
@@ -940,13 +947,13 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
   }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(RestartAltIcon, null)), localization.resetColumnSize))], enableHiding && [React__default.createElement(material.MenuItem, {
-    disabled: column.enableHiding === false,
+    disabled: columnDef.enableHiding === false,
     key: 0,
     onClick: handleHideColumn,
     sx: commonMenuItemStyles$1
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
-  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(VisibilityOffIcon, null)), (_localization$hideCol = localization.hideColumn) == null ? void 0 : _localization$hideCol.replace('{column}', String(column.columnDef.header)))), React__default.createElement(material.MenuItem, {
+  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(VisibilityOffIcon, null)), (_localization$hideCol = localization.hideColumn) == null ? void 0 : _localization$hideCol.replace('{column}', String(columnDef.header)))), React__default.createElement(material.MenuItem, {
     disabled: !Object.values(columnVisibility).filter(function (visible) {
       return !visible;
     }).length,
@@ -955,7 +962,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
     sx: commonMenuItemStyles$1
   }, React__default.createElement(material.Box, {
     sx: commonListItemStyles
-  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(ViewColumnIcon, null)), (_localization$showAll = localization.showAllColumns) == null ? void 0 : _localization$showAll.replace('{column}', String(column.columnDef.header))), React__default.createElement(material.IconButton, {
+  }, React__default.createElement(material.ListItemIcon, null, React__default.createElement(ViewColumnIcon, null)), (_localization$showAll = localization.showAllColumns) == null ? void 0 : _localization$showAll.replace('{column}', String(columnDef.header))), React__default.createElement(material.IconButton, {
     onClick: handleOpenShowHideColumnsMenu,
     onMouseEnter: handleOpenShowHideColumnsMenu,
     size: "small",
@@ -5519,7 +5526,7 @@ var MRT_ToolbarBottom = function MRT_ToolbarBottom(_ref) {
 };
 
 var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
-  var _localization$filterB, _localization$filterM, _localization$, _localization$clearFi, _column$filterSelectO;
+  var _localization$filterB, _localization$filterM, _localization$, _localization$clearFi, _columnDef$filterSele;
 
   var header = _ref.header,
       inputIndex = _ref.inputIndex,
@@ -5534,6 +5541,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
       muiTableHeadCellFilterTextFieldProps = _tableInstance$option.muiTableHeadCellFilterTextFieldProps,
       setCurrentFilterFns = tableInstance.setCurrentFilterFns;
   var column = header.column;
+  var columnDef = column.columnDef;
 
   var _getState = getState(),
       currentFilterFns = _getState.currentFilterFns;
@@ -5546,10 +5554,10 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
     column: column,
     tableInstance: tableInstance
   }) : muiTableHeadCellFilterTextFieldProps;
-  var mcTableHeadCellFilterTextFieldProps = column.muiTableHeadCellFilterTextFieldProps instanceof Function ? column.muiTableHeadCellFilterTextFieldProps({
+  var mcTableHeadCellFilterTextFieldProps = columnDef.muiTableHeadCellFilterTextFieldProps instanceof Function ? columnDef.muiTableHeadCellFilterTextFieldProps({
     column: column,
     tableInstance: tableInstance
-  }) : column.muiTableHeadCellFilterTextFieldProps;
+  }) : columnDef.muiTableHeadCellFilterTextFieldProps;
 
   var textFieldProps = _extends({}, mTableHeadCellFilterTextFieldProps, mcTableHeadCellFilterTextFieldProps);
 
@@ -5599,8 +5607,8 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
     });
   };
 
-  if (column.Filter) {
-    return React__default.createElement(React__default.Fragment, null, column.Filter == null ? void 0 : column.Filter({
+  if (columnDef.Filter) {
+    return React__default.createElement(React__default.Fragment, null, columnDef.Filter == null ? void 0 : columnDef.Filter({
       header: header,
       tableInstance: tableInstance
     }));
@@ -5608,10 +5616,13 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
 
   var filterId = "mrt-" + idPrefix + "-" + header.id + "-filter-text-field" + (inputIndex != null ? inputIndex : '');
   var filterFn = currentFilterFns == null ? void 0 : currentFilterFns[header.id];
-  var isSelectFilter = !!column.filterSelectOptions;
+  var isSelectFilter = !!columnDef.filterSelectOptions;
   var filterChipLabel = !(filterFn instanceof Function) && [MRT_FILTER_OPTION.EMPTY, MRT_FILTER_OPTION.NOT_EMPTY].includes(filterFn) ? //@ts-ignore
   localization["filter" + (filterFn.charAt(0).toUpperCase() + filterFn.slice(1))] : '';
-  var filterPlaceholder = inputIndex === undefined ? (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(column.columnDef.header)) : inputIndex === 0 ? localization.min : inputIndex === 1 ? localization.max : '';
+  var filterPlaceholder = inputIndex === undefined ? (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(columnDef.header)) : inputIndex === 0 ? localization.min : inputIndex === 1 ? localization.max : '';
+  console.log({
+    textFieldProps: textFieldProps
+  });
   return React__default.createElement(React__default.Fragment, null, React__default.createElement(material.TextField, Object.assign({
     fullWidth: true,
     id: filterId,
@@ -5688,7 +5699,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
     sx: _extends({
       m: '-0.25rem',
       p: 0,
-      minWidth: !filterChipLabel ? '6rem' : 'auto',
+      minWidth: !filterChipLabel ? '8rem' : 'auto',
       width: 'calc(100% + 0.5rem)',
       mt: isSelectFilter && !filterValue ? '-1rem' : undefined,
       '&	.MuiSelect-icon': {
@@ -5699,7 +5710,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
     divider: true,
     disabled: !filterValue,
     value: ""
-  }, localization.clearFilter), column == null ? void 0 : (_column$filterSelectO = column.filterSelectOptions) == null ? void 0 : _column$filterSelectO.map(function (option) {
+  }, localization.clearFilter), columnDef == null ? void 0 : (_columnDef$filterSele = columnDef.filterSelectOptions) == null ? void 0 : _columnDef$filterSele.map(function (option) {
     var value;
     var text;
 
@@ -5930,10 +5941,10 @@ var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton
     column: column,
     tableInstance: tableInstance
   }) : muiTableHeadCellColumnActionsButtonProps;
-  var mcTableHeadCellColumnActionsButtonProps = column.muiTableHeadCellColumnActionsButtonProps instanceof Function ? column.muiTableHeadCellColumnActionsButtonProps({
+  var mcTableHeadCellColumnActionsButtonProps = column.columnDef.muiTableHeadCellColumnActionsButtonProps instanceof Function ? column.columnDef.muiTableHeadCellColumnActionsButtonProps({
     column: column,
     tableInstance: tableInstance
-  }) : column.muiTableHeadCellColumnActionsButtonProps;
+  }) : column.columnDef.muiTableHeadCellColumnActionsButtonProps;
 
   var iconButtonProps = _extends({}, mTableHeadCellColumnActionsButtonProps, mcTableHeadCellColumnActionsButtonProps);
 
@@ -5968,7 +5979,7 @@ var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton
 };
 
 var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
-  var _column$columnDef$Hea, _column$columnDef, _column$minSize, _column$columnDef$hea, _column$columnDef$hea2;
+  var _column$columnDef, _column$columnDef2, _column$columnDef$Hea, _column$columnDef3, _columnDef$minSize, _columnDef$header$len, _columnDef$header;
 
   var dragRef = _ref.dragRef,
       dropRef = _ref.dropRef,
@@ -5989,21 +6000,23 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
       isDensePadding = _getState.isDensePadding;
 
   var column = header.column;
+  var columnDef = column.columnDef,
+      columnDefType = column.columnDefType;
   var mTableHeadCellProps = muiTableHeadCellProps instanceof Function ? muiTableHeadCellProps({
     column: column,
     tableInstance: tableInstance
   }) : muiTableHeadCellProps;
-  var mcTableHeadCellProps = column.muiTableHeadCellProps instanceof Function ? column.muiTableHeadCellProps({
+  var mcTableHeadCellProps = columnDef.muiTableHeadCellProps instanceof Function ? columnDef.muiTableHeadCellProps({
     column: column,
     tableInstance: tableInstance
-  }) : column.muiTableHeadCellProps;
+  }) : columnDef.muiTableHeadCellProps;
 
   var tableCellProps = _extends({}, mTableHeadCellProps, mcTableHeadCellProps);
 
-  var headerElement = (_column$columnDef$Hea = (_column$columnDef = column.columnDef) == null ? void 0 : _column$columnDef.Header == null ? void 0 : _column$columnDef.Header({
+  var headerElement = ((_column$columnDef = column.columnDef) == null ? void 0 : _column$columnDef.Header) instanceof Function ? (_column$columnDef2 = column.columnDef) == null ? void 0 : _column$columnDef2.Header == null ? void 0 : _column$columnDef2.Header({
     header: header,
     tableInstance: tableInstance
-  })) != null ? _column$columnDef$Hea : header.renderHeader();
+  }) : (_column$columnDef$Hea = (_column$columnDef3 = column.columnDef) == null ? void 0 : _column$columnDef3.Header) != null ? _column$columnDef$Hea : header.renderHeader();
 
   var getIsLastLeftPinnedColumn = function getIsLastLeftPinnedColumn() {
     return column.getIsPinned() === 'left' && tableInstance.getLeftLeafHeaders().length - 1 === column.getPinnedIndex();
@@ -6018,40 +6031,40 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
   };
 
   return React__default.createElement(material.TableCell, Object.assign({
-    align: column.columnDefType === 'group' ? 'center' : 'left',
+    align: columnDefType === 'group' ? 'center' : 'left',
     colSpan: header.colSpan
   }, tableCellProps, {
-    ref: column.columnDefType === 'data' ? dropRef : undefined,
+    ref: columnDefType === 'data' ? dropRef : undefined,
     sx: function sx(theme) {
       return _extends({
-        backgroundColor: column.getIsPinned() && column.columnDefType !== 'group' ? material.alpha(material.lighten(theme.palette.background["default"], 0.04), 0.95) : 'inherit',
+        backgroundColor: column.getIsPinned() && columnDefType !== 'group' ? material.alpha(material.lighten(theme.palette.background["default"], 0.04), 0.95) : 'inherit',
         backgroundImage: 'inherit',
         boxShadow: getIsLastLeftPinnedColumn() ? "4px 0 4px -2px " + material.alpha(theme.palette.common.black, 0.1) : getIsFirstRightPinnedColumn() ? "-4px 0 4px -2px " + material.alpha(theme.palette.common.black, 0.1) : undefined,
         fontWeight: 'bold',
         height: '100%',
         left: column.getIsPinned() === 'left' ? column.getStart('left') + "px" : undefined,
         overflow: 'visible',
-        p: isDensePadding ? column.columnDefType === 'display' ? '0 0.5rem' : '0.5rem' : column.columnDefType === 'display' ? '0.5rem 0.75rem' : '1rem',
-        pb: column.columnDefType === 'display' ? 0 : undefined,
-        position: column.getIsPinned() && column.columnDefType !== 'group' ? 'sticky' : undefined,
-        pt: column.columnDefType === 'display' ? 0 : isDensePadding ? '0.75rem' : '1.25rem',
+        p: isDensePadding ? columnDefType === 'display' ? '0 0.5rem' : '0.5rem' : columnDefType === 'display' ? '0.5rem 0.75rem' : '1rem',
+        pb: columnDefType === 'display' ? 0 : undefined,
+        position: column.getIsPinned() && columnDefType !== 'group' ? 'sticky' : undefined,
+        pt: columnDefType === 'display' ? 0 : isDensePadding ? '0.75rem' : '1.25rem',
         right: column.getIsPinned() === 'right' ? getTotalRight() + "px" : undefined,
         transition: "all " + (enableColumnResizing ? 0 : '0.2s') + " ease-in-out",
         verticalAlign: 'text-top',
-        zIndex: column.getIsResizing() ? 3 : column.getIsPinned() && column.columnDefType !== 'group' ? 2 : 1
+        zIndex: column.getIsResizing() ? 3 : column.getIsPinned() && columnDefType !== 'group' ? 2 : 1
       }, tableCellProps == null ? void 0 : tableCellProps.sx);
     },
     style: {
       maxWidth: "min(" + column.getSize() + "px, fit-content)",
-      minWidth: "max(" + column.getSize() + "px, " + ((_column$minSize = column.minSize) != null ? _column$minSize : 30) + "px)",
+      minWidth: "max(" + column.getSize() + "px, " + ((_columnDef$minSize = columnDef.minSize) != null ? _columnDef$minSize : 30) + "px)",
       width: header.getSize()
     }
-  }), header.isPlaceholder ? null : column.columnDefType === 'display' ? headerElement : React__default.createElement(material.Box, {
+  }), header.isPlaceholder ? null : columnDefType === 'display' ? headerElement : React__default.createElement(material.Box, {
     ref: previewRef,
     sx: {
       alignItems: 'flex-start',
       display: 'flex',
-      justifyContent: column.columnDefType === 'group' ? 'center' : 'space-between',
+      justifyContent: columnDefType === 'group' ? 'center' : 'space-between',
       opacity: isDragging ? 0.5 : 1,
       width: '100%'
     }
@@ -6061,32 +6074,32 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
     },
     sx: {
       alignItems: 'center',
-      cursor: column.getCanSort() && column.columnDefType !== 'group' ? 'pointer' : undefined,
+      cursor: column.getCanSort() && columnDefType !== 'group' ? 'pointer' : undefined,
       display: 'flex',
       flexWrap: 'nowrap',
-      whiteSpace: ((_column$columnDef$hea = (_column$columnDef$hea2 = column.columnDef.header) == null ? void 0 : _column$columnDef$hea2.length) != null ? _column$columnDef$hea : 0) < 24 ? 'nowrap' : 'normal'
+      whiteSpace: ((_columnDef$header$len = (_columnDef$header = columnDef.header) == null ? void 0 : _columnDef$header.length) != null ? _columnDef$header$len : 0) < 24 ? 'nowrap' : 'normal'
     }
-  }, headerElement, column.columnDefType === 'data' && column.getCanSort() && React__default.createElement(MRT_TableHeadCellSortLabel, {
+  }, headerElement, columnDefType === 'data' && column.getCanSort() && React__default.createElement(MRT_TableHeadCellSortLabel, {
     header: header,
     tableInstance: tableInstance
-  }), column.columnDefType === 'data' && enableColumnFilters && column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterLabel, {
+  }), columnDefType === 'data' && enableColumnFilters && column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterLabel, {
     header: header,
     tableInstance: tableInstance
   })), React__default.createElement(material.Box, {
     sx: {
       whiteSpace: 'nowrap'
     }
-  }, column.columnDefType === 'data' && (enableColumnOrdering && column.enableColumnOrdering !== false || enableGrouping && column.enableGrouping !== false) && React__default.createElement(MRT_TableHeadCellGrabHandle, {
+  }, columnDefType === 'data' && (enableColumnOrdering && columnDef.enableColumnOrdering !== false || enableGrouping && columnDef.enableGrouping !== false) && React__default.createElement(MRT_TableHeadCellGrabHandle, {
     header: header,
     ref: dragRef,
     tableInstance: tableInstance
-  }), (enableColumnActions || column.enableColumnActions) && column.enableColumnActions !== false && column.columnDefType !== 'group' && React__default.createElement(MRT_ToggleColumnActionMenuButton, {
+  }), (enableColumnActions || columnDef.enableColumnActions) && columnDef.enableColumnActions !== false && columnDefType !== 'group' && React__default.createElement(MRT_ToggleColumnActionMenuButton, {
     header: header,
     tableInstance: tableInstance
   })), column.getCanResize() && React__default.createElement(MRT_TableHeadCellResizeHandle, {
     header: header,
     tableInstance: tableInstance
-  })), column.columnDefType === 'data' && column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterContainer, {
+  })), columnDefType === 'data' && column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterContainer, {
     header: header,
     tableInstance: tableInstance
   }));
@@ -6209,10 +6222,11 @@ var MRT_EditCellTextField = function MRT_EditCellTextField(_ref) {
 
   var column = cell.column,
       row = cell.row;
+  var columnDef = column.columnDef;
 
   var handleChange = function handleChange(event) {
     setValue(event.target.value);
-    column.onCellEditChange == null ? void 0 : column.onCellEditChange({
+    columnDef.onCellEditChange == null ? void 0 : columnDef.onCellEditChange({
       event: event,
       cell: cell,
       tableInstance: tableInstance
@@ -6226,12 +6240,13 @@ var MRT_EditCellTextField = function MRT_EditCellTextField(_ref) {
 
   var handleBlur = function handleBlur(event) {
     if (getState().currentEditingRow) {
+      if (!row._valuesCache) row._valuesCache = {};
       row._valuesCache[column.id] = value;
       setCurrentEditingRow(_extends({}, getState().currentEditingRow));
     }
 
     setCurrentEditingCell(null);
-    column.onCellEditBlur == null ? void 0 : column.onCellEditBlur({
+    columnDef.onCellEditBlur == null ? void 0 : columnDef.onCellEditBlur({
       event: event,
       cell: cell,
       tableInstance: tableInstance
@@ -6247,15 +6262,15 @@ var MRT_EditCellTextField = function MRT_EditCellTextField(_ref) {
     cell: cell,
     tableInstance: tableInstance
   }) : muiTableBodyCellEditTextFieldProps;
-  var mcTableBodyCellEditTextFieldProps = column.muiTableBodyCellEditTextFieldProps instanceof Function ? column.muiTableBodyCellEditTextFieldProps({
+  var mcTableBodyCellEditTextFieldProps = columnDef.muiTableBodyCellEditTextFieldProps instanceof Function ? columnDef.muiTableBodyCellEditTextFieldProps({
     cell: cell,
     tableInstance: tableInstance
-  }) : column.muiTableBodyCellEditTextFieldProps;
+  }) : columnDef.muiTableBodyCellEditTextFieldProps;
 
   var textFieldProps = _extends({}, mTableBodyCellEditTextFieldProps, mcTableBodyCellEditTextFieldProps);
 
-  if (enableEditing && column.enableEditing !== false && column.Edit) {
-    return React__default.createElement(React__default.Fragment, null, column.Edit == null ? void 0 : column.Edit({
+  if (enableEditing && columnDef.enableEditing !== false && columnDef.Edit) {
+    return React__default.createElement(React__default.Fragment, null, columnDef.Edit == null ? void 0 : columnDef.Edit({
       cell: cell,
       tableInstance: tableInstance
     }));
@@ -6269,7 +6284,7 @@ var MRT_EditCellTextField = function MRT_EditCellTextField(_ref) {
     onClick: function onClick(e) {
       return e.stopPropagation();
     },
-    placeholder: column.columnDef.header,
+    placeholder: columnDef.header,
     value: value,
     variant: "standard"
   }, textFieldProps));
@@ -6299,10 +6314,10 @@ var MRT_CopyButton = function MRT_CopyButton(_ref) {
     cell: cell,
     tableInstance: tableInstance
   }) : muiTableBodyCellCopyButtonProps;
-  var mcTableBodyCellCopyButtonProps = cell.column.muiTableBodyCellCopyButtonProps instanceof Function ? cell.column.muiTableBodyCellCopyButtonProps({
+  var mcTableBodyCellCopyButtonProps = cell.column.columnDef.muiTableBodyCellCopyButtonProps instanceof Function ? cell.column.columnDef.muiTableBodyCellCopyButtonProps({
     cell: cell,
     tableInstance: tableInstance
-  }) : cell.column.muiTableBodyCellCopyButtonProps;
+  }) : cell.column.columnDef.muiTableBodyCellCopyButtonProps;
 
   var buttonProps = _extends({}, mTableBodyCellCopyButtonProps, mcTableBodyCellCopyButtonProps);
 
@@ -6338,7 +6353,7 @@ var MRT_CopyButton = function MRT_CopyButton(_ref) {
 };
 
 var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
-  var _column$minSize, _cell$column$columnDe, _cell$column$columnDe2, _row$subRows, _cell$column$columnDe3, _cell$column$columnDe4, _row$subRows$length, _row$subRows2;
+  var _columnDef$minSize, _cell$column$columnDe, _cell$column$columnDe2, _row$subRows, _cell$column$columnDe3, _cell$column$columnDe4, _row$subRows$length, _row$subRows2;
 
   var cell = _ref.cell,
       enableHover = _ref.enableHover,
@@ -6363,25 +6378,26 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
 
   var column = cell.column,
       row = cell.row;
+  var columnDef = column.columnDef;
   var mTableCellBodyProps = muiTableBodyCellProps instanceof Function ? muiTableBodyCellProps({
     cell: cell,
     tableInstance: tableInstance
   }) : muiTableBodyCellProps;
-  var mcTableCellBodyProps = column.muiTableBodyCellProps instanceof Function ? column.muiTableBodyCellProps({
+  var mcTableCellBodyProps = columnDef.muiTableBodyCellProps instanceof Function ? columnDef.muiTableBodyCellProps({
     cell: cell,
     tableInstance: tableInstance
-  }) : column.muiTableBodyCellProps;
+  }) : columnDef.muiTableBodyCellProps;
 
   var tableCellProps = _extends({}, mTableCellBodyProps, mcTableCellBodyProps);
 
   var skeletonWidth = React.useMemo(function () {
     return column.columnDefType === 'display' ? column.getSize() / 2 : Math.random() * (column.getSize() - column.getSize() / 3) + column.getSize() / 3;
   }, [column.columnDefType, column.getSize()]);
-  var isEditable = (enableEditing || column.enableEditing) && column.enableEditing !== false;
+  var isEditable = (enableEditing || columnDef.enableEditing) && columnDef.enableEditing !== false;
   var isEditing = isEditable && (editingMode === 'table' || (currentEditingRow == null ? void 0 : currentEditingRow.id) === row.id || (currentEditingCell == null ? void 0 : currentEditingCell.id) === cell.id);
 
   var handleDoubleClick = function handleDoubleClick(_event) {
-    if ((enableEditing || column.enableEditing) && column.enableEditing !== false && editingMode === 'cell') {
+    if ((enableEditing || columnDef.enableEditing) && columnDef.enableEditing !== false && editingMode === 'cell') {
       setCurrentEditingCell(cell);
       setTimeout(function () {
         var textField = document.getElementById("mrt-" + idPrefix + "-edit-cell-text-field-" + cell.id);
@@ -6436,20 +6452,20 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
     },
     style: {
       maxWidth: "min(" + column.getSize() + "px, fit-content)",
-      minWidth: "max(" + column.getSize() + "px, " + ((_column$minSize = column.minSize) != null ? _column$minSize : 30) + "px)",
+      minWidth: "max(" + column.getSize() + "px, " + ((_columnDef$minSize = columnDef.minSize) != null ? _columnDef$minSize : 30) + "px)",
       width: column.getSize()
     }
   }), React__default.createElement(React__default.Fragment, null, isLoading || showSkeletons ? React__default.createElement(material.Skeleton, Object.assign({
     animation: "wave",
     height: 20,
     width: skeletonWidth
-  }, muiTableBodyCellSkeletonProps)) : column.columnDefType === 'display' ? column.columnDef.Cell == null ? void 0 : column.columnDef.Cell({
+  }, muiTableBodyCellSkeletonProps)) : column.columnDefType === 'display' ? columnDef.Cell == null ? void 0 : columnDef.Cell({
     cell: cell,
     tableInstance: tableInstance
   }) : cell.getIsPlaceholder() || row.getIsGrouped() && column.id !== row.groupingColumnId ? null : cell.getIsAggregated() ? cell.renderAggregatedCell() : isEditing ? React__default.createElement(MRT_EditCellTextField, {
     cell: cell,
     tableInstance: tableInstance
-  }) : (enableClickToCopy || column.enableClickToCopy) && column.enableClickToCopy !== false ? React__default.createElement(React__default.Fragment, null, React__default.createElement(MRT_CopyButton, {
+  }) : (enableClickToCopy || columnDef.enableClickToCopy) && columnDef.enableClickToCopy !== false ? React__default.createElement(React__default.Fragment, null, React__default.createElement(MRT_CopyButton, {
     cell: cell,
     tableInstance: tableInstance
   }, React__default.createElement(React__default.Fragment, null, (_cell$column$columnDe = (_cell$column$columnDe2 = cell.column.columnDef) == null ? void 0 : _cell$column$columnDe2.Cell == null ? void 0 : _cell$column$columnDe2.Cell({
@@ -6567,7 +6583,7 @@ var MRT_TableBody = function MRT_TableBody(_ref) {
 };
 
 var MRT_TableFooterCell = function MRT_TableFooterCell(_ref) {
-  var _ref2, _ref3, _column$columnDef$Foo;
+  var _ref2, _ref3, _columnDef$Footer;
 
   var footer = _ref.footer,
       tableInstance = _ref.tableInstance;
@@ -6580,14 +6596,15 @@ var MRT_TableFooterCell = function MRT_TableFooterCell(_ref) {
       isDensePadding = _getState.isDensePadding;
 
   var column = footer.column;
+  var columnDef = column.columnDef;
   var mTableFooterCellProps = muiTableFooterCellProps instanceof Function ? muiTableFooterCellProps({
     column: column,
     tableInstance: tableInstance
   }) : muiTableFooterCellProps;
-  var mcTableFooterCellProps = column.muiTableFooterCellProps instanceof Function ? column.muiTableFooterCellProps({
+  var mcTableFooterCellProps = columnDef.muiTableFooterCellProps instanceof Function ? columnDef.muiTableFooterCellProps({
     column: column,
     tableInstance: tableInstance
-  }) : column.muiTableFooterCellProps;
+  }) : columnDef.muiTableFooterCellProps;
 
   var tableCellProps = _extends({}, mTableFooterCellProps, mcTableFooterCellProps);
 
@@ -6609,10 +6626,10 @@ var MRT_TableFooterCell = function MRT_TableFooterCell(_ref) {
         verticalAlign: 'text-top'
       }, tableCellProps == null ? void 0 : tableCellProps.sx);
     }
-  }), React__default.createElement(React__default.Fragment, null, footer.isPlaceholder ? null : (_ref2 = (_ref3 = (_column$columnDef$Foo = column.columnDef.Footer == null ? void 0 : column.columnDef.Footer({
+  }), React__default.createElement(React__default.Fragment, null, footer.isPlaceholder ? null : columnDef.Footer instanceof Function ? columnDef.Footer == null ? void 0 : columnDef.Footer({
     footer: footer,
     tableInstance: tableInstance
-  })) != null ? _column$columnDef$Foo : column.columnDef.footer) != null ? _ref3 : footer.renderFooter()) != null ? _ref2 : null));
+  }) : (_ref2 = (_ref3 = (_columnDef$Footer = columnDef.Footer) != null ? _columnDef$Footer : columnDef.footer) != null ? _ref3 : footer.renderFooter()) != null ? _ref2 : null));
 };
 
 var MRT_TableFooterRow = function MRT_TableFooterRow(_ref) {