@mui/material 5.3.1 → 5.4.3

package/node/FormGroup/formGroupClasses.js

@@ -12,6 +12,6 @@ function getFormGroupUtilityClass(slot) {
   return (0, _base.generateUtilityClass)('MuiFormGroup', slot);
 }
 
-const formGroupClasses = (0, _base.generateUtilityClasses)('MuiFormGroup', ['root', 'row']);
+const formGroupClasses = (0, _base.generateUtilityClasses)('MuiFormGroup', ['root', 'row', 'error']);
 var _default = formGroupClasses;
 exports.default = _default;

package/node/FormHelperText/FormHelperText.js

@@ -33,6 +33,8 @@ var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _span;
+
 const _excluded = ["children", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -123,16 +125,11 @@ const FormHelperText = /*#__PURE__*/React.forwardRef(function FormHelperText(inP
     className: (0, _clsx.default)(classes.root, className),
     ref: ref
   }, other, {
-    children: children === ' ' ?
-    /*#__PURE__*/
-    // notranslate needed while Google Translate will not fix zero-width space issue
-    // eslint-disable-next-line react/no-danger
-    (0, _jsxRuntime.jsx)("span", {
+    children: children === ' ' ? // notranslate needed while Google Translate will not fix zero-width space issue
+    _span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "notranslate",
-      dangerouslySetInnerHTML: {
-        __html: '​'
-      }
-    }) : children
+      children: "\u200B"
+    })) : children
   }));
 });
 process.env.NODE_ENV !== "production" ? FormHelperText.propTypes

package/node/Grid/Grid.js

@@ -286,10 +286,8 @@ const GridRoot = (0, _styled.default)('div', {
 
 }, ownerState.zeroMinWidth && {
   minWidth: 0
-}, ownerState.wrap === 'nowrap' && {
-  flexWrap: 'nowrap'
-}, ownerState.wrap === 'reverse' && {
-  flexWrap: 'wrap-reverse'
+}, ownerState.wrap !== 'wrap' && {
+  flexWrap: ownerState.wrap
 }), generateDirection, generateRowGap, generateColumnGap, generateGrid);
 
 const useUtilityClasses = ownerState => {

package/node/ImageList/ImageList.js

@@ -190,7 +190,9 @@ process.env.NODE_ENV !== "production" ? ImageList.propTypes
    * The variant to use.
    * @default 'standard'
    */
-  variant: _propTypes.default.oneOf(['masonry', 'quilted', 'standard', 'woven'])
+  variant: _propTypes.default
+  /* @typescript-to-proptypes-ignore */
+  .oneOfType([_propTypes.default.oneOf(['masonry', 'quilted', 'standard', 'woven']), _propTypes.default.string])
 } : void 0;
 var _default = ImageList;
 exports.default = _default;

package/node/InputAdornment/InputAdornment.js

@@ -35,6 +35,8 @@ var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _span;
+
 const _excluded = ["children", "className", "component", "disablePointerEvents", "disableTypography", "position", "variant"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -144,17 +146,11 @@ const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inP
         children: children
       }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
         children: [position === 'start' ?
-        /*#__PURE__*/
-
         /* notranslate needed while Google Translate will not fix zero-width space issue */
-
-        /* eslint-disable-next-line react/no-danger */
-        (0, _jsxRuntime.jsx)("span", {
+        _span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           className: "notranslate",
-          dangerouslySetInnerHTML: {
-            __html: '​'
-          }
-        }) : null, children]
+          children: "\u200B"
+        })) : null, children]
       })
     }))
   });

package/node/Modal/Modal.js

@@ -250,7 +250,7 @@ process.env.NODE_ENV !== "production" ? Modal.propTypes
 
   /**
    * If `true`, the modal will not restore focus to previously focused element once
-   * modal is hidden.
+   * modal is hidden or unmounted.
    * @default false
    */
   disableRestoreFocus: _propTypes.default.bool,

package/node/OutlinedInput/NotchedOutline.js

@@ -19,6 +19,8 @@ var _styled = _interopRequireDefault(require("../styles/styled"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _span;
+
 const _excluded = ["children", "classes", "className", "label", "notched"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -41,14 +43,12 @@ const NotchedOutlineRoot = (0, _styled.default)('fieldset')({
   overflow: 'hidden',
   minWidth: '0%'
 });
-const NotchedOutlineLegend = (0, _styled.default)('legend', {
-  skipSx: true
-})(({
+const NotchedOutlineLegend = (0, _styled.default)('legend')(({
   ownerState,
   theme
 }) => (0, _extends2.default)({
   float: 'unset'
-}, ownerState.label === undefined && {
+}, !ownerState.withLabel && {
   padding: 0,
   lineHeight: '11px',
   // sync with `height` in `legend` styles
@@ -56,7 +56,7 @@ const NotchedOutlineLegend = (0, _styled.default)('legend', {
     duration: 150,
     easing: theme.transitions.easing.easeOut
   })
-}, ownerState.label !== undefined && (0, _extends2.default)({
+}, ownerState.withLabel && (0, _extends2.default)({
   display: 'block',
   // Fix conflict with normalize.css and sanitize.css
   width: 'auto',
@@ -96,9 +96,10 @@ function NotchedOutline(props) {
     notched
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const withLabel = label != null && label !== '';
   const ownerState = (0, _extends2.default)({}, props, {
     notched,
-    label
+    withLabel
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(NotchedOutlineRoot, (0, _extends2.default)({
     "aria-hidden": true,
@@ -107,18 +108,13 @@ function NotchedOutline(props) {
   }, other, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(NotchedOutlineLegend, {
       ownerState: ownerState,
-      children: label ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: withLabel ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: label
-      }) :
-      /*#__PURE__*/
-      // notranslate needed while Google Translate will not fix zero-width space issue
-      // eslint-disable-next-line react/no-danger
-      (0, _jsxRuntime.jsx)("span", {
+      }) : // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "notranslate",
-        dangerouslySetInnerHTML: {
-          __html: '​'
-        }
-      })
+        children: "\u200B"
+      }))
     })
   }));
 }

package/node/OutlinedInput/OutlinedInput.js

@@ -160,7 +160,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
     }, components),
     renderSuffix: state => /*#__PURE__*/(0, _jsxRuntime.jsx)(NotchedOutlineRoot, {
       className: classes.notchedOutline,
-      label: label && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+      label: label != null && label !== '' && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
         children: [label, "\xA0", '*']
       })) : label,
       notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused)

package/node/Radio/RadioButtonIcon.js

@@ -29,15 +29,11 @@ const RadioButtonIconRoot = (0, _styled.default)('span')({
   position: 'relative',
   display: 'flex'
 });
-const RadioButtonIconBackground = (0, _styled.default)(_RadioButtonUnchecked.default, {
-  skipSx: true
-})({
+const RadioButtonIconBackground = (0, _styled.default)(_RadioButtonUnchecked.default)({
   // Scale applied to prevent dot misalignment in Safari
   transform: 'scale(1)'
 });
-const RadioButtonIconDot = (0, _styled.default)(_RadioButtonChecked.default, {
-  skipSx: true
-})(({
+const RadioButtonIconDot = (0, _styled.default)(_RadioButtonChecked.default)(({
   theme,
   ownerState
 }) => (0, _extends2.default)({

package/node/Rating/Rating.js

@@ -426,7 +426,7 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
 
   const handleChange = event => {
     let newValue = event.target.value === '' ? null : parseFloat(event.target.value); // Give mouse priority over keyboard
-    // Fix https://github.com/mui-org/material-ui/issues/22827
+    // Fix https://github.com/mui/material-ui/issues/22827
 
     if (hover !== -1) {
       newValue = hover;

package/node/Select/Select.js

@@ -27,11 +27,11 @@ var _useFormControl = _interopRequireDefault(require("../FormControl/useFormCont
 
 var _ArrowDropDown = _interopRequireDefault(require("../internal/svg-icons/ArrowDropDown"));
 
-var _Input2 = _interopRequireDefault(require("../Input"));
+var _Input = _interopRequireDefault(require("../Input"));
 
 var _NativeSelectInput = _interopRequireDefault(require("../NativeSelect/NativeSelectInput"));
 
-var _FilledInput2 = _interopRequireDefault(require("../FilledInput"));
+var _FilledInput = _interopRequireDefault(require("../FilledInput"));
 
 var _OutlinedInput = _interopRequireDefault(require("../OutlinedInput"));
 
@@ -39,9 +39,11 @@ var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 
 var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 
+var _styled = _interopRequireWildcard(require("../styles/styled"));
+
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _Input, _FilledInput;
+var _StyledInput, _StyledFilledInput;
 
 const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
 
@@ -56,6 +58,15 @@ const useUtilityClasses = ownerState => {
   return classes;
 };
 
+const styledRootConfig = {
+  name: 'MuiSelect',
+  overridesResolver: (props, styles) => styles.root,
+  shouldForwardProp: prop => (0, _styled.rootShouldForwardProp)(prop) && prop !== 'variant',
+  slot: 'Root'
+};
+const StyledInput = (0, _styled.default)(_Input.default, styledRootConfig)('');
+const StyledOutlinedInput = (0, _styled.default)(_OutlinedInput.default, styledRootConfig)('');
+const StyledFilledInput = (0, _styled.default)(_FilledInput.default, styledRootConfig)('');
 const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   const props = (0, _useThemeProps.default)({
     name: 'MuiSelect',
@@ -82,7 +93,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     open,
     renderValue,
     SelectDisplayProps,
-    variant: variantProps = 'outlined'
+    variant: variantProp = 'outlined'
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const inputComponent = native ? _NativeSelectInput.default : _SelectInput.default;
@@ -92,15 +103,16 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     muiFormControl,
     states: ['variant']
   });
-  const variant = fcs.variant || variantProps;
+  const variant = fcs.variant || variantProp;
   const InputComponent = input || {
-    standard: _Input || (_Input = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Input2.default, {})),
-    outlined: /*#__PURE__*/(0, _jsxRuntime.jsx)(_OutlinedInput.default, {
+    standard: _StyledInput || (_StyledInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInput, {})),
+    outlined: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledOutlinedInput, {
       label: label
     }),
-    filled: _FilledInput || (_FilledInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(_FilledInput2.default, {}))
+    filled: _StyledFilledInput || (_StyledFilledInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFilledInput, {}))
   }[variant];
   const ownerState = (0, _extends2.default)({}, props, {
+    variant,
     classes: classesProp
   });
   const classes = useUtilityClasses(ownerState);
@@ -138,7 +150,8 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     notched: true
   } : {}, {
     ref: inputComponentRef,
-    className: (0, _clsx.default)(InputComponent.props.className, className)
+    className: (0, _clsx.default)(InputComponent.props.className, className),
+    variant
   }, other));
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes

package/node/Select/SelectInput.js

@@ -43,6 +43,8 @@ var _selectClasses = _interopRequireWildcard(require("./selectClasses"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _span;
+
 const _excluded = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -215,6 +217,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     }
   }, [autoFocus]);
   React.useEffect(() => {
+    if (!labelId) {
+      return undefined;
+    }
+
     const label = (0, _ownerDocument.default)(displayRef.current).getElementById(labelId);
 
     if (label) {
@@ -311,7 +317,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       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.
         const nativeEvent = event.nativeEvent || event;
         const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
@@ -509,16 +515,11 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       className: (0, _clsx.default)(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
-      (0, _jsxRuntime.jsx)("span", {
+      children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "notranslate",
-        dangerouslySetInnerHTML: {
-          __html: '​'
-        }
-      }) : display
+        children: "\u200B"
+      })) : display
     })), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, (0, _extends2.default)({
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,

package/node/Slide/Slide.js

@@ -26,8 +26,6 @@ var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 
 var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 
-var _createTransitions = require("../styles/createTransitions");
-
 var _utils2 = require("../transitions/utils");
 
 var _utils3 = require("../utils");
@@ -109,21 +107,22 @@ function setTranslateValue(direction, node, containerProp) {
     node.style.transform = transform;
   }
 }
-
-const defaultEasing = {
-  enter: _createTransitions.easing.easeOut,
-  exit: _createTransitions.easing.sharp
-};
-const defaultTimeout = {
-  enter: _createTransitions.duration.enteringScreen,
-  exit: _createTransitions.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.
  */
 
+
 const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
+  const theme = (0, _useTheme.default)();
+  const defaultEasing = {
+    enter: theme.transitions.easing.easeOut,
+    exit: theme.transitions.easing.sharp
+  };
+  const defaultTimeout = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   const {
     addEndListener,
     appear = true,
@@ -144,7 +143,6 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
     TransitionComponent = _reactTransitionGroup.Transition
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const theme = (0, _useTheme.default)();
   const childrenRef = React.useRef(null);
   const handleRefIntermediary = (0, _useForkRef.default)(children.ref, childrenRef);
   const handleRef = (0, _useForkRef.default)(handleRefIntermediary, ref);
@@ -332,8 +330,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.default.oneOfType([_propTypes.default.shape({
@@ -385,8 +383,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.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({

package/node/Slider/Slider.js

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

package/node/Snackbar/Snackbar.js

@@ -27,8 +27,6 @@ var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 
 var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 
-var _createTransitions = require("../styles/createTransitions");
-
 var _useEventCallback = _interopRequireDefault(require("../utils/useEventCallback"));
 
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
@@ -122,6 +120,11 @@ const Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     props: inProps,
     name: 'MuiSnackbar'
   });
+  const theme = (0, _useTheme.default)();
+  const defaultTransitionDuration = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   const {
     action,
     anchorOrigin: {
@@ -146,10 +149,7 @@ const Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     open,
     resumeHideDuration,
     TransitionComponent = _Grow.default,
-    transitionDuration = {
-      enter: _createTransitions.duration.enteringScreen,
-      exit: _createTransitions.duration.leavingScreen
-    },
+    transitionDuration = defaultTransitionDuration,
     TransitionProps: {
       onEnter,
       onExited
@@ -157,7 +157,6 @@ const Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
   } = props,
         TransitionProps = (0, _objectWithoutPropertiesLoose2.default)(props.TransitionProps, _excluded),
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded2);
-  const theme = (0, _useTheme.default)();
   const isRtl = theme.direction === 'rtl';
   const ownerState = (0, _extends2.default)({}, props, {
     anchorOrigin: {
@@ -315,7 +314,10 @@ const 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__*/(0, _jsxRuntime.jsx)(TransitionComponent, (0, _extends2.default)({
         appear: true,
@@ -471,8 +473,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.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({

package/node/SpeedDial/SpeedDial.js

@@ -25,7 +25,7 @@ var _styled = _interopRequireDefault(require("../styles/styled"));
 
 var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 
-var _createTransitions = require("../styles/createTransitions");
+var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 
 var _Zoom = _interopRequireDefault(require("../Zoom"));
 
@@ -167,6 +167,11 @@ const SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref)
     props: inProps,
     name: 'MuiSpeedDial'
   });
+  const theme = (0, _useTheme.default)();
+  const defaultTransitionDuration = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
   const {
     ariaLabel,
     FabProps: {
@@ -186,10 +191,7 @@ const SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref)
     onOpen,
     open: openProp,
     TransitionComponent = _Zoom.default,
-    transitionDuration = {
-      enter: _createTransitions.duration.enteringScreen,
-      exit: _createTransitions.duration.leavingScreen
-    },
+    transitionDuration = defaultTransitionDuration,
     TransitionProps
   } = props,
         FabProps = (0, _objectWithoutPropertiesLoose2.default)(props.FabProps, _excluded),
@@ -567,8 +569,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.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({

package/node/Step/StepContext.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+exports.useStepContext = useStepContext;
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -12,13 +13,22 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 /**
- * @ignore - internal component.
+ * Provides information about the current step in Stepper.
  */
 const 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.
+ */
+
+
+function useStepContext() {
+  return React.useContext(StepContext);
+}
 
 var _default = StepContext;
 exports.default = _default;

package/node/Step/index.js

@@ -6,8 +6,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
-  stepClasses: true
+  stepClasses: true,
+  StepContext: true
 };
+Object.defineProperty(exports, "StepContext", {
+  enumerable: true,
+  get: function () {
+    return _StepContext.default;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
@@ -37,6 +44,20 @@ Object.keys(_stepClasses).forEach(function (key) {
   });
 });
 
+var _StepContext = _interopRequireWildcard(require("./StepContext"));
+
+Object.keys(_StepContext).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _StepContext[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _StepContext[key];
+    }
+  });
+});
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/node/SwipeableDrawer/SwipeArea.js

@@ -31,9 +31,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const SwipeAreaRoot = (0, _styled.default)('div', {
-  skipSx: true
-})(({
+const SwipeAreaRoot = (0, _styled.default)('div')(({
   theme,
   ownerState
 }) => (0, _extends2.default)({