@mui/material 5.0.4 → 5.1.1

package/modern/Popper/Popper.js

@@ -1,239 +1,42 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["anchorEl", "children", "disablePortal", "modifiers", "open", "placement", "popperOptions", "popperRef", "TransitionProps"],
-      _excluded2 = ["anchorEl", "children", "container", "disablePortal", "keepMounted", "modifiers", "open", "placement", "popperOptions", "popperRef", "style", "transition"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { createPopper } from '@popperjs/core';
-import { chainPropTypes, refType, HTMLElementType } from '@mui/utils';
+import PopperUnstyled from '@mui/base/PopperUnstyled';
+import { chainPropTypes, HTMLElementType, refType } from '@mui/utils';
 import { useThemeWithoutDefault as useTheme } from '@mui/system';
-import Portal from '../Portal';
-import ownerDocument from '../utils/ownerDocument';
-import useForkRef from '../utils/useForkRef';
-import useEnhancedEffect from '../utils/useEnhancedEffect';
 import { jsx as _jsx } from "react/jsx-runtime";
 
-function flipPlacement(placement, theme) {
-  const direction = theme && theme.direction || 'ltr';
-
-  if (direction === 'ltr') {
-    return placement;
-  }
-
-  switch (placement) {
-    case 'bottom-end':
-      return 'bottom-start';
-
-    case 'bottom-start':
-      return 'bottom-end';
-
-    case 'top-end':
-      return 'top-start';
-
-    case 'top-start':
-      return 'top-end';
-
-    default:
-      return placement;
-  }
-}
-
-function resolveAnchorEl(anchorEl) {
-  return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
-}
-
-const defaultPopperOptions = {};
-/* eslint-disable react/prop-types */
-
-const PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props, ref) {
-  const {
-    anchorEl,
-    children,
-    disablePortal,
-    modifiers,
-    open,
-    placement: initialPlacement,
-    popperOptions,
-    popperRef: popperRefProp,
-    TransitionProps
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
-  const tooltipRef = React.useRef(null);
-  const ownRef = useForkRef(tooltipRef, ref);
-  const popperRef = React.useRef(null);
-  const handlePopperRef = useForkRef(popperRef, popperRefProp);
-  const handlePopperRefRef = React.useRef(handlePopperRef);
-  useEnhancedEffect(() => {
-    handlePopperRefRef.current = handlePopperRef;
-  }, [handlePopperRef]);
-  React.useImperativeHandle(popperRefProp, () => popperRef.current, []);
-  const theme = useTheme();
-  const rtlPlacement = flipPlacement(initialPlacement, theme);
-  /**
-   * placement initialized from prop but can change during lifetime if modifiers.flip.
-   * modifiers.flip is essentially a flip for controlled/uncontrolled behavior
-   */
-
-  const [placement, setPlacement] = React.useState(rtlPlacement);
-  React.useEffect(() => {
-    if (popperRef.current) {
-      popperRef.current.forceUpdate();
-    }
-  });
-  useEnhancedEffect(() => {
-    if (!anchorEl || !open) {
-      return undefined;
-    }
-
-    const handlePopperUpdate = data => {
-      setPlacement(data.placement);
-    };
-
-    const resolvedAnchorEl = resolveAnchorEl(anchorEl);
-
-    if (process.env.NODE_ENV !== 'production') {
-      if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) {
-        const box = resolvedAnchorEl.getBoundingClientRect();
-
-        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
-          console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
-        }
-      }
-    }
-
-    let popperModifiers = [{
-      name: 'preventOverflow',
-      options: {
-        altBoundary: disablePortal
-      }
-    }, {
-      name: 'flip',
-      options: {
-        altBoundary: disablePortal
-      }
-    }, {
-      name: 'onUpdate',
-      enabled: true,
-      phase: 'afterWrite',
-      fn: ({
-        state
-      }) => {
-        handlePopperUpdate(state);
-      }
-    }];
-
-    if (modifiers != null) {
-      popperModifiers = popperModifiers.concat(modifiers);
-    }
-
-    if (popperOptions && popperOptions.modifiers != null) {
-      popperModifiers = popperModifiers.concat(popperOptions.modifiers);
-    }
-
-    const popper = createPopper(resolveAnchorEl(anchorEl), tooltipRef.current, _extends({
-      placement: rtlPlacement
-    }, popperOptions, {
-      modifiers: popperModifiers
-    }));
-    handlePopperRefRef.current(popper);
-    return () => {
-      popper.destroy();
-      handlePopperRefRef.current(null);
-    };
-  }, [anchorEl, disablePortal, modifiers, open, popperOptions, rtlPlacement]);
-  const childProps = {
-    placement
-  };
-
-  if (TransitionProps !== null) {
-    childProps.TransitionProps = TransitionProps;
-  }
-
-  return /*#__PURE__*/_jsx("div", _extends({
-    ref: ownRef,
-    role: "tooltip"
-  }, other, {
-    children: typeof children === 'function' ? children(childProps) : children
-  }));
-});
-/* eslint-enable react/prop-types */
-
 /**
- * Poppers rely on the 3rd party library [Popper.js](https://popper.js.org/docs/v2/) for positioning.
+ *
+ * Demos:
+ *
+ * - [Autocomplete](https://mui.com/components/autocomplete/)
+ * - [Menus](https://mui.com/components/menus/)
+ * - [Popper](https://mui.com/components/popper/)
+ *
+ * API:
+ *
+ * - [Popper API](https://mui.com/api/popper/)
  */
-
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(props, ref) {
-  const {
-    anchorEl,
-    children,
-    container: containerProp,
-    disablePortal = false,
-    keepMounted = false,
-    modifiers,
-    open,
-    placement = 'bottom',
-    popperOptions = defaultPopperOptions,
-    popperRef,
-    style,
-    transition = false
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded2);
-
-  const [exited, setExited] = React.useState(true);
-
-  const handleEnter = () => {
-    setExited(false);
-  };
-
-  const handleExited = () => {
-    setExited(true);
-  };
-
-  if (!keepMounted && !open && (!transition || exited)) {
-    return null;
-  } // If the container prop is provided, use that
-  // If the anchorEl prop is provided, use its parent body element as the container
-  // If neither are provided let the Modal take care of choosing the container
+  const theme = useTheme();
+  return /*#__PURE__*/_jsx(PopperUnstyled, _extends({
+    direction: theme?.direction
+  }, props, {
+    ref: ref
+  }));
+});
 
+function resolveAnchorEl(anchorEl) {
+  return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
+}
 
-  const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
-  return /*#__PURE__*/_jsx(Portal, {
-    disablePortal: disablePortal,
-    container: container,
-    children: /*#__PURE__*/_jsx(PopperTooltip, _extends({
-      anchorEl: anchorEl,
-      disablePortal: disablePortal,
-      modifiers: modifiers,
-      ref: ref,
-      open: transition ? !exited : open,
-      placement: placement,
-      popperOptions: popperOptions,
-      popperRef: popperRef
-    }, other, {
-      style: _extends({
-        // Prevents scroll issue, waiting for Popper.js to add this style once initiated.
-        position: 'fixed',
-        // Fix Popper.js display issue
-        top: 0,
-        left: 0,
-        display: !open && keepMounted && !transition ? 'none' : null
-      }, style),
-      TransitionProps: transition ? {
-        in: open,
-        onEnter: handleEnter,
-        onExited: handleExited
-      } : null,
-      children: children
-    }))
-  });
-});
 process.env.NODE_ENV !== "production" ? Popper.propTypes
 /* remove-proptypes */
 = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // |     To update them edit TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
 
   /**
@@ -340,11 +143,6 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes
    */
   popperRef: refType,
 
-  /**
-   * @ignore
-   */
-  style: PropTypes.object,
-
   /**
    * Help supporting a react-transition-group/Transition component.
    * @default false

package/modern/Portal/index.js

@@ -1 +1 @@
-export { default } from '@mui/core/Portal';
+export { default } from '@mui/base/Portal';

package/modern/Radio/Radio.js

@@ -4,7 +4,7 @@ const _excluded = ["checked", "checkedIcon", "color", "icon", "name", "onChange"
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { refType } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { alpha } from '@mui/system';
 import SwitchBase from '../internal/SwitchBase';
 import useThemeProps from '../styles/useThemeProps';
@@ -222,7 +222,7 @@ process.env.NODE_ENV !== "production" ? Radio.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The value of the component. The DOM API casts this to a string.

package/modern/Radio/radioClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getRadioUtilityClass(slot) {
   return generateUtilityClass('MuiRadio', slot);
 }

package/modern/RadioGroup/RadioGroupContext.js

@@ -1,9 +1,9 @@
 import * as React from 'react';
+
 /**
  * @ignore - internal component.
  */
-
-const RadioGroupContext = /*#__PURE__*/React.createContext();
+const RadioGroupContext = /*#__PURE__*/React.createContext(undefined);
 
 if (process.env.NODE_ENV !== 'production') {
   RadioGroupContext.displayName = 'RadioGroupContext';

package/modern/Rating/Rating.js

@@ -6,7 +6,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { chainPropTypes, visuallyHidden } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import useTheme from '../styles/useTheme';
 import { capitalize, useForkRef, useIsFocusVisible, useControlled, unstable_useId as useId } from '../utils';
 import Star from '../internal/svg-icons/Star';
@@ -536,7 +536,6 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
                 style: items.length - 1 === indexDecimal ? {} : {
                   width: itemDecimalValue === value ? `${(indexDecimal + 1) * precision * 100}%` : '0%',
                   overflow: 'hidden',
-                  zIndex: 1,
                   position: 'absolute'
                 }
               }
@@ -711,7 +710,7 @@ process.env.NODE_ENV !== "production" ? Rating.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The rating value.

package/modern/Rating/ratingClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getRatingUtilityClass(slot) {
   return generateUtilityClass('MuiRating', slot);
 }

package/modern/ScopedCssBaseline/ScopedCssBaseline.js

@@ -1,10 +1,10 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className", "component"];
+const _excluded = ["className", "component", "enableColorScheme"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import useThemeProps from '../styles/useThemeProps';
 import styled from '../styles/styled';
 import { html, body } from '../CssBaseline/CssBaseline';
@@ -26,15 +26,18 @@ const ScopedCssBaselineRoot = styled('div', {
   slot: 'Root',
   overridesResolver: (props, styles) => styles.root
 })(({
-  theme
-}) => _extends({}, html, body(theme), {
-  '& *, & *::before, & *::after': {
-    boxSizing: 'inherit'
-  },
-  '& strong, & b': {
-    fontWeight: theme.typography.fontWeightBold
-  }
-}));
+  theme,
+  ownerState
+}) => {
+  return _extends({}, html(theme, ownerState.enableColorScheme), body(theme), {
+    '& *, & *::before, & *::after': {
+      boxSizing: 'inherit'
+    },
+    '& strong, & b': {
+      fontWeight: theme.typography.fontWeightBold
+    }
+  });
+});
 const ScopedCssBaseline = /*#__PURE__*/React.forwardRef(function ScopedCssBaseline(inProps, ref) {
   const props = useThemeProps({
     props: inProps,
@@ -86,6 +89,13 @@ process.env.NODE_ENV !== "production" ? ScopedCssBaseline.propTypes
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: PropTypes.elementType
+  component: PropTypes.elementType,
+
+  /**
+   * Enable `color-scheme` css property to use `theme.palette.mode`.
+   * For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
+   * For browser support, check out https://caniuse.com/?search=color-scheme
+   */
+  enableColorScheme: PropTypes.bool
 } : void 0;
 export default ScopedCssBaseline;

package/modern/ScopedCssBaseline/scopedCssBaselineClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getScopedCssBaselineUtilityClass(slot) {
   return generateUtilityClass('MuiScopedCssBaseline', slot);
 }

package/modern/Select/Select.js

@@ -3,13 +3,11 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 
 var _Input, _FilledInput;
 
-const _excluded = ["autoWidth", "children", "classes", "className", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"],
-      _excluded2 = ["root"];
+const _excluded = ["autoWidth", "children", "classes", "className", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { deepmerge } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
 import SelectInput from './SelectInput';
 import formControlState from '../FormControl/formControlState';
 import useFormControl from '../FormControl/useFormControl';
@@ -20,17 +18,13 @@ import FilledInput from '../FilledInput';
 import OutlinedInput from '../OutlinedInput';
 import useThemeProps from '../styles/useThemeProps';
 import useForkRef from '../utils/useForkRef';
-import { getSelectUtilityClasses } from './selectClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 
 const useUtilityClasses = ownerState => {
   const {
     classes
   } = ownerState;
-  const slots = {
-    root: ['root']
-  };
-  return composeClasses(slots, getSelectUtilityClasses, classes);
+  return classes;
 };
 
 const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
@@ -84,9 +78,6 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   });
 
   const classes = useUtilityClasses(ownerState);
-
-  const otherClasses = _objectWithoutPropertiesLoose(classesProp, _excluded2);
-
   const inputComponentRef = useForkRef(ref, InputComponent.ref);
   return /*#__PURE__*/React.cloneElement(InputComponent, _extends({
     // Most of the logic is implemented in `SelectInput`.
@@ -114,13 +105,13 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
         id
       }, SelectDisplayProps)
     }, inputProps, {
-      classes: inputProps ? deepmerge(otherClasses, inputProps.classes) : otherClasses
+      classes: inputProps ? deepmerge(classes, inputProps.classes) : classes
     }, input ? input.props.inputProps : {})
   }, multiple && native && variant === 'outlined' ? {
     notched: true
   } : {}, {
     ref: inputComponentRef,
-    className: clsx(classes.root, InputComponent.props.className, className)
+    className: clsx(InputComponent.props.className, className)
   }, other));
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes
@@ -273,7 +264,7 @@ process.env.NODE_ENV !== "production" ? Select.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The `input` value. Providing an empty string will select no options.

package/modern/Select/SelectInput.js

@@ -6,7 +6,7 @@ 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/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { refType } from '@mui/utils';
 import ownerDocument from '../utils/ownerDocument';
 import capitalize from '../utils/capitalize';
@@ -31,6 +31,8 @@ const SelectSelect = styled('div', {
       [`&.${selectClasses.select}`]: styles.select
     }, {
       [`&.${selectClasses.select}`]: styles[ownerState.variant]
+    }, {
+      [`&.${selectClasses.multiple}`]: styles.multiple
     }];
   }
 })(nativeSelectSelectStyles, {
@@ -88,10 +90,11 @@ const useUtilityClasses = ownerState => {
     classes,
     variant,
     disabled,
+    multiple,
     open
   } = ownerState;
   const slots = {
-    select: ['select', variant, disabled && 'disabled'],
+    select: ['select', variant, disabled && 'disabled', multiple && 'multiple'],
     icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled'],
     nativeInput: ['nativeInput']
   };

package/modern/Select/selectClasses.js

@@ -1,6 +1,6 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSelectUtilityClasses(slot) {
   return generateUtilityClass('MuiSelect', slot);
 }
-const selectClasses = generateUtilityClasses('MuiSelect', ['root', 'select', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
+const selectClasses = generateUtilityClasses('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
 export default selectClasses;

package/modern/Skeleton/Skeleton.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import { keyframes, css } from '@mui/system';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { alpha, unstable_getUnit as getUnit, unstable_toUnitless as toUnitless } from '../styles';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
@@ -208,7 +208,7 @@ process.env.NODE_ENV !== "production" ? Skeleton.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The type of content that will be rendered.

package/modern/Skeleton/skeletonClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSkeletonUtilityClass(slot) {
   return generateUtilityClass('MuiSkeleton', slot);
 }

package/modern/Slider/Slider.js

@@ -5,8 +5,8 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { chainPropTypes } from '@mui/utils';
-import { generateUtilityClasses, isHostComponent } from '@mui/core';
-import SliderUnstyled, { SliderValueLabelUnstyled, sliderUnstyledClasses, getSliderUtilityClass } from '@mui/core/SliderUnstyled';
+import { generateUtilityClasses, isHostComponent } from '@mui/base';
+import SliderUnstyled, { SliderValueLabelUnstyled, sliderUnstyledClasses, getSliderUtilityClass } from '@mui/base/SliderUnstyled';
 import { alpha, lighten, darken } from '@mui/system';
 import useThemeProps from '../styles/useThemeProps';
 import styled, { slotShouldForwardProp } from '../styles/styled';
@@ -631,7 +631,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * Tab index attribute of the hidden `input` element.

package/modern/Snackbar/Snackbar.js

@@ -5,12 +5,12 @@ const _excluded = ["onEnter", "onExited"],
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
+import ClickAwayListener from '@mui/base/ClickAwayListener';
 import styled from '../styles/styled';
 import useTheme from '../styles/useTheme';
 import useThemeProps from '../styles/useThemeProps';
 import { duration } from '../styles/createTransitions';
-import ClickAwayListener from '../ClickAwayListener';
 import useEventCallback from '../utils/useEventCallback';
 import capitalize from '../utils/capitalize';
 import Grow from '../Grow';
@@ -377,7 +377,7 @@ process.env.NODE_ENV !== "production" ? Snackbar.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The component used for the transition.

package/modern/Snackbar/snackbarClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSnackbarUtilityClass(slot) {
   return generateUtilityClass('MuiSnackbar', slot);
 }

package/modern/SnackbarContent/SnackbarContent.js

@@ -4,7 +4,7 @@ const _excluded = ["action", "className", "message", "role"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { emphasize } from '@mui/system';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
@@ -141,6 +141,6 @@ process.env.NODE_ENV !== "production" ? SnackbarContent.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default SnackbarContent;

package/modern/SnackbarContent/snackbarContentClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSnackbarContentUtilityClass(slot) {
   return generateUtilityClass('MuiSnackbarContent', slot);
 }

package/modern/SpeedDial/SpeedDial.js

@@ -7,7 +7,7 @@ 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/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { duration } from '../styles/createTransitions';
@@ -529,7 +529,7 @@ process.env.NODE_ENV !== "production" ? SpeedDial.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The component used for the transition.

package/modern/SpeedDial/speedDialClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSpeedDialUtilityClass(slot) {
   return generateUtilityClass('MuiSpeedDial', slot);
 }