[core] Replace @mui/base with @mui/utils + @mui/material

docs/data/data-grid/filtering-recipes/QuickFilterOutsideOfGrid.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Portal } from '@mui/base/Portal';
+import Portal from '@mui/material/Portal';
 import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import { DataGrid, GridToolbarQuickFilter, GridToolbar } from '@mui/x-data-grid';

docs/data/data-grid/filtering-recipes/QuickFilterOutsideOfGrid.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Portal } from '@mui/base/Portal';
+import Portal from '@mui/material/Portal';
 import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import { DataGrid, GridToolbarQuickFilter, GridToolbar } from '@mui/x-data-grid';

docs/data/date-pickers/custom-field/BrowserV6MultiInputRangeField.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

docs/data/date-pickers/custom-field/BrowserV6MultiInputRangeField.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Dayjs } from 'dayjs';
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

docs/data/date-pickers/custom-field/BrowserV6SingleInputRangeField.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import Box from '@mui/material/Box';
 import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';

docs/data/date-pickers/custom-field/BrowserV6SingleInputRangeField.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Dayjs } from 'dayjs';
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import Box from '@mui/material/Box';
 import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';

docs/data/date-pickers/custom-field/BrowserV7MultiInputRangeField.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import useForkRef from '@mui/utils/useForkRef';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { styled } from '@mui/material/styles';
 import Stack from '@mui/material/Stack';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

docs/data/date-pickers/custom-field/BrowserV7MultiInputRangeField.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Dayjs } from 'dayjs';
 import useForkRef from '@mui/utils/useForkRef';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { styled } from '@mui/material/styles';
 import Stack from '@mui/material/Stack';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

docs/data/date-pickers/custom-field/BrowserV7SingleInputRangeField.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import useForkRef from '@mui/utils/useForkRef';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { styled } from '@mui/material/styles';
 import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';

docs/data/date-pickers/custom-field/BrowserV7SingleInputRangeField.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Dayjs } from 'dayjs';
 import useForkRef from '@mui/utils/useForkRef';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { styled } from '@mui/material/styles';
 import IconButton from '@mui/material/IconButton';
 import InputAdornment from '@mui/material/InputAdornment';

docs/data/date-pickers/custom-field/JoyV6MultiInputRangeField.js

@@ -5,14 +5,14 @@ import {
   useColorScheme as useMaterialColorScheme,
   Experimental_CssVarsProvider as MaterialCssVarsProvider,
 } from '@mui/material/styles';
+import useSlotProps from '@mui/utils/useSlotProps';
 import {
   extendTheme as extendJoyTheme,
   useColorScheme,
   styled,
   CssVarsProvider,
   THEME_ID,
 } from '@mui/joy/styles';
-import { useSlotProps } from '@mui/base/utils';
 import Input from '@mui/joy/Input';
 import Stack from '@mui/joy/Stack';
 import FormControl from '@mui/joy/FormControl';

docs/data/date-pickers/custom-field/JoyV6MultiInputRangeField.tsx

@@ -5,14 +5,14 @@ import {
   useColorScheme as useMaterialColorScheme,
   Experimental_CssVarsProvider as MaterialCssVarsProvider,
 } from '@mui/material/styles';
+import useSlotProps from '@mui/utils/useSlotProps';
 import {
   extendTheme as extendJoyTheme,
   useColorScheme,
   styled,
   CssVarsProvider,
   THEME_ID,
 } from '@mui/joy/styles';
-import { useSlotProps } from '@mui/base/utils';
 import Input, { InputProps } from '@mui/joy/Input';
 import Stack, { StackProps } from '@mui/joy/Stack';
 import FormControl from '@mui/joy/FormControl';

docs/data/date-pickers/custom-field/JoyV6SingleInputRangeField.js

@@ -5,13 +5,13 @@ import {
   useColorScheme as useMaterialColorScheme,
   Experimental_CssVarsProvider as MaterialCssVarsProvider,
 } from '@mui/material/styles';
+import useSlotProps from '@mui/utils/useSlotProps';
 import {
   extendTheme as extendJoyTheme,
   useColorScheme,
   CssVarsProvider,
   THEME_ID,
 } from '@mui/joy/styles';
-import { useSlotProps } from '@mui/base/utils';
 import Input from '@mui/joy/Input';
 import FormControl from '@mui/joy/FormControl';
 import FormLabel from '@mui/joy/FormLabel';

docs/data/date-pickers/custom-field/JoyV6SingleInputRangeField.tsx

@@ -5,13 +5,13 @@ import {
   useColorScheme as useMaterialColorScheme,
   Experimental_CssVarsProvider as MaterialCssVarsProvider,
 } from '@mui/material/styles';
+import useSlotProps from '@mui/utils/useSlotProps';
 import {
   extendTheme as extendJoyTheme,
   useColorScheme,
   CssVarsProvider,
   THEME_ID,
 } from '@mui/joy/styles';
-import { useSlotProps } from '@mui/base/utils';
 import Input, { InputProps } from '@mui/joy/Input';
 import FormControl from '@mui/joy/FormControl';
 import FormLabel from '@mui/joy/FormLabel';

docs/package.json

@@ -66,7 +66,6 @@
     "date-fns-jalali": "^2.30.0-0",
     "dayjs": "^1.11.11",
     "doctrine": "^3.0.0",
-    "d3-scale-chromatic": "^3.1.0",
     "exceljs": "^4.4.0",
     "fg-loadcss": "^3.1.0",
     "jscodeshift": "0.16.1",

docs/pages/x/api/date-pickers/date-picker.json

@@ -236,7 +236,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/date-range-picker.json

@@ -202,7 +202,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/date-time-picker.json

@@ -264,7 +264,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/date-time-range-picker.json

@@ -253,7 +253,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/desktop-date-picker.json

@@ -232,7 +232,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/desktop-date-range-picker.json

@@ -198,7 +198,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     { "name": "field", "description": "", "class": null },

docs/pages/x/api/date-pickers/desktop-date-time-picker.json

@@ -260,7 +260,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/desktop-date-time-range-picker.json

@@ -249,7 +249,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/desktop-time-picker.json

@@ -181,7 +181,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

docs/pages/x/api/date-pickers/time-picker.json

@@ -185,7 +185,7 @@
     {
       "name": "desktopTrapFocus",
       "description": "Custom component for trapping the focus inside the views on desktop.",
-      "default": "FocusTrap from '@mui/base'.",
+      "default": "TrapFocus from '@mui/material'.",
       "class": null
     },
     {

packages/x-charts-pro/src/Heatmap/HeatmapItem.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@mui/material/styles';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import composeClasses from '@mui/utils/composeClasses';
 import { useItemHighlighted } from '@mui/x-charts/context';
 import { useInteractionItemProps, SeriesId } from '@mui/x-charts/internals';

packages/x-charts/src/BarChart/BarElement.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
 import { styled } from '@mui/material/styles';
 import generateUtilityClasses from '@mui/utils/generateUtilityClasses';

packages/x-charts/src/BarChart/BarLabel/BarLabelItem.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import PropTypes from 'prop-types';
 import { SlotComponentPropsFromProps } from '../../internals/SlotComponentPropsFromProps';
 import { useUtilityClasses } from './barLabelClasses';

packages/x-charts/src/ChartsLegend/ChartsLegend.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useSlotProps } from '@mui/base/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
+import composeClasses from '@mui/utils/composeClasses';
 import { useThemeProps, useTheme, Theme } from '@mui/material/styles';
 import { getSeriesToDisplay } from './utils';
 import { ChartsLegendClasses, getLegendUtilityClass } from './chartsLegendClasses';

packages/x-charts/src/ChartsLegend/LegendPerItem.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { NoSsr } from '@mui/base/NoSsr';
+import NoSsr from '@mui/material/NoSsr';
 import { useTheme, styled } from '@mui/material/styles';
 import { DrawingArea } from '../context/DrawingProvider';
 import { DefaultizedProps } from '../models/helpers';

packages/x-charts/src/ChartsTooltip/ChartsAxisTooltipContent.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SxProps, Theme } from '@mui/material/styles';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { AxisInteractionData } from '../context/InteractionProvider';
 import { useCartesianContext } from '../context/CartesianProvider';
 import { ChartSeriesDefaultized, ChartSeriesType } from '../models/seriesType/config';

packages/x-charts/src/ChartsTooltip/ChartsItemTooltipContent.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SxProps, Theme } from '@mui/material/styles';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import { ItemInteractionData } from '../context/InteractionProvider';
 import { ChartSeriesDefaultized, ChartSeriesType } from '../models/seriesType/config';
 import { ChartsTooltipClasses } from './chartsTooltipClasses';

packages/x-charts/src/ChartsTooltip/ChartsTooltip.tsx

@@ -2,9 +2,9 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
 import { styled, useThemeProps, SxProps, Theme } from '@mui/material/styles';
-import { Popper, PopperProps as BasePopperProps } from '@mui/base/Popper';
-import { NoSsr } from '@mui/base/NoSsr';
-import { useSlotProps } from '@mui/base/utils';
+import Popper, { PopperProps as BasePopperProps } from '@mui/material/Popper';
+import NoSsr from '@mui/material/NoSsr';
+import useSlotProps from '@mui/utils/useSlotProps';
 import {
   AxisInteractionData,
   InteractionContext,

packages/x-charts/src/ChartsXAxis/ChartsXAxis.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useSlotProps } from '@mui/base/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
+import composeClasses from '@mui/utils/composeClasses';
 import { useThemeProps, useTheme, Theme } from '@mui/material/styles';
 import { useCartesianContext } from '../context/CartesianProvider';
 import { useTicks, TickItemType } from '../hooks/useTicks';

packages/x-charts/src/ChartsYAxis/ChartsYAxis.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useSlotProps } from '@mui/base/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
+import composeClasses from '@mui/utils/composeClasses';
 import { useThemeProps, useTheme, Theme } from '@mui/material/styles';
 import { useCartesianContext } from '../context/CartesianProvider';
 import { useTicks } from '../hooks/useTicks';

packages/x-charts/src/LineChart/AreaElement.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
 import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 import { SlotComponentPropsFromProps } from '../internals/SlotComponentPropsFromProps';

packages/x-charts/src/LineChart/LineElement.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
-import { useSlotProps } from '@mui/base/utils';
+import useSlotProps from '@mui/utils/useSlotProps';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
 import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 import { SlotComponentPropsFromProps } from '../internals/SlotComponentPropsFromProps';

packages/x-data-grid-premium/src/components/GridAggregationHeader.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import { styled } from '@mui/material/styles';
 import {
   getDataGridUtilityClass,

packages/x-data-grid-premium/src/components/GridFooterCell.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { getDataGridUtilityClass, GridRenderCellParams } from '@mui/x-data-grid';
 import { styled, Theme } from '@mui/material/styles';
 import { SxProps } from '@mui/system';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import { useGridRootProps } from '../hooks/utils/useGridRootProps';
 import { DataGridPremiumProcessedProps } from '../models/dataGridPremiumProps';
 

packages/x-data-grid-premium/src/components/GridGroupingCriteriaCell.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import Box from '@mui/material/Box';
 import {
   useGridSelector,

packages/x-data-grid-pro/src/components/GridDataSourceTreeDataGroupingCell.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import Box from '@mui/material/Box';
 import Badge from '@mui/material/Badge';
 import {

packages/x-data-grid-pro/src/components/GridDetailPanelToggleCell.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import { getDataGridUtilityClass, useGridSelector, GridRenderCellParams } from '@mui/x-data-grid';
 import { useGridRootProps } from '../hooks/utils/useGridRootProps';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';

packages/x-data-grid-pro/src/components/GridDetailPanels.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
 import { getDataGridUtilityClass, useGridSelector, GridRowId } from '@mui/x-data-grid';
 import { GridDetailPanelsProps, EMPTY_DETAIL_PANELS } from '@mui/x-data-grid/internals';
 import { useGridPrivateApiContext } from '../hooks/utils/useGridPrivateApiContext';