@mui/material 5.10.13 → 5.10.14

package/modern/Typography/Typography.js

@@ -11,7 +11,6 @@ import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
 import { getTypographyUtilityClass } from './typographyClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const useUtilityClasses = ownerState => {
   const {
     align,
@@ -26,7 +25,6 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getTypographyUtilityClass, classes);
 };
-
 export const TypographyRoot = styled('span', {
   name: 'MuiTypography',
   slot: 'Root',
@@ -64,8 +62,9 @@ const defaultVariantMapping = {
   body1: 'p',
   body2: 'p',
   inherit: 'p'
-}; // TODO v6: deprecate these color values in v5.x and remove the transformation in v6
+};
 
+// TODO v6: deprecate these color values in v5.x and remove the transformation in v6
 const colorTransformations = {
   primary: 'primary.main',
   textPrimary: 'text.primary',
@@ -73,11 +72,9 @@ const colorTransformations = {
   textSecondary: 'text.secondary',
   error: 'error.main'
 };
-
 const transformDeprecatedColors = color => {
   return colorTransformations[color] || color;
 };
-
 const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, ref) {
   const themeProps = useThemeProps({
     props: inProps,
@@ -87,19 +84,17 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
   const props = extendSxProp(_extends({}, themeProps, {
     color
   }));
-
   const {
-    align = 'inherit',
-    className,
-    component,
-    gutterBottom = false,
-    noWrap = false,
-    paragraph = false,
-    variant = 'body1',
-    variantMapping = defaultVariantMapping
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      align = 'inherit',
+      className,
+      component,
+      gutterBottom = false,
+      noWrap = false,
+      paragraph = false,
+      variant = 'body1',
+      variantMapping = defaultVariantMapping
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = _extends({}, props, {
     align,
     color,
@@ -111,7 +106,6 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
     variant,
     variantMapping
   });
-
   const Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(TypographyRoot, _extends({
@@ -121,47 +115,38 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
     className: clsx(classes.root, className)
   }, other));
 });
-process.env.NODE_ENV !== "production" ? Typography.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? Typography.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // |     To update them edit the d.ts file and run "yarn proptypes"     |
   // ----------------------------------------------------------------------
-
   /**
    * Set the text-align on the component.
    * @default 'inherit'
    */
   align: PropTypes.oneOf(['center', 'inherit', 'justify', 'left', 'right']),
-
   /**
    * The content of the component.
    */
   children: PropTypes.node,
-
   /**
    * Override or extend the styles applied to the component.
    */
   classes: PropTypes.object,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
   component: PropTypes.elementType,
-
   /**
    * If `true`, the text will have a bottom margin.
    * @default false
    */
   gutterBottom: PropTypes.bool,
-
   /**
    * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
    *
@@ -170,26 +155,20 @@ process.env.NODE_ENV !== "production" ? Typography.propTypes
    * @default false
    */
   noWrap: PropTypes.bool,
-
   /**
    * If `true`, the element will be a paragraph element.
    * @default false
    */
   paragraph: PropTypes.bool,
-
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-
   /**
    * Applies the theme typography styles.
    * @default 'body1'
    */
-  variant: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .oneOfType([PropTypes.oneOf(['body1', 'body2', 'button', 'caption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'inherit', 'overline', 'subtitle1', 'subtitle2']), PropTypes.string]),
-
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body1', 'body2', 'button', 'caption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'inherit', 'overline', 'subtitle1', 'subtitle2']), PropTypes.string]),
   /**
    * The component maps the variant prop to a range of different HTML element types.
    * For instance, subtitle1 to `<h6>`.
@@ -209,8 +188,6 @@ process.env.NODE_ENV !== "production" ? Typography.propTypes
    *   inherit: 'p',
    * }
    */
-  variantMapping: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .object
+  variantMapping: PropTypes /* @typescript-to-proptypes-ignore */.object
 } : void 0;
 export default Typography;

package/modern/Unstable_Grid2/Grid2.js

@@ -13,19 +13,15 @@ const Grid2 = createGrid({
     name: 'MuiGrid2'
   })
 });
-process.env.NODE_ENV !== "production" ? Grid2.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // |     To update them edit TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
-
   /**
    * The content of the component.
    */
   children: PropTypes.node,
-
   /**
    * @ignore
    */

package/modern/Unstable_Grid2/grid2Classes.js

@@ -7,9 +7,13 @@ const SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
 const DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'];
 const WRAPS = ['nowrap', 'wrap-reverse', 'wrap'];
 const GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
-const grid2Classes = generateUtilityClasses('MuiGrid2', ['root', 'container', 'item', 'zeroMinWidth', // spacings
-...SPACINGS.map(spacing => `spacing-xs-${spacing}`), // direction values
-...DIRECTIONS.map(direction => `direction-xs-${direction}`), // wrap values
-...WRAPS.map(wrap => `wrap-xs-${wrap}`), // grid sizes for all breakpoints
+const grid2Classes = generateUtilityClasses('MuiGrid2', ['root', 'container', 'item', 'zeroMinWidth',
+// spacings
+...SPACINGS.map(spacing => `spacing-xs-${spacing}`),
+// direction values
+...DIRECTIONS.map(direction => `direction-xs-${direction}`),
+// wrap values
+...WRAPS.map(wrap => `wrap-xs-${wrap}`),
+// grid sizes for all breakpoints
 ...GRID_SIZES.map(size => `grid-xs-${size}`), ...GRID_SIZES.map(size => `grid-sm-${size}`), ...GRID_SIZES.map(size => `grid-md-${size}`), ...GRID_SIZES.map(size => `grid-lg-${size}`), ...GRID_SIZES.map(size => `grid-xl-${size}`)]);
 export default grid2Classes;

package/modern/Zoom/Zoom.js

@@ -17,45 +17,43 @@ const styles = {
     transform: 'none'
   }
 };
+
 /**
  * The Zoom transition can be used for the floating variant of the
  * [Button](/material-ui/react-button/#floating-action-buttons) component.
  * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
  */
-
 const Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
   const theme = useTheme();
   const defaultTimeout = {
     enter: theme.transitions.duration.enteringScreen,
     exit: theme.transitions.duration.leavingScreen
   };
-
   const {
-    addEndListener,
-    appear = true,
-    children,
-    easing,
-    in: inProp,
-    onEnter,
-    onEntered,
-    onEntering,
-    onExit,
-    onExited,
-    onExiting,
-    style,
-    timeout = defaultTimeout,
-    // eslint-disable-next-line react/prop-types
-    TransitionComponent = Transition
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      addEndListener,
+      appear = true,
+      children,
+      easing,
+      in: inProp,
+      onEnter,
+      onEntered,
+      onEntering,
+      onExit,
+      onExited,
+      onExiting,
+      style,
+      timeout = defaultTimeout,
+      // eslint-disable-next-line react/prop-types
+      TransitionComponent = Transition
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const nodeRef = React.useRef(null);
   const handleRef = useForkRef(nodeRef, children.ref, ref);
-
   const normalizedTransitionCallback = callback => maybeIsAppearing => {
     if (callback) {
-      const node = nodeRef.current; // onEnterXxx and onExitXxx callbacks have a different arguments.length value.
+      const node = nodeRef.current;
 
+      // onEnterXxx and onExitXxx callbacks have a different arguments.length value.
       if (maybeIsAppearing === undefined) {
         callback(node);
       } else {
@@ -63,7 +61,6 @@ const Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
       }
     }
   };
-
   const handleEntering = normalizedTransitionCallback(onEntering);
   const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
     reflow(node); // So the animation always start from the start.
@@ -77,7 +74,6 @@ const Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
     });
     node.style.webkitTransition = theme.transitions.create('transform', transitionProps);
     node.style.transition = theme.transitions.create('transform', transitionProps);
-
     if (onEnter) {
       onEnter(node, isAppearing);
     }
@@ -94,20 +90,17 @@ const Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
     });
     node.style.webkitTransition = theme.transitions.create('transform', transitionProps);
     node.style.transition = theme.transitions.create('transform', transitionProps);
-
     if (onExit) {
       onExit(node);
     }
   });
   const handleExited = normalizedTransitionCallback(onExited);
-
   const handleAddEndListener = next => {
     if (addEndListener) {
       // Old call signature before `react-transition-group` implemented `nodeRef`
       addEndListener(nodeRef.current, next);
     }
   };
-
   return /*#__PURE__*/_jsx(TransitionComponent, _extends({
     appear: appear,
     in: inProp,
@@ -132,33 +125,27 @@ const Zoom = /*#__PURE__*/React.forwardRef(function Zoom(props, ref) {
     }
   }));
 });
-process.env.NODE_ENV !== "production" ? Zoom.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? Zoom.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // |     To update them edit the d.ts file and run "yarn proptypes"     |
   // ----------------------------------------------------------------------
-
   /**
    * Add a custom transition end trigger. Called with the transitioning DOM
    * node and a done callback. Allows for more fine grained transition end
    * logic. Note: Timeouts are still used as a fallback if provided.
    */
   addEndListener: PropTypes.func,
-
   /**
    * Perform the enter transition when it first mounts if `in` is also `true`.
    * Set this to `false` to disable this behavior.
    * @default true
    */
   appear: PropTypes.bool,
-
   /**
    * A single child content element.
    */
   children: elementAcceptingRef.isRequired,
-
   /**
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
@@ -167,47 +154,38 @@ process.env.NODE_ENV !== "production" ? Zoom.propTypes
     enter: PropTypes.string,
     exit: PropTypes.string
   }), PropTypes.string]),
-
   /**
    * If `true`, the component will transition in.
    */
   in: PropTypes.bool,
-
   /**
    * @ignore
    */
   onEnter: PropTypes.func,
-
   /**
    * @ignore
    */
   onEntered: PropTypes.func,
-
   /**
    * @ignore
    */
   onEntering: PropTypes.func,
-
   /**
    * @ignore
    */
   onExit: PropTypes.func,
-
   /**
    * @ignore
    */
   onExited: PropTypes.func,
-
   /**
    * @ignore
    */
   onExiting: PropTypes.func,
-
   /**
    * @ignore
    */
   style: PropTypes.object,
-
   /**
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.13
+/** @license MUI v5.10.14
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -271,8 +271,9 @@ export * from './usePagination';
 export { default as useScrollTrigger } from './useScrollTrigger';
 export * from './useScrollTrigger';
 export { default as Zoom } from './Zoom';
-export * from './Zoom'; // createFilterOptions is exported from Autocomplete
+export * from './Zoom';
 
+// createFilterOptions is exported from Autocomplete
 export { default as useAutocomplete } from './useAutocomplete';
 export { default as GlobalStyles } from './GlobalStyles';
 export * from './GlobalStyles';

package/modern/internal/SwitchBase.js

@@ -14,7 +14,6 @@ import ButtonBase from '../ButtonBase';
 import { getSwitchBaseUtilityClass } from './switchBaseClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -28,7 +27,6 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getSwitchBaseUtilityClass, classes);
 };
-
 const SwitchBaseRoot = styled(ButtonBase)(({
   ownerState
 }) => _extends({
@@ -51,36 +49,35 @@ const SwitchBaseInput = styled('input')({
   padding: 0,
   zIndex: 1
 });
+
 /**
  * @ignore - internal component.
  */
-
 const SwitchBase = /*#__PURE__*/React.forwardRef(function SwitchBase(props, ref) {
   const {
-    autoFocus,
-    checked: checkedProp,
-    checkedIcon,
-    className,
-    defaultChecked,
-    disabled: disabledProp,
-    disableFocusRipple = false,
-    edge = false,
-    icon,
-    id,
-    inputProps,
-    inputRef,
-    name,
-    onBlur,
-    onChange,
-    onFocus,
-    readOnly,
-    required,
-    tabIndex,
-    type,
-    value
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      autoFocus,
+      checked: checkedProp,
+      checkedIcon,
+      className,
+      defaultChecked,
+      disabled: disabledProp,
+      disableFocusRipple = false,
+      edge = false,
+      icon,
+      id,
+      inputProps,
+      inputRef,
+      name,
+      onBlur,
+      onChange,
+      onFocus,
+      readOnly,
+      required,
+      tabIndex,
+      type,
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const [checked, setCheckedState] = useControlled({
     controlled: checkedProp,
     default: Boolean(defaultChecked),
@@ -88,59 +85,47 @@ const SwitchBase = /*#__PURE__*/React.forwardRef(function SwitchBase(props, ref)
     state: 'checked'
   });
   const muiFormControl = useFormControl();
-
   const handleFocus = event => {
     if (onFocus) {
       onFocus(event);
     }
-
     if (muiFormControl && muiFormControl.onFocus) {
       muiFormControl.onFocus(event);
     }
   };
-
   const handleBlur = event => {
     if (onBlur) {
       onBlur(event);
     }
-
     if (muiFormControl && muiFormControl.onBlur) {
       muiFormControl.onBlur(event);
     }
   };
-
   const handleInputChange = event => {
     // Workaround for https://github.com/facebook/react/issues/9023
     if (event.nativeEvent.defaultPrevented) {
       return;
     }
-
     const newChecked = event.target.checked;
     setCheckedState(newChecked);
-
     if (onChange) {
       // TODO v6: remove the second argument.
       onChange(event, newChecked);
     }
   };
-
   let disabled = disabledProp;
-
   if (muiFormControl) {
     if (typeof disabled === 'undefined') {
       disabled = muiFormControl.disabled;
     }
   }
-
   const hasLabelFor = type === 'checkbox' || type === 'radio';
-
   const ownerState = _extends({}, props, {
     checked,
     disabled,
     disableFocusRipple,
     edge
   });
-
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsxs(SwitchBaseRoot, _extends({
     component: "span",
@@ -174,52 +159,45 @@ const SwitchBase = /*#__PURE__*/React.forwardRef(function SwitchBase(props, ref)
       value
     }, inputProps)), checked ? checkedIcon : icon]
   }));
-}); // NB: If changed, please update Checkbox, Switch and Radio
-// so that the API documentation is updated.
+});
 
+// NB: If changed, please update Checkbox, Switch and Radio
+// so that the API documentation is updated.
 process.env.NODE_ENV !== "production" ? SwitchBase.propTypes = {
   /**
    * If `true`, the `input` element is focused during the first mount.
    */
   autoFocus: PropTypes.bool,
-
   /**
    * If `true`, the component is checked.
    */
   checked: PropTypes.bool,
-
   /**
    * The icon to display when the component is checked.
    */
   checkedIcon: PropTypes.node.isRequired,
-
   /**
    * Override or extend the styles applied to the component.
    * See [CSS API](#css) below for more details.
    */
   classes: PropTypes.object,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * @ignore
    */
   defaultChecked: PropTypes.bool,
-
   /**
    * If `true`, the component is disabled.
    */
   disabled: PropTypes.bool,
-
   /**
    * If `true`, the  keyboard focus ripple is disabled.
    * @default false
    */
   disableFocusRipple: PropTypes.bool,
-
   /**
    * If given, uses a negative margin to counteract the padding on one
    * side (this is often helpful for aligning the left or right
@@ -228,37 +206,30 @@ process.env.NODE_ENV !== "production" ? SwitchBase.propTypes = {
    * @default false
    */
   edge: PropTypes.oneOf(['end', 'start', false]),
-
   /**
    * The icon to display when the component is unchecked.
    */
   icon: PropTypes.node.isRequired,
-
   /**
    * The id of the `input` element.
    */
   id: PropTypes.string,
-
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
    */
   inputProps: PropTypes.object,
-
   /**
    * Pass a ref to the `input` element.
    */
   inputRef: refType,
-
   /*
    * @ignore
    */
   name: PropTypes.string,
-
   /**
    * @ignore
    */
   onBlur: PropTypes.func,
-
   /**
    * Callback fired when the state is changed.
    *
@@ -266,38 +237,31 @@ process.env.NODE_ENV !== "production" ? SwitchBase.propTypes = {
    * You can pull out the new checked state by accessing `event.target.checked` (boolean).
    */
   onChange: PropTypes.func,
-
   /**
    * @ignore
    */
   onFocus: PropTypes.func,
-
   /**
    * It prevents the user from changing the value of the field
    * (not from interacting with the field).
    */
   readOnly: PropTypes.bool,
-
   /**
    * If `true`, the `input` element is required.
    */
   required: PropTypes.bool,
-
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.object,
-
   /**
    * @ignore
    */
   tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /**
    * The input component prop `type`.
    */
   type: PropTypes.string.isRequired,
-
   /**
    * The value of the component.
    */