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

package/modern/components/columnHeaders/GridColumnHeaderItem.js

@@ -1,231 +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, unstable_useId as useId } from '@mui/utils';
-import { fastMemo } from '@mui/x-internals/fastMemo';
-import { useRtl } from '@mui/system/RtlProvider';
-import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
-import { ColumnHeaderMenuIcon } from "./ColumnHeaderMenuIcon.js";
-import { GridColumnHeaderMenu } from "../menu/columnMenu/GridColumnHeaderMenu.js";
-import { gridClasses, getDataGridUtilityClass } from "../../constants/gridClasses.js";
-import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
-import { GridGenericColumnHeaderItem } from "./GridGenericColumnHeaderItem.js";
-import { isEventTargetInPortal } from "../../utils/domUtils.js";
-import { PinnedColumnPosition } from "../../internals/constants.js";
-import { attachPinnedStyle } from "../../internals/utils/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    colDef,
-    classes,
-    isDragging,
-    sortDirection,
-    showRightBorder,
-    showLeftBorder,
-    filterItemsCounter,
-    pinnedPosition,
-    isLastUnpinned,
-    isSiblingFocused
-  } = ownerState;
-  const isColumnSorted = sortDirection != null;
-  const isColumnFiltered = filterItemsCounter != null && filterItemsCounter > 0;
-  // todo refactor to a prop on col isNumeric or ?? ie: coltype===price wont work
-  const isColumnNumeric = colDef.type === 'number';
-  const slots = {
-    root: ['columnHeader', colDef.headerAlign === 'left' && 'columnHeader--alignLeft', colDef.headerAlign === 'center' && 'columnHeader--alignCenter', colDef.headerAlign === 'right' && 'columnHeader--alignRight', colDef.sortable && 'columnHeader--sortable', isDragging && 'columnHeader--moving', isColumnSorted && 'columnHeader--sorted', isColumnFiltered && 'columnHeader--filtered', isColumnNumeric && 'columnHeader--numeric', 'withBorderColor', showRightBorder && 'columnHeader--withRightBorder', showLeftBorder && 'columnHeader--withLeftBorder', pinnedPosition === PinnedColumnPosition.LEFT && 'columnHeader--pinnedLeft', pinnedPosition === PinnedColumnPosition.RIGHT && 'columnHeader--pinnedRight',
-    // TODO: Remove classes below and restore `:has` selectors when they are supported in jsdom
-    // See https://github.com/mui/mui-x/pull/14559
-    isLastUnpinned && 'columnHeader--lastUnpinned', isSiblingFocused && 'columnHeader--siblingFocused'],
-    draggableContainer: ['columnHeaderDraggableContainer'],
-    titleContainer: ['columnHeaderTitleContainer'],
-    titleContainerContent: ['columnHeaderTitleContainerContent']
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-function GridColumnHeaderItem(props) {
-  const {
-    colDef,
-    columnMenuOpen,
-    colIndex,
-    headerHeight,
-    isResizing,
-    isLast,
-    sortDirection,
-    sortIndex,
-    filterItemsCounter,
-    hasFocus,
-    tabIndex,
-    disableReorder,
-    separatorSide,
-    showLeftBorder,
-    showRightBorder,
-    pinnedPosition,
-    pinnedOffset
-  } = props;
-  const apiRef = useGridPrivateApiContext();
-  const rootProps = useGridRootProps();
-  const isRtl = useRtl();
-  const headerCellRef = React.useRef(null);
-  const columnMenuId = useId();
-  const columnMenuButtonId = useId();
-  const iconButtonRef = React.useRef(null);
-  const [showColumnMenuIcon, setShowColumnMenuIcon] = React.useState(columnMenuOpen);
-  const isDraggable = React.useMemo(() => !rootProps.disableColumnReorder && !disableReorder && !colDef.disableReorder, [rootProps.disableColumnReorder, disableReorder, colDef.disableReorder]);
-  let headerComponent;
-  if (colDef.renderHeader) {
-    headerComponent = colDef.renderHeader(apiRef.current.getColumnHeaderParams(colDef.field));
-  }
-  const ownerState = _extends({}, props, {
-    classes: rootProps.classes,
-    showRightBorder,
-    showLeftBorder
-  });
-  const classes = useUtilityClasses(ownerState);
-  const publish = React.useCallback(eventName => event => {
-    // Ignore portal
-    // See https://github.com/mui/mui-x/issues/1721
-    if (isEventTargetInPortal(event)) {
-      return;
-    }
-    apiRef.current.publishEvent(eventName, apiRef.current.getColumnHeaderParams(colDef.field), event);
-  }, [apiRef, colDef.field]);
-  const mouseEventsHandlers = React.useMemo(() => ({
-    onClick: publish('columnHeaderClick'),
-    onContextMenu: publish('columnHeaderContextMenu'),
-    onDoubleClick: publish('columnHeaderDoubleClick'),
-    onMouseOver: publish('columnHeaderOver'),
-    // TODO remove as it's not used
-    onMouseOut: publish('columnHeaderOut'),
-    // TODO remove as it's not used
-    onMouseEnter: publish('columnHeaderEnter'),
-    // TODO remove as it's not used
-    onMouseLeave: publish('columnHeaderLeave'),
-    // TODO remove as it's not used
-    onKeyDown: publish('columnHeaderKeyDown'),
-    onFocus: publish('columnHeaderFocus'),
-    onBlur: publish('columnHeaderBlur')
-  }), [publish]);
-  const draggableEventHandlers = React.useMemo(() => isDraggable ? {
-    onDragStart: publish('columnHeaderDragStart'),
-    onDragEnter: publish('columnHeaderDragEnter'),
-    onDragOver: publish('columnHeaderDragOver'),
-    onDragEnd: publish('columnHeaderDragEnd')
-  } : {}, [isDraggable, publish]);
-  const columnHeaderSeparatorProps = React.useMemo(() => ({
-    onMouseDown: publish('columnSeparatorMouseDown'),
-    onDoubleClick: publish('columnSeparatorDoubleClick')
-  }), [publish]);
-  React.useEffect(() => {
-    if (!showColumnMenuIcon) {
-      setShowColumnMenuIcon(columnMenuOpen);
-    }
-  }, [showColumnMenuIcon, columnMenuOpen]);
-  const handleExited = React.useCallback(() => {
-    setShowColumnMenuIcon(false);
-  }, []);
-  const columnMenuIconButton = !rootProps.disableColumnMenu && !colDef.disableColumnMenu && /*#__PURE__*/_jsx(ColumnHeaderMenuIcon, {
-    colDef: colDef,
-    columnMenuId: columnMenuId,
-    columnMenuButtonId: columnMenuButtonId,
-    open: showColumnMenuIcon,
-    iconButtonRef: iconButtonRef
-  });
-  const columnMenu = /*#__PURE__*/_jsx(GridColumnHeaderMenu, {
-    columnMenuId: columnMenuId,
-    columnMenuButtonId: columnMenuButtonId,
-    field: colDef.field,
-    open: columnMenuOpen,
-    target: iconButtonRef.current,
-    ContentComponent: rootProps.slots.columnMenu,
-    contentComponentProps: rootProps.slotProps?.columnMenu,
-    onExited: handleExited
-  });
-  const sortingOrder = colDef.sortingOrder ?? rootProps.sortingOrder;
-  const showSortIcon = (colDef.sortable || sortDirection != null) && !colDef.hideSortIcons && !rootProps.disableColumnSorting;
-  const columnTitleIconButtons = /*#__PURE__*/_jsxs(React.Fragment, {
-    children: [!rootProps.disableColumnFilter && /*#__PURE__*/_jsx(rootProps.slots.columnHeaderFilterIconButton, _extends({
-      field: colDef.field,
-      counter: filterItemsCounter
-    }, rootProps.slotProps?.columnHeaderFilterIconButton)), showSortIcon && /*#__PURE__*/_jsx(rootProps.slots.columnHeaderSortIcon, _extends({
-      field: colDef.field,
-      direction: sortDirection,
-      index: sortIndex,
-      sortingOrder: sortingOrder,
-      disabled: !colDef.sortable
-    }, rootProps.slotProps?.columnHeaderSortIcon))]
-  });
-  React.useLayoutEffect(() => {
-    const columnMenuState = apiRef.current.state.columnMenu;
-    if (hasFocus && !columnMenuState.open) {
-      const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-      const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
-      }
-    }
-  }, [apiRef, hasFocus]);
-  const headerClassName = typeof colDef.headerClassName === 'function' ? colDef.headerClassName({
-    field: colDef.field,
-    colDef
-  }) : colDef.headerClassName;
-  const label = colDef.headerName ?? colDef.field;
-  const style = React.useMemo(() => attachPinnedStyle(_extends({}, props.style), isRtl, pinnedPosition, pinnedOffset), [pinnedPosition, pinnedOffset, props.style, isRtl]);
-  return /*#__PURE__*/_jsx(GridGenericColumnHeaderItem, _extends({
-    ref: headerCellRef,
-    classes: classes,
-    columnMenuOpen: columnMenuOpen,
-    colIndex: colIndex,
-    height: headerHeight,
-    isResizing: isResizing,
-    sortDirection: sortDirection,
-    hasFocus: hasFocus,
-    tabIndex: tabIndex,
-    separatorSide: separatorSide,
-    isDraggable: isDraggable,
-    headerComponent: headerComponent,
-    description: colDef.description,
-    elementId: colDef.field,
-    width: colDef.computedWidth,
-    columnMenuIconButton: columnMenuIconButton,
-    columnTitleIconButtons: columnTitleIconButtons,
-    headerClassName: clsx(headerClassName, isLast && gridClasses['columnHeader--last']),
-    label: label,
-    resizable: !rootProps.disableColumnResize && !!colDef.resizable,
-    "data-field": colDef.field,
-    columnMenu: columnMenu,
-    draggableContainerProps: draggableEventHandlers,
-    columnHeaderSeparatorProps: columnHeaderSeparatorProps,
-    style: style
-  }, mouseEventsHandlers));
-}
-process.env.NODE_ENV !== "production" ? GridColumnHeaderItem.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,
-  colIndex: PropTypes.number.isRequired,
-  columnMenuOpen: PropTypes.bool.isRequired,
-  disableReorder: PropTypes.bool,
-  filterItemsCounter: PropTypes.number,
-  hasFocus: PropTypes.bool,
-  headerHeight: PropTypes.number.isRequired,
-  isDragging: PropTypes.bool.isRequired,
-  isLast: PropTypes.bool.isRequired,
-  isLastUnpinned: PropTypes.bool.isRequired,
-  isResizing: PropTypes.bool.isRequired,
-  isSiblingFocused: PropTypes.bool.isRequired,
-  pinnedOffset: PropTypes.number,
-  pinnedPosition: PropTypes.oneOf([0, 1, 2, 3]),
-  separatorSide: PropTypes.oneOf(['left', 'right']),
-  showLeftBorder: PropTypes.bool.isRequired,
-  showRightBorder: PropTypes.bool.isRequired,
-  sortDirection: PropTypes.oneOf(['asc', 'desc']),
-  sortIndex: PropTypes.number,
-  style: PropTypes.object,
-  tabIndex: PropTypes.oneOf([-1, 0]).isRequired
-} : void 0;
-const Memoized = fastMemo(GridColumnHeaderItem);
-export { Memoized as GridColumnHeaderItem };

package/modern/components/columnHeaders/GridColumnHeaderSeparator.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-declare enum GridColumnHeaderSeparatorSides {
-  Left = "left",
-  Right = "right",
-}
-export interface GridColumnHeaderSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
-  resizable: boolean;
-  resizing: boolean;
-  height: number;
-  side?: GridColumnHeaderSeparatorSides;
-}
-declare function GridColumnHeaderSeparatorRaw(props: GridColumnHeaderSeparatorProps): React.JSX.Element;
-declare namespace GridColumnHeaderSeparatorRaw {
-  var propTypes: any;
-}
-declare const GridColumnHeaderSeparator: React.MemoExoticComponent<typeof GridColumnHeaderSeparatorRaw>;
-export { GridColumnHeaderSeparator, GridColumnHeaderSeparatorSides };

package/modern/components/columnHeaders/GridColumnHeaderSeparator.js

@@ -1,71 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["resizable", "resizing", "height", "side"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { unstable_composeClasses as composeClasses, unstable_capitalize as capitalize } from '@mui/utils';
-import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
-import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-var GridColumnHeaderSeparatorSides = /*#__PURE__*/function (GridColumnHeaderSeparatorSides) {
-  GridColumnHeaderSeparatorSides["Left"] = "left";
-  GridColumnHeaderSeparatorSides["Right"] = "right";
-  return GridColumnHeaderSeparatorSides;
-}(GridColumnHeaderSeparatorSides || {});
-const useUtilityClasses = ownerState => {
-  const {
-    resizable,
-    resizing,
-    classes,
-    side
-  } = ownerState;
-  const slots = {
-    root: ['columnSeparator', resizable && 'columnSeparator--resizable', resizing && 'columnSeparator--resizing', side && `columnSeparator--side${capitalize(side)}`],
-    icon: ['iconSeparator']
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-function GridColumnHeaderSeparatorRaw(props) {
-  const {
-      height,
-      side = GridColumnHeaderSeparatorSides.Right
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const rootProps = useGridRootProps();
-  const ownerState = _extends({}, props, {
-    side,
-    classes: rootProps.classes
-  });
-  const classes = useUtilityClasses(ownerState);
-  const stopClick = React.useCallback(event => {
-    event.preventDefault();
-    event.stopPropagation();
-  }, []);
-  return (
-    /*#__PURE__*/
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
-    _jsx("div", _extends({
-      className: classes.root,
-      style: {
-        minHeight: height
-      }
-    }, other, {
-      onClick: stopClick,
-      children: /*#__PURE__*/_jsx(rootProps.slots.columnResizeIcon, {
-        className: classes.icon
-      })
-    }))
-  );
-}
-const GridColumnHeaderSeparator = /*#__PURE__*/React.memo(GridColumnHeaderSeparatorRaw);
-process.env.NODE_ENV !== "production" ? GridColumnHeaderSeparatorRaw.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  height: PropTypes.number.isRequired,
-  resizable: PropTypes.bool.isRequired,
-  resizing: PropTypes.bool.isRequired,
-  side: PropTypes.oneOf(['left', 'right'])
-} : void 0;
-export { GridColumnHeaderSeparator, GridColumnHeaderSeparatorSides };

package/modern/components/columnHeaders/GridColumnHeaderSortIcon.d.ts

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { GridSortDirection } from "../../models/gridSortModel.js";
-export interface GridColumnHeaderSortIconProps {
-  field: string;
-  direction: GridSortDirection;
-  index: number | undefined;
-  sortingOrder: readonly GridSortDirection[];
-  disabled?: boolean;
-}
-declare function GridColumnHeaderSortIconRaw(props: GridColumnHeaderSortIconProps): React.JSX.Element | null;
-declare namespace GridColumnHeaderSortIconRaw {
-  var propTypes: any;
-}
-declare const GridColumnHeaderSortIcon: React.MemoExoticComponent<typeof GridColumnHeaderSortIconRaw>;
-export { GridColumnHeaderSortIcon };

package/modern/components/columnHeaders/GridColumnHeaderTitle.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-export interface GridColumnHeaderTitleProps {
-  label: string;
-  columnWidth: number;
-  description?: React.ReactNode;
-}
-declare function GridColumnHeaderTitle(props: GridColumnHeaderTitleProps): React.JSX.Element;
-declare namespace GridColumnHeaderTitle {
-  var propTypes: any;
-}
-export { GridColumnHeaderTitle };

package/modern/components/columnHeaders/GridColumnHeaderTitle.js

@@ -1,88 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["className", "aria-label"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import composeClasses from '@mui/utils/composeClasses';
-import { styled } from '@mui/system';
-import { forwardRef } from '@mui/x-internals/forwardRef';
-import { isOverflown } from "../../utils/domUtils.js";
-import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
-import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    classes
-  } = ownerState;
-  const slots = {
-    root: ['columnHeaderTitle']
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-const GridColumnHeaderTitleRoot = styled('div', {
-  name: 'MuiDataGrid',
-  slot: 'ColumnHeaderTitle',
-  overridesResolver: (props, styles) => styles.columnHeaderTitle
-})({
-  textOverflow: 'ellipsis',
-  overflow: 'hidden',
-  whiteSpace: 'nowrap',
-  fontWeight: 'var(--unstable_DataGrid-headWeight)',
-  lineHeight: 'normal'
-});
-const ColumnHeaderInnerTitle = forwardRef(function ColumnHeaderInnerTitle(props, ref) {
-  // Tooltip adds aria-label to the props, which is not needed since the children prop is a string
-  // See https://github.com/mui/mui-x/pull/14482
-  const {
-      className
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const rootProps = useGridRootProps();
-  const classes = useUtilityClasses(rootProps);
-  return /*#__PURE__*/_jsx(GridColumnHeaderTitleRoot, _extends({
-    className: clsx(classes.root, className),
-    ownerState: rootProps
-  }, other, {
-    ref: ref
-  }));
-});
-// No React.memo here as if we display the sort icon, we need to recalculate the isOver
-function GridColumnHeaderTitle(props) {
-  const {
-    label,
-    description
-  } = props;
-  const rootProps = useGridRootProps();
-  const titleRef = React.useRef(null);
-  const [tooltip, setTooltip] = React.useState('');
-  const handleMouseOver = React.useCallback(() => {
-    if (!description && titleRef?.current) {
-      const isOver = isOverflown(titleRef.current);
-      if (isOver) {
-        setTooltip(label);
-      } else {
-        setTooltip('');
-      }
-    }
-  }, [description, label]);
-  return /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, _extends({
-    title: description || tooltip
-  }, rootProps.slotProps?.baseTooltip, {
-    children: /*#__PURE__*/_jsx(ColumnHeaderInnerTitle, {
-      onMouseOver: handleMouseOver,
-      ref: titleRef,
-      children: label
-    })
-  }));
-}
-process.env.NODE_ENV !== "production" ? GridColumnHeaderTitle.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  columnWidth: PropTypes.number.isRequired,
-  description: PropTypes.node,
-  label: PropTypes.string.isRequired
-} : void 0;
-export { GridColumnHeaderTitle };

package/modern/components/columnHeaders/GridGenericColumnHeaderItem.d.ts

@@ -1,32 +0,0 @@
-import * as React from 'react';
-import { GridStateColDef } from "../../models/colDef/gridColDef.js";
-import { GridSortDirection } from "../../models/gridSortModel.js";
-import { GridColumnHeaderSeparatorProps } from "./GridColumnHeaderSeparator.js";
-import { GridColumnGroup } from "../../models/gridColumnGrouping.js";
-interface GridGenericColumnHeaderItemProps extends Pick<GridStateColDef, 'headerClassName' | 'description' | 'resizable'> {
-  classes: Record<'root' | 'draggableContainer' | 'titleContainer' | 'titleContainerContent', string>;
-  colIndex: number;
-  columnMenuOpen: boolean;
-  height: number;
-  isResizing: boolean;
-  sortDirection: GridSortDirection;
-  sortIndex?: number;
-  filterItemsCounter?: number;
-  hasFocus?: boolean;
-  tabIndex: 0 | -1;
-  disableReorder?: boolean;
-  separatorSide?: GridColumnHeaderSeparatorProps['side'];
-  headerComponent?: React.ReactNode;
-  elementId: GridStateColDef['field'] | GridColumnGroup['groupId'];
-  isDraggable: boolean;
-  width: number;
-  columnMenuIconButton?: React.ReactNode;
-  columnMenu?: React.ReactNode;
-  columnTitleIconButtons?: React.ReactNode;
-  label: string;
-  draggableContainerProps?: Partial<React.HTMLProps<HTMLDivElement>>;
-  columnHeaderSeparatorProps?: Partial<GridColumnHeaderSeparatorProps>;
-  style?: React.CSSProperties;
-}
-declare const GridGenericColumnHeaderItem: React.ForwardRefExoticComponent<GridGenericColumnHeaderItemProps> | React.ForwardRefExoticComponent<GridGenericColumnHeaderItemProps & React.RefAttributes<HTMLDivElement>>;
-export { GridGenericColumnHeaderItem };

package/modern/components/columnHeaders/GridGenericColumnHeaderItem.js

@@ -1,93 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["classes", "columnMenuOpen", "colIndex", "height", "isResizing", "sortDirection", "hasFocus", "tabIndex", "separatorSide", "isDraggable", "headerComponent", "description", "elementId", "width", "columnMenuIconButton", "columnMenu", "columnTitleIconButtons", "headerClassName", "label", "resizable", "draggableContainerProps", "columnHeaderSeparatorProps", "style"];
-import * as React from 'react';
-import clsx from 'clsx';
-import { unstable_useForkRef as useForkRef } from '@mui/utils';
-import { forwardRef } from '@mui/x-internals/forwardRef';
-import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
-import { GridColumnHeaderTitle } from "./GridColumnHeaderTitle.js";
-import { GridColumnHeaderSeparator } from "./GridColumnHeaderSeparator.js";
-import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderItem(props, ref) {
-  const {
-      classes,
-      colIndex,
-      height,
-      isResizing,
-      sortDirection,
-      hasFocus,
-      tabIndex,
-      separatorSide,
-      isDraggable,
-      headerComponent,
-      description,
-      width,
-      columnMenuIconButton = null,
-      columnMenu = null,
-      columnTitleIconButtons = null,
-      headerClassName,
-      label,
-      resizable,
-      draggableContainerProps,
-      columnHeaderSeparatorProps,
-      style
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const apiRef = useGridPrivateApiContext();
-  const rootProps = useGridRootProps();
-  const headerCellRef = React.useRef(null);
-  const handleRef = useForkRef(headerCellRef, ref);
-  let ariaSort = 'none';
-  if (sortDirection != null) {
-    ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
-  }
-  React.useLayoutEffect(() => {
-    const columnMenuState = apiRef.current.state.columnMenu;
-    if (hasFocus && !columnMenuState.open) {
-      const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-      const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
-      }
-    }
-  }, [apiRef, hasFocus]);
-  return /*#__PURE__*/_jsxs("div", _extends({
-    className: clsx(classes.root, headerClassName),
-    style: _extends({}, style, {
-      width
-    }),
-    role: "columnheader",
-    tabIndex: tabIndex,
-    "aria-colindex": colIndex + 1,
-    "aria-sort": ariaSort
-  }, other, {
-    ref: handleRef,
-    children: [/*#__PURE__*/_jsxs("div", _extends({
-      className: classes.draggableContainer,
-      draggable: isDraggable,
-      role: "presentation"
-    }, draggableContainerProps, {
-      children: [/*#__PURE__*/_jsxs("div", {
-        className: classes.titleContainer,
-        role: "presentation",
-        children: [/*#__PURE__*/_jsx("div", {
-          className: classes.titleContainerContent,
-          children: headerComponent !== undefined ? headerComponent : /*#__PURE__*/_jsx(GridColumnHeaderTitle, {
-            label: label,
-            description: description,
-            columnWidth: width
-          })
-        }), columnTitleIconButtons]
-      }), columnMenuIconButton]
-    })), /*#__PURE__*/_jsx(GridColumnHeaderSeparator, _extends({
-      resizable: !rootProps.disableColumnResize && !!resizable,
-      resizing: isResizing,
-      height: height,
-      side: separatorSide
-    }, columnHeaderSeparatorProps)), columnMenu]
-  }));
-});
-export { GridGenericColumnHeaderItem };

package/modern/components/columnHeaders/GridIconButtonContainer.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-export type GridIconButtonContainerProps = React.HTMLAttributes<HTMLDivElement>;
-export declare const GridIconButtonContainer: React.ForwardRefExoticComponent<GridIconButtonContainerProps> | React.ForwardRefExoticComponent<GridIconButtonContainerProps & React.RefAttributes<HTMLDivElement>>;

package/modern/components/columnHeaders/GridIconButtonContainer.js

@@ -1,43 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["className"];
-import * as React from 'react';
-import clsx from 'clsx';
-import composeClasses from '@mui/utils/composeClasses';
-import { styled } from '@mui/system';
-import { forwardRef } from '@mui/x-internals/forwardRef';
-import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
-import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    classes
-  } = ownerState;
-  const slots = {
-    root: ['iconButtonContainer']
-  };
-  return composeClasses(slots, getDataGridUtilityClass, classes);
-};
-const GridIconButtonContainerRoot = styled('div', {
-  name: 'MuiDataGrid',
-  slot: 'IconButtonContainer',
-  overridesResolver: (props, styles) => styles.iconButtonContainer
-})(() => ({
-  display: 'flex',
-  visibility: 'hidden',
-  width: 0
-}));
-export const GridIconButtonContainer = forwardRef(function GridIconButtonContainer(props, ref) {
-  const {
-      className
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const rootProps = useGridRootProps();
-  const classes = useUtilityClasses(rootProps);
-  return /*#__PURE__*/_jsx(GridIconButtonContainerRoot, _extends({
-    className: clsx(classes.root, className),
-    ownerState: rootProps
-  }, other, {
-    ref: ref
-  }));
-});

package/modern/components/columnHeaders/index.d.ts

@@ -1,5 +0,0 @@
-export * from "./GridColumnHeaderItem.js";
-export * from "./GridColumnHeaderSeparator.js";
-export * from "./GridColumnHeaderSortIcon.js";
-export * from "./GridColumnHeaderFilterIconButton.js";
-export * from "./GridColumnHeaderTitle.js";

package/modern/components/columnHeaders/index.js

@@ -1,5 +0,0 @@
-export * from "./GridColumnHeaderItem.js";
-export * from "./GridColumnHeaderSeparator.js";
-export * from "./GridColumnHeaderSortIcon.js";
-export * from "./GridColumnHeaderFilterIconButton.js";
-export * from "./GridColumnHeaderTitle.js";

package/modern/components/columnSelection/GridCellCheckboxRenderer.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-import type { GridRenderCellParams } from '../../models/params/gridCellParams';
-declare const GridCellCheckboxForwardRef: React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>> | React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender> & React.RefAttributes<HTMLInputElement>>;
-export { GridCellCheckboxForwardRef };
-export declare const GridCellCheckboxRenderer: React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>> | React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender> & React.RefAttributes<HTMLInputElement>>;