@mui/material 5.13.1 → 5.13.3

package/Select/Select.js

@@ -1,3 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "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';
@@ -35,29 +38,29 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     props: inProps
   });
   const {
-    autoWidth = false,
-    children,
-    classes: classesProp = {},
-    className,
-    defaultOpen = false,
-    displayEmpty = false,
-    IconComponent = ArrowDropDownIcon,
-    id,
-    input,
-    inputProps,
-    label,
-    labelId,
-    MenuProps,
-    multiple = false,
-    native = false,
-    onClose,
-    onOpen,
-    open,
-    renderValue,
-    SelectDisplayProps,
-    variant: variantProp = 'outlined',
-    ...other
-  } = props;
+      autoWidth = false,
+      children,
+      classes: classesProp = {},
+      className,
+      defaultOpen = false,
+      displayEmpty = false,
+      IconComponent = ArrowDropDownIcon,
+      id,
+      input,
+      inputProps,
+      label,
+      labelId,
+      MenuProps,
+      multiple = false,
+      native = false,
+      onClose,
+      onOpen,
+      open,
+      renderValue,
+      SelectDisplayProps,
+      variant: variantProp = 'outlined'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const inputComponent = native ? NativeSelectInput : SelectInput;
   const muiFormControl = useFormControl();
   const fcs = formControlState({
@@ -66,11 +69,10 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     states: ['variant', 'error']
   });
   const variant = fcs.variant || variantProp;
-  const ownerState = {
-    ...props,
+  const ownerState = _extends({}, props, {
     variant,
     classes: classesProp
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   const InputComponent = input || {
     standard: /*#__PURE__*/_jsx(StyledInput, {
@@ -86,50 +88,44 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   }[variant];
   const inputComponentRef = useForkRef(ref, InputComponent.ref);
   return /*#__PURE__*/_jsx(React.Fragment, {
-    children: /*#__PURE__*/React.cloneElement(InputComponent, {
+    children: /*#__PURE__*/React.cloneElement(InputComponent, _extends({
       // 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: {
+      inputProps: _extends({
         children,
         error: fcs.error,
         IconComponent,
         variant,
         type: undefined,
         // We render a select. We can ignore the type provided by the `Input`.
-        multiple,
-        ...(native ? {
+        multiple
+      }, native ? {
+        id
+      } : {
+        autoWidth,
+        defaultOpen,
+        displayEmpty,
+        labelId,
+        MenuProps,
+        onClose,
+        onOpen,
+        open,
+        renderValue,
+        SelectDisplayProps: _extends({
           id
-        } : {
-          autoWidth,
-          defaultOpen,
-          displayEmpty,
-          labelId,
-          MenuProps,
-          onClose,
-          onOpen,
-          open,
-          renderValue,
-          SelectDisplayProps: {
-            id,
-            ...SelectDisplayProps
-          }
-        }),
-        ...inputProps,
-        classes: inputProps ? deepmerge(classes, inputProps.classes) : classes,
-        ...(input ? input.props.inputProps : {})
-      },
-      ...(multiple && native && variant === 'outlined' ? {
-        notched: true
-      } : {}),
+        }, SelectDisplayProps)
+      }, inputProps, {
+        classes: inputProps ? deepmerge(classes, inputProps.classes) : classes
+      }, input ? input.props.inputProps : {})
+    }, multiple && native && variant === 'outlined' ? {
+      notched: true
+    } : {}, {
       ref: inputComponentRef,
-      className: clsx(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
-    })
+      className: clsx(InputComponent.props.className, className)
+    }, !input && {
+      variant
+    }, other))
   });
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes /* remove-proptypes */ = {

package/Select/SelectInput.js

@@ -1,5 +1,8 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
 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"];
 import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
@@ -105,39 +108,40 @@ 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
-    type,
-    value: valueProp,
-    variant = 'standard',
-    ...other
-  } = props;
+      '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 = _objectWithoutPropertiesLoose(props, _excluded);
   const [value, setValueState] = useControlled({
     controlled: valueProp,
     default: defaultValue,
@@ -419,16 +423,15 @@ 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 = {
-    ...props,
+  const ownerState = _extends({}, props, {
     variant,
     value,
     open,
     error
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsxs(React.Fragment, {
-    children: [/*#__PURE__*/_jsx(SelectSelect, {
+    children: [/*#__PURE__*/_jsx(SelectSelect, _extends({
       ref: handleDisplayRef,
       tabIndex: tabIndex,
       role: "button",
@@ -441,8 +444,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: clsx(SelectDisplayProps.className, classes.select, className)
       // The id is required for proper a11y
@@ -453,7 +456,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         className: "notranslate",
         children: "\u200B"
       })) : display
-    }), /*#__PURE__*/_jsx(SelectNativeInput, {
+    })), /*#__PURE__*/_jsx(SelectNativeInput, _extends({
       "aria-invalid": error,
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,
@@ -464,13 +467,12 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       disabled: disabled,
       className: classes.nativeInput,
       autoFocus: autoFocus,
-      ownerState: ownerState,
-      ...other
-    }), /*#__PURE__*/_jsx(SelectIcon, {
+      ownerState: ownerState
+    }, other)), /*#__PURE__*/_jsx(SelectIcon, {
       as: IconComponent,
       className: classes.icon,
       ownerState: ownerState
-    }), /*#__PURE__*/_jsx(Menu, {
+    }), /*#__PURE__*/_jsx(Menu, _extends({
       id: `menu-${name || ''}`,
       anchorEl: anchorElement,
       open: open,
@@ -482,23 +484,20 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       transformOrigin: {
         vertical: 'top',
         horizontal: 'center'
-      },
-      ...MenuProps,
-      MenuListProps: {
+      }
+    }, MenuProps, {
+      MenuListProps: _extends({
         'aria-labelledby': labelId,
         role: 'listbox',
-        disableListWrap: true,
-        ...MenuProps.MenuListProps
-      },
-      PaperProps: {
-        ...MenuProps.PaperProps,
-        style: {
-          minWidth: menuMinWidth,
-          ...(MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
-        }
-      },
+        disableListWrap: true
+      }, MenuProps.MenuListProps),
+      PaperProps: _extends({}, MenuProps.PaperProps, {
+        style: _extends({
+          minWidth: menuMinWidth
+        }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
+      }),
       children: items
-    })]
+    }))]
   });
 });
 process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {

package/Skeleton/Skeleton.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["animation", "className", "component", "height", "style", "variant", "width"];
 let _ = t => t,
   _t,
   _t2,
@@ -69,40 +72,34 @@ const SkeletonRoot = styled('span', {
 }) => {
   const radiusUnit = getUnit(theme.shape.borderRadius) || 'px';
   const radiusValue = toUnitless(theme.shape.borderRadius);
-  return {
+  return _extends({
     display: 'block',
     // Create a "on paper" color with sufficient contrast retaining the color
     backgroundColor: theme.vars ? theme.vars.palette.Skeleton.bg : 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' && css(_t3 || (_t3 = _`
@@ -140,35 +137,33 @@ const Skeleton = /*#__PURE__*/React.forwardRef(function Skeleton(inProps, ref) {
     name: 'MuiSkeleton'
   });
   const {
-    animation = 'pulse',
-    className,
-    component = 'span',
-    height,
-    style,
-    variant = 'text',
-    width,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      animation = 'pulse',
+      className,
+      component = 'span',
+      height,
+      style,
+      variant = 'text',
+      width
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     animation,
     component,
     variant,
     hasChildren: Boolean(other.children)
-  };
+  });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(SkeletonRoot, {
+  return /*#__PURE__*/_jsx(SkeletonRoot, _extends({
     as: component,
     ref: ref,
     className: clsx(classes.root, className),
-    ownerState: ownerState,
-    ...other,
-    style: {
+    ownerState: ownerState
+  }, other, {
+    style: _extends({
       width,
-      height,
-      ...style
-    }
-  });
+      height
+    }, style)
+  }));
 });
 process.env.NODE_ENV !== "production" ? Skeleton.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/Slide/Slide.js

@@ -1,3 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { Transition } from 'react-transition-group';
@@ -81,25 +84,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 = Transition,
-    ...other
-  } = props;
+      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 = Transition
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const childrenRef = React.useRef(null);
   const handleRef = useForkRef(children.ref, childrenRef, ref);
   const normalizedTransitionCallback = callback => isAppearing => {
@@ -127,12 +130,8 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
     }, {
       mode: 'enter'
     });
-    node.style.webkitTransition = theme.transitions.create('-webkit-transform', {
-      ...transitionProps
-    });
-    node.style.transition = theme.transitions.create('transform', {
-      ...transitionProps
-    });
+    node.style.webkitTransition = theme.transitions.create('-webkit-transform', _extends({}, transitionProps));
+    node.style.transition = theme.transitions.create('transform', _extends({}, transitionProps));
     node.style.webkitTransform = 'none';
     node.style.transform = 'none';
     if (onEntering) {
@@ -199,7 +198,7 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
       updatePosition();
     }
   }, [inProp, updatePosition]);
-  return /*#__PURE__*/_jsx(TransitionComponent, {
+  return /*#__PURE__*/_jsx(TransitionComponent, _extends({
     nodeRef: childrenRef,
     onEnter: handleEnter,
     onEntered: handleEntered,
@@ -210,20 +209,17 @@ 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, {
+      return /*#__PURE__*/React.cloneElement(children, _extends({
         ref: handleRef,
-        style: {
-          visibility: state === 'exited' && !inProp ? 'hidden' : undefined,
-          ...style,
-          ...children.props.style
-        },
-        ...childProps
-      });
+        style: _extends({
+          visibility: state === 'exited' && !inProp ? 'hidden' : undefined
+        }, style, children.props.style)
+      }, childProps));
     }
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? Slide.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------