@mui/x-data-grid 5.10.0 → 5.11.0

package/legacy/components/cell/GridEditSingleSelectCell.js

@@ -3,7 +3,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
-var _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "getValue", "hasFocus", "isValidating", "isProcessingProps", "error"];
+var _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "getValue", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -12,7 +12,6 @@ import MenuItem from '@mui/material/MenuItem';
 import { isEscapeKey } from '../../utils/keyboardUtils';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { GridEditModes } from '../../models/gridEditRowModel';
-import { GridEvents } from '../../models/events/gridEvents';
 import { getValueFromValueOptions } from '../panel/filterPanel/filterPanelUtils';
 import { jsx as _jsx } from "react/jsx-runtime";
 
@@ -47,6 +46,7 @@ function GridEditSingleSelectCell(props) {
       isValidating = props.isValidating,
       isProcessingProps = props.isProcessingProps,
       error = props.error,
+      onValueChange = props.onValueChange,
       other = _objectWithoutProperties(props, _excluded);
 
   var ref = React.useRef();
@@ -103,39 +103,49 @@ function GridEditSingleSelectCell(props) {
               target = event.target; // NativeSelect casts the value to a string.
 
               formattedTargetValue = getValueFromValueOptions(target.value, valueOptionsFormatted);
-              _context.next = 5;
+
+              if (!onValueChange) {
+                _context.next = 6;
+                break;
+              }
+
+              _context.next = 6;
+              return onValueChange(event, formattedTargetValue);
+
+            case 6:
+              _context.next = 8;
               return api.setEditCellValue({
                 id: id,
                 field: field,
                 value: formattedTargetValue
               }, event);
 
-            case 5:
+            case 8:
               isValid = _context.sent;
 
               if (!((_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.newEditingApi)) {
-                _context.next = 8;
+                _context.next = 11;
                 break;
               }
 
               return _context.abrupt("return");
 
-            case 8:
+            case 11:
               if (!(rootProps.editMode === GridEditModes.Row || isValid === false)) {
-                _context.next = 10;
+                _context.next = 13;
                 break;
               }
 
               return _context.abrupt("return");
 
-            case 10:
-              _context.next = 12;
+            case 13:
+              _context.next = 15;
               return Promise.resolve(api.commitCellChange({
                 id: id,
                 field: field
               }, event));
 
-            case 12:
+            case 15:
               canCommit = _context.sent;
 
               if (canCommit) {
@@ -144,11 +154,11 @@ function GridEditSingleSelectCell(props) {
                 if (event.key) {
                   // TODO v6: remove once we stop ignoring events fired from portals
                   params = api.getCellParams(id, field);
-                  api.publishEvent(GridEvents.cellNavigationKeyDown, params, event);
+                  api.publishEvent('cellNavigationKeyDown', params, event);
                 }
               }
 
-            case 14:
+            case 17:
             case "end":
               return _context.stop();
           }
@@ -269,6 +279,14 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
   isProcessingProps: PropTypes.bool,
   isValidating: PropTypes.bool,
 
+  /**
+   * Callback called when the value is changed by the user.
+   * @param {SelectChangeEvent<any>} event The event source of the callback.
+   * @param {any} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.
+   * @returns {Promise<void> | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`
+   */
+  onValueChange: PropTypes.func,
+
   /**
    * The row model of the row that the current cell belongs to.
    */
@@ -277,7 +295,17 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
   /**
    * The node of the row that the current cell belongs to.
    */
-  rowNode: PropTypes.object.isRequired
+  rowNode: PropTypes.object.isRequired,
+
+  /**
+   * the tabIndex value.
+   */
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
+
+  /**
+   * The cell value, but if the column has valueGetter, use getValue.
+   */
+  value: PropTypes.any
 } : void 0;
 export { GridEditSingleSelectCell };
 export var renderEditSingleSelectCell = function renderEditSingleSelectCell(params) {

package/legacy/components/cell/index.js

@@ -1,4 +1,6 @@
 export * from './GridCell';
+export * from './GridEditBooleanCell';
+export * from './GridEditDateCell';
 export * from './GridEditInputCell';
 export * from './GridEditSingleSelectCell';
 export * from './GridActionsCell';

package/legacy/components/columnHeaders/GridColumnHeaderItem.js

@@ -5,7 +5,6 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
 import { unstable_useId as useId } from '@mui/material/utils';
-import { GridEvents } from '../../models/events';
 import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
 import { GridColumnHeaderSortIcon } from './GridColumnHeaderSortIcon';
 import { GridColumnHeaderTitle } from './GridColumnHeaderTitle';
@@ -91,25 +90,25 @@ function GridColumnHeaderItem(props) {
     };
   }, [apiRef, column.field]);
   var mouseEventsHandlers = {
-    onClick: publish(GridEvents.columnHeaderClick),
-    onDoubleClick: publish(GridEvents.columnHeaderDoubleClick),
-    onMouseOver: publish(GridEvents.columnHeaderOver),
+    onClick: publish('columnHeaderClick'),
+    onDoubleClick: publish('columnHeaderDoubleClick'),
+    onMouseOver: publish('columnHeaderOver'),
     // TODO remove as it's not used
-    onMouseOut: publish(GridEvents.columnHeaderOut),
+    onMouseOut: publish('columnHeaderOut'),
     // TODO remove as it's not used
-    onMouseEnter: publish(GridEvents.columnHeaderEnter),
+    onMouseEnter: publish('columnHeaderEnter'),
     // TODO remove as it's not used
-    onMouseLeave: publish(GridEvents.columnHeaderLeave),
+    onMouseLeave: publish('columnHeaderLeave'),
     // TODO remove as it's not used
-    onKeyDown: publish(GridEvents.columnHeaderKeyDown),
-    onFocus: publish(GridEvents.columnHeaderFocus),
-    onBlur: publish(GridEvents.columnHeaderBlur)
+    onKeyDown: publish('columnHeaderKeyDown'),
+    onFocus: publish('columnHeaderFocus'),
+    onBlur: publish('columnHeaderBlur')
   };
   var draggableEventHandlers = {
-    onDragStart: publish(GridEvents.columnHeaderDragStart),
-    onDragEnter: publish(GridEvents.columnHeaderDragEnter),
-    onDragOver: publish(GridEvents.columnHeaderDragOver),
-    onDragEnd: publish(GridEvents.columnHeaderDragEnd)
+    onDragStart: publish('columnHeaderDragStart'),
+    onDragEnter: publish('columnHeaderDragEnter'),
+    onDragOver: publish('columnHeaderDragOver'),
+    onDragEnd: publish('columnHeaderDragEnd')
   };
   var removeLastBorderRight = isLastColumn && hasScrollX && !hasScrollY;
   var showRightBorder = !isLastColumn ? rootProps.showColumnRightBorder : !removeLastBorderRight && !extendRowFullWidth;
@@ -121,7 +120,7 @@ function GridColumnHeaderItem(props) {
 
   var classes = useUtilityClasses(ownerState);
   var width = column.computedWidth;
-  var ariaSort;
+  var ariaSort = 'none';
 
   if (sortDirection != null) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
@@ -204,7 +203,7 @@ function GridColumnHeaderItem(props) {
       resizable: !rootProps.disableColumnResize && !!column.resizable,
       resizing: isResizing,
       height: headerHeight,
-      onMouseDown: publish(GridEvents.columnSeparatorMouseDown),
+      onMouseDown: publish('columnSeparatorMouseDown'),
       side: separatorSide
     }), /*#__PURE__*/_jsx(GridColumnHeaderMenu, {
       columnMenuId: columnMenuId,

package/legacy/components/columnSelection/GridCellCheckboxRenderer.js

@@ -5,7 +5,6 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
 import { useForkRef } from '@mui/material/utils';
-import { GridEvents } from '../../models/events';
 import { isNavigationKey, isSpaceKey } from '../../utils/keyboardUtils';
 import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
@@ -54,7 +53,7 @@ var GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCell
       value: event.target.checked,
       id: id
     };
-    apiRef.current.publishEvent(GridEvents.rowSelectionCheckboxChange, params, event);
+    apiRef.current.publishEvent('rowSelectionCheckboxChange', params, event);
   };
 
   React.useLayoutEffect(function () {
@@ -79,7 +78,7 @@ var GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCell
     }
 
     if (isNavigationKey(event.key) && !event.shiftKey) {
-      apiRef.current.publishEvent(GridEvents.cellNavigationKeyDown, props, event);
+      apiRef.current.publishEvent('cellNavigationKeyDown', props, event);
     }
   }, [apiRef, props]);
   var isSelectable = !rootProps.isRowSelectable || rootProps.isRowSelectable(apiRef.current.getRowParams(id));

package/legacy/components/columnSelection/GridHeaderCheckbox.js

@@ -5,7 +5,6 @@ var _excluded = ["field", "colDef"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
-import { GridEvents } from '../../models/events';
 import { useGridSelector } from '../../hooks/utils/useGridSelector';
 import { gridTabIndexColumnHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';
 import { gridSelectionStateSelector } from '../../hooks/features/selection/gridSelectionSelector';
@@ -83,7 +82,7 @@ var GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckb
     var params = {
       value: event.target.checked
     };
-    apiRef.current.publishEvent(GridEvents.headerSelectionCheckboxChange, params);
+    apiRef.current.publishEvent('headerSelectionCheckboxChange', params);
   };
 
   var tabIndex = tabIndexState !== null && tabIndexState.field === props.field ? 0 : -1;
@@ -97,14 +96,14 @@ var GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckb
   var handleKeyDown = React.useCallback(function (event) {
     if (event.key === ' ') {
       // imperative toggle the checkbox because Space is disable by some preventDefault
-      apiRef.current.publishEvent(GridEvents.headerSelectionCheckboxChange, {
+      apiRef.current.publishEvent('headerSelectionCheckboxChange', {
         value: !isChecked
       });
     } // TODO v6 remove columnHeaderNavigationKeyDown events which are not used internally anymore
 
 
     if (isNavigationKey(event.key) && !event.shiftKey) {
-      apiRef.current.publishEvent(GridEvents.columnHeaderNavigationKeyDown, props, event);
+      apiRef.current.publishEvent('columnHeaderNavigationKeyDown', props, event);
     }
   }, [apiRef, props, isChecked]);
   var handleSelectionChange = React.useCallback(function () {
@@ -113,7 +112,7 @@ var GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckb
     });
   }, []);
   React.useEffect(function () {
-    return apiRef.current.subscribeEvent(GridEvents.selectionChange, handleSelectionChange);
+    return apiRef.current.subscribeEvent('selectionChange', handleSelectionChange);
   }, [apiRef, handleSelectionChange]);
   var label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectAllRows' : 'checkboxSelectionSelectAllRows');
   return /*#__PURE__*/_jsx(rootProps.components.BaseCheckbox, _extends({

package/legacy/components/containers/GridFooterContainer.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
 import { styled, alpha, lighten, darken } from '@mui/material/styles';
@@ -35,7 +36,7 @@ var GridFooterContainerRoot = styled('div', {
     borderTop: "1px solid ".concat(borderColor)
   };
 });
-export var GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFooterContainer(props, ref) {
+var GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFooterContainer(props, ref) {
   var className = props.className,
       other = _objectWithoutProperties(props, _excluded);
 
@@ -48,4 +49,12 @@ export var GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFoot
     ref: ref,
     className: clsx(classes.root, className)
   }, other));
-});
+});
+process.env.NODE_ENV !== "production" ? GridFooterContainer.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridFooterContainer };

package/legacy/components/containers/GridToolbarContainer.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "children"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -28,10 +29,11 @@ var GridToolbarContainerRoot = styled('div', {
   return {
     display: 'flex',
     alignItems: 'center',
+    flexWrap: 'wrap',
     padding: theme.spacing(0.5, 0.5, 0)
   };
 });
-export var GridToolbarContainer = /*#__PURE__*/React.forwardRef(function GridToolbarContainer(props, ref) {
+var GridToolbarContainer = /*#__PURE__*/React.forwardRef(function GridToolbarContainer(props, ref) {
   var className = props.className,
       children = props.children,
       other = _objectWithoutProperties(props, _excluded);
@@ -52,4 +54,12 @@ export var GridToolbarContainer = /*#__PURE__*/React.forwardRef(function GridToo
   }, other, {
     children: children
   }));
-});
+});
+process.env.NODE_ENV !== "production" ? GridToolbarContainer.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridToolbarContainer };

package/legacy/components/panel/GridPanelContent.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -30,7 +31,8 @@ var GridPanelContentRoot = styled('div', {
   flex: '1 1',
   maxHeight: 400
 });
-export function GridPanelContent(props) {
+
+function GridPanelContent(props) {
   var className = props.className,
       other = _objectWithoutProperties(props, _excluded);
 
@@ -42,4 +44,13 @@ export function GridPanelContent(props) {
   return /*#__PURE__*/_jsx(GridPanelContentRoot, _extends({
     className: clsx(className, classes.root)
   }, other));
-}
+}
+
+process.env.NODE_ENV !== "production" ? GridPanelContent.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridPanelContent };

package/legacy/components/panel/GridPanelFooter.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -31,7 +32,8 @@ var GridPanelFooterRoot = styled('div', {
     justifyContent: 'space-between'
   };
 });
-export function GridPanelFooter(props) {
+
+function GridPanelFooter(props) {
   var className = props.className,
       other = _objectWithoutProperties(props, _excluded);
 
@@ -43,4 +45,13 @@ export function GridPanelFooter(props) {
   return /*#__PURE__*/_jsx(GridPanelFooterRoot, _extends({
     className: clsx(className, classes.root)
   }, other));
-}
+}
+
+process.env.NODE_ENV !== "production" ? GridPanelFooter.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridPanelFooter };

package/legacy/components/panel/GridPanelHeader.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -29,7 +30,8 @@ var GridPanelHeaderRoot = styled('div', {
     padding: theme.spacing(1)
   };
 });
-export function GridPanelHeader(props) {
+
+function GridPanelHeader(props) {
   var className = props.className,
       other = _objectWithoutProperties(props, _excluded);
 
@@ -41,4 +43,13 @@ export function GridPanelHeader(props) {
   return /*#__PURE__*/_jsx(GridPanelHeaderRoot, _extends({
     className: clsx(className, classes.root)
   }, other));
-}
+}
+
+process.env.NODE_ENV !== "production" ? GridPanelHeader.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { GridPanelHeader };

package/legacy/components/toolbar/GridToolbar.js

@@ -1,25 +1,34 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["className", "csvOptions", "printOptions"];
+var _excluded = ["className", "csvOptions", "printOptions", "excelOptions", "showQuickFilter", "quickFilterProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
+import Box from '@mui/material/Box';
 import { GridToolbarContainer } from '../containers/GridToolbarContainer';
 import { GridToolbarColumnsButton } from './GridToolbarColumnsButton';
 import { GridToolbarDensitySelector } from './GridToolbarDensitySelector';
 import { GridToolbarFilterButton } from './GridToolbarFilterButton';
 import { GridToolbarExport } from './GridToolbarExport';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { GridToolbarQuickFilter } from './GridToolbarQuickFilter';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var GridToolbar = /*#__PURE__*/React.forwardRef(function GridToolbar(props, ref) {
+  // TODO v6: think about where export option should be passed.
+  // from componentProps={{ toolbarExport: { ...exportOption} }} seems to be more appropriate
   var className = props.className,
       csvOptions = props.csvOptions,
       printOptions = props.printOptions,
+      excelOptions = props.excelOptions,
+      _props$showQuickFilte = props.showQuickFilter,
+      showQuickFilter = _props$showQuickFilte === void 0 ? false : _props$showQuickFilte,
+      _props$quickFilterPro = props.quickFilterProps,
+      quickFilterProps = _props$quickFilterPro === void 0 ? {} : _props$quickFilterPro,
       other = _objectWithoutProperties(props, _excluded);
 
   var rootProps = useGridRootProps();
 
-  if (rootProps.disableColumnFilter && rootProps.disableColumnSelector && rootProps.disableDensitySelector) {
+  if (rootProps.disableColumnFilter && rootProps.disableColumnSelector && rootProps.disableDensitySelector && !showQuickFilter) {
     return null;
   }
 
@@ -28,8 +37,14 @@ var GridToolbar = /*#__PURE__*/React.forwardRef(function GridToolbar(props, ref)
   }, other, {
     children: [/*#__PURE__*/_jsx(GridToolbarColumnsButton, {}), /*#__PURE__*/_jsx(GridToolbarFilterButton, {}), /*#__PURE__*/_jsx(GridToolbarDensitySelector, {}), /*#__PURE__*/_jsx(GridToolbarExport, {
       csvOptions: csvOptions,
-      printOptions: printOptions
-    })]
+      printOptions: printOptions // TODO: remove the reference to excelOptions in community package
+      ,
+      excelOptions: excelOptions
+    }), /*#__PURE__*/_jsx(Box, {
+      sx: {
+        flex: 1
+      }
+    }), showQuickFilter && /*#__PURE__*/_jsx(GridToolbarQuickFilter, _extends({}, quickFilterProps))]
   }));
 });
 process.env.NODE_ENV !== "production" ? GridToolbar.propTypes = {
@@ -37,7 +52,17 @@ process.env.NODE_ENV !== "production" ? GridToolbar.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
-  csvOptions: PropTypes.object,
-  printOptions: PropTypes.object
+
+  /**
+   * Props passed to the quick filter component.
+   */
+  quickFilterProps: PropTypes.object,
+
+  /**
+   * Show the quick filter component.
+   * @default false
+   */
+  showQuickFilter: PropTypes.bool,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
 } : void 0;
 export { GridToolbar };

package/legacy/components/toolbar/GridToolbarExport.js

@@ -1,22 +1,16 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["csvOptions", "printOptions"];
+var _excluded = ["csvOptions", "printOptions", "excelOptions"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import MenuItem from '@mui/material/MenuItem';
 import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
 import { GridToolbarExportContainer } from './GridToolbarExportContainer';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
 export var GridCsvExportMenuItem = function GridCsvExportMenuItem(props) {
   var apiRef = useGridApiContext();
   var hideMenu = props.hideMenu,
       options = props.options;
-
-  if (options != null && options.disableToolbarButton) {
-    return null;
-  }
-
   return /*#__PURE__*/_jsx(MenuItem, {
     onClick: function onClick() {
       apiRef.current.exportDataAsCsv(options);
@@ -29,11 +23,6 @@ export var GridPrintExportMenuItem = function GridPrintExportMenuItem(props) {
   var apiRef = useGridApiContext();
   var hideMenu = props.hideMenu,
       options = props.options;
-
-  if (options != null && options.disableToolbarButton) {
-    return null;
-  }
-
   return /*#__PURE__*/_jsx(MenuItem, {
     onClick: function onClick() {
       apiRef.current.exportDataAsPrint(options);
@@ -47,19 +36,29 @@ var GridToolbarExport = /*#__PURE__*/React.forwardRef(function GridToolbarExport
       csvOptions = _props$csvOptions === void 0 ? {} : _props$csvOptions,
       _props$printOptions = props.printOptions,
       printOptions = _props$printOptions === void 0 ? {} : _props$printOptions,
+      excelOptions = props.excelOptions,
       other = _objectWithoutProperties(props, _excluded);
 
-  if (csvOptions != null && csvOptions.disableToolbarButton && printOptions != null && printOptions.disableToolbarButton) {
+  var apiRef = useGridApiContext();
+  var preProcessedButtons = apiRef.current.unstable_applyPipeProcessors('exportMenu', [], {
+    excelOptions: excelOptions,
+    csvOptions: csvOptions,
+    printOptions: printOptions
+  }).sort(function (a, b) {
+    return a.componentName > b.componentName ? 1 : -1;
+  });
+
+  if (preProcessedButtons.length === 0) {
     return null;
   }
 
-  return /*#__PURE__*/_jsxs(GridToolbarExportContainer, _extends({}, other, {
+  return /*#__PURE__*/_jsx(GridToolbarExportContainer, _extends({}, other, {
     ref: ref,
-    children: [/*#__PURE__*/_jsx(GridCsvExportMenuItem, {
-      options: csvOptions
-    }), /*#__PURE__*/_jsx(GridPrintExportMenuItem, {
-      options: printOptions
-    })]
+    children: preProcessedButtons.map(function (button, index) {
+      return /*#__PURE__*/React.cloneElement(button.component, {
+        key: index
+      });
+    })
   }));
 });
 process.env.NODE_ENV !== "production" ? GridToolbarExport.propTypes = {