@mui/material 5.3.1 → 5.4.3

package/legacy/Select/Select.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 
-var _Input, _FilledInput;
+var _StyledInput, _StyledFilledInput;
 
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -17,6 +17,7 @@ import FilledInput from '../FilledInput';
 import OutlinedInput from '../OutlinedInput';
 import useThemeProps from '../styles/useThemeProps';
 import useForkRef from '../utils/useForkRef';
+import styled, { rootShouldForwardProp } from '../styles/styled';
 import { jsx as _jsx } from "react/jsx-runtime";
 
 var useUtilityClasses = function useUtilityClasses(ownerState) {
@@ -24,6 +25,19 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
   return classes;
 };
 
+var styledRootConfig = {
+  name: 'MuiSelect',
+  overridesResolver: function overridesResolver(props, styles) {
+    return styles.root;
+  },
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return rootShouldForwardProp(prop) && prop !== 'variant';
+  },
+  slot: 'Root'
+};
+var StyledInput = styled(Input, styledRootConfig)('');
+var StyledOutlinedInput = styled(OutlinedInput, styledRootConfig)('');
+var StyledFilledInput = styled(FilledInput, styledRootConfig)('');
 var Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   var props = useThemeProps({
     name: 'MuiSelect',
@@ -58,7 +72,7 @@ var Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
       renderValue = props.renderValue,
       SelectDisplayProps = props.SelectDisplayProps,
       _props$variant = props.variant,
-      variantProps = _props$variant === void 0 ? 'outlined' : _props$variant,
+      variantProp = _props$variant === void 0 ? 'outlined' : _props$variant,
       other = _objectWithoutProperties(props, ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"]);
 
   var inputComponent = native ? NativeSelectInput : SelectInput;
@@ -68,16 +82,17 @@ var Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     muiFormControl: muiFormControl,
     states: ['variant']
   });
-  var variant = fcs.variant || variantProps;
+  var variant = fcs.variant || variantProp;
   var InputComponent = input || {
-    standard: _Input || (_Input = /*#__PURE__*/_jsx(Input, {})),
-    outlined: /*#__PURE__*/_jsx(OutlinedInput, {
+    standard: _StyledInput || (_StyledInput = /*#__PURE__*/_jsx(StyledInput, {})),
+    outlined: /*#__PURE__*/_jsx(StyledOutlinedInput, {
       label: label
     }),
-    filled: _FilledInput || (_FilledInput = /*#__PURE__*/_jsx(FilledInput, {}))
+    filled: _StyledFilledInput || (_StyledFilledInput = /*#__PURE__*/_jsx(StyledFilledInput, {}))
   }[variant];
 
   var ownerState = _extends({}, props, {
+    variant: variant,
     classes: classesProp
   });
 
@@ -116,7 +131,8 @@ var Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     notched: true
   } : {}, {
     ref: inputComponentRef,
-    className: clsx(InputComponent.props.className, className)
+    className: clsx(InputComponent.props.className, className),
+    variant: variant
   }, other));
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes

package/legacy/Select/SelectInput.js

@@ -4,6 +4,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import _typeof from "@babel/runtime/helpers/esm/typeof";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
+
+var _span;
+
 import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
@@ -196,6 +199,10 @@ var SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref)
     }
   }, [autoFocus]);
   React.useEffect(function () {
+    if (!labelId) {
+      return undefined;
+    }
+
     var label = ownerDocument(displayRef.current).getElementById(labelId);
 
     if (label) {
@@ -295,7 +302,7 @@ var SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref)
         if (onChange) {
           // Redefine target to allow name and value to be read.
           // This allows seamless integration with the most popular form libraries.
-          // https://github.com/mui-org/material-ui/issues/13485#issuecomment-676048492
+          // https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
           // Clone the event to not override `target` of the original event.
           var nativeEvent = event.nativeEvent || event;
           var clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
@@ -504,16 +511,11 @@ var SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref)
       className: clsx(classes.select, className, SelectDisplayProps.className) // The id is required for proper a11y
       ,
       id: buttonId,
-      children: isEmpty(display) ?
-      /*#__PURE__*/
-      // notranslate needed while Google Translate will not fix zero-width space issue
-      // eslint-disable-next-line react/no-danger
-      _jsx("span", {
+      children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/_jsx("span", {
         className: "notranslate",
-        dangerouslySetInnerHTML: {
-          __html: '​'
-        }
-      }) : display
+        children: "\u200B"
+      })) : display
     })), /*#__PURE__*/_jsx(SelectNativeInput, _extends({
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,

package/legacy/Slide/Slide.js

@@ -7,7 +7,6 @@ import { elementAcceptingRef, HTMLElementType, chainPropTypes } from '@mui/utils
 import debounce from '../utils/debounce';
 import useForkRef from '../utils/useForkRef';
 import useTheme from '../styles/useTheme';
-import { duration, easing } from '../styles/createTransitions';
 import { reflow, getTransitionProps } from '../transitions/utils';
 import { ownerWindow } from '../utils'; // Translate the node so it can't be seen on the screen.
 // Later, we're going to translate the node back to its original location with `none`.
@@ -81,20 +80,22 @@ export function setTranslateValue(direction, node, containerProp) {
     node.style.transform = transform;
   }
 }
-var defaultEasing = {
-  enter: easing.easeOut,
-  exit: easing.sharp
-};
-var defaultTimeout = {
-  enter: duration.enteringScreen,
-  exit: duration.leavingScreen
-};
 /**
  * The Slide transition is used by the [Drawer](/components/drawers/) component.
  * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
  */
 
 var Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
+  var theme = useTheme();
+  var defaultEasing = {
+    enter: theme.transitions.easing.easeOut,
+    exit: theme.transitions.easing.sharp
+  };
+  var defaultTimeout = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
+
   var addEndListener = props.addEndListener,
       _props$appear = props.appear,
       appear = _props$appear === void 0 ? true : _props$appear,
@@ -118,7 +119,6 @@ var Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
       TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp,
       other = _objectWithoutProperties(props, ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]);
 
-  var theme = useTheme();
   var childrenRef = React.useRef(null);
   var handleRefIntermediary = useForkRef(_children.ref, childrenRef);
   var handleRef = useForkRef(handleRefIntermediary, ref);
@@ -308,8 +308,8 @@ process.env.NODE_ENV !== "production" ? Slide.propTypes
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
    * @default {
-   *   enter: easing.easeOut,
-   *   exit: easing.sharp,
+   *   enter: theme.transitions.easing.easeOut,
+   *   exit: theme.transitions.easing.sharp,
    * }
    */
   easing: PropTypes.oneOfType([PropTypes.shape({
@@ -361,8 +361,8 @@ process.env.NODE_ENV !== "production" ? Slide.propTypes
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
    * @default {
-   *   enter: duration.enteringScreen,
-   *   exit: duration.leavingScreen,
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
   timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({

package/legacy/Slider/Slider.js

@@ -707,7 +707,9 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
    * The size of the slider.
    * @default 'medium'
    */
-  size: PropTypes.oneOf(['small', 'medium']),
+  size: PropTypes
+  /* @typescript-to-proptypes-ignore */
+  .oneOfType([PropTypes.oneOf(['small', 'medium']), PropTypes.string]),
 
   /**
    * The granularity with which the slider can step through values. (A "discrete" slider.)

package/legacy/Snackbar/Snackbar.js

@@ -9,7 +9,6 @@ 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 useEventCallback from '../utils/useEventCallback';
 import capitalize from '../utils/capitalize';
 import Grow from '../Grow';
@@ -86,6 +85,11 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     props: inProps,
     name: 'MuiSnackbar'
   });
+  var theme = useTheme();
+  var defaultTransitionDuration = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   var action = props.action,
       _props$anchorOrigin = props.anchorOrigin;
   _props$anchorOrigin = _props$anchorOrigin === void 0 ? {
@@ -113,10 +117,7 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
       _props$TransitionComp = props.TransitionComponent,
       TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,
       _props$transitionDura = props.transitionDuration,
-      transitionDuration = _props$transitionDura === void 0 ? {
-    enter: duration.enteringScreen,
-    exit: duration.leavingScreen
-  } : _props$transitionDura,
+      transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura,
       _props$TransitionProp = props.TransitionProps;
   _props$TransitionProp = _props$TransitionProp === void 0 ? {} : _props$TransitionProp;
 
@@ -125,7 +126,6 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
       TransitionProps = _objectWithoutProperties(_props$TransitionProp, ["onEnter", "onExited"]),
       other = _objectWithoutProperties(props, ["action", "anchorOrigin", "autoHideDuration", "children", "className", "ClickAwayListenerProps", "ContentProps", "disableWindowBlurListener", "message", "onBlur", "onClose", "onFocus", "onMouseEnter", "onMouseLeave", "open", "resumeHideDuration", "TransitionComponent", "transitionDuration", "TransitionProps"]);
 
-  var theme = useTheme();
   var isRtl = theme.direction === 'rtl';
 
   var ownerState = _extends({}, props, {
@@ -289,7 +289,10 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       ownerState: ownerState,
-      ref: ref
+      ref: ref // ClickAwayListener adds an `onClick` prop which results in the alert not being announced.
+      // See https://github.com/mui-org/material-ui/issues/29080
+      ,
+      role: "presentation"
     }, other, {
       children: /*#__PURE__*/_jsx(TransitionComponent, _extends({
         appear: true,
@@ -447,8 +450,8 @@ process.env.NODE_ENV !== "production" ? Snackbar.propTypes
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
    * @default {
-   *   enter: duration.enteringScreen,
-   *   exit: duration.leavingScreen,
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
   transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({

package/legacy/SpeedDial/SpeedDial.js

@@ -9,7 +9,7 @@ import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
-import { duration } from '../styles/createTransitions';
+import useTheme from '../styles/useTheme';
 import Zoom from '../Zoom';
 import Fab from '../Fab';
 import capitalize from '../utils/capitalize';
@@ -132,6 +132,11 @@ var SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref) {
     props: inProps,
     name: 'MuiSpeedDial'
   });
+  var theme = useTheme();
+  var defaultTransitionDuration = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   var ariaLabel = props.ariaLabel,
       _props$FabProps = props.FabProps;
   _props$FabProps = _props$FabProps === void 0 ? {} : _props$FabProps;
@@ -157,10 +162,7 @@ var SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref) {
       _props$TransitionComp = props.TransitionComponent,
       TransitionComponent = _props$TransitionComp === void 0 ? Zoom : _props$TransitionComp,
       _props$transitionDura = props.transitionDuration,
-      transitionDuration = _props$transitionDura === void 0 ? {
-    enter: duration.enteringScreen,
-    exit: duration.leavingScreen
-  } : _props$transitionDura,
+      transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura,
       TransitionProps = props.TransitionProps,
       other = _objectWithoutProperties(props, ["ariaLabel", "FabProps", "children", "className", "direction", "hidden", "icon", "onBlur", "onClose", "onFocus", "onKeyDown", "onMouseEnter", "onMouseLeave", "onOpen", "open", "openIcon", "TransitionComponent", "transitionDuration", "TransitionProps"]);
 
@@ -541,8 +543,8 @@ process.env.NODE_ENV !== "production" ? SpeedDial.propTypes
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
    * @default {
-   *   enter: duration.enteringScreen,
-   *   exit: duration.leavingScreen,
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
   transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({

package/legacy/Step/StepContext.js

@@ -1,12 +1,20 @@
 import * as React from 'react';
+
 /**
- * @ignore - internal component.
+ * Provides information about the current step in Stepper.
  */
-
 var StepContext = /*#__PURE__*/React.createContext({});
 
 if (process.env.NODE_ENV !== 'production') {
   StepContext.displayName = 'StepContext';
 }
+/**
+ * Returns the current StepContext or an empty object if no StepContext
+ * has been defined in the component tree.
+ */
+
 
+export function useStepContext() {
+  return React.useContext(StepContext);
+}
 export default StepContext;

package/legacy/Step/index.js

@@ -1,3 +1,5 @@
 export { default } from './Step';
 export { default as stepClasses } from './stepClasses';
-export * from './stepClasses';
+export * from './stepClasses';
+export { default as StepContext } from './StepContext';
+export * from './StepContext';

package/legacy/SwipeableDrawer/SwipeArea.js

@@ -8,9 +8,7 @@ import styled from '../styles/styled';
 import capitalize from '../utils/capitalize';
 import { isHorizontal } from '../Drawer/Drawer';
 import { jsx as _jsx } from "react/jsx-runtime";
-var SwipeAreaRoot = styled('div', {
-  skipSx: true
-})(function (_ref) {
+var SwipeAreaRoot = styled('div')(function (_ref) {
   var theme = _ref.theme,
       ownerState = _ref.ownerState;
   return _extends({

package/legacy/SwipeableDrawer/SwipeableDrawer.js

@@ -10,7 +10,6 @@ import ownerDocument from '../utils/ownerDocument';
 import ownerWindow from '../utils/ownerWindow';
 import useEventCallback from '../utils/useEventCallback';
 import useEnhancedEffect from '../utils/useEnhancedEffect';
-import { duration } from '../styles/createTransitions';
 import useTheme from '../styles/useTheme';
 import { getTransitionProps } from '../transitions/utils';
 import SwipeArea from './SwipeArea'; // This value is closed to what browsers are using internally to
@@ -122,16 +121,16 @@ function computeHasNativeHandler(_ref) {
 }
 
 var iOS = typeof navigator !== 'undefined' && /iPad|iPhone|iPod/.test(navigator.userAgent);
-var transitionDurationDefault = {
-  enter: duration.enteringScreen,
-  exit: duration.leavingScreen
-};
 var SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(inProps, ref) {
   var props = useThemeProps({
     name: 'MuiSwipeableDrawer',
     props: inProps
   });
   var theme = useTheme();
+  var transitionDurationDefault = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   var _props$anchor = props.anchor,
       anchor = _props$anchor === void 0 ? 'left' : _props$anchor,
       _props$disableBackdro = props.disableBackdropTransition,
@@ -623,7 +622,10 @@ process.env.NODE_ENV !== "production" ? SwipeableDrawer.propTypes
   /**
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
-   * @default { enter: duration.enteringScreen, exit: duration.leavingScreen }
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
    */
   transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
     appear: PropTypes.number,

package/legacy/TextField/TextField.js

@@ -197,7 +197,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref) {
     variant: variant,
     ownerState: ownerState
   }, other, {
-    children: [label && /*#__PURE__*/_jsx(InputLabel, _extends({
+    children: [label != null && label !== '' && /*#__PURE__*/_jsx(InputLabel, _extends({
       htmlFor: id,
       id: inputLabelId
     }, InputLabelProps, {

package/legacy/ToggleButton/ToggleButton.js

@@ -196,12 +196,18 @@ process.env.NODE_ENV !== "production" ? ToggleButton.propTypes
   fullWidth: PropTypes.bool,
 
   /**
-   * @ignore
+   * Callback fired when the state changes.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
    */
   onChange: PropTypes.func,
 
   /**
-   * @ignore
+   * Callback fired when the button is clicked.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
    */
   onClick: PropTypes.func,
 

package/legacy/Zoom/Zoom.js

@@ -4,7 +4,6 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { Transition } from 'react-transition-group';
 import { elementAcceptingRef } from '@mui/utils';
-import { duration } from '../styles/createTransitions';
 import useTheme from '../styles/useTheme';
 import { reflow, getTransitionProps } from '../transitions/utils';
 import useForkRef from '../utils/useForkRef';
@@ -17,10 +16,6 @@ var styles = {
     transform: 'none'
   }
 };
-var defaultTimeout = {
-  enter: duration.enteringScreen,
-  exit: duration.leavingScreen
-};
 /**
  * The Zoom transition can be used for the floating variant of the
  * [Button](/components/buttons/#floating-action-buttons) component.
@@ -28,6 +23,12 @@ var defaultTimeout = {
  */
 
 var Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
+  var theme = useTheme();
+  var defaultTimeout = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
+
   var addEndListener = props.addEndListener,
       _props$appear = props.appear,
       appear = _props$appear === void 0 ? true : _props$appear,
@@ -47,7 +48,6 @@ var Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
       TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp,
       other = _objectWithoutProperties(props, ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]);
 
-  var theme = useTheme();
   var nodeRef = React.useRef(null);
   var foreignRef = useForkRef(_children.ref, ref);
   var handleRef = useForkRef(nodeRef, foreignRef);
@@ -214,8 +214,8 @@ process.env.NODE_ENV !== "production" ? Zoom.propTypes
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
    * @default {
-   *   enter: duration.enteringScreen,
-   *   exit: duration.leavingScreen,
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
   timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.3.1
+/** @license MUI v5.4.3
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -8,7 +8,6 @@ import * as colors from './colors';
 export { colors };
 export * from './styles';
 export * from './utils';
-export * from '@mui/base';
 export { default as Accordion } from './Accordion';
 export * from './Accordion';
 export { default as AccordionActions } from './AccordionActions';
@@ -175,6 +174,8 @@ export { default as Popover } from './Popover';
 export * from './Popover';
 export { default as Popper } from './Popper';
 export * from './Popper';
+export { default as Portal } from './Portal';
+export * from './Portal';
 export { default as Radio } from './Radio';
 export * from './Radio';
 export { default as RadioGroup } from './RadioGroup';
@@ -273,4 +274,8 @@ export * from './Zoom'; // createFilterOptions is exported from Autocomplete
 export { default as useAutocomplete } from './useAutocomplete';
 export { default as GlobalStyles } from './GlobalStyles';
 export * from './GlobalStyles';
-export { StyledEngineProvider } from './styles';
+export { StyledEngineProvider } from './styles';
+export { default as unstable_composeClasses } from '@mui/base/composeClasses';
+export { default as generateUtilityClass } from '@mui/base/generateUtilityClass';
+export * from '@mui/base/generateUtilityClass';
+export { default as generateUtilityClasses } from '@mui/base/generateUtilityClasses';

package/legacy/internal/SwitchBase.js

@@ -27,9 +27,7 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
   return composeClasses(slots, getSwitchBaseUtilityClass, classes);
 };
 
-var SwitchBaseRoot = styled(ButtonBase, {
-  skipSx: true
-})(function (_ref) {
+var SwitchBaseRoot = styled(ButtonBase)(function (_ref) {
   var ownerState = _ref.ownerState;
   return _extends({
     padding: 9,
@@ -40,9 +38,7 @@ var SwitchBaseRoot = styled(ButtonBase, {
     marginRight: ownerState.size === 'small' ? -3 : -12
   });
 });
-var SwitchBaseInput = styled('input', {
-  skipSx: true
-})({
+var SwitchBaseInput = styled('input')({
   cursor: 'inherit',
   position: 'absolute',
   opacity: 0,