@mui/material 6.0.0-alpha.9 → 6.0.0-beta.1

package/node/InputAdornment/InputAdornment.js

@@ -15,12 +15,12 @@ var _Typography = _interopRequireDefault(require("../Typography"));
 var _FormControlContext = _interopRequireDefault(require("../FormControl/FormControlContext"));
 var _useFormControl = _interopRequireDefault(require("../FormControl/useFormControl"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _inputAdornmentClasses = _interopRequireWildcard(require("./inputAdornmentClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _span;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiInputAdornment');
 const overridesResolver = (props, styles) => {
   const {
     ownerState
@@ -49,8 +49,6 @@ const InputAdornmentRoot = (0, _zeroStyled.styled)('div', {
   theme
 }) => ({
   display: 'flex',
-  height: '0.01em',
-  // Fix IE11 flexbox alignment. To remove at some point.
   maxHeight: '2em',
   alignItems: 'center',
   whiteSpace: 'nowrap',
@@ -88,7 +86,7 @@ const InputAdornmentRoot = (0, _zeroStyled.styled)('div', {
   }]
 }));
 const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiInputAdornment'
   });

package/node/InputBase/InputBase.js

@@ -12,23 +12,23 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _elementTypeAcceptingRef = _interopRequireDefault(require("@mui/utils/elementTypeAcceptingRef"));
 var _refType = _interopRequireDefault(require("@mui/utils/refType"));
-var _base = require("@mui/base");
-var _utils = require("@mui/base/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _TextareaAutosize = _interopRequireDefault(require("../TextareaAutosize"));
+var _isHostComponent = _interopRequireDefault(require("../utils/isHostComponent"));
 var _formControlState = _interopRequireDefault(require("../FormControl/formControlState"));
 var _FormControlContext = _interopRequireDefault(require("../FormControl/FormControlContext"));
 var _useFormControl = _interopRequireDefault(require("../FormControl/useFormControl"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 var _useEnhancedEffect = _interopRequireDefault(require("../utils/useEnhancedEffect"));
-var _GlobalStyles = _interopRequireDefault(require("../GlobalStyles"));
-var _utils2 = require("./utils");
+var _utils = require("./utils");
 var _inputBaseClasses = _interopRequireWildcard(require("./inputBaseClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
+var _InputGlobalStyles;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiInputBase');
 const rootOverridesResolver = (props, styles) => {
   const {
     ownerState
@@ -154,15 +154,10 @@ const InputBaseInput = exports.InputBaseInput = (0, _zeroStyled.styled)('input',
     display: 'block',
     // Make the flex item shrink with Firefox
     minWidth: 0,
-    width: '100%',
-    // Fix IE11 width issue
-    animationName: 'mui-auto-fill-cancel',
-    animationDuration: '10ms',
+    flexGrow: 1,
     '&::-webkit-input-placeholder': placeholder,
     '&::-moz-placeholder': placeholder,
     // Firefox 19+
-    '&:-ms-input-placeholder': placeholder,
-    // IE11
     '&::-ms-input-placeholder': placeholder,
     // Edge
     '&:focus': {
@@ -181,15 +176,11 @@ const InputBaseInput = exports.InputBaseInput = (0, _zeroStyled.styled)('input',
       '&::-webkit-input-placeholder': placeholderHidden,
       '&::-moz-placeholder': placeholderHidden,
       // Firefox 19+
-      '&:-ms-input-placeholder': placeholderHidden,
-      // IE11
       '&::-ms-input-placeholder': placeholderHidden,
       // Edge
       '&:focus::-webkit-input-placeholder': placeholderVisible,
       '&:focus::-moz-placeholder': placeholderVisible,
       // Firefox 19+
-      '&:focus:-ms-input-placeholder': placeholderVisible,
-      // IE11
       '&:focus::-ms-input-placeholder': placeholderVisible // Edge
     },
     [`&.${_inputBaseClasses.default.disabled}`]: {
@@ -197,11 +188,19 @@ const InputBaseInput = exports.InputBaseInput = (0, _zeroStyled.styled)('input',
       // Reset iOS opacity
       WebkitTextFillColor: (theme.vars || theme).palette.text.disabled // Fix opacity Safari bug
     },
-    '&:-webkit-autofill': {
-      animationDuration: '5000s',
-      animationName: 'mui-auto-fill'
-    },
     variants: [{
+      props: ({
+        ownerState
+      }) => !ownerState.disableInjectingGlobalStyles,
+      style: {
+        animationName: 'mui-auto-fill-cancel',
+        animationDuration: '10ms',
+        '&:-webkit-autofill': {
+          animationDuration: '5000s',
+          animationName: 'mui-auto-fill'
+        }
+      }
+    }, {
       props: {
         size: 'small'
       },
@@ -228,17 +227,15 @@ const InputBaseInput = exports.InputBaseInput = (0, _zeroStyled.styled)('input',
     }]
   };
 });
-const inputGlobalStyles = /*#__PURE__*/(0, _jsxRuntime.jsx)(_GlobalStyles.default, {
-  styles: {
-    '@keyframes mui-auto-fill': {
-      from: {
-        display: 'block'
-      }
-    },
-    '@keyframes mui-auto-fill-cancel': {
-      from: {
-        display: 'block'
-      }
+const InputGlobalStyles = (0, _zeroStyled.globalCss)({
+  '@keyframes mui-auto-fill': {
+    from: {
+      display: 'block'
+    }
+  },
+  '@keyframes mui-auto-fill-cancel': {
+    from: {
+      display: 'block'
     }
   }
 });
@@ -250,7 +247,7 @@ const inputGlobalStyles = /*#__PURE__*/(0, _jsxRuntime.jsx)(_GlobalStyles.defaul
  */
 const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref) {
   var _slotProps$input;
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiInputBase'
   });
@@ -339,7 +336,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
   const onFilled = muiFormControl && muiFormControl.onFilled;
   const onEmpty = muiFormControl && muiFormControl.onEmpty;
   const checkDirty = React.useCallback(obj => {
-    if ((0, _utils2.isFilled)(obj)) {
+    if ((0, _utils.isFilled)(obj)) {
       if (onFilled) {
         onFilled();
       }
@@ -355,12 +352,6 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
     }
   }, [value, checkDirty, isControlled]);
   const handleFocus = event => {
-    // Fix a bug with IE11 where the focus/blur events are triggered
-    // while the component is disabled.
-    if (fcs.disabled) {
-      event.stopPropagation();
-      return;
-    }
     if (onFocus) {
       onFocus(event);
     }
@@ -443,7 +434,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
         ...inputProps
       };
     }
-    InputComponent = _base.TextareaAutosize;
+    InputComponent = _TextareaAutosize.default;
   }
   const handleAutoFill = event => {
     // Provide a fake value as Chrome might not let you access it for security reasons.
@@ -480,12 +471,14 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
     ...((_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input)
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, {
+    children: [!disableInjectingGlobalStyles && typeof InputGlobalStyles === 'function' && ( // For Emotion/Styled-components, InputGlobalStyles will be a function
+    // For Pigment CSS, this has no effect because the InputGlobalStyles will be null.
+    _InputGlobalStyles || (_InputGlobalStyles = /*#__PURE__*/(0, _jsxRuntime.jsx)(InputGlobalStyles, {}))), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, {
       ...rootProps,
       ref: ref,
       onClick: handleClick,
       ...other,
-      ...(!(0, _utils.isHostComponent)(Root) && {
+      ...(!(0, _isHostComponent.default)(Root) && {
         ownerState: {
           ...ownerState,
           ...rootProps.ownerState
@@ -513,7 +506,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
           onKeyUp: onKeyUp,
           type: type,
           ...inputProps,
-          ...(!(0, _utils.isHostComponent)(Input) && {
+          ...(!(0, _isHostComponent.default)(Input) && {
             as: InputComponent,
             ownerState: {
               ...ownerState,
@@ -570,8 +563,7 @@ process.env.NODE_ENV !== "production" ? InputBase.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. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    *
    * @default {}
    */
@@ -583,8 +575,7 @@ process.env.NODE_ENV !== "production" ? InputBase.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. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    *
    * @default {}
    */

package/node/InputLabel/InputLabel.js

@@ -16,11 +16,11 @@ var _FormLabel = _interopRequireWildcard(require("../FormLabel"));
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _rootShouldForwardProp = _interopRequireDefault(require("../styles/rootShouldForwardProp"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _inputLabelClasses = require("./inputLabelClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiInputLabel');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -178,7 +178,7 @@ const InputLabelRoot = (0, _zeroStyled.styled)(_FormLabel.default, {
   }]
 }));
 const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     name: 'MuiInputLabel',
     props: inProps
   });

package/node/LinearProgress/LinearProgress.js

@@ -13,12 +13,12 @@ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"
 var _colorManipulator = require("@mui/system/colorManipulator");
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _linearProgressClasses = require("./linearProgressClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiLinearProgress');
 const TRANSITION_DURATION = 4; // seconds
 const indeterminate1Keyframe = (0, _zeroStyled.keyframes)`
   0% {
@@ -340,7 +340,7 @@ const LinearProgressBar2 = (0, _zeroStyled.styled)('span', {
  * attribute to `true` on that region until it has finished loading.
  */
 const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiLinearProgress'
   });

package/node/Link/Link.js

@@ -12,18 +12,16 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _colorManipulator = require("@mui/system/colorManipulator");
 var _elementTypeAcceptingRef = _interopRequireDefault(require("@mui/utils/elementTypeAcceptingRef"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _isFocusVisible = _interopRequireDefault(require("@mui/utils/isFocusVisible"));
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _zeroStyled = require("../zero-styled");
-var _useIsFocusVisible = _interopRequireDefault(require("../utils/useIsFocusVisible"));
-var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _Typography = _interopRequireDefault(require("../Typography"));
 var _linkClasses = _interopRequireWildcard(require("./linkClasses"));
 var _getTextDecoration = _interopRequireWildcard(require("./getTextDecoration"));
-var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiLink');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -127,11 +125,11 @@ const LinkRoot = (0, _zeroStyled.styled)(_Typography.default, {
   };
 });
 const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiLink'
   });
-  const theme = (0, _useTheme.default)();
+  const theme = (0, _zeroStyled.useTheme)();
   const {
     className,
     color = 'primary',
@@ -144,17 +142,9 @@ const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
     sx,
     ...other
   } = props;
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef
-  } = (0, _useIsFocusVisible.default)();
   const [focusVisible, setFocusVisible] = React.useState(false);
-  const handlerRef = (0, _useForkRef.default)(ref, focusVisibleRef);
   const handleBlur = event => {
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
+    if (!(0, _isFocusVisible.default)(event.target)) {
       setFocusVisible(false);
     }
     if (onBlur) {
@@ -162,8 +152,7 @@ const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
     }
   };
   const handleFocus = event => {
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if ((0, _isFocusVisible.default)(event.target)) {
       setFocusVisible(true);
     }
     if (onFocus) {
@@ -186,7 +175,7 @@ const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
     component: component,
     onBlur: handleBlur,
     onFocus: handleFocus,
-    ref: handlerRef,
+    ref: ref,
     ownerState: ownerState,
     variant: variant,
     ...other,

package/node/List/List.js

@@ -11,12 +11,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _ListContext = _interopRequireDefault(require("./ListContext"));
 var _listClasses = require("./listClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiList');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -61,7 +61,7 @@ const ListRoot = (0, _zeroStyled.styled)('ul', {
   }]
 });
 const List = /*#__PURE__*/React.forwardRef(function List(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiList'
   });

package/node/ListItem/ListItem.js

@@ -9,12 +9,13 @@ exports.overridesResolver = exports.default = exports.ListItemRoot = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
-var _utils = require("@mui/base/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _elementTypeAcceptingRef = _interopRequireDefault(require("@mui/utils/elementTypeAcceptingRef"));
 var _chainPropTypes = _interopRequireDefault(require("@mui/utils/chainPropTypes"));
 var _colorManipulator = require("@mui/system/colorManipulator");
+var _isHostComponent = _interopRequireDefault(require("../utils/isHostComponent"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
 var _isMuiElement = _interopRequireDefault(require("../utils/isMuiElement"));
 var _useEnhancedEffect = _interopRequireDefault(require("../utils/useEnhancedEffect"));
@@ -26,7 +27,6 @@ var _ListItemSecondaryAction = _interopRequireDefault(require("../ListItemSecond
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItem');
 const overridesResolver = (props, styles) => {
   const {
     ownerState
@@ -184,7 +184,7 @@ const ListItemContainer = (0, _zeroStyled.styled)('li', {
  * Uses an additional container component if `ListItemSecondaryAction` is the last child.
  */
 const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItem'
   });
@@ -286,7 +286,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
         ...ContainerProps,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
           ...rootProps,
-          ...(!(0, _utils.isHostComponent)(Root) && {
+          ...(!(0, _isHostComponent.default)(Root) && {
             as: Component,
             ownerState: {
               ...ownerState,
@@ -305,7 +305,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
       ...rootProps,
       as: Component,
       ref: handleRef,
-      ...(!(0, _utils.isHostComponent)(Root) && {
+      ...(!(0, _isHostComponent.default)(Root) && {
         ownerState: {
           ...ownerState,
           ...rootProps.ownerState

package/node/ListItemAvatar/ListItemAvatar.js

@@ -12,11 +12,11 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _ListContext = _interopRequireDefault(require("../List/ListContext"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _listItemAvatarClasses = require("./listItemAvatarClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItemAvatar');
 const useUtilityClasses = ownerState => {
   const {
     alignItems,
@@ -53,7 +53,7 @@ const ListItemAvatarRoot = (0, _zeroStyled.styled)('div', {
  * A simple wrapper to apply `List` styles to an `Avatar`.
  */
 const ListItemAvatar = /*#__PURE__*/React.forwardRef(function ListItemAvatar(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItemAvatar'
   });

package/node/ListItemButton/ListItemButton.js

@@ -12,6 +12,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _colorManipulator = require("@mui/system/colorManipulator");
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _rootShouldForwardProp = _interopRequireDefault(require("../styles/rootShouldForwardProp"));
 var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
 var _useEnhancedEffect = _interopRequireDefault(require("../utils/useEnhancedEffect"));
@@ -21,7 +22,6 @@ var _listItemButtonClasses = _interopRequireWildcard(require("./listItemButtonCl
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItemButton');
 const overridesResolver = (props, styles) => {
   const {
     ownerState
@@ -131,7 +131,7 @@ const ListItemButtonRoot = (0, _zeroStyled.styled)(_ButtonBase.default, {
   }]
 }));
 const ListItemButton = /*#__PURE__*/React.forwardRef(function ListItemButton(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItemButton'
   });

package/node/ListItemIcon/ListItemIcon.js

@@ -11,12 +11,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _listItemIconClasses = require("./listItemIconClasses");
 var _ListContext = _interopRequireDefault(require("../List/ListContext"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItemIcon');
 const useUtilityClasses = ownerState => {
   const {
     alignItems,
@@ -57,7 +57,7 @@ const ListItemIconRoot = (0, _zeroStyled.styled)('div', {
  * A simple wrapper to apply `List` styles to an `Icon` or `SvgIcon`.
  */
 const ListItemIcon = /*#__PURE__*/React.forwardRef(function ListItemIcon(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItemIcon'
   });

package/node/ListItemSecondaryAction/ListItemSecondaryAction.js

@@ -11,12 +11,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _ListContext = _interopRequireDefault(require("../List/ListContext"));
 var _listItemSecondaryActionClasses = require("./listItemSecondaryActionClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItemSecondaryAction');
 const useUtilityClasses = ownerState => {
   const {
     disableGutters,
@@ -57,7 +57,7 @@ const ListItemSecondaryActionRoot = (0, _zeroStyled.styled)('div', {
  * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
  */
 const ListItemSecondaryAction = /*#__PURE__*/React.forwardRef(function ListItemSecondaryAction(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItemSecondaryAction'
   });

package/node/ListItemText/ListItemText.js

@@ -13,11 +13,11 @@ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"
 var _Typography = _interopRequireDefault(require("../Typography"));
 var _ListContext = _interopRequireDefault(require("../List/ListContext"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _listItemTextClasses = _interopRequireWildcard(require("./listItemTextClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListItemText');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -69,7 +69,7 @@ const ListItemTextRoot = (0, _zeroStyled.styled)('div', {
   }]
 });
 const ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListItemText'
   });

package/node/ListSubheader/ListSubheader.js

@@ -11,12 +11,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _listSubheaderClasses = require("./listSubheaderClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiListSubheader');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -91,7 +91,7 @@ const ListSubheaderRoot = (0, _zeroStyled.styled)('li', {
   }]
 }));
 const ListSubheader = /*#__PURE__*/React.forwardRef(function ListSubheader(inProps, ref) {
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiListSubheader'
   });

package/node/Menu/Menu.js

@@ -11,18 +11,18 @@ var _reactIs = require("react-is");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _utils = require("@mui/base/utils");
 var _HTMLElementType = _interopRequireDefault(require("@mui/utils/HTMLElementType"));
 var _RtlProvider = require("@mui/system/RtlProvider");
+var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
 var _MenuList = _interopRequireDefault(require("../MenuList"));
 var _Popover = _interopRequireWildcard(require("../Popover"));
 var _rootShouldForwardProp = _interopRequireDefault(require("../styles/rootShouldForwardProp"));
 var _zeroStyled = require("../zero-styled");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _menuClasses = require("./menuClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiMenu');
 const RTL_ORIGIN = {
   vertical: 'top',
   horizontal: 'right'
@@ -70,7 +70,7 @@ const MenuMenuList = (0, _zeroStyled.styled)(_MenuList.default, {
 });
 const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
   var _slots$paper, _slotProps$paper;
-  const props = useThemeProps({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiMenu'
   });
@@ -156,13 +156,13 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
   });
   const PaperSlot = (_slots$paper = slots.paper) != null ? _slots$paper : MenuPaper;
   const paperExternalSlotProps = (_slotProps$paper = slotProps.paper) != null ? _slotProps$paper : PaperProps;
-  const rootSlotProps = (0, _utils.useSlotProps)({
+  const rootSlotProps = (0, _useSlotProps.default)({
     elementType: slots.root,
     externalSlotProps: slotProps.root,
     ownerState,
     className: [classes.root, className]
   });
-  const paperSlotProps = (0, _utils.useSlotProps)({
+  const paperSlotProps = (0, _useSlotProps.default)({
     elementType: PaperSlot,
     externalSlotProps: paperExternalSlotProps,
     ownerState,
@@ -268,9 +268,7 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
    */
   PopoverClasses: _propTypes.default.object,
   /**
-   * The extra props for the slot components.
-   * You can override the existing props or add new ones.
-   *
+   * The props used for each slot inside.
    * @default {}
    */
   slotProps: _propTypes.default.shape({
@@ -279,7 +277,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
   }),
   /**
    * The components used for each slot inside.
-   *
    * @default {}
    */
   slots: _propTypes.default.shape({