@mui/x-data-grid 6.5.0 → 6.7.0

package/node/locales/trTR.js

@@ -66,18 +66,17 @@ const trTRGrid = {
   filterOperatorIsEmpty: 'boş',
   filterOperatorIsNotEmpty: 'dolu',
   filterOperatorIsAnyOf: 'herhangi biri',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
-
+  'filterOperator=': '=',
+  'filterOperator!=': '!=',
+  'filterOperator>': '>',
+  'filterOperator>=': '>=',
+  'filterOperator<': '<',
+  'filterOperator<=': '<=',
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
+  headerFilterOperatorContains: 'Şunu içerir',
+  headerFilterOperatorEquals: 'Şuna eşittir',
+  headerFilterOperatorStartsWith: 'Şununla başlar',
+  headerFilterOperatorEndsWith: 'Şununla biter',
   // headerFilterOperatorIs: 'Is',
   // headerFilterOperatorNot: 'Is not',
   // headerFilterOperatorAfter: 'Is after',
@@ -87,12 +86,12 @@ const trTRGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: 'herhangi',
@@ -102,9 +101,9 @@ const trTRGrid = {
   columnMenuLabel: 'Menü',
   columnMenuShowColumns: 'Sütunları göster',
   columnMenuManageColumns: 'Sütunları yönet',
-  columnMenuFilter: 'Filtre uygula',
+  columnMenuFilter: 'Filtre Ekle',
   columnMenuHideColumn: 'Gizle',
-  columnMenuUnsort: 'Sıralama',
+  columnMenuUnsort: 'Varsayılan Sıralama',
   columnMenuSortAsc: 'Sırala - Artan',
   columnMenuSortDesc: 'Sırala - Azalan',
   // Column header text

package/node/locales/ukUA.js

@@ -80,12 +80,12 @@ const ukUAGrid = {
   filterOperatorIsEmpty: 'порожній',
   filterOperatorIsNotEmpty: 'не порожній',
   filterOperatorIsAnyOf: 'будь-що із',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
+  // 'filterOperator=': '=',
+  // 'filterOperator!=': '!=',
+  // 'filterOperator>': '>',
+  // 'filterOperator>=': '>=',
+  // 'filterOperator<': '<',
+  // 'filterOperator<=': '<=',
 
   // Header filter operators text
   // headerFilterOperatorContains: 'Contains',
@@ -101,12 +101,12 @@ const ukUAGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: 'будь-який',

package/node/locales/urPK.js

@@ -66,12 +66,12 @@ const urPKGrid = {
   filterOperatorIsEmpty: 'خالی ہے',
   filterOperatorIsNotEmpty: 'خالی نہیں ہے',
   filterOperatorIsAnyOf: 'ان میں سے کوئی ہے',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
+  // 'filterOperator=': '=',
+  // 'filterOperator!=': '!=',
+  // 'filterOperator>': '>',
+  // 'filterOperator>=': '>=',
+  // 'filterOperator<': '<',
+  // 'filterOperator<=': '<=',
 
   // Header filter operators text
   // headerFilterOperatorContains: 'Contains',
@@ -87,12 +87,12 @@ const urPKGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: 'کوئی بھی',

package/node/locales/viVN.js

@@ -66,12 +66,12 @@ const viVNGrid = {
   filterOperatorIsEmpty: 'Rỗng',
   filterOperatorIsNotEmpty: 'Khác rỗng',
   // filterOperatorIsAnyOf: 'is any of',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
+  // 'filterOperator=': '=',
+  // 'filterOperator!=': '!=',
+  // 'filterOperator>': '>',
+  // 'filterOperator>=': '>=',
+  // 'filterOperator<': '<',
+  // 'filterOperator<=': '<=',
 
   // Header filter operators text
   // headerFilterOperatorContains: 'Contains',
@@ -87,12 +87,12 @@ const viVNGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: 'bất kỳ giá trị nào',

package/node/locales/zhCN.js

@@ -66,12 +66,12 @@ const zhCNGrid = {
   filterOperatorIsEmpty: '为空',
   filterOperatorIsNotEmpty: '不为空',
   filterOperatorIsAnyOf: '属于',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
+  // 'filterOperator=': '=',
+  // 'filterOperator!=': '!=',
+  // 'filterOperator>': '>',
+  // 'filterOperator>=': '>=',
+  // 'filterOperator<': '<',
+  // 'filterOperator<=': '<=',
 
   // Header filter operators text
   // headerFilterOperatorContains: 'Contains',
@@ -87,12 +87,12 @@ const zhCNGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: '任何',

package/node/locales/zhTW.js

@@ -66,12 +66,12 @@ const zhTWGrid = {
   filterOperatorIsEmpty: '為空',
   filterOperatorIsNotEmpty: '不為空',
   filterOperatorIsAnyOf: '是其中之一',
-  // filterOperator=: '=',
-  // filterOperator!=: '!=',
-  // filterOperator>: '>',
-  // filterOperator>=: '>=',
-  // filterOperator<: '<',
-  // filterOperator<=: '<=',
+  // 'filterOperator=': '=',
+  // 'filterOperator!=': '!=',
+  // 'filterOperator>': '>',
+  // 'filterOperator>=': '>=',
+  // 'filterOperator<': '<',
+  // 'filterOperator<=': '<=',
 
   // Header filter operators text
   // headerFilterOperatorContains: 'Contains',
@@ -87,12 +87,12 @@ const zhTWGrid = {
   // headerFilterOperatorIsEmpty: 'Is empty',
   // headerFilterOperatorIsNotEmpty: 'Is not empty',
   // headerFilterOperatorIsAnyOf: 'Is any of',
-  // headerFilterOperator=: 'Equals',
-  // headerFilterOperator!=: 'Not equals',
-  // headerFilterOperator>: 'Is greater than',
-  // headerFilterOperator>=: 'Is greater than or equal to',
-  // headerFilterOperator<: 'Is less than',
-  // headerFilterOperator<=: 'Is less than or equal to',
+  // 'headerFilterOperator=': 'Equals',
+  // 'headerFilterOperator!=': 'Not equals',
+  // 'headerFilterOperator>': 'Greater than',
+  // 'headerFilterOperator>=': 'Greater than or equal to',
+  // 'headerFilterOperator<': 'Less than',
+  // 'headerFilterOperator<=': 'Less than or equal to',
 
   // Filter values text
   filterValueAny: '任何值',

package/node/models/gridFilterItem.js

@@ -7,7 +7,7 @@ exports.GridLogicOperator = void 0;
 /**
  * Filter item definition interface.
  * @demos
- *   - [Custom filter operator](/x/react-data-grid/filtering/#create-a-custom-operator)
+ *   - [Custom filter operator](/x/react-data-grid/filtering/customization/#create-a-custom-operator)
  */
 var GridLogicOperator = /*#__PURE__*/function (GridLogicOperator) {
   GridLogicOperator["And"] = "and";

package/node/utils/EventManager.js

@@ -9,7 +9,7 @@ exports.EventManager = void 0;
 // the Node.js (https://nodejs.org/api/events.html) polyfill used by webpack.
 class EventManager {
   constructor() {
-    this.maxListeners = 10;
+    this.maxListeners = 20;
     this.warnOnce = false;
     this.events = {};
   }
@@ -31,7 +31,7 @@ class EventManager {
       const collectionSize = collection.highPriority.size + collection.regular.size;
       if (collectionSize > this.maxListeners && !this.warnOnce) {
         this.warnOnce = true;
-        console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`, `Use emitter.setMaxListeners() to increase limit.`].join('\n'));
+        console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`].join('\n'));
       }
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "6.5.0",
+  "version": "6.7.0",
   "description": "The community edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.21.0",
-    "@mui/utils": "^5.12.3",
+    "@mui/utils": "^5.13.1",
     "clsx": "^1.2.1",
     "prop-types": "^15.8.1",
     "reselect": "^4.1.8"
@@ -44,8 +44,8 @@
   "peerDependencies": {
     "@mui/material": "^5.4.1",
     "@mui/system": "^5.4.1",
-    "react": "^17.0.2 || ^18.0.0",
-    "react-dom": "^17.0.2 || ^18.0.0"
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
   },
   "setupFiles": [
     "<rootDir>/src/setupTests.js"

package/themeAugmentation/overrides.d.ts

@@ -2,7 +2,7 @@ import { GridClassKey } from '../constants/gridClasses';
 export interface DataGridComponentNameToClassKey {
     MuiDataGrid: GridClassKey;
 }
-declare module '@mui/material/styles/overrides' {
+declare module '@mui/material/styles' {
     interface ComponentNameToClassKey extends DataGridComponentNameToClassKey {
     }
 }

package/utils/EventManager.js

@@ -3,7 +3,7 @@
 // the Node.js (https://nodejs.org/api/events.html) polyfill used by webpack.
 export class EventManager {
   constructor() {
-    this.maxListeners = 10;
+    this.maxListeners = 20;
     this.warnOnce = false;
     this.events = {};
   }
@@ -25,7 +25,7 @@ export class EventManager {
       const collectionSize = collection.highPriority.size + collection.regular.size;
       if (collectionSize > this.maxListeners && !this.warnOnce) {
         this.warnOnce = true;
-        console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`, `Use emitter.setMaxListeners() to increase limit.`].join('\n'));
+        console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`].join('\n'));
       }
     }
   }

package/components/GridScrollArea.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-interface ScrollAreaProps {
-    scrollDirection: 'left' | 'right';
-}
-declare function GridScrollAreaRaw(props: ScrollAreaProps): JSX.Element | null;
-declare namespace GridScrollAreaRaw {
-    var propTypes: any;
-}
-declare const GridScrollArea: React.MemoExoticComponent<typeof GridScrollAreaRaw>;
-export { GridScrollArea };

package/components/GridScrollArea.js

@@ -1,117 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
-import { styled } from '@mui/system';
-import { useGridApiEventHandler } from '../hooks/utils/useGridApiEventHandler';
-import { useGridApiContext } from '../hooks/utils/useGridApiContext';
-import { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';
-import { useGridRootProps } from '../hooks/utils/useGridRootProps';
-import { gridDensityFactorSelector } from '../hooks/features/density/densitySelector';
-import { useGridSelector } from '../hooks/utils/useGridSelector';
-import { jsx as _jsx } from "react/jsx-runtime";
-const CLIFF = 1;
-const SLOP = 1.5;
-const useUtilityClasses = ownerState => {
-  const {
-    scrollDirection,
-    classes
-  } = ownerState;
-  const slots = {
-    root: ['scrollArea', `scrollArea--${scrollDirection}`]
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-const GridScrollAreaRawRoot = styled('div', {
-  name: 'MuiDataGrid',
-  slot: 'ScrollArea',
-  overridesResolver: (props, styles) => [{
-    [`&.${gridClasses['scrollArea--left']}`]: styles['scrollArea--left']
-  }, {
-    [`&.${gridClasses['scrollArea--right']}`]: styles['scrollArea--right']
-  }, styles.scrollArea]
-})(() => ({
-  position: 'absolute',
-  top: 0,
-  zIndex: 101,
-  width: 20,
-  bottom: 0,
-  [`&.${gridClasses['scrollArea--left']}`]: {
-    left: 0
-  },
-  [`&.${gridClasses['scrollArea--right']}`]: {
-    right: 0
-  }
-}));
-function GridScrollAreaRaw(props) {
-  const {
-    scrollDirection
-  } = props;
-  const rootRef = React.useRef(null);
-  const apiRef = useGridApiContext();
-  const timeout = React.useRef();
-  const [dragging, setDragging] = React.useState(false);
-  const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
-  const scrollPosition = React.useRef({
-    left: 0,
-    top: 0
-  });
-  const rootProps = useGridRootProps();
-  const ownerState = _extends({}, rootProps, {
-    scrollDirection
-  });
-  const classes = useUtilityClasses(ownerState);
-  const headerHeight = Math.floor(rootProps.columnHeaderHeight * densityFactor);
-  const handleScrolling = React.useCallback(newScrollPosition => {
-    scrollPosition.current = newScrollPosition;
-  }, []);
-  const handleDragOver = React.useCallback(event => {
-    let offset;
-    if (scrollDirection === 'left') {
-      offset = event.clientX - rootRef.current.getBoundingClientRect().right;
-    } else if (scrollDirection === 'right') {
-      offset = Math.max(1, event.clientX - rootRef.current.getBoundingClientRect().left);
-    } else {
-      throw new Error('MUI: Wrong drag direction');
-    }
-    offset = (offset - CLIFF) * SLOP + CLIFF;
-    clearTimeout(timeout.current);
-    // Avoid freeze and inertia.
-    timeout.current = setTimeout(() => {
-      apiRef.current.scroll({
-        left: scrollPosition.current.left + offset,
-        top: scrollPosition.current.top
-      });
-    });
-  }, [scrollDirection, apiRef]);
-  React.useEffect(() => {
-    return () => {
-      clearTimeout(timeout.current);
-    };
-  }, []);
-  const toggleDragging = React.useCallback(() => {
-    setDragging(prevDragging => !prevDragging);
-  }, []);
-  useGridApiEventHandler(apiRef, 'scrollPositionChange', handleScrolling);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragStart', toggleDragging);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', toggleDragging);
-  return dragging ? /*#__PURE__*/_jsx(GridScrollAreaRawRoot, {
-    ref: rootRef,
-    className: clsx(classes.root),
-    ownerState: ownerState,
-    onDragOver: handleDragOver,
-    style: {
-      height: headerHeight
-    }
-  }) : null;
-}
-process.env.NODE_ENV !== "production" ? GridScrollAreaRaw.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-  scrollDirection: PropTypes.oneOf(['left', 'right']).isRequired
-} : void 0;
-const GridScrollArea = /*#__PURE__*/React.memo(GridScrollAreaRaw);
-export { GridScrollArea };

package/legacy/components/GridScrollArea.js

@@ -1,119 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
-import { styled } from '@mui/system';
-import { useGridApiEventHandler } from '../hooks/utils/useGridApiEventHandler';
-import { useGridApiContext } from '../hooks/utils/useGridApiContext';
-import { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';
-import { useGridRootProps } from '../hooks/utils/useGridRootProps';
-import { gridDensityFactorSelector } from '../hooks/features/density/densitySelector';
-import { useGridSelector } from '../hooks/utils/useGridSelector';
-import { jsx as _jsx } from "react/jsx-runtime";
-var CLIFF = 1;
-var SLOP = 1.5;
-var useUtilityClasses = function useUtilityClasses(ownerState) {
-  var scrollDirection = ownerState.scrollDirection,
-    classes = ownerState.classes;
-  var slots = {
-    root: ['scrollArea', "scrollArea--".concat(scrollDirection)]
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-var GridScrollAreaRawRoot = styled('div', {
-  name: 'MuiDataGrid',
-  slot: 'ScrollArea',
-  overridesResolver: function overridesResolver(props, styles) {
-    return [_defineProperty({}, "&.".concat(gridClasses['scrollArea--left']), styles['scrollArea--left']), _defineProperty({}, "&.".concat(gridClasses['scrollArea--right']), styles['scrollArea--right']), styles.scrollArea];
-  }
-})(function () {
-  var _ref3;
-  return _ref3 = {
-    position: 'absolute',
-    top: 0,
-    zIndex: 101,
-    width: 20,
-    bottom: 0
-  }, _defineProperty(_ref3, "&.".concat(gridClasses['scrollArea--left']), {
-    left: 0
-  }), _defineProperty(_ref3, "&.".concat(gridClasses['scrollArea--right']), {
-    right: 0
-  }), _ref3;
-});
-function GridScrollAreaRaw(props) {
-  var scrollDirection = props.scrollDirection;
-  var rootRef = React.useRef(null);
-  var apiRef = useGridApiContext();
-  var timeout = React.useRef();
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    dragging = _React$useState2[0],
-    setDragging = _React$useState2[1];
-  var densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
-  var scrollPosition = React.useRef({
-    left: 0,
-    top: 0
-  });
-  var rootProps = useGridRootProps();
-  var ownerState = _extends({}, rootProps, {
-    scrollDirection: scrollDirection
-  });
-  var classes = useUtilityClasses(ownerState);
-  var headerHeight = Math.floor(rootProps.columnHeaderHeight * densityFactor);
-  var handleScrolling = React.useCallback(function (newScrollPosition) {
-    scrollPosition.current = newScrollPosition;
-  }, []);
-  var handleDragOver = React.useCallback(function (event) {
-    var offset;
-    if (scrollDirection === 'left') {
-      offset = event.clientX - rootRef.current.getBoundingClientRect().right;
-    } else if (scrollDirection === 'right') {
-      offset = Math.max(1, event.clientX - rootRef.current.getBoundingClientRect().left);
-    } else {
-      throw new Error('MUI: Wrong drag direction');
-    }
-    offset = (offset - CLIFF) * SLOP + CLIFF;
-    clearTimeout(timeout.current);
-    // Avoid freeze and inertia.
-    timeout.current = setTimeout(function () {
-      apiRef.current.scroll({
-        left: scrollPosition.current.left + offset,
-        top: scrollPosition.current.top
-      });
-    });
-  }, [scrollDirection, apiRef]);
-  React.useEffect(function () {
-    return function () {
-      clearTimeout(timeout.current);
-    };
-  }, []);
-  var toggleDragging = React.useCallback(function () {
-    setDragging(function (prevDragging) {
-      return !prevDragging;
-    });
-  }, []);
-  useGridApiEventHandler(apiRef, 'scrollPositionChange', handleScrolling);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragStart', toggleDragging);
-  useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', toggleDragging);
-  return dragging ? /*#__PURE__*/_jsx(GridScrollAreaRawRoot, {
-    ref: rootRef,
-    className: clsx(classes.root),
-    ownerState: ownerState,
-    onDragOver: handleDragOver,
-    style: {
-      height: headerHeight
-    }
-  }) : null;
-}
-process.env.NODE_ENV !== "production" ? GridScrollAreaRaw.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-  scrollDirection: PropTypes.oneOf(['left', 'right']).isRequired
-} : void 0;
-var GridScrollArea = /*#__PURE__*/React.memo(GridScrollAreaRaw);
-export { GridScrollArea };