@mui/material 5.13.1 → 5.13.3

package/modern/Switch/Switch.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "color", "edge", "size", "sx"];
 // @inheritedComponent IconButton
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -29,11 +32,7 @@ const useUtilityClasses = ownerState => {
     input: ['input']
   };
   const composedClasses = composeClasses(slots, getSwitchUtilityClass, classes);
-  return {
-    ...classes,
-    // forward the disabled and checked classes to the SwitchBase
-    ...composedClasses
-  };
+  return _extends({}, classes, composedClasses);
 };
 const SwitchRoot = styled('span', {
   name: 'MuiSwitch',
@@ -46,7 +45,7 @@ const SwitchRoot = styled('span', {
   }
 })(({
   ownerState
-}) => ({
+}) => _extends({
   display: 'inline-flex',
   width: 34 + 12 * 2,
   height: 14 + 12 * 2,
@@ -61,28 +60,25 @@ const SwitchRoot = styled('span', {
   // For correct alignment with the text.
   '@media print': {
     colorAdjust: 'exact'
+  }
+}, ownerState.edge === 'start' && {
+  marginLeft: -8
+}, ownerState.edge === 'end' && {
+  marginRight: -8
+}, ownerState.size === 'small' && {
+  width: 40,
+  height: 24,
+  padding: 7,
+  [`& .${switchClasses.thumb}`]: {
+    width: 16,
+    height: 16
   },
-  ...(ownerState.edge === 'start' && {
-    marginLeft: -8
-  }),
-  ...(ownerState.edge === 'end' && {
-    marginRight: -8
-  }),
-  ...(ownerState.size === 'small' && {
-    width: 40,
-    height: 24,
-    padding: 7,
-    [`& .${switchClasses.thumb}`]: {
-      width: 16,
-      height: 16
-    },
-    [`& .${switchClasses.switchBase}`]: {
-      padding: 4,
-      [`&.${switchClasses.checked}`]: {
-        transform: 'translateX(16px)'
-      }
+  [`& .${switchClasses.switchBase}`]: {
+    padding: 4,
+    [`&.${switchClasses.checked}`]: {
+      transform: 'translateX(16px)'
     }
-  })
+  }
 }));
 const SwitchSwitchBase = styled(SwitchBase, {
   name: 'MuiSwitch',
@@ -126,31 +122,30 @@ const SwitchSwitchBase = styled(SwitchBase, {
 }), ({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   '&:hover': {
     backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.activeChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.action.active, theme.palette.action.hoverOpacity),
     // Reset on touch devices, it doesn't add specificity
     '@media (hover: none)': {
       backgroundColor: 'transparent'
     }
-  },
-  ...(ownerState.color !== 'default' && {
-    [`&.${switchClasses.checked}`]: {
-      color: (theme.vars || theme).palette[ownerState.color].main,
-      '&:hover': {
-        backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
-        '@media (hover: none)': {
-          backgroundColor: 'transparent'
-        }
-      },
-      [`&.${switchClasses.disabled}`]: {
-        color: theme.vars ? theme.vars.palette.Switch[`${ownerState.color}DisabledColor`] : `${theme.palette.mode === 'light' ? lighten(theme.palette[ownerState.color].main, 0.62) : darken(theme.palette[ownerState.color].main, 0.55)}`
+  }
+}, ownerState.color !== 'default' && {
+  [`&.${switchClasses.checked}`]: {
+    color: (theme.vars || theme).palette[ownerState.color].main,
+    '&:hover': {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
       }
     },
-    [`&.${switchClasses.checked} + .${switchClasses.track}`]: {
-      backgroundColor: (theme.vars || theme).palette[ownerState.color].main
+    [`&.${switchClasses.disabled}`]: {
+      color: theme.vars ? theme.vars.palette.Switch[`${ownerState.color}DisabledColor`] : `${theme.palette.mode === 'light' ? lighten(theme.palette[ownerState.color].main, 0.62) : darken(theme.palette[ownerState.color].main, 0.55)}`
     }
-  })
+  },
+  [`&.${switchClasses.checked} + .${switchClasses.track}`]: {
+    backgroundColor: (theme.vars || theme).palette[ownerState.color].main
+  }
 }));
 const SwitchTrack = styled('span', {
   name: 'MuiSwitch',
@@ -188,19 +183,18 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch(inProps, ref) {
     name: 'MuiSwitch'
   });
   const {
-    className,
-    color = 'primary',
-    edge = false,
-    size = 'medium',
-    sx,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      className,
+      color = 'primary',
+      edge = false,
+      size = 'medium',
+      sx
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     color,
     edge,
     size
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   const icon = /*#__PURE__*/_jsx(SwitchThumb, {
     className: classes.thumb,
@@ -210,18 +204,17 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch(inProps, ref) {
     className: clsx(classes.root, className),
     sx: sx,
     ownerState: ownerState,
-    children: [/*#__PURE__*/_jsx(SwitchSwitchBase, {
+    children: [/*#__PURE__*/_jsx(SwitchSwitchBase, _extends({
       type: "checkbox",
       icon: icon,
       checkedIcon: icon,
       ref: ref,
-      ownerState: ownerState,
-      ...other,
-      classes: {
-        ...classes,
+      ownerState: ownerState
+    }, other, {
+      classes: _extends({}, classes, {
         root: classes.switchBase
-      }
-    }), /*#__PURE__*/_jsx(SwitchTrack, {
+      })
+    })), /*#__PURE__*/_jsx(SwitchTrack, {
       className: classes.track,
       ownerState: ownerState
     })]

package/modern/Tab/Tab.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "disabled", "disableFocusRipple", "fullWidth", "icon", "iconPosition", "indicator", "label", "onChange", "onClick", "onFocus", "selected", "selectionFollowsFocus", "textColor", "value", "wrapped"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -38,8 +41,7 @@ const TabRoot = styled(ButtonBase, {
 })(({
   theme,
   ownerState
-}) => ({
-  ...theme.typography.button,
+}) => _extends({}, theme.typography.button, {
   maxWidth: 360,
   minWidth: 90,
   position: 'relative',
@@ -48,68 +50,57 @@ const TabRoot = styled(ButtonBase, {
   padding: '12px 16px',
   overflow: 'hidden',
   whiteSpace: 'normal',
-  textAlign: 'center',
-  ...(ownerState.label && {
-    flexDirection: ownerState.iconPosition === 'top' || ownerState.iconPosition === 'bottom' ? 'column' : 'row'
-  }),
-  lineHeight: 1.25,
-  ...(ownerState.icon && ownerState.label && {
-    minHeight: 72,
-    paddingTop: 9,
-    paddingBottom: 9,
-    [`& > .${tabClasses.iconWrapper}`]: {
-      ...(ownerState.iconPosition === 'top' && {
-        marginBottom: 6
-      }),
-      ...(ownerState.iconPosition === 'bottom' && {
-        marginTop: 6
-      }),
-      ...(ownerState.iconPosition === 'start' && {
-        marginRight: theme.spacing(1)
-      }),
-      ...(ownerState.iconPosition === 'end' && {
-        marginLeft: theme.spacing(1)
-      })
-    }
-  }),
-  ...(ownerState.textColor === 'inherit' && {
-    color: 'inherit',
-    opacity: 0.6,
-    // same opacity as theme.palette.text.secondary
-    [`&.${tabClasses.selected}`]: {
-      opacity: 1
-    },
-    [`&.${tabClasses.disabled}`]: {
-      opacity: (theme.vars || theme).palette.action.disabledOpacity
-    }
-  }),
-  ...(ownerState.textColor === 'primary' && {
-    color: (theme.vars || theme).palette.text.secondary,
-    [`&.${tabClasses.selected}`]: {
-      color: (theme.vars || theme).palette.primary.main
-    },
-    [`&.${tabClasses.disabled}`]: {
-      color: (theme.vars || theme).palette.text.disabled
-    }
-  }),
-  ...(ownerState.textColor === 'secondary' && {
-    color: (theme.vars || theme).palette.text.secondary,
-    [`&.${tabClasses.selected}`]: {
-      color: (theme.vars || theme).palette.secondary.main
-    },
-    [`&.${tabClasses.disabled}`]: {
-      color: (theme.vars || theme).palette.text.disabled
-    }
-  }),
-  ...(ownerState.fullWidth && {
-    flexShrink: 1,
-    flexGrow: 1,
-    flexBasis: 0,
-    maxWidth: 'none'
-  }),
-  ...(ownerState.wrapped && {
-    fontSize: theme.typography.pxToRem(12)
+  textAlign: 'center'
+}, ownerState.label && {
+  flexDirection: ownerState.iconPosition === 'top' || ownerState.iconPosition === 'bottom' ? 'column' : 'row'
+}, {
+  lineHeight: 1.25
+}, ownerState.icon && ownerState.label && {
+  minHeight: 72,
+  paddingTop: 9,
+  paddingBottom: 9,
+  [`& > .${tabClasses.iconWrapper}`]: _extends({}, ownerState.iconPosition === 'top' && {
+    marginBottom: 6
+  }, ownerState.iconPosition === 'bottom' && {
+    marginTop: 6
+  }, ownerState.iconPosition === 'start' && {
+    marginRight: theme.spacing(1)
+  }, ownerState.iconPosition === 'end' && {
+    marginLeft: theme.spacing(1)
   })
+}, ownerState.textColor === 'inherit' && {
+  color: 'inherit',
+  opacity: 0.6,
+  // same opacity as theme.palette.text.secondary
+  [`&.${tabClasses.selected}`]: {
+    opacity: 1
+  },
+  [`&.${tabClasses.disabled}`]: {
+    opacity: (theme.vars || theme).palette.action.disabledOpacity
+  }
+}, ownerState.textColor === 'primary' && {
+  color: (theme.vars || theme).palette.text.secondary,
+  [`&.${tabClasses.selected}`]: {
+    color: (theme.vars || theme).palette.primary.main
+  },
+  [`&.${tabClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled
+  }
+}, ownerState.textColor === 'secondary' && {
+  color: (theme.vars || theme).palette.text.secondary,
+  [`&.${tabClasses.selected}`]: {
+    color: (theme.vars || theme).palette.secondary.main
+  },
+  [`&.${tabClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled
+  }
+}, ownerState.fullWidth && {
+  flexShrink: 1,
+  flexGrow: 1,
+  flexBasis: 0,
+  maxWidth: 'none'
+}, ownerState.wrapped && {
+  fontSize: theme.typography.pxToRem(12)
 }));
 const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
   const props = useThemeProps({
@@ -117,31 +108,30 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
     name: 'MuiTab'
   });
   const {
-    className,
-    disabled = false,
-    disableFocusRipple = false,
-    // eslint-disable-next-line react/prop-types
-    fullWidth,
-    icon: iconProp,
-    iconPosition = 'top',
-    // eslint-disable-next-line react/prop-types
-    indicator,
-    label,
-    onChange,
-    onClick,
-    onFocus,
-    // eslint-disable-next-line react/prop-types
-    selected,
-    // eslint-disable-next-line react/prop-types
-    selectionFollowsFocus,
-    // eslint-disable-next-line react/prop-types
-    textColor = 'inherit',
-    value,
-    wrapped = false,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      className,
+      disabled = false,
+      disableFocusRipple = false,
+      // eslint-disable-next-line react/prop-types
+      fullWidth,
+      icon: iconProp,
+      iconPosition = 'top',
+      // eslint-disable-next-line react/prop-types
+      indicator,
+      label,
+      onChange,
+      onClick,
+      onFocus,
+      // eslint-disable-next-line react/prop-types
+      selected,
+      // eslint-disable-next-line react/prop-types
+      selectionFollowsFocus,
+      // eslint-disable-next-line react/prop-types
+      textColor = 'inherit',
+      value,
+      wrapped = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     disabled,
     disableFocusRipple,
     selected,
@@ -151,7 +141,7 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
     fullWidth,
     textColor,
     wrapped
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   const icon = iconProp && label && /*#__PURE__*/React.isValidElement(iconProp) ? /*#__PURE__*/React.cloneElement(iconProp, {
     className: clsx(classes.iconWrapper, iconProp.props.className)
@@ -172,7 +162,7 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
       onFocus(event);
     }
   };
-  return /*#__PURE__*/_jsxs(TabRoot, {
+  return /*#__PURE__*/_jsxs(TabRoot, _extends({
     focusRipple: !disableFocusRipple,
     className: clsx(classes.root, className),
     ref: ref,
@@ -182,14 +172,14 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
     onClick: handleClick,
     onFocus: handleFocus,
     ownerState: ownerState,
-    tabIndex: selected ? 0 : -1,
-    ...other,
+    tabIndex: selected ? 0 : -1
+  }, other, {
     children: [iconPosition === 'top' || iconPosition === 'start' ? /*#__PURE__*/_jsxs(React.Fragment, {
       children: [icon, label]
     }) : /*#__PURE__*/_jsxs(React.Fragment, {
       children: [label, icon]
     }), indicator]
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? Tab.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/TabScrollButton/TabScrollButton.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "slots", "slotProps", "direction", "orientation", "disabled"];
 /* eslint-disable jsx-a11y/aria-role */
 import * as React from 'react';
 import PropTypes from 'prop-types';
@@ -33,20 +36,19 @@ const TabScrollButtonRoot = styled(ButtonBase, {
   }
 })(({
   ownerState
-}) => ({
+}) => _extends({
   width: 40,
   flexShrink: 0,
   opacity: 0.8,
   [`&.${tabScrollButtonClasses.disabled}`]: {
     opacity: 0
-  },
-  ...(ownerState.orientation === 'vertical' && {
-    width: '100%',
-    height: 40,
-    '& svg': {
-      transform: `rotate(${ownerState.isRtl ? -90 : 90}deg)`
-    }
-  })
+  }
+}, ownerState.orientation === 'vertical' && {
+  width: '100%',
+  height: 40,
+  '& svg': {
+    transform: `rotate(${ownerState.isRtl ? -90 : 90}deg)`
+  }
 }));
 const TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(inProps, ref) {
   const props = useThemeProps({
@@ -54,20 +56,17 @@ const TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(i
     name: 'MuiTabScrollButton'
   });
   const {
-    className,
-    slots = {},
-    slotProps = {},
-    direction,
-    orientation,
-    disabled,
-    ...other
-  } = props;
+      className,
+      slots = {},
+      slotProps = {},
+      direction
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const theme = useTheme();
   const isRtl = theme.direction === 'rtl';
-  const ownerState = {
-    isRtl,
-    ...props
-  };
+  const ownerState = _extends({
+    isRtl
+  }, props);
   const classes = useUtilityClasses(ownerState);
   const StartButtonIcon = slots.StartScrollButtonIcon ?? KeyboardArrowLeft;
   const EndButtonIcon = slots.EndScrollButtonIcon ?? KeyboardArrowRight;
@@ -87,20 +86,16 @@ const TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(i
     },
     ownerState
   });
-  return /*#__PURE__*/_jsx(TabScrollButtonRoot, {
+  return /*#__PURE__*/_jsx(TabScrollButtonRoot, _extends({
     component: "div",
     className: clsx(classes.root, className),
     ref: ref,
     role: null,
     ownerState: ownerState,
-    tabIndex: null,
-    ...other,
-    children: direction === 'left' ? /*#__PURE__*/_jsx(StartButtonIcon, {
-      ...startButtonIconProps
-    }) : /*#__PURE__*/_jsx(EndButtonIcon, {
-      ...endButtonIconProps
-    })
-  });
+    tabIndex: null
+  }, other, {
+    children: direction === 'left' ? /*#__PURE__*/_jsx(StartButtonIcon, _extends({}, startButtonIconProps)) : /*#__PURE__*/_jsx(EndButtonIcon, _extends({}, endButtonIconProps))
+  }));
 });
 process.env.NODE_ENV !== "production" ? TabScrollButton.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/Table/Table.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "component", "padding", "size", "stickyHeader"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -29,21 +32,19 @@ const TableRoot = styled('table', {
 })(({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   display: 'table',
   width: '100%',
   borderCollapse: 'collapse',
   borderSpacing: 0,
-  '& caption': {
-    ...theme.typography.body2,
+  '& caption': _extends({}, theme.typography.body2, {
     padding: theme.spacing(2),
     color: (theme.vars || theme).palette.text.secondary,
     textAlign: 'left',
     captionSide: 'bottom'
-  },
-  ...(ownerState.stickyHeader && {
-    borderCollapse: 'separate'
   })
+}, ownerState.stickyHeader && {
+  borderCollapse: 'separate'
 }));
 const defaultComponent = 'table';
 const Table = /*#__PURE__*/React.forwardRef(function Table(inProps, ref) {
@@ -52,20 +53,19 @@ const Table = /*#__PURE__*/React.forwardRef(function Table(inProps, ref) {
     name: 'MuiTable'
   });
   const {
-    className,
-    component = defaultComponent,
-    padding = 'normal',
-    size = 'medium',
-    stickyHeader = false,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      className,
+      component = defaultComponent,
+      padding = 'normal',
+      size = 'medium',
+      stickyHeader = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     component,
     padding,
     size,
     stickyHeader
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   const table = React.useMemo(() => ({
     padding,
@@ -74,14 +74,13 @@ const Table = /*#__PURE__*/React.forwardRef(function Table(inProps, ref) {
   }), [padding, size, stickyHeader]);
   return /*#__PURE__*/_jsx(TableContext.Provider, {
     value: table,
-    children: /*#__PURE__*/_jsx(TableRoot, {
+    children: /*#__PURE__*/_jsx(TableRoot, _extends({
       as: component,
       role: component === defaultComponent ? null : 'table',
       ref: ref,
       className: clsx(classes.root, className),
-      ownerState: ownerState,
-      ...other
-    })
+      ownerState: ownerState
+    }, other))
   });
 });
 process.env.NODE_ENV !== "production" ? Table.propTypes /* remove-proptypes */ = {

package/modern/TableBody/TableBody.js

@@ -1,3 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "component"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -33,25 +36,23 @@ const TableBody = /*#__PURE__*/React.forwardRef(function TableBody(inProps, ref)
     name: 'MuiTableBody'
   });
   const {
-    className,
-    component = defaultComponent,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      className,
+      component = defaultComponent
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     component
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(Tablelvl2Context.Provider, {
     value: tablelvl2,
-    children: /*#__PURE__*/_jsx(TableBodyRoot, {
+    children: /*#__PURE__*/_jsx(TableBodyRoot, _extends({
       className: clsx(classes.root, className),
       as: component,
       ref: ref,
       role: component === defaultComponent ? null : 'rowgroup',
-      ownerState: ownerState,
-      ...other
-    })
+      ownerState: ownerState
+    }, other))
   });
 });
 process.env.NODE_ENV !== "production" ? TableBody.propTypes /* remove-proptypes */ = {