@mui/x-data-grid 8.4.0 → 8.5.0

package/components/quickFilter/QuickFilterControl.js

@@ -10,7 +10,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("@mui/utils");
+var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _useGridComponentRenderer = require("../../hooks/utils/useGridComponentRenderer");
@@ -48,7 +48,7 @@ const QuickFilterControl = exports.QuickFilterControl = (0, _forwardRef.forwardR
     clearValue
   } = (0, _QuickFilterContext.useQuickFilterContext)();
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
-  const handleRef = (0, _utils.unstable_useForkRef)(controlRef, ref);
+  const handleRef = (0, _useForkRef.default)(controlRef, ref);
   const handleKeyDown = event => {
     if (event.key === 'Escape') {
       if (state.value === '') {
@@ -93,6 +93,7 @@ const QuickFilterControl = exports.QuickFilterControl = (0, _forwardRef.forwardR
     children: element
   });
 });
+if (process.env.NODE_ENV !== "production") QuickFilterControl.displayName = "QuickFilterControl";
 process.env.NODE_ENV !== "production" ? QuickFilterControl.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/quickFilter/QuickFilterTrigger.js

@@ -11,7 +11,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
-var _utils = require("@mui/utils");
+var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _useGridComponentRenderer = require("../../hooks/utils/useGridComponentRenderer");
 var _QuickFilterContext = require("./QuickFilterContext");
@@ -44,7 +44,7 @@ const QuickFilterTrigger = exports.QuickFilterTrigger = (0, _forwardRef.forwardR
     triggerRef
   } = (0, _QuickFilterContext.useQuickFilterContext)();
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
-  const handleRef = (0, _utils.unstable_useForkRef)(triggerRef, ref);
+  const handleRef = (0, _useForkRef.default)(triggerRef, ref);
   const handleClick = event => {
     onExpandedChange(!state.expanded);
     onClick?.(event);
@@ -61,6 +61,7 @@ const QuickFilterTrigger = exports.QuickFilterTrigger = (0, _forwardRef.forwardR
     children: element
   });
 });
+if (process.env.NODE_ENV !== "production") QuickFilterTrigger.displayName = "QuickFilterTrigger";
 process.env.NODE_ENV !== "production" ? QuickFilterTrigger.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbar.js

@@ -18,7 +18,7 @@ var _GridToolbarFilterButton = require("./GridToolbarFilterButton");
 var _GridToolbarExport = require("./GridToolbarExport");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _GridToolbarQuickFilter = require("./GridToolbarQuickFilter");
-var _GridToolbar = require("../toolbarV8/GridToolbar");
+var _GridToolbar2 = require("../toolbarV8/GridToolbar");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["className", "csvOptions", "printOptions", "excelOptions", "showQuickFilter", "quickFilterProps"];
 /**
@@ -42,7 +42,7 @@ const GridToolbar = exports.GridToolbar = (0, _forwardRef.forwardRef)(function G
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_GridToolbarContainer.GridToolbarContainer, (0, _extends2.default)({}, other, {
     ref: ref,
-    children: [rootProps.label && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbar.GridToolbarLabel, {
+    children: [rootProps.label && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbar2.GridToolbarLabel, {
       children: rootProps.label
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbarColumnsButton.GridToolbarColumnsButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbarFilterButton.GridToolbarFilterButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbarDensitySelector.GridToolbarDensitySelector, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbarExport.GridToolbarExport, {
       csvOptions: csvOptions,
@@ -57,6 +57,7 @@ const GridToolbar = exports.GridToolbar = (0, _forwardRef.forwardRef)(function G
     }), showQuickFilter && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridToolbarQuickFilter.GridToolbarQuickFilter, (0, _extends2.default)({}, quickFilterProps))]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridToolbar.displayName = "GridToolbar";
 process.env.NODE_ENV !== "production" ? GridToolbar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarColumnsButton.js

@@ -76,6 +76,7 @@ const GridToolbarColumnsButton = exports.GridToolbarColumnsButton = (0, _forward
     }))
   }));
 });
+if (process.env.NODE_ENV !== "production") GridToolbarColumnsButton.displayName = "GridToolbarColumnsButton";
 process.env.NODE_ENV !== "production" ? GridToolbarColumnsButton.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarDensitySelector.js

@@ -9,7 +9,8 @@ exports.GridToolbarDensitySelector = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("@mui/utils");
+var _useId = _interopRequireDefault(require("@mui/utils/useId"));
+var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _densitySelector = require("../../hooks/features/density/densitySelector");
 var _keyboardUtils = require("../../utils/keyboardUtils");
@@ -31,11 +32,11 @@ const GridToolbarDensitySelector = exports.GridToolbarDensitySelector = (0, _for
   const apiRef = (0, _useGridApiContext.useGridApiContext)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const density = (0, _useGridSelector.useGridSelector)(apiRef, _densitySelector.gridDensitySelector);
-  const densityButtonId = (0, _utils.unstable_useId)();
-  const densityMenuId = (0, _utils.unstable_useId)();
+  const densityButtonId = (0, _useId.default)();
+  const densityMenuId = (0, _useId.default)();
   const [open, setOpen] = React.useState(false);
   const buttonRef = React.useRef(null);
-  const handleRef = (0, _utils.unstable_useForkRef)(ref, buttonRef);
+  const handleRef = (0, _useForkRef.default)(ref, buttonRef);
   const densityOptions = [{
     icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.densityCompactIcon, {}),
     label: apiRef.current.getLocaleText('toolbarDensityCompact'),
@@ -123,6 +124,7 @@ const GridToolbarDensitySelector = exports.GridToolbarDensitySelector = (0, _for
     })]
   });
 });
+if (process.env.NODE_ENV !== "production") GridToolbarDensitySelector.displayName = "GridToolbarDensitySelector";
 process.env.NODE_ENV !== "production" ? GridToolbarDensitySelector.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarExport.js

@@ -122,6 +122,7 @@ const GridToolbarExport = exports.GridToolbarExport = (0, _forwardRef.forwardRef
     }))
   }));
 });
+if (process.env.NODE_ENV !== "production") GridToolbarExport.displayName = "GridToolbarExport";
 process.env.NODE_ENV !== "production" ? GridToolbarExport.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarExportContainer.js

@@ -9,7 +9,8 @@ exports.GridToolbarExportContainer = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("@mui/utils");
+var _useId = _interopRequireDefault(require("@mui/utils/useId"));
+var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _keyboardUtils = require("../../utils/keyboardUtils");
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
@@ -26,11 +27,11 @@ const GridToolbarExportContainer = exports.GridToolbarExportContainer = (0, _for
   const tooltipProps = slotProps.tooltip || {};
   const apiRef = (0, _useGridApiContext.useGridApiContext)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
-  const exportButtonId = (0, _utils.unstable_useId)();
-  const exportMenuId = (0, _utils.unstable_useId)();
+  const exportButtonId = (0, _useId.default)();
+  const exportMenuId = (0, _useId.default)();
   const [open, setOpen] = React.useState(false);
   const buttonRef = React.useRef(null);
-  const handleRef = (0, _utils.unstable_useForkRef)(ref, buttonRef);
+  const handleRef = (0, _useForkRef.default)(ref, buttonRef);
   const handleMenuOpen = event => {
     setOpen(prevOpen => !prevOpen);
     buttonProps.onClick?.(event);
@@ -88,6 +89,7 @@ const GridToolbarExportContainer = exports.GridToolbarExportContainer = (0, _for
     })]
   });
 });
+if (process.env.NODE_ENV !== "production") GridToolbarExportContainer.displayName = "GridToolbarExportContainer";
 process.env.NODE_ENV !== "production" ? GridToolbarExportContainer.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarFilterButton.js

@@ -10,7 +10,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
-var _utils = require("@mui/utils");
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _capitalize = _interopRequireDefault(require("@mui/utils/capitalize"));
+var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _cssVariables = require("../../constants/cssVariables");
@@ -31,7 +33,7 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['toolbarFilterList']
   };
-  return (0, _utils.unstable_composeClasses)(slots, _gridClasses.getDataGridUtilityClass, classes);
+  return (0, _composeClasses.default)(slots, _gridClasses.getDataGridUtilityClass, classes);
 };
 const GridToolbarFilterListRoot = (0, _styles.styled)('ul', {
   name: 'MuiDataGrid',
@@ -56,8 +58,8 @@ const GridToolbarFilterButton = exports.GridToolbarFilterButton = (0, _forwardRe
   const lookup = (0, _useGridSelector.useGridSelector)(apiRef, _gridColumnsSelector.gridColumnLookupSelector);
   const preferencePanel = (0, _useGridSelector.useGridSelector)(apiRef, _gridPreferencePanelSelector.gridPreferencePanelStateSelector);
   const classes = useUtilityClasses(rootProps);
-  const filterButtonId = (0, _utils.unstable_useId)();
-  const filterPanelId = (0, _utils.unstable_useId)();
+  const filterButtonId = (0, _useId.default)();
+  const filterPanelId = (0, _useId.default)();
   const {
     filterPanelTriggerRef
   } = (0, _GridPanelContext.useGridPanelContext)();
@@ -69,7 +71,7 @@ const GridToolbarFilterButton = exports.GridToolbarFilterButton = (0, _forwardRe
     if (activeFilters.length === 0) {
       return apiRef.current.getLocaleText('toolbarFiltersTooltipShow');
     }
-    const getOperatorLabel = item => lookup[item.field].filterOperators.find(operator => operator.value === item.operator).label || apiRef.current.getLocaleText(`filterOperator${(0, _utils.unstable_capitalize)(item.operator)}`).toString();
+    const getOperatorLabel = item => lookup[item.field].filterOperators.find(operator => operator.value === item.operator).label || apiRef.current.getLocaleText(`filterOperator${(0, _capitalize.default)(item.operator)}`).toString();
     const getFilterItemValue = item => {
       const {
         getValueAsString
@@ -138,6 +140,7 @@ const GridToolbarFilterButton = exports.GridToolbarFilterButton = (0, _forwardRe
     }))
   }));
 });
+if (process.env.NODE_ENV !== "production") GridToolbarFilterButton.displayName = "GridToolbarFilterButton";
 process.env.NODE_ENV !== "production" ? GridToolbarFilterButton.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbarV8/Toolbar.js

@@ -200,6 +200,7 @@ const Toolbar = exports.Toolbar = (0, _forwardRef.forwardRef)(function Toolbar(p
     children: element
   });
 });
+if (process.env.NODE_ENV !== "production") Toolbar.displayName = "Toolbar";
 process.env.NODE_ENV !== "production" ? Toolbar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbarV8/ToolbarButton.js

@@ -10,7 +10,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("@mui/utils");
+var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
@@ -42,7 +42,7 @@ const ToolbarButton = exports.ToolbarButton = (0, _forwardRef.forwardRef)(functi
   const id = (0, _useId.default)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const buttonRef = React.useRef(null);
-  const handleRef = (0, _utils.unstable_useForkRef)(buttonRef, ref);
+  const handleRef = (0, _useForkRef.default)(buttonRef, ref);
   const {
     focusableItemId,
     registerItem,
@@ -91,6 +91,7 @@ const ToolbarButton = exports.ToolbarButton = (0, _forwardRef.forwardRef)(functi
     children: element
   });
 });
+if (process.env.NODE_ENV !== "production") ToolbarButton.displayName = "ToolbarButton";
 process.env.NODE_ENV !== "production" ? ToolbarButton.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/virtualization/GridMainContainer.js

@@ -56,4 +56,5 @@ const GridMainContainer = exports.GridMainContainer = (0, _forwardRef.forwardRef
       "data-id": "gridPanelAnchor"
     }), props.children]
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridMainContainer.displayName = "GridMainContainer";

package/components/virtualization/GridVirtualScrollbar.js

@@ -152,4 +152,5 @@ const GridVirtualScrollbar = exports.GridVirtualScrollbar = (0, _forwardRef.forw
       className: classes.content
     })
   });
-});
+});
+if (process.env.NODE_ENV !== "production") GridVirtualScrollbar.displayName = "GridVirtualScrollbar";

package/components/virtualization/GridVirtualScrollerContent.js

@@ -47,4 +47,5 @@ const GridVirtualScrollerContent = exports.GridVirtualScrollerContent = (0, _for
     className: (0, _clsx.default)(classes.root, props.className),
     ref: ref
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridVirtualScrollerContent.displayName = "GridVirtualScrollerContent";

package/components/virtualization/GridVirtualScrollerRenderZone.js

@@ -61,4 +61,5 @@ const GridVirtualScrollerRenderZone = exports.GridVirtualScrollerRenderZone = (0
   }, other, {
     ref: ref
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridVirtualScrollerRenderZone.displayName = "GridVirtualScrollerRenderZone";

package/constants/gridClasses.d.ts

@@ -619,6 +619,10 @@ export interface GridClasses {
    * Styles applied to the root element of the row reorder cell when dragging is allowed
    */
   'rowReorderCell--draggable': string;
+  /**
+   * Styles applied to the row reorder icon element.
+   */
+  rowReorderIcon: string;
   /**
    * Styles applied to the skeleton row element.
    */

package/constants/gridClasses.js

@@ -1,12 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getDataGridUtilityClass = getDataGridUtilityClass;
 exports.gridClasses = void 0;
-var _utils = require("@mui/utils");
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
 function getDataGridUtilityClass(slot) {
-  return (0, _utils.unstable_generateUtilityClass)('MuiDataGrid', slot);
+  return (0, _generateUtilityClass.default)('MuiDataGrid', slot);
 }
-const gridClasses = exports.gridClasses = (0, _utils.unstable_generateUtilityClasses)('MuiDataGrid', ['aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'mainContent', 'withSidePanel', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortButton', 'sortIcon', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction']);
+const gridClasses = exports.gridClasses = (0, _generateUtilityClasses.default)('MuiDataGrid', ['aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'mainContent', 'withSidePanel', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderIcon', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortButton', 'sortIcon', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction']);

package/esm/DataGrid/DataGrid.js

@@ -22,7 +22,7 @@ const configuration = {
     useCellAggregationResult: () => null
   }
 };
-const DataGridRaw = forwardRef(function DataGrid(inProps, ref) {
+const DataGridRaw = function DataGrid(inProps, ref) {
   const props = useDataGridProps(inProps);
   const privateApiRef = useGridApiInitialization(props.apiRef, props);
   useDataGridComponent(privateApiRef, props);
@@ -41,7 +41,8 @@ const DataGridRaw = forwardRef(function DataGrid(inProps, ref) {
       ref: ref
     }))
   });
-});
+};
+if (process.env.NODE_ENV !== "production") DataGridRaw.displayName = "DataGridRaw";
 /**
  * Features:
  * - [DataGrid](https://mui.com/x/react-data-grid/features/)
@@ -49,7 +50,7 @@ const DataGridRaw = forwardRef(function DataGrid(inProps, ref) {
  * API:
  * - [DataGrid API](https://mui.com/x/api/data-grid/data-grid/)
  */
-export const DataGrid = /*#__PURE__*/React.memo(DataGridRaw);
+export const DataGrid = /*#__PURE__*/React.memo(forwardRef(DataGridRaw));
 if (process.env.NODE_ENV !== "production") DataGrid.displayName = "DataGrid";
 DataGridRaw.propTypes = {
   // ----------------------------- Warning --------------------------------

package/esm/components/GridColumnHeaders.js

@@ -47,6 +47,7 @@ const GridColumnHeaders = forwardRef(function GridColumnHeaders(props, ref) {
     children: [getColumnGroupHeadersRows(), getColumnHeadersRow()]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridColumnHeaders.displayName = "GridColumnHeaders";
 process.env.NODE_ENV !== "production" ? GridColumnHeaders.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridFooter.js

@@ -30,6 +30,7 @@ const GridFooter = forwardRef(function GridFooter(props, ref) {
     children: [selectedRowCountElement, rowCountElement, paginationElement]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridFooter.displayName = "GridFooter";
 process.env.NODE_ENV !== "production" ? GridFooter.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridLoadingOverlay.js

@@ -47,6 +47,7 @@ const GridLoadingOverlay = forwardRef(function GridLoadingOverlay(props, ref) {
     children: /*#__PURE__*/_jsx(Component, {})
   }));
 });
+if (process.env.NODE_ENV !== "production") GridLoadingOverlay.displayName = "GridLoadingOverlay";
 process.env.NODE_ENV !== "production" ? GridLoadingOverlay.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridNoColumnsOverlay.js

@@ -26,6 +26,7 @@ const GridNoColumnsOverlay = forwardRef(function GridNoColumnsOverlay(props, ref
     }))]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridNoColumnsOverlay.displayName = "GridNoColumnsOverlay";
 process.env.NODE_ENV !== "production" ? GridNoColumnsOverlay.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridNoResultsOverlay.js

@@ -11,4 +11,5 @@ export const GridNoResultsOverlay = forwardRef(function GridNoResultsOverlay(pro
     ref: ref,
     children: noResultsOverlayLabel
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridNoResultsOverlay.displayName = "GridNoResultsOverlay";

package/esm/components/GridNoRowsOverlay.js

@@ -13,6 +13,7 @@ const GridNoRowsOverlay = forwardRef(function GridNoRowsOverlay(props, ref) {
     children: noRowsLabel
   }));
 });
+if (process.env.NODE_ENV !== "production") GridNoRowsOverlay.displayName = "GridNoRowsOverlay";
 process.env.NODE_ENV !== "production" ? GridNoRowsOverlay.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridRow.js

@@ -6,7 +6,7 @@ const _excluded = ["selected", "rowId", "row", "index", "style", "rowHeight", "c
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_useForkRef as useForkRef } from '@mui/utils';
+import useForkRef from '@mui/utils/useForkRef';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { forwardRef } from '@mui/x-internals/forwardRef';
 import { isObjectEmpty } from '@mui/x-internals/isObjectEmpty';
@@ -302,6 +302,7 @@ const GridRow = forwardRef(function GridRow(props, refProp) {
     })]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridRow.displayName = "GridRow";
 process.env.NODE_ENV !== "production" ? GridRow.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridRowCount.js

@@ -51,6 +51,7 @@ const GridRowCount = forwardRef(function GridRowCount(props, ref) {
     children: [apiRef.current.getLocaleText('footerTotalRows'), " ", text]
   }));
 });
+if (process.env.NODE_ENV !== "production") GridRowCount.displayName = "GridRowCount";
 process.env.NODE_ENV !== "production" ? GridRowCount.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridSelectedRowCount.js

@@ -55,6 +55,7 @@ const GridSelectedRowCount = forwardRef(function GridSelectedRowCount(props, ref
     children: rowSelectedText
   }));
 });
+if (process.env.NODE_ENV !== "production") GridSelectedRowCount.displayName = "GridSelectedRowCount";
 process.env.NODE_ENV !== "production" ? GridSelectedRowCount.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridShadowScrollArea.js

@@ -84,6 +84,7 @@ const GridShadowScrollArea = forwardRef(function GridShadowScrollArea(props, ref
     children: children
   }));
 });
+if (process.env.NODE_ENV !== "production") GridShadowScrollArea.displayName = "GridShadowScrollArea";
 process.env.NODE_ENV !== "production" ? GridShadowScrollArea.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/GridSkeletonLoadingOverlay.js

@@ -186,6 +186,7 @@ export const GridSkeletonLoadingOverlayInner = forwardRef(function GridSkeletonL
     children: children
   }));
 });
+if (process.env.NODE_ENV !== "production") GridSkeletonLoadingOverlayInner.displayName = "GridSkeletonLoadingOverlayInner";
 export const GridSkeletonLoadingOverlay = forwardRef(function GridSkeletonLoadingOverlay(props, forwardedRef) {
   const apiRef = useGridApiContext();
   const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
@@ -195,4 +196,5 @@ export const GridSkeletonLoadingOverlay = forwardRef(function GridSkeletonLoadin
     skeletonRowsCount: skeletonRowsCount,
     ref: forwardedRef
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridSkeletonLoadingOverlay.displayName = "GridSkeletonLoadingOverlay";

package/esm/components/cell/GridActionsCell.js

@@ -4,7 +4,7 @@ const _excluded = ["api", "colDef", "id", "hasFocus", "isEditable", "field", "va
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useRtl } from '@mui/system/RtlProvider';
-import { unstable_useId as useId } from '@mui/utils';
+import useId from '@mui/utils/useId';
 import { gridClasses } from "../../constants/gridClasses.js";
 import { GridMenu } from "../menu/GridMenu.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";

package/esm/components/cell/GridActionsCellItem.js

@@ -54,6 +54,7 @@ const GridActionsCellItem = forwardRef((props, ref) => {
     children: label
   }));
 });
+if (process.env.NODE_ENV !== "production") GridActionsCellItem.displayName = "GridActionsCellItem";
 process.env.NODE_ENV !== "production" ? GridActionsCellItem.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/cell/GridCell.js

@@ -5,7 +5,10 @@ const _excluded = ["column", "row", "rowId", "rowNode", "align", "children", "co
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_useForkRef as useForkRef, unstable_composeClasses as composeClasses, unstable_ownerDocument as ownerDocument, unstable_capitalize as capitalize } from '@mui/utils';
+import useForkRef from '@mui/utils/useForkRef';
+import composeClasses from '@mui/utils/composeClasses';
+import ownerDocument from '@mui/utils/ownerDocument';
+import capitalize from '@mui/utils/capitalize';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { useRtl } from '@mui/system/RtlProvider';
 import { forwardRef } from '@mui/x-internals/forwardRef';
@@ -308,6 +311,7 @@ const GridCell = forwardRef(function GridCell(props, ref) {
     children: children
   }));
 });
+if (process.env.NODE_ENV !== "production") GridCell.displayName = "GridCell";
 process.env.NODE_ENV !== "production" ? GridCell.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/cell/GridEditBooleanCell.js

@@ -4,7 +4,9 @@ const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowN
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses, unstable_useId as useId, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import useId from '@mui/utils/useId';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
 import { useGridApiContext } from "../../hooks/utils/useGridApiContext.js";

package/esm/components/cell/GridEditDateCell.js

@@ -3,7 +3,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "inputProps", "isValidating", "isProcessingProps", "onValueChange", "slotProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { styled } from '@mui/material/styles';
 import { NotRendered } from "../../utils/assert.js";
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";

package/esm/components/cell/GridEditInputCell.js

@@ -3,7 +3,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "hasFocus", "isValidating", "debounceMs", "isProcessingProps", "onValueChange", "slotProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { styled } from '@mui/material/styles';
 import { forwardRef } from '@mui/x-internals/forwardRef';
 import { NotRendered } from "../../utils/assert.js";
@@ -97,6 +98,7 @@ const GridEditInputCell = forwardRef((props, ref) => {
     ref: ref
   }));
 });
+if (process.env.NODE_ENV !== "production") GridEditInputCell.displayName = "GridEditInputCell";
 process.env.NODE_ENV !== "production" ? GridEditInputCell.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/components/cell/GridEditSingleSelectCell.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 const _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange", "initialOpen", "slotProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { GridCellEditStopReasons } from "../../models/params/gridEditCellParams.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
 import { GridEditModes } from "../../models/gridEditRowModel.js";

package/esm/components/cell/GridSkeletonCell.js

@@ -4,7 +4,8 @@ const _excluded = ["field", "type", "align", "width", "height", "empty", "style"
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses, unstable_capitalize as capitalize } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import capitalize from '@mui/utils/capitalize';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { createRandomNumberGenerator } from "../../utils/utils.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";

package/esm/components/columnHeaders/GridBaseColumnHeaders.js

@@ -41,4 +41,5 @@ export const GridBaseColumnHeaders = forwardRef(function GridColumnHeaders(props
     role: "presentation",
     ref: ref
   }));
-});
+});
+if (process.env.NODE_ENV !== "production") GridBaseColumnHeaders.displayName = "GridBaseColumnHeaders";

package/esm/components/columnHeaders/GridColumnGroupHeader.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { unstable_useId as useId, unstable_composeClasses as composeClasses } from '@mui/utils';
+import useId from '@mui/utils/useId';
+import composeClasses from '@mui/utils/composeClasses';
 import { useRtl } from '@mui/system/RtlProvider';
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";