@mui/x-data-grid 6.16.1 → 6.16.2

package/legacy/components/cell/GridCell.js

@@ -47,9 +47,10 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
     showRightBorder = ownerState.showRightBorder,
     isEditable = ownerState.isEditable,
     isSelected = ownerState.isSelected,
+    isSelectionMode = ownerState.isSelectionMode,
     classes = ownerState.classes;
   var slots = {
-    root: ['cell', "cell--text".concat(capitalize(align)), isEditable && 'cell--editable', isSelected && 'selected', showRightBorder && 'cell--withRightBorder', 'withBorderColor'],
+    root: ['cell', "cell--text".concat(capitalize(align)), isEditable && 'cell--editable', isSelected && 'selected', showRightBorder && 'cell--withRightBorder', isSelectionMode && !isEditable && 'cell--selectionMode', 'withBorderColor'],
     content: ['cellContent']
   };
   return composeClasses(slots, getDataGridUtilityClass, classes);
@@ -386,7 +387,7 @@ process.env.NODE_ENV !== "production" ? GridCell.propTypes = {
 } : void 0;
 export { MemoizedCellWrapper as GridCellWrapper, GridCell };
 var GridCellV7 = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _rootProps$experiment3, _rootProps$experiment4;
+  var _rootProps$unstable_c, _rootProps$experiment3, _rootProps$experiment4;
   var column = props.column,
     rowId = props.rowId,
     editCellState = props.editCellState,
@@ -460,12 +461,15 @@ var GridCellV7 = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var cellRef = React.useRef(null);
   var handleRef = useForkRef(ref, cellRef);
   var focusElementRef = React.useRef(null);
+  // @ts-expect-error To access `unstable_cellSelection` flag as it's a `premium` feature
+  var isSelectionMode = (_rootProps$unstable_c = rootProps.unstable_cellSelection) != null ? _rootProps$unstable_c : false;
   var ownerState = {
     align: align,
     showRightBorder: showRightBorder,
     isEditable: isEditable,
     classes: rootProps.classes,
-    isSelected: isSelected
+    isSelected: isSelected,
+    isSelectionMode: isSelectionMode
   };
   var classes = useUtilityClasses(ownerState);
   var publishMouseUp = React.useCallback(function (eventName) {

package/legacy/components/containers/GridRootStyles.js

@@ -219,6 +219,8 @@ export var GridRootStyles = styled('div', {
   }), _defineProperty(_extends2, "& .".concat(gridClasses.cellContent), {
     overflow: 'hidden',
     textOverflow: 'ellipsis'
+  }), _defineProperty(_extends2, "& .".concat(gridClasses.cell, ".").concat(gridClasses['cell--selectionMode']), {
+    cursor: 'default'
   }), _defineProperty(_extends2, "& .".concat(gridClasses.cell, ".").concat(gridClasses['cell--editing']), {
     padding: 1,
     display: 'flex',

package/legacy/components/panel/filterPanel/GridFilterForm.js

@@ -468,4 +468,12 @@ process.env.NODE_ENV !== "production" ? GridFilterForm.propTypes = {
    */
   valueInputProps: PropTypes.any
 } : void 0;
+
+/**
+ * Demos:
+ * - [Filtering - overview](https://mui.com/x/react-data-grid/filtering/)
+ *
+ * API:
+ * - [GridFilterForm API](https://mui.com/x/api/data-grid/grid-filter-form/)
+ */
 export { GridFilterForm };

package/legacy/components/panel/filterPanel/GridFilterPanel.js

@@ -224,4 +224,12 @@ process.env.NODE_ENV !== "production" ? GridFilterPanel.propTypes = {
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
 } : void 0;
+
+/**
+ * Demos:
+ * - [Filtering - overview](https://mui.com/x/react-data-grid/filtering/)
+ *
+ * API:
+ * - [GridFilterPanel API](https://mui.com/x/api/data-grid/grid-filter-panel/)
+ */
 export { GridFilterPanel, getGridFilter };

package/legacy/components/toolbar/GridToolbarQuickFilter.js

@@ -149,4 +149,13 @@ process.env.NODE_ENV !== "production" ? GridToolbarQuickFilter.propTypes = {
    */
   quickFilterParser: PropTypes.func
 } : void 0;
+
+/**
+ * Demos:
+ * - [Filtering - overview](https://mui.com/x/react-data-grid/filtering/)
+ * - [Filtering - quick filter](https://mui.com/x/react-data-grid/filtering/quick-filter/)
+ *
+ * API:
+ * - [GridToolbarQuickFilter API](https://mui.com/x/api/data-grid/grid-toolbar-quick-filter/)
+ */
 export { GridToolbarQuickFilter };

package/legacy/components/virtualization/GridVirtualScroller.js

@@ -26,8 +26,10 @@ var VirtualScrollerRoot = styled('div', {
   position: 'relative',
   '@media print': {
     overflow: 'hidden'
-  }
+  },
+  zIndex: 0 // See https://github.com/mui/mui-x/issues/10547
 });
+
 var GridVirtualScroller = /*#__PURE__*/React.forwardRef(function GridVirtualScroller(props, ref) {
   var rootProps = useGridRootProps();
   var classes = useUtilityClasses(rootProps);

package/legacy/constants/gridClasses.js

@@ -2,4 +2,4 @@ import { unstable_generateUtilityClasses as generateUtilityClasses, unstable_gen
 export function getDataGridUtilityClass(slot) {
   return generateUtilityClass('MuiDataGrid', slot);
 }
-export var gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withRenderer', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell', 'cellContent', 'cellCheckbox', 'cellSkeleton', 'checkboxInput', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderDropZone', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnGroupHeader', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeader--showColumnBorder', 'columnHeaders', 'columnHeadersInner', 'columnHeadersInner--scrollable', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsPanel', 'columnsPanelRow', 'detailPanel', 'detailPanels', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'row', 'row--editable', 'row--editing', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'selectedRowCount', 'sortIcon', 'toolbarContainer', 'toolbarFilterList', 'virtualScroller', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pinnedColumns', 'pinnedColumns--left', 'pinnedColumns--right', 'pinnedColumnHeaders', 'pinnedColumnHeaders--left', 'pinnedColumnHeaders--right', 'withBorderColor', 'cell--withRightBorder', 'columnHeader--withRightBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pinnedRowsRenderZone']);
+export var gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withRenderer', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--selectionMode', 'cell', 'cellContent', 'cellCheckbox', 'cellSkeleton', 'checkboxInput', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderDropZone', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnGroupHeader', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeader--showColumnBorder', 'columnHeaders', 'columnHeadersInner', 'columnHeadersInner--scrollable', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsPanel', 'columnsPanelRow', 'detailPanel', 'detailPanels', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'row', 'row--editable', 'row--editing', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'selectedRowCount', 'sortIcon', 'toolbarContainer', 'toolbarFilterList', 'virtualScroller', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pinnedColumns', 'pinnedColumns--left', 'pinnedColumns--right', 'pinnedColumnHeaders', 'pinnedColumnHeaders--left', 'pinnedColumnHeaders--right', 'withBorderColor', 'cell--withRightBorder', 'columnHeader--withRightBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pinnedRowsRenderZone']);

package/legacy/hooks/features/columnGrouping/gridColumnGroupsUtils.js

@@ -33,7 +33,7 @@ export var unwrapGroupingColumnModel = function unwrapGroupingColumnModel(column
   });
   return unwrappedSubTree;
 };
-export var getColumnGroupsHeaderStructure = function getColumnGroupsHeaderStructure(orderedColumns, unwrappedGroupingModel) {
+export var getColumnGroupsHeaderStructure = function getColumnGroupsHeaderStructure(orderedColumns, unwrappedGroupingModel, pinnedFields) {
   var getParents = function getParents(field) {
     var _unwrappedGroupingMod;
     return (_unwrappedGroupingMod = unwrappedGroupingModel[field]) != null ? _unwrappedGroupingMod : [];
@@ -45,6 +45,15 @@ export var getColumnGroupsHeaderStructure = function getColumnGroupsHeaderStruct
   var haveSameParents = function haveSameParents(field1, field2, depth) {
     return isDeepEqual(getParents(field1).slice(0, depth + 1), getParents(field2).slice(0, depth + 1));
   };
+  var haveDifferentContainers = function haveDifferentContainers(field1, field2) {
+    if (pinnedFields != null && pinnedFields.left && pinnedFields.left.includes(field1) && !pinnedFields.left.includes(field2)) {
+      return true;
+    }
+    if (pinnedFields != null && pinnedFields.right && !pinnedFields.right.includes(field1) && pinnedFields.right.includes(field2)) {
+      return true;
+    }
+    return false;
+  };
   var _loop = function _loop(depth) {
     var depthStructure = orderedColumns.reduce(function (structure, newField) {
       var _getParents$depth;
@@ -58,7 +67,9 @@ export var getColumnGroupsHeaderStructure = function getColumnGroupsHeaderStruct
       var lastGroup = structure[structure.length - 1];
       var prevField = lastGroup.columnFields[lastGroup.columnFields.length - 1];
       var prevGroupId = lastGroup.groupId;
-      if (prevGroupId !== groupId || !haveSameParents(prevField, newField, depth)) {
+      if (prevGroupId !== groupId || !haveSameParents(prevField, newField, depth) ||
+      // Fix for https://github.com/mui/mui-x/issues/7041
+      haveDifferentContainers(prevField, newField)) {
         // It's a new group
         return [].concat(_toConsumableArray(structure), [{
           columnFields: [newField],

package/legacy/hooks/features/columnGrouping/useGridColumnGrouping.js

@@ -37,7 +37,7 @@ var createGroupLookup = function createGroupLookup(columnGroupingModel) {
   return _extends({}, groupLookup);
 };
 export var columnGroupsStateInitializer = function columnGroupsStateInitializer(state, props, apiRef) {
-  var _props$experimentalFe, _props$columnGrouping, _props$columnGrouping2;
+  var _props$experimentalFe, _props$columnGrouping, _props$columnGrouping2, _apiRef$current$state;
   if (!((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.columnGrouping)) {
     return state;
   }
@@ -45,7 +45,8 @@ export var columnGroupsStateInitializer = function columnGroupsStateInitializer(
   var visibleColumnFields = gridVisibleColumnFieldsSelector(apiRef);
   var groupLookup = createGroupLookup((_props$columnGrouping = props.columnGroupingModel) != null ? _props$columnGrouping : []);
   var unwrappedGroupingModel = unwrapGroupingColumnModel((_props$columnGrouping2 = props.columnGroupingModel) != null ? _props$columnGrouping2 : []);
-  var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(columnFields, unwrappedGroupingModel);
+  var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(columnFields, unwrappedGroupingModel, // @ts-expect-error Move this part to `Pro` package
+  (_apiRef$current$state = apiRef.current.state.pinnedColumns) != null ? _apiRef$current$state : {});
   var maxDepth = visibleColumnFields.length === 0 ? 0 : Math.max.apply(Math, _toConsumableArray(visibleColumnFields.map(function (field) {
     var _unwrappedGroupingMod, _unwrappedGroupingMod2;
     return (_unwrappedGroupingMod = (_unwrappedGroupingMod2 = unwrappedGroupingModel[field]) == null ? void 0 : _unwrappedGroupingMod2.length) != null ? _unwrappedGroupingMod : 0;
@@ -87,9 +88,12 @@ export var useGridColumnGrouping = function useGridColumnGrouping(apiRef, props)
     var _props$columnGrouping3;
     var unwrappedGroupingModel = unwrapGroupingColumnModel((_props$columnGrouping3 = props.columnGroupingModel) != null ? _props$columnGrouping3 : []);
     apiRef.current.setState(function (state) {
-      var _state$columns$ordere, _state$columns;
+      var _state$columns$ordere, _state$columns, _state$pinnedColumns;
       var orderedFields = (_state$columns$ordere = (_state$columns = state.columns) == null ? void 0 : _state$columns.orderedFields) != null ? _state$columns$ordere : [];
-      var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(orderedFields, unwrappedGroupingModel);
+
+      // @ts-expect-error Move this logic to `Pro` package
+      var pinnedColumns = (_state$pinnedColumns = state.pinnedColumns) != null ? _state$pinnedColumns : {};
+      var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(orderedFields, unwrappedGroupingModel, pinnedColumns);
       return _extends({}, state, {
         columnGrouping: _extends({}, state.columnGrouping, {
           headerStructure: columnGroupsHeaderStructure
@@ -98,15 +102,17 @@ export var useGridColumnGrouping = function useGridColumnGrouping(apiRef, props)
     });
   }, [apiRef, props.columnGroupingModel]);
   var updateColumnGroupingState = React.useCallback(function (columnGroupingModel) {
-    var _props$experimentalFe2;
+    var _props$experimentalFe2, _apiRef$current$getPi, _apiRef$current$getPi2, _apiRef$current;
     if (!((_props$experimentalFe2 = props.experimentalFeatures) != null && _props$experimentalFe2.columnGrouping)) {
       return;
     }
+    // @ts-expect-error Move this logic to `Pro` package
+    var pinnedColumns = (_apiRef$current$getPi = (_apiRef$current$getPi2 = (_apiRef$current = apiRef.current).getPinnedColumns) == null ? void 0 : _apiRef$current$getPi2.call(_apiRef$current)) != null ? _apiRef$current$getPi : {};
     var columnFields = gridColumnFieldsSelector(apiRef);
     var visibleColumnFields = gridVisibleColumnFieldsSelector(apiRef);
     var groupLookup = createGroupLookup(columnGroupingModel != null ? columnGroupingModel : []);
     var unwrappedGroupingModel = unwrapGroupingColumnModel(columnGroupingModel != null ? columnGroupingModel : []);
-    var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(columnFields, unwrappedGroupingModel);
+    var columnGroupsHeaderStructure = getColumnGroupsHeaderStructure(columnFields, unwrappedGroupingModel, pinnedColumns);
     var maxDepth = visibleColumnFields.length === 0 ? 0 : Math.max.apply(Math, _toConsumableArray(visibleColumnFields.map(function (field) {
       var _unwrappedGroupingMod4, _unwrappedGroupingMod5;
       return (_unwrappedGroupingMod4 = (_unwrappedGroupingMod5 = unwrappedGroupingModel[field]) == null ? void 0 : _unwrappedGroupingMod5.length) != null ? _unwrappedGroupingMod4 : 0;

package/legacy/hooks/features/columns/gridColumnsUtils.js

@@ -54,7 +54,6 @@ export function computeFlexColumnsWidth(_ref) {
     for (var i = 0; i < flexColumns.length; i += 1) {
       var column = flexColumns[i];
       if (flexColumnsLookup.all[column.field] && flexColumnsLookup.all[column.field].frozen === true) {
-        // eslint-disable-next-line no-continue
         continue;
       }
 

package/legacy/hooks/features/filter/gridFilterUtils.js

@@ -177,14 +177,14 @@ export var buildAggregatedFilterItemsApplier = function buildAggregatedFilterIte
 
   // We generate a new function with `eval()` to avoid expensive patterns for JS engines
   // such as a dynamic object assignment, e.g. `{ [dynamicKey]: value }`.
-  var filterItemTemplate = "(function filterItem$$(appliers, row, shouldApplyFilter) {\n      ".concat(appliers.map(function (applier, i) {
+  var filterItemTemplate = "(function filterItem$$(getRowId, appliers, row, shouldApplyFilter) {\n      ".concat(appliers.map(function (applier, i) {
     return "const shouldApply".concat(i, " = !shouldApplyFilter || shouldApplyFilter(").concat(JSON.stringify(applier.item.field), ");");
   }).join('\n'), "\n\n      const result$$ = {\n      ").concat(appliers.map(function (applier, i) {
     return "".concat(JSON.stringify(String(applier.item.id)), ":\n          !shouldApply").concat(i, " ?\n            false :\n            ").concat(applier.v7 ? "appliers[".concat(i, "].fn(row)") : "appliers[".concat(i, "].fn(").concat(getRowId ? 'getRowId(row)' : 'row.id', ")"), ",\n      ");
   }).join('\n'), "};\n\n      return result$$;\n    })");
   var filterItemCore = evalCode(filterItemTemplate.replaceAll('$$', String(filterItemsApplierId)));
   var filterItem = function filterItem(row, shouldApplyItem) {
-    return filterItemCore(appliers, row, shouldApplyItem);
+    return filterItemCore(getRowId, appliers, row, shouldApplyItem);
   };
   filterItemsApplierId += 1;
   return filterItem;
@@ -238,7 +238,7 @@ export var buildAggregatedQuickFilterApplier = function buildAggregatedQuickFilt
     var result = {};
     var usedCellParams = {};
 
-    /* eslint-disable no-restricted-syntax, no-labels, no-continue */
+    /* eslint-disable no-restricted-syntax, no-labels */
     outer: for (var v = 0; v < quickFilterValues.length; v += 1) {
       var filterValue = quickFilterValues[v];
       for (var i = 0; i < appliersPerField.length; i += 1) {
@@ -273,7 +273,7 @@ export var buildAggregatedQuickFilterApplier = function buildAggregatedQuickFilt
       }
       result[filterValue] = false;
     }
-    /* eslint-enable no-restricted-syntax, no-labels, no-continue */
+    /* eslint-enable no-restricted-syntax, no-labels */
 
     return result;
   };

package/legacy/hooks/features/virtualization/useGridVirtualScroller.js

@@ -376,11 +376,17 @@ export var useGridVirtualScroller = function useGridVirtualScroller(props) {
     }
     return -1;
   }, [cellFocus, currentPage.rows]);
-  useGridApiEventHandler(apiRef, 'rowMouseEnter', function (params) {
+  useGridApiEventHandler(apiRef, 'rowMouseOver', function (params, event) {
     var _params$id;
+    if (event.currentTarget.contains(event.relatedTarget)) {
+      return;
+    }
     setHoveredRowId((_params$id = params.id) != null ? _params$id : null);
   });
-  useGridApiEventHandler(apiRef, 'rowMouseLeave', function () {
+  useGridApiEventHandler(apiRef, 'rowMouseOut', function (params, event) {
+    if (event.currentTarget.contains(event.relatedTarget)) {
+      return;
+    }
     setHoveredRowId(null);
   });
   var getRows = function getRows() {

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v6.16.1
+ * @mui/x-data-grid v6.16.2
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/locales/arSD.js

@@ -39,7 +39,7 @@ var arSDGrid = {
   columnsPanelHideAllButton: 'إخفاء الكل',
   // Filter panel text
   filterPanelAddFilter: 'إضافة مرشِح',
-  // filterPanelRemoveAll: 'Remove all',
+  filterPanelRemoveAll: 'حذف الكل',
   filterPanelDeleteIconLabel: 'حذف',
   filterPanelLogicOperator: 'عامل منطقي',
   filterPanelOperator: 'عامل',
@@ -62,34 +62,32 @@ var arSDGrid = {
   filterOperatorIsEmpty: 'خالي',
   filterOperatorIsNotEmpty: 'غير خالي',
   filterOperatorIsAnyOf: 'أي من',
-  // 'filterOperator=': '=',
-  // 'filterOperator!=': '!=',
-  // 'filterOperator>': '>',
-  // 'filterOperator>=': '>=',
-  // 'filterOperator<': '<',
-  // 'filterOperator<=': '<=',
-
+  'filterOperator=': '=',
+  'filterOperator!=': '!=',
+  'filterOperator>': '>',
+  'filterOperator>=': '>=',
+  'filterOperator<': '<',
+  'filterOperator<=': '<=',
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
-  // headerFilterOperatorIs: 'Is',
-  // headerFilterOperatorNot: 'Is not',
-  // headerFilterOperatorAfter: 'Is after',
-  // headerFilterOperatorOnOrAfter: 'Is on or after',
-  // headerFilterOperatorBefore: 'Is before',
-  // headerFilterOperatorOnOrBefore: 'Is on or before',
-  // headerFilterOperatorIsEmpty: 'Is empty',
-  // headerFilterOperatorIsNotEmpty: 'Is not empty',
-  // headerFilterOperatorIsAnyOf: 'Is any of',
-  // 'headerFilterOperator=': 'Equals',
-  // 'headerFilterOperator!=': 'Not equals',
-  // 'headerFilterOperator>': 'Greater than',
-  // 'headerFilterOperator>=': 'Greater than or equal to',
-  // 'headerFilterOperator<': 'Less than',
-  // 'headerFilterOperator<=': 'Less than or equal to',
-
+  headerFilterOperatorContains: 'يحتوي على',
+  headerFilterOperatorEquals: 'يساوي',
+  headerFilterOperatorStartsWith: 'يبدأ ب',
+  headerFilterOperatorEndsWith: 'ينتهي ب',
+  headerFilterOperatorIs: 'هو',
+  headerFilterOperatorNot: 'هو ليس',
+  headerFilterOperatorAfter: 'يقع بعد',
+  headerFilterOperatorOnOrAfter: 'هو على او بعد',
+  headerFilterOperatorBefore: 'يقع قبل',
+  headerFilterOperatorOnOrBefore: 'هو على او بعد',
+  headerFilterOperatorIsEmpty: 'هو فارغ',
+  headerFilterOperatorIsNotEmpty: 'هو ليس فارغ',
+  headerFilterOperatorIsAnyOf: 'هو أي من',
+  'headerFilterOperator=': 'يساوي',
+  'headerFilterOperator!=': 'لا يساوي',
+  'headerFilterOperator>': 'أكبر من',
+  'headerFilterOperator>=': 'أكبر من او يساوي',
+  'headerFilterOperator<': 'اصغر من',
+  'headerFilterOperator<=': 'اصغر من او يساوي',
   // Filter values text
   filterValueAny: 'أي',
   filterValueTrue: 'صائب',

package/legacy/locales/roRO.js

@@ -76,7 +76,7 @@ var roROGrid = {
   headerFilterOperatorIs: 'Este',
   headerFilterOperatorNot: 'Nu este',
   headerFilterOperatorAfter: 'Este după',
-  headerFilterOperatorOnOrAfter: 'Este la sau „după”',
+  headerFilterOperatorOnOrAfter: 'Este la sau după',
   headerFilterOperatorBefore: 'Este înainte de',
   headerFilterOperatorOnOrBefore: 'este la sau înainte de',
   headerFilterOperatorIsEmpty: 'Este gol',

package/locales/arSD.js

@@ -37,7 +37,7 @@ const arSDGrid = {
   columnsPanelHideAllButton: 'إخفاء الكل',
   // Filter panel text
   filterPanelAddFilter: 'إضافة مرشِح',
-  // filterPanelRemoveAll: 'Remove all',
+  filterPanelRemoveAll: 'حذف الكل',
   filterPanelDeleteIconLabel: 'حذف',
   filterPanelLogicOperator: 'عامل منطقي',
   filterPanelOperator: 'عامل',
@@ -60,34 +60,32 @@ const arSDGrid = {
   filterOperatorIsEmpty: 'خالي',
   filterOperatorIsNotEmpty: 'غير خالي',
   filterOperatorIsAnyOf: 'أي من',
-  // 'filterOperator=': '=',
-  // 'filterOperator!=': '!=',
-  // 'filterOperator>': '>',
-  // 'filterOperator>=': '>=',
-  // 'filterOperator<': '<',
-  // 'filterOperator<=': '<=',
-
+  'filterOperator=': '=',
+  'filterOperator!=': '!=',
+  'filterOperator>': '>',
+  'filterOperator>=': '>=',
+  'filterOperator<': '<',
+  'filterOperator<=': '<=',
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
-  // headerFilterOperatorIs: 'Is',
-  // headerFilterOperatorNot: 'Is not',
-  // headerFilterOperatorAfter: 'Is after',
-  // headerFilterOperatorOnOrAfter: 'Is on or after',
-  // headerFilterOperatorBefore: 'Is before',
-  // headerFilterOperatorOnOrBefore: 'Is on or before',
-  // headerFilterOperatorIsEmpty: 'Is empty',
-  // headerFilterOperatorIsNotEmpty: 'Is not empty',
-  // headerFilterOperatorIsAnyOf: 'Is any of',
-  // 'headerFilterOperator=': 'Equals',
-  // 'headerFilterOperator!=': 'Not equals',
-  // 'headerFilterOperator>': 'Greater than',
-  // 'headerFilterOperator>=': 'Greater than or equal to',
-  // 'headerFilterOperator<': 'Less than',
-  // 'headerFilterOperator<=': 'Less than or equal to',
-
+  headerFilterOperatorContains: 'يحتوي على',
+  headerFilterOperatorEquals: 'يساوي',
+  headerFilterOperatorStartsWith: 'يبدأ ب',
+  headerFilterOperatorEndsWith: 'ينتهي ب',
+  headerFilterOperatorIs: 'هو',
+  headerFilterOperatorNot: 'هو ليس',
+  headerFilterOperatorAfter: 'يقع بعد',
+  headerFilterOperatorOnOrAfter: 'هو على او بعد',
+  headerFilterOperatorBefore: 'يقع قبل',
+  headerFilterOperatorOnOrBefore: 'هو على او بعد',
+  headerFilterOperatorIsEmpty: 'هو فارغ',
+  headerFilterOperatorIsNotEmpty: 'هو ليس فارغ',
+  headerFilterOperatorIsAnyOf: 'هو أي من',
+  'headerFilterOperator=': 'يساوي',
+  'headerFilterOperator!=': 'لا يساوي',
+  'headerFilterOperator>': 'أكبر من',
+  'headerFilterOperator>=': 'أكبر من او يساوي',
+  'headerFilterOperator<': 'اصغر من',
+  'headerFilterOperator<=': 'اصغر من او يساوي',
   // Filter values text
   filterValueAny: 'أي',
   filterValueTrue: 'صائب',

package/locales/roRO.js

@@ -74,7 +74,7 @@ const roROGrid = {
   headerFilterOperatorIs: 'Este',
   headerFilterOperatorNot: 'Nu este',
   headerFilterOperatorAfter: 'Este după',
-  headerFilterOperatorOnOrAfter: 'Este la sau „după”',
+  headerFilterOperatorOnOrAfter: 'Este la sau după',
   headerFilterOperatorBefore: 'Este înainte de',
   headerFilterOperatorOnOrBefore: 'este la sau înainte de',
   headerFilterOperatorIsEmpty: 'Este gol',

package/models/events/gridEventLookup.d.ts

@@ -43,6 +43,20 @@ export interface GridRowEventLookup {
         params: GridRowParams;
         event: React.MouseEvent<HTMLElement>;
     };
+    /**
+     * @ignore - do not document.
+     */
+    rowMouseOut: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    /**
+     * @ignore - do not document.
+     */
+    rowMouseOver: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
     /**
      * Fired when the user starts dragging a row. It's mapped to the `dragstart` DOM event.
      * @ignore - do not document.

package/models/props/DataGridProps.d.ts

@@ -329,7 +329,7 @@ export interface DataGridPropsWithDefaultValues {
     /**
      * If `true`, the grid will not use `valueFormatter` when exporting to CSV or copying to clipboard.
      * If an object is provided, you can choose to ignore the `valueFormatter` for CSV export or clipboard export.
-     * @default: false
+     * @default false
      */
     unstable_ignoreValueFormatterDuringExport: boolean | {
         csvExport?: boolean;

package/modern/DataGrid/DataGrid.js

@@ -27,6 +27,13 @@ const DataGridRaw = /*#__PURE__*/React.forwardRef(function DataGrid(inProps, ref
     }))
   });
 });
+/**
+ * Demos:
+ * - [DataGrid](https://mui.com/x/react-data-grid/demo/)
+ *
+ * API:
+ * - [DataGrid API](https://mui.com/x/api/data-grid/data-grid/)
+ */
 export const DataGrid = /*#__PURE__*/React.memo(DataGridRaw);
 
 /**
@@ -660,7 +667,7 @@ DataGridRaw.propTypes = {
   /**
    * If `true`, the grid will not use `valueFormatter` when exporting to CSV or copying to clipboard.
    * If an object is provided, you can choose to ignore the `valueFormatter` for CSV export or clipboard export.
-   * @default: false
+   * @default false
    */
   unstable_ignoreValueFormatterDuringExport: PropTypes.oneOfType([PropTypes.shape({
     clipboardExport: PropTypes.bool,

package/modern/colDef/gridDateColDef.js

@@ -51,8 +51,6 @@ export const GRID_DATE_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
   valueFormatter: gridDateFormatter,
   filterOperators: getGridDateOperators(),
   renderEditCell: renderEditDateCell,
-  getApplyQuickFilterFn: undefined,
-  getApplyQuickFilterFnV7: undefined,
   // @ts-ignore
   pastedValueParser: value => new Date(value)
 });
@@ -62,8 +60,6 @@ export const GRID_DATETIME_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
   valueFormatter: gridDateTimeFormatter,
   filterOperators: getGridDateOperators(true),
   renderEditCell: renderEditDateCell,
-  getApplyQuickFilterFn: undefined,
-  getApplyQuickFilterFnV7: undefined,
   // @ts-ignore
   pastedValueParser: value => new Date(value)
 });

package/modern/components/GridRow.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["selected", "hovered", "rowId", "row", "index", "style", "position", "rowHeight", "className", "visibleColumns", "renderedColumns", "containerWidth", "firstColumnToRender", "lastColumnToRender", "isLastVisible", "focusedCellColumnIndexNotInRange", "isNotVisible", "focusedCell", "tabbableCell", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave"];
+const _excluded = ["selected", "hovered", "rowId", "row", "index", "style", "position", "rowHeight", "className", "visibleColumns", "renderedColumns", "containerWidth", "firstColumnToRender", "lastColumnToRender", "isLastVisible", "focusedCellColumnIndexNotInRange", "isNotVisible", "focusedCell", "tabbableCell", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave", "onMouseOut", "onMouseOver"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -76,7 +76,9 @@ const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
       onClick,
       onDoubleClick,
       onMouseEnter,
-      onMouseLeave
+      onMouseLeave,
+      onMouseOut,
+      onMouseOver
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const apiRef = useGridApiContext();
@@ -321,7 +323,9 @@ const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
     onClick: publishClick,
     onDoubleClick: publish('rowDoubleClick', onDoubleClick),
     onMouseEnter: publish('rowMouseEnter', onMouseEnter),
-    onMouseLeave: publish('rowMouseLeave', onMouseLeave)
+    onMouseLeave: publish('rowMouseLeave', onMouseLeave),
+    onMouseOut: publish('rowMouseOut', onMouseOut),
+    onMouseOver: publish('rowMouseOver', onMouseOver)
   } : null;
   return /*#__PURE__*/_jsxs("div", _extends({
     ref: handleRef,

package/modern/components/cell/GridCell.js

@@ -48,10 +48,11 @@ const useUtilityClasses = ownerState => {
     showRightBorder,
     isEditable,
     isSelected,
+    isSelectionMode,
     classes
   } = ownerState;
   const slots = {
-    root: ['cell', `cell--text${capitalize(align)}`, isEditable && 'cell--editable', isSelected && 'selected', showRightBorder && 'cell--withRightBorder', 'withBorderColor'],
+    root: ['cell', `cell--text${capitalize(align)}`, isEditable && 'cell--editable', isSelected && 'selected', showRightBorder && 'cell--withRightBorder', isSelectionMode && !isEditable && 'cell--selectionMode', 'withBorderColor'],
     content: ['cellContent']
   };
   return composeClasses(slots, getDataGridUtilityClass, classes);
@@ -458,12 +459,15 @@ const GridCellV7 = /*#__PURE__*/React.forwardRef((props, ref) => {
   const cellRef = React.useRef(null);
   const handleRef = useForkRef(ref, cellRef);
   const focusElementRef = React.useRef(null);
+  // @ts-expect-error To access `unstable_cellSelection` flag as it's a `premium` feature
+  const isSelectionMode = rootProps.unstable_cellSelection ?? false;
   const ownerState = {
     align,
     showRightBorder,
     isEditable,
     classes: rootProps.classes,
-    isSelected
+    isSelected,
+    isSelectionMode
   };
   const classes = useUtilityClasses(ownerState);
   const publishMouseUp = React.useCallback(eventName => event => {

package/modern/components/containers/GridRootStyles.js

@@ -395,6 +395,9 @@ export const GridRootStyles = styled('div', {
       overflow: 'hidden',
       textOverflow: 'ellipsis'
     },
+    [`& .${gridClasses.cell}.${gridClasses['cell--selectionMode']}`]: {
+      cursor: 'default'
+    },
     [`& .${gridClasses.cell}.${gridClasses['cell--editing']}`]: {
       padding: 1,
       display: 'flex',

package/modern/components/panel/filterPanel/GridFilterForm.js

@@ -428,4 +428,12 @@ process.env.NODE_ENV !== "production" ? GridFilterForm.propTypes = {
    */
   valueInputProps: PropTypes.any
 } : void 0;
+
+/**
+ * Demos:
+ * - [Filtering - overview](https://mui.com/x/react-data-grid/filtering/)
+ *
+ * API:
+ * - [GridFilterForm API](https://mui.com/x/api/data-grid/grid-filter-form/)
+ */
 export { GridFilterForm };

package/modern/components/panel/filterPanel/GridFilterPanel.js

@@ -211,4 +211,12 @@ process.env.NODE_ENV !== "production" ? GridFilterPanel.propTypes = {
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
 } : void 0;
+
+/**
+ * Demos:
+ * - [Filtering - overview](https://mui.com/x/react-data-grid/filtering/)
+ *
+ * API:
+ * - [GridFilterPanel API](https://mui.com/x/api/data-grid/grid-filter-panel/)
+ */
 export { GridFilterPanel, getGridFilter };