@mui/x-data-grid 6.18.0 → 7.0.0-alpha.0

package/modern/internals/utils/useProps.js

@@ -1,6 +1,7 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["components", "componentsProps"];
+import _objectDestructuringEmpty from "@babel/runtime/helpers/esm/objectDestructuringEmpty";
+import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
+
 /** Gathers props for the root element into a single `.forwardedProps` field */
 function groupForwardedProps(props) {
   const keys = Object.keys(props);
@@ -22,11 +23,7 @@ function groupForwardedProps(props) {
 }
 export function useProps(allProps) {
   return React.useMemo(() => {
-    const {
-        components,
-        componentsProps
-      } = allProps,
-      themedProps = _objectWithoutPropertiesLoose(allProps, _excluded);
-    return [components, componentsProps, groupForwardedProps(themedProps)];
+    const themedProps = _extends({}, (_objectDestructuringEmpty(allProps), allProps));
+    return groupForwardedProps(themedProps);
   }, [allProps]);
 }

package/modern/locales/csCZ.js

@@ -150,8 +150,8 @@ const csCZGrid = {
   // Actions cell more text
   actionsCellMore: 'více',
   // Column pinning text
-  pinToLeft: 'Připnout na levo',
-  pinToRight: 'Připnout na pravo',
+  pinToLeft: 'Připnout vlevo',
+  pinToRight: 'Připnout vpravo',
   unpin: 'Odepnout',
   // Tree Data
   treeDataGroupingHeaderName: 'Skupina',

package/modern/material/index.js

@@ -15,55 +15,55 @@ import { GridColumnUnsortedIcon } from './icons/GridColumnUnsortedIcon';
 import { GridAddIcon, GridArrowDownwardIcon, GridArrowUpwardIcon, GridCheckIcon, GridCloseIcon, GridColumnIcon, GridDragIcon, GridExpandMoreIcon, GridFilterAltIcon, GridFilterListIcon, GridKeyboardArrowRight, GridMoreVertIcon, GridRemoveIcon, GridSaveAltIcon, GridSearchIcon, GridSeparatorIcon, GridTableRowsIcon, GridTripleDotsVerticalIcon, GridViewHeadlineIcon, GridViewStreamIcon, GridVisibilityOffIcon, GridViewColumnIcon, GridClearIcon, GridLoadIcon, GridDeleteForeverIcon } from './icons';
 import MUISelectOption from './components/MUISelectOption';
 const iconSlots = {
-  BooleanCellTrueIcon: GridCheckIcon,
-  BooleanCellFalseIcon: GridCloseIcon,
-  ColumnMenuIcon: GridTripleDotsVerticalIcon,
-  OpenFilterButtonIcon: GridFilterListIcon,
-  FilterPanelDeleteIcon: GridCloseIcon,
-  ColumnFilteredIcon: GridFilterAltIcon,
-  ColumnSelectorIcon: GridColumnIcon,
-  ColumnUnsortedIcon: GridColumnUnsortedIcon,
-  ColumnSortedAscendingIcon: GridArrowUpwardIcon,
-  ColumnSortedDescendingIcon: GridArrowDownwardIcon,
-  ColumnResizeIcon: GridSeparatorIcon,
-  DensityCompactIcon: GridViewHeadlineIcon,
-  DensityStandardIcon: GridTableRowsIcon,
-  DensityComfortableIcon: GridViewStreamIcon,
-  ExportIcon: GridSaveAltIcon,
-  MoreActionsIcon: GridMoreVertIcon,
-  TreeDataCollapseIcon: GridExpandMoreIcon,
-  TreeDataExpandIcon: GridKeyboardArrowRight,
-  GroupingCriteriaCollapseIcon: GridExpandMoreIcon,
-  GroupingCriteriaExpandIcon: GridKeyboardArrowRight,
-  DetailPanelExpandIcon: GridAddIcon,
-  DetailPanelCollapseIcon: GridRemoveIcon,
-  RowReorderIcon: GridDragIcon,
-  QuickFilterIcon: GridSearchIcon,
-  QuickFilterClearIcon: GridCloseIcon,
-  ColumnMenuHideIcon: GridVisibilityOffIcon,
-  ColumnMenuSortAscendingIcon: GridArrowUpwardIcon,
-  ColumnMenuSortDescendingIcon: GridArrowDownwardIcon,
-  ColumnMenuFilterIcon: GridFilterAltIcon,
-  ColumnMenuManageColumnsIcon: GridViewColumnIcon,
-  ColumnMenuClearIcon: GridClearIcon,
-  LoadIcon: GridLoadIcon,
-  FilterPanelAddIcon: GridAddIcon,
-  FilterPanelRemoveAllIcon: GridDeleteForeverIcon,
-  ColumnReorderIcon: GridDragIcon
+  booleanCellTrueIcon: GridCheckIcon,
+  booleanCellFalseIcon: GridCloseIcon,
+  columnMenuIcon: GridTripleDotsVerticalIcon,
+  openFilterButtonIcon: GridFilterListIcon,
+  filterPanelDeleteIcon: GridCloseIcon,
+  columnFilteredIcon: GridFilterAltIcon,
+  columnSelectorIcon: GridColumnIcon,
+  columnUnsortedIcon: GridColumnUnsortedIcon,
+  columnSortedAscendingIcon: GridArrowUpwardIcon,
+  columnSortedDescendingIcon: GridArrowDownwardIcon,
+  columnResizeIcon: GridSeparatorIcon,
+  densityCompactIcon: GridViewHeadlineIcon,
+  densityStandardIcon: GridTableRowsIcon,
+  densityComfortableIcon: GridViewStreamIcon,
+  exportIcon: GridSaveAltIcon,
+  moreActionsIcon: GridMoreVertIcon,
+  treeDataCollapseIcon: GridExpandMoreIcon,
+  treeDataExpandIcon: GridKeyboardArrowRight,
+  groupingCriteriaCollapseIcon: GridExpandMoreIcon,
+  groupingCriteriaExpandIcon: GridKeyboardArrowRight,
+  detailPanelExpandIcon: GridAddIcon,
+  detailPanelCollapseIcon: GridRemoveIcon,
+  rowReorderIcon: GridDragIcon,
+  quickFilterIcon: GridSearchIcon,
+  quickFilterClearIcon: GridCloseIcon,
+  columnMenuHideIcon: GridVisibilityOffIcon,
+  columnMenuSortAscendingIcon: GridArrowUpwardIcon,
+  columnMenuSortDescendingIcon: GridArrowDownwardIcon,
+  columnMenuFilterIcon: GridFilterAltIcon,
+  columnMenuManageColumnsIcon: GridViewColumnIcon,
+  columnMenuClearIcon: GridClearIcon,
+  loadIcon: GridLoadIcon,
+  filterPanelAddIcon: GridAddIcon,
+  filterPanelRemoveAllIcon: GridDeleteForeverIcon,
+  columnReorderIcon: GridDragIcon
 };
 const materialSlots = _extends({}, iconSlots, {
-  BaseCheckbox: MUICheckbox,
-  BaseTextField: MUITextField,
-  BaseFormControl: MUIFormControl,
-  BaseSelect: MUISelect,
-  BaseSwitch: MUISwitch,
-  BaseButton: MUIButton,
-  BaseIconButton: MUIIconButton,
-  BaseInputAdornment: MUIInputAdornment,
-  BaseTooltip: MUITooltip,
-  BasePopper: MUIPopper,
-  BaseInputLabel: MUIInputLabel,
-  BaseSelectOption: MUISelectOption,
-  BaseChip: MUIChip
+  baseCheckbox: MUICheckbox,
+  baseTextField: MUITextField,
+  baseFormControl: MUIFormControl,
+  baseSelect: MUISelect,
+  baseSwitch: MUISwitch,
+  baseButton: MUIButton,
+  baseIconButton: MUIIconButton,
+  baseInputAdornment: MUIInputAdornment,
+  baseTooltip: MUITooltip,
+  basePopper: MUIPopper,
+  baseInputLabel: MUIInputLabel,
+  baseSelectOption: MUISelectOption,
+  baseChip: MUIChip
 });
 export default materialSlots;

package/modern/utils/getPublicApiRef.js

@@ -0,0 +1,5 @@
+export function getPublicApiRef(apiRef) {
+  return {
+    current: apiRef.current.getPublicApi()
+  };
+}

package/node/DataGrid/DataGrid.js

@@ -133,16 +133,6 @@ DataGridRaw.propTypes = {
    * If defined, the grid will ignore the `hide` property in [[GridColDef]].
    */
   columnVisibilityModel: _propTypes.default.object,
-  /**
-   * Overridable components.
-   * @deprecated Use `slots` instead.
-   */
-  components: _propTypes.default.object,
-  /**
-   * Overridable components props dynamically passed to the component at rendering.
-   * @deprecated Use the `slotProps` prop instead.
-   */
-  componentsProps: _propTypes.default.object,
   /**
    * Set the density of the grid.
    * @default "standard"

package/node/DataGrid/useDataGridProps.js

@@ -81,22 +81,20 @@ const DATA_GRID_PROPS_DEFAULT_VALUES = exports.DATA_GRID_PROPS_DEFAULT_VALUES =
   clipboardCopyCellDelimiter: '\t',
   rowPositionsDebounceMs: 166
 };
-const defaultSlots = (0, _utils.uncapitalizeObjectKeys)(_defaultGridSlotsComponents.DATA_GRID_DEFAULT_SLOTS_COMPONENTS);
+const defaultSlots = _defaultGridSlotsComponents.DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
 const useDataGridProps = inProps => {
-  const [components, componentsProps, themedProps] = (0, _utils.useProps)((0, _styles.useThemeProps)({
+  const themedProps = (0, _utils.useProps)((0, _styles.useThemeProps)({
     props: inProps,
     name: 'MuiDataGrid'
   }));
   const localeText = React.useMemo(() => (0, _extends2.default)({}, _constants.GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
   const slots = React.useMemo(() => (0, _utils.computeSlots)({
     defaultSlots,
-    slots: themedProps.slots,
-    components
-  }), [components, themedProps.slots]);
+    slots: themedProps.slots
+  }), [themedProps.slots]);
   return React.useMemo(() => (0, _extends2.default)({}, DATA_GRID_PROPS_DEFAULT_VALUES, themedProps, {
     localeText,
-    slots,
-    slotProps: themedProps.slotProps ?? componentsProps
-  }, DATA_GRID_FORCED_PROPS), [themedProps, localeText, slots, componentsProps]);
+    slots
+  }, DATA_GRID_FORCED_PROPS), [themedProps, localeText, slots]);
 };
 exports.useDataGridProps = useDataGridProps;

package/node/colDef/gridActionsColDef.js

@@ -21,6 +21,5 @@ const GRID_ACTIONS_COL_DEF = exports.GRID_ACTIONS_COL_DEF = (0, _extends2.defaul
   disableColumnMenu: true,
   disableExport: true,
   renderCell: _GridActionsCell.renderActionsCell,
-  getApplyQuickFilterFn: undefined,
-  getApplyQuickFilterFnV7: undefined
+  getApplyQuickFilterFn: undefined
 });

package/node/colDef/gridBooleanColDef.js

@@ -43,7 +43,6 @@ const GRID_BOOLEAN_COL_DEF = exports.GRID_BOOLEAN_COL_DEF = (0, _extends2.defaul
   valueFormatter: gridBooleanFormatter,
   filterOperators: (0, _gridBooleanOperators.getGridBooleanOperators)(),
   getApplyQuickFilterFn: undefined,
-  getApplyQuickFilterFnV7: undefined,
   // @ts-ignore
   aggregable: false,
   // @ts-ignore

package/node/colDef/gridBooleanOperators.js

@@ -5,10 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getGridBooleanOperators = void 0;
 var _GridFilterInputBoolean = require("../components/panel/filterPanel/GridFilterInputBoolean");
-var _utils = require("./utils");
-const getGridBooleanOperators = () => (0, _utils.convertLegacyOperators)([{
+const getGridBooleanOperators = () => [{
   value: 'is',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!filterItem.value) {
       return null;
     }
@@ -18,5 +17,5 @@ const getGridBooleanOperators = () => (0, _utils.convertLegacyOperators)([{
     };
   },
   InputComponent: _GridFilterInputBoolean.GridFilterInputBoolean
-}]);
+}];
 exports.getGridBooleanOperators = getGridBooleanOperators;

package/node/colDef/gridCheckboxSelectionColDef.js

@@ -28,7 +28,6 @@ const GRID_CHECKBOX_SELECTION_COL_DEF = exports.GRID_CHECKBOX_SELECTION_COL_DEF
   disableReorder: true,
   disableExport: true,
   getApplyQuickFilterFn: undefined,
-  getApplyQuickFilterFnV7: undefined,
   valueGetter: params => {
     const selectionLookup = (0, _gridRowSelectionSelector.selectedIdsLookupSelector)(params.api.state, params.api.instanceId);
     return selectionLookup[params.id] !== undefined;

package/node/colDef/gridDateOperators.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getGridDateOperators = void 0;
 var _GridFilterInputDate = require("../components/panel/filterPanel/GridFilterInputDate");
-var _utils = require("./utils");
 const dateRegex = /(\d+)-(\d+)-(\d+)/;
 const dateTimeRegex = /(\d+)-(\d+)-(\d+)T(\d+):(\d+)/;
 function buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {
@@ -28,9 +27,9 @@ function buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {
     return compareFn(timeToCompare, time);
   };
 }
-const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
+const getGridDateOperators = showTime => [{
   value: 'is',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 === value2, showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -39,7 +38,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'not',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 !== value2, showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -48,7 +47,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'after',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 > value2, showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -57,7 +56,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'onOrAfter',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 >= value2, showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -66,7 +65,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'before',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 < value2, showTime, !showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -75,7 +74,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'onOrBefore',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     return buildApplyFilterFn(filterItem, (value1, value2) => value1 <= value2, showTime);
   },
   InputComponent: _GridFilterInputDate.GridFilterInputDate,
@@ -84,7 +83,7 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'isEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value == null;
     };
@@ -92,11 +91,11 @@ const getGridDateOperators = showTime => (0, _utils.convertLegacyOperators)([{
   requiresFilterValue: false
 }, {
   value: 'isNotEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value != null;
     };
   },
   requiresFilterValue: false
-}]);
+}];
 exports.getGridDateOperators = getGridDateOperators;

package/node/colDef/gridNumericColDef.js

@@ -10,7 +10,6 @@ var _gridSortingUtils = require("../hooks/features/sorting/gridSortingUtils");
 var _utils = require("../utils/utils");
 var _gridNumericOperators = require("./gridNumericOperators");
 var _gridStringColDef = require("./gridStringColDef");
-var _utils2 = require("./utils");
 const GRID_NUMERIC_COL_DEF = exports.GRID_NUMERIC_COL_DEF = (0, _extends2.default)({}, _gridStringColDef.GRID_STRING_COL_DEF, {
   type: 'number',
   align: 'right',
@@ -21,6 +20,5 @@ const GRID_NUMERIC_COL_DEF = exports.GRID_NUMERIC_COL_DEF = (0, _extends2.defaul
     value
   }) => (0, _utils.isNumber)(value) ? value.toLocaleString() : value || '',
   filterOperators: (0, _gridNumericOperators.getGridNumericOperators)(),
-  getApplyQuickFilterFn: (0, _utils2.convertQuickFilterV7ToLegacy)(_gridNumericOperators.getGridNumericQuickFilterFn),
-  getApplyQuickFilterFnV7: _gridNumericOperators.getGridNumericQuickFilterFn
+  getApplyQuickFilterFn: _gridNumericOperators.getGridNumericQuickFilterFn
 });

package/node/colDef/gridNumericOperators.js

@@ -6,24 +6,24 @@ Object.defineProperty(exports, "__esModule", {
 exports.getGridNumericQuickFilterFn = exports.getGridNumericOperators = void 0;
 var _GridFilterInputValue = require("../components/panel/filterPanel/GridFilterInputValue");
 var _GridFilterInputMultipleValue = require("../components/panel/filterPanel/GridFilterInputMultipleValue");
-var _utils = require("./utils");
 const parseNumericValue = value => {
   if (value == null) {
     return null;
   }
   return Number(value);
 };
-const getGridNumericQuickFilterFn = exports.getGridNumericQuickFilterFn = (0, _utils.tagInternalFilter)(value => {
+const getGridNumericQuickFilterFn = value => {
   if (value == null || Number.isNaN(value) || value === '') {
     return null;
   }
   return columnValue => {
     return parseNumericValue(columnValue) === parseNumericValue(value);
   };
-});
-const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
+};
+exports.getGridNumericQuickFilterFn = getGridNumericQuickFilterFn;
+const getGridNumericOperators = () => [{
   value: '=',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -37,7 +37,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: '!=',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -51,7 +51,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: '>',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -68,7 +68,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: '>=',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -85,7 +85,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: '<',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -102,7 +102,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: '<=',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || Number.isNaN(filterItem.value)) {
       return null;
     }
@@ -119,7 +119,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   }
 }, {
   value: 'isEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value == null;
     };
@@ -127,7 +127,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   requiresFilterValue: false
 }, {
   value: 'isNotEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value != null;
     };
@@ -135,7 +135,7 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   requiresFilterValue: false
 }, {
   value: 'isAnyOf',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
       return null;
     }
@@ -147,5 +147,5 @@ const getGridNumericOperators = () => (0, _utils.convertLegacyOperators)([{
   InputComponentProps: {
     type: 'number'
   }
-}]);
+}];
 exports.getGridNumericOperators = getGridNumericOperators;

package/node/colDef/gridSingleSelectOperators.js

@@ -7,16 +7,15 @@ exports.getGridSingleSelectOperators = void 0;
 var _GridFilterInputSingleSelect = require("../components/panel/filterPanel/GridFilterInputSingleSelect");
 var _GridFilterInputMultipleSingleSelect = require("../components/panel/filterPanel/GridFilterInputMultipleSingleSelect");
 var _utils = require("../utils/utils");
-var _utils2 = require("./utils");
 const parseObjectValue = value => {
   if (value == null || !(0, _utils.isObject)(value)) {
     return value;
   }
   return value.value;
 };
-const getGridSingleSelectOperators = () => (0, _utils2.convertLegacyOperators)([{
+const getGridSingleSelectOperators = () => [{
   value: 'is',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || filterItem.value === '') {
       return null;
     }
@@ -25,7 +24,7 @@ const getGridSingleSelectOperators = () => (0, _utils2.convertLegacyOperators)([
   InputComponent: _GridFilterInputSingleSelect.GridFilterInputSingleSelect
 }, {
   value: 'not',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (filterItem.value == null || filterItem.value === '') {
       return null;
     }
@@ -34,7 +33,7 @@ const getGridSingleSelectOperators = () => (0, _utils2.convertLegacyOperators)([
   InputComponent: _GridFilterInputSingleSelect.GridFilterInputSingleSelect
 }, {
   value: 'isAnyOf',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
       return null;
     }
@@ -42,5 +41,5 @@ const getGridSingleSelectOperators = () => (0, _utils2.convertLegacyOperators)([
     return value => filterItemValues.includes(parseObjectValue(value));
   },
   InputComponent: _GridFilterInputMultipleSingleSelect.GridFilterInputMultipleSingleSelect
-}]);
+}];
 exports.getGridSingleSelectOperators = getGridSingleSelectOperators;

package/node/colDef/gridStringColDef.js

@@ -7,7 +7,6 @@ exports.GRID_STRING_COL_DEF = void 0;
 var _GridEditInputCell = require("../components/cell/GridEditInputCell");
 var _gridSortingUtils = require("../hooks/features/sorting/gridSortingUtils");
 var _gridStringOperators = require("./gridStringOperators");
-var _utils = require("./utils");
 /**
  * TODO: Move pro and premium properties outside of this Community file
  */
@@ -29,6 +28,5 @@ const GRID_STRING_COL_DEF = exports.GRID_STRING_COL_DEF = {
   align: 'left',
   filterOperators: (0, _gridStringOperators.getGridStringOperators)(),
   renderEditCell: _GridEditInputCell.renderEditInputCell,
-  getApplyQuickFilterFn: (0, _utils.convertQuickFilterV7ToLegacy)(_gridStringOperators.getGridStringQuickFilterFn),
-  getApplyQuickFilterFnV7: _gridStringOperators.getGridStringQuickFilterFn
+  getApplyQuickFilterFn: _gridStringOperators.getGridStringQuickFilterFn
 };

package/node/colDef/gridStringOperators.js

@@ -7,19 +7,24 @@ exports.getGridStringQuickFilterFn = exports.getGridStringOperators = void 0;
 var _GridFilterInputValue = require("../components/panel/filterPanel/GridFilterInputValue");
 var _utils = require("../utils/utils");
 var _GridFilterInputMultipleValue = require("../components/panel/filterPanel/GridFilterInputMultipleValue");
-var _utils2 = require("./utils");
-const getGridStringQuickFilterFn = exports.getGridStringQuickFilterFn = (0, _utils2.tagInternalFilter)(value => {
+var _gridFilterUtils = require("../hooks/features/filter/gridFilterUtils");
+const getGridStringQuickFilterFn = value => {
   if (!value) {
     return null;
   }
   const filterRegex = new RegExp((0, _utils.escapeRegExp)(value), 'i');
-  return columnValue => {
+  return (_, row, column, apiRef) => {
+    let columnValue = apiRef.current.getRowFormattedValue(row, column);
+    if (apiRef.current.ignoreDiacritics) {
+      columnValue = (0, _gridFilterUtils.removeDiacritics)(columnValue);
+    }
     return columnValue != null ? filterRegex.test(columnValue.toString()) : false;
   };
-});
-const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegacyOperators)([{
+};
+exports.getGridStringQuickFilterFn = getGridStringQuickFilterFn;
+const getGridStringOperators = (disableTrim = false) => [{
   value: 'contains',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!filterItem.value) {
       return null;
     }
@@ -32,7 +37,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   InputComponent: _GridFilterInputValue.GridFilterInputValue
 }, {
   value: 'equals',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!filterItem.value) {
       return null;
     }
@@ -48,7 +53,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   InputComponent: _GridFilterInputValue.GridFilterInputValue
 }, {
   value: 'startsWith',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!filterItem.value) {
       return null;
     }
@@ -61,7 +66,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   InputComponent: _GridFilterInputValue.GridFilterInputValue
 }, {
   value: 'endsWith',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!filterItem.value) {
       return null;
     }
@@ -74,7 +79,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   InputComponent: _GridFilterInputValue.GridFilterInputValue
 }, {
   value: 'isEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value === '' || value == null;
     };
@@ -82,7 +87,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   requiresFilterValue: false
 }, {
   value: 'isNotEmpty',
-  getApplyFilterFnV7: () => {
+  getApplyFilterFn: () => {
     return value => {
       return value !== '' && value != null;
     };
@@ -90,7 +95,7 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
   requiresFilterValue: false
 }, {
   value: 'isAnyOf',
-  getApplyFilterFnV7: filterItem => {
+  getApplyFilterFn: filterItem => {
     if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {
       return null;
     }
@@ -104,5 +109,5 @@ const getGridStringOperators = (disableTrim = false) => (0, _utils2.convertLegac
     }) : false;
   },
   InputComponent: _GridFilterInputMultipleValue.GridFilterInputMultipleValue
-}]);
+}];
 exports.getGridStringOperators = getGridStringOperators;

package/node/components/cell/GridActionsCell.js

@@ -81,10 +81,12 @@ function GridActionsCell(props) {
     focus() {
       // If ignoreCallToFocus is true, then one of the buttons was clicked and the focus is already set
       if (!ignoreCallToFocus.current) {
-        setFocusedButtonIndex(0);
+        // find the first focusable button and pass the index to the state
+        const focusableButtonIndex = options.findIndex(o => !o.props.disabled);
+        setFocusedButtonIndex(focusableButtonIndex);
       }
     }
-  }), []);
+  }), [options]);
   React.useEffect(() => {
     if (focusedButtonIndex >= numberOfButtons) {
       setFocusedButtonIndex(numberOfButtons - 1);
@@ -112,19 +114,23 @@ function GridActionsCell(props) {
     if (numberOfButtons <= 1) {
       return;
     }
+    const getNewIndex = (index, direction) => {
+      if (index < 0 || index > options.length) {
+        return index;
+      }
+
+      // for rtl mode we need to reverse the direction
+      const rtlMod = theme.direction === 'rtl' ? -1 : 1;
+      const indexMod = (direction === 'left' ? -1 : 1) * rtlMod;
+
+      // if the button that should receive focus is disabled go one more step
+      return options[index + indexMod]?.props.disabled ? getNewIndex(index + indexMod, direction) : index + indexMod;
+    };
     let newIndex = focusedButtonIndex;
     if (event.key === 'ArrowRight') {
-      if (theme.direction === 'rtl') {
-        newIndex -= 1;
-      } else {
-        newIndex += 1;
-      }
+      newIndex = getNewIndex(focusedButtonIndex, 'right');
     } else if (event.key === 'ArrowLeft') {
-      if (theme.direction === 'rtl') {
-        newIndex += 1;
-      } else {
-        newIndex -= 1;
-      }
+      newIndex = getNewIndex(focusedButtonIndex, 'left');
     }
     if (newIndex < 0 || newIndex >= numberOfButtons) {
       return; // We're already in the first or last item = do nothing and let the grid listen the event