@mui/material 5.12.3 → 5.13.1

package/modern/ImageListItem/ImageListItem.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", "cols", "component", "rows", "style"];
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { integerPropType } from '@mui/utils';
 import clsx from 'clsx';
@@ -37,29 +34,31 @@ const ImageListItemRoot = styled('li', {
   }
 })(({
   ownerState
-}) => _extends({
+}) => ({
   display: 'block',
-  position: 'relative'
-}, ownerState.variant === 'standard' && {
-  // For titlebar under list item
-  display: 'flex',
-  flexDirection: 'column'
-}, ownerState.variant === 'woven' && {
-  height: '100%',
-  alignSelf: 'center',
-  '&:nth-of-type(even)': {
-    height: '70%'
-  }
-}, {
-  [`& .${imageListItemClasses.img}`]: _extends({
+  position: 'relative',
+  ...(ownerState.variant === 'standard' && {
+    // For titlebar under list item
+    display: 'flex',
+    flexDirection: 'column'
+  }),
+  ...(ownerState.variant === 'woven' && {
+    height: '100%',
+    alignSelf: 'center',
+    '&:nth-of-type(even)': {
+      height: '70%'
+    }
+  }),
+  [`& .${imageListItemClasses.img}`]: {
     objectFit: 'cover',
     width: '100%',
     height: '100%',
-    display: 'block'
-  }, ownerState.variant === 'standard' && {
-    height: 'auto',
-    flexGrow: 1
-  })
+    display: 'block',
+    ...(ownerState.variant === 'standard' && {
+      height: 'auto',
+      flexGrow: 1
+    })
+  }
 }));
 const ImageListItem = /*#__PURE__*/React.forwardRef(function ImageListItem(inProps, ref) {
   const props = useThemeProps({
@@ -69,14 +68,14 @@ const ImageListItem = /*#__PURE__*/React.forwardRef(function ImageListItem(inPro
 
   // TODO: - Use jsdoc @default?: "cols rows default values are for docs only"
   const {
-      children,
-      className,
-      cols = 1,
-      component = 'li',
-      rows = 1,
-      style
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    cols = 1,
+    component = 'li',
+    rows = 1,
+    style,
+    ...other
+  } = props;
   const {
     rowHeight = 'auto',
     gap,
@@ -88,27 +87,29 @@ const ImageListItem = /*#__PURE__*/React.forwardRef(function ImageListItem(inPro
   } else if (rowHeight !== 'auto') {
     height = rowHeight * rows + gap * (rows - 1);
   }
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     cols,
     component,
     gap,
     rowHeight,
     rows,
     variant
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(ImageListItemRoot, _extends({
+  return /*#__PURE__*/_jsx(ImageListItemRoot, {
     as: component,
     className: clsx(classes.root, classes[variant], className),
     ref: ref,
-    style: _extends({
+    style: {
       height,
       gridColumnEnd: variant !== 'masonry' ? `span ${cols}` : undefined,
       gridRowEnd: variant !== 'masonry' ? `span ${rows}` : undefined,
-      marginBottom: variant === 'masonry' ? gap : undefined
-    }, style),
-    ownerState: ownerState
-  }, other, {
+      marginBottom: variant === 'masonry' ? gap : undefined,
+      ...style
+    },
+    ownerState: ownerState,
+    ...other,
     children: React.Children.map(children, child => {
       if (! /*#__PURE__*/React.isValidElement(child)) {
         return null;
@@ -125,7 +126,7 @@ const ImageListItem = /*#__PURE__*/React.forwardRef(function ImageListItem(inPro
       }
       return child;
     })
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? ImageListItem.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/ImageListItemBar/ImageListItemBar.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["actionIcon", "actionPosition", "className", "subtitle", "title", "position"];
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -40,23 +37,26 @@ const ImageListItemBarRoot = styled('div', {
   theme,
   ownerState
 }) => {
-  return _extends({
+  return {
     position: 'absolute',
     left: 0,
     right: 0,
     background: 'rgba(0, 0, 0, 0.5)',
     display: 'flex',
     alignItems: 'center',
-    fontFamily: theme.typography.fontFamily
-  }, ownerState.position === 'bottom' && {
-    bottom: 0
-  }, ownerState.position === 'top' && {
-    top: 0
-  }, ownerState.position === 'below' && {
-    position: 'relative',
-    background: 'transparent',
-    alignItems: 'normal'
-  });
+    fontFamily: theme.typography.fontFamily,
+    ...(ownerState.position === 'bottom' && {
+      bottom: 0
+    }),
+    ...(ownerState.position === 'top' && {
+      top: 0
+    }),
+    ...(ownerState.position === 'below' && {
+      position: 'relative',
+      background: 'transparent',
+      alignItems: 'normal'
+    })
+  };
 });
 const ImageListItemBarTitleWrap = styled('div', {
   name: 'MuiImageListItemBar',
@@ -71,19 +71,22 @@ const ImageListItemBarTitleWrap = styled('div', {
   theme,
   ownerState
 }) => {
-  return _extends({
+  return {
     flexGrow: 1,
     padding: '12px 16px',
     color: (theme.vars || theme).palette.common.white,
-    overflow: 'hidden'
-  }, ownerState.position === 'below' && {
-    padding: '6px 0 12px',
-    color: 'inherit'
-  }, ownerState.actionIcon && ownerState.actionPosition === 'left' && {
-    paddingLeft: 0
-  }, ownerState.actionIcon && ownerState.actionPosition === 'right' && {
-    paddingRight: 0
-  });
+    overflow: 'hidden',
+    ...(ownerState.position === 'below' && {
+      padding: '6px 0 12px',
+      color: 'inherit'
+    }),
+    ...(ownerState.actionIcon && ownerState.actionPosition === 'left' && {
+      paddingLeft: 0
+    }),
+    ...(ownerState.actionIcon && ownerState.actionPosition === 'right' && {
+      paddingRight: 0
+    })
+  };
 });
 const ImageListItemBarTitle = styled('div', {
   name: 'MuiImageListItemBar',
@@ -127,9 +130,11 @@ const ImageListItemBarActionIcon = styled('div', {
 })(({
   ownerState
 }) => {
-  return _extends({}, ownerState.actionPosition === 'left' && {
-    order: -1
-  });
+  return {
+    ...(ownerState.actionPosition === 'left' && {
+      order: -1
+    })
+  };
 });
 const ImageListItemBar = /*#__PURE__*/React.forwardRef(function ImageListItemBar(inProps, ref) {
   const props = useThemeProps({
@@ -137,24 +142,25 @@ const ImageListItemBar = /*#__PURE__*/React.forwardRef(function ImageListItemBar
     name: 'MuiImageListItemBar'
   });
   const {
-      actionIcon,
-      actionPosition = 'right',
-      className,
-      subtitle,
-      title,
-      position = 'bottom'
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const ownerState = _extends({}, props, {
+    actionIcon,
+    actionPosition = 'right',
+    className,
+    subtitle,
+    title,
+    position = 'bottom',
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
     position,
     actionPosition
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsxs(ImageListItemBarRoot, _extends({
+  return /*#__PURE__*/_jsxs(ImageListItemBarRoot, {
     ownerState: ownerState,
     className: clsx(classes.root, className),
-    ref: ref
-  }, other, {
+    ref: ref,
+    ...other,
     children: [/*#__PURE__*/_jsxs(ImageListItemBarTitleWrap, {
       ownerState: ownerState,
       className: classes.titleWrap,
@@ -170,7 +176,7 @@ const ImageListItemBar = /*#__PURE__*/React.forwardRef(function ImageListItemBar
       className: classes.actionIcon,
       children: actionIcon
     }) : null]
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? ImageListItemBar.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/Input/Input.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
@@ -21,7 +18,11 @@ const useUtilityClasses = ownerState => {
     input: ['input']
   };
   const composedClasses = composeClasses(slots, getInputUtilityClass, classes);
-  return _extends({}, classes, composedClasses);
+  return {
+    ...classes,
+    // forward classes to the InputBase
+    ...composedClasses
+  };
 };
 const InputRoot = styled(InputBaseRoot, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -42,64 +43,66 @@ const InputRoot = styled(InputBaseRoot, {
   if (theme.vars) {
     bottomLineColor = `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})`;
   }
-  return _extends({
-    position: 'relative'
-  }, ownerState.formControl && {
-    'label + &': {
-      marginTop: 16
-    }
-  }, !ownerState.disableUnderline && {
-    '&:after': {
-      borderBottom: `2px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
-      left: 0,
-      bottom: 0,
-      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
-      content: '""',
-      position: 'absolute',
-      right: 0,
-      transform: 'scaleX(0)',
-      transition: theme.transitions.create('transform', {
-        duration: theme.transitions.duration.shorter,
-        easing: theme.transitions.easing.easeOut
-      }),
-      pointerEvents: 'none' // Transparent to the hover style.
-    },
-
-    [`&.${inputClasses.focused}:after`]: {
-      // translateX(0) is a workaround for Safari transform scale bug
-      // See https://github.com/mui/material-ui/issues/31766
-      transform: 'scaleX(1) translateX(0)'
-    },
-    [`&.${inputClasses.error}`]: {
-      '&:before, &:after': {
-        borderBottomColor: (theme.vars || theme).palette.error.main
+  return {
+    position: 'relative',
+    ...(ownerState.formControl && {
+      'label + &': {
+        marginTop: 16
       }
-    },
-    '&:before': {
-      borderBottom: `1px solid ${bottomLineColor}`,
-      left: 0,
-      bottom: 0,
-      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
-      content: '"\\00a0"',
-      position: 'absolute',
-      right: 0,
-      transition: theme.transitions.create('border-bottom-color', {
-        duration: theme.transitions.duration.shorter
-      }),
-      pointerEvents: 'none' // Transparent to the hover style.
-    },
+    }),
+    ...(!ownerState.disableUnderline && {
+      '&:after': {
+        borderBottom: `2px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
+        left: 0,
+        bottom: 0,
+        // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+        content: '""',
+        position: 'absolute',
+        right: 0,
+        transform: 'scaleX(0)',
+        transition: theme.transitions.create('transform', {
+          duration: theme.transitions.duration.shorter,
+          easing: theme.transitions.easing.easeOut
+        }),
+        pointerEvents: 'none' // Transparent to the hover style.
+      },
 
-    [`&:hover:not(.${inputClasses.disabled}, .${inputClasses.error}):before`]: {
-      borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        borderBottom: `1px solid ${bottomLineColor}`
+      [`&.${inputClasses.focused}:after`]: {
+        // translateX(0) is a workaround for Safari transform scale bug
+        // See https://github.com/mui/material-ui/issues/31766
+        transform: 'scaleX(1) translateX(0)'
+      },
+      [`&.${inputClasses.error}`]: {
+        '&:before, &:after': {
+          borderBottomColor: (theme.vars || theme).palette.error.main
+        }
+      },
+      '&:before': {
+        borderBottom: `1px solid ${bottomLineColor}`,
+        left: 0,
+        bottom: 0,
+        // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+        content: '"\\00a0"',
+        position: 'absolute',
+        right: 0,
+        transition: theme.transitions.create('border-bottom-color', {
+          duration: theme.transitions.duration.shorter
+        }),
+        pointerEvents: 'none' // Transparent to the hover style.
+      },
+
+      [`&:hover:not(.${inputClasses.disabled}, .${inputClasses.error}):before`]: {
+        borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
+        // Reset on touch devices, it doesn't add specificity
+        '@media (hover: none)': {
+          borderBottom: `1px solid ${bottomLineColor}`
+        }
+      },
+      [`&.${inputClasses.disabled}:before`]: {
+        borderBottomStyle: 'dotted'
       }
-    },
-    [`&.${inputClasses.disabled}:before`]: {
-      borderBottomStyle: 'dotted'
-    }
-  });
+    })
+  };
 });
 const InputInput = styled(InputBaseInput, {
   name: 'MuiInput',
@@ -112,17 +115,17 @@ const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
     name: 'MuiInput'
   });
   const {
-      disableUnderline,
-      components = {},
-      componentsProps: componentsPropsProp,
-      fullWidth = false,
-      inputComponent = 'input',
-      multiline = false,
-      slotProps,
-      slots = {},
-      type = 'text'
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    disableUnderline,
+    components = {},
+    componentsProps: componentsPropsProp,
+    fullWidth = false,
+    inputComponent = 'input',
+    multiline = false,
+    slotProps,
+    slots = {},
+    type = 'text',
+    ...other
+  } = props;
   const classes = useUtilityClasses(props);
   const ownerState = {
     disableUnderline
@@ -135,7 +138,7 @@ const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
   const componentsProps = slotProps ?? componentsPropsProp ? deepmerge(slotProps ?? componentsPropsProp, inputComponentsProps) : inputComponentsProps;
   const RootSlot = slots.root ?? components.Root ?? InputRoot;
   const InputSlot = slots.input ?? components.Input ?? InputInput;
-  return /*#__PURE__*/_jsx(InputBase, _extends({
+  return /*#__PURE__*/_jsx(InputBase, {
     slots: {
       root: RootSlot,
       input: InputSlot
@@ -145,10 +148,10 @@ const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
     inputComponent: inputComponent,
     multiline: multiline,
     ref: ref,
-    type: type
-  }, other, {
+    type: type,
+    ...other,
     classes: classes
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? Input.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/modern/Input/inputClasses.js

@@ -1,9 +1,11 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';
 import generateUtilityClass from '../generateUtilityClass';
 import { inputBaseClasses } from '../InputBase';
 export function getInputUtilityClass(slot) {
   return generateUtilityClass('MuiInput', slot);
 }
-const inputClasses = _extends({}, inputBaseClasses, generateUtilityClasses('MuiInput', ['root', 'underline', 'input']));
+const inputClasses = {
+  ...inputBaseClasses,
+  ...generateUtilityClasses('MuiInput', ['root', 'underline', 'input'])
+};
 export default inputClasses;

package/modern/InputAdornment/InputAdornment.js

@@ -1,7 +1,4 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
 var _span;
-const _excluded = ["children", "className", "component", "disablePointerEvents", "disableTypography", "position", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -42,28 +39,32 @@ const InputAdornmentRoot = styled('div', {
 })(({
   theme,
   ownerState
-}) => _extends({
+}) => ({
   display: 'flex',
   height: '0.01em',
   // Fix IE11 flexbox alignment. To remove at some point.
   maxHeight: '2em',
   alignItems: 'center',
   whiteSpace: 'nowrap',
-  color: (theme.vars || theme).palette.action.active
-}, ownerState.variant === 'filled' && {
-  // Styles applied to the root element if `variant="filled"`.
-  [`&.${inputAdornmentClasses.positionStart}&:not(.${inputAdornmentClasses.hiddenLabel})`]: {
-    marginTop: 16
-  }
-}, ownerState.position === 'start' && {
-  // Styles applied to the root element if `position="start"`.
-  marginRight: 8
-}, ownerState.position === 'end' && {
-  // Styles applied to the root element if `position="end"`.
-  marginLeft: 8
-}, ownerState.disablePointerEvents === true && {
-  // Styles applied to the root element if `disablePointerEvents={true}`.
-  pointerEvents: 'none'
+  color: (theme.vars || theme).palette.action.active,
+  ...(ownerState.variant === 'filled' && {
+    // Styles applied to the root element if `variant="filled"`.
+    [`&.${inputAdornmentClasses.positionStart}&:not(.${inputAdornmentClasses.hiddenLabel})`]: {
+      marginTop: 16
+    }
+  }),
+  ...(ownerState.position === 'start' && {
+    // Styles applied to the root element if `position="start"`.
+    marginRight: 8
+  }),
+  ...(ownerState.position === 'end' && {
+    // Styles applied to the root element if `position="end"`.
+    marginLeft: 8
+  }),
+  ...(ownerState.disablePointerEvents === true && {
+    // Styles applied to the root element if `disablePointerEvents={true}`.
+    pointerEvents: 'none'
+  })
 }));
 const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inProps, ref) {
   const props = useThemeProps({
@@ -71,15 +72,15 @@ const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inP
     name: 'MuiInputAdornment'
   });
   const {
-      children,
-      className,
-      component = 'div',
-      disablePointerEvents = false,
-      disableTypography = false,
-      position,
-      variant: variantProp
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    component = 'div',
+    disablePointerEvents = false,
+    disableTypography = false,
+    position,
+    variant: variantProp,
+    ...other
+  } = props;
   const muiFormControl = useFormControl() || {};
   let variant = variantProp;
   if (variantProp && muiFormControl.variant) {
@@ -92,22 +93,23 @@ const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inP
   if (muiFormControl && !variant) {
     variant = muiFormControl.variant;
   }
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     hiddenLabel: muiFormControl.hiddenLabel,
     size: muiFormControl.size,
     disablePointerEvents,
     position,
     variant
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(FormControlContext.Provider, {
     value: null,
-    children: /*#__PURE__*/_jsx(InputAdornmentRoot, _extends({
+    children: /*#__PURE__*/_jsx(InputAdornmentRoot, {
       as: component,
       ownerState: ownerState,
       className: clsx(classes.root, className),
-      ref: ref
-    }, other, {
+      ref: ref,
+      ...other,
       children: typeof children === 'string' && !disableTypography ? /*#__PURE__*/_jsx(Typography, {
         color: "text.secondary",
         children: children
@@ -117,7 +119,7 @@ const InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(inP
           children: "\u200B"
         })) : null, children]
       })
-    }))
+    })
   });
 });
 process.env.NODE_ENV !== "production" ? InputAdornment.propTypes /* remove-proptypes */ = {