@mui/material 5.12.3 → 5.13.1

package/modern/SpeedDialAction/SpeedDialAction.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className", "delay", "FabProps", "icon", "id", "open", "TooltipClasses", "tooltipOpen", "tooltipPlacement", "tooltipTitle"];
 // @inheritedComponent Tooltip
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -41,7 +38,7 @@ const SpeedDialActionFab = styled(Fab, {
 })(({
   theme,
   ownerState
-}) => _extends({
+}) => ({
   margin: 8,
   color: (theme.vars || theme).palette.text.secondary,
   backgroundColor: (theme.vars || theme).palette.background.paper,
@@ -51,10 +48,11 @@ const SpeedDialActionFab = styled(Fab, {
   transition: `${theme.transitions.create('transform', {
     duration: theme.transitions.duration.shorter
   })}, opacity 0.8s`,
-  opacity: 1
-}, !ownerState.open && {
-  opacity: 0,
-  transform: 'scale(0)'
+  opacity: 1,
+  ...(!ownerState.open && {
+    opacity: 0,
+    transform: 'scale(0)'
+  })
 }));
 const SpeedDialActionStaticTooltip = styled('span', {
   name: 'MuiSpeedDialAction',
@@ -72,23 +70,26 @@ const SpeedDialActionStaticTooltip = styled('span', {
   position: 'relative',
   display: 'flex',
   alignItems: 'center',
-  [`& .${speedDialActionClasses.staticTooltipLabel}`]: _extends({
+  [`& .${speedDialActionClasses.staticTooltipLabel}`]: {
     transition: theme.transitions.create(['transform', 'opacity'], {
       duration: theme.transitions.duration.shorter
     }),
-    opacity: 1
-  }, !ownerState.open && {
-    opacity: 0,
-    transform: 'scale(0.5)'
-  }, ownerState.tooltipPlacement === 'left' && {
-    transformOrigin: '100% 50%',
-    right: '100%',
-    marginRight: 8
-  }, ownerState.tooltipPlacement === 'right' && {
-    transformOrigin: '0% 50%',
-    left: '100%',
-    marginLeft: 8
-  })
+    opacity: 1,
+    ...(!ownerState.open && {
+      opacity: 0,
+      transform: 'scale(0.5)'
+    }),
+    ...(ownerState.tooltipPlacement === 'left' && {
+      transformOrigin: '100% 50%',
+      right: '100%',
+      marginRight: 8
+    }),
+    ...(ownerState.tooltipPlacement === 'right' && {
+      transformOrigin: '0% 50%',
+      left: '100%',
+      marginLeft: 8
+    })
+  }
 }));
 const SpeedDialActionStaticTooltipLabel = styled('span', {
   name: 'MuiSpeedDialAction',
@@ -96,9 +97,9 @@ const SpeedDialActionStaticTooltipLabel = styled('span', {
   overridesResolver: (props, styles) => styles.staticTooltipLabel
 })(({
   theme
-}) => _extends({
-  position: 'absolute'
-}, theme.typography.body1, {
+}) => ({
+  position: 'absolute',
+  ...theme.typography.body1,
   backgroundColor: (theme.vars || theme).palette.background.paper,
   borderRadius: (theme.vars || theme).shape.borderRadius,
   boxShadow: (theme.vars || theme).shadows[1],
@@ -112,21 +113,22 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
     name: 'MuiSpeedDialAction'
   });
   const {
-      className,
-      delay = 0,
-      FabProps = {},
-      icon,
-      id,
-      open,
-      TooltipClasses,
-      tooltipOpen: tooltipOpenProp = false,
-      tooltipPlacement = 'left',
-      tooltipTitle
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const ownerState = _extends({}, props, {
+    className,
+    delay = 0,
+    FabProps = {},
+    icon,
+    id,
+    open,
+    TooltipClasses,
+    tooltipOpen: tooltipOpenProp = false,
+    tooltipPlacement = 'left',
+    tooltipTitle,
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
     tooltipPlacement
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   const [tooltipOpen, setTooltipOpen] = React.useState(tooltipOpenProp);
   const handleTooltipClose = () => {
@@ -138,23 +140,26 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
   const transitionStyle = {
     transitionDelay: `${delay}ms`
   };
-  const fab = /*#__PURE__*/_jsx(SpeedDialActionFab, _extends({
+  const fab = /*#__PURE__*/_jsx(SpeedDialActionFab, {
     size: "small",
     className: clsx(classes.fab, className),
     tabIndex: -1,
     role: "menuitem",
-    ownerState: ownerState
-  }, FabProps, {
-    style: _extends({}, transitionStyle, FabProps.style),
+    ownerState: ownerState,
+    ...FabProps,
+    style: {
+      ...transitionStyle,
+      ...FabProps.style
+    },
     children: icon
-  }));
+  });
   if (tooltipOpenProp) {
-    return /*#__PURE__*/_jsxs(SpeedDialActionStaticTooltip, _extends({
+    return /*#__PURE__*/_jsxs(SpeedDialActionStaticTooltip, {
       id: id,
       ref: ref,
       className: classes.staticTooltip,
-      ownerState: ownerState
-    }, other, {
+      ownerState: ownerState,
+      ...other,
       children: [/*#__PURE__*/_jsx(SpeedDialActionStaticTooltipLabel, {
         style: transitionStyle,
         id: `${id}-label`,
@@ -164,12 +169,12 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
       }), /*#__PURE__*/React.cloneElement(fab, {
         'aria-labelledby': `${id}-label`
       })]
-    }));
+    });
   }
   if (!open && tooltipOpen) {
     setTooltipOpen(false);
   }
-  return /*#__PURE__*/_jsx(Tooltip, _extends({
+  return /*#__PURE__*/_jsx(Tooltip, {
     id: id,
     ref: ref,
     title: tooltipTitle,
@@ -177,10 +182,10 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
     onClose: handleTooltipClose,
     onOpen: handleTooltipOpen,
     open: open && tooltipOpen,
-    classes: TooltipClasses
-  }, other, {
+    classes: TooltipClasses,
+    ...other,
     children: fab
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? SpeedDialAction.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/SpeedDialIcon/SpeedDialIcon.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className", "icon", "open", "openIcon"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -48,26 +45,29 @@ const SpeedDialIconRoot = styled('span', {
   ownerState
 }) => ({
   height: 24,
-  [`& .${speedDialIconClasses.icon}`]: _extends({
+  [`& .${speedDialIconClasses.icon}`]: {
     transition: theme.transitions.create(['transform', 'opacity'], {
       duration: theme.transitions.duration.short
+    }),
+    ...(ownerState.open && {
+      transform: 'rotate(45deg)',
+      ...(ownerState.openIcon && {
+        opacity: 0
+      })
     })
-  }, ownerState.open && _extends({
-    transform: 'rotate(45deg)'
-  }, ownerState.openIcon && {
-    opacity: 0
-  })),
-  [`& .${speedDialIconClasses.openIcon}`]: _extends({
+  },
+  [`& .${speedDialIconClasses.openIcon}`]: {
     position: 'absolute',
     transition: theme.transitions.create(['transform', 'opacity'], {
       duration: theme.transitions.duration.short
     }),
     opacity: 0,
-    transform: 'rotate(-45deg)'
-  }, ownerState.open && {
-    transform: 'rotate(0deg)',
-    opacity: 1
-  })
+    transform: 'rotate(-45deg)',
+    ...(ownerState.open && {
+      transform: 'rotate(0deg)',
+      opacity: 1
+    })
+  }
 }));
 const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inProps, ref) {
   const props = useThemeProps({
@@ -75,11 +75,12 @@ const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inPro
     name: 'MuiSpeedDialIcon'
   });
   const {
-      className,
-      icon: iconProp,
-      openIcon: openIconProp
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    className,
+    icon: iconProp,
+    open,
+    openIcon: openIconProp,
+    ...other
+  } = props;
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   function formatIcon(icon, newClassName) {
@@ -90,15 +91,15 @@ const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inPro
     }
     return icon;
   }
-  return /*#__PURE__*/_jsxs(SpeedDialIconRoot, _extends({
+  return /*#__PURE__*/_jsxs(SpeedDialIconRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: [openIconProp ? formatIcon(openIconProp, classes.openIcon) : null, iconProp ? formatIcon(iconProp, classes.icon) : /*#__PURE__*/_jsx(AddIcon, {
       className: classes.icon
     })]
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? SpeedDialIcon.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/Step/Step.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["active", "children", "className", "component", "completed", "disabled", "expanded", "index", "last"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -36,12 +33,15 @@ const StepRoot = styled('div', {
   }
 })(({
   ownerState
-}) => _extends({}, ownerState.orientation === 'horizontal' && {
-  paddingLeft: 8,
-  paddingRight: 8
-}, ownerState.alternativeLabel && {
-  flex: 1,
-  position: 'relative'
+}) => ({
+  ...(ownerState.orientation === 'horizontal' && {
+    paddingLeft: 8,
+    paddingRight: 8
+  }),
+  ...(ownerState.alternativeLabel && {
+    flex: 1,
+    position: 'relative'
+  })
 }));
 const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
   const props = useThemeProps({
@@ -49,17 +49,17 @@ const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
     name: 'MuiStep'
   });
   const {
-      active: activeProp,
-      children,
-      className,
-      component = 'div',
-      completed: completedProp,
-      disabled: disabledProp,
-      expanded = false,
-      index,
-      last
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    active: activeProp,
+    children,
+    className,
+    component = 'div',
+    completed: completedProp,
+    disabled: disabledProp,
+    expanded = false,
+    index,
+    last,
+    ...other
+  } = props;
   const {
     activeStep,
     connector,
@@ -84,7 +84,8 @@ const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
     completed,
     disabled
   }), [index, last, expanded, active, completed, disabled]);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     active,
     orientation,
     alternativeLabel,
@@ -92,16 +93,16 @@ const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
     disabled,
     expanded,
     component
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  const newChildren = /*#__PURE__*/_jsxs(StepRoot, _extends({
+  const newChildren = /*#__PURE__*/_jsxs(StepRoot, {
     as: component,
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: [connector && alternativeLabel && index !== 0 ? connector : null, children]
-  }));
+  });
   return /*#__PURE__*/_jsx(StepContext.Provider, {
     value: contextValue,
     children: connector && !alternativeLabel && index !== 0 ? /*#__PURE__*/_jsxs(React.Fragment, {

package/modern/StepButton/StepButton.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "className", "icon", "optional"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -38,16 +35,16 @@ const StepButtonRoot = styled(ButtonBase, {
   }
 })(({
   ownerState
-}) => _extends({
+}) => ({
   width: '100%',
   padding: '24px 16px',
   margin: '-24px -16px',
-  boxSizing: 'content-box'
-}, ownerState.orientation === 'vertical' && {
-  justifyContent: 'flex-start',
-  padding: '8px',
-  margin: '-8px'
-}, {
+  boxSizing: 'content-box',
+  ...(ownerState.orientation === 'vertical' && {
+    justifyContent: 'flex-start',
+    padding: '8px',
+    margin: '-8px'
+  }),
   [`& .${stepButtonClasses.touchRipple}`]: {
     color: 'rgba(0, 0, 0, 0.3)'
   }
@@ -58,12 +55,12 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
     name: 'MuiStepButton'
   });
   const {
-      children,
-      className,
-      icon,
-      optional
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    icon,
+    optional,
+    ...other
+  } = props;
   const {
     disabled,
     active
@@ -71,18 +68,20 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
   const {
     orientation
   } = React.useContext(StepperContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     orientation
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   const childProps = {
     icon,
     optional
   };
-  const child = isMuiElement(children, ['StepLabel']) ? /*#__PURE__*/React.cloneElement(children, childProps) : /*#__PURE__*/_jsx(StepLabel, _extends({}, childProps, {
+  const child = isMuiElement(children, ['StepLabel']) ? /*#__PURE__*/React.cloneElement(children, childProps) : /*#__PURE__*/_jsx(StepLabel, {
+    ...childProps,
     children: children
-  }));
-  return /*#__PURE__*/_jsx(StepButtonRoot, _extends({
+  });
+  return /*#__PURE__*/_jsx(StepButtonRoot, {
     focusRipple: true,
     disabled: disabled,
     TouchRippleProps: {
@@ -91,10 +90,10 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
     className: clsx(classes.root, className),
     ref: ref,
     ownerState: ownerState,
-    "aria-current": active ? 'step' : undefined
-  }, other, {
+    "aria-current": active ? 'step' : undefined,
+    ...other,
     children: child
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? StepButton.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/StepConnector/StepConnector.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -38,15 +35,18 @@ const StepConnectorRoot = styled('div', {
   }
 })(({
   ownerState
-}) => _extends({
-  flex: '1 1 auto'
-}, ownerState.orientation === 'vertical' && {
-  marginLeft: 12 // half icon
-}, ownerState.alternativeLabel && {
-  position: 'absolute',
-  top: 8 + 4,
-  left: 'calc(-50% + 20px)',
-  right: 'calc(50% + 20px)'
+}) => ({
+  flex: '1 1 auto',
+  ...(ownerState.orientation === 'vertical' && {
+    marginLeft: 12 // half icon
+  }),
+
+  ...(ownerState.alternativeLabel && {
+    position: 'absolute',
+    top: 8 + 4,
+    left: 'calc(-50% + 20px)',
+    right: 'calc(50% + 20px)'
+  })
 }));
 const StepConnectorLine = styled('span', {
   name: 'MuiStepConnector',
@@ -62,17 +62,19 @@ const StepConnectorLine = styled('span', {
   theme
 }) => {
   const borderColor = theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[600];
-  return _extends({
+  return {
     display: 'block',
-    borderColor: theme.vars ? theme.vars.palette.StepConnector.border : borderColor
-  }, ownerState.orientation === 'horizontal' && {
-    borderTopStyle: 'solid',
-    borderTopWidth: 1
-  }, ownerState.orientation === 'vertical' && {
-    borderLeftStyle: 'solid',
-    borderLeftWidth: 1,
-    minHeight: 24
-  });
+    borderColor: theme.vars ? theme.vars.palette.StepConnector.border : borderColor,
+    ...(ownerState.orientation === 'horizontal' && {
+      borderTopStyle: 'solid',
+      borderTopWidth: 1
+    }),
+    ...(ownerState.orientation === 'vertical' && {
+      borderLeftStyle: 'solid',
+      borderLeftWidth: 1,
+      minHeight: 24
+    })
+  };
 });
 const StepConnector = /*#__PURE__*/React.forwardRef(function StepConnector(inProps, ref) {
   const props = useThemeProps({
@@ -80,9 +82,9 @@ const StepConnector = /*#__PURE__*/React.forwardRef(function StepConnector(inPro
     name: 'MuiStepConnector'
   });
   const {
-      className
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    className,
+    ...other
+  } = props;
   const {
     alternativeLabel,
     orientation = 'horizontal'
@@ -92,24 +94,25 @@ const StepConnector = /*#__PURE__*/React.forwardRef(function StepConnector(inPro
     disabled,
     completed
   } = React.useContext(StepContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     alternativeLabel,
     orientation,
     active,
     completed,
     disabled
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(StepConnectorRoot, _extends({
+  return /*#__PURE__*/_jsx(StepConnectorRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: /*#__PURE__*/_jsx(StepConnectorLine, {
       className: classes.line,
       ownerState: ownerState
     })
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? StepConnector.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/StepContent/StepContent.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "className", "TransitionComponent", "transitionDuration", "TransitionProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -35,15 +32,16 @@ const StepContentRoot = styled('div', {
 })(({
   ownerState,
   theme
-}) => _extends({
+}) => ({
   marginLeft: 12,
   // half icon
   paddingLeft: 8 + 12,
   // margin + half icon
   paddingRight: 8,
-  borderLeft: theme.vars ? `1px solid ${theme.vars.palette.StepContent.border}` : `1px solid ${theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]}`
-}, ownerState.last && {
-  borderLeft: 'none'
+  borderLeft: theme.vars ? `1px solid ${theme.vars.palette.StepContent.border}` : `1px solid ${theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]}`,
+  ...(ownerState.last && {
+    borderLeft: 'none'
+  })
 }));
 const StepContentTransition = styled(Collapse, {
   name: 'MuiStepContent',
@@ -56,13 +54,13 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
     name: 'MuiStepContent'
   });
   const {
-      children,
-      className,
-      TransitionComponent = Collapse,
-      transitionDuration: transitionDurationProp = 'auto',
-      TransitionProps
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    TransitionComponent = Collapse,
+    transitionDuration: transitionDurationProp = 'auto',
+    TransitionProps,
+    ...other
+  } = props;
   const {
     orientation
   } = React.useContext(StepperContext);
@@ -71,9 +69,10 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
     last,
     expanded
   } = React.useContext(StepContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     last
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   if (process.env.NODE_ENV !== 'production') {
     if (orientation !== 'vertical') {
@@ -84,22 +83,22 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
   if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
     transitionDuration = undefined;
   }
-  return /*#__PURE__*/_jsx(StepContentRoot, _extends({
+  return /*#__PURE__*/_jsx(StepContentRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
-    children: /*#__PURE__*/_jsx(StepContentTransition, _extends({
+    ownerState: ownerState,
+    ...other,
+    children: /*#__PURE__*/_jsx(StepContentTransition, {
       as: TransitionComponent,
       in: active || expanded,
       className: classes.transition,
       ownerState: ownerState,
       timeout: transitionDuration,
-      unmountOnExit: true
-    }, TransitionProps, {
+      unmountOnExit: true,
+      ...TransitionProps,
       children: children
-    }))
-  }));
+    })
+  });
 });
 process.env.NODE_ENV !== "production" ? StepContent.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------