@mui/material 5.13.3 → 5.13.4

package/umd/material-ui.development.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.13.3
+ * @mui/material v5.13.4
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -12264,17 +12264,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       }
     }
 
-    {
-      if (!isHTMLElement$1(arrowElement)) {
-        console.error(['Popper: "arrow" element must be an HTMLElement (not an SVGElement).', 'To use an SVG arrow, wrap it in an HTMLElement that will be used as', 'the arrow.'].join(' '));
-      }
-    }
-
     if (!contains(state.elements.popper, arrowElement)) {
-      {
-        console.error(['Popper: "arrow" modifier\'s `element` must be a child of the popper', 'element.'].join(' '));
-      }
-
       return;
     }
 
@@ -12416,17 +12406,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
         _options$roundOffsets = options.roundOffsets,
         roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
-
-    {
-      var transitionProperty = getComputedStyle(state.elements.popper).transitionProperty || '';
-
-      if (adaptive && ['transform', 'top', 'right', 'bottom', 'left'].some(function (property) {
-        return transitionProperty.indexOf(property) >= 0;
-      })) {
-        console.warn(['Popper: Detected CSS transitions on at least one of the following', 'CSS properties: "transform", "top", "right", "bottom", "left".', '\n\n', 'Disable the "computeStyles" modifier\'s `adaptive` option to allow', 'for smooth transitions, or remove these properties from the CSS', 'transition declaration on the popper element if only transitioning', 'opacity or background-color for example.', '\n\n', 'We recommend using the popper element as a wrapper around an inner', 'element that can have any CSS property transitioned for animations.'].join(' '));
-      }
-    }
-
     var commonStyles = {
       placement: getBasePlacement(state.placement),
       variation: getVariation(state.placement),
@@ -12867,10 +12846,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
 
     if (allowedPlacements.length === 0) {
       allowedPlacements = placements$1;
-
-      {
-        console.error(['Popper: The `allowedAutoPlacements` option did not allow any', 'placements. Ensure the `placement` option matches the variation', 'of the allowed placements.', 'For example, "auto" cannot be used to allow "bottom-start".', 'Use "auto-start" instead.'].join(' '));
-      }
     } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
 
 
@@ -13422,108 +13397,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     };
   }
 
-  function format(str) {
-    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      args[_key - 1] = arguments[_key];
-    }
-
-    return [].concat(args).reduce(function (p, c) {
-      return p.replace(/%s/, c);
-    }, str);
-  }
-
-  var INVALID_MODIFIER_ERROR = 'Popper: modifier "%s" provided an invalid %s property, expected %s but got %s';
-  var MISSING_DEPENDENCY_ERROR = 'Popper: modifier "%s" requires "%s", but "%s" modifier is not available';
-  var VALID_PROPERTIES = ['name', 'enabled', 'phase', 'fn', 'effect', 'requires', 'options'];
-  function validateModifiers(modifiers) {
-    modifiers.forEach(function (modifier) {
-      [].concat(Object.keys(modifier), VALID_PROPERTIES) // IE11-compatible replacement for `new Set(iterable)`
-      .filter(function (value, index, self) {
-        return self.indexOf(value) === index;
-      }).forEach(function (key) {
-        switch (key) {
-          case 'name':
-            if (typeof modifier.name !== 'string') {
-              console.error(format(INVALID_MODIFIER_ERROR, String(modifier.name), '"name"', '"string"', "\"" + String(modifier.name) + "\""));
-            }
-
-            break;
-
-          case 'enabled':
-            if (typeof modifier.enabled !== 'boolean') {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"enabled"', '"boolean"', "\"" + String(modifier.enabled) + "\""));
-            }
-
-            break;
-
-          case 'phase':
-            if (modifierPhases.indexOf(modifier.phase) < 0) {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"phase"', "either " + modifierPhases.join(', '), "\"" + String(modifier.phase) + "\""));
-            }
-
-            break;
-
-          case 'fn':
-            if (typeof modifier.fn !== 'function') {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"fn"', '"function"', "\"" + String(modifier.fn) + "\""));
-            }
-
-            break;
-
-          case 'effect':
-            if (modifier.effect != null && typeof modifier.effect !== 'function') {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"effect"', '"function"', "\"" + String(modifier.fn) + "\""));
-            }
-
-            break;
-
-          case 'requires':
-            if (modifier.requires != null && !Array.isArray(modifier.requires)) {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"requires"', '"array"', "\"" + String(modifier.requires) + "\""));
-            }
-
-            break;
-
-          case 'requiresIfExists':
-            if (!Array.isArray(modifier.requiresIfExists)) {
-              console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"requiresIfExists"', '"array"', "\"" + String(modifier.requiresIfExists) + "\""));
-            }
-
-            break;
-
-          case 'options':
-          case 'data':
-            break;
-
-          default:
-            console.error("PopperJS: an invalid property has been provided to the \"" + modifier.name + "\" modifier, valid properties are " + VALID_PROPERTIES.map(function (s) {
-              return "\"" + s + "\"";
-            }).join(', ') + "; but \"" + key + "\" was provided.");
-        }
-
-        modifier.requires && modifier.requires.forEach(function (requirement) {
-          if (modifiers.find(function (mod) {
-            return mod.name === requirement;
-          }) == null) {
-            console.error(format(MISSING_DEPENDENCY_ERROR, String(modifier.name), requirement, requirement));
-          }
-        });
-      });
-    });
-  }
-
-  function uniqueBy(arr, fn) {
-    var identifiers = new Set();
-    return arr.filter(function (item) {
-      var identifier = fn(item);
-
-      if (!identifiers.has(identifier)) {
-        identifiers.add(identifier);
-        return true;
-      }
-    });
-  }
-
   function mergeByName(modifiers) {
     var merged = modifiers.reduce(function (merged, current) {
       var existing = merged[current.name];
@@ -13539,8 +13412,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     });
   }
 
-  var INVALID_ELEMENT_ERROR = 'Popper: Invalid reference or popper argument provided. They must be either a DOM element or virtual element.';
-  var INFINITE_LOOP_ERROR = 'Popper: An infinite loop in the modifiers cycle has been detected! The cycle has been interrupted to prevent a browser crash.';
   var DEFAULT_OPTIONS = {
     placement: 'bottom',
     modifiers: [],
@@ -13602,42 +13473,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
 
           state.orderedModifiers = orderedModifiers.filter(function (m) {
             return m.enabled;
-          }); // Validate the provided modifiers so that the consumer will get warned
-          // if one of the modifiers is invalid for any reason
-
-          {
-            var modifiers = uniqueBy([].concat(orderedModifiers, state.options.modifiers), function (_ref) {
-              var name = _ref.name;
-              return name;
-            });
-            validateModifiers(modifiers);
-
-            if (getBasePlacement(state.options.placement) === auto) {
-              var flipModifier = state.orderedModifiers.find(function (_ref2) {
-                var name = _ref2.name;
-                return name === 'flip';
-              });
-
-              if (!flipModifier) {
-                console.error(['Popper: "auto" placements require the "flip" modifier be', 'present and enabled to work.'].join(' '));
-              }
-            }
-
-            var _getComputedStyle = getComputedStyle(popper),
-                marginTop = _getComputedStyle.marginTop,
-                marginRight = _getComputedStyle.marginRight,
-                marginBottom = _getComputedStyle.marginBottom,
-                marginLeft = _getComputedStyle.marginLeft; // We no longer take into account `margins` on the popper, and it can
-            // cause bugs with positioning, so we'll warn the consumer
-
-
-            if ([marginTop, marginRight, marginBottom, marginLeft].some(function (margin) {
-              return parseFloat(margin);
-            })) {
-              console.warn(['Popper: CSS "margin" styles cannot be used to apply padding', 'between the popper and its reference element or boundary.', 'To replicate margin, use the `offset` modifier, as well as', 'the `padding` option in the `preventOverflow` and `flip`', 'modifiers.'].join(' '));
-            }
-          }
-
+          });
           runModifierEffects();
           return instance.update();
         },
@@ -13657,10 +13493,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
           // anymore
 
           if (!areValidElements(reference, popper)) {
-            {
-              console.error(INVALID_ELEMENT_ERROR);
-            }
-
             return;
           } // Store the reference and popper rects to be read by modifiers
 
@@ -13683,18 +13515,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
           state.orderedModifiers.forEach(function (modifier) {
             return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
           });
-          var __debug_loops__ = 0;
 
           for (var index = 0; index < state.orderedModifiers.length; index++) {
-            {
-              __debug_loops__ += 1;
-
-              if (__debug_loops__ > 100) {
-                console.error(INFINITE_LOOP_ERROR);
-                break;
-              }
-            }
-
             if (state.reset === true) {
               state.reset = false;
               index = -1;
@@ -13732,10 +13554,6 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       };
 
       if (!areValidElements(reference, popper)) {
-        {
-          console.error(INVALID_ELEMENT_ERROR);
-        }
-
         return instance;
       }
 
@@ -13750,11 +13568,11 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       // one.
 
       function runModifierEffects() {
-        state.orderedModifiers.forEach(function (_ref3) {
-          var name = _ref3.name,
-              _ref3$options = _ref3.options,
-              options = _ref3$options === void 0 ? {} : _ref3$options,
-              effect = _ref3.effect;
+        state.orderedModifiers.forEach(function (_ref) {
+          var name = _ref.name,
+              _ref$options = _ref.options,
+              options = _ref$options === void 0 ? {} : _ref$options,
+              effect = _ref.effect;
 
           if (typeof effect === 'function') {
             var cleanupFn = effect({
@@ -35870,6 +35688,13 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     // item and use the first valid item as a fallback
     React__namespace.Children.forEach(children, (child, index) => {
       if (! /*#__PURE__*/React__namespace.isValidElement(child)) {
+        if (activeItemIndex === index) {
+          activeItemIndex += 1;
+          if (activeItemIndex >= children.length) {
+            // there are no focusable items within the list.
+            activeItemIndex = -1;
+          }
+        }
         return;
       }
       {
@@ -35969,7 +35794,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   var popoverClasses$1 = popoverClasses;
 
   const _excluded$S = ["onEntering"],
-    _excluded2$6 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"];
+    _excluded2$6 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "slots", "slotProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"],
+    _excluded3$1 = ["slotProps"];
   function getOffsetTop(rect, vertical) {
     let offset = 0;
     if (typeof vertical === 'number') {
@@ -36031,6 +35857,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     outline: 0
   });
   const Popover = /*#__PURE__*/React__namespace.forwardRef(function Popover(inProps, ref) {
+    var _slotProps$paper, _slots$root, _slots$paper;
     const props = useThemeProps({
       props: inProps,
       name: 'MuiPopover'
@@ -36050,7 +35877,9 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         elevation = 8,
         marginThreshold = 16,
         open,
-        PaperProps = {},
+        PaperProps: PaperPropsProp = {},
+        slots,
+        slotProps,
         transformOrigin = {
           vertical: 'top',
           horizontal: 'left'
@@ -36063,14 +35892,15 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       } = props,
       TransitionProps = _objectWithoutPropertiesLoose(props.TransitionProps, _excluded$S),
       other = _objectWithoutPropertiesLoose(props, _excluded2$6);
+    const externalPaperSlotProps = (_slotProps$paper = slotProps == null ? void 0 : slotProps.paper) != null ? _slotProps$paper : PaperPropsProp;
     const paperRef = React__namespace.useRef();
-    const handlePaperRef = useForkRef(paperRef, PaperProps.ref);
+    const handlePaperRef = useForkRef(paperRef, externalPaperSlotProps.ref);
     const ownerState = _extends({}, props, {
       anchorOrigin,
       anchorReference,
       elevation,
       marginThreshold,
-      PaperProps,
+      externalPaperSlotProps,
       transformOrigin,
       TransitionComponent,
       transitionDuration: transitionDurationProp,
@@ -36235,16 +36065,46 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     // If the anchorEl prop is provided, use its parent body element as the container
     // If neither are provided let the Modal take care of choosing the container
     const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
-    return /*#__PURE__*/jsxRuntime_1(PopoverRoot, _extends({
-      BackdropProps: {
-        invisible: true
+    const RootSlot = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : PopoverRoot;
+    const PaperSlot = (_slots$paper = slots == null ? void 0 : slots.paper) != null ? _slots$paper : PopoverPaper;
+    const paperProps = useSlotProps({
+      elementType: PaperSlot,
+      externalSlotProps: _extends({}, externalPaperSlotProps, {
+        style: isPositioned ? externalPaperSlotProps.style : _extends({}, externalPaperSlotProps.style, {
+          opacity: 0
+        })
+      }),
+      additionalProps: {
+        elevation,
+        ref: handlePaperRef
       },
-      className: clsx(classes.root, className),
-      container: container,
-      open: open,
-      ref: ref,
-      ownerState: ownerState
-    }, other, {
+      ownerState,
+      className: clsx(classes.paper, externalPaperSlotProps == null ? void 0 : externalPaperSlotProps.className)
+    });
+    const _useSlotProps = useSlotProps({
+        elementType: RootSlot,
+        externalSlotProps: (slotProps == null ? void 0 : slotProps.root) || {},
+        externalForwardedProps: other,
+        additionalProps: {
+          ref,
+          slotProps: {
+            backdrop: {
+              invisible: true
+            }
+          },
+          container,
+          open
+        },
+        ownerState,
+        className: clsx(classes.root, className)
+      }),
+      {
+        slotProps: rootSlotPropsProp
+      } = _useSlotProps,
+      rootProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded3$1);
+    return /*#__PURE__*/jsxRuntime_1(RootSlot, _extends({}, rootProps, !isHostComponent(RootSlot) && {
+      slotProps: rootSlotPropsProp
+    }, {
       children: /*#__PURE__*/jsxRuntime_1(TransitionComponent, _extends({
         appear: true,
         in: open,
@@ -36252,17 +36112,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         onExited: handleExited,
         timeout: transitionDuration
       }, TransitionProps, {
-        children: /*#__PURE__*/jsxRuntime_1(PopoverPaper, _extends({
-          elevation: elevation
-        }, PaperProps, {
-          ref: handlePaperRef,
-          className: clsx(classes.paper, PaperProps.className)
-        }, isPositioned ? undefined : {
-          style: _extends({}, PaperProps.style, {
-            opacity: 0
-          })
-        }, {
-          ownerState: ownerState,
+        children: /*#__PURE__*/jsxRuntime_1(PaperSlot, _extends({}, paperProps, {
           children: children
         }))
       }))
@@ -36368,11 +36218,34 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     open: PropTypes.bool.isRequired,
     /**
      * Props applied to the [`Paper`](/material-ui/api/paper/) element.
+     *
+     * This prop is an alias for `slotProps.paper` and will be overriden by it if both are used.
+     * @deprecated Use `slotProps.paper` instead.
+     *
      * @default {}
      */
     PaperProps: PropTypes /* @typescript-to-proptypes-ignore */.shape({
       component: elementTypeAcceptingRef$1
     }),
+    /**
+     * The extra props for the slot components.
+     * You can override the existing props or add new ones.
+     *
+     * @default {}
+     */
+    slotProps: PropTypes.shape({
+      paper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+      root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+    }),
+    /**
+     * The components used for each slot inside.
+     *
+     * @default {}
+     */
+    slots: PropTypes.shape({
+      paper: PropTypes.elementType,
+      root: PropTypes.elementType
+    }),
     /**
      * The system prop that allows defining system overrides as well as additional CSS styles.
      */
@@ -36450,7 +36323,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
     slot: 'Root',
     overridesResolver: (props, styles) => styles.root
   })({});
-  const MenuPaper = styled$1(Paper$1, {
+  const MenuPaper = styled$1(PopoverPaper, {
     name: 'MuiMenu',
     slot: 'Paper',
     overridesResolver: (props, styles) => styles.paper
@@ -36557,13 +36430,16 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         horizontal: isRtl ? 'right' : 'left'
       },
       transformOrigin: isRtl ? RTL_ORIGIN : LTR_ORIGIN,
-      PaperProps: _extends({
-        as: MenuPaper
-      }, PaperProps, {
-        classes: _extends({}, PaperProps.classes, {
-          root: classes.paper
+      slots: {
+        paper: MenuPaper
+      },
+      slotProps: {
+        paper: _extends({}, PaperProps, {
+          classes: _extends({}, PaperProps.classes, {
+            root: classes.paper
+          })
         })
-      }),
+      },
       className: classes.root,
       open: open,
       ref: ref,
@@ -37037,6 +36913,14 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
       position,
       variant
     });
+    let value;
+    if (variant === 'progress') {
+      if (steps === 1) {
+        value = 100;
+      } else {
+        value = Math.ceil(activeStep / (steps - 1) * 100);
+      }
+    }
     const classes = useUtilityClasses$G(ownerState);
     return /*#__PURE__*/jsxRuntime_2(MobileStepperRoot, _extends({
       square: true,
@@ -37059,7 +36943,7 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
         ownerState: ownerState,
         className: classes.progress,
         variant: "determinate",
-        value: Math.ceil(activeStep / (steps - 1) * 100)
+        value: value
       }, LinearProgressProps)), nextButton]
     }));
   });
@@ -49974,6 +49858,8 @@ See https://mui.com/r/migration-v4/#mui-material-styles for more details.` );
   exports.PaginationItem = PaginationItem$1;
   exports.Paper = Paper$1;
   exports.Popover = Popover$1;
+  exports.PopoverPaper = PopoverPaper;
+  exports.PopoverRoot = PopoverRoot;
   exports.Popper = Popper$1;
   exports.Portal = Portal$1;
   exports.Radio = Radio$1;