@mui/material 5.13.1 → 5.13.2

package/modern/CardHeader/CardHeader.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["action", "avatar", "className", "component", "disableTypography", "subheader", "subheaderTypographyProps", "title", "titleTypographyProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -25,11 +28,10 @@ const useUtilityClasses = ownerState => {
 const CardHeaderRoot = styled('div', {
   name: 'MuiCardHeader',
   slot: 'Root',
-  overridesResolver: (props, styles) => ({
+  overridesResolver: (props, styles) => _extends({
     [`& .${cardHeaderClasses.title}`]: styles.title,
-    [`& .${cardHeaderClasses.subheader}`]: styles.subheader,
-    ...styles.root
-  })
+    [`& .${cardHeaderClasses.subheader}`]: styles.subheader
+  }, styles.root)
 })({
   display: 'flex',
   alignItems: 'center',
@@ -68,52 +70,51 @@ const CardHeader = /*#__PURE__*/React.forwardRef(function CardHeader(inProps, re
     name: 'MuiCardHeader'
   });
   const {
-    action,
-    avatar,
-    className,
-    component = 'div',
-    disableTypography = false,
-    subheader: subheaderProp,
-    subheaderTypographyProps,
-    title: titleProp,
-    titleTypographyProps,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      action,
+      avatar,
+      className,
+      component = 'div',
+      disableTypography = false,
+      subheader: subheaderProp,
+      subheaderTypographyProps,
+      title: titleProp,
+      titleTypographyProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     component,
     disableTypography
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   let title = titleProp;
   if (title != null && title.type !== Typography && !disableTypography) {
-    title = /*#__PURE__*/_jsx(Typography, {
+    title = /*#__PURE__*/_jsx(Typography, _extends({
       variant: avatar ? 'body2' : 'h5',
       className: classes.title,
       component: "span",
-      display: "block",
-      ...titleTypographyProps,
+      display: "block"
+    }, titleTypographyProps, {
       children: title
-    });
+    }));
   }
   let subheader = subheaderProp;
   if (subheader != null && subheader.type !== Typography && !disableTypography) {
-    subheader = /*#__PURE__*/_jsx(Typography, {
+    subheader = /*#__PURE__*/_jsx(Typography, _extends({
       variant: avatar ? 'body2' : 'body1',
       className: classes.subheader,
       color: "text.secondary",
       component: "span",
-      display: "block",
-      ...subheaderTypographyProps,
+      display: "block"
+    }, subheaderTypographyProps, {
       children: subheader
-    });
+    }));
   }
-  return /*#__PURE__*/_jsxs(CardHeaderRoot, {
+  return /*#__PURE__*/_jsxs(CardHeaderRoot, _extends({
     className: clsx(classes.root, className),
     as: component,
     ref: ref,
-    ownerState: ownerState,
-    ...other,
+    ownerState: ownerState
+  }, other, {
     children: [avatar && /*#__PURE__*/_jsx(CardHeaderAvatar, {
       className: classes.avatar,
       ownerState: ownerState,
@@ -127,7 +128,7 @@ const CardHeader = /*#__PURE__*/React.forwardRef(function CardHeader(inProps, re
       ownerState: ownerState,
       children: action
     })]
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? CardHeader.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/CardMedia/CardMedia.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "component", "image", "src", "style"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -33,18 +36,16 @@ const CardMediaRoot = styled('div', {
   }
 })(({
   ownerState
-}) => ({
+}) => _extends({
   display: 'block',
   backgroundSize: 'cover',
   backgroundRepeat: 'no-repeat',
-  backgroundPosition: 'center',
-  ...(ownerState.isMediaComponent && {
-    width: '100%'
-  }),
-  ...(ownerState.isImageComponent && {
-    // ⚠️ object-fit is not supported by IE11.
-    objectFit: 'cover'
-  })
+  backgroundPosition: 'center'
+}, ownerState.isMediaComponent && {
+  width: '100%'
+}, ownerState.isImageComponent && {
+  // ⚠️ object-fit is not supported by IE11.
+  objectFit: 'cover'
 }));
 const MEDIA_COMPONENTS = ['video', 'audio', 'picture', 'iframe', 'img'];
 const IMAGE_COMPONENTS = ['picture', 'img'];
@@ -54,37 +55,35 @@ const CardMedia = /*#__PURE__*/React.forwardRef(function CardMedia(inProps, ref)
     name: 'MuiCardMedia'
   });
   const {
-    children,
-    className,
-    component = 'div',
-    image,
-    src,
-    style,
-    ...other
-  } = props;
+      children,
+      className,
+      component = 'div',
+      image,
+      src,
+      style
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const isMediaComponent = MEDIA_COMPONENTS.indexOf(component) !== -1;
-  const composedStyle = !isMediaComponent && image ? {
-    backgroundImage: `url("${image}")`,
-    ...style
-  } : style;
-  const ownerState = {
-    ...props,
+  const composedStyle = !isMediaComponent && image ? _extends({
+    backgroundImage: `url("${image}")`
+  }, style) : style;
+  const ownerState = _extends({}, props, {
     component,
     isMediaComponent,
     isImageComponent: IMAGE_COMPONENTS.indexOf(component) !== -1
-  };
+  });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(CardMediaRoot, {
+  return /*#__PURE__*/_jsx(CardMediaRoot, _extends({
     className: clsx(classes.root, className),
     as: component,
     role: !isMediaComponent && image ? 'img' : undefined,
     ref: ref,
     style: composedStyle,
     ownerState: ownerState,
-    src: isMediaComponent ? image || src : undefined,
-    ...other,
+    src: isMediaComponent ? image || src : undefined
+  }, other, {
     children: children
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? CardMedia.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/Checkbox/Checkbox.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["checkedIcon", "color", "icon", "indeterminate", "indeterminateIcon", "inputProps", "size", "className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -23,11 +26,7 @@ const useUtilityClasses = ownerState => {
     root: ['root', indeterminate && 'indeterminate', `color${capitalize(color)}`]
   };
   const composedClasses = composeClasses(slots, getCheckboxUtilityClass, classes);
-  return {
-    ...classes,
-    // forward the disabled and checked classes to the SwitchBase
-    ...composedClasses
-  };
+  return _extends({}, classes, composedClasses);
 };
 const CheckboxRoot = styled(SwitchBase, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -42,25 +41,23 @@ const CheckboxRoot = styled(SwitchBase, {
 })(({
   theme,
   ownerState
-}) => ({
-  color: (theme.vars || theme).palette.text.secondary,
-  ...(!ownerState.disableRipple && {
-    '&:hover': {
-      backgroundColor: theme.vars ? `rgba(${ownerState.color === 'default' ? theme.vars.palette.action.activeChannel : theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(ownerState.color === 'default' ? theme.palette.action.active : theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: 'transparent'
-      }
-    }
-  }),
-  ...(ownerState.color !== 'default' && {
-    [`&.${checkboxClasses.checked}, &.${checkboxClasses.indeterminate}`]: {
-      color: (theme.vars || theme).palette[ownerState.color].main
-    },
-    [`&.${checkboxClasses.disabled}`]: {
-      color: (theme.vars || theme).palette.action.disabled
+}) => _extends({
+  color: (theme.vars || theme).palette.text.secondary
+}, !ownerState.disableRipple && {
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${ownerState.color === 'default' ? theme.vars.palette.action.activeChannel : theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(ownerState.color === 'default' ? theme.palette.action.active : theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
     }
-  })
+  }
+}, ownerState.color !== 'default' && {
+  [`&.${checkboxClasses.checked}, &.${checkboxClasses.indeterminate}`]: {
+    color: (theme.vars || theme).palette[ownerState.color].main
+  },
+  [`&.${checkboxClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.action.disabled
+  }
 }));
 const defaultCheckedIcon = /*#__PURE__*/_jsx(CheckBoxIcon, {});
 const defaultIcon = /*#__PURE__*/_jsx(CheckBoxOutlineBlankIcon, {});
@@ -71,31 +68,29 @@ const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(inProps, ref) {
     name: 'MuiCheckbox'
   });
   const {
-    checkedIcon = defaultCheckedIcon,
-    color = 'primary',
-    icon: iconProp = defaultIcon,
-    indeterminate = false,
-    indeterminateIcon: indeterminateIconProp = defaultIndeterminateIcon,
-    inputProps,
-    size = 'medium',
-    className,
-    ...other
-  } = props;
+      checkedIcon = defaultCheckedIcon,
+      color = 'primary',
+      icon: iconProp = defaultIcon,
+      indeterminate = false,
+      indeterminateIcon: indeterminateIconProp = defaultIndeterminateIcon,
+      inputProps,
+      size = 'medium',
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const icon = indeterminate ? indeterminateIconProp : iconProp;
   const indeterminateIcon = indeterminate ? indeterminateIconProp : checkedIcon;
-  const ownerState = {
-    ...props,
+  const ownerState = _extends({}, props, {
     color,
     indeterminate,
     size
-  };
+  });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(CheckboxRoot, {
+  return /*#__PURE__*/_jsx(CheckboxRoot, _extends({
     type: "checkbox",
-    inputProps: {
-      'data-indeterminate': indeterminate,
-      ...inputProps
-    },
+    inputProps: _extends({
+      'data-indeterminate': indeterminate
+    }, inputProps),
     icon: /*#__PURE__*/React.cloneElement(icon, {
       fontSize: icon.props.fontSize ?? size
     }),
@@ -104,10 +99,10 @@ const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(inProps, ref) {
     }),
     ownerState: ownerState,
     ref: ref,
-    className: clsx(classes.root, className),
-    ...other,
+    className: clsx(classes.root, className)
+  }, other, {
     classes: classes
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? Checkbox.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------