@mui/x-data-grid 7.9.0 → 7.10.0

package/CHANGELOG.md

@@ -3,6 +3,80 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 7.10.0
+
+_Jul 11, 2024_
+
+We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎁 Add selectors to support showing child row count in footer in the Data Grid
+- ✨ New APIs for retrieving current item tree and item's children IDs in the Tree View
+- 🌍 Improve Spanish (es-ES) locale on the Data Grid
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.10.0`
+
+- [DataGrid] Add selectors to support showing child row count in footer (#13725) @KenanYusuf
+- [DataGrid] Fix incorrect panels position when using a toolbar (#13474) @oukunan
+- [DataGrid] Set default variant to `'standard'` in `GridFilterInputMultipleValue` (#13129) @tarunrajput
+- [DataGrid] Use `readonly` on more array props (#13331) @pcorpet
+- [l10n] Improve Spanish (es-ES) locale (#13772) @joserealdev
+
+#### `@mui/x-data-grid-pro@7.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.10.0`, plus:
+
+- [DataGridPro] Keep bottom pinned row at the bottom (#13313) @romgrk
+
+#### `@mui/x-data-grid-premium@7.10.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.10.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.10.0`
+
+- [fields] Prevent infinite recursion when ensuring selection (#13779) @LukasTy
+- [fields] Unify fields behavior regardless of the `readOnly` flag (#13688) @LukasTy
+
+#### `@mui/x-date-pickers-pro@7.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.10.0`, plus:
+
+- [DateRangePicker] Fix `calendarHeader` slot props propagation (#13780) @LukasTy
+- [DateTimeRangePicker] Resolve `format` from given `views` (#13743) @LukasTy
+
+### Charts
+
+#### `@mui/x-charts@7.10.0`
+
+- [charts] Fix displaying area of a `LineChart` when using the `log` scale (#13791) @alexfauquette
+- [charts] Use correct click handler prop on pie chart `OnSeriesItemClick` documentation (#13761) @tonyhallett
+
+### Tree View
+
+#### `@mui/x-tree-view@7.10.0`
+
+- [TreeView] Add `getItemTree` and `getItemOrderedChildrenIds` methods to the public API (#13804) @flaviendelangle
+- [TreeView] Add utility function to check if an optional plugin is present (#13788) @flaviendelangle
+
+### Docs
+
+- [docs] Add missing default `loading` prop value (#13604) @oliviertassinari
+- [docs] Add the `DateTimeRangePicker` to the "Commonly used components" demo (#13775) @flaviendelangle
+- [docs] Fix Pickers customization playground overflow (#13742) @LukasTy
+- [docs] Move Pickers dialog guidelines to accessibility page (#13778) @arthurbalduini
+
+### Core
+
+- [core] Sort `DATA_GRID_PROPS_DEFAULT_VALUES` alphabetically (#13783) @oliviertassinari
+- [test] Fix split infinitive use in tests @oliviertassinari
+
 ## 7.9.0
 
 _Jul 5, 2024_

package/DataGrid/DataGrid.js

@@ -333,6 +333,7 @@ DataGridRaw.propTypes = {
   keepNonExistentRowsSelected: PropTypes.bool,
   /**
    * If `true`, a loading overlay is displayed.
+   * @default false
    */
   loading: PropTypes.bool,
   /**

package/DataGrid/useDataGridProps.js

@@ -23,54 +23,55 @@ const DATA_GRID_FORCED_PROPS = {
 export const DATA_GRID_PROPS_DEFAULT_VALUES = {
   autoHeight: false,
   autoPageSize: false,
+  autosizeOnMount: false,
   checkboxSelection: false,
   checkboxSelectionVisibleOnly: false,
+  clipboardCopyCellDelimiter: '\t',
   columnBufferPx: 150,
-  rowBufferPx: 150,
-  rows: [],
-  rowSelection: true,
+  columnHeaderHeight: 56,
+  disableAutosize: false,
   disableColumnFilter: false,
   disableColumnMenu: false,
+  disableColumnReorder: false,
+  disableColumnResize: false,
   disableColumnSelector: false,
+  disableColumnSorting: false,
   disableDensitySelector: false,
   disableEval: false,
   disableMultipleColumnsFiltering: false,
-  disableMultipleRowSelection: false,
-  disableColumnSorting: false,
   disableMultipleColumnsSorting: false,
+  disableMultipleRowSelection: false,
   disableRowSelectionOnClick: false,
   disableVirtualization: false,
   editMode: GridEditModes.Cell,
-  filterMode: 'client',
   filterDebounceMs: 150,
-  columnHeaderHeight: 56,
+  filterMode: 'client',
   hideFooter: false,
   hideFooterPagination: false,
   hideFooterRowCount: false,
   hideFooterSelectedRowCount: false,
   ignoreDiacritics: false,
+  ignoreValueFormatterDuringExport: false,
+  keepColumnPositionIfDraggedOutside: false,
+  keepNonExistentRowsSelected: false,
+  loading: false,
   logger: console,
   logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',
+  pageSizeOptions: [25, 50, 100],
   pagination: false,
   paginationMode: 'client',
-  rowHeight: 52,
   resizeThrottleMs: 60,
-  pageSizeOptions: [25, 50, 100],
+  rowBufferPx: 150,
+  rowHeight: 52,
+  rowPositionsDebounceMs: 166,
+  rows: [],
+  rowSelection: true,
   rowSpacingType: 'margin',
   showCellVerticalBorder: false,
   showColumnVerticalBorder: false,
-  sortingOrder: ['asc', 'desc', null],
   sortingMode: 'client',
-  throttleRowsMs: 0,
-  disableColumnReorder: false,
-  disableColumnResize: false,
-  keepNonExistentRowsSelected: false,
-  keepColumnPositionIfDraggedOutside: false,
-  ignoreValueFormatterDuringExport: false,
-  clipboardCopyCellDelimiter: '\t',
-  rowPositionsDebounceMs: 166,
-  autosizeOnMount: false,
-  disableAutosize: false
+  sortingOrder: ['asc', 'desc', null],
+  throttleRowsMs: 0
 };
 const defaultSlots = DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
 export const useDataGridProps = inProps => {

package/components/base/GridOverlays.js

@@ -55,7 +55,7 @@ function GridOverlayWrapper(props) {
   const rootProps = useGridRootProps();
   const currentPage = useGridVisibleRows(apiRef, rootProps);
   const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
-  let height = dimensions.viewportOuterSize.height - dimensions.headersTotalHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
+  let height = dimensions.viewportOuterSize.height - dimensions.topContainerHeight - dimensions.bottomContainerHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
   if (rootProps.autoHeight && currentPage.rows.length === 0 || height === 0) {
     height = getMinimalContentHeight(apiRef);
   }

package/components/containers/GridRoot.js

@@ -1,18 +1,17 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "className"];
+const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_capitalize as capitalize, unstable_composeClasses as composeClasses } from '@mui/utils';
-import { styled } from '@mui/system';
 import { GridRootStyles } from './GridRootStyles';
 import { useGridSelector } from '../../hooks/utils/useGridSelector';
 import { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { getDataGridUtilityClass } from '../../constants/gridClasses';
 import { gridDensitySelector } from '../../hooks/features/density/densitySelector';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     autoHeight,
@@ -25,15 +24,9 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getDataGridUtilityClass, classes);
 };
-const GridPanelAnchor = styled('div')({
-  position: 'absolute',
-  top: `var(--DataGrid-headersTotalHeight)`,
-  left: 0
-});
 const GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   const rootProps = useGridRootProps();
   const {
-      children,
       className
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
@@ -54,16 +47,11 @@ const GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   if (!mountedState) {
     return null;
   }
-  return /*#__PURE__*/_jsxs(GridRootStyles, _extends({
+  return /*#__PURE__*/_jsx(GridRootStyles, _extends({
     ref: handleRef,
     className: clsx(className, classes.root),
     ownerState: ownerState
-  }, other, {
-    children: [/*#__PURE__*/_jsx(GridPanelAnchor, {
-      role: "presentation",
-      "data-id": "gridPanelAnchor"
-    }), children]
-  }));
+  }, other));
 });
 process.env.NODE_ENV !== "production" ? GridRoot.propTypes = {
   // ----------------------------- Warning --------------------------------

package/components/panel/filterPanel/GridFilterInputMultipleValue.js

@@ -18,7 +18,7 @@ function GridFilterInputMultipleValue(props) {
       error,
       helperText,
       size,
-      variant
+      variant = 'standard'
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const TextFieldProps = {

package/components/virtualization/GridMainContainer.js

@@ -3,7 +3,12 @@ import * as React from 'react';
 import { styled } from '@mui/system';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { useGridAriaAttributes } from '../../hooks/utils/useGridAriaAttributes';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const GridPanelAnchor = styled('div')({
+  position: 'absolute',
+  top: `var(--DataGrid-headersTotalHeight)`,
+  left: 0
+});
 const Element = styled('div', {
   name: 'MuiDataGrid',
   slot: 'Main',
@@ -16,12 +21,15 @@ const Element = styled('div', {
 export const GridMainContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
   const ariaAttributes = useGridAriaAttributes();
   const rootProps = useGridRootProps();
-  return /*#__PURE__*/_jsx(Element, _extends({
+  return /*#__PURE__*/_jsxs(Element, _extends({
     ref: ref,
     ownerState: rootProps,
     className: props.className,
     tabIndex: -1
   }, ariaAttributes, {
-    children: props.children
+    children: [/*#__PURE__*/_jsx(GridPanelAnchor, {
+      role: "presentation",
+      "data-id": "gridPanelAnchor"
+    }), props.children]
   }));
 });

package/components/virtualization/GridVirtualScroller.js

@@ -87,7 +87,9 @@ function GridVirtualScroller(props) {
             virtualScroller: virtualScroller
           })]
         }))
-      })), rows.length > 0 && /*#__PURE__*/_jsx(SpaceFiller, {}), /*#__PURE__*/_jsx(BottomContainer, {
+      })), /*#__PURE__*/_jsx(SpaceFiller, {
+        rowsLength: rows.length
+      }), /*#__PURE__*/_jsx(BottomContainer, {
         children: /*#__PURE__*/_jsx(rootProps.slots.pinnedRows, {
           position: "bottom",
           virtualScroller: virtualScroller

package/components/virtualization/GridVirtualScrollerFiller.d.ts

@@ -1,4 +1,8 @@
 import * as React from 'react';
-declare function GridVirtualScrollerFiller(): React.JSX.Element | null;
+type Props = {
+    /** The number of rows */
+    rowsLength: number;
+};
+declare function GridVirtualScrollerFiller({ rowsLength }: Props): React.JSX.Element | null;
 declare const Memoized: typeof GridVirtualScrollerFiller;
 export { Memoized as GridVirtualScrollerFiller };

package/components/virtualization/GridVirtualScrollerFiller.js

@@ -16,22 +16,24 @@ const Pinned = styled('div')({
   position: 'sticky',
   height: '100%',
   boxSizing: 'border-box',
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)',
+  borderTop: '1px solid var(--rowBorderColor)',
   backgroundColor: 'var(--DataGrid-pinnedBackground)'
 });
 const PinnedLeft = styled(Pinned)({
   left: 0,
-  borderRight: '1px solid var(--DataGrid-rowBorderColor)'
+  borderRight: '1px solid var(--rowBorderColor)'
 });
 const PinnedRight = styled(Pinned)({
   right: 0,
-  borderLeft: '1px solid var(--DataGrid-rowBorderColor)'
+  borderLeft: '1px solid var(--rowBorderColor)'
 });
 const Main = styled('div')({
   flexGrow: 1,
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)'
+  borderTop: '1px solid var(--rowBorderColor)'
 });
-function GridVirtualScrollerFiller() {
+function GridVirtualScrollerFiller({
+  rowsLength
+}) {
   const apiRef = useGridApiContext();
   const {
     viewportOuterSize,
@@ -52,7 +54,8 @@ function GridVirtualScrollerFiller() {
     className: gridClasses.filler,
     role: "presentation",
     style: {
-      height
+      height,
+      '--rowBorderColor': rowsLength === 0 ? 'transparent' : 'var(--DataGrid-rowBorderColor)'
     },
     children: [leftPinnedWidth > 0 && /*#__PURE__*/_jsx(PinnedLeft, {
       className: gridClasses['filler--pinnedLeft'],

package/hooks/features/filter/gridFilterSelector.d.ts

@@ -64,6 +64,17 @@ export declare const gridExpandedRowCountSelector: import("../../../utils/create
  * @category Filtering
  */
 export declare const gridFilteredTopLevelRowCountSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, number>;
+/**
+ * Get the amount of rows accessible after the filtering process.
+ * Includes top level and descendant rows.
+ * @category Filtering
+ */
+export declare const gridFilteredRowCountSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, number>;
+/**
+ * Get the amount of descendant rows accessible after the filtering process.
+ * @category Filtering
+ */
+export declare const gridFilteredDescendantRowCountSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, number>;
 /**
  * @category Filtering
  * @ignore - do not document.

package/hooks/features/filter/gridFilterSelector.js

@@ -89,6 +89,19 @@ export const gridExpandedRowCountSelector = createSelector(gridExpandedSortedRow
  */
 export const gridFilteredTopLevelRowCountSelector = createSelector(gridFilteredSortedTopLevelRowEntriesSelector, visibleSortedTopLevelRows => visibleSortedTopLevelRows.length);
 
+/**
+ * Get the amount of rows accessible after the filtering process.
+ * Includes top level and descendant rows.
+ * @category Filtering
+ */
+export const gridFilteredRowCountSelector = createSelector(gridFilteredSortedRowEntriesSelector, filteredSortedRowEntries => filteredSortedRowEntries.length);
+
+/**
+ * Get the amount of descendant rows accessible after the filtering process.
+ * @category Filtering
+ */
+export const gridFilteredDescendantRowCountSelector = createSelector(gridFilteredRowCountSelector, gridFilteredTopLevelRowCountSelector, (totalRowCount, topLevelRowCount) => totalRowCount - topLevelRowCount);
+
 /**
  * @category Filtering
  * @ignore - do not document.

package/hooks/features/virtualization/useGridVirtualScroller.js

@@ -361,20 +361,12 @@ export const useGridVirtualScroller = () => {
     overflowY: rootProps.autoHeight ? 'hidden' : undefined
   }), [needsHorizontalScrollbar, rootProps.autoHeight]);
   const contentSize = React.useMemo(() => {
-    // In cases where the columns exceed the available width,
-    // the horizontal scrollbar should be shown even when there're no rows.
-    // Keeping 1px as minimum height ensures that the scrollbar will visible if necessary.
-    const height = Math.max(contentHeight, 1);
     const size = {
       width: needsHorizontalScrollbar ? columnsTotalWidth : 'auto',
-      height
+      height: contentHeight
     };
-    if (rootProps.autoHeight) {
-      if (currentPage.rows.length === 0) {
-        size.height = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
-      } else {
-        size.height = contentHeight;
-      }
+    if (rootProps.autoHeight && currentPage.rows.length === 0) {
+      size.height = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
     }
     return size;
   }, [apiRef, columnsTotalWidth, contentHeight, needsHorizontalScrollbar, rootProps.autoHeight, currentPage.rows.length]);

package/index.js

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

package/locales/esES.js

@@ -33,8 +33,7 @@ const esESGrid = {
   columnsManagementSearchTitle: 'Buscar',
   columnsManagementNoColumns: 'Sin columnas',
   columnsManagementShowHideAllText: 'Mostrar/Ocultar todas',
-  // columnsManagementReset: 'Reset',
-
+  columnsManagementReset: 'Restablecer',
   // Filter panel text
   filterPanelAddFilter: 'Agregar filtro',
   filterPanelRemoveAll: 'Remover todos',

package/models/api/gridRowSelectionApi.d.ts

@@ -30,9 +30,9 @@ export interface GridRowSelectionApi {
     /**
      * Updates the selected rows to be those passed to the `rowIds` argument.
      * Any row already selected will be unselected.
-     * @param {GridRowId[]} rowIds The row ids to select.
+     * @param {readonly GridRowId[]} rowIds The row ids to select.
      */
-    setRowSelectionModel: (rowIds: GridRowId[]) => void;
+    setRowSelectionModel: (rowIds: readonly GridRowId[]) => void;
 }
 export interface GridRowMultiSelectionApi {
     /**

package/models/colDef/gridColDef.d.ts

@@ -79,7 +79,7 @@ export interface GridBaseColDef<R extends GridValidRowModel = GridValidRowModel,
     /**
      * The order of the sorting sequence.
      */
-    sortingOrder?: GridSortDirection[];
+    sortingOrder?: readonly GridSortDirection[];
     /**
      * If `true`, the column is resizable.
      * @default true
@@ -207,7 +207,7 @@ export interface GridBaseColDef<R extends GridValidRowModel = GridValidRowModel,
     /**
      * Allows setting the filter operators for this column.
      */
-    filterOperators?: GridFilterOperator<R, V, F>[];
+    filterOperators?: readonly GridFilterOperator<R, V, F>[];
     /**
      * The callback that generates a filtering function for a given quick filter value.
      * This function can return `null` to skip filtering for this value and column.
@@ -247,9 +247,9 @@ export interface GridActionsColDef<R extends GridValidRowModel = any, V = any, F
     /**
      * Function that returns the actions to be shown.
      * @param {GridRowParams} params The params for each row.
-     * @returns {React.ReactElement<GridActionsCellItemProps>[]} An array of [[GridActionsCell]] elements.
+     * @returns {readonly React.ReactElement<GridActionsCellItemProps>[]} An array of [[GridActionsCell]] elements.
      */
-    getActions: (params: GridRowParams<R>) => React.ReactElement<GridActionsCellItemProps>[];
+    getActions: (params: GridRowParams<R>) => readonly React.ReactElement<GridActionsCellItemProps>[];
 }
 /**
  * Column Definition interface used for columns with the `singleSelect` type.

package/models/gridRowSelectionModel.d.ts

@@ -1,3 +1,3 @@
 import { GridRowId } from './gridRows';
-export type GridInputRowSelectionModel = GridRowId[] | GridRowId;
-export type GridRowSelectionModel = GridRowId[];
+export type GridInputRowSelectionModel = readonly GridRowId[] | GridRowId;
+export type GridRowSelectionModel = readonly GridRowId[];

package/models/props/DataGridProps.d.ts

@@ -234,6 +234,11 @@ export interface DataGridPropsWithDefaultValues<R extends GridValidRowModel = an
      * @default "error" ("warn" in dev mode)
      */
     logLevel: keyof Logger | false;
+    /**
+     * If `true`, a loading overlay is displayed.
+     * @default false
+     */
+    loading: boolean;
     /**
      * If `true`, pagination is enabled.
      * @default false
@@ -698,10 +703,6 @@ export interface DataGridPropsWithoutDefaultValue<R extends GridValidRowModel =
      * Return the id of a given [[GridRowModel]].
      */
     getRowId?: GridRowIdGetter<R>;
-    /**
-     * If `true`, a loading overlay is displayed.
-     */
-    loading?: boolean;
     /**
      * Nonce of the inline styles for [Content Security Policy](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute).
      */

package/modern/DataGrid/DataGrid.js

@@ -333,6 +333,7 @@ DataGridRaw.propTypes = {
   keepNonExistentRowsSelected: PropTypes.bool,
   /**
    * If `true`, a loading overlay is displayed.
+   * @default false
    */
   loading: PropTypes.bool,
   /**

package/modern/DataGrid/useDataGridProps.js

@@ -23,54 +23,55 @@ const DATA_GRID_FORCED_PROPS = {
 export const DATA_GRID_PROPS_DEFAULT_VALUES = {
   autoHeight: false,
   autoPageSize: false,
+  autosizeOnMount: false,
   checkboxSelection: false,
   checkboxSelectionVisibleOnly: false,
+  clipboardCopyCellDelimiter: '\t',
   columnBufferPx: 150,
-  rowBufferPx: 150,
-  rows: [],
-  rowSelection: true,
+  columnHeaderHeight: 56,
+  disableAutosize: false,
   disableColumnFilter: false,
   disableColumnMenu: false,
+  disableColumnReorder: false,
+  disableColumnResize: false,
   disableColumnSelector: false,
+  disableColumnSorting: false,
   disableDensitySelector: false,
   disableEval: false,
   disableMultipleColumnsFiltering: false,
-  disableMultipleRowSelection: false,
-  disableColumnSorting: false,
   disableMultipleColumnsSorting: false,
+  disableMultipleRowSelection: false,
   disableRowSelectionOnClick: false,
   disableVirtualization: false,
   editMode: GridEditModes.Cell,
-  filterMode: 'client',
   filterDebounceMs: 150,
-  columnHeaderHeight: 56,
+  filterMode: 'client',
   hideFooter: false,
   hideFooterPagination: false,
   hideFooterRowCount: false,
   hideFooterSelectedRowCount: false,
   ignoreDiacritics: false,
+  ignoreValueFormatterDuringExport: false,
+  keepColumnPositionIfDraggedOutside: false,
+  keepNonExistentRowsSelected: false,
+  loading: false,
   logger: console,
   logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',
+  pageSizeOptions: [25, 50, 100],
   pagination: false,
   paginationMode: 'client',
-  rowHeight: 52,
   resizeThrottleMs: 60,
-  pageSizeOptions: [25, 50, 100],
+  rowBufferPx: 150,
+  rowHeight: 52,
+  rowPositionsDebounceMs: 166,
+  rows: [],
+  rowSelection: true,
   rowSpacingType: 'margin',
   showCellVerticalBorder: false,
   showColumnVerticalBorder: false,
-  sortingOrder: ['asc', 'desc', null],
   sortingMode: 'client',
-  throttleRowsMs: 0,
-  disableColumnReorder: false,
-  disableColumnResize: false,
-  keepNonExistentRowsSelected: false,
-  keepColumnPositionIfDraggedOutside: false,
-  ignoreValueFormatterDuringExport: false,
-  clipboardCopyCellDelimiter: '\t',
-  rowPositionsDebounceMs: 166,
-  autosizeOnMount: false,
-  disableAutosize: false
+  sortingOrder: ['asc', 'desc', null],
+  throttleRowsMs: 0
 };
 const defaultSlots = DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
 export const useDataGridProps = inProps => {

package/modern/components/base/GridOverlays.js

@@ -55,7 +55,7 @@ function GridOverlayWrapper(props) {
   const rootProps = useGridRootProps();
   const currentPage = useGridVisibleRows(apiRef, rootProps);
   const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
-  let height = dimensions.viewportOuterSize.height - dimensions.headersTotalHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
+  let height = dimensions.viewportOuterSize.height - dimensions.topContainerHeight - dimensions.bottomContainerHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
   if (rootProps.autoHeight && currentPage.rows.length === 0 || height === 0) {
     height = getMinimalContentHeight(apiRef);
   }

package/modern/components/containers/GridRoot.js

@@ -1,18 +1,17 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "className"];
+const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_capitalize as capitalize, unstable_composeClasses as composeClasses } from '@mui/utils';
-import { styled } from '@mui/system';
 import { GridRootStyles } from './GridRootStyles';
 import { useGridSelector } from '../../hooks/utils/useGridSelector';
 import { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { getDataGridUtilityClass } from '../../constants/gridClasses';
 import { gridDensitySelector } from '../../hooks/features/density/densitySelector';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     autoHeight,
@@ -25,15 +24,9 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getDataGridUtilityClass, classes);
 };
-const GridPanelAnchor = styled('div')({
-  position: 'absolute',
-  top: `var(--DataGrid-headersTotalHeight)`,
-  left: 0
-});
 const GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   const rootProps = useGridRootProps();
   const {
-      children,
       className
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
@@ -54,16 +47,11 @@ const GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   if (!mountedState) {
     return null;
   }
-  return /*#__PURE__*/_jsxs(GridRootStyles, _extends({
+  return /*#__PURE__*/_jsx(GridRootStyles, _extends({
     ref: handleRef,
     className: clsx(className, classes.root),
     ownerState: ownerState
-  }, other, {
-    children: [/*#__PURE__*/_jsx(GridPanelAnchor, {
-      role: "presentation",
-      "data-id": "gridPanelAnchor"
-    }), children]
-  }));
+  }, other));
 });
 process.env.NODE_ENV !== "production" ? GridRoot.propTypes = {
   // ----------------------------- Warning --------------------------------

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

@@ -18,7 +18,7 @@ function GridFilterInputMultipleValue(props) {
       error,
       helperText,
       size,
-      variant
+      variant = 'standard'
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const TextFieldProps = {

package/modern/components/virtualization/GridMainContainer.js

@@ -3,7 +3,12 @@ import * as React from 'react';
 import { styled } from '@mui/system';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { useGridAriaAttributes } from '../../hooks/utils/useGridAriaAttributes';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const GridPanelAnchor = styled('div')({
+  position: 'absolute',
+  top: `var(--DataGrid-headersTotalHeight)`,
+  left: 0
+});
 const Element = styled('div', {
   name: 'MuiDataGrid',
   slot: 'Main',
@@ -16,12 +21,15 @@ const Element = styled('div', {
 export const GridMainContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
   const ariaAttributes = useGridAriaAttributes();
   const rootProps = useGridRootProps();
-  return /*#__PURE__*/_jsx(Element, _extends({
+  return /*#__PURE__*/_jsxs(Element, _extends({
     ref: ref,
     ownerState: rootProps,
     className: props.className,
     tabIndex: -1
   }, ariaAttributes, {
-    children: props.children
+    children: [/*#__PURE__*/_jsx(GridPanelAnchor, {
+      role: "presentation",
+      "data-id": "gridPanelAnchor"
+    }), props.children]
   }));
 });

package/modern/components/virtualization/GridVirtualScroller.js

@@ -87,7 +87,9 @@ function GridVirtualScroller(props) {
             virtualScroller: virtualScroller
           })]
         }))
-      })), rows.length > 0 && /*#__PURE__*/_jsx(SpaceFiller, {}), /*#__PURE__*/_jsx(BottomContainer, {
+      })), /*#__PURE__*/_jsx(SpaceFiller, {
+        rowsLength: rows.length
+      }), /*#__PURE__*/_jsx(BottomContainer, {
         children: /*#__PURE__*/_jsx(rootProps.slots.pinnedRows, {
           position: "bottom",
           virtualScroller: virtualScroller

package/modern/components/virtualization/GridVirtualScrollerFiller.js

@@ -16,22 +16,24 @@ const Pinned = styled('div')({
   position: 'sticky',
   height: '100%',
   boxSizing: 'border-box',
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)',
+  borderTop: '1px solid var(--rowBorderColor)',
   backgroundColor: 'var(--DataGrid-pinnedBackground)'
 });
 const PinnedLeft = styled(Pinned)({
   left: 0,
-  borderRight: '1px solid var(--DataGrid-rowBorderColor)'
+  borderRight: '1px solid var(--rowBorderColor)'
 });
 const PinnedRight = styled(Pinned)({
   right: 0,
-  borderLeft: '1px solid var(--DataGrid-rowBorderColor)'
+  borderLeft: '1px solid var(--rowBorderColor)'
 });
 const Main = styled('div')({
   flexGrow: 1,
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)'
+  borderTop: '1px solid var(--rowBorderColor)'
 });
-function GridVirtualScrollerFiller() {
+function GridVirtualScrollerFiller({
+  rowsLength
+}) {
   const apiRef = useGridApiContext();
   const {
     viewportOuterSize,
@@ -52,7 +54,8 @@ function GridVirtualScrollerFiller() {
     className: gridClasses.filler,
     role: "presentation",
     style: {
-      height
+      height,
+      '--rowBorderColor': rowsLength === 0 ? 'transparent' : 'var(--DataGrid-rowBorderColor)'
     },
     children: [leftPinnedWidth > 0 && /*#__PURE__*/_jsx(PinnedLeft, {
       className: gridClasses['filler--pinnedLeft'],

package/modern/hooks/features/filter/gridFilterSelector.js

@@ -89,6 +89,19 @@ export const gridExpandedRowCountSelector = createSelector(gridExpandedSortedRow
  */
 export const gridFilteredTopLevelRowCountSelector = createSelector(gridFilteredSortedTopLevelRowEntriesSelector, visibleSortedTopLevelRows => visibleSortedTopLevelRows.length);
 
+/**
+ * Get the amount of rows accessible after the filtering process.
+ * Includes top level and descendant rows.
+ * @category Filtering
+ */
+export const gridFilteredRowCountSelector = createSelector(gridFilteredSortedRowEntriesSelector, filteredSortedRowEntries => filteredSortedRowEntries.length);
+
+/**
+ * Get the amount of descendant rows accessible after the filtering process.
+ * @category Filtering
+ */
+export const gridFilteredDescendantRowCountSelector = createSelector(gridFilteredRowCountSelector, gridFilteredTopLevelRowCountSelector, (totalRowCount, topLevelRowCount) => totalRowCount - topLevelRowCount);
+
 /**
  * @category Filtering
  * @ignore - do not document.

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

@@ -361,20 +361,12 @@ export const useGridVirtualScroller = () => {
     overflowY: rootProps.autoHeight ? 'hidden' : undefined
   }), [needsHorizontalScrollbar, rootProps.autoHeight]);
   const contentSize = React.useMemo(() => {
-    // In cases where the columns exceed the available width,
-    // the horizontal scrollbar should be shown even when there're no rows.
-    // Keeping 1px as minimum height ensures that the scrollbar will visible if necessary.
-    const height = Math.max(contentHeight, 1);
     const size = {
       width: needsHorizontalScrollbar ? columnsTotalWidth : 'auto',
-      height
+      height: contentHeight
     };
-    if (rootProps.autoHeight) {
-      if (currentPage.rows.length === 0) {
-        size.height = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
-      } else {
-        size.height = contentHeight;
-      }
+    if (rootProps.autoHeight && currentPage.rows.length === 0) {
+      size.height = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
     }
     return size;
   }, [apiRef, columnsTotalWidth, contentHeight, needsHorizontalScrollbar, rootProps.autoHeight, currentPage.rows.length]);

package/modern/index.js

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

package/modern/locales/esES.js

@@ -33,8 +33,7 @@ const esESGrid = {
   columnsManagementSearchTitle: 'Buscar',
   columnsManagementNoColumns: 'Sin columnas',
   columnsManagementShowHideAllText: 'Mostrar/Ocultar todas',
-  // columnsManagementReset: 'Reset',
-
+  columnsManagementReset: 'Restablecer',
   // Filter panel text
   filterPanelAddFilter: 'Agregar filtro',
   filterPanelRemoveAll: 'Remover todos',

package/node/DataGrid/DataGrid.js

@@ -341,6 +341,7 @@ DataGridRaw.propTypes = {
   keepNonExistentRowsSelected: _propTypes.default.bool,
   /**
    * If `true`, a loading overlay is displayed.
+   * @default false
    */
   loading: _propTypes.default.bool,
   /**

package/node/DataGrid/useDataGridProps.js

@@ -32,54 +32,55 @@ const DATA_GRID_FORCED_PROPS = {
 const DATA_GRID_PROPS_DEFAULT_VALUES = exports.DATA_GRID_PROPS_DEFAULT_VALUES = {
   autoHeight: false,
   autoPageSize: false,
+  autosizeOnMount: false,
   checkboxSelection: false,
   checkboxSelectionVisibleOnly: false,
+  clipboardCopyCellDelimiter: '\t',
   columnBufferPx: 150,
-  rowBufferPx: 150,
-  rows: [],
-  rowSelection: true,
+  columnHeaderHeight: 56,
+  disableAutosize: false,
   disableColumnFilter: false,
   disableColumnMenu: false,
+  disableColumnReorder: false,
+  disableColumnResize: false,
   disableColumnSelector: false,
+  disableColumnSorting: false,
   disableDensitySelector: false,
   disableEval: false,
   disableMultipleColumnsFiltering: false,
-  disableMultipleRowSelection: false,
-  disableColumnSorting: false,
   disableMultipleColumnsSorting: false,
+  disableMultipleRowSelection: false,
   disableRowSelectionOnClick: false,
   disableVirtualization: false,
   editMode: _models.GridEditModes.Cell,
-  filterMode: 'client',
   filterDebounceMs: 150,
-  columnHeaderHeight: 56,
+  filterMode: 'client',
   hideFooter: false,
   hideFooterPagination: false,
   hideFooterRowCount: false,
   hideFooterSelectedRowCount: false,
   ignoreDiacritics: false,
+  ignoreValueFormatterDuringExport: false,
+  keepColumnPositionIfDraggedOutside: false,
+  keepNonExistentRowsSelected: false,
+  loading: false,
   logger: console,
   logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',
+  pageSizeOptions: [25, 50, 100],
   pagination: false,
   paginationMode: 'client',
-  rowHeight: 52,
   resizeThrottleMs: 60,
-  pageSizeOptions: [25, 50, 100],
+  rowBufferPx: 150,
+  rowHeight: 52,
+  rowPositionsDebounceMs: 166,
+  rows: [],
+  rowSelection: true,
   rowSpacingType: 'margin',
   showCellVerticalBorder: false,
   showColumnVerticalBorder: false,
-  sortingOrder: ['asc', 'desc', null],
   sortingMode: 'client',
-  throttleRowsMs: 0,
-  disableColumnReorder: false,
-  disableColumnResize: false,
-  keepNonExistentRowsSelected: false,
-  keepColumnPositionIfDraggedOutside: false,
-  ignoreValueFormatterDuringExport: false,
-  clipboardCopyCellDelimiter: '\t',
-  rowPositionsDebounceMs: 166,
-  autosizeOnMount: false,
-  disableAutosize: false
+  sortingOrder: ['asc', 'desc', null],
+  throttleRowsMs: 0
 };
 const defaultSlots = _defaultGridSlotsComponents.DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
 const useDataGridProps = inProps => {

package/node/components/base/GridOverlays.js

@@ -64,7 +64,7 @@ function GridOverlayWrapper(props) {
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const currentPage = (0, _useGridVisibleRows.useGridVisibleRows)(apiRef, rootProps);
   const dimensions = (0, _useGridSelector.useGridSelector)(apiRef, _dimensions.gridDimensionsSelector);
-  let height = dimensions.viewportOuterSize.height - dimensions.headersTotalHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
+  let height = dimensions.viewportOuterSize.height - dimensions.topContainerHeight - dimensions.bottomContainerHeight - (dimensions.hasScrollX ? dimensions.scrollbarSize : 0);
   if (rootProps.autoHeight && currentPage.rows.length === 0 || height === 0) {
     height = (0, _gridRowsUtils.getMinimalContentHeight)(apiRef);
   }

package/node/components/containers/GridRoot.js

@@ -11,7 +11,6 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _utils = require("@mui/utils");
-var _system = require("@mui/system");
 var _GridRootStyles = require("./GridRootStyles");
 var _useGridSelector = require("../../hooks/utils/useGridSelector");
 var _useGridPrivateApiContext = require("../../hooks/utils/useGridPrivateApiContext");
@@ -19,7 +18,7 @@ var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _gridClasses = require("../../constants/gridClasses");
 var _densitySelector = require("../../hooks/features/density/densitySelector");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["children", "className"];
+const _excluded = ["className"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -34,15 +33,9 @@ const useUtilityClasses = ownerState => {
   };
   return (0, _utils.unstable_composeClasses)(slots, _gridClasses.getDataGridUtilityClass, classes);
 };
-const GridPanelAnchor = (0, _system.styled)('div')({
-  position: 'absolute',
-  top: `var(--DataGrid-headersTotalHeight)`,
-  left: 0
-});
 const GridRoot = exports.GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const {
-      children,
       className
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
@@ -63,16 +56,11 @@ const GridRoot = exports.GridRoot = /*#__PURE__*/React.forwardRef(function GridR
   if (!mountedState) {
     return null;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_GridRootStyles.GridRootStyles, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridRootStyles.GridRootStyles, (0, _extends2.default)({
     ref: handleRef,
     className: (0, _clsx.default)(className, classes.root),
     ownerState: ownerState
-  }, other, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(GridPanelAnchor, {
-      role: "presentation",
-      "data-id": "gridPanelAnchor"
-    }), children]
-  }));
+  }, other));
 });
 process.env.NODE_ENV !== "production" ? GridRoot.propTypes = {
   // ----------------------------- Warning --------------------------------

package/node/components/panel/filterPanel/GridFilterInputMultipleValue.js

@@ -27,7 +27,7 @@ function GridFilterInputMultipleValue(props) {
       error,
       helperText,
       size,
-      variant
+      variant = 'standard'
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const TextFieldProps = {

package/node/components/virtualization/GridMainContainer.js

@@ -13,6 +13,11 @@ var _useGridAriaAttributes = require("../../hooks/utils/useGridAriaAttributes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const GridPanelAnchor = (0, _system.styled)('div')({
+  position: 'absolute',
+  top: `var(--DataGrid-headersTotalHeight)`,
+  left: 0
+});
 const Element = (0, _system.styled)('div', {
   name: 'MuiDataGrid',
   slot: 'Main',
@@ -25,12 +30,15 @@ const Element = (0, _system.styled)('div', {
 const GridMainContainer = exports.GridMainContainer = /*#__PURE__*/React.forwardRef((props, ref) => {
   const ariaAttributes = (0, _useGridAriaAttributes.useGridAriaAttributes)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Element, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Element, (0, _extends2.default)({
     ref: ref,
     ownerState: rootProps,
     className: props.className,
     tabIndex: -1
   }, ariaAttributes, {
-    children: props.children
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(GridPanelAnchor, {
+      role: "presentation",
+      "data-id": "gridPanelAnchor"
+    }), props.children]
   }));
 });

package/node/components/virtualization/GridVirtualScroller.js

@@ -96,7 +96,9 @@ function GridVirtualScroller(props) {
             virtualScroller: virtualScroller
           })]
         }))
-      })), rows.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridVirtualScrollerFiller.GridVirtualScrollerFiller, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridBottomContainer.GridBottomContainer, {
+      })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridVirtualScrollerFiller.GridVirtualScrollerFiller, {
+        rowsLength: rows.length
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridBottomContainer.GridBottomContainer, {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.pinnedRows, {
           position: "bottom",
           virtualScroller: virtualScroller

package/node/components/virtualization/GridVirtualScrollerFiller.js

@@ -24,22 +24,24 @@ const Pinned = (0, _system.styled)('div')({
   position: 'sticky',
   height: '100%',
   boxSizing: 'border-box',
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)',
+  borderTop: '1px solid var(--rowBorderColor)',
   backgroundColor: 'var(--DataGrid-pinnedBackground)'
 });
 const PinnedLeft = (0, _system.styled)(Pinned)({
   left: 0,
-  borderRight: '1px solid var(--DataGrid-rowBorderColor)'
+  borderRight: '1px solid var(--rowBorderColor)'
 });
 const PinnedRight = (0, _system.styled)(Pinned)({
   right: 0,
-  borderLeft: '1px solid var(--DataGrid-rowBorderColor)'
+  borderLeft: '1px solid var(--rowBorderColor)'
 });
 const Main = (0, _system.styled)('div')({
   flexGrow: 1,
-  borderTop: '1px solid var(--DataGrid-rowBorderColor)'
+  borderTop: '1px solid var(--rowBorderColor)'
 });
-function GridVirtualScrollerFiller() {
+function GridVirtualScrollerFiller({
+  rowsLength
+}) {
   const apiRef = (0, _useGridApiContext.useGridApiContext)();
   const {
     viewportOuterSize,
@@ -60,7 +62,8 @@ function GridVirtualScrollerFiller() {
     className: _constants.gridClasses.filler,
     role: "presentation",
     style: {
-      height
+      height,
+      '--rowBorderColor': rowsLength === 0 ? 'transparent' : 'var(--DataGrid-rowBorderColor)'
     },
     children: [leftPinnedWidth > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(PinnedLeft, {
       className: _constants.gridClasses['filler--pinnedLeft'],

package/node/hooks/features/filter/gridFilterSelector.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.gridVisibleRowsLookupSelector = exports.gridQuickFilterValuesSelector = exports.gridFilteredTopLevelRowCountSelector = exports.gridFilteredSortedTopLevelRowEntriesSelector = exports.gridFilteredSortedRowIdsSelector = exports.gridFilteredSortedRowEntriesSelector = exports.gridFilteredRowsLookupSelector = exports.gridFilteredDescendantCountLookupSelector = exports.gridFilterModelSelector = exports.gridFilterActiveItemsSelector = exports.gridFilterActiveItemsLookupSelector = exports.gridExpandedSortedRowIdsSelector = exports.gridExpandedSortedRowEntriesSelector = exports.gridExpandedRowCountSelector = void 0;
+exports.gridVisibleRowsLookupSelector = exports.gridQuickFilterValuesSelector = exports.gridFilteredTopLevelRowCountSelector = exports.gridFilteredSortedTopLevelRowEntriesSelector = exports.gridFilteredSortedRowIdsSelector = exports.gridFilteredSortedRowEntriesSelector = exports.gridFilteredRowsLookupSelector = exports.gridFilteredRowCountSelector = exports.gridFilteredDescendantRowCountSelector = exports.gridFilteredDescendantCountLookupSelector = exports.gridFilterModelSelector = exports.gridFilterActiveItemsSelector = exports.gridFilterActiveItemsLookupSelector = exports.gridExpandedSortedRowIdsSelector = exports.gridExpandedSortedRowEntriesSelector = exports.gridExpandedRowCountSelector = void 0;
 var _createSelector = require("../../../utils/createSelector");
 var _gridSortingSelector = require("../sorting/gridSortingSelector");
 var _gridColumnsSelector = require("../columns/gridColumnsSelector");
@@ -95,6 +95,19 @@ const gridExpandedRowCountSelector = exports.gridExpandedRowCountSelector = (0,
  */
 const gridFilteredTopLevelRowCountSelector = exports.gridFilteredTopLevelRowCountSelector = (0, _createSelector.createSelector)(gridFilteredSortedTopLevelRowEntriesSelector, visibleSortedTopLevelRows => visibleSortedTopLevelRows.length);
 
+/**
+ * Get the amount of rows accessible after the filtering process.
+ * Includes top level and descendant rows.
+ * @category Filtering
+ */
+const gridFilteredRowCountSelector = exports.gridFilteredRowCountSelector = (0, _createSelector.createSelector)(gridFilteredSortedRowEntriesSelector, filteredSortedRowEntries => filteredSortedRowEntries.length);
+
+/**
+ * Get the amount of descendant rows accessible after the filtering process.
+ * @category Filtering
+ */
+const gridFilteredDescendantRowCountSelector = exports.gridFilteredDescendantRowCountSelector = (0, _createSelector.createSelector)(gridFilteredRowCountSelector, gridFilteredTopLevelRowCountSelector, (totalRowCount, topLevelRowCount) => totalRowCount - topLevelRowCount);
+
 /**
  * @category Filtering
  * @ignore - do not document.

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

@@ -373,20 +373,12 @@ const useGridVirtualScroller = () => {
     overflowY: rootProps.autoHeight ? 'hidden' : undefined
   }), [needsHorizontalScrollbar, rootProps.autoHeight]);
   const contentSize = React.useMemo(() => {
-    // In cases where the columns exceed the available width,
-    // the horizontal scrollbar should be shown even when there're no rows.
-    // Keeping 1px as minimum height ensures that the scrollbar will visible if necessary.
-    const height = Math.max(contentHeight, 1);
     const size = {
       width: needsHorizontalScrollbar ? columnsTotalWidth : 'auto',
-      height
+      height: contentHeight
     };
-    if (rootProps.autoHeight) {
-      if (currentPage.rows.length === 0) {
-        size.height = (0, _gridRowsUtils.getMinimalContentHeight)(apiRef); // Give room to show the overlay when there no rows.
-      } else {
-        size.height = contentHeight;
-      }
+    if (rootProps.autoHeight && currentPage.rows.length === 0) {
+      size.height = (0, _gridRowsUtils.getMinimalContentHeight)(apiRef); // Give room to show the overlay when there no rows.
     }
     return size;
   }, [apiRef, columnsTotalWidth, contentHeight, needsHorizontalScrollbar, rootProps.autoHeight, currentPage.rows.length]);

package/node/index.js

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

package/node/locales/esES.js

@@ -39,8 +39,7 @@ const esESGrid = {
   columnsManagementSearchTitle: 'Buscar',
   columnsManagementNoColumns: 'Sin columnas',
   columnsManagementShowHideAllText: 'Mostrar/Ocultar todas',
-  // columnsManagementReset: 'Reset',
-
+  columnsManagementReset: 'Restablecer',
   // Filter panel text
   filterPanelAddFilter: 'Agregar filtro',
   filterPanelRemoveAll: 'Remover todos',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "7.9.0",
+  "version": "7.10.0",
   "description": "The Community plan edition of the Data Grid components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -43,7 +43,7 @@
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "reselect": "^4.1.8",
-    "@mui/x-internals": "7.9.0"
+    "@mui/x-internals": "7.10.0"
   },
   "peerDependencies": {
     "@mui/material": "^5.15.14",