@mui/x-data-grid-pro 7.29.0 → 7.29.2

package/components/GridDataSourceTreeDataGroupingCell.js

@@ -1,22 +1,14 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridDataSourceTreeDataGroupingCell = GridDataSourceTreeDataGroupingCell;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _xDataGrid = require("@mui/x-data-grid");
-var _internals = require("@mui/x-data-grid/internals");
-var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
-var _useGridRootProps = require("../hooks/utils/useGridRootProps");
-var _useGridPrivateApiContext = require("../hooks/utils/useGridPrivateApiContext");
-var _gridDataSourceSelector = require("../hooks/features/dataSource/gridDataSourceSelector");
-var _jsxRuntime = require("react/jsx-runtime");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import composeClasses from '@mui/utils/composeClasses';
+import Box from '@mui/material/Box';
+import { getDataGridUtilityClass, useGridSelector } from '@mui/x-data-grid';
+import { useGridSelectorV8 } from '@mui/x-data-grid/internals';
+import CircularProgress from '@mui/material/CircularProgress';
+import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
+import { useGridPrivateApiContext } from "../hooks/utils/useGridPrivateApiContext.js";
+import { gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector } from "../hooks/features/dataSource/gridDataSourceSelector.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     classes
@@ -26,11 +18,11 @@ const useUtilityClasses = ownerState => {
     toggle: ['treeDataGroupingCellToggle'],
     loadingContainer: ['treeDataGroupingCellLoadingContainer']
   };
-  return (0, _composeClasses.default)(slots, _xDataGrid.getDataGridUtilityClass, classes);
+  return composeClasses(slots, getDataGridUtilityClass, classes);
 };
 function GridTreeDataGroupingCellIcon(props) {
-  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
-  const rootProps = (0, _useGridRootProps.useGridRootProps)();
+  const apiRef = useGridPrivateApiContext();
+  const rootProps = useGridRootProps();
   const classes = useUtilityClasses(rootProps);
   const {
     rowNode,
@@ -38,8 +30,8 @@ function GridTreeDataGroupingCellIcon(props) {
     field,
     descendantCount
   } = props;
-  const isDataLoading = (0, _internals.useGridSelectorV8)(apiRef, _gridDataSourceSelector.gridDataSourceLoadingIdSelector, id);
-  const error = (0, _internals.useGridSelectorV8)(apiRef, _gridDataSourceSelector.gridDataSourceErrorSelector, id);
+  const isDataLoading = useGridSelectorV8(apiRef, gridDataSourceLoadingIdSelector, id);
+  const error = useGridSelectorV8(apiRef, gridDataSourceErrorSelector, id);
   const handleClick = event => {
     if (!rowNode.childrenExpanded) {
       // always fetch/get from cache the children when the node is expanded
@@ -52,34 +44,34 @@ function GridTreeDataGroupingCellIcon(props) {
   };
   const Icon = rowNode.childrenExpanded ? rootProps.slots.treeDataCollapseIcon : rootProps.slots.treeDataExpandIcon;
   if (isDataLoading) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    return /*#__PURE__*/_jsx("div", {
       className: classes.loadingContainer,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
+      children: /*#__PURE__*/_jsx(CircularProgress, {
         size: "1rem",
         color: "inherit"
       })
     });
   }
-  return descendantCount === -1 || descendantCount > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
+  return descendantCount === -1 || descendantCount > 0 ? /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
     size: "small",
     onClick: handleClick,
     tabIndex: -1,
     "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')
   }, rootProps?.slotProps?.baseIconButton, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseTooltip, {
+    children: /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, {
       title: error?.message ?? null,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseBadge, {
+      children: /*#__PURE__*/_jsx(rootProps.slots.baseBadge, {
         variant: "dot",
         color: "error",
         invisible: !error,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
+        children: /*#__PURE__*/_jsx(Icon, {
           fontSize: "inherit"
         })
       })
     })
   })) : null;
 }
-function GridDataSourceTreeDataGroupingCell(props) {
+export function GridDataSourceTreeDataGroupingCell(props) {
   const {
     id,
     field,
@@ -88,30 +80,30 @@ function GridDataSourceTreeDataGroupingCell(props) {
     hideDescendantCount,
     offsetMultiplier = 2
   } = props;
-  const rootProps = (0, _useGridRootProps.useGridRootProps)();
-  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
+  const rootProps = useGridRootProps();
+  const apiRef = useGridPrivateApiContext();
   const rowSelector = state => state.rows.dataRowIdToModelLookup[id];
-  const row = (0, _xDataGrid.useGridSelector)(apiRef, rowSelector);
+  const row = useGridSelector(apiRef, rowSelector);
   const classes = useUtilityClasses(rootProps);
   let descendantCount = 0;
   if (row) {
     descendantCount = rootProps.unstable_dataSource?.getChildrenCount?.(row) ?? 0;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+  return /*#__PURE__*/_jsxs(Box, {
     className: classes.root,
     sx: {
       ml: rowNode.depth * offsetMultiplier
     },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: [/*#__PURE__*/_jsx("div", {
       className: classes.toggle,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(GridTreeDataGroupingCellIcon, {
+      children: /*#__PURE__*/_jsx(GridTreeDataGroupingCellIcon, {
         id: id,
         field: field,
         rowNode: rowNode,
         row: row,
         descendantCount: descendantCount
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+    }), /*#__PURE__*/_jsxs("span", {
       children: [formattedValue === undefined ? rowNode.groupingKey : formattedValue, !hideDescendantCount && descendantCount > 0 ? ` (${descendantCount})` : '']
     })]
   });

package/components/GridDetailPanel.js

@@ -1,17 +1,12 @@
-"use strict";
+'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridDetailPanel = GridDetailPanel;
-var React = _interopRequireWildcard(require("react"));
-var _styles = require("@mui/material/styles");
-var _useResizeObserver = require("@mui/x-internals/useResizeObserver");
-var _useGridRootProps = require("../hooks/utils/useGridRootProps");
-var _useGridPrivateApiContext = require("../hooks/utils/useGridPrivateApiContext");
-var _jsxRuntime = require("react/jsx-runtime");
-const DetailPanel = (0, _styles.styled)('div', {
+import * as React from 'react';
+import { styled } from '@mui/material/styles';
+import { useResizeObserver } from '@mui/x-internals/useResizeObserver';
+import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
+import { useGridPrivateApiContext } from "../hooks/utils/useGridPrivateApiContext.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const DetailPanel = styled('div', {
   name: 'MuiDataGrid',
   slot: 'DetailPanel',
   overridesResolver: (props, styles) => styles.detailPanel
@@ -29,9 +24,9 @@ function GridDetailPanel(props) {
     className,
     children
   } = props;
-  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
+  const apiRef = useGridPrivateApiContext();
   const ref = React.useRef(null);
-  const rootProps = (0, _useGridRootProps.useGridRootProps)();
+  const rootProps = useGridRootProps();
   const ownerState = rootProps;
   const hasAutoHeight = height === 'auto';
   React.useLayoutEffect(() => {
@@ -40,12 +35,12 @@ function GridDetailPanel(props) {
       apiRef.current.storeDetailPanelHeight(rowId, ref.current.clientHeight);
     }
   }, [apiRef, hasAutoHeight, rowId]);
-  (0, _useResizeObserver.useResizeObserver)(ref, entries => {
+  useResizeObserver(ref, entries => {
     const [entry] = entries;
     const observedHeight = entry.borderBoxSize && entry.borderBoxSize.length > 0 ? entry.borderBoxSize[0].blockSize : entry.contentRect.height;
     apiRef.current.storeDetailPanelHeight(rowId, observedHeight);
   }, hasAutoHeight);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(DetailPanel, {
+  return /*#__PURE__*/_jsx(DetailPanel, {
     ref: ref,
     ownerState: ownerState,
     role: "presentation",
@@ -55,4 +50,5 @@ function GridDetailPanel(props) {
     className: className,
     children: children
   });
-}
+}
+export { GridDetailPanel };

package/components/GridDetailPanelToggleCell.js

@@ -1,21 +1,13 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridDetailPanelToggleCell = GridDetailPanelToggleCell;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _xDataGrid = require("@mui/x-data-grid");
-var _internals = require("@mui/x-data-grid/internals");
-var _useGridRootProps = require("../hooks/utils/useGridRootProps");
-var _useGridApiContext = require("../hooks/utils/useGridApiContext");
-var _gridDetailPanelSelector = require("../hooks/features/detailPanel/gridDetailPanelSelector");
-var _jsxRuntime = require("react/jsx-runtime");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import composeClasses from '@mui/utils/composeClasses';
+import { getDataGridUtilityClass, useGridSelector } from '@mui/x-data-grid';
+import { createSelectorV8, useGridSelectorV8 } from '@mui/x-data-grid/internals';
+import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
+import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
+import { gridDetailPanelExpandedRowIdsSelector, gridDetailPanelExpandedRowsContentCacheSelector } from "../hooks/features/detailPanel/gridDetailPanelSelector.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -24,9 +16,9 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['detailPanelToggleCell', isExpanded && 'detailPanelToggleCell--expanded']
   };
-  return (0, _composeClasses.default)(slots, _xDataGrid.getDataGridUtilityClass, classes);
+  return composeClasses(slots, getDataGridUtilityClass, classes);
 };
-const isExpandedSelector = (0, _internals.createSelectorV8)(_gridDetailPanelSelector.gridDetailPanelExpandedRowIdsSelector, (expandedRowIds, rowId) => {
+const isExpandedSelector = createSelectorV8(gridDetailPanelExpandedRowIdsSelector, (expandedRowIds, rowId) => {
   return expandedRowIds.includes(rowId);
 });
 function GridDetailPanelToggleCell(props) {
@@ -36,27 +28,27 @@ function GridDetailPanelToggleCell(props) {
     api
   } = props;
   const rowId = api.getRowId(row);
-  const isExpanded = (0, _internals.useGridSelectorV8)({
+  const isExpanded = useGridSelectorV8({
     current: api
   }, isExpandedSelector, rowId);
-  const rootProps = (0, _useGridRootProps.useGridRootProps)();
-  const apiRef = (0, _useGridApiContext.useGridApiContext)();
+  const rootProps = useGridRootProps();
+  const apiRef = useGridApiContext();
   const ownerState = {
     classes: rootProps.classes,
     isExpanded
   };
   const classes = useUtilityClasses(ownerState);
-  const contentCache = (0, _xDataGrid.useGridSelector)(apiRef, _gridDetailPanelSelector.gridDetailPanelExpandedRowsContentCacheSelector);
+  const contentCache = useGridSelector(apiRef, gridDetailPanelExpandedRowsContentCacheSelector);
   const hasContent = /*#__PURE__*/React.isValidElement(contentCache[id]);
   const Icon = isExpanded ? rootProps.slots.detailPanelCollapseIcon : rootProps.slots.detailPanelExpandIcon;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
+  return /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
     size: "small",
     tabIndex: -1,
     disabled: !hasContent,
     className: classes.root,
     "aria-label": isExpanded ? apiRef.current.getLocaleText('collapseDetailPanel') : apiRef.current.getLocaleText('expandDetailPanel')
   }, rootProps.slotProps?.baseIconButton, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
+    children: /*#__PURE__*/_jsx(Icon, {
       fontSize: "inherit"
     })
   }));
@@ -69,60 +61,61 @@ process.env.NODE_ENV !== "production" ? GridDetailPanelToggleCell.propTypes = {
   /**
    * GridApi that let you manipulate the grid.
    */
-  api: _propTypes.default.object.isRequired,
+  api: PropTypes.object.isRequired,
   /**
    * The mode of the cell.
    */
-  cellMode: _propTypes.default.oneOf(['edit', 'view']).isRequired,
+  cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,
   /**
    * The column of the row that the current cell belongs to.
    */
-  colDef: _propTypes.default.object.isRequired,
+  colDef: PropTypes.object.isRequired,
   /**
    * The column field of the cell that triggered the event.
    */
-  field: _propTypes.default.string.isRequired,
+  field: PropTypes.string.isRequired,
   /**
    * A ref allowing to set imperative focus.
    * It can be passed to the element that should receive focus.
    * @ignore - do not document.
    */
-  focusElementRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.shape({
-      focus: _propTypes.default.func.isRequired
+  focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.shape({
+      focus: PropTypes.func.isRequired
     })
   })]),
   /**
    * The cell value formatted with the column valueFormatter.
    */
-  formattedValue: _propTypes.default.any,
+  formattedValue: PropTypes.any,
   /**
    * If true, the cell is the active element.
    */
-  hasFocus: _propTypes.default.bool.isRequired,
+  hasFocus: PropTypes.bool.isRequired,
   /**
    * The grid row id.
    */
-  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
   /**
    * If true, the cell is editable.
    */
-  isEditable: _propTypes.default.bool,
+  isEditable: PropTypes.bool,
   /**
    * The row model of the row that the current cell belongs to.
    */
-  row: _propTypes.default.any.isRequired,
+  row: PropTypes.any.isRequired,
   /**
    * The node of the row that the current cell belongs to.
    */
-  rowNode: _propTypes.default.object.isRequired,
+  rowNode: PropTypes.object.isRequired,
   /**
    * the tabIndex value.
    */
-  tabIndex: _propTypes.default.oneOf([-1, 0]).isRequired,
+  tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
   /**
    * The cell value.
    * If the column has `valueGetter`, use `params.row` to directly access the fields.
    */
-  value: _propTypes.default.any
-} : void 0;
+  value: PropTypes.any
+} : void 0;
+export { GridDetailPanelToggleCell };

package/components/GridDetailPanels.js

@@ -1,28 +1,22 @@
-"use strict";
+'use client';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridDetailPanels = GridDetailPanels;
-var React = _interopRequireWildcard(require("react"));
-var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _xDataGrid = require("@mui/x-data-grid");
-var _internals = require("@mui/x-data-grid/internals");
-var _useGridPrivateApiContext = require("../hooks/utils/useGridPrivateApiContext");
-var _useGridRootProps = require("../hooks/utils/useGridRootProps");
-var _detailPanel = require("../hooks/features/detailPanel");
-var _GridDetailPanel = require("./GridDetailPanel");
-var _jsxRuntime = require("react/jsx-runtime");
+import * as React from 'react';
+import composeClasses from '@mui/utils/composeClasses';
+import { getDataGridUtilityClass, useGridSelector } from '@mui/x-data-grid';
+import { EMPTY_DETAIL_PANELS } from '@mui/x-data-grid/internals';
+import { useGridPrivateApiContext } from "../hooks/utils/useGridPrivateApiContext.js";
+import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
+import { gridDetailPanelExpandedRowsContentCacheSelector, gridDetailPanelExpandedRowsHeightCacheSelector, gridDetailPanelExpandedRowIdsSelector } from "../hooks/features/detailPanel/index.js";
+import { GridDetailPanel } from "./GridDetailPanel.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = () => {
   const slots = {
     detailPanel: ['detailPanel']
   };
-  return (0, _composeClasses.default)(slots, _xDataGrid.getDataGridUtilityClass, {});
+  return composeClasses(slots, getDataGridUtilityClass, {});
 };
-function GridDetailPanels(props) {
-  const rootProps = (0, _useGridRootProps.useGridRootProps)();
+export function GridDetailPanels(props) {
+  const rootProps = useGridRootProps();
   if (!rootProps.getDetailPanelContent) {
     return null;
   }
@@ -31,14 +25,14 @@ function GridDetailPanels(props) {
 function GridDetailPanelsImpl({
   virtualScroller
 }) {
-  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
+  const apiRef = useGridPrivateApiContext();
   const classes = useUtilityClasses();
   const {
     setPanels
   } = virtualScroller;
-  const expandedRowIds = (0, _xDataGrid.useGridSelector)(apiRef, _detailPanel.gridDetailPanelExpandedRowIdsSelector);
-  const detailPanelsContent = (0, _xDataGrid.useGridSelector)(apiRef, _detailPanel.gridDetailPanelExpandedRowsContentCacheSelector);
-  const detailPanelsHeights = (0, _xDataGrid.useGridSelector)(apiRef, _detailPanel.gridDetailPanelExpandedRowsHeightCacheSelector);
+  const expandedRowIds = useGridSelector(apiRef, gridDetailPanelExpandedRowIdsSelector);
+  const detailPanelsContent = useGridSelector(apiRef, gridDetailPanelExpandedRowsContentCacheSelector);
+  const detailPanelsHeights = useGridSelector(apiRef, gridDetailPanelExpandedRowsHeightCacheSelector);
   const getDetailPanel = React.useCallback(rowId => {
     const content = detailPanelsContent[rowId];
 
@@ -50,7 +44,7 @@ function GridDetailPanelsImpl({
     }
     const hasAutoHeight = apiRef.current.detailPanelHasAutoHeight(rowId);
     const height = hasAutoHeight ? 'auto' : detailPanelsHeights[rowId];
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridDetailPanel.GridDetailPanel, {
+    return /*#__PURE__*/_jsx(GridDetailPanel, {
       rowId: rowId,
       height: height,
       className: classes.detailPanel,
@@ -59,7 +53,7 @@ function GridDetailPanelsImpl({
   }, [apiRef, classes.detailPanel, detailPanelsHeights, detailPanelsContent]);
   React.useEffect(() => {
     if (expandedRowIds.length === 0) {
-      setPanels(_internals.EMPTY_DETAIL_PANELS);
+      setPanels(EMPTY_DETAIL_PANELS);
     } else {
       setPanels(new Map(expandedRowIds.map(rowId => [rowId, getDetailPanel(rowId)])));
     }

package/components/GridPinnedRows.js

@@ -1,30 +1,22 @@
-"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.GridPinnedRows = GridPinnedRows;
-var React = _interopRequireWildcard(require("react"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _xDataGrid = require("@mui/x-data-grid");
-var _internals = require("@mui/x-data-grid/internals");
-var _jsxRuntime = require("react/jsx-runtime");
+import * as React from 'react';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { getDataGridUtilityClass, gridClasses, useGridSelector } from '@mui/x-data-grid';
+import { gridPinnedRowsSelector, useGridPrivateApiContext } from '@mui/x-data-grid/internals';
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = () => {
   const slots = {
     root: ['pinnedRows']
   };
-  return (0, _composeClasses.default)(slots, _xDataGrid.getDataGridUtilityClass, {});
+  return composeClasses(slots, getDataGridUtilityClass, {});
 };
-function GridPinnedRows({
+export function GridPinnedRows({
   position,
   virtualScroller
 }) {
   const classes = useUtilityClasses();
-  const apiRef = (0, _internals.useGridPrivateApiContext)();
-  const pinnedRowsData = (0, _xDataGrid.useGridSelector)(apiRef, _internals.gridPinnedRowsSelector);
+  const apiRef = useGridPrivateApiContext();
+  const pinnedRowsData = useGridSelector(apiRef, gridPinnedRowsSelector);
   const rows = pinnedRowsData[position];
   const pinnedRenderContext = React.useMemo(() => ({
     firstRowIndex: 0,
@@ -40,8 +32,8 @@ function GridPinnedRows({
     rows,
     renderContext: pinnedRenderContext
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _clsx.default)(classes.root, _xDataGrid.gridClasses[`pinnedRows--${position}`]),
+  return /*#__PURE__*/_jsx("div", {
+    className: clsx(classes.root, gridClasses[`pinnedRows--${position}`]),
     role: "presentation",
     children: pinnedRows
   });

package/components/GridProColumnMenu.js

@@ -1,27 +1,19 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { GridGenericColumnMenu, GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS } from '@mui/x-data-grid';
+import { forwardRef } from '@mui/x-internals/forwardRef';
+import { GridColumnMenuPinningItem } from "./GridColumnMenuPinningItem.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const GRID_COLUMN_MENU_SLOTS_PRO = _extends({}, GRID_COLUMN_MENU_SLOTS, {
+  columnMenuPinningItem: GridColumnMenuPinningItem
 });
-exports.GridProColumnMenu = exports.GRID_COLUMN_MENU_SLOT_PROPS_PRO = exports.GRID_COLUMN_MENU_SLOTS_PRO = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _xDataGrid = require("@mui/x-data-grid");
-var _forwardRef = require("@mui/x-internals/forwardRef");
-var _GridColumnMenuPinningItem = require("./GridColumnMenuPinningItem");
-var _jsxRuntime = require("react/jsx-runtime");
-const GRID_COLUMN_MENU_SLOTS_PRO = exports.GRID_COLUMN_MENU_SLOTS_PRO = (0, _extends2.default)({}, _xDataGrid.GRID_COLUMN_MENU_SLOTS, {
-  columnMenuPinningItem: _GridColumnMenuPinningItem.GridColumnMenuPinningItem
-});
-const GRID_COLUMN_MENU_SLOT_PROPS_PRO = exports.GRID_COLUMN_MENU_SLOT_PROPS_PRO = (0, _extends2.default)({}, _xDataGrid.GRID_COLUMN_MENU_SLOT_PROPS, {
+export const GRID_COLUMN_MENU_SLOT_PROPS_PRO = _extends({}, GRID_COLUMN_MENU_SLOT_PROPS, {
   columnMenuPinningItem: {
     displayOrder: 15
   }
 });
-const GridProColumnMenu = exports.GridProColumnMenu = (0, _forwardRef.forwardRef)(function GridProColumnMenu(props, ref) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDataGrid.GridGenericColumnMenu, (0, _extends2.default)({}, props, {
+export const GridProColumnMenu = forwardRef(function GridProColumnMenu(props, ref) {
+  return /*#__PURE__*/_jsx(GridGenericColumnMenu, _extends({}, props, {
     defaultSlots: GRID_COLUMN_MENU_SLOTS_PRO,
     defaultSlotProps: GRID_COLUMN_MENU_SLOT_PROPS_PRO,
     ref: ref