@mui/material 5.15.10 → 5.15.11

package/legacy/TextField/TextField.js

@@ -5,8 +5,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
-import { refType, unstable_useId as useId } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import useId from '@mui/utils/useId';
+import refType from '@mui/utils/refType';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Input from '../Input';

package/legacy/ToggleButton/ToggleButton.js

@@ -7,8 +7,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { internal_resolveProps as resolveProps } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import resolveProps from '@mui/utils/resolveProps';
+import composeClasses from '@mui/utils/composeClasses';
 import { alpha } from '../styles';
 import ButtonBase from '../ButtonBase';
 import capitalize from '../utils/capitalize';

package/legacy/ToggleButtonGroup/ToggleButtonGroup.js

@@ -7,8 +7,8 @@ import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
-import { getValidReactChildren } from '@mui/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import getValidReactChildren from '@mui/utils/getValidReactChildren';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';

package/legacy/Toolbar/Toolbar.js

@@ -6,7 +6,7 @@ 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 } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import useThemeProps from '../styles/useThemeProps';
 import styled from '../styles/styled';
 import { getToolbarUtilityClass } from './toolbarClasses';

package/legacy/Tooltip/Tooltip.js

@@ -7,9 +7,11 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { elementAcceptingRef, unstable_useTimeout as useTimeout, unstable_Timeout as Timeout } from '@mui/utils';
-import { unstable_composeClasses as composeClasses, appendOwnerState } from '@mui/base';
-import { alpha } from '@mui/system';
+import useTimeout, { Timeout } from '@mui/utils/useTimeout';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
+import { appendOwnerState } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
 import styled from '../styles/styled';
 import useTheme from '../styles/useTheme';
 import useThemeProps from '../styles/useThemeProps';
@@ -334,7 +336,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
       ignoreNonTouchEvents.current = false;
     });
   });
-  var handleEnter = function handleEnter(event) {
+  var handleMouseOver = function handleMouseOver(event) {
     if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
       return;
     }
@@ -355,7 +357,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
       handleOpen(event);
     }
   };
-  var handleLeave = function handleLeave(event) {
+  var handleMouseLeave = function handleMouseLeave(event) {
     enterTimer.clear();
     leaveTimer.start(leaveDelay, function () {
       handleClose(event);
@@ -373,7 +375,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
     handleBlurVisible(event);
     if (isFocusVisibleRef.current === false) {
       setChildIsFocusVisible(false);
-      handleLeave(event);
+      handleMouseLeave(event);
     }
   };
   var handleFocus = function handleFocus(event) {
@@ -386,7 +388,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
     handleFocusVisible(event);
     if (isFocusVisibleRef.current === true) {
       setChildIsFocusVisible(true);
-      handleEnter(event);
+      handleMouseOver(event);
     }
   };
   var detectTouchStart = function detectTouchStart(event) {
@@ -396,8 +398,6 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
       childrenProps.onTouchStart(event);
     }
   };
-  var handleMouseOver = handleEnter;
-  var handleMouseLeave = handleLeave;
   var handleTouchStart = function handleTouchStart(event) {
     detectTouchStart(event);
     leaveTimer.clear();
@@ -408,7 +408,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
     document.body.style.WebkitUserSelect = 'none';
     touchTimer.start(enterTouchDelay, function () {
       document.body.style.WebkitUserSelect = prevUserSelect.current;
-      handleEnter(event);
+      handleMouseOver(event);
     });
   };
   var handleTouchEnd = function handleTouchEnd(event) {
@@ -778,7 +778,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes /* remove-proptypes */
   TransitionComponent: PropTypes.elementType,
   /**
    * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
    */
   TransitionProps: PropTypes.object
 } : void 0;

package/legacy/Typography/Typography.js

@@ -5,8 +5,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_extendSxProp as extendSxProp } from '@mui/system';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import { extendSxProp } from '@mui/system/styleFunctionSx';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';

package/legacy/Zoom/Zoom.js

@@ -5,7 +5,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { Transition } from 'react-transition-group';
-import { elementAcceptingRef } from '@mui/utils';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
 import useTheme from '../styles/useTheme';
 import { reflow, getTransitionProps } from '../transitions/utils';
 import useForkRef from '../utils/useForkRef';

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.10
+ * @mui/material v5.15.11
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/internal/SwitchBase.js

@@ -6,8 +6,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { refType } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
 import capitalize from '../utils/capitalize';
 import styled, { rootShouldForwardProp } from '../styles/styled';
 import useControlled from '../utils/useControlled';
@@ -185,7 +185,6 @@ process.env.NODE_ENV !== "production" ? SwitchBase.propTypes = {
   checkedIcon: PropTypes.node.isRequired,
   /**
    * Override or extend the styles applied to the component.
-   * See [CSS API](#css) below for more details.
    */
   classes: PropTypes.object,
   /**

package/legacy/styles/CssVarsProvider.js

@@ -4,7 +4,8 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 // @ts-ignore
 import _extends from "@babel/runtime/helpers/esm/extends";
-import { unstable_createCssVarsProvider as createCssVarsProvider, unstable_styleFunctionSx as styleFunctionSx } from '@mui/system';
+import { unstable_createCssVarsProvider as createCssVarsProvider } from '@mui/system';
+import styleFunctionSx from '@mui/system/styleFunctionSx';
 import experimental_extendTheme from './experimental_extendTheme';
 import createTypography from './createTypography';
 import excludeVariablesFromRoot from './excludeVariablesFromRoot';

package/legacy/styles/createMuiStrictModeTheme.js

@@ -1,4 +1,4 @@
-import { deepmerge } from '@mui/utils';
+import deepmerge from '@mui/utils/deepmerge';
 import createTheme from './createTheme';
 export default function createMuiStrictModeTheme(options) {
   for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {

package/legacy/styles/createPalette.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
-import { deepmerge } from '@mui/utils';
-import { darken, getContrastRatio, lighten } from '@mui/system';
+import deepmerge from '@mui/utils/deepmerge';
+import { darken, getContrastRatio, lighten } from '@mui/system/colorManipulator';
 import common from '../colors/common';
 import grey from '../colors/grey';
 import purple from '../colors/purple';

package/legacy/styles/createTheme.js

@@ -2,8 +2,9 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
-import { deepmerge } from '@mui/utils';
-import { createTheme as systemCreateTheme, unstable_defaultSxConfig as defaultSxConfig, unstable_styleFunctionSx as styleFunctionSx } from '@mui/system';
+import deepmerge from '@mui/utils/deepmerge';
+import styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';
+import systemCreateTheme from '@mui/system/createTheme';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
 import createMixins from './createMixins';
 import createPalette from './createPalette';

package/legacy/styles/createTypography.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import { deepmerge } from '@mui/utils';
+import deepmerge from '@mui/utils/deepmerge';
 function round(value) {
   return Math.round(value * 1e5) / 1e5;
 }

package/legacy/styles/experimental_extendTheme.js

@@ -2,8 +2,10 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { deepmerge } from '@mui/utils';
-import { private_safeColorChannel as safeColorChannel, private_safeAlpha as safeAlpha, private_safeDarken as safeDarken, private_safeLighten as safeLighten, private_safeEmphasize as safeEmphasize, unstable_createGetCssVar as systemCreateGetCssVar, unstable_defaultSxConfig as defaultSxConfig, unstable_styleFunctionSx as styleFunctionSx, unstable_prepareCssVars as prepareCssVars, hslToRgb } from '@mui/system';
+import deepmerge from '@mui/utils/deepmerge';
+import { unstable_createGetCssVar as systemCreateGetCssVar, unstable_prepareCssVars as prepareCssVars } from '@mui/system';
+import styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';
+import { private_safeColorChannel as safeColorChannel, private_safeAlpha as safeAlpha, private_safeDarken as safeDarken, private_safeLighten as safeLighten, private_safeEmphasize as safeEmphasize, hslToRgb } from '@mui/system/colorManipulator';
 import defaultShouldSkipGeneratingVar from './shouldSkipGeneratingVar';
 import createThemeWithoutVars from './createTheme';
 import getOverlayAlpha from './getOverlayAlpha';

package/legacy/styles/styled.js

@@ -1,6 +1,6 @@
 'use client';
 
-import { createStyled, shouldForwardProp } from '@mui/system';
+import createStyled, { shouldForwardProp } from '@mui/system/createStyled';
 import defaultTheme from './defaultTheme';
 import THEME_ID from './identifier';
 export var rootShouldForwardProp = function rootShouldForwardProp(prop) {

package/legacy/styles/useThemeProps.js

@@ -1,6 +1,6 @@
 'use client';
 
-import { useThemeProps as systemUseThemeProps } from '@mui/system';
+import systemUseThemeProps from '@mui/system/useThemeProps';
 import defaultTheme from './defaultTheme';
 import THEME_ID from './identifier';
 export default function useThemeProps(_ref) {

package/legacy/useMediaQuery/index.js

@@ -1,3 +1 @@
-'use client';
-
-export { default } from './useMediaQuery';
+export { default } from '@mui/system/useMediaQuery';

package/legacy/useMediaQuery/useMediaQueryTheme.js

@@ -1,6 +1,6 @@
 'use client';
 
-import useMediaQuery from './useMediaQuery';
+import useMediaQuery from '@mui/system/useMediaQuery';
 
 // TODO v5: to deprecate in v4.x and remove in v5
 export default function useMediaQueryTheme() {

package/legacy/usePagination/usePagination.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import { unstable_useControlled as useControlled } from '@mui/utils';
+import useControlled from '@mui/utils/useControlled';
 export default function usePagination() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   // keep default values in sync with @default tags in Pagination.propTypes

package/legacy/utils/capitalize.js

@@ -1,2 +1,2 @@
-import { unstable_capitalize as capitalize } from '@mui/utils';
+import capitalize from '@mui/utils/capitalize';
 export default capitalize;

package/legacy/utils/createChainedFunction.js

@@ -1,2 +1,2 @@
-import { unstable_createChainedFunction as createChainedFunction } from '@mui/utils';
+import createChainedFunction from '@mui/utils/createChainedFunction';
 export default createChainedFunction;

package/legacy/utils/debounce.js

@@ -1,2 +1,2 @@
-import { unstable_debounce as debounce } from '@mui/utils';
+import debounce from '@mui/utils/debounce';
 export default debounce;

package/legacy/utils/deprecatedPropType.js

@@ -1,2 +1,2 @@
-import { unstable_deprecatedPropType as deprecatedPropType } from '@mui/utils';
+import deprecatedPropType from '@mui/utils/deprecatedPropType';
 export default deprecatedPropType;

package/legacy/utils/getScrollbarSize.js

@@ -1,2 +1,2 @@
-import { unstable_getScrollbarSize as getScrollbarSize } from '@mui/utils';
+import getScrollbarSize from '@mui/utils/getScrollbarSize';
 export default getScrollbarSize;

package/legacy/utils/isMuiElement.js

@@ -1,2 +1,2 @@
-import { unstable_isMuiElement as isMuiElement } from '@mui/utils';
+import isMuiElement from '@mui/utils/isMuiElement';
 export default isMuiElement;

package/legacy/utils/ownerDocument.js

@@ -1,2 +1,2 @@
-import { unstable_ownerDocument as ownerDocument } from '@mui/utils';
+import ownerDocument from '@mui/utils/ownerDocument';
 export default ownerDocument;

package/legacy/utils/ownerWindow.js

@@ -1,2 +1,2 @@
-import { unstable_ownerWindow as ownerWindow } from '@mui/utils';
+import ownerWindow from '@mui/utils/ownerWindow';
 export default ownerWindow;

package/legacy/utils/requirePropFactory.js

@@ -1,2 +1,2 @@
-import { unstable_requirePropFactory as requirePropFactory } from '@mui/utils';
+import requirePropFactory from '@mui/utils/requirePropFactory';
 export default requirePropFactory;

package/legacy/utils/setRef.js

@@ -1,2 +1,2 @@
-import { unstable_setRef as setRef } from '@mui/utils';
+import setRef from '@mui/utils/setRef';
 export default setRef;

package/legacy/utils/shouldSpreadAdditionalProps.js

@@ -1,4 +1,4 @@
-import { isHostComponent } from '@mui/base';
+import { isHostComponent } from '@mui/base/utils';
 var shouldSpreadAdditionalProps = function shouldSpreadAdditionalProps(Slot) {
   return !Slot || !isHostComponent(Slot);
 };

package/legacy/utils/unsupportedProp.js

@@ -1,2 +1,2 @@
-import { unstable_unsupportedProp as unsupportedProp } from '@mui/utils';
+import unsupportedProp from '@mui/utils/unsupportedProp';
 export default unsupportedProp;

package/legacy/utils/useControlled.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useControlled as useControlled } from '@mui/utils';
+import useControlled from '@mui/utils/useControlled';
 export default useControlled;

package/legacy/utils/useEnhancedEffect.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 export default useEnhancedEffect;

package/legacy/utils/useEventCallback.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useEventCallback as useEventCallback } from '@mui/utils';
+import useEventCallback from '@mui/utils/useEventCallback';
 export default useEventCallback;

package/legacy/utils/useForkRef.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useForkRef as useForkRef } from '@mui/utils';
+import useForkRef from '@mui/utils/useForkRef';
 export default useForkRef;

package/legacy/utils/useId.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useId as useId } from '@mui/utils';
+import useId from '@mui/utils/useId';
 export default useId;

package/legacy/utils/useIsFocusVisible.js

@@ -1,4 +1,4 @@
 'use client';
 
-import { unstable_useIsFocusVisible as useIsFocusVisible } from '@mui/utils';
+import useIsFocusVisible from '@mui/utils/useIsFocusVisible';
 export default useIsFocusVisible;

package/legacy/utils/useSlot.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import { unstable_useForkRef as useForkRef } from '@mui/utils';
+import useForkRef from '@mui/utils/useForkRef';
 import { appendOwnerState, resolveComponentProps, mergeSlotProps } from '@mui/base/utils';
 /**
  * An internal function to create a Material UI slot.

package/modern/Accordion/Accordion.js

@@ -7,8 +7,8 @@ import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { chainPropTypes } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Collapse from '../Collapse';
@@ -174,7 +174,6 @@ const Accordion = /*#__PURE__*/React.forwardRef(function Accordion(inProps, ref)
     },
     ownerState
   });
-  delete transitionProps.ownerState;
   return /*#__PURE__*/_jsxs(AccordionRoot, _extends({
     className: clsx(classes.root, className),
     ref: ref,
@@ -282,7 +281,7 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes /* remove-proptypes
   TransitionComponent: PropTypes.elementType,
   /**
    * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
    * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    */
   TransitionProps: PropTypes.object

package/modern/AccordionActions/AccordionActions.js

@@ -6,7 +6,7 @@ const _excluded = ["className", "disableSpacing"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { getAccordionActionsUtilityClass } from './accordionActionsClasses';

package/modern/AccordionDetails/AccordionDetails.js

@@ -6,7 +6,7 @@ const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { getAccordionDetailsUtilityClass } from './accordionDetailsClasses';

package/modern/AccordionSummary/AccordionSummary.js

@@ -6,7 +6,7 @@ const _excluded = ["children", "className", "expandIcon", "focusVisibleClassName
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import ButtonBase from '../ButtonBase';

package/modern/Alert/Alert.js

@@ -6,10 +6,11 @@ const _excluded = ["action", "children", "className", "closeText", "color", "com
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { darken, lighten } from '@mui/system';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
+import useSlot from '../utils/useSlot';
 import capitalize from '../utils/capitalize';
 import Paper from '../Paper';
 import alertClasses, { getAlertUtilityClass } from './alertClasses';
@@ -156,10 +157,23 @@ const Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
     variant
   });
   const classes = useUtilityClasses(ownerState);
-  const AlertCloseButton = slots.closeButton ?? components.CloseButton ?? IconButton;
-  const AlertCloseIcon = slots.closeIcon ?? components.CloseIcon ?? CloseIcon;
-  const closeButtonProps = slotProps.closeButton ?? componentsProps.closeButton;
-  const closeIconProps = slotProps.closeIcon ?? componentsProps.closeIcon;
+  const externalForwardedProps = {
+    slots: _extends({
+      closeButton: components.CloseButton,
+      closeIcon: components.CloseIcon
+    }, slots),
+    slotProps: _extends({}, componentsProps, slotProps)
+  };
+  const [CloseButtonSlot, closeButtonProps] = useSlot('closeButton', {
+    elementType: IconButton,
+    externalForwardedProps,
+    ownerState
+  });
+  const [CloseIconSlot, closeIconProps] = useSlot('closeIcon', {
+    elementType: CloseIcon,
+    externalForwardedProps,
+    ownerState
+  });
   return /*#__PURE__*/_jsxs(AlertRoot, _extends({
     role: role,
     elevation: 0,
@@ -182,14 +196,14 @@ const Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
     }) : null, action == null && onClose ? /*#__PURE__*/_jsx(AlertAction, {
       ownerState: ownerState,
       className: classes.action,
-      children: /*#__PURE__*/_jsx(AlertCloseButton, _extends({
+      children: /*#__PURE__*/_jsx(CloseButtonSlot, _extends({
         size: "small",
         "aria-label": closeText,
         title: closeText,
         color: "inherit",
         onClick: onClose
       }, closeButtonProps, {
-        children: /*#__PURE__*/_jsx(AlertCloseIcon, _extends({
+        children: /*#__PURE__*/_jsx(CloseIconSlot, _extends({
           fontSize: "small"
         }, closeIconProps))
       }))
@@ -233,8 +247,7 @@ process.env.NODE_ENV !== "production" ? Alert.propTypes /* remove-proptypes */ =
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -246,8 +259,7 @@ process.env.NODE_ENV !== "production" ? Alert.propTypes /* remove-proptypes */ =
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -290,22 +302,15 @@ process.env.NODE_ENV !== "production" ? Alert.propTypes /* remove-proptypes */ =
    */
   severity: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'info', 'success', 'warning']), PropTypes.string]),
   /**
-   * The extra props for the slot components.
-   * You can override the existing props or add new ones.
-   *
-   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
-   *
+   * The props used for each slot inside.
    * @default {}
    */
   slotProps: PropTypes.shape({
-    closeButton: PropTypes.object,
-    closeIcon: PropTypes.object
+    closeButton: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    closeIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
   }),
   /**
    * The components used for each slot inside.
-   *
-   * This prop is an alias for the `components` prop, which will be deprecated in the future.
-   *
    * @default {}
    */
   slots: PropTypes.shape({

package/modern/AlertTitle/AlertTitle.js

@@ -6,7 +6,7 @@ const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Typography from '../Typography';

package/modern/AppBar/AppBar.js

@@ -6,7 +6,7 @@ const _excluded = ["className", "color", "enableColorOnDark", "position"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
+import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';

package/modern/Autocomplete/Autocomplete.js

@@ -8,9 +8,11 @@ const _excluded = ["autoComplete", "autoHighlight", "autoSelect", "blurOnSelect"
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { chainPropTypes, integerPropType } from '@mui/utils';
-import { unstable_composeClasses as composeClasses, useAutocomplete, createFilterOptions } from '@mui/base';
-import { alpha } from '@mui/system';
+import integerPropType from '@mui/utils/integerPropType';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import { useAutocomplete, createFilterOptions } from '@mui/base';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
 import Popper from '../Popper';
 import ListSubheader from '../ListSubheader';
 import Paper from '../Paper';
@@ -214,7 +216,8 @@ const AutocompleteEndAdornment = styled('div', {
   // We use a position absolute to support wrapping tags.
   position: 'absolute',
   right: 0,
-  top: 'calc(50% - 14px)' // Center vertically
+  top: '50%',
+  transform: 'translate(0, -50%)'
 });
 const AutocompleteClearIndicator = styled(IconButton, {
   name: 'MuiAutocomplete',