@mui/material 5.13.4 → 5.13.6

package/umd/material-ui.development.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.13.4
+ * @mui/material v5.13.6
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -1968,6 +1968,7 @@
     let timeout;
     function debounced(...args) {
       const later = () => {
+        // @ts-ignore
         func.apply(this, args);
       };
       clearTimeout(timeout);
@@ -4270,7 +4271,7 @@
 
   var pkg = {
   	name: "@emotion/react",
-  	version: "11.11.0",
+  	version: "11.11.1",
   	main: "dist/emotion-react.cjs.js",
   	module: "dist/emotion-react.esm.js",
   	browser: {
@@ -8555,6 +8556,12 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
   function createCssVarsProvider(options) {
     const {
       themeId,
+      /**
+       * This `theme` object needs to follow a certain structure to
+       * be used correctly by the finel `CssVarsProvider`. It should have a
+       * `colorSchemes` key with the light and dark (and any other) palette.
+       * It should also ideally have a vars object created using `prepareCssVars`.
+       */
       theme: defaultTheme = {},
       attribute: defaultAttribute = DEFAULT_ATTRIBUTE,
       modeStorageKey: defaultModeStorageKey = DEFAULT_MODE_STORAGE_KEY,
@@ -9221,34 +9228,6 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
     return Container;
   }
 
-  function appendLevel(level) {
-    if (!level) {
-      return '';
-    }
-    return `Level${level}`;
-  }
-  function isNestedContainer(ownerState) {
-    return ownerState.unstable_level > 0 && ownerState.container;
-  }
-  function createGetSelfSpacing(ownerState) {
-    return function getSelfSpacing(axis) {
-      return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level)})`;
-    };
-  }
-  function createGetParentSpacing(ownerState) {
-    return function getParentSpacing(axis) {
-      if (ownerState.unstable_level === 0) {
-        return `var(--Grid-${axis}Spacing)`;
-      }
-      return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level - 1)})`;
-    };
-  }
-  function getParentColumns(ownerState) {
-    if (ownerState.unstable_level === 0) {
-      return `var(--Grid-columns)`;
-    }
-    return `var(--Grid-columns${appendLevel(ownerState.unstable_level - 1)})`;
-  }
   const filterBreakpointKeys = (breakpointsKeys, responsiveKeys) => breakpointsKeys.filter(key => responsiveKeys.includes(key));
   const traverseBreakpoints = (breakpoints, responsive, iterator) => {
     const smallestBreakpoint = breakpoints.keys[0]; // the keys is sorted from smallest to largest by `createBreakpoints`.
@@ -9291,6 +9270,35 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
       }, responsive);
     }
   };
+
+  function appendLevel(level) {
+    if (!level) {
+      return '';
+    }
+    return `Level${level}`;
+  }
+  function isNestedContainer(ownerState) {
+    return ownerState.unstable_level > 0 && ownerState.container;
+  }
+  function createGetSelfSpacing(ownerState) {
+    return function getSelfSpacing(axis) {
+      return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level)})`;
+    };
+  }
+  function createGetParentSpacing(ownerState) {
+    return function getParentSpacing(axis) {
+      if (ownerState.unstable_level === 0) {
+        return `var(--Grid-${axis}Spacing)`;
+      }
+      return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level - 1)})`;
+    };
+  }
+  function getParentColumns(ownerState) {
+    if (ownerState.unstable_level === 0) {
+      return `var(--Grid-columns)`;
+    }
+    return `var(--Grid-columns${appendLevel(ownerState.unstable_level - 1)})`;
+  }
   const generateGridSizeStyles = ({
     theme,
     ownerState
@@ -11289,11 +11297,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Badge](https://mui.com/base/react-badge/#hook)
+   * - [Badge](https://mui.com/base-ui/react-badge/#hook)
    *
    * API:
    *
-   * - [useBadge API](https://mui.com/base/react-badge/hooks-api/#use-badge)
+   * - [useBadge API](https://mui.com/base-ui/react-badge/hooks-api/#use-badge)
    */
   function useBadge(parameters) {
     const {
@@ -11335,11 +11343,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Click-Away Listener](https://mui.com/base/react-click-away-listener/)
+   * - [Click-Away Listener](https://mui.com/base-ui/react-click-away-listener/)
    *
    * API:
    *
-   * - [ClickAwayListener API](https://mui.com/base/react-click-away-listener/components-api/#click-away-listener)
+   * - [ClickAwayListener API](https://mui.com/base-ui/react-click-away-listener/components-api/#click-away-listener)
    */
   function ClickAwayListener(props) {
     const {
@@ -11563,11 +11571,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Focus Trap](https://mui.com/base/react-focus-trap/)
+   * - [Focus Trap](https://mui.com/base-ui/react-focus-trap/)
    *
    * API:
    *
-   * - [FocusTrap API](https://mui.com/base/react-focus-trap/components-api/#focus-trap)
+   * - [FocusTrap API](https://mui.com/base-ui/react-focus-trap/components-api/#focus-trap)
    */
   function FocusTrap(props) {
     const {
@@ -13615,11 +13623,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Portal](https://mui.com/base/react-portal/)
+   * - [Portal](https://mui.com/base-ui/react-portal/)
    *
    * API:
    *
-   * - [Portal API](https://mui.com/base/react-portal/components-api/#portal)
+   * - [Portal API](https://mui.com/base-ui/react-portal/components-api/#portal)
    */
   const Portal = /*#__PURE__*/React__namespace.forwardRef(function Portal(props, forwardedRef) {
     const {
@@ -13854,11 +13862,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Popper](https://mui.com/base/react-popper/)
+   * - [Popper](https://mui.com/base-ui/react-popper/)
    *
    * API:
    *
-   * - [Popper API](https://mui.com/base/react-popper/components-api/#popper)
+   * - [Popper API](https://mui.com/base-ui/react-popper/components-api/#popper)
    */
   const Popper$2 = /*#__PURE__*/React__namespace.forwardRef(function Popper(props, forwardedRef) {
     const {
@@ -14312,11 +14320,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Modal](https://mui.com/base/react-modal/)
+   * - [Modal](https://mui.com/base-ui/react-modal/)
    *
    * API:
    *
-   * - [Modal API](https://mui.com/base/react-modal/components-api/#modal)
+   * - [Modal API](https://mui.com/base-ui/react-modal/components-api/#modal)
    */
   const Modal$2 = /*#__PURE__*/React__namespace.forwardRef(function Modal(props, forwardedRef) {
     var _props$ariaHidden, _slots$root;
@@ -14609,6 +14617,14 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
      * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
      */
     onClose: PropTypes.func,
+    /**
+     * A function called when a transition enters.
+     */
+    onTransitionEnter: PropTypes.func,
+    /**
+     * A function called when a transition has exited.
+     */
+    onTransitionExited: PropTypes.func,
     /**
      * If `true`, the component is shown.
      */
@@ -14645,11 +14661,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [No SSR](https://mui.com/base/react-no-ssr/)
+   * - [No SSR](https://mui.com/base-ui/react-no-ssr/)
    *
    * API:
    *
-   * - [NoSsr API](https://mui.com/base/react-no-ssr/components-api/#no-ssr)
+   * - [NoSsr API](https://mui.com/base-ui/react-no-ssr/components-api/#no-ssr)
    */
   function NoSsr(props) {
     const {
@@ -14855,11 +14871,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Slider](https://mui.com/base/react-slider/#hook)
+   * - [Slider](https://mui.com/base-ui/react-slider/#hook)
    *
    * API:
    *
-   * - [useSlider API](https://mui.com/base/react-slider/hooks-api/#use-slider)
+   * - [useSlider API](https://mui.com/base-ui/react-slider/hooks-api/#use-slider)
    */
   function useSlider(parameters) {
     const {
@@ -14973,13 +14989,16 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       // @ts-ignore
       let newValue = event.target.valueAsNumber;
       if (marks && step == null) {
-        newValue = newValue < value ? marksValues[marksIndex - 1] : marksValues[marksIndex + 1];
+        const maxMarksValue = marksValues[marksValues.length - 1];
+        if (newValue > maxMarksValue) {
+          newValue = maxMarksValue;
+        } else if (newValue < marksValues[0]) {
+          newValue = marksValues[0];
+        } else {
+          newValue = newValue < value ? marksValues[marksIndex - 1] : marksValues[marksIndex + 1];
+        }
       }
       newValue = clamp$2(newValue, min, max);
-      if (marks && step == null) {
-        const currentMarkIndex = marksValues.indexOf(values[index]);
-        newValue = newValue < values[index] ? marksValues[currentMarkIndex - 1] : marksValues[currentMarkIndex + 1];
-      }
       if (range) {
         // Bound the new value to the thumb's neighbours.
         if (disableSwap) {
@@ -15285,7 +15304,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         type: 'range',
         min: parameters.min,
         max: parameters.max,
-        step: (_parameters$step = parameters.step) != null ? _parameters$step : undefined,
+        step: parameters.step === null && parameters.marks ? 'any' : (_parameters$step = parameters.step) != null ? _parameters$step : undefined,
         disabled
       }, mergedEventHandlers, {
         style: _extends({}, visuallyHidden$1, {
@@ -15320,11 +15339,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Snackbar](https://mui.com/base/react-snackbar/#hook)
+   * - [Snackbar](https://mui.com/base-ui/react-snackbar/#hook)
    *
    * API:
    *
-   * - [useSnackbar API](https://mui.com/base/react-snackbar/hooks-api/#use-snackbar)
+   * - [useSnackbar API](https://mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar)
    */
   function useSnackbar(parameters) {
     const {
@@ -15473,12 +15492,12 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
    *
    * Demos:
    *
-   * - [Textarea Autosize](https://mui.com/base/react-textarea-autosize/)
+   * - [Textarea Autosize](https://mui.com/base-ui/react-textarea-autosize/)
    * - [Textarea Autosize](https://mui.com/material-ui/react-textarea-autosize/)
    *
    * API:
    *
-   * - [TextareaAutosize API](https://mui.com/base/react-textarea-autosize/components-api/#textarea-autosize)
+   * - [TextareaAutosize API](https://mui.com/base-ui/react-textarea-autosize/components-api/#textarea-autosize)
    */
   const TextareaAutosize = /*#__PURE__*/React__namespace.forwardRef(function TextareaAutosize(props, forwardedRef) {
     const {
@@ -15881,7 +15900,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     }) : [];
     const previousProps = usePreviousProps$1({
       filteredOptions,
-      value
+      value,
+      inputValue
     });
     React__namespace.useEffect(() => {
       const valueChange = value !== previousProps.value;
@@ -16074,7 +16094,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         const label2 = value2 ? getOptionLabel(value2) : '';
         return label1 === label2;
       };
-      if (highlightedIndexRef.current !== -1 && previousProps.filteredOptions && previousProps.filteredOptions.length !== filteredOptions.length && (multiple ? value.length === previousProps.value.length && previousProps.value.every((val, i) => getOptionLabel(value[i]) === getOptionLabel(val)) : isSameValue(previousProps.value, value))) {
+      if (highlightedIndexRef.current !== -1 && previousProps.filteredOptions && previousProps.filteredOptions.length !== filteredOptions.length && previousProps.inputValue === inputValue && (multiple ? value.length === previousProps.value.length && previousProps.value.every((val, i) => getOptionLabel(value[i]) === getOptionLabel(val)) : isSameValue(previousProps.value, value))) {
         const previousHighlightedOption = previousProps.filteredOptions[highlightedIndexRef.current];
         if (previousHighlightedOption) {
           const previousHighlightedOptionExists = filteredOptions.some(option => {
@@ -16092,8 +16112,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         return;
       }
 
-      // Check if the previously highlighted option still exists in the updated filtered options list and if the value hasn't changed
-      // If it exists and the value hasn't changed, return, otherwise continue execution
+      // Check if the previously highlighted option still exists in the updated filtered options list and if the value and inputValue haven't changed
+      // If it exists and the value and the inputValue haven't changed, return, otherwise continue execution
       if (checkHighlightedOptionExists()) {
         return;
       }
@@ -16710,7 +16730,9 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       width: '1em',
       height: '1em',
       display: 'inline-block',
-      fill: 'currentColor',
+      // the <svg> will define the property that has `currentColor`
+      // e.g. heroicons uses fill="none" and stroke="currentColor"
+      fill: ownerState.hasSvgAsChild ? undefined : 'currentColor',
       flexShrink: 0,
       transition: (_theme$transitions = theme.transitions) == null ? void 0 : (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {
         duration: (_theme$transitions2 = theme.transitions) == null ? void 0 : (_theme$transitions2$d = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2$d.shorter
@@ -16746,13 +16768,15 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         viewBox = '0 0 24 24'
       } = props,
       other = _objectWithoutPropertiesLoose(props, _excluded$23);
+    const hasSvgAsChild = /*#__PURE__*/React__namespace.isValidElement(children) && children.type === 'svg';
     const ownerState = _extends({}, props, {
       color,
       component,
       fontSize,
       instanceFontSize: inProps.fontSize,
       inheritViewBox,
-      viewBox
+      viewBox,
+      hasSvgAsChild
     });
     const more = {};
     if (!inheritViewBox) {
@@ -16767,9 +16791,9 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       "aria-hidden": titleAccess ? undefined : true,
       role: titleAccess ? 'img' : undefined,
       ref: ref
-    }, more, other, {
+    }, more, other, hasSvgAsChild && children.props, {
       ownerState: ownerState,
-      children: [children, titleAccess ? /*#__PURE__*/jsxRuntime_1("title", {
+      children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /*#__PURE__*/jsxRuntime_1("title", {
         children: titleAccess
       }) : null]
     }));
@@ -19022,14 +19046,16 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     const ignoringMouseDown = React__namespace.useRef(false);
     // We use a timer in order to only show the ripples for touch "click" like events.
     // We don't want to display the ripple for touch scroll events.
-    const startTimer = React__namespace.useRef(null);
+    const startTimer = React__namespace.useRef(0);
 
     // This is the hook called once the previous timeout is ready.
     const startTimerCommit = React__namespace.useRef(null);
     const container = React__namespace.useRef(null);
     React__namespace.useEffect(() => {
       return () => {
-        clearTimeout(startTimer.current);
+        if (startTimer.current) {
+          clearTimeout(startTimer.current);
+        }
       };
     }, []);
     const startCommit = React__namespace.useCallback(params => {
@@ -27752,6 +27778,14 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
      * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
      */
     onClose: PropTypes.func,
+    /**
+     * A function called when a transition enters.
+     */
+    onTransitionEnter: PropTypes.func,
+    /**
+     * A function called when a transition has exited.
+     */
+    onTransitionExited: PropTypes.func,
     /**
      * If `true`, the component is shown.
      */
@@ -36129,7 +36163,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
      */
     action: refType$1,
     /**
-     * An HTML element, or a function that returns one.
+     * An HTML element, [PopoverVirtualElement](/material-ui/react-popover/#virtual-element),
+     * or a function that returns either.
      * It's used to set the position of the popover.
      */
     anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.func]), props => {
@@ -36141,7 +36176,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
             return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
           }
         } else {
-          return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', `It should be an Element instance but it's \`${resolvedAnchorEl}\` instead.`].join('\n'));
+          return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', `It should be an Element or PopoverVirtualElement instance but it's \`${resolvedAnchorEl}\` instead.`].join('\n'));
         }
       }
       return null;
@@ -43004,7 +43039,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     });
     const {
         arrow = false,
-        children,
+        children: childrenProp,
         components = {},
         componentsProps = {},
         describeChild = false,
@@ -43032,6 +43067,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         TransitionProps
       } = props,
       other = _objectWithoutPropertiesLoose(props, _excluded$v);
+
+    // to prevent runtime errors, developers will need to provide a child as a React element anyway.
+    const children = /*#__PURE__*/React__namespace.isValidElement(childrenProp) ? childrenProp : /*#__PURE__*/jsxRuntime_1("span", {
+      children: childrenProp
+    });
     const theme = useTheme();
     const isRtl = theme.direction === 'rtl';
     const [childNode, setChildNode] = React__namespace.useState();