@mui/x-data-grid-premium 8.0.0-alpha.11 → 8.0.0-alpha.12

package/components/GridPremiumColumnMenu.d.ts

@@ -1,33 +1,33 @@
 import * as React from 'react';
 import { GridColumnMenuProps, GridColumnMenuItemProps } from '@mui/x-data-grid-pro';
-import { GridColumnMenuAggregationItem } from './GridColumnMenuAggregationItem';
+import { GridColumnMenuAggregationItem } from "./GridColumnMenuAggregationItem.js";
 export declare function GridColumnMenuGroupingItem(props: GridColumnMenuItemProps): React.JSX.Element;
 export declare const GRID_COLUMN_MENU_SLOTS_PREMIUM: {
-    columnMenuAggregationItem: typeof GridColumnMenuAggregationItem;
-    columnMenuGroupingItem: typeof GridColumnMenuGroupingItem;
-    columnMenuPinningItem: typeof import("@mui/x-data-grid-pro").GridColumnMenuPinningItem;
-    columnMenuSortItem: typeof import("@mui/x-data-grid").GridColumnMenuSortItem;
-    columnMenuFilterItem: typeof import("@mui/x-data-grid").GridColumnMenuFilterItem;
-    columnMenuColumnsItem: typeof import("@mui/x-data-grid").GridColumnMenuColumnsItem;
+  columnMenuAggregationItem: typeof GridColumnMenuAggregationItem;
+  columnMenuGroupingItem: typeof GridColumnMenuGroupingItem;
+  columnMenuPinningItem: typeof import("@mui/x-data-grid-pro").GridColumnMenuPinningItem;
+  columnMenuSortItem: typeof import("@mui/x-data-grid").GridColumnMenuSortItem;
+  columnMenuFilterItem: typeof import("@mui/x-data-grid").GridColumnMenuFilterItem;
+  columnMenuColumnsItem: typeof import("@mui/x-data-grid").GridColumnMenuColumnsItem;
 };
 export declare const GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM: {
-    columnMenuAggregationItem: {
-        displayOrder: number;
-    };
-    columnMenuGroupingItem: {
-        displayOrder: number;
-    };
-    columnMenuPinningItem: {
-        displayOrder: number;
-    };
-    columnMenuSortItem: {
-        displayOrder: number;
-    };
-    columnMenuFilterItem: {
-        displayOrder: number;
-    };
-    columnMenuColumnsItem: {
-        displayOrder: number;
-    };
+  columnMenuAggregationItem: {
+    displayOrder: number;
+  };
+  columnMenuGroupingItem: {
+    displayOrder: number;
+  };
+  columnMenuPinningItem: {
+    displayOrder: number;
+  };
+  columnMenuSortItem: {
+    displayOrder: number;
+  };
+  columnMenuFilterItem: {
+    displayOrder: number;
+  };
+  columnMenuColumnsItem: {
+    displayOrder: number;
+  };
 };
-export declare const GridPremiumColumnMenu: React.ForwardRefExoticComponent<GridColumnMenuProps> | React.ForwardRefExoticComponent<GridColumnMenuProps & React.RefAttributes<HTMLUListElement>>;
+export declare const GridPremiumColumnMenu: React.ForwardRefExoticComponent<GridColumnMenuProps> | React.ForwardRefExoticComponent<GridColumnMenuProps & React.RefAttributes<HTMLUListElement>>;

package/components/index.d.ts

@@ -1,5 +1,5 @@
-export * from './GridExcelExportMenuItem';
-export * from '../material/icons';
-export * from './GridColumnMenuAggregationItem';
-export * from './promptControl';
-export { GridColumnMenuGroupingItem } from './GridPremiumColumnMenu';
+export * from "./GridExcelExportMenuItem.js";
+export * from "../material/icons.js";
+export * from "./GridColumnMenuAggregationItem.js";
+export * from "./promptControl/index.js";
+export { GridColumnMenuGroupingItem } from "./GridPremiumColumnMenu.js";

package/components/promptControl/GridToolbarPromptControl.d.ts

@@ -1,26 +1,26 @@
 import * as React from 'react';
-import { PromptResponse } from '../../hooks/features/promptControl/types';
+import { PromptResponse } from "../../hooks/features/promptControl/types.js";
 type GridToolbarPromptControlProps = {
-    /**
-     * Called when the new prompt is ready to be processed.
-     * Provides the prompt and the data context and expects the grid state updates to be returned.
-     * @param {string} context The context of the prompt
-     * @param {string} query The query to process
-     * @returns {Promise<PromptResponse>} The grid state updates
-     */
-    onPrompt: (context: string, query: string) => Promise<PromptResponse>;
-    /**
-     * Allow taking couple of random cell values from each column to improve the prompt context.
-     * If allowed, samples are taken from different rows.
-     * If not allowed, the column examples are used.
-     * @default false
-     */
-    allowDataSampling?: boolean;
-    /**
-     * The BCP 47 language tag to use for the speech recognition.
-     * @default HTML lang attribute value or the user agent's language setting
-     */
-    lang?: string;
+  /**
+   * Called when the new prompt is ready to be processed.
+   * Provides the prompt and the data context and expects the grid state updates to be returned.
+   * @param {string} context The context of the prompt
+   * @param {string} query The query to process
+   * @returns {Promise<PromptResponse>} The grid state updates
+   */
+  onPrompt: (context: string, query: string) => Promise<PromptResponse>;
+  /**
+   * Allow taking couple of random cell values from each column to improve the prompt context.
+   * If allowed, samples are taken from different rows.
+   * If not allowed, the column examples are used.
+   * @default false
+   */
+  allowDataSampling?: boolean;
+  /**
+   * The BCP 47 language tag to use for the speech recognition.
+   * @default HTML lang attribute value or the user agent's language setting
+   */
+  lang?: string;
 };
 declare function GridToolbarPromptControl(props: GridToolbarPromptControlProps): React.JSX.Element;
-export { GridToolbarPromptControl };
+export { GridToolbarPromptControl };

package/components/promptControl/RecordButton.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
 export declare const BrowserSpeechRecognition: any;
 type SpeechRecognitionOptions = {
-    onUpdate: (value: string) => void;
-    onDone: (value: string) => void;
-    onError: (error: string) => void;
+  onUpdate: (value: string) => void;
+  onDone: (value: string) => void;
+  onError: (error: string) => void;
 };
 interface RecordButtonProps extends SpeechRecognitionOptions {
-    disabled: boolean;
-    lang?: string;
-    recording: boolean;
-    setRecording: (value: boolean) => void;
-    className: string;
+  disabled: boolean;
+  lang?: string;
+  recording: boolean;
+  setRecording: (value: boolean) => void;
+  className: string;
 }
 declare function RecordButton(props: RecordButtonProps): React.JSX.Element;
-export { RecordButton };
+export { RecordButton };

package/components/promptControl/index.d.ts

@@ -1 +1 @@
-export { GridToolbarPromptControl as Unstable_GridToolbarPromptControl } from './GridToolbarPromptControl';
+export { GridToolbarPromptControl as Unstable_GridToolbarPromptControl } from "./GridToolbarPromptControl.js";

package/components/reexports.d.ts

@@ -1 +1 @@
-export { GridPremiumColumnMenu as GridColumnMenu, GRID_COLUMN_MENU_SLOTS_PREMIUM as GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM as GRID_COLUMN_MENU_SLOT_PROPS, } from './GridPremiumColumnMenu';
+export { GridPremiumColumnMenu as GridColumnMenu, GRID_COLUMN_MENU_SLOTS_PREMIUM as GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM as GRID_COLUMN_MENU_SLOT_PROPS } from "./GridPremiumColumnMenu.js";

package/constants/dataGridPremiumDefaultSlotsComponents.d.ts

@@ -1,2 +1,2 @@
 import type { GridPremiumSlotsComponent } from '../models';
-export declare const DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS: GridPremiumSlotsComponent;
+export declare const DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS: GridPremiumSlotsComponent;

package/constants/dataGridPremiumDefaultSlotsComponents.js

@@ -9,6 +9,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _internals = require("@mui/x-data-grid-pro/internals");
 var _GridPremiumColumnMenu = require("../components/GridPremiumColumnMenu");
 var _material = _interopRequireDefault(require("../material"));
+var _GridBottomContainer = require("../components/GridBottomContainer");
 const DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS = exports.DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS = (0, _extends2.default)({}, _internals.DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS, _material.default, {
-  columnMenu: _GridPremiumColumnMenu.GridPremiumColumnMenu
+  columnMenu: _GridPremiumColumnMenu.GridPremiumColumnMenu,
+  bottomContainer: _GridBottomContainer.GridBottomContainer
 });

package/esm/DataGridPremium/DataGrid.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @deprecated Import DataGridPremium instead.
+ */
+export declare function DataGrid(): null;
+/**
+ * @deprecated Import DataGridPremium instead.
+ */
+export declare function DataGridPro(): null;

package/esm/DataGridPremium/DataGridPremium.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { GridValidRowModel } from '@mui/x-data-grid-pro';
+import { DataGridPremiumProps } from "../models/dataGridPremiumProps.js";
+export type { GridPremiumSlotsComponent as GridSlots } from '../models';
+interface DataGridPremiumComponent {
+  <R extends GridValidRowModel = any>(props: DataGridPremiumProps<R> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
+  propTypes?: any;
+}
+/**
+ * Features:
+ * - [DataGridPremium](https://mui.com/x/react-data-grid/features/)
+ *
+ * API:
+ * - [DataGridPremium API](https://mui.com/x/api/data-grid/data-grid-premium/)
+ */
+export declare const DataGridPremium: DataGridPremiumComponent;

package/esm/DataGridPremium/DataGridPremium.js

@@ -381,6 +381,8 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   getRowHeight: PropTypes.func,
   /**
    * Return the id of a given [[GridRowModel]].
+   * Ensure the reference of this prop is stable to avoid performance implications.
+   * It could be done by either defining the prop outside of the component or by memoizing it.
    */
   getRowId: PropTypes.func,
   /**
@@ -1035,6 +1037,9 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default false
    */
   treeData: PropTypes.bool,
+  /**
+   * Data source object.
+   */
   unstable_dataSource: PropTypes.shape({
     getAggregatedValue: PropTypes.func,
     getChildrenCount: PropTypes.func,
@@ -1042,6 +1047,9 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
     getRows: PropTypes.func.isRequired,
     updateRow: PropTypes.func
   }),
+  /**
+   * Data source cache object.
+   */
   unstable_dataSourceCache: PropTypes.shape({
     clear: PropTypes.func.isRequired,
     get: PropTypes.func.isRequired,
@@ -1074,6 +1082,11 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * Use in combination with `unstable_listColumn`.
    */
   unstable_listView: PropTypes.bool,
+  /**
+   * Callback fired when the data source request fails.
+   * @param {Error} error The error object.
+   * @param {GridGetRowsParams} params With all properties from [[GridGetRowsParams]].
+   */
   unstable_onDataSourceError: PropTypes.func,
   /**
    * If `true`, the Data Grid enables column virtualization when `getRowHeight` is set to `() => 'auto'`.
@@ -1085,8 +1098,8 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   virtualizeColumnsWithAutoRowHeight: PropTypes.bool
 } : void 0;
 /**
- * Demos:
- * - [DataGridPremium](https://mui.com/x/react-data-grid/demo/)
+ * Features:
+ * - [DataGridPremium](https://mui.com/x/react-data-grid/features/)
  *
  * API:
  * - [DataGridPremium API](https://mui.com/x/api/data-grid/data-grid-premium/)

package/esm/DataGridPremium/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./DataGrid.js";
+export * from "./DataGridPremium.js";
+export { DATA_GRID_PREMIUM_PROPS_DEFAULT_VALUES } from "./useDataGridPremiumProps.js";

package/esm/DataGridPremium/useDataGridPremiumComponent.d.ts

@@ -0,0 +1,4 @@
+import { RefObject } from '@mui/x-internals/types';
+import { GridApiPremium, GridPrivateApiPremium } from "../models/gridApiPremium.js";
+import { DataGridPremiumProcessedProps } from "../models/dataGridPremiumProps.js";
+export declare const useDataGridPremiumComponent: (inputApiRef: RefObject<GridApiPremium | null> | undefined, props: DataGridPremiumProcessedProps) => import("react").RefObject<GridPrivateApiPremium>;

package/esm/DataGridPremium/useDataGridPremiumComponent.js

@@ -1,4 +1,4 @@
-import { useGridInitialization, useGridInitializeState, useGridClipboard, useGridColumnMenu, useGridColumns, columnsStateInitializer, useGridDensity, useGridCsvExport, useGridPrintExport, useGridFilter, filterStateInitializer, useGridFocus, useGridKeyboardNavigation, useGridPagination, paginationStateInitializer, useGridPreferencesPanel, useGridEditing, editingStateInitializer, useGridRows, useGridRowsPreProcessors, rowsStateInitializer, useGridRowsMeta, useGridParamsApi, useGridRowSelection, useGridSorting, sortingStateInitializer, useGridScroll, useGridEvents, dimensionsStateInitializer, useGridDimensions, useGridStatePersistence, useGridRowSelectionPreProcessors, columnMenuStateInitializer, densityStateInitializer, focusStateInitializer, preferencePanelStateInitializer, rowsMetaStateInitializer, rowSelectionStateInitializer, useGridColumnReorder, columnReorderStateInitializer, useGridColumnResize, columnResizeStateInitializer, useGridTreeData, useGridTreeDataPreProcessors, useGridColumnPinning, columnPinningStateInitializer, useGridColumnPinningPreProcessors, useGridDetailPanel, detailPanelStateInitializer, useGridDetailPanelPreProcessors, useGridInfiniteLoader, useGridColumnSpanning, useGridRowReorder, useGridRowReorderPreProcessors, useGridRowPinning, useGridRowPinningPreProcessors, rowPinningStateInitializer, useGridColumnGrouping, columnGroupsStateInitializer, useGridLazyLoader, useGridLazyLoaderPreProcessors, useGridDataSourceLazyLoader, headerFilteringStateInitializer, useGridHeaderFiltering, virtualizationStateInitializer, useGridVirtualization, useGridDataSourceTreeDataPreProcessors, dataSourceStateInitializer, useGridRowSpanning, rowSpanningStateInitializer, useGridListView, listViewStateInitializer } from '@mui/x-data-grid-pro/internals';
+import { useGridInitialization, useGridInitializeState, useGridClipboard, useGridColumnMenu, useGridColumns, columnsStateInitializer, useGridDensity, useGridCsvExport, useGridPrintExport, useGridFilter, filterStateInitializer, useGridFocus, useGridKeyboardNavigation, useGridPagination, paginationStateInitializer, useGridPreferencesPanel, useGridEditing, editingStateInitializer, useGridRows, useGridRowsPreProcessors, rowsStateInitializer, useGridRowsMeta, useGridParamsApi, useGridRowSelection, useGridSorting, sortingStateInitializer, useGridScroll, useGridEvents, dimensionsStateInitializer, useGridDimensions, useGridStatePersistence, useGridRowSelectionPreProcessors, columnMenuStateInitializer, densityStateInitializer, focusStateInitializer, preferencePanelStateInitializer, rowsMetaStateInitializer, rowSelectionStateInitializer, useGridColumnReorder, columnReorderStateInitializer, useGridColumnResize, columnResizeStateInitializer, useGridTreeData, useGridTreeDataPreProcessors, useGridColumnPinning, columnPinningStateInitializer, useGridColumnPinningPreProcessors, useGridDetailPanel, detailPanelStateInitializer, useGridDetailPanelPreProcessors, useGridInfiniteLoader, useGridColumnSpanning, useGridRowReorder, useGridRowReorderPreProcessors, useGridRowPinning, useGridRowPinningPreProcessors, rowPinningStateInitializer, useGridColumnGrouping, columnGroupsStateInitializer, useGridLazyLoader, useGridLazyLoaderPreProcessors, useGridDataSourceLazyLoader, headerFilteringStateInitializer, useGridHeaderFiltering, virtualizationStateInitializer, useGridVirtualization, useGridDataSourceTreeDataPreProcessors, dataSourceStateInitializer, useGridRowSpanning, rowSpanningStateInitializer, useGridListView, listViewStateInitializer, propsStateInitializer } from '@mui/x-data-grid-pro/internals';
 import { useGridDataSourcePremium as useGridDataSource } from "../hooks/features/dataSource/useGridDataSourcePremium.js";
 // Premium-only features
 import { useGridAggregation, aggregationStateInitializer } from "../hooks/features/aggregation/useGridAggregation.js";
@@ -33,6 +33,7 @@ export const useDataGridPremiumComponent = (inputApiRef, props) => {
   /**
    * Register all state initializers here.
    */
+  useGridInitializeState(propsStateInitializer, apiRef, props);
   useGridInitializeState(headerFilteringStateInitializer, apiRef, props);
   useGridInitializeState(rowGroupingStateInitializer, apiRef, props);
   useGridInitializeState(aggregationStateInitializer, apiRef, props);
@@ -42,8 +43,8 @@ export const useDataGridPremiumComponent = (inputApiRef, props) => {
   useGridInitializeState(columnPinningStateInitializer, apiRef, props);
   useGridInitializeState(columnsStateInitializer, apiRef, props);
   useGridInitializeState(rowPinningStateInitializer, apiRef, props);
-  useGridInitializeState(paginationStateInitializer, apiRef, props);
   useGridInitializeState(rowsStateInitializer, apiRef, props);
+  useGridInitializeState(paginationStateInitializer, apiRef, props);
   useGridInitializeState(editingStateInitializer, apiRef, props);
   useGridInitializeState(focusStateInitializer, apiRef, props);
   useGridInitializeState(sortingStateInitializer, apiRef, props);
@@ -64,7 +65,6 @@ export const useDataGridPremiumComponent = (inputApiRef, props) => {
   useGridHeaderFiltering(apiRef, props);
   useGridTreeData(apiRef, props);
   useGridAggregation(apiRef, props);
-  useGridDataSource(apiRef, props);
   useGridKeyboardNavigation(apiRef, props);
   useGridRowSelection(apiRef, props);
   useGridCellSelection(apiRef, props);
@@ -101,6 +101,7 @@ export const useDataGridPremiumComponent = (inputApiRef, props) => {
   useGridDimensions(apiRef, props);
   useGridEvents(apiRef, props);
   useGridStatePersistence(apiRef);
+  useGridDataSource(apiRef, props);
   useGridVirtualization(apiRef, props);
   useGridListView(apiRef, props);
   return apiRef;

package/esm/DataGridPremium/useDataGridPremiumProps.d.ts

@@ -0,0 +1,6 @@
+import { DataGridPremiumProps, DataGridPremiumProcessedProps, DataGridPremiumPropsWithDefaultValue } from "../models/dataGridPremiumProps.js";
+/**
+ * The default values of `DataGridPremiumPropsWithDefaultValue` to inject in the props of DataGridPremium.
+ */
+export declare const DATA_GRID_PREMIUM_PROPS_DEFAULT_VALUES: DataGridPremiumPropsWithDefaultValue;
+export declare const useDataGridPremiumProps: (inProps: DataGridPremiumProps) => DataGridPremiumProcessedProps;

package/esm/components/GridAggregationHeader.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { GridColumnHeaderParams } from '@mui/x-data-grid';
+import type { GridBaseColDef } from '@mui/x-data-grid/internals';
+declare function GridAggregationHeader(props: GridColumnHeaderParams & {
+  renderHeader: GridBaseColDef['renderHeader'];
+}): React.JSX.Element | null;
+export { GridAggregationHeader };

package/esm/components/GridAggregationRowOverlay.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const GridAggregationRowOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement>> | React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { GridAggregationRowOverlay };

package/esm/components/GridAggregationRowOverlay.js

@@ -0,0 +1,37 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { forwardRef } from '@mui/x-internals/forwardRef';
+import composeClasses from '@mui/utils/composeClasses';
+import { getDataGridUtilityClass, useGridRootProps } from '@mui/x-data-grid-pro';
+import { GridSkeletonLoadingOverlayInner, useGridSelector } from '@mui/x-data-grid-pro/internals';
+import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
+import { gridAggregationModelSelector } from "../hooks/features/aggregation/gridAggregationSelectors.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['aggregationRowOverlayWrapper']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const GridAggregationRowOverlay = forwardRef(function GridAggregationRowOverlay(props, forwardedRef) {
+  const apiRef = useGridApiContext();
+  const rootProps = useGridRootProps();
+  const classes = useUtilityClasses({
+    classes: rootProps.classes
+  });
+  const aggregationModel = useGridSelector(apiRef, gridAggregationModelSelector);
+  const visibleColumns = new Set(Object.keys(aggregationModel));
+  return /*#__PURE__*/_jsx("div", {
+    className: classes.root,
+    children: /*#__PURE__*/_jsx(GridSkeletonLoadingOverlayInner, _extends({}, props, {
+      skeletonRowsCount: 1,
+      visibleColumns: visibleColumns,
+      showFirstRowBorder: true,
+      ref: forwardedRef
+    }))
+  });
+});
+export { GridAggregationRowOverlay };

package/esm/components/GridBottomContainer.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export type GridBottomContainerProps = React.PropsWithChildren;
+export declare function GridBottomContainer(props: GridBottomContainerProps): React.JSX.Element;

package/esm/components/GridBottomContainer.js

@@ -0,0 +1,43 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["children"];
+import * as React from 'react';
+import clsx from 'clsx';
+import { styled } from '@mui/system';
+import composeClasses from '@mui/utils/composeClasses';
+import { gridClasses, getDataGridUtilityClass, useGridSelector, gridRowsLoadingSelector, gridRowTreeSelector, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';
+import { useGridPrivateApiContext } from "../hooks/utils/useGridPrivateApiContext.js";
+import { GridAggregationRowOverlay } from "./GridAggregationRowOverlay.js";
+import { useGridRootProps } from "../typeOverloads/reexports.js";
+import { gridAggregationModelSelector } from "../hooks/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = () => {
+  const slots = {
+    root: ['bottomContainer']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, {});
+};
+const Element = styled('div')({
+  position: 'sticky',
+  zIndex: 4,
+  bottom: 'calc(var(--DataGrid-hasScrollX) * var(--DataGrid-scrollbarSize))'
+});
+export function GridBottomContainer(props) {
+  const classes = useUtilityClasses();
+  const rootProps = useGridRootProps();
+  const apiRef = useGridPrivateApiContext();
+  const isLoading = useGridSelector(apiRef, gridRowsLoadingSelector);
+  const tree = useGridSelector(apiRef, gridRowTreeSelector);
+  const aggregationModel = useGridSelector(apiRef, gridAggregationModelSelector);
+  const aggregationPosition = rootProps.getAggregationPosition(tree[GRID_ROOT_GROUP_ID]);
+  const hasAggregation = React.useMemo(() => Object.keys(aggregationModel).length > 0, [aggregationModel]);
+  const {
+      children
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  return /*#__PURE__*/_jsx(Element, _extends({}, other, {
+    className: clsx(classes.root, gridClasses['container--bottom']),
+    role: "presentation",
+    children: hasAggregation && isLoading && aggregationPosition === 'footer' ? /*#__PURE__*/_jsx(GridAggregationRowOverlay, {}) : children
+  }));
+}

package/esm/components/GridColumnMenuAggregationItem.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { GridColumnMenuItemProps } from '@mui/x-data-grid-pro';
+declare function GridColumnMenuAggregationItem(props: GridColumnMenuItemProps): React.JSX.Element;
+declare namespace GridColumnMenuAggregationItem {
+  var propTypes: any;
+}
+export { GridColumnMenuAggregationItem };

package/esm/components/GridColumnMenuAggregationItem.js

@@ -5,8 +5,6 @@ const _excluded = ["native"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useGridSelector } from '@mui/x-data-grid-pro';
-import FormControl from '@mui/material/FormControl';
-import InputLabel from '@mui/material/InputLabel';
 import { unstable_useId as useId } from '@mui/utils';
 import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
 import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
@@ -77,50 +75,42 @@ function GridColumnMenuAggregationItem(props) {
       fontSize: "small"
     }),
     onKeyDown: handleMenuItemKeyDown,
-    children: /*#__PURE__*/_jsxs(FormControl, {
-      size: "small",
+    children: /*#__PURE__*/_jsxs(rootProps.slots.baseSelect, _extends({
+      labelId: `${id}-label`,
+      id: `${id}-input`,
+      value: selectedAggregationRule,
+      label: label,
+      onChange: handleAggregationItemChange,
+      onKeyDown: handleSelectKeyDown,
+      onBlur: event => event.stopPropagation(),
+      native: isBaseSelectNative,
       fullWidth: true,
-      sx: {
+      size: "small",
+      style: {
         minWidth: 150
       },
-      children: [/*#__PURE__*/_jsx(InputLabel, {
-        id: `${id}-label`,
-        htmlFor: `${id}-input`,
-        children: label
-      }), /*#__PURE__*/_jsxs(rootProps.slots.baseSelect, _extends({
-        labelId: `${id}-label`,
-        inputRef: inputRef,
-        id: `${id}-input`,
-        value: selectedAggregationRule,
-        label: label,
-        color: "primary",
-        onChange: handleAggregationItemChange,
-        MenuProps: {
-          PaperProps: {
-            onKeyDown: handleSelectKeyDown
-          }
-        },
-        onBlur: event => event.stopPropagation(),
+      slotProps: {
+        htmlInput: {
+          ref: inputRef
+        }
+      }
+    }, baseSelectProps, {
+      children: [/*#__PURE__*/_jsx(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {
         native: isBaseSelectNative,
-        fullWidth: true
-      }, baseSelectProps, {
-        children: [/*#__PURE__*/_jsx(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {
-          native: isBaseSelectNative,
-          value: "",
-          children: "..."
-        })), availableAggregationFunctions.map(aggFunc => /*#__PURE__*/_createElement(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {
-          key: aggFunc,
-          value: aggFunc,
-          native: isBaseSelectNative
-        }), getAggregationFunctionLabel({
-          apiRef,
-          aggregationRule: {
-            aggregationFunctionName: aggFunc,
-            aggregationFunction: rootProps.aggregationFunctions[aggFunc]
-          }
-        })))]
-      }))]
-    })
+        value: "",
+        children: "..."
+      })), availableAggregationFunctions.map(aggFunc => /*#__PURE__*/_createElement(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {
+        key: aggFunc,
+        value: aggFunc,
+        native: isBaseSelectNative
+      }), getAggregationFunctionLabel({
+        apiRef,
+        aggregationRule: {
+          aggregationFunctionName: aggFunc,
+          aggregationFunction: rootProps.aggregationFunctions[aggFunc]
+        }
+      })))]
+    }))
   });
 }
 process.env.NODE_ENV !== "production" ? GridColumnMenuAggregationItem.propTypes = {

package/esm/components/GridColumnMenuRowGroupItem.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridColumnMenuItemProps } from '@mui/x-data-grid-pro';
+export declare function GridColumnMenuRowGroupItem(props: GridColumnMenuItemProps): React.JSX.Element | null;

package/esm/components/GridColumnMenuRowUngroupItem.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridColumnMenuItemProps } from '@mui/x-data-grid-pro';
+export declare function GridColumnMenuRowUngroupItem(props: GridColumnMenuItemProps): React.JSX.Element | null;

package/esm/components/GridDataSourceGroupingCriteriaCell.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { GridRenderCellParams, GridGroupNode } from '@mui/x-data-grid-pro';
+interface GridGroupingCriteriaCellProps extends GridRenderCellParams<any, any, any, GridGroupNode> {
+  hideDescendantCount?: boolean;
+}
+export declare function GridDataSourceGroupingCriteriaCell(props: GridGroupingCriteriaCellProps): React.JSX.Element;
+export {};

package/esm/components/GridDataSourceGroupingCriteriaCell.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
 import Box from '@mui/material/Box';
-import { useGridPrivateApiContext } from '@mui/x-data-grid-pro/internals';
+import { useGridPrivateApiContext, gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector, gridRowSelector } from '@mui/x-data-grid-pro/internals';
 import { useGridSelector, getDataGridUtilityClass } from '@mui/x-data-grid-pro';
 import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
 import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
@@ -28,10 +28,8 @@ function GridGroupingCriteriaCellIcon(props) {
     field,
     descendantCount
   } = props;
-  const loadingSelector = state => state.dataSource.loading[id] ?? false;
-  const errorSelector = state => state.dataSource.errors[id];
-  const isDataLoading = useGridSelector(apiRef, loadingSelector);
-  const error = useGridSelector(apiRef, errorSelector);
+  const isDataLoading = useGridSelector(apiRef, gridDataSourceLoadingIdSelector, id);
+  const error = useGridSelector(apiRef, gridDataSourceErrorSelector, id);
   const handleClick = event => {
     if (!rowNode.childrenExpanded) {
       // always fetch/get from cache the children when the node is expanded
@@ -81,8 +79,7 @@ export function GridDataSourceGroupingCriteriaCell(props) {
   } = props;
   const rootProps = useGridRootProps();
   const apiRef = useGridApiContext();
-  const rowSelector = state => state.rows.dataRowIdToModelLookup[id];
-  const row = useGridSelector(apiRef, rowSelector);
+  const row = useGridSelector(apiRef, gridRowSelector, id);
   const classes = useUtilityClasses(rootProps);
   let descendantCount = 0;
   if (row) {

package/esm/components/GridExcelExportMenuItem.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { GridExportMenuItemProps } from '@mui/x-data-grid-pro';
+import { GridExcelExportOptions } from "../hooks/features/export/index.js";
+export type GridExcelExportMenuItemProps = GridExportMenuItemProps<GridExcelExportOptions>;
+declare function GridExcelExportMenuItem(props: GridExcelExportMenuItemProps): React.JSX.Element;
+declare namespace GridExcelExportMenuItem {
+  var propTypes: any;
+}
+export { GridExcelExportMenuItem };

package/esm/components/GridFooterCell.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid';
+import { Theme } from '@mui/material/styles';
+import { SxProps } from '@mui/system';
+interface GridFooterCellProps extends GridRenderCellParams {
+  sx?: SxProps<Theme>;
+}
+declare function GridFooterCell(props: GridFooterCellProps): React.JSX.Element;
+export { GridFooterCell };

package/esm/components/GridGroupingColumnFooterCell.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-pro';
+declare function GridGroupingColumnFooterCell(props: GridRenderCellParams): React.JSX.Element;
+export { GridGroupingColumnFooterCell };

package/esm/components/GridGroupingColumnLeafCell.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-pro';
+declare function GridGroupingColumnLeafCell(props: GridRenderCellParams): React.JSX.Element;
+export { GridGroupingColumnLeafCell };

package/esm/components/GridGroupingCriteriaCell.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { GridRenderCellParams, GridGroupNode } from '@mui/x-data-grid-pro';
+interface GridGroupingCriteriaCellProps extends GridRenderCellParams<any, any, any, GridGroupNode> {
+  hideDescendantCount?: boolean;
+}
+export declare function GridGroupingCriteriaCell(props: GridGroupingCriteriaCellProps): React.JSX.Element;
+export {};