@mui/material 5.2.5 → 5.2.6

package/transitions/utils.d.ts

@@ -1,23 +1,23 @@
-import * as React from 'react';
-export declare const reflow: (node: Element) => number;
-interface ComponentProps {
-    easing: string | {
-        enter?: string;
-        exit?: string;
-    } | undefined;
-    style: React.CSSProperties | undefined;
-    timeout: number | {
-        enter?: number;
-        exit?: number;
-    };
-}
-interface Options {
-    mode: 'enter' | 'exit';
-}
-interface TransitionProps {
-    duration: string | number;
-    easing: string | undefined;
-    delay: string | undefined;
-}
-export declare function getTransitionProps(props: ComponentProps, options: Options): TransitionProps;
-export {};
+import * as React from 'react';
+export declare const reflow: (node: Element) => number;
+interface ComponentProps {
+    easing: string | {
+        enter?: string;
+        exit?: string;
+    } | undefined;
+    style: React.CSSProperties | undefined;
+    timeout: number | {
+        enter?: number;
+        exit?: number;
+    };
+}
+interface Options {
+    mode: 'enter' | 'exit';
+}
+interface TransitionProps {
+    duration: string | number;
+    easing: string | undefined;
+    delay: string | undefined;
+}
+export declare function getTransitionProps(props: ComponentProps, options: Options): TransitionProps;
+export {};

package/umd/material-ui.development.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.2.5
+/** @license MUI v5.2.6
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -755,8 +755,9 @@
 
   var fixedElements = /* #__PURE__ */new WeakMap();
   var compat = function compat(element) {
-    if (element.type !== 'rule' || !element.parent || // .length indicates if this rule contains pseudo or not
-    !element.length) {
+    if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo
+    // negative .length indicates that this rule has been already prefixed
+    element.length < 1) {
       return;
     }
 
@@ -2008,7 +2009,7 @@
 
   var pkg = {
   	name: "@emotion/react",
-  	version: "11.7.0",
+  	version: "11.7.1",
   	main: "dist/emotion-react.cjs.js",
   	module: "dist/emotion-react.esm.js",
   	browser: {
@@ -2035,7 +2036,7 @@
   	},
   	dependencies: {
   		"@babel/runtime": "^7.13.10",
-  		"@emotion/cache": "^11.6.0",
+  		"@emotion/cache": "^11.7.1",
   		"@emotion/serialize": "^1.0.2",
   		"@emotion/sheet": "^1.1.0",
   		"@emotion/utils": "^1.0.0",
@@ -2056,8 +2057,8 @@
   	},
   	devDependencies: {
   		"@babel/core": "^7.13.10",
-  		"@emotion/css": "11.5.0",
-  		"@emotion/css-prettifier": "1.0.0",
+  		"@emotion/css": "11.7.1",
+  		"@emotion/css-prettifier": "1.0.1",
   		"@emotion/server": "11.4.0",
   		"@emotion/styled": "11.6.0",
   		"@types/react": "^16.9.11",
@@ -8390,7 +8391,7 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
         // only have an opinion about this when closed
         'aria-activedescendant': popupOpen ? '' : null,
         'aria-autocomplete': autoComplete ? 'both' : 'list',
-        'aria-controls': listboxAvailable ? `${id}-listbox` : null,
+        'aria-controls': listboxAvailable ? `${id}-listbox` : undefined,
         // Disable browser's suggestion that might overlap with the popup.
         // Handle autocomplete but not autofill.
         autoComplete: 'off',
@@ -8630,25 +8631,70 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
   } ;
   var BackdropUnstyled$1 = BackdropUnstyled;
 
+  function useBadge(props) {
+    const {
+      anchorOrigin: anchorOriginProp = {
+        vertical: 'top',
+        horizontal: 'right'
+      },
+      badgeContent: badgeContentProp,
+      invisible: invisibleProp,
+      max: maxProp = 99,
+      showZero = false,
+      variant: variantProp = 'standard'
+    } = props;
+    const prevProps = usePreviousProps$1({
+      anchorOrigin: anchorOriginProp,
+      badgeContent: badgeContentProp,
+      max: maxProp,
+      variant: variantProp
+    });
+    let invisible = invisibleProp;
+
+    if (invisibleProp == null && (badgeContentProp === 0 && !showZero || badgeContentProp == null && variantProp !== 'dot')) {
+      invisible = true;
+    }
+
+    const {
+      anchorOrigin = anchorOriginProp,
+      badgeContent,
+      max = maxProp,
+      variant = variantProp
+    } = invisible ? prevProps : props;
+    let displayValue = '';
+
+    if (variant !== 'dot') {
+      displayValue = badgeContent && Number(badgeContent) > max ? `${max}+` : badgeContent;
+    }
+
+    return {
+      anchorOrigin,
+      badgeContent,
+      invisible,
+      max,
+      variant,
+      displayValue
+    };
+  }
+
   function getBadgeUtilityClass(slot) {
     return generateUtilityClass('MuiBadge', slot);
   }
-  const badgeUnstyledClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'standard', 'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular', 'invisible']);
+  const badgeUnstyledClasses = generateUtilityClasses('MuiBadge', ['root', 'badge', 'dot', 'standard', 'anchorOriginTopLeft', 'anchorOriginTopRight', 'anchorOriginBottomLeft', 'anchorOriginBottomRight', 'invisible']);
   var badgeUnstyledClasses$1 = badgeUnstyledClasses;
 
-  const _excluded$2l = ["anchorOrigin", "classes", "badgeContent", "component", "children", "className", "components", "componentsProps", "invisible", "max", "overlap", "showZero", "variant", "theme"];
+  const _excluded$2l = ["anchorOrigin", "classes", "badgeContent", "component", "children", "className", "components", "componentsProps", "invisible", "max", "showZero", "variant"];
 
   const useUtilityClasses$1S = ownerState => {
     const {
       variant,
       anchorOrigin,
-      overlap,
       invisible,
       classes
     } = ownerState;
     const slots = {
       root: ['root'],
-      badge: ['badge', variant, `anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`, invisible && 'invisible']
+      badge: ['badge', variant, `anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}`, invisible && 'invisible']
     };
     return composeClasses(slots, getBadgeUtilityClass, classes);
   };
@@ -8660,40 +8706,29 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
         horizontal: 'right'
       },
       classes: classesProp,
-      badgeContent: badgeContentProp,
       component,
       children,
       className,
       components = {},
       componentsProps = {},
-      invisible: invisibleProp,
       max: maxProp = 99,
-      overlap: overlapProp = 'rectangular',
       showZero = false,
       variant: variantProp = 'standard'
     } = props,
           other = _objectWithoutPropertiesLoose(props, _excluded$2l);
 
-    const prevProps = usePreviousProps$1({
+    const {
+      anchorOrigin,
+      badgeContent,
+      max,
+      variant,
+      displayValue,
+      invisible
+    } = useBadge(_extends({}, props, {
       anchorOrigin: anchorOriginProp,
-      badgeContent: badgeContentProp,
       max: maxProp,
-      overlap: overlapProp,
       variant: variantProp
-    });
-    let invisible = invisibleProp;
-
-    if (invisibleProp == null && (badgeContentProp === 0 && !showZero || badgeContentProp == null && variantProp !== 'dot')) {
-      invisible = true;
-    }
-
-    const {
-      anchorOrigin = anchorOriginProp,
-      badgeContent,
-      max = maxProp,
-      overlap = overlapProp,
-      variant = variantProp
-    } = invisible ? prevProps : props;
+    }));
 
     const ownerState = _extends({}, props, {
       anchorOrigin,
@@ -8701,16 +8736,10 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
       classes: classesProp,
       invisible,
       max,
-      overlap,
-      variant
+      variant,
+      showZero
     });
 
-    let displayValue = '';
-
-    if (variant !== 'dot') {
-      displayValue = badgeContent > max ? `${max}+` : badgeContent;
-    }
-
     const classes = useUtilityClasses$1S(ownerState);
     const Root = component || components.Root || 'span';
     const rootProps = appendOwnerState(Root, _extends({}, other, componentsProps.root), ownerState);
@@ -8799,12 +8828,6 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
      */
     max: propTypes.number,
 
-    /**
-     * Wrapped shape the badge should overlap.
-     * @default 'rectangular'
-     */
-    overlap: propTypes.oneOf(['circular', 'rectangular']),
-
     /**
      * Controls whether the badge is hidden when `badgeContent` is zero.
      * @default false
@@ -9847,7 +9870,7 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
       if (rows) {
         {
           if (minRows || maxRows) {
-            console.warn('Material-UI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set.');
+            console.warn('MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set.');
           }
         }
 
@@ -23764,18 +23787,21 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
   } ;
   var Backdrop$1 = Backdrop;
 
-  const _excluded$1K = ["component", "components", "componentsProps", "color", "invisible", "badgeContent", "showZero", "variant"];
-  const badgeClasses = _extends({}, badgeUnstyledClasses$1, generateUtilityClasses('MuiBadge', ['colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning']));
+  const _excluded$1K = ["anchorOrigin", "component", "components", "componentsProps", "overlap", "color", "invisible", "badgeContent", "showZero", "variant"];
+  const badgeClasses = _extends({}, badgeUnstyledClasses$1, generateUtilityClasses('MuiBadge', ['colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning', 'overlapRectangular', 'overlapCircular', // TODO: v6 remove the overlap value from these class keys
+  'anchorOriginTopLeftCircular', 'anchorOriginTopLeftRectangular', 'anchorOriginTopRightCircular', 'anchorOriginTopRightRectangular', 'anchorOriginBottomLeftCircular', 'anchorOriginBottomLeftRectangular', 'anchorOriginBottomRightCircular', 'anchorOriginBottomRightRectangular']));
   const RADIUS_STANDARD = 10;
   const RADIUS_DOT = 4;
 
   const extendUtilityClasses$2 = ownerState => {
     const {
       color,
+      anchorOrigin,
+      overlap,
       classes = {}
     } = ownerState;
     return _extends({}, classes, {
-      badge: clsx(classes.badge, color !== 'default' && [getBadgeUtilityClass(`color${capitalize(color)}`), classes[`color${capitalize(color)}`]])
+      badge: clsx(classes.badge, getBadgeUtilityClass(`anchorOrigin${capitalize(anchorOrigin.vertical)}${capitalize(anchorOrigin.horizontal)}${capitalize(overlap)}`), getBadgeUtilityClass(`overlap${capitalize(overlap)}`), color !== 'default' && [getBadgeUtilityClass(`color${capitalize(color)}`), classes[`color${capitalize(color)}`]])
     });
   };
 
@@ -23917,9 +23943,14 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
     });
 
     const {
+      anchorOrigin: anchorOriginProp = {
+        vertical: 'top',
+        horizontal: 'right'
+      },
       component = 'span',
       components = {},
       componentsProps = {},
+      overlap: overlapProp = 'rectangular',
       color: colorProp = 'default',
       invisible: invisibleProp,
       badgeContent: badgeContentProp,
@@ -23929,7 +23960,9 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
           other = _objectWithoutPropertiesLoose(props, _excluded$1K);
 
     const prevProps = usePreviousProps$1({
-      color: colorProp
+      anchorOrigin: anchorOriginProp,
+      color: colorProp,
+      overlap: overlapProp
     });
     let invisible = invisibleProp;
 
@@ -23938,16 +23971,21 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
     }
 
     const {
-      color = colorProp
+      color = colorProp,
+      overlap = overlapProp,
+      anchorOrigin = anchorOriginProp
     } = invisible ? prevProps : props;
 
     const ownerState = _extends({}, props, {
+      anchorOrigin,
       invisible,
-      color
+      color,
+      overlap
     });
 
     const classes = extendUtilityClasses$2(ownerState);
     return /*#__PURE__*/jsxRuntime_1(BadgeUnstyled$1, _extends({
+      anchorOrigin: anchorOrigin,
       invisible: invisibleProp,
       badgeContent: badgeContentProp,
       showZero: showZero,
@@ -23961,12 +23999,14 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
         root: _extends({}, componentsProps.root, shouldSpreadAdditionalProps(components.Root) && {
           as: component,
           ownerState: _extends({}, (_componentsProps$root = componentsProps.root) == null ? void 0 : _componentsProps$root.ownerState, {
-            color
+            color,
+            overlap
           })
         }),
         badge: _extends({}, componentsProps.badge, shouldSpreadAdditionalProps(components.Badge) && {
           ownerState: _extends({}, (_componentsProps$badg = componentsProps.badge) == null ? void 0 : _componentsProps$badg.ownerState, {
-            color
+            color,
+            overlap
           })
         })
       },
@@ -52117,6 +52157,7 @@ See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.` )
   exports.unstable_useId = useId;
   exports.unsupportedProp = unsupportedProp;
   exports.useAutocomplete = useAutocomplete;
+  exports.useBadge = useBadge;
   exports.useButton = useButton;
   exports.useControlled = useControlled;
   exports.useEventCallback = useEventCallback;