@mui/material 5.13.1 → 5.13.2

package/InputLabel/InputLabel.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["disableAnimation", "margin", "shrink", "variant", "className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
@@ -24,11 +27,7 @@ const useUtilityClasses = ownerState => {
     asterisk: [required && 'asterisk']
   };
   const composedClasses = composeClasses(slots, getInputLabelUtilityClasses, classes);
-  return {
-    ...classes,
-    // forward the focused, disabled, etc. classes to the FormLabel
-    ...composedClasses
-  };
+  return _extends({}, classes, composedClasses);
 };
 const InputLabelRoot = styled(FormLabel, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -45,89 +44,76 @@ const InputLabelRoot = styled(FormLabel, {
 })(({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   display: 'block',
   transformOrigin: 'top left',
   whiteSpace: 'nowrap',
   overflow: 'hidden',
   textOverflow: 'ellipsis',
-  maxWidth: '100%',
-  ...(ownerState.formControl && {
-    position: 'absolute',
-    left: 0,
-    top: 0,
-    // slight alteration to spec spacing to match visual spec result
-    transform: 'translate(0, 20px) scale(1)'
-  }),
-  ...(ownerState.size === 'small' && {
-    // Compensation for the `Input.inputSizeSmall` style.
-    transform: 'translate(0, 17px) scale(1)'
-  }),
-  ...(ownerState.shrink && {
-    transform: 'translate(0, -1.5px) scale(0.75)',
-    transformOrigin: 'top left',
-    maxWidth: '133%'
-  }),
-  ...(!ownerState.disableAnimation && {
-    transition: theme.transitions.create(['color', 'transform', 'max-width'], {
-      duration: theme.transitions.duration.shorter,
-      easing: theme.transitions.easing.easeOut
-    })
-  }),
-  ...(ownerState.variant === 'filled' && {
-    // Chrome's autofill feature gives the input field a yellow background.
-    // Since the input field is behind the label in the HTML tree,
-    // the input field is drawn last and hides the label with an opaque background color.
-    // zIndex: 1 will raise the label above opaque background-colors of input.
-    zIndex: 1,
-    pointerEvents: 'none',
-    transform: 'translate(12px, 16px) scale(1)',
-    maxWidth: 'calc(100% - 24px)',
-    ...(ownerState.size === 'small' && {
-      transform: 'translate(12px, 13px) scale(1)'
-    }),
-    ...(ownerState.shrink && {
-      userSelect: 'none',
-      pointerEvents: 'auto',
-      transform: 'translate(12px, 7px) scale(0.75)',
-      maxWidth: 'calc(133% - 24px)',
-      ...(ownerState.size === 'small' && {
-        transform: 'translate(12px, 4px) scale(0.75)'
-      })
-    })
-  }),
-  ...(ownerState.variant === 'outlined' && {
-    // see comment above on filled.zIndex
-    zIndex: 1,
-    pointerEvents: 'none',
-    transform: 'translate(14px, 16px) scale(1)',
-    maxWidth: 'calc(100% - 24px)',
-    ...(ownerState.size === 'small' && {
-      transform: 'translate(14px, 9px) scale(1)'
-    }),
-    ...(ownerState.shrink && {
-      userSelect: 'none',
-      pointerEvents: 'auto',
-      // Theoretically, we should have (8+5)*2/0.75 = 34px
-      // but it feels a better when it bleeds a bit on the left, so 32px.
-      maxWidth: 'calc(133% - 32px)',
-      transform: 'translate(14px, -9px) scale(0.75)'
-    })
+  maxWidth: '100%'
+}, ownerState.formControl && {
+  position: 'absolute',
+  left: 0,
+  top: 0,
+  // slight alteration to spec spacing to match visual spec result
+  transform: 'translate(0, 20px) scale(1)'
+}, ownerState.size === 'small' && {
+  // Compensation for the `Input.inputSizeSmall` style.
+  transform: 'translate(0, 17px) scale(1)'
+}, ownerState.shrink && {
+  transform: 'translate(0, -1.5px) scale(0.75)',
+  transformOrigin: 'top left',
+  maxWidth: '133%'
+}, !ownerState.disableAnimation && {
+  transition: theme.transitions.create(['color', 'transform', 'max-width'], {
+    duration: theme.transitions.duration.shorter,
+    easing: theme.transitions.easing.easeOut
   })
-}));
+}, ownerState.variant === 'filled' && _extends({
+  // Chrome's autofill feature gives the input field a yellow background.
+  // Since the input field is behind the label in the HTML tree,
+  // the input field is drawn last and hides the label with an opaque background color.
+  // zIndex: 1 will raise the label above opaque background-colors of input.
+  zIndex: 1,
+  pointerEvents: 'none',
+  transform: 'translate(12px, 16px) scale(1)',
+  maxWidth: 'calc(100% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(12px, 13px) scale(1)'
+}, ownerState.shrink && _extends({
+  userSelect: 'none',
+  pointerEvents: 'auto',
+  transform: 'translate(12px, 7px) scale(0.75)',
+  maxWidth: 'calc(133% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(12px, 4px) scale(0.75)'
+})), ownerState.variant === 'outlined' && _extends({
+  // see comment above on filled.zIndex
+  zIndex: 1,
+  pointerEvents: 'none',
+  transform: 'translate(14px, 16px) scale(1)',
+  maxWidth: 'calc(100% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(14px, 9px) scale(1)'
+}, ownerState.shrink && {
+  userSelect: 'none',
+  pointerEvents: 'auto',
+  // Theoretically, we should have (8+5)*2/0.75 = 34px
+  // but it feels a better when it bleeds a bit on the left, so 32px.
+  maxWidth: 'calc(133% - 32px)',
+  transform: 'translate(14px, -9px) scale(0.75)'
+})));
 const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, ref) {
   const props = useThemeProps({
     name: 'MuiInputLabel',
     props: inProps
   });
   const {
-    disableAnimation = false,
-    margin,
-    shrink: shrinkProp,
-    variant,
-    className,
-    ...other
-  } = props;
+      disableAnimation = false,
+      shrink: shrinkProp,
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const muiFormControl = useFormControl();
   let shrink = shrinkProp;
   if (typeof shrink === 'undefined' && muiFormControl) {
@@ -138,24 +124,23 @@ const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, re
     muiFormControl,
     states: ['size', 'variant', 'required']
   });
-  const ownerState = {
-    ...props,
+  const ownerState = _extends({}, props, {
     disableAnimation,
     formControl: muiFormControl,
     shrink,
     size: fcs.size,
     variant: fcs.variant,
     required: fcs.required
-  };
+  });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(InputLabelRoot, {
+  return /*#__PURE__*/_jsx(InputLabelRoot, _extends({
     "data-shrink": shrink,
     ownerState: ownerState,
     ref: ref,
-    className: clsx(classes.root, className),
-    ...other,
+    className: clsx(classes.root, className)
+  }, other, {
     classes: classes
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? InputLabel.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/InputLabel/inputLabelClasses.d.ts

@@ -1,32 +1,32 @@
-export interface InputLabelClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** State class applied to the root element if `focused={true}`. */
-    focused: string;
-    /** State class applied to the root element if `disabled={true}`. */
-    disabled: string;
-    /** State class applied to the root element if `error={true}`. */
-    error: string;
-    /** State class applied to the root element if `required={true}`. */
-    required: string;
-    /** State class applied to the asterisk element. */
-    asterisk: string;
-    /** Styles applied to the root element if the component is a descendant of `FormControl`. */
-    formControl: string;
-    /** Styles applied to the root element if `size="small"`. */
-    sizeSmall: string;
-    /** Styles applied to the input element if `shrink={true}`. */
-    shrink: string;
-    /** Styles applied to the input element unless `disableAnimation={true}`. */
-    animated: string;
-    /** Styles applied to the root element if `variant="filled"`. */
-    filled: string;
-    /** Styles applied to the root element if `variant="outlined"`. */
-    outlined: string;
-    /** Styles applied to the root element if `variant="standard"`. */
-    standard: string;
-}
-export type InputLabelClassKey = keyof InputLabelClasses;
-export declare function getInputLabelUtilityClasses(slot: string): string;
-declare const inputLabelClasses: InputLabelClasses;
-export default inputLabelClasses;
+export interface InputLabelClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** State class applied to the root element if `focused={true}`. */
+    focused: string;
+    /** State class applied to the root element if `disabled={true}`. */
+    disabled: string;
+    /** State class applied to the root element if `error={true}`. */
+    error: string;
+    /** State class applied to the root element if `required={true}`. */
+    required: string;
+    /** State class applied to the asterisk element. */
+    asterisk: string;
+    /** Styles applied to the root element if the component is a descendant of `FormControl`. */
+    formControl: string;
+    /** Styles applied to the root element if `size="small"`. */
+    sizeSmall: string;
+    /** Styles applied to the input element if `shrink={true}`. */
+    shrink: string;
+    /** Styles applied to the input element unless `disableAnimation={true}`. */
+    animated: string;
+    /** Styles applied to the root element if `variant="filled"`. */
+    filled: string;
+    /** Styles applied to the root element if `variant="outlined"`. */
+    outlined: string;
+    /** Styles applied to the root element if `variant="standard"`. */
+    standard: string;
+}
+export type InputLabelClassKey = keyof InputLabelClasses;
+export declare function getInputLabelUtilityClasses(slot: string): string;
+declare const inputLabelClasses: InputLabelClasses;
+export default inputLabelClasses;

package/LinearProgress/LinearProgress.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", "value", "valueBuffer", "variant"];
 let _ = t => t,
   _t,
   _t2,
@@ -101,7 +104,7 @@ const LinearProgressRoot = styled('span', {
 })(({
   ownerState,
   theme
-}) => ({
+}) => _extends({
   position: 'relative',
   overflow: 'hidden',
   display: 'block',
@@ -111,26 +114,23 @@ const LinearProgressRoot = styled('span', {
   '@media print': {
     colorAdjust: 'exact'
   },
-  backgroundColor: getColorShade(theme, ownerState.color),
-  ...(ownerState.color === 'inherit' && ownerState.variant !== 'buffer' && {
-    backgroundColor: 'none',
-    '&::before': {
-      content: '""',
-      position: 'absolute',
-      left: 0,
-      top: 0,
-      right: 0,
-      bottom: 0,
-      backgroundColor: 'currentColor',
-      opacity: 0.3
-    }
-  }),
-  ...(ownerState.variant === 'buffer' && {
-    backgroundColor: 'transparent'
-  }),
-  ...(ownerState.variant === 'query' && {
-    transform: 'rotate(180deg)'
-  })
+  backgroundColor: getColorShade(theme, ownerState.color)
+}, ownerState.color === 'inherit' && ownerState.variant !== 'buffer' && {
+  backgroundColor: 'none',
+  '&::before': {
+    content: '""',
+    position: 'absolute',
+    left: 0,
+    top: 0,
+    right: 0,
+    bottom: 0,
+    backgroundColor: 'currentColor',
+    opacity: 0.3
+  }
+}, ownerState.variant === 'buffer' && {
+  backgroundColor: 'transparent'
+}, ownerState.variant === 'query' && {
+  transform: 'rotate(180deg)'
 }));
 const LinearProgressDashed = styled('span', {
   name: 'MuiLinearProgress',
@@ -146,18 +146,18 @@ const LinearProgressDashed = styled('span', {
   theme
 }) => {
   const backgroundColor = getColorShade(theme, ownerState.color);
-  return {
+  return _extends({
     position: 'absolute',
     marginTop: 0,
     height: '100%',
-    width: '100%',
-    ...(ownerState.color === 'inherit' && {
-      opacity: 0.3
-    }),
+    width: '100%'
+  }, ownerState.color === 'inherit' && {
+    opacity: 0.3
+  }, {
     backgroundImage: `radial-gradient(${backgroundColor} 0%, ${backgroundColor} 16%, transparent 42%)`,
     backgroundSize: '10px 10px',
     backgroundPosition: '0 -23px'
-  };
+  });
 }, css(_t4 || (_t4 = _`
     animation: ${0} 3s infinite linear;
   `), bufferKeyframe));
@@ -173,7 +173,7 @@ const LinearProgressBar1 = styled('span', {
 })(({
   ownerState,
   theme
-}) => ({
+}) => _extends({
   width: '100%',
   position: 'absolute',
   left: 0,
@@ -181,14 +181,12 @@ const LinearProgressBar1 = styled('span', {
   top: 0,
   transition: 'transform 0.2s linear',
   transformOrigin: 'left',
-  backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main,
-  ...(ownerState.variant === 'determinate' && {
-    transition: `transform .${TRANSITION_DURATION}s linear`
-  }),
-  ...(ownerState.variant === 'buffer' && {
-    zIndex: 1,
-    transition: `transform .${TRANSITION_DURATION}s linear`
-  })
+  backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main
+}, ownerState.variant === 'determinate' && {
+  transition: `transform .${TRANSITION_DURATION}s linear`
+}, ownerState.variant === 'buffer' && {
+  zIndex: 1,
+  transition: `transform .${TRANSITION_DURATION}s linear`
 }), ({
   ownerState
 }) => (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && css(_t5 || (_t5 = _`
@@ -207,24 +205,21 @@ const LinearProgressBar2 = styled('span', {
 })(({
   ownerState,
   theme
-}) => ({
+}) => _extends({
   width: '100%',
   position: 'absolute',
   left: 0,
   bottom: 0,
   top: 0,
   transition: 'transform 0.2s linear',
-  transformOrigin: 'left',
-  ...(ownerState.variant !== 'buffer' && {
-    backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main
-  }),
-  ...(ownerState.color === 'inherit' && {
-    opacity: 0.3
-  }),
-  ...(ownerState.variant === 'buffer' && {
-    backgroundColor: getColorShade(theme, ownerState.color),
-    transition: `transform .${TRANSITION_DURATION}s linear`
-  })
+  transformOrigin: 'left'
+}, ownerState.variant !== 'buffer' && {
+  backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main
+}, ownerState.color === 'inherit' && {
+  opacity: 0.3
+}, ownerState.variant === 'buffer' && {
+  backgroundColor: getColorShade(theme, ownerState.color),
+  transition: `transform .${TRANSITION_DURATION}s linear`
 }), ({
   ownerState
 }) => (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && css(_t6 || (_t6 = _`
@@ -245,18 +240,17 @@ const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inP
     name: 'MuiLinearProgress'
   });
   const {
-    className,
-    color = 'primary',
-    value,
-    valueBuffer,
-    variant = 'indeterminate',
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      className,
+      color = 'primary',
+      value,
+      valueBuffer,
+      variant = 'indeterminate'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     color,
     variant
-  };
+  });
   const classes = useUtilityClasses(ownerState);
   const theme = useTheme();
   const rootProps = {};
@@ -289,13 +283,13 @@ const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inP
       console.error('MUI: You need to provide a valueBuffer prop ' + 'when using the buffer variant of LinearProgress.');
     }
   }
-  return /*#__PURE__*/_jsxs(LinearProgressRoot, {
+  return /*#__PURE__*/_jsxs(LinearProgressRoot, _extends({
     className: clsx(classes.root, className),
     ownerState: ownerState,
-    role: "progressbar",
-    ...rootProps,
-    ref: ref,
-    ...other,
+    role: "progressbar"
+  }, rootProps, {
+    ref: ref
+  }, other, {
     children: [variant === 'buffer' ? /*#__PURE__*/_jsx(LinearProgressDashed, {
       className: classes.dashed,
       ownerState: ownerState
@@ -308,7 +302,7 @@ const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inP
       ownerState: ownerState,
       style: inlineStyles.bar2
     })]
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? LinearProgress.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/LinearProgress/linearProgressClasses.d.ts

@@ -1,42 +1,42 @@
-export interface LinearProgressClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root and bar2 element if `color="primary"`; bar2 if `variant="buffer"`. */
-    colorPrimary: string;
-    /** Styles applied to the root and bar2 elements if `color="secondary"`; bar2 if `variant="buffer"`. */
-    colorSecondary: string;
-    /** Styles applied to the root element if `variant="determinate"`. */
-    determinate: string;
-    /** Styles applied to the root element if `variant="indeterminate"`. */
-    indeterminate: string;
-    /** Styles applied to the root element if `variant="buffer"`. */
-    buffer: string;
-    /** Styles applied to the root element if `variant="query"`. */
-    query: string;
-    /** Styles applied to the additional bar element if `variant="buffer"`. */
-    dashed: string;
-    /** Styles applied to the additional bar element if `variant="buffer"` and `color="primary"`. */
-    dashedColorPrimary: string;
-    /** Styles applied to the additional bar element if `variant="buffer"` and `color="secondary"`. */
-    dashedColorSecondary: string;
-    /** Styles applied to the layered bar1 and bar2 elements. */
-    bar: string;
-    /** Styles applied to the bar elements if `color="primary"`; bar2 if `variant` not "buffer". */
-    barColorPrimary: string;
-    /** Styles applied to the bar elements if `color="secondary"`; bar2 if `variant` not "buffer". */
-    barColorSecondary: string;
-    /** Styles applied to the bar1 element if `variant="indeterminate or query"`. */
-    bar1Indeterminate: string;
-    /** Styles applied to the bar1 element if `variant="determinate"`. */
-    bar1Determinate: string;
-    /** Styles applied to the bar1 element if `variant="buffer"`. */
-    bar1Buffer: string;
-    /** Styles applied to the bar2 element if `variant="indeterminate or query"`. */
-    bar2Indeterminate: string;
-    /** Styles applied to the bar2 element if `variant="buffer"`. */
-    bar2Buffer: string;
-}
-export type LinearProgressClassKey = keyof LinearProgressClasses;
-export declare function getLinearProgressUtilityClass(slot: string): string;
-declare const linearProgressClasses: LinearProgressClasses;
-export default linearProgressClasses;
+export interface LinearProgressClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root and bar2 element if `color="primary"`; bar2 if `variant="buffer"`. */
+    colorPrimary: string;
+    /** Styles applied to the root and bar2 elements if `color="secondary"`; bar2 if `variant="buffer"`. */
+    colorSecondary: string;
+    /** Styles applied to the root element if `variant="determinate"`. */
+    determinate: string;
+    /** Styles applied to the root element if `variant="indeterminate"`. */
+    indeterminate: string;
+    /** Styles applied to the root element if `variant="buffer"`. */
+    buffer: string;
+    /** Styles applied to the root element if `variant="query"`. */
+    query: string;
+    /** Styles applied to the additional bar element if `variant="buffer"`. */
+    dashed: string;
+    /** Styles applied to the additional bar element if `variant="buffer"` and `color="primary"`. */
+    dashedColorPrimary: string;
+    /** Styles applied to the additional bar element if `variant="buffer"` and `color="secondary"`. */
+    dashedColorSecondary: string;
+    /** Styles applied to the layered bar1 and bar2 elements. */
+    bar: string;
+    /** Styles applied to the bar elements if `color="primary"`; bar2 if `variant` not "buffer". */
+    barColorPrimary: string;
+    /** Styles applied to the bar elements if `color="secondary"`; bar2 if `variant` not "buffer". */
+    barColorSecondary: string;
+    /** Styles applied to the bar1 element if `variant="indeterminate or query"`. */
+    bar1Indeterminate: string;
+    /** Styles applied to the bar1 element if `variant="determinate"`. */
+    bar1Determinate: string;
+    /** Styles applied to the bar1 element if `variant="buffer"`. */
+    bar1Buffer: string;
+    /** Styles applied to the bar2 element if `variant="indeterminate or query"`. */
+    bar2Indeterminate: string;
+    /** Styles applied to the bar2 element if `variant="buffer"`. */
+    bar2Buffer: string;
+}
+export type LinearProgressClassKey = keyof LinearProgressClasses;
+export declare function getLinearProgressUtilityClass(slot: string): string;
+declare const linearProgressClasses: LinearProgressClasses;
+export default linearProgressClasses;