@mui/x-data-grid 9.6.0 → 9.8.0

package/components/columnHeaders/GridColumnHeaderItem.mjs

@@ -9,7 +9,7 @@ import capitalize from '@mui/utils/capitalize';
 import useId from '@mui/utils/useId';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { useRtl } from '@mui/system/RtlProvider';
-import { doesSupportPreventScroll } from "../../utils/doesSupportPreventScroll.mjs";
+import { focusElement } from "../../utils/focusElement.mjs";
 import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.mjs";
 import { getColumnMenuItemKeys } from "../../hooks/features/columnMenu/getColumnMenuItemKeys.mjs";
 import { ColumnHeaderMenuIcon } from "./ColumnHeaderMenuIcon.mjs";
@@ -202,15 +202,7 @@ function GridColumnHeaderItem(props) {
       if (!elementToFocus) {
         return;
       }
-      if (doesSupportPreventScroll()) {
-        elementToFocus.focus({
-          preventScroll: true
-        });
-      } else {
-        const scrollPosition = apiRef.current.getScrollPosition();
-        elementToFocus.focus();
-        apiRef.current.scroll(scrollPosition);
-      }
+      focusElement(elementToFocus, apiRef);
     }
   }, [apiRef, hasFocus]);
   const headerClassName = typeof colDef.headerClassName === 'function' ? colDef.headerClassName({

package/components/columnHeaders/GridColumnHeaderSortIcon.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type GridColumnSortButtonProps } from "../GridColumnSortButton.mjs";
+import type { GridColumnSortButtonProps } from "../GridColumnSortButton.mjs";
 export interface GridColumnHeaderSortIconProps extends GridColumnSortButtonProps {}
 declare function GridColumnHeaderSortIconRaw(props: GridColumnHeaderSortIconProps): import("react/jsx-runtime").JSX.Element;
 declare namespace GridColumnHeaderSortIconRaw {

package/components/columnHeaders/GridColumnHeaderSortIcon.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type GridColumnSortButtonProps } from "../GridColumnSortButton.js";
+import type { GridColumnSortButtonProps } from "../GridColumnSortButton.js";
 export interface GridColumnHeaderSortIconProps extends GridColumnSortButtonProps {}
 declare function GridColumnHeaderSortIconRaw(props: GridColumnHeaderSortIconProps): import("react/jsx-runtime").JSX.Element;
 declare namespace GridColumnHeaderSortIconRaw {

package/components/columnHeaders/GridGenericColumnHeaderItem.d.mts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { GridStateColDef } from "../../models/colDef/gridColDef.mjs";
 import type { GridSortDirection } from "../../models/gridSortModel.mjs";
-import { type GridColumnHeaderSeparatorProps } from "./GridColumnHeaderSeparator.mjs";
+import type { GridColumnHeaderSeparatorProps } from "./GridColumnHeaderSeparator.mjs";
 import type { GridColumnGroup } from "../../models/gridColumnGrouping.mjs";
 interface GridGenericColumnHeaderItemProps extends Pick<GridStateColDef, 'headerClassName' | 'description' | 'resizable'> {
   classes: Record<'root' | 'draggableContainer' | 'titleContainer' | 'titleContainerContent', string>;

package/components/columnHeaders/GridGenericColumnHeaderItem.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { GridStateColDef } from "../../models/colDef/gridColDef.js";
 import type { GridSortDirection } from "../../models/gridSortModel.js";
-import { type GridColumnHeaderSeparatorProps } from "./GridColumnHeaderSeparator.js";
+import type { GridColumnHeaderSeparatorProps } from "./GridColumnHeaderSeparator.js";
 import type { GridColumnGroup } from "../../models/gridColumnGrouping.js";
 interface GridGenericColumnHeaderItemProps extends Pick<GridStateColDef, 'headerClassName' | 'description' | 'resizable'> {
   classes: Record<'root' | 'draggableContainer' | 'titleContainer' | 'titleContainerContent', string>;

package/components/columnsPanel/ColumnsPanelTrigger.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridSlotProps } from "../../models/index.mjs";
 export interface ColumnsPanelState {
   /**

package/components/columnsPanel/ColumnsPanelTrigger.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridSlotProps } from "../../models/index.js";
 export interface ColumnsPanelState {
   /**

package/components/columnsPanel/ColumnsPanelTrigger.js

@@ -51,9 +51,9 @@ const ColumnsPanelTrigger = exports.ColumnsPanelTrigger = (0, _forwardRef.forwar
   };
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
   const {
-    columnsPanelTriggerRef
+    triggers
   } = (0, _GridPanelContext.useGridPanelContext)();
-  const handleRef = (0, _useForkRef.default)(ref, columnsPanelTriggerRef);
+  const handleRef = (0, _useForkRef.default)(ref, triggers.columnsPanel.setRef);
   const handleClick = event => {
     if (open) {
       apiRef.current.hidePreferences();

package/components/columnsPanel/ColumnsPanelTrigger.mjs

@@ -43,9 +43,9 @@ const ColumnsPanelTrigger = forwardRef(function ColumnsPanelTrigger(props, ref)
   };
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
   const {
-    columnsPanelTriggerRef
+    triggers
   } = useGridPanelContext();
-  const handleRef = useForkRef(ref, columnsPanelTriggerRef);
+  const handleRef = useForkRef(ref, triggers.columnsPanel.setRef);
   const handleClick = event => {
     if (open) {
       apiRef.current.hidePreferences();

package/components/containers/GridFooterContainer.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 export type GridFooterContainerProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/containers/GridFooterContainer.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 export type GridFooterContainerProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/containers/GridOverlay.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type Theme, type SxProps } from '@mui/system';
+import type { Theme, SxProps } from '@mui/system';
 export type GridOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/containers/GridOverlay.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type Theme, type SxProps } from '@mui/system';
+import type { Theme, SxProps } from '@mui/system';
 export type GridOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/containers/GridToolbarContainer.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 export type GridToolbarContainerProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/containers/GridToolbarContainer.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 export type GridToolbarContainerProps = React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 };

package/components/export/ExportCsv.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridCsvExportOptions } from "../../models/gridExport.mjs";
 import type { GridSlotProps } from "../../models/index.mjs";
 export type ExportCsvProps = GridSlotProps['baseButton'] & {

package/components/export/ExportCsv.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridCsvExportOptions } from "../../models/gridExport.js";
 import type { GridSlotProps } from "../../models/index.js";
 export type ExportCsvProps = GridSlotProps['baseButton'] & {

package/components/export/ExportPrint.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridPrintExportOptions } from "../../models/gridExport.mjs";
 import type { GridSlotProps } from "../../models/index.mjs";
 export type ExportPrintProps = GridSlotProps['baseButton'] & {

package/components/export/ExportPrint.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridPrintExportOptions } from "../../models/gridExport.js";
 import type { GridSlotProps } from "../../models/index.js";
 export type ExportPrintProps = GridSlotProps['baseButton'] & {

package/components/filterPanel/FilterPanelTrigger.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridSlotProps } from "../../models/index.mjs";
 export interface FilterPanelState {
   /**

package/components/filterPanel/FilterPanelTrigger.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridSlotProps } from "../../models/index.js";
 export interface FilterPanelState {
   /**

package/components/filterPanel/FilterPanelTrigger.js

@@ -54,9 +54,9 @@ const FilterPanelTrigger = exports.FilterPanelTrigger = (0, _forwardRef.forwardR
   };
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
   const {
-    filterPanelTriggerRef
+    triggers
   } = (0, _GridPanelContext.useGridPanelContext)();
-  const handleRef = (0, _useForkRef.default)(ref, filterPanelTriggerRef);
+  const handleRef = (0, _useForkRef.default)(ref, triggers.filterPanel.setRef);
   const handleClick = event => {
     if (open) {
       apiRef.current.hidePreferences();

package/components/filterPanel/FilterPanelTrigger.mjs

@@ -46,9 +46,9 @@ const FilterPanelTrigger = forwardRef(function FilterPanelTrigger(props, ref) {
   };
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
   const {
-    filterPanelTriggerRef
+    triggers
   } = useGridPanelContext();
-  const handleRef = useForkRef(ref, filterPanelTriggerRef);
+  const handleRef = useForkRef(ref, triggers.filterPanel.setRef);
   const handleClick = event => {
     if (open) {
       apiRef.current.hidePreferences();

package/components/menu/columnMenu/GridColumnHeaderMenu.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type GridMenuProps } from "../GridMenu.mjs";
+import type { GridMenuProps } from "../GridMenu.mjs";
 export interface GridColumnHeaderMenuProps {
   columnMenuId?: string;
   columnMenuButtonId?: string;

package/components/menu/columnMenu/GridColumnHeaderMenu.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type GridMenuProps } from "../GridMenu.js";
+import type { GridMenuProps } from "../GridMenu.js";
 export interface GridColumnHeaderMenuProps {
   columnMenuId?: string;
   columnMenuButtonId?: string;

package/components/panel/GridColumnsPanel.d.mts

@@ -1,4 +1,4 @@
-import { type GridPanelWrapperProps } from "./GridPanelWrapper.mjs";
+import type { GridPanelWrapperProps } from "./GridPanelWrapper.mjs";
 export interface GridColumnsPanelProps extends GridPanelWrapperProps {}
 declare function GridColumnsPanel(props: GridColumnsPanelProps): import("react/jsx-runtime").JSX.Element;
 export { GridColumnsPanel };

package/components/panel/GridColumnsPanel.d.ts

@@ -1,4 +1,4 @@
-import { type GridPanelWrapperProps } from "./GridPanelWrapper.js";
+import type { GridPanelWrapperProps } from "./GridPanelWrapper.js";
 export interface GridColumnsPanelProps extends GridPanelWrapperProps {}
 declare function GridColumnsPanel(props: GridColumnsPanelProps): import("react/jsx-runtime").JSX.Element;
 export { GridColumnsPanel };

package/components/panel/GridPanelContent.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 declare function GridPanelContent(props: React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 }): import("react/jsx-runtime").JSX.Element;

package/components/panel/GridPanelContent.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 declare function GridPanelContent(props: React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 }): import("react/jsx-runtime").JSX.Element;

package/components/panel/GridPanelContext.d.mts

@@ -1,8 +1,14 @@
 import * as React from 'react';
+export interface GridPanelTrigger {
+  setRef: (instance: HTMLElement | null) => void;
+  element: HTMLElement | null;
+}
 export interface GridPanelContextValue {
-  columnsPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
-  filterPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
-  aiAssistantPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
+  triggers: {
+    filterPanel: GridPanelTrigger;
+    aiAssistantPanel: GridPanelTrigger;
+    columnsPanel: GridPanelTrigger;
+  };
 }
 export declare const GridPanelContext: React.Context<GridPanelContextValue | undefined>;
 export declare function useGridPanelContext(): GridPanelContextValue;

package/components/panel/GridPanelContext.d.ts

@@ -1,8 +1,14 @@
 import * as React from 'react';
+export interface GridPanelTrigger {
+  setRef: (instance: HTMLElement | null) => void;
+  element: HTMLElement | null;
+}
 export interface GridPanelContextValue {
-  columnsPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
-  filterPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
-  aiAssistantPanelTriggerRef: React.RefObject<HTMLButtonElement | null>;
+  triggers: {
+    filterPanel: GridPanelTrigger;
+    aiAssistantPanel: GridPanelTrigger;
+    columnsPanel: GridPanelTrigger;
+  };
 }
 export declare const GridPanelContext: React.Context<GridPanelContextValue | undefined>;
 export declare function useGridPanelContext(): GridPanelContextValue;

package/components/panel/GridPanelContext.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.GridPanelContext = void 0;
 exports.GridPanelContextProvider = GridPanelContextProvider;
 exports.useGridPanelContext = useGridPanelContext;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _formatErrorMessage2 = _interopRequireDefault(require("@mui/x-internals/formatErrorMessage"));
 var React = _interopRequireWildcard(require("react"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -24,14 +25,46 @@ function useGridPanelContext() {
 function GridPanelContextProvider({
   children
 }) {
-  const columnsPanelTriggerRef = React.useRef(null);
-  const filterPanelTriggerRef = React.useRef(null);
-  const aiAssistantPanelTriggerRef = React.useRef(null);
+  const [triggerElements, setTriggerElements] = React.useState({
+    columnsPanel: null,
+    filterPanel: null,
+    aiAssistantPanel: null
+  });
+  const updateTriggerElement = React.useCallback((key, instance) => {
+    setTriggerElements(prev => {
+      if (prev[key] === instance) {
+        return prev;
+      }
+      return (0, _extends2.default)({}, prev, {
+        [key]: instance
+      });
+    });
+  }, []);
+  const setColumnsPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('columnsPanel', instance);
+  }, [updateTriggerElement]);
+  const setFilterPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('filterPanel', instance);
+  }, [updateTriggerElement]);
+  const setAiAssistantPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('aiAssistantPanel', instance);
+  }, [updateTriggerElement]);
   const value = React.useMemo(() => ({
-    columnsPanelTriggerRef,
-    filterPanelTriggerRef,
-    aiAssistantPanelTriggerRef
-  }), []);
+    triggers: {
+      columnsPanel: {
+        element: triggerElements.columnsPanel,
+        setRef: setColumnsPanelTrigger
+      },
+      filterPanel: {
+        element: triggerElements.filterPanel,
+        setRef: setFilterPanelTrigger
+      },
+      aiAssistantPanel: {
+        element: triggerElements.aiAssistantPanel,
+        setRef: setAiAssistantPanelTrigger
+      }
+    }
+  }), [triggerElements, setColumnsPanelTrigger, setFilterPanelTrigger, setAiAssistantPanelTrigger]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridPanelContext.Provider, {
     value: value,
     children: children

package/components/panel/GridPanelContext.mjs

@@ -1,5 +1,6 @@
 'use client';
 
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _formatErrorMessage from "@mui/x-internals/formatErrorMessage";
 import * as React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -15,14 +16,46 @@ export function useGridPanelContext() {
 export function GridPanelContextProvider({
   children
 }) {
-  const columnsPanelTriggerRef = React.useRef(null);
-  const filterPanelTriggerRef = React.useRef(null);
-  const aiAssistantPanelTriggerRef = React.useRef(null);
+  const [triggerElements, setTriggerElements] = React.useState({
+    columnsPanel: null,
+    filterPanel: null,
+    aiAssistantPanel: null
+  });
+  const updateTriggerElement = React.useCallback((key, instance) => {
+    setTriggerElements(prev => {
+      if (prev[key] === instance) {
+        return prev;
+      }
+      return _extends({}, prev, {
+        [key]: instance
+      });
+    });
+  }, []);
+  const setColumnsPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('columnsPanel', instance);
+  }, [updateTriggerElement]);
+  const setFilterPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('filterPanel', instance);
+  }, [updateTriggerElement]);
+  const setAiAssistantPanelTrigger = React.useCallback(instance => {
+    updateTriggerElement('aiAssistantPanel', instance);
+  }, [updateTriggerElement]);
   const value = React.useMemo(() => ({
-    columnsPanelTriggerRef,
-    filterPanelTriggerRef,
-    aiAssistantPanelTriggerRef
-  }), []);
+    triggers: {
+      columnsPanel: {
+        element: triggerElements.columnsPanel,
+        setRef: setColumnsPanelTrigger
+      },
+      filterPanel: {
+        element: triggerElements.filterPanel,
+        setRef: setFilterPanelTrigger
+      },
+      aiAssistantPanel: {
+        element: triggerElements.aiAssistantPanel,
+        setRef: setAiAssistantPanelTrigger
+      }
+    }
+  }), [triggerElements, setColumnsPanelTrigger, setFilterPanelTrigger, setAiAssistantPanelTrigger]);
   return /*#__PURE__*/_jsx(GridPanelContext.Provider, {
     value: value,
     children: children

package/components/panel/GridPanelFooter.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/material/styles';
+import type { SxProps, Theme } from '@mui/material/styles';
 declare function GridPanelFooter(props: React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 }): import("react/jsx-runtime").JSX.Element;

package/components/panel/GridPanelFooter.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/material/styles';
+import type { SxProps, Theme } from '@mui/material/styles';
 declare function GridPanelFooter(props: React.HTMLAttributes<HTMLDivElement> & {
   sx?: SxProps<Theme>;
 }): import("react/jsx-runtime").JSX.Element;

package/components/panel/GridPanelHeader.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 /**
  * @deprecated This component is not used internally and will be removed in a future major release.
  */

package/components/panel/GridPanelHeader.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SxProps, type Theme } from '@mui/system';
+import type { SxProps, Theme } from '@mui/system';
 /**
  * @deprecated This component is not used internally and will be removed in a future major release.
  */

package/components/panel/GridPanelWrapper.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type Theme } from '@mui/material/styles';
+import type { Theme } from '@mui/material/styles';
 import type { MUIStyledCommonProps } from '@mui/system';
 export interface GridPanelWrapperProps extends React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>>, MUIStyledCommonProps<Theme> {}
 declare const GridPanelWrapper: React.ForwardRefExoticComponent<GridPanelWrapperProps> | React.ForwardRefExoticComponent<GridPanelWrapperProps & React.RefAttributes<HTMLDivElement>>;

package/components/panel/GridPanelWrapper.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type Theme } from '@mui/material/styles';
+import type { Theme } from '@mui/material/styles';
 import type { MUIStyledCommonProps } from '@mui/system';
 export interface GridPanelWrapperProps extends React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>>, MUIStyledCommonProps<Theme> {}
 declare const GridPanelWrapper: React.ForwardRefExoticComponent<GridPanelWrapperProps> | React.ForwardRefExoticComponent<GridPanelWrapperProps & React.RefAttributes<HTMLDivElement>>;

package/components/panel/GridPreferencesPanel.js

@@ -20,21 +20,19 @@ function GridPreferencesPanel() {
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const preferencePanelState = (0, _useGridSelector.useGridSelector)(apiRef, _gridPreferencePanelSelector.gridPreferencePanelStateSelector);
   const {
-    columnsPanelTriggerRef,
-    filterPanelTriggerRef,
-    aiAssistantPanelTriggerRef
+    triggers
   } = (0, _GridPanelContext.useGridPanelContext)();
   const panelContent = apiRef.current.unstable_applyPipeProcessors('preferencePanel', null, preferencePanelState.openedPanelValue ?? _gridPreferencePanelsValue.GridPreferencePanelsValue.filters);
   let target = null;
   switch (preferencePanelState.openedPanelValue) {
     case _gridPreferencePanelsValue.GridPreferencePanelsValue.filters:
-      target = filterPanelTriggerRef.current;
+      target = triggers.filterPanel.element;
       break;
     case _gridPreferencePanelsValue.GridPreferencePanelsValue.columns:
-      target = columnsPanelTriggerRef.current;
+      target = triggers.columnsPanel.element;
       break;
     case _gridPreferencePanelsValue.GridPreferencePanelsValue.aiAssistant:
-      target = aiAssistantPanelTriggerRef.current;
+      target = triggers.aiAssistantPanel.element;
       break;
     default:
   }

package/components/panel/GridPreferencesPanel.mjs

@@ -13,21 +13,19 @@ export function GridPreferencesPanel() {
   const rootProps = useGridRootProps();
   const preferencePanelState = useGridSelector(apiRef, gridPreferencePanelStateSelector);
   const {
-    columnsPanelTriggerRef,
-    filterPanelTriggerRef,
-    aiAssistantPanelTriggerRef
+    triggers
   } = useGridPanelContext();
   const panelContent = apiRef.current.unstable_applyPipeProcessors('preferencePanel', null, preferencePanelState.openedPanelValue ?? GridPreferencePanelsValue.filters);
   let target = null;
   switch (preferencePanelState.openedPanelValue) {
     case GridPreferencePanelsValue.filters:
-      target = filterPanelTriggerRef.current;
+      target = triggers.filterPanel.element;
       break;
     case GridPreferencePanelsValue.columns:
-      target = columnsPanelTriggerRef.current;
+      target = triggers.columnsPanel.element;
       break;
     case GridPreferencePanelsValue.aiAssistant:
-      target = aiAssistantPanelTriggerRef.current;
+      target = triggers.aiAssistantPanel.element;
       break;
     default:
   }

package/components/panel/filterPanel/GridFilterForm.d.mts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { type GridFilterItem, GridLogicOperator } from "../../../models/gridFilterItem.mjs";
+import { GridLogicOperator } from "../../../models/gridFilterItem.mjs";
+import type { GridFilterItem } from "../../../models/gridFilterItem.mjs";
 import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridColDef.mjs";
 export interface FilterColumnsArgs {
   field: GridColDef['field'];

package/components/panel/filterPanel/GridFilterForm.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { type GridFilterItem, GridLogicOperator } from "../../../models/gridFilterItem.js";
+import { GridLogicOperator } from "../../../models/gridFilterItem.js";
+import type { GridFilterItem } from "../../../models/gridFilterItem.js";
 import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridColDef.js";
 export interface FilterColumnsArgs {
   field: GridColDef['field'];

package/components/panel/filterPanel/GridFilterPanel.d.mts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { SxProps, Theme } from '@mui/material/styles';
-import { type GridFilterItem } from "../../../models/gridFilterItem.mjs";
-import { type GridFilterFormProps } from "./GridFilterForm.mjs";
+import type { GridFilterItem } from "../../../models/gridFilterItem.mjs";
+import type { GridFilterFormProps } from "./GridFilterForm.mjs";
 import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridColDef.mjs";
 export interface GetColumnForNewFilterArgs {
   currentFilters: GridFilterItem[];

package/components/panel/filterPanel/GridFilterPanel.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { SxProps, Theme } from '@mui/material/styles';
-import { type GridFilterItem } from "../../../models/gridFilterItem.js";
-import { type GridFilterFormProps } from "./GridFilterForm.js";
+import type { GridFilterItem } from "../../../models/gridFilterItem.js";
+import type { GridFilterFormProps } from "./GridFilterForm.js";
 import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridColDef.js";
 export interface GetColumnForNewFilterArgs {
   currentFilters: GridFilterItem[];

package/components/quickFilter/QuickFilter.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
-import { type QuickFilterState } from "./QuickFilterContext.mjs";
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { QuickFilterState } from "./QuickFilterContext.mjs";
 import type { GridFilterModel } from "../../models/index.mjs";
 export type QuickFilterProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'className'> & {
   /**

package/components/quickFilter/QuickFilter.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
-import { type QuickFilterState } from "./QuickFilterContext.js";
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { QuickFilterState } from "./QuickFilterContext.js";
 import type { GridFilterModel } from "../../models/index.js";
 export type QuickFilterProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'className'> & {
   /**

package/components/quickFilter/QuickFilterClear.d.mts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import type { RenderProp } from '@mui/x-internals/useComponentRenderer';
 import type { GridSlotProps } from "../../models/index.mjs";
-import { type QuickFilterState } from "./QuickFilterContext.mjs";
+import type { QuickFilterState } from "./QuickFilterContext.mjs";
 export type QuickFilterClearProps = Omit<GridSlotProps['baseIconButton'], 'className'> & {
   /**
    * A function to customize rendering of the component.