@mui/material 5.13.0 → 5.13.1

package/node/Select/Select.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -23,7 +21,6 @@ var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 var _styled = _interopRequireWildcard(require("../styles/styled"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "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); }
 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 useUtilityClasses = ownerState => {
@@ -47,29 +44,29 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     props: inProps
   });
   const {
-      autoWidth = false,
-      children,
-      classes: classesProp = {},
-      className,
-      defaultOpen = false,
-      displayEmpty = false,
-      IconComponent = _ArrowDropDown.default,
-      id,
-      input,
-      inputProps,
-      label,
-      labelId,
-      MenuProps,
-      multiple = false,
-      native = false,
-      onClose,
-      onOpen,
-      open,
-      renderValue,
-      SelectDisplayProps,
-      variant: variantProp = 'outlined'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    autoWidth = false,
+    children,
+    classes: classesProp = {},
+    className,
+    defaultOpen = false,
+    displayEmpty = false,
+    IconComponent = _ArrowDropDown.default,
+    id,
+    input,
+    inputProps,
+    label,
+    labelId,
+    MenuProps,
+    multiple = false,
+    native = false,
+    onClose,
+    onOpen,
+    open,
+    renderValue,
+    SelectDisplayProps,
+    variant: variantProp = 'outlined',
+    ...other
+  } = props;
   const inputComponent = native ? _NativeSelectInput.default : _SelectInput.default;
   const muiFormControl = (0, _useFormControl.default)();
   const fcs = (0, _formControlState.default)({
@@ -78,10 +75,11 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     states: ['variant', 'error']
   });
   const variant = fcs.variant || variantProp;
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = {
+    ...props,
     variant,
     classes: classesProp
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   const InputComponent = input || {
     standard: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInput, {
@@ -97,44 +95,50 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   }[variant];
   const inputComponentRef = (0, _useForkRef.default)(ref, InputComponent.ref);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
-    children: /*#__PURE__*/React.cloneElement(InputComponent, (0, _extends2.default)({
+    children: /*#__PURE__*/React.cloneElement(InputComponent, {
       // Most of the logic is implemented in `SelectInput`.
       // The `Select` component is a simple API wrapper to expose something better to play with.
       inputComponent,
-      inputProps: (0, _extends2.default)({
+      inputProps: {
         children,
         error: fcs.error,
         IconComponent,
         variant,
         type: undefined,
         // We render a select. We can ignore the type provided by the `Input`.
-        multiple
-      }, native ? {
-        id
-      } : {
-        autoWidth,
-        defaultOpen,
-        displayEmpty,
-        labelId,
-        MenuProps,
-        onClose,
-        onOpen,
-        open,
-        renderValue,
-        SelectDisplayProps: (0, _extends2.default)({
+        multiple,
+        ...(native ? {
           id
-        }, SelectDisplayProps)
-      }, inputProps, {
-        classes: inputProps ? (0, _utils.deepmerge)(classes, inputProps.classes) : classes
-      }, input ? input.props.inputProps : {})
-    }, multiple && native && variant === 'outlined' ? {
-      notched: true
-    } : {}, {
+        } : {
+          autoWidth,
+          defaultOpen,
+          displayEmpty,
+          labelId,
+          MenuProps,
+          onClose,
+          onOpen,
+          open,
+          renderValue,
+          SelectDisplayProps: {
+            id,
+            ...SelectDisplayProps
+          }
+        }),
+        ...inputProps,
+        classes: inputProps ? (0, _utils.deepmerge)(classes, inputProps.classes) : classes,
+        ...(input ? input.props.inputProps : {})
+      },
+      ...(multiple && native && variant === 'outlined' ? {
+        notched: true
+      } : {}),
       ref: inputComponentRef,
-      className: (0, _clsx.default)(InputComponent.props.className, className)
-    }, !input && {
-      variant
-    }, other))
+      className: (0, _clsx.default)(InputComponent.props.className, className),
+      // If a custom input is provided via 'input' prop, do not allow 'variant' to be propagated to it's root element. See https://github.com/mui/material-ui/issues/33894.
+      ...(!input && {
+        variant
+      }),
+      ...other
+    })
   });
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes /* remove-proptypes */ = {

package/node/Select/SelectInput.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _utils = require("@mui/utils");
 var React = _interopRequireWildcard(require("react"));
 var _reactIs = require("react-is");
@@ -24,7 +22,6 @@ var _useControlled = _interopRequireDefault(require("../utils/useControlled"));
 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", "error", "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); }
 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 SelectSelect = (0, _styled.default)('div', {
@@ -115,40 +112,39 @@ const useUtilityClasses = ownerState => {
  */
 const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
   const {
-      'aria-describedby': ariaDescribedby,
-      'aria-label': ariaLabel,
-      autoFocus,
-      autoWidth,
-      children,
-      className,
-      defaultOpen,
-      defaultValue,
-      disabled,
-      displayEmpty,
-      error = false,
-      IconComponent,
-      inputRef: inputRefProp,
-      labelId,
-      MenuProps = {},
-      multiple,
-      name,
-      onBlur,
-      onChange,
-      onClose,
-      onFocus,
-      onOpen,
-      open: openProp,
-      readOnly,
-      renderValue,
-      SelectDisplayProps = {},
-      tabIndex: tabIndexProp
-      // catching `type` from Input which makes no sense for SelectInput
-      ,
-
-      value: valueProp,
-      variant = 'standard'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    'aria-describedby': ariaDescribedby,
+    'aria-label': ariaLabel,
+    autoFocus,
+    autoWidth,
+    children,
+    className,
+    defaultOpen,
+    defaultValue,
+    disabled,
+    displayEmpty,
+    error = false,
+    IconComponent,
+    inputRef: inputRefProp,
+    labelId,
+    MenuProps = {},
+    multiple,
+    name,
+    onBlur,
+    onChange,
+    onClose,
+    onFocus,
+    onOpen,
+    open: openProp,
+    readOnly,
+    renderValue,
+    SelectDisplayProps = {},
+    tabIndex: tabIndexProp,
+    // catching `type` from Input which makes no sense for SelectInput
+    type,
+    value: valueProp,
+    variant = 'standard',
+    ...other
+  } = props;
   const [value, setValueState] = (0, _useControlled.default)({
     controlled: valueProp,
     default: defaultValue,
@@ -430,15 +426,16 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     tabIndex = disabled ? null : 0;
   }
   const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = {
+    ...props,
     variant,
     value,
     open,
     error
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, (0, _extends2.default)({
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, {
       ref: handleDisplayRef,
       tabIndex: tabIndex,
       role: "button",
@@ -451,8 +448,8 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onKeyDown: handleKeyDown,
       onMouseDown: disabled || readOnly ? null : handleMouseDown,
       onBlur: handleBlur,
-      onFocus: onFocus
-    }, SelectDisplayProps, {
+      onFocus: onFocus,
+      ...SelectDisplayProps,
       ownerState: ownerState,
       className: (0, _clsx.default)(SelectDisplayProps.className, classes.select, className)
       // The id is required for proper a11y
@@ -463,7 +460,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         className: "notranslate",
         children: "\u200B"
       })) : display
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, (0, _extends2.default)({
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, {
       "aria-invalid": error,
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,
@@ -474,12 +471,13 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       disabled: disabled,
       className: classes.nativeInput,
       autoFocus: autoFocus,
-      ownerState: ownerState
-    }, other)), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectIcon, {
+      ownerState: ownerState,
+      ...other
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectIcon, {
       as: IconComponent,
       className: classes.icon,
       ownerState: ownerState
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, (0, _extends2.default)({
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, {
       id: `menu-${name || ''}`,
       anchorEl: anchorElement,
       open: open,
@@ -491,20 +489,23 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       transformOrigin: {
         vertical: 'top',
         horizontal: 'center'
-      }
-    }, MenuProps, {
-      MenuListProps: (0, _extends2.default)({
+      },
+      ...MenuProps,
+      MenuListProps: {
         'aria-labelledby': labelId,
         role: 'listbox',
-        disableListWrap: true
-      }, MenuProps.MenuListProps),
-      PaperProps: (0, _extends2.default)({}, MenuProps.PaperProps, {
-        style: (0, _extends2.default)({
-          minWidth: menuMinWidth
-        }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
-      }),
+        disableListWrap: true,
+        ...MenuProps.MenuListProps
+      },
+      PaperProps: {
+        ...MenuProps.PaperProps,
+        style: {
+          minWidth: menuMinWidth,
+          ...(MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
+        }
+      },
       children: items
-    }))]
+    })]
   });
 });
 process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {

package/node/Skeleton/Skeleton.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -17,7 +15,6 @@ var _styled = _interopRequireDefault(require("../styles/styled"));
 var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
 var _skeletonClasses = require("./skeletonClasses");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["animation", "className", "component", "height", "style", "variant", "width"];
 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; }
 const useUtilityClasses = ownerState => {
@@ -76,34 +73,40 @@ const SkeletonRoot = (0, _styled.default)('span', {
 }) => {
   const radiusUnit = (0, _styles.unstable_getUnit)(theme.shape.borderRadius) || 'px';
   const radiusValue = (0, _styles.unstable_toUnitless)(theme.shape.borderRadius);
-  return (0, _extends2.default)({
+  return {
     display: 'block',
     // Create a "on paper" color with sufficient contrast retaining the color
     backgroundColor: theme.vars ? theme.vars.palette.Skeleton.bg : (0, _styles.alpha)(theme.palette.text.primary, theme.palette.mode === 'light' ? 0.11 : 0.13),
-    height: '1.2em'
-  }, ownerState.variant === 'text' && {
-    marginTop: 0,
-    marginBottom: 0,
-    height: 'auto',
-    transformOrigin: '0 55%',
-    transform: 'scale(1, 0.60)',
-    borderRadius: `${radiusValue}${radiusUnit}/${Math.round(radiusValue / 0.6 * 10) / 10}${radiusUnit}`,
-    '&:empty:before': {
-      content: '"\\00a0"'
-    }
-  }, ownerState.variant === 'circular' && {
-    borderRadius: '50%'
-  }, ownerState.variant === 'rounded' && {
-    borderRadius: (theme.vars || theme).shape.borderRadius
-  }, ownerState.hasChildren && {
-    '& > *': {
-      visibility: 'hidden'
-    }
-  }, ownerState.hasChildren && !ownerState.width && {
-    maxWidth: 'fit-content'
-  }, ownerState.hasChildren && !ownerState.height && {
-    height: 'auto'
-  });
+    height: '1.2em',
+    ...(ownerState.variant === 'text' && {
+      marginTop: 0,
+      marginBottom: 0,
+      height: 'auto',
+      transformOrigin: '0 55%',
+      transform: 'scale(1, 0.60)',
+      borderRadius: `${radiusValue}${radiusUnit}/${Math.round(radiusValue / 0.6 * 10) / 10}${radiusUnit}`,
+      '&:empty:before': {
+        content: '"\\00a0"'
+      }
+    }),
+    ...(ownerState.variant === 'circular' && {
+      borderRadius: '50%'
+    }),
+    ...(ownerState.variant === 'rounded' && {
+      borderRadius: (theme.vars || theme).shape.borderRadius
+    }),
+    ...(ownerState.hasChildren && {
+      '& > *': {
+        visibility: 'hidden'
+      }
+    }),
+    ...(ownerState.hasChildren && !ownerState.width && {
+      maxWidth: 'fit-content'
+    }),
+    ...(ownerState.hasChildren && !ownerState.height && {
+      height: 'auto'
+    })
+  };
 }, ({
   ownerState
 }) => ownerState.animation === 'pulse' && (0, _system.css)`
@@ -141,33 +144,35 @@ const Skeleton = /*#__PURE__*/React.forwardRef(function Skeleton(inProps, ref) {
     name: 'MuiSkeleton'
   });
   const {
-      animation = 'pulse',
-      className,
-      component = 'span',
-      height,
-      style,
-      variant = 'text',
-      width
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const ownerState = (0, _extends2.default)({}, props, {
+    animation = 'pulse',
+    className,
+    component = 'span',
+    height,
+    style,
+    variant = 'text',
+    width,
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
     animation,
     component,
     variant,
     hasChildren: Boolean(other.children)
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SkeletonRoot, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SkeletonRoot, {
     as: component,
     ref: ref,
     className: (0, _clsx.default)(classes.root, className),
-    ownerState: ownerState
-  }, other, {
-    style: (0, _extends2.default)({
+    ownerState: ownerState,
+    ...other,
+    style: {
       width,
-      height
-    }, style)
-  }));
+      height,
+      ...style
+    }
+  });
 });
 process.env.NODE_ENV !== "production" ? Skeleton.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/node/Slide/Slide.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 exports.setTranslateValue = setTranslateValue;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactTransitionGroup = require("react-transition-group");
@@ -18,10 +16,10 @@ var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 var _utils2 = require("../transitions/utils");
 var _utils3 = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"]; // 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`.
 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; }
+// 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`.
 function getTranslateValue(direction, node, resolvedContainer) {
   const rect = node.getBoundingClientRect();
   const containerRect = resolvedContainer && resolvedContainer.getBoundingClientRect();
@@ -92,25 +90,25 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
     exit: theme.transitions.duration.leavingScreen
   };
   const {
-      addEndListener,
-      appear = true,
-      children,
-      container: containerProp,
-      direction = 'down',
-      easing: easingProp = defaultEasing,
-      in: inProp,
-      onEnter,
-      onEntered,
-      onEntering,
-      onExit,
-      onExited,
-      onExiting,
-      style,
-      timeout = defaultTimeout,
-      // eslint-disable-next-line react/prop-types
-      TransitionComponent = _reactTransitionGroup.Transition
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    addEndListener,
+    appear = true,
+    children,
+    container: containerProp,
+    direction = 'down',
+    easing: easingProp = defaultEasing,
+    in: inProp,
+    onEnter,
+    onEntered,
+    onEntering,
+    onExit,
+    onExited,
+    onExiting,
+    style,
+    timeout = defaultTimeout,
+    // eslint-disable-next-line react/prop-types
+    TransitionComponent = _reactTransitionGroup.Transition,
+    ...other
+  } = props;
   const childrenRef = React.useRef(null);
   const handleRef = (0, _useForkRef.default)(children.ref, childrenRef, ref);
   const normalizedTransitionCallback = callback => isAppearing => {
@@ -138,8 +136,12 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
     }, {
       mode: 'enter'
     });
-    node.style.webkitTransition = theme.transitions.create('-webkit-transform', (0, _extends2.default)({}, transitionProps));
-    node.style.transition = theme.transitions.create('transform', (0, _extends2.default)({}, transitionProps));
+    node.style.webkitTransition = theme.transitions.create('-webkit-transform', {
+      ...transitionProps
+    });
+    node.style.transition = theme.transitions.create('transform', {
+      ...transitionProps
+    });
     node.style.webkitTransform = 'none';
     node.style.transform = 'none';
     if (onEntering) {
@@ -206,7 +208,7 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
       updatePosition();
     }
   }, [inProp, updatePosition]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionComponent, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionComponent, {
     nodeRef: childrenRef,
     onEnter: handleEnter,
     onEntered: handleEntered,
@@ -217,17 +219,20 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
     addEndListener: handleAddEndListener,
     appear: appear,
     in: inProp,
-    timeout: timeout
-  }, other, {
+    timeout: timeout,
+    ...other,
     children: (state, childProps) => {
-      return /*#__PURE__*/React.cloneElement(children, (0, _extends2.default)({
+      return /*#__PURE__*/React.cloneElement(children, {
         ref: handleRef,
-        style: (0, _extends2.default)({
-          visibility: state === 'exited' && !inProp ? 'hidden' : undefined
-        }, style, children.props.style)
-      }, childProps));
+        style: {
+          visibility: state === 'exited' && !inProp ? 'hidden' : undefined,
+          ...style,
+          ...children.props.style
+        },
+        ...childProps
+      });
     }
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? Slide.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------