@mui/x-data-grid 8.0.0-alpha.4 → 8.0.0-alpha.5

package/node/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js

@@ -8,8 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.GridColumnMenuSortItem = GridColumnMenuSortItem;
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
-var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
 var _useGridSelector = require("../../../../hooks/utils/useGridSelector");
 var _gridSortingSelector = require("../../../../hooks/features/sorting/gridSortingSelector");
 var _useGridApiContext = require("../../../../hooks/utils/useGridApiContext");
@@ -44,31 +42,24 @@ function GridColumnMenuSortItem(props) {
     return typeof label === 'function' ? label(colDef) : label;
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [sortingOrder.includes('asc') && sortDirection !== 'asc' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(rootProps.slots.baseMenuItem, {
+    children: [sortingOrder.includes('asc') && sortDirection !== 'asc' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseMenuItem, {
       onClick: onSortMenuItemClick,
       "data-value": "asc",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.columnMenuSortAscendingIcon, {
-          fontSize: "small"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
-        children: getLabel('columnMenuSortAsc')
-      })]
-    }) : null, sortingOrder.includes('desc') && sortDirection !== 'desc' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(rootProps.slots.baseMenuItem, {
+      iconStart: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.columnMenuSortAscendingIcon, {
+        fontSize: "small"
+      }),
+      children: getLabel('columnMenuSortAsc')
+    }) : null, sortingOrder.includes('desc') && sortDirection !== 'desc' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseMenuItem, {
       onClick: onSortMenuItemClick,
       "data-value": "desc",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.columnMenuSortDescendingIcon, {
-          fontSize: "small"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
-        children: getLabel('columnMenuSortDesc')
-      })]
-    }) : null, sortingOrder.includes(null) && sortDirection != null ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(rootProps.slots.baseMenuItem, {
+      iconStart: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.columnMenuSortDescendingIcon, {
+        fontSize: "small"
+      }),
+      children: getLabel('columnMenuSortDesc')
+    }) : null, sortingOrder.includes(null) && sortDirection != null ? /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseMenuItem, {
       onClick: onSortMenuItemClick,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
-        children: apiRef.current.getLocaleText('columnMenuUnsort')
-      })]
+      iconStart: "",
+      children: apiRef.current.getLocaleText('columnMenuUnsort')
     }) : null]
   });
 }

package/node/components/toolbar/GridToolbarDensitySelector.js

@@ -10,7 +10,6 @@ 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 _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
 var _densitySelector = require("../../hooks/features/density/densitySelector");
 var _keyboardUtils = require("../../utils/keyboardUtils");
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
@@ -80,12 +79,11 @@ const GridToolbarDensitySelector = exports.GridToolbarDensitySelector = /*#__PUR
   if (rootProps.disableDensitySelector) {
     return null;
   }
-  const densityElements = densityOptions.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(rootProps.slots.baseMenuItem, {
+  const densityElements = densityOptions.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseMenuItem, {
     onClick: () => handleDensityUpdate(option.value),
     selected: option.value === density,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
-      children: option.icon
-    }), option.label]
+    iconStart: option.icon,
+    children: option.label
   }, index));
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseTooltip, (0, _extends2.default)({

package/node/components/toolbar/GridToolbarFilterButton.js

@@ -39,6 +39,9 @@ const GridToolbarFilterListRoot = (0, _styles.styled)('ul', {
   margin: theme.spacing(1, 1, 0.5),
   padding: theme.spacing(0, 1)
 }));
+
+// FIXME(v8:romgrk): override slotProps
+
 const GridToolbarFilterButton = exports.GridToolbarFilterButton = /*#__PURE__*/React.forwardRef(function GridToolbarFilterButton(props, ref) {
   const {
     slotProps = {}

package/node/components/toolbar/GridToolbarQuickFilter.js

@@ -15,6 +15,7 @@ var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _styles = require("@mui/material/styles");
 var _utils = require("@mui/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _OutlinedInput = require("@mui/material/OutlinedInput");
 var _constants = require("../../constants");
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
@@ -39,13 +40,8 @@ const GridToolbarQuickFilterRoot = (0, _styles.styled)(_TextField.default, {
 })(({
   theme
 }) => ({
-  width: 'auto',
-  paddingBottom: theme.spacing(0.5),
-  '& input': {
-    marginLeft: theme.spacing(0.5)
-  },
-  '& .MuiInput-underline:before': {
-    borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`
+  [`.${_OutlinedInput.outlinedInputClasses.root}`]: {
+    fontSize: theme.typography.body2.fontSize
   },
   [`& input[type="search"]::-webkit-search-decoration,
   & input[type="search"]::-webkit-search-cancel-button,
@@ -99,7 +95,8 @@ function GridToolbarQuickFilter(props) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridToolbarQuickFilterRoot, (0, _extends2.default)({
     as: rootProps.slots.baseTextField,
     ownerState: rootProps,
-    variant: "standard",
+    variant: "outlined",
+    size: "small",
     value: searchValue,
     onChange: handleSearchValueChange,
     className: (0, _clsx.default)(classes.root, className),
@@ -108,23 +105,30 @@ function GridToolbarQuickFilter(props) {
     type: "search"
   }, other, {
     InputProps: (0, _extends2.default)({
-      startAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.quickFilterIcon, {
-        fontSize: "small"
-      }),
-      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
-        "aria-label": apiRef.current.getLocaleText('toolbarQuickFilterDeleteIconLabel'),
-        size: "small",
-        sx: [searchValue ? {
-          visibility: 'visible'
-        } : {
-          visibility: 'hidden'
-        }],
-        onClick: handleSearchReset
-      }, rootProps.slotProps?.baseIconButton, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.quickFilterClearIcon, {
+      startAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseInputAdornment, {
+        position: "start",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.quickFilterIcon, {
           fontSize: "small"
         })
-      }))
+      }),
+      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseInputAdornment, {
+        position: "end",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
+          "aria-label": apiRef.current.getLocaleText('toolbarQuickFilterDeleteIconLabel'),
+          size: "small",
+          edge: "end",
+          sx: [searchValue ? {
+            visibility: 'visible'
+          } : {
+            visibility: 'hidden'
+          }],
+          onClick: handleSearchReset
+        }, rootProps.slotProps?.baseIconButton, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.quickFilterClearIcon, {
+            fontSize: "small"
+          })
+        }))
+      })
     }, other.InputProps)
   }, rootProps.slotProps?.baseTextField));
 }

package/node/components/virtualization/GridMainContainer.js

@@ -38,7 +38,7 @@ const GridMainContainer = exports.GridMainContainer = /*#__PURE__*/React.forward
     ownerState: rootProps,
     className: props.className,
     tabIndex: -1
-  }, ariaAttributes, {
+  }, ariaAttributes, rootProps.slotProps?.main, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(GridPanelAnchor, {
       role: "presentation",
       "data-id": "gridPanelAnchor"

package/node/hooks/features/columnHeaders/useGridColumnHeaders.js

@@ -55,7 +55,7 @@ const useGridColumnHeaders = props => {
   const isRtl = (0, _RtlProvider.useRtl)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const dimensions = (0, _utils.useGridSelector)(apiRef, _dimensions.gridDimensionsSelector);
-  const hasVirtualization = (0, _utils.useGridSelector)(apiRef, _virtualization.gridVirtualizationColumnEnabledSelector);
+  const hasColumnVirtualization = (0, _utils.useGridSelector)(apiRef, _virtualization.gridVirtualizationColumnEnabledSelector);
   const columnGroupsModel = (0, _utils.useGridSelector)(apiRef, _gridColumnGroupsSelector.gridColumnGroupsUnwrappedModelSelector);
   const columnPositions = (0, _utils.useGridSelector)(apiRef, _columns.gridColumnPositionsSelector);
   const renderContext = (0, _utils.useGridSelector)(apiRef, _virtualization.gridRenderContextColumnsSelector);
@@ -95,8 +95,15 @@ const useGridColumnHeaders = props => {
       renderContext: currentContext = renderContext,
       maxLastColumn = visibleColumns.length
     } = params || {};
-    const firstColumnToRender = currentContext.firstColumnIndex;
-    const lastColumnToRender = !hasVirtualization ? maxLastColumn : currentContext.lastColumnIndex;
+    let firstColumnToRender;
+    let lastColumnToRender;
+    if (!rootProps.disableVirtualization && !hasColumnVirtualization) {
+      firstColumnToRender = 0;
+      lastColumnToRender = maxLastColumn;
+    } else {
+      firstColumnToRender = currentContext.firstColumnIndex;
+      lastColumnToRender = currentContext.lastColumnIndex;
+    }
     const renderedColumns = visibleColumns.slice(firstColumnToRender, lastColumnToRender);
     return {
       renderedColumns,

package/node/hooks/features/columnResize/gridColumnResizeApi.js

@@ -8,7 +8,8 @@ const DEFAULT_GRID_AUTOSIZE_OPTIONS = exports.DEFAULT_GRID_AUTOSIZE_OPTIONS = {
   includeHeaders: true,
   includeOutliers: false,
   outliersFactor: 1.5,
-  expand: false
+  expand: false,
+  disableColumnVirtualization: true
 };
 
 /**

package/node/hooks/features/columnResize/useGridColumnResize.js

@@ -469,6 +469,7 @@ const useGridColumnResize = (apiRef, props) => {
       return;
     }
     apiRef.current.autosizeColumns((0, _extends2.default)({}, props.autosizeOptions, {
+      disableColumnVirtualization: false,
       columns: [column.field]
     }));
   });
@@ -495,8 +496,10 @@ const useGridColumnResize = (apiRef, props) => {
     options.columns = options.columns.filter(c => state.columnVisibilityModel[c] !== false);
     const columns = options.columns.map(c => apiRef.current.state.columns.lookup[c]);
     try {
-      apiRef.current.unstable_setColumnVirtualization(false);
-      await columnVirtualizationDisabled();
+      if (!props.disableVirtualization && options.disableColumnVirtualization) {
+        apiRef.current.unstable_setColumnVirtualization(false);
+        await columnVirtualizationDisabled();
+      }
       const widthByField = extractColumnWidths(apiRef, options, columns);
       const newColumns = columns.map(column => (0, _extends2.default)({}, column, {
         width: widthByField[column.field],
@@ -528,10 +531,12 @@ const useGridColumnResize = (apiRef, props) => {
         }
       });
     } finally {
-      apiRef.current.unstable_setColumnVirtualization(true);
+      if (!props.disableVirtualization) {
+        apiRef.current.unstable_setColumnVirtualization(true);
+      }
       isAutosizingRef.current = false;
     }
-  }, [apiRef, columnVirtualizationDisabled]);
+  }, [apiRef, columnVirtualizationDisabled, props.disableVirtualization]);
 
   /**
    * EFFECTS

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

@@ -334,6 +334,7 @@ function getTotalHeaderHeight(apiRef, props) {
   const maxDepth = (0, _gridColumnGroupsSelector.gridColumnGroupsHeaderMaxDepthSelector)(apiRef);
   const isHeaderFilteringEnabled = (0, _gridHeaderFilteringSelectors.gridHeaderFilteringEnabledSelector)(apiRef);
   const columnHeadersHeight = Math.floor(props.columnHeaderHeight * densityFactor);
+  const columnGroupHeadersHeight = Math.floor((props.columnGroupHeaderHeight ?? props.columnHeaderHeight) * densityFactor);
   const filterHeadersHeight = isHeaderFilteringEnabled ? Math.floor((props.headerFilterHeight ?? props.columnHeaderHeight) * densityFactor) : 0;
-  return columnHeadersHeight * (1 + (maxDepth ?? 0)) + filterHeadersHeight;
+  return columnHeadersHeight + columnGroupHeadersHeight * maxDepth + filterHeadersHeight;
 }

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v8.0.0-alpha.4
+ * @mui/x-data-grid v8.0.0-alpha.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/internals/utils/index.js

@@ -14,17 +14,6 @@ Object.keys(_computeSlots).forEach(function (key) {
     }
   });
 });
-var _useProps = require("./useProps");
-Object.keys(_useProps).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _useProps[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _useProps[key];
-    }
-  });
-});
 var _propValidation = require("./propValidation");
 Object.keys(_propValidation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/node/locales/koKR.js

@@ -30,16 +30,15 @@ const koKRGrid = {
   toolbarQuickFilterLabel: '검색',
   toolbarQuickFilterDeleteIconLabel: '초기화',
   // Prompt toolbar field
-  // toolbarPromptControlPlaceholder: 'Type a prompt…',
-  // toolbarPromptControlWithRecordingPlaceholder: 'Type or record a prompt…',
-  // toolbarPromptControlRecordingPlaceholder: 'Listening for prompt…',
-  // toolbarPromptControlLabel: 'Prompt input',
-  // toolbarPromptControlRecordButtonDefaultLabel: 'Record',
-  // toolbarPromptControlRecordButtonActiveLabel: 'Stop recording',
-  // toolbarPromptControlSendActionLabel: 'Send',
-  // toolbarPromptControlSendActionAriaLabel: 'Send prompt',
-  // toolbarPromptControlErrorMessage: 'An error occurred while processing the request. Please try again with a different prompt.',
-
+  toolbarPromptControlPlaceholder: '프롬프트 입력…',
+  toolbarPromptControlWithRecordingPlaceholder: '프롬프트 입력 또는 녹음…',
+  toolbarPromptControlRecordingPlaceholder: '녹음 중…',
+  toolbarPromptControlLabel: '프롬프트 입력',
+  toolbarPromptControlRecordButtonDefaultLabel: '녹음',
+  toolbarPromptControlRecordButtonActiveLabel: '녹음 정지',
+  toolbarPromptControlSendActionLabel: '전송',
+  toolbarPromptControlSendActionAriaLabel: '프롬프트 전송',
+  toolbarPromptControlErrorMessage: '요청을 처리하는 동안 오류가 발생했습니다. 다른 프롬프트로 다시 시도하십시오.',
   // Export selector toolbar button text
   toolbarExport: '내보내기',
   toolbarExportLabel: '내보내기',
@@ -47,15 +46,14 @@ const koKRGrid = {
   toolbarExportPrint: '프린트',
   toolbarExportExcel: 'Excel로 내보내기',
   // Columns management text
-  // columnsManagementSearchTitle: 'Search',
-  // columnsManagementNoColumns: 'No columns',
-  // columnsManagementShowHideAllText: 'Show/Hide All',
-  // columnsManagementReset: 'Reset',
-  // columnsManagementDeleteIconLabel: 'Clear',
-
+  columnsManagementSearchTitle: '검색',
+  columnsManagementNoColumns: '열이 없습니다.',
+  columnsManagementShowHideAllText: '모두 보기/숨기기',
+  columnsManagementReset: '초기화',
+  columnsManagementDeleteIconLabel: '제거',
   // Filter panel text
   filterPanelAddFilter: '필터 추가',
-  // filterPanelRemoveAll: 'Remove all',
+  filterPanelRemoveAll: '모두 삭제',
   filterPanelDeleteIconLabel: '삭제',
   filterPanelLogicOperator: '논리 연산자',
   filterPanelOperator: '연산자',
@@ -66,9 +64,9 @@ const koKRGrid = {
   filterPanelInputPlaceholder: '값 입력',
   // Filter operators text
   filterOperatorContains: '포함하는',
-  // filterOperatorDoesNotContain: 'does not contain',
+  filterOperatorDoesNotContain: '포함하지 않는',
   filterOperatorEquals: '값이 같은',
-  // filterOperatorDoesNotEqual: 'does not equal',
+  filterOperatorDoesNotEqual: '값이 다른',
   filterOperatorStartsWith: '시작하는',
   filterOperatorEndsWith: '끝나는',
   filterOperatorIs: '~인',
@@ -80,36 +78,34 @@ const koKRGrid = {
   filterOperatorIsEmpty: '값이 없는',
   filterOperatorIsNotEmpty: '값이 있는',
   filterOperatorIsAnyOf: '값 중 하나인',
-  // 'filterOperator=': '=',
-  // 'filterOperator!=': '!=',
-  // 'filterOperator>': '>',
-  // 'filterOperator>=': '>=',
-  // 'filterOperator<': '<',
-  // 'filterOperator<=': '<=',
-
+  'filterOperator=': '=',
+  'filterOperator!=': '!=',
+  'filterOperator>': '>',
+  'filterOperator>=': '>=',
+  'filterOperator<': '<',
+  'filterOperator<=': '<=',
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorDoesNotContain: 'Does not contain',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorDoesNotEqual: 'Does not equal',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
-  // headerFilterOperatorIs: 'Is',
-  // headerFilterOperatorNot: 'Is not',
-  // headerFilterOperatorAfter: 'Is after',
-  // headerFilterOperatorOnOrAfter: 'Is on or after',
-  // headerFilterOperatorBefore: 'Is before',
-  // headerFilterOperatorOnOrBefore: 'Is on or before',
-  // headerFilterOperatorIsEmpty: 'Is empty',
-  // headerFilterOperatorIsNotEmpty: 'Is not empty',
-  // headerFilterOperatorIsAnyOf: 'Is any of',
-  // 'headerFilterOperator=': 'Equals',
-  // 'headerFilterOperator!=': 'Not equals',
-  // 'headerFilterOperator>': 'Greater than',
-  // 'headerFilterOperator>=': 'Greater than or equal to',
-  // 'headerFilterOperator<': 'Less than',
-  // 'headerFilterOperator<=': 'Less than or equal to',
-
+  headerFilterOperatorContains: '포함하는',
+  headerFilterOperatorDoesNotContain: '포함하지 않는',
+  headerFilterOperatorEquals: '값이 같은',
+  headerFilterOperatorDoesNotEqual: '값이 다른',
+  headerFilterOperatorStartsWith: '시작하는',
+  headerFilterOperatorEndsWith: '끝나는',
+  headerFilterOperatorIs: '~인',
+  headerFilterOperatorNot: '~아닌',
+  headerFilterOperatorAfter: '더 이후',
+  headerFilterOperatorOnOrAfter: '이후',
+  headerFilterOperatorBefore: '더 이전',
+  headerFilterOperatorOnOrBefore: '이전',
+  headerFilterOperatorIsEmpty: '값이 없는',
+  headerFilterOperatorIsNotEmpty: '값이 있는',
+  headerFilterOperatorIsAnyOf: '값 중 하나인',
+  'headerFilterOperator=': '값이 같은',
+  'headerFilterOperator!=': '값이 다른',
+  'headerFilterOperator>': '더 큰',
+  'headerFilterOperator>=': '같거나 더 큰',
+  'headerFilterOperator<': '더 작은',
+  'headerFilterOperator<=': '같거나 더 작은',
   // Filter values text
   filterValueAny: '아무값',
   filterValueTrue: '참',
@@ -117,7 +113,7 @@ const koKRGrid = {
   // Column menu text
   columnMenuLabel: '메뉴',
   columnMenuShowColumns: '열 표시',
-  // columnMenuManageColumns: 'Manage columns',
+  columnMenuManageColumns: '열 관리',
   columnMenuFilter: '필터',
   columnMenuHideColumn: '열 숨기기',
   columnMenuUnsort: '정렬 해제',

package/node/material/index.js

@@ -1,14 +1,19 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
 var _Badge = _interopRequireDefault(require("@mui/material/Badge"));
 var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _Divider = _interopRequireDefault(require("@mui/material/Divider"));
+var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
+var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
 var _MenuList = _interopRequireDefault(require("@mui/material/MenuList"));
 var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
@@ -24,6 +29,8 @@ var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
 var _GridColumnUnsortedIcon = require("./icons/GridColumnUnsortedIcon");
 var _icons = require("./icons");
 var _MUISelectOption = _interopRequireDefault(require("./components/MUISelectOption"));
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["inert", "iconStart", "iconEnd", "children"];
 const iconSlots = {
   booleanCellTrueIcon: _icons.GridCheckIcon,
   booleanCellFalseIcon: _icons.GridCloseIcon,
@@ -61,12 +68,12 @@ const iconSlots = {
   filterPanelRemoveAllIcon: _icons.GridDeleteForeverIcon,
   columnReorderIcon: _icons.GridDragIcon
 };
-const materialSlots = (0, _extends2.default)({}, iconSlots, {
+const baseSlots = {
   baseBadge: _Badge.default,
   baseCheckbox: _Checkbox.default,
   baseDivider: _Divider.default,
   baseMenuList: _MenuList.default,
-  baseMenuItem: _MenuItem.default,
+  baseMenuItem: BaseMenuItem,
   baseTextField: _TextField.default,
   baseFormControl: _FormControl.default,
   baseSelect: _Select.default,
@@ -78,5 +85,25 @@ const materialSlots = (0, _extends2.default)({}, iconSlots, {
   baseInputLabel: _InputLabel.default,
   baseSelectOption: _MUISelectOption.default,
   baseChip: _Chip.default
-});
-var _default = exports.default = materialSlots;
+};
+const materialSlots = (0, _extends2.default)({}, baseSlots, iconSlots);
+var _default = exports.default = materialSlots;
+function BaseMenuItem(props) {
+  const {
+      inert,
+      iconStart,
+      iconEnd,
+      children
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  if (inert) {
+    other.disableRipple = true;
+  }
+  return /*#__PURE__*/React.createElement(_MenuItem.default, other, [iconStart && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
+    children: iconStart
+  }, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+    children: children
+  }, "2"), iconEnd && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
+    children: iconEnd
+  }, "3")]);
+}

package/node/models/gridBaseSlots.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "8.0.0-alpha.4",
+  "version": "8.0.0-alpha.5",
   "description": "The Community plan edition of the Data Grid components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -42,7 +42,7 @@
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "reselect": "^5.1.1",
-    "@mui/x-internals": "8.0.0-alpha.2"
+    "@mui/x-internals": "8.0.0-alpha.5"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/internals/utils/useProps.d.ts

@@ -1 +0,0 @@
-export declare function useProps<T extends Record<string, any>>(allProps: T): T;

package/internals/utils/useProps.js

@@ -1,24 +0,0 @@
-import * as React from 'react';
-
-/** Gathers props for the root element into a single `.forwardedProps` field */
-function groupForwardedProps(props) {
-  const keys = Object.keys(props);
-  if (!keys.some(key => key.startsWith('aria-') || key.startsWith('data-'))) {
-    return props;
-  }
-  const newProps = {};
-  const forwardedProps = props.forwardedProps ?? {};
-  for (let i = 0; i < keys.length; i += 1) {
-    const key = keys[i];
-    if (key.startsWith('aria-') || key.startsWith('data-')) {
-      forwardedProps[key] = props[key];
-    } else {
-      newProps[key] = props[key];
-    }
-  }
-  newProps.forwardedProps = forwardedProps;
-  return newProps;
-}
-export function useProps(allProps) {
-  return React.useMemo(() => groupForwardedProps(allProps), [allProps]);
-}

package/joy/icons.d.ts

@@ -1,32 +0,0 @@
-import { GridIconSlotsComponent } from '../models/gridIconSlotsComponent';
-export declare const GridArrowUpwardIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridArrowDownwardIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridKeyboardArrowLeft: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridKeyboardArrowRight: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridExpandMoreIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridFilterListIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridFilterAltIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSearchIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridMenuIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCheckCircleIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridColumnIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSeparatorIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewHeadlineIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridTableRowsIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewStreamIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridTripleDotsVerticalIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCloseIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridAddIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridRemoveIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridLoadIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDragIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSaveAltIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCheckIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridMoreVertIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridVisibilityOffIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewColumnIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridClearIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDeleteIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDeleteForeverIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-declare const joyIconSlots: GridIconSlotsComponent;
-export default joyIconSlots;