@mui/x-data-grid-pro 8.0.0-beta.3 → 8.1.0

package/modern/DataGridPro/index.d.ts

@@ -1,3 +0,0 @@
-export * from "./DataGrid.js";
-export * from "./DataGridPro.js";
-export { DATA_GRID_PRO_PROPS_DEFAULT_VALUES } from "./useDataGridProProps.js";

package/modern/DataGridPro/index.js

@@ -1,3 +0,0 @@
-export * from "./DataGrid.js";
-export * from "./DataGridPro.js";
-export { DATA_GRID_PRO_PROPS_DEFAULT_VALUES } from "./useDataGridProProps.js";

package/modern/DataGridPro/useDataGridProComponent.d.ts

@@ -1,4 +0,0 @@
-import { RefObject } from '@mui/x-internals/types';
-import { GridApiPro, GridPrivateApiPro } from "../models/gridApiPro.js";
-import { DataGridProProcessedProps } from "../models/dataGridProProps.js";
-export declare const useDataGridProComponent: (inputApiRef: RefObject<GridApiPro | null> | undefined, props: DataGridProProcessedProps) => import("react").RefObject<GridPrivateApiPro>;

package/modern/DataGridPro/useDataGridProComponent.js

@@ -1,105 +0,0 @@
-import { useGridInitialization, useGridInitializeState, useGridClipboard, useGridColumnMenu, useGridColumns, columnsStateInitializer, useGridDensity, useGridCsvExport, useGridPrintExport, useGridFilter, filterStateInitializer, useGridFocus, useGridKeyboardNavigation, useGridPagination, paginationStateInitializer, useGridPreferencesPanel, useGridEditing, editingStateInitializer, useGridRows, useGridRowsPreProcessors, rowsStateInitializer, useGridRowsMeta, useGridParamsApi, useGridRowSelection, useGridSorting, sortingStateInitializer, useGridScroll, useGridEvents, dimensionsStateInitializer, useGridDimensions, useGridStatePersistence, useGridRowSelectionPreProcessors, useGridColumnSpanning, columnMenuStateInitializer, densityStateInitializer, focusStateInitializer, preferencePanelStateInitializer, rowsMetaStateInitializer, rowSelectionStateInitializer, useGridColumnGrouping, columnGroupsStateInitializer, headerFilteringStateInitializer, useGridHeaderFiltering, virtualizationStateInitializer, useGridVirtualization, useGridColumnResize, columnResizeStateInitializer, useGridRowSpanning, rowSpanningStateInitializer, useGridListView, listViewStateInitializer, propsStateInitializer } from '@mui/x-data-grid/internals';
-// Pro-only features
-import { useGridInfiniteLoader } from "../hooks/features/infiniteLoader/useGridInfiniteLoader.js";
-import { useGridColumnReorder, columnReorderStateInitializer } from "../hooks/features/columnReorder/useGridColumnReorder.js";
-import { useGridTreeData } from "../hooks/features/treeData/useGridTreeData.js";
-import { useGridTreeDataPreProcessors } from "../hooks/features/treeData/useGridTreeDataPreProcessors.js";
-import { useGridDataSourceTreeDataPreProcessors } from "../hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.js";
-import { useGridColumnPinning, columnPinningStateInitializer } from "../hooks/features/columnPinning/useGridColumnPinning.js";
-import { useGridColumnPinningPreProcessors } from "../hooks/features/columnPinning/useGridColumnPinningPreProcessors.js";
-import { useGridDetailPanel, detailPanelStateInitializer } from "../hooks/features/detailPanel/useGridDetailPanel.js";
-import { useGridDetailPanelPreProcessors } from "../hooks/features/detailPanel/useGridDetailPanelPreProcessors.js";
-import { useGridRowReorder } from "../hooks/features/rowReorder/useGridRowReorder.js";
-import { useGridRowReorderPreProcessors } from "../hooks/features/rowReorder/useGridRowReorderPreProcessors.js";
-import { useGridLazyLoader } from "../hooks/features/lazyLoader/useGridLazyLoader.js";
-import { useGridLazyLoaderPreProcessors } from "../hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.js";
-import { useGridRowPinning, rowPinningStateInitializer } from "../hooks/features/rowPinning/useGridRowPinning.js";
-import { useGridRowPinningPreProcessors } from "../hooks/features/rowPinning/useGridRowPinningPreProcessors.js";
-import { useGridDataSourcePro as useGridDataSource, dataSourceStateInitializer } from "../hooks/features/dataSource/useGridDataSourcePro.js";
-import { useGridDataSourceLazyLoader } from "../hooks/features/serverSideLazyLoader/useGridDataSourceLazyLoader.js";
-export const useDataGridProComponent = (inputApiRef, props) => {
-  const apiRef = useGridInitialization(inputApiRef, props);
-
-  /**
-   * Register all pre-processors called during state initialization here.
-   */
-  useGridRowSelectionPreProcessors(apiRef, props);
-  useGridRowReorderPreProcessors(apiRef, props);
-  useGridTreeDataPreProcessors(apiRef, props);
-  useGridDataSourceTreeDataPreProcessors(apiRef, props);
-  useGridLazyLoaderPreProcessors(apiRef, props);
-  useGridRowPinningPreProcessors(apiRef);
-  useGridDetailPanelPreProcessors(apiRef, props);
-  // The column pinning `hydrateColumns` pre-processor must be after every other `hydrateColumns` pre-processors
-  // Because it changes the order of the columns.
-  useGridColumnPinningPreProcessors(apiRef, props);
-  useGridRowsPreProcessors(apiRef);
-
-  /**
-   * Register all state initializers here.
-   */
-  useGridInitializeState(propsStateInitializer, apiRef, props);
-  useGridInitializeState(headerFilteringStateInitializer, apiRef, props);
-  useGridInitializeState(rowSelectionStateInitializer, apiRef, props);
-  useGridInitializeState(detailPanelStateInitializer, apiRef, props);
-  useGridInitializeState(columnPinningStateInitializer, apiRef, props);
-  useGridInitializeState(columnsStateInitializer, apiRef, props);
-  useGridInitializeState(rowPinningStateInitializer, apiRef, props);
-  useGridInitializeState(rowsStateInitializer, apiRef, props);
-  useGridInitializeState(paginationStateInitializer, apiRef, props);
-  useGridInitializeState(editingStateInitializer, apiRef, props);
-  useGridInitializeState(focusStateInitializer, apiRef, props);
-  useGridInitializeState(sortingStateInitializer, apiRef, props);
-  useGridInitializeState(preferencePanelStateInitializer, apiRef, props);
-  useGridInitializeState(filterStateInitializer, apiRef, props);
-  useGridInitializeState(rowSpanningStateInitializer, apiRef, props);
-  useGridInitializeState(densityStateInitializer, apiRef, props);
-  useGridInitializeState(columnReorderStateInitializer, apiRef, props);
-  useGridInitializeState(columnResizeStateInitializer, apiRef, props);
-  useGridInitializeState(columnMenuStateInitializer, apiRef, props);
-  useGridInitializeState(columnGroupsStateInitializer, apiRef, props);
-  useGridInitializeState(virtualizationStateInitializer, apiRef, props);
-  useGridInitializeState(dataSourceStateInitializer, apiRef, props);
-  useGridInitializeState(dimensionsStateInitializer, apiRef, props);
-  useGridInitializeState(rowsMetaStateInitializer, apiRef, props);
-  useGridInitializeState(listViewStateInitializer, apiRef, props);
-  useGridHeaderFiltering(apiRef, props);
-  useGridTreeData(apiRef, props);
-  useGridKeyboardNavigation(apiRef, props);
-  useGridRowSelection(apiRef, props);
-  useGridColumnPinning(apiRef, props);
-  useGridRowPinning(apiRef, props);
-  useGridColumns(apiRef, props);
-  useGridRows(apiRef, props);
-  useGridRowSpanning(apiRef, props);
-  useGridParamsApi(apiRef, props);
-  useGridDetailPanel(apiRef, props);
-  useGridColumnSpanning(apiRef);
-  useGridColumnGrouping(apiRef, props);
-  useGridEditing(apiRef, props);
-  useGridFocus(apiRef, props);
-  useGridPreferencesPanel(apiRef, props);
-  useGridFilter(apiRef, props);
-  useGridSorting(apiRef, props);
-  useGridDensity(apiRef, props);
-  useGridColumnReorder(apiRef, props);
-  useGridColumnResize(apiRef, props);
-  useGridPagination(apiRef, props);
-  useGridRowsMeta(apiRef, props);
-  useGridRowReorder(apiRef, props);
-  useGridScroll(apiRef, props);
-  useGridInfiniteLoader(apiRef, props);
-  useGridLazyLoader(apiRef, props);
-  useGridDataSourceLazyLoader(apiRef, props);
-  useGridColumnMenu(apiRef);
-  useGridCsvExport(apiRef, props);
-  useGridPrintExport(apiRef, props);
-  useGridClipboard(apiRef, props);
-  useGridDimensions(apiRef, props);
-  useGridEvents(apiRef, props);
-  useGridStatePersistence(apiRef);
-  useGridVirtualization(apiRef, props);
-  useGridDataSource(apiRef, props);
-  useGridListView(apiRef, props);
-  return apiRef;
-};

package/modern/DataGridPro/useDataGridProProps.d.ts

@@ -1,7 +0,0 @@
-import { GridValidRowModel } from '@mui/x-data-grid';
-import { DataGridProProps, DataGridProProcessedProps, DataGridProPropsWithDefaultValue } from "../models/dataGridProProps.js";
-/**
- * The default values of `DataGridProPropsWithDefaultValue` to inject in the props of DataGridPro.
- */
-export declare const DATA_GRID_PRO_PROPS_DEFAULT_VALUES: DataGridProPropsWithDefaultValue;
-export declare const useDataGridProProps: <R extends GridValidRowModel>(inProps: DataGridProProps<R>) => DataGridProProcessedProps<R>;

package/modern/DataGridPro/useDataGridProProps.js

@@ -1,54 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import { useThemeProps } from '@mui/material/styles';
-import { GRID_DEFAULT_LOCALE_TEXT, DATA_GRID_PROPS_DEFAULT_VALUES } from '@mui/x-data-grid';
-import { computeSlots, ROW_SELECTION_PROPAGATION_DEFAULT } from '@mui/x-data-grid/internals';
-import { DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS } from "../constants/dataGridProDefaultSlotsComponents.js";
-const getDataGridProForcedProps = themedProps => _extends({
-  signature: 'DataGridPro'
-}, themedProps.dataSource ? {
-  filterMode: 'server',
-  sortingMode: 'server',
-  paginationMode: 'server'
-} : {});
-
-/**
- * The default values of `DataGridProPropsWithDefaultValue` to inject in the props of DataGridPro.
- */
-export const DATA_GRID_PRO_PROPS_DEFAULT_VALUES = _extends({}, DATA_GRID_PROPS_DEFAULT_VALUES, {
-  autosizeOnMount: false,
-  defaultGroupingExpansionDepth: 0,
-  disableAutosize: false,
-  disableChildrenFiltering: false,
-  disableChildrenSorting: false,
-  disableColumnPinning: false,
-  getDetailPanelHeight: () => 500,
-  headerFilters: false,
-  keepColumnPositionIfDraggedOutside: false,
-  rowSelectionPropagation: ROW_SELECTION_PROPAGATION_DEFAULT,
-  rowReordering: false,
-  rowsLoadingMode: 'client',
-  scrollEndThreshold: 80,
-  treeData: false,
-  lazyLoading: false,
-  lazyLoadingRequestThrottleMs: 500,
-  listView: false
-});
-const defaultSlots = DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS;
-export const useDataGridProProps = inProps => {
-  const themedProps =
-  // eslint-disable-next-line material-ui/mui-name-matches-component-name
-  useThemeProps({
-    props: inProps,
-    name: 'MuiDataGrid'
-  });
-  const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
-  const slots = React.useMemo(() => computeSlots({
-    defaultSlots,
-    slots: themedProps.slots
-  }), [themedProps.slots]);
-  return React.useMemo(() => _extends({}, DATA_GRID_PRO_PROPS_DEFAULT_VALUES, themedProps, {
-    localeText,
-    slots
-  }, getDataGridProForcedProps(themedProps)), [themedProps, localeText, slots]);
-};

package/modern/components/GridColumnHeaders.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-import { UseGridColumnHeadersProps } from '@mui/x-data-grid/internals';
-export interface GridColumnHeadersProps extends React.HTMLAttributes<HTMLDivElement>, UseGridColumnHeadersProps {}
-declare const GridColumnHeaders: React.ForwardRefExoticComponent<GridColumnHeadersProps> | React.ForwardRefExoticComponent<GridColumnHeadersProps & React.RefAttributes<HTMLDivElement>>;
-export { GridColumnHeaders };

package/modern/components/GridColumnHeaders.js

@@ -1,92 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["style", "className", "visibleColumns", "sortColumnLookup", "filterColumnLookup", "columnHeaderTabIndexState", "columnGroupHeaderTabIndexState", "columnHeaderFocus", "columnGroupHeaderFocus", "headerGroupingMaxDepth", "columnMenuState", "columnVisibility", "columnGroupsHeaderStructure", "hasOtherElementInTabSequence"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { styled } from '@mui/material/styles';
-import { forwardRef } from '@mui/x-internals/forwardRef';
-import { vars, GridBaseColumnHeaders } from '@mui/x-data-grid/internals';
-import { useGridColumnHeaders } from "../hooks/features/columnHeaders/useGridColumnHeaders.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const Filler = styled('div')({
-  flex: 1,
-  backgroundColor: vars.header.background.base
-});
-const GridColumnHeaders = forwardRef(function GridColumnHeaders(props, ref) {
-  const {
-      className,
-      visibleColumns,
-      sortColumnLookup,
-      filterColumnLookup,
-      columnHeaderTabIndexState,
-      columnGroupHeaderTabIndexState,
-      columnHeaderFocus,
-      columnGroupHeaderFocus,
-      headerGroupingMaxDepth,
-      columnMenuState,
-      columnVisibility,
-      columnGroupsHeaderStructure,
-      hasOtherElementInTabSequence
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const {
-    getInnerProps,
-    getColumnHeadersRow,
-    getColumnFiltersRow,
-    getColumnGroupHeadersRows
-  } = useGridColumnHeaders({
-    visibleColumns,
-    sortColumnLookup,
-    filterColumnLookup,
-    columnHeaderTabIndexState,
-    hasOtherElementInTabSequence,
-    columnGroupHeaderTabIndexState,
-    columnHeaderFocus,
-    columnGroupHeaderFocus,
-    headerGroupingMaxDepth,
-    columnMenuState,
-    columnVisibility,
-    columnGroupsHeaderStructure
-  });
-  return /*#__PURE__*/_jsxs(GridBaseColumnHeaders, _extends({
-    className: className
-  }, other, getInnerProps(), {
-    ref: ref,
-    children: [getColumnGroupHeadersRows(), getColumnHeadersRow(), getColumnFiltersRow(), /*#__PURE__*/_jsx(Filler, {})]
-  }));
-});
-process.env.NODE_ENV !== "production" ? GridColumnHeaders.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  columnGroupHeaderFocus: PropTypes.shape({
-    depth: PropTypes.number.isRequired,
-    field: PropTypes.string.isRequired
-  }),
-  columnGroupHeaderTabIndexState: PropTypes.shape({
-    depth: PropTypes.number.isRequired,
-    field: PropTypes.string.isRequired
-  }),
-  columnGroupsHeaderStructure: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.shape({
-    columnFields: PropTypes.arrayOf(PropTypes.string).isRequired,
-    groupId: PropTypes.string
-  }))).isRequired,
-  columnHeaderFocus: PropTypes.shape({
-    field: PropTypes.string.isRequired
-  }),
-  columnHeaderTabIndexState: PropTypes.shape({
-    field: PropTypes.string.isRequired
-  }),
-  columnMenuState: PropTypes.shape({
-    field: PropTypes.string,
-    open: PropTypes.bool.isRequired
-  }).isRequired,
-  columnVisibility: PropTypes.object.isRequired,
-  filterColumnLookup: PropTypes.object.isRequired,
-  hasOtherElementInTabSequence: PropTypes.bool.isRequired,
-  headerGroupingMaxDepth: PropTypes.number.isRequired,
-  sortColumnLookup: PropTypes.object.isRequired,
-  visibleColumns: PropTypes.arrayOf(PropTypes.object).isRequired
-} : void 0;
-export { GridColumnHeaders };

package/modern/components/GridColumnMenuPinningItem.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-import { GridColumnMenuItemProps } from '@mui/x-data-grid';
-declare function GridColumnMenuPinningItem(props: GridColumnMenuItemProps): React.JSX.Element | null;
-declare namespace GridColumnMenuPinningItem {
-  var propTypes: any;
-}
-export { GridColumnMenuPinningItem };

package/modern/components/GridColumnMenuPinningItem.js

@@ -1,77 +0,0 @@
-import * as React from 'react';
-import { useRtl } from '@mui/system/RtlProvider';
-import PropTypes from 'prop-types';
-import { GridPinnedColumnPosition } from '@mui/x-data-grid';
-import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
-import { useGridRootProps } from "../hooks/utils/useGridRootProps.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function GridColumnMenuPinningItem(props) {
-  const {
-    colDef,
-    onClick
-  } = props;
-  const apiRef = useGridApiContext();
-  const rootProps = useGridRootProps();
-  const isRtl = useRtl();
-  const pinColumn = React.useCallback(side => event => {
-    apiRef.current.pinColumn(colDef.field, side);
-    onClick(event);
-  }, [apiRef, colDef.field, onClick]);
-  const unpinColumn = event => {
-    apiRef.current.unpinColumn(colDef.field);
-    onClick(event);
-  };
-  const pinToLeftMenuItem = /*#__PURE__*/_jsx(rootProps.slots.baseMenuItem, {
-    onClick: pinColumn(GridPinnedColumnPosition.LEFT),
-    iconStart: /*#__PURE__*/_jsx(rootProps.slots.columnMenuPinLeftIcon, {
-      fontSize: "small"
-    }),
-    children: apiRef.current.getLocaleText('pinToLeft')
-  });
-  const pinToRightMenuItem = /*#__PURE__*/_jsx(rootProps.slots.baseMenuItem, {
-    onClick: pinColumn(GridPinnedColumnPosition.RIGHT),
-    iconStart: /*#__PURE__*/_jsx(rootProps.slots.columnMenuPinRightIcon, {
-      fontSize: "small"
-    }),
-    children: apiRef.current.getLocaleText('pinToRight')
-  });
-  if (!colDef) {
-    return null;
-  }
-  const side = apiRef.current.isColumnPinned(colDef.field);
-  if (side) {
-    const otherSide = side === GridPinnedColumnPosition.RIGHT ? GridPinnedColumnPosition.LEFT : GridPinnedColumnPosition.RIGHT;
-    const label = otherSide === GridPinnedColumnPosition.RIGHT ? 'pinToRight' : 'pinToLeft';
-    const Icon = side === GridPinnedColumnPosition.RIGHT ? rootProps.slots.columnMenuPinLeftIcon : rootProps.slots.columnMenuPinRightIcon;
-    return /*#__PURE__*/_jsxs(React.Fragment, {
-      children: [/*#__PURE__*/_jsx(rootProps.slots.baseMenuItem, {
-        onClick: pinColumn(otherSide),
-        iconStart: /*#__PURE__*/_jsx(Icon, {
-          fontSize: "small"
-        }),
-        children: apiRef.current.getLocaleText(label)
-      }), /*#__PURE__*/_jsx(rootProps.slots.baseMenuItem, {
-        onClick: unpinColumn,
-        iconStart: "",
-        children: apiRef.current.getLocaleText('unpin')
-      })]
-    });
-  }
-  if (isRtl) {
-    return /*#__PURE__*/_jsxs(React.Fragment, {
-      children: [pinToRightMenuItem, pinToLeftMenuItem]
-    });
-  }
-  return /*#__PURE__*/_jsxs(React.Fragment, {
-    children: [pinToLeftMenuItem, pinToRightMenuItem]
-  });
-}
-process.env.NODE_ENV !== "production" ? GridColumnMenuPinningItem.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  colDef: PropTypes.object.isRequired,
-  onClick: PropTypes.func.isRequired
-} : void 0;
-export { GridColumnMenuPinningItem };

package/modern/components/GridDataSourceTreeDataGroupingCell.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { GridRenderCellParams, GridDataSourceGroupNode } from '@mui/x-data-grid';
-interface GridTreeDataGroupingCellProps extends GridRenderCellParams<any, any, any, GridDataSourceGroupNode> {
-  hideDescendantCount?: boolean;
-  /**
-   * The cell offset multiplier used for calculating cell offset (`rowNode.depth * offsetMultiplier` px).
-   * @default 2
-   */
-  offsetMultiplier?: number;
-}
-export declare function GridDataSourceTreeDataGroupingCell(props: GridTreeDataGroupingCellProps): React.JSX.Element;
-export {};

package/modern/components/GridDataSourceTreeDataGroupingCell.js

@@ -1,107 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import composeClasses from '@mui/utils/composeClasses';
-import { getDataGridUtilityClass, useGridSelector } from '@mui/x-data-grid';
-import { vars, gridRowSelector } from '@mui/x-data-grid/internals';
-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
-  } = ownerState;
-  const slots = {
-    root: ['treeDataGroupingCell'],
-    toggle: ['treeDataGroupingCellToggle'],
-    loadingContainer: ['treeDataGroupingCellLoadingContainer']
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-function GridTreeDataGroupingCellIcon(props) {
-  const apiRef = useGridPrivateApiContext();
-  const rootProps = useGridRootProps();
-  const classes = useUtilityClasses(rootProps);
-  const {
-    rowNode,
-    id,
-    field,
-    descendantCount
-  } = props;
-  const isDataLoading = useGridSelector(apiRef, gridDataSourceLoadingIdSelector, id);
-  const error = useGridSelector(apiRef, gridDataSourceErrorSelector, id);
-  const handleClick = event => {
-    if (!rowNode.childrenExpanded) {
-      // always fetch/get from cache the children when the node is expanded
-      apiRef.current.dataSource.fetchRows(id);
-    } else {
-      apiRef.current.setRowChildrenExpansion(id, !rowNode.childrenExpanded);
-    }
-    apiRef.current.setCellFocus(id, field);
-    event.stopPropagation(); // TODO remove event.stopPropagation
-  };
-  const Icon = rowNode.childrenExpanded ? rootProps.slots.treeDataCollapseIcon : rootProps.slots.treeDataExpandIcon;
-  if (isDataLoading) {
-    return /*#__PURE__*/_jsx("div", {
-      className: classes.loadingContainer,
-      children: /*#__PURE__*/_jsx(rootProps.slots.baseCircularProgress, {
-        size: "1rem",
-        color: "inherit"
-      })
-    });
-  }
-  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__*/_jsx(rootProps.slots.baseTooltip, {
-      title: error?.message ?? null,
-      children: /*#__PURE__*/_jsx(rootProps.slots.baseBadge, {
-        variant: "dot",
-        color: "error",
-        invisible: !error,
-        children: /*#__PURE__*/_jsx(Icon, {
-          fontSize: "inherit"
-        })
-      })
-    })
-  })) : null;
-}
-export function GridDataSourceTreeDataGroupingCell(props) {
-  const {
-    id,
-    field,
-    formattedValue,
-    rowNode,
-    hideDescendantCount,
-    offsetMultiplier = 2
-  } = props;
-  const rootProps = useGridRootProps();
-  const apiRef = useGridPrivateApiContext();
-  const row = useGridSelector(apiRef, gridRowSelector, id);
-  const classes = useUtilityClasses(rootProps);
-  let descendantCount = 0;
-  if (row) {
-    descendantCount = rootProps.dataSource?.getChildrenCount?.(row) ?? 0;
-  }
-  return /*#__PURE__*/_jsxs("div", {
-    className: classes.root,
-    style: {
-      marginLeft: vars.spacing(rowNode.depth * offsetMultiplier)
-    },
-    children: [/*#__PURE__*/_jsx("div", {
-      className: classes.toggle,
-      children: /*#__PURE__*/_jsx(GridTreeDataGroupingCellIcon, {
-        id: id,
-        field: field,
-        rowNode: rowNode,
-        row: row,
-        descendantCount: descendantCount
-      })
-    }), /*#__PURE__*/_jsxs("span", {
-      children: [formattedValue === undefined ? rowNode.groupingKey : formattedValue, !hideDescendantCount && descendantCount > 0 ? ` (${descendantCount})` : '']
-    })]
-  });
-}

package/modern/components/GridDetailPanel.d.ts

@@ -1,14 +0,0 @@
-import * as React from 'react';
-import { GridRowId } from '@mui/x-data-grid';
-interface GridDetailPanelProps extends Pick<React.HTMLAttributes<HTMLDivElement>, 'className' | 'children'> {
-  /**
-   * The row ID that this panel belongs to.
-   */
-  rowId: GridRowId;
-  /**
-   * The panel height.
-   */
-  height: number | 'auto';
-}
-declare function GridDetailPanel(props: GridDetailPanelProps): React.JSX.Element;
-export { GridDetailPanel };

package/modern/components/GridDetailPanel.js

@@ -1,53 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { styled } from '@mui/material/styles';
-import { vars } from '@mui/x-data-grid/internals';
-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
-})({
-  width: 'calc(var(--DataGrid-rowWidth) - var(--DataGrid-hasScrollY) * var(--DataGrid-scrollbarSize))',
-  backgroundColor: vars.colors.background.base,
-  overflow: 'auto'
-});
-function GridDetailPanel(props) {
-  const {
-    rowId,
-    height,
-    className,
-    children
-  } = props;
-  const apiRef = useGridPrivateApiContext();
-  const ref = React.useRef(null);
-  const rootProps = useGridRootProps();
-  const ownerState = rootProps;
-  const hasAutoHeight = height === 'auto';
-  React.useLayoutEffect(() => {
-    if (hasAutoHeight && typeof ResizeObserver === 'undefined') {
-      // Fallback for IE
-      apiRef.current.storeDetailPanelHeight(rowId, ref.current.clientHeight);
-    }
-  }, [apiRef, hasAutoHeight, rowId]);
-  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__*/_jsx(DetailPanel, {
-    ref: ref,
-    ownerState: ownerState,
-    role: "presentation",
-    style: {
-      height
-    },
-    className: className,
-    children: children
-  });
-}
-export { GridDetailPanel };

package/modern/components/GridDetailPanelToggleCell.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-import { GridRenderCellParams } from '@mui/x-data-grid';
-declare function GridDetailPanelToggleCell(props: GridRenderCellParams): React.JSX.Element;
-declare namespace GridDetailPanelToggleCell {
-  var propTypes: any;
-}
-export { GridDetailPanelToggleCell };