@mui/x-data-grid 7.0.0-alpha.8 → 7.0.0-alpha.9

package/legacy/components/columnHeaders/GridColumnHeaderItem.js

@@ -3,6 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses, unstable_useId as useId } from '@mui/utils';
+import { fastMemo } from '../../utils/fastMemo';
 import { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';
 import { GridColumnHeaderSortIcon } from './GridColumnHeaderSortIcon';
 import { ColumnHeaderMenuIcon } from './ColumnHeaderMenuIcon';
@@ -135,14 +136,16 @@ function GridColumnHeaderItem(props) {
     onExited: handleExited
   });
   var sortingOrder = (_colDef$sortingOrder = colDef.sortingOrder) != null ? _colDef$sortingOrder : rootProps.sortingOrder;
+  var showSortIcon = (colDef.sortable || sortDirection != null) && !colDef.hideSortIcons && !rootProps.disableColumnSorting;
   var columnTitleIconButtons = /*#__PURE__*/_jsxs(React.Fragment, {
     children: [!rootProps.disableColumnFilter && /*#__PURE__*/_jsx(rootProps.slots.columnHeaderFilterIconButton, _extends({
       field: colDef.field,
       counter: filterItemsCounter
-    }, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.columnHeaderFilterIconButton)), colDef.sortable && !colDef.hideSortIcons && /*#__PURE__*/_jsx(GridColumnHeaderSortIcon, {
+    }, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.columnHeaderFilterIconButton)), showSortIcon && /*#__PURE__*/_jsx(GridColumnHeaderSortIcon, {
       direction: sortDirection,
       index: sortIndex,
-      sortingOrder: sortingOrder
+      sortingOrder: sortingOrder,
+      disabled: !colDef.sortable
     })]
   });
   React.useLayoutEffect(function () {
@@ -205,4 +208,5 @@ process.env.NODE_ENV !== "production" ? GridColumnHeaderItem.propTypes = {
   sortIndex: PropTypes.number,
   tabIndex: PropTypes.oneOf([-1, 0]).isRequired
 } : void 0;
-export { GridColumnHeaderItem };
+var Memoized = fastMemo(GridColumnHeaderItem);
+export { Memoized as GridColumnHeaderItem };

package/legacy/components/columnHeaders/GridColumnHeaderSortIcon.js

@@ -36,7 +36,8 @@ function GridColumnHeaderSortIconRaw(props) {
   var _rootProps$slotProps;
   var direction = props.direction,
     index = props.index,
-    sortingOrder = props.sortingOrder;
+    sortingOrder = props.sortingOrder,
+    disabled = props.disabled;
   var apiRef = useGridApiContext();
   var rootProps = useGridRootProps();
   var ownerState = _extends({}, props, {
@@ -51,7 +52,8 @@ function GridColumnHeaderSortIconRaw(props) {
     tabIndex: -1,
     "aria-label": apiRef.current.getLocaleText('columnHeaderSortIconLabel'),
     title: apiRef.current.getLocaleText('columnHeaderSortIconLabel'),
-    size: "small"
+    size: "small",
+    disabled: disabled
   }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {
     children: iconElement
   }));
@@ -70,6 +72,7 @@ process.env.NODE_ENV !== "production" ? GridColumnHeaderSortIconRaw.propTypes =
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   direction: PropTypes.oneOf(['asc', 'desc']),
+  disabled: PropTypes.bool,
   index: PropTypes.number,
   sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])).isRequired
 } : void 0;

package/legacy/components/columnHeaders/GridColumnHeadersInner.js

@@ -37,7 +37,6 @@ var GridColumnHeadersInnerRoot = styled('div', {
   });
 });
 export var GridColumnHeadersInner = /*#__PURE__*/React.forwardRef(function GridColumnHeadersInner(props, ref) {
-  var _apiRef$current$getRo, _apiRef$current$getRo2;
   var isDragging = props.isDragging,
     className = props.className,
     other = _objectWithoutProperties(props, _excluded);
@@ -45,7 +44,7 @@ export var GridColumnHeadersInner = /*#__PURE__*/React.forwardRef(function GridC
   var rootProps = useGridRootProps();
   var ownerState = _extends({}, rootProps, {
     isDragging: isDragging,
-    hasScrollX: (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.hasScrollX) != null ? _apiRef$current$getRo : false
+    hasScrollX: apiRef.current.getRootDimensions().hasScrollX
   });
   var classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(GridColumnHeadersInnerRoot, _extends({

package/legacy/components/containers/GridRoot.js

@@ -6,43 +6,43 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_capitalize as capitalize, unstable_composeClasses as composeClasses } from '@mui/utils';
+import { styled } from '@mui/system';
 import { GridRootStyles } from './GridRootStyles';
 import { useGridSelector } from '../../hooks/utils/useGridSelector';
 import { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';
 import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
 import { getDataGridUtilityClass } from '../../constants/gridClasses';
 import { gridDensityValueSelector } from '../../hooks/features/density/densitySelector';
-import { useGridAriaAttributes } from '../../hooks/utils/useGridAriaAttributes';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var autoHeight = ownerState.autoHeight,
     density = ownerState.density,
-    classes = ownerState.classes;
+    classes = ownerState.classes,
+    showCellVerticalBorder = ownerState.showCellVerticalBorder;
   var slots = {
-    root: ['root', autoHeight && 'autoHeight', "root--density".concat(capitalize(density)), 'withBorderColor']
+    root: ['root', autoHeight && 'autoHeight', "root--density".concat(capitalize(density)), 'withBorderColor', showCellVerticalBorder && 'withVerticalBorder']
   };
   return composeClasses(slots, getDataGridUtilityClass, classes);
 };
+var GridPanelAnchor = styled('div')({
+  position: 'absolute',
+  top: "var(--DataGrid-headersTotalHeight)",
+  left: 0
+});
 var GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
-  var _rootProps$experiment;
   var rootProps = useGridRootProps();
   var children = props.children,
     className = props.className,
     other = _objectWithoutProperties(props, _excluded);
   var apiRef = useGridPrivateApiContext();
   var densityValue = useGridSelector(apiRef, gridDensityValueSelector);
-  var rootContainerRef = React.useRef(null);
-  var handleRef = useForkRef(rootContainerRef, ref);
-  var getAriaAttributes = (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.ariaV7 // ariaV7 should never change
-  ? null : useGridAriaAttributes;
-  var ariaAttributes = typeof getAriaAttributes === 'function' ? getAriaAttributes() : null;
+  var rootElementRef = apiRef.current.rootElementRef;
+  var handleRef = useForkRef(rootElementRef, ref);
   var ownerState = _extends({}, rootProps, {
     density: densityValue
   });
   var classes = useUtilityClasses(ownerState);
-  apiRef.current.register('public', {
-    rootElementRef: rootContainerRef
-  });
 
   // Our implementation of <NoSsr />
   var _React$useState = React.useState(false),
@@ -55,12 +55,15 @@ var GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {
   if (!mountedState) {
     return null;
   }
-  return /*#__PURE__*/_jsx(GridRootStyles, _extends({
+  return /*#__PURE__*/_jsxs(GridRootStyles, _extends({
     ref: handleRef,
     className: clsx(className, classes.root),
     ownerState: ownerState
-  }, ariaAttributes, other, {
-    children: children
+  }, other, {
+    children: [/*#__PURE__*/_jsx(GridPanelAnchor, {
+      role: "presentation",
+      "data-id": "gridPanelAnchor"
+    }), children]
   }));
 });
 process.env.NODE_ENV !== "production" ? GridRoot.propTypes = {