@mui/material 5.15.14 → 5.15.16

package/umd/material-ui.development.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.14
+ * @mui/material v5.15.16
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -7663,7 +7663,7 @@
   }
   function private_safeEmphasize(color, coefficient, warning) {
     try {
-      return private_safeEmphasize(color, coefficient);
+      return emphasize(color, coefficient);
     } catch (error) {
       if (warning && "development" !== 'production') {
         console.warn(warning);
@@ -9488,7 +9488,7 @@
       defaultTheme: defaultTheme$6
     });
   };
-  var useUtilityClasses$1P = function useUtilityClasses(ownerState, componentName) {
+  var useUtilityClasses$1Q = function useUtilityClasses(ownerState, componentName) {
     var getContainerUtilityClass = function getContainerUtilityClass(slot) {
       return generateUtilityClass$1(componentName, slot);
     };
@@ -9573,7 +9573,7 @@
       });
 
       // @ts-ignore module augmentation fails if custom breakpoints are used
-      var classes = useUtilityClasses$1P(ownerState, componentName);
+      var classes = useUtilityClasses$1Q(ownerState, componentName);
       return (
         /*#__PURE__*/
         // @ts-ignore theme is injected by the styled util
@@ -11535,7 +11535,7 @@
   var svgIconClasses = generateUtilityClasses$1('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
   var svgIconClasses$1 = svgIconClasses;
 
-  var useUtilityClasses$1O = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1P = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       fontSize = ownerState.fontSize,
       classes = ownerState.classes;
@@ -11615,7 +11615,7 @@
     if (!inheritViewBox) {
       more.viewBox = viewBox;
     }
-    var classes = useUtilityClasses$1O(ownerState);
+    var classes = useUtilityClasses$1P(ownerState);
     return /*#__PURE__*/jsxRuntime_2(SvgIconRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
@@ -12753,7 +12753,7 @@
   var collapseClasses = generateUtilityClasses$1('MuiCollapse', ['root', 'horizontal', 'vertical', 'entered', 'hidden', 'wrapper', 'wrapperInner']);
   var collapseClasses$1 = collapseClasses;
 
-  var useUtilityClasses$1N = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1O = function useUtilityClasses(ownerState) {
     var orientation = ownerState.orientation,
       classes = ownerState.classes;
     var slots = {
@@ -12861,7 +12861,7 @@
       orientation: orientation,
       collapsedSize: collapsedSizeProp
     });
-    var classes = useUtilityClasses$1N(ownerState);
+    var classes = useUtilityClasses$1O(ownerState);
     var theme = useTheme();
     var timer = useTimeout();
     var wrapperRef = React__namespace.useRef(null);
@@ -13123,7 +13123,7 @@
   var paperClasses = generateUtilityClasses$1('MuiPaper', ['root', 'rounded', 'outlined', 'elevation', 'elevation0', 'elevation1', 'elevation2', 'elevation3', 'elevation4', 'elevation5', 'elevation6', 'elevation7', 'elevation8', 'elevation9', 'elevation10', 'elevation11', 'elevation12', 'elevation13', 'elevation14', 'elevation15', 'elevation16', 'elevation17', 'elevation18', 'elevation19', 'elevation20', 'elevation21', 'elevation22', 'elevation23', 'elevation24']);
   var paperClasses$1 = paperClasses;
 
-  var useUtilityClasses$1M = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1N = function useUtilityClasses(ownerState) {
     var square = ownerState.square,
       elevation = ownerState.elevation,
       variant = ownerState.variant,
@@ -13181,7 +13181,7 @@
       square: square,
       variant: variant
     });
-    var classes = useUtilityClasses$1M(ownerState);
+    var classes = useUtilityClasses$1N(ownerState);
     {
       // eslint-disable-next-line react-hooks/rules-of-hooks
       var theme = useTheme();
@@ -13539,7 +13539,7 @@
   var accordionClasses$1 = accordionClasses;
 
   var useThemeProps$a = createUseThemeProps();
-  var useUtilityClasses$1L = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1M = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       square = ownerState.square,
       expanded = ownerState.expanded,
@@ -13692,7 +13692,7 @@
       disableGutters: disableGutters,
       expanded: expanded
     });
-    var classes = useUtilityClasses$1L(ownerState);
+    var classes = useUtilityClasses$1M(ownerState);
     var backwardCompatibleSlots = _extends({
       transition: TransitionComponentProp
     }, slots);
@@ -13831,7 +13831,7 @@
   var accordionActionsClasses$1 = accordionActionsClasses;
 
   var useThemeProps$9 = createUseThemeProps();
-  var useUtilityClasses$1K = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1L = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disableSpacing = ownerState.disableSpacing;
     var slots = {
@@ -13874,7 +13874,7 @@
     var ownerState = _extends({}, props, {
       disableSpacing: disableSpacing
     });
-    var classes = useUtilityClasses$1K(ownerState);
+    var classes = useUtilityClasses$1L(ownerState);
     return /*#__PURE__*/jsxRuntime_1(AccordionActionsRoot, _extends({
       className: clsx(classes.root, className),
       ref: ref,
@@ -13917,7 +13917,7 @@
   var accordionDetailsClasses$1 = accordionDetailsClasses;
 
   var useThemeProps$8 = createUseThemeProps();
-  var useUtilityClasses$1J = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1K = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -13944,7 +13944,7 @@
     var className = props.className,
       other = _objectWithoutProperties(props, ["className"]);
     var ownerState = props;
-    var classes = useUtilityClasses$1J(ownerState);
+    var classes = useUtilityClasses$1K(ownerState);
     return /*#__PURE__*/jsxRuntime_1(AccordionDetailsRoot, _extends({
       className: clsx(classes.root, className),
       ref: ref,
@@ -14329,7 +14329,7 @@
   var buttonBaseClasses = generateUtilityClasses$1('MuiButtonBase', ['root', 'disabled', 'focusVisible']);
   var buttonBaseClasses$1 = buttonBaseClasses;
 
-  var useUtilityClasses$1I = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1J = function useUtilityClasses(ownerState) {
     var disabled = ownerState.disabled,
       focusVisible = ownerState.focusVisible,
       focusVisibleClassName = ownerState.focusVisibleClassName,
@@ -14607,7 +14607,7 @@
       tabIndex: tabIndex,
       focusVisible: focusVisible
     });
-    var classes = useUtilityClasses$1I(ownerState);
+    var classes = useUtilityClasses$1J(ownerState);
     return /*#__PURE__*/jsxRuntime_2(ButtonBaseRoot, _extends({
       as: ComponentProp,
       className: clsx(classes.root, className),
@@ -14805,7 +14805,7 @@
   var accordionSummaryClasses$1 = accordionSummaryClasses;
 
   var useThemeProps$7 = createUseThemeProps();
-  var useUtilityClasses$1H = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1I = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       expanded = ownerState.expanded,
       disabled = ownerState.disabled,
@@ -14924,7 +14924,7 @@
       disabled: disabled,
       disableGutters: disableGutters
     });
-    var classes = useUtilityClasses$1H(ownerState);
+    var classes = useUtilityClasses$1I(ownerState);
     return /*#__PURE__*/jsxRuntime_2(AccordionSummaryRoot, _extends({
       focusRipple: false,
       disableRipple: true,
@@ -15001,7 +15001,7 @@
   var iconButtonClasses = generateUtilityClasses$1('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
   var iconButtonClasses$1 = iconButtonClasses;
 
-  var useUtilityClasses$1G = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1H = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disabled = ownerState.disabled,
       color = ownerState.color,
@@ -15106,7 +15106,7 @@
       disableFocusRipple: disableFocusRipple,
       size: size
     });
-    var classes = useUtilityClasses$1G(ownerState);
+    var classes = useUtilityClasses$1H(ownerState);
     return /*#__PURE__*/jsxRuntime_1(IconButtonRoot, _extends({
       className: clsx(classes.root, className),
       centerRipple: true,
@@ -15210,7 +15210,7 @@
   }), 'Close');
 
   var useThemeProps$6 = createUseThemeProps();
-  var useUtilityClasses$1F = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1G = function useUtilityClasses(ownerState) {
     var variant = ownerState.variant,
       color = ownerState.color,
       severity = ownerState.severity,
@@ -15392,7 +15392,7 @@
       variant: variant,
       colorSeverity: color || severity
     });
-    var classes = useUtilityClasses$1F(ownerState);
+    var classes = useUtilityClasses$1G(ownerState);
     var externalForwardedProps = {
       slots: _extends({
         closeButton: components.CloseButton,
@@ -15577,7 +15577,7 @@
   var typographyClasses = generateUtilityClasses$1('MuiTypography', ['root', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'inherit', 'button', 'caption', 'overline', 'alignLeft', 'alignRight', 'alignCenter', 'alignJustify', 'noWrap', 'gutterBottom', 'paragraph']);
   var typographyClasses$1 = typographyClasses;
 
-  var useUtilityClasses$1E = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1F = function useUtilityClasses(ownerState) {
     var align = ownerState.align,
       gutterBottom = ownerState.gutterBottom,
       noWrap = ownerState.noWrap,
@@ -15677,7 +15677,7 @@
       variantMapping: variantMapping
     });
     var Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
-    var classes = useUtilityClasses$1E(ownerState);
+    var classes = useUtilityClasses$1F(ownerState);
     return /*#__PURE__*/jsxRuntime_1(TypographyRoot, _extends({
       as: Component,
       ref: ref,
@@ -15769,7 +15769,7 @@
   var alertTitleClasses$1 = alertTitleClasses;
 
   var useThemeProps$5 = createUseThemeProps();
-  var useUtilityClasses$1D = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1E = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -15797,7 +15797,7 @@
     var className = props.className,
       other = _objectWithoutProperties(props, ["className"]);
     var ownerState = props;
-    var classes = useUtilityClasses$1D(ownerState);
+    var classes = useUtilityClasses$1E(ownerState);
     return /*#__PURE__*/jsxRuntime_1(AlertTitleRoot, _extends({
       gutterBottom: true,
       component: "div",
@@ -15836,7 +15836,7 @@
   var appBarClasses = generateUtilityClasses$1('MuiAppBar', ['root', 'positionFixed', 'positionAbsolute', 'positionSticky', 'positionStatic', 'positionRelative', 'colorDefault', 'colorPrimary', 'colorSecondary', 'colorInherit', 'colorTransparent', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning']);
   var appBarClasses$1 = appBarClasses;
 
-  var useUtilityClasses$1C = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1D = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       position = ownerState.position,
       classes = ownerState.classes;
@@ -15945,7 +15945,7 @@
       position: position,
       enableColorOnDark: enableColorOnDark
     });
-    var classes = useUtilityClasses$1C(ownerState);
+    var classes = useUtilityClasses$1D(ownerState);
     return /*#__PURE__*/jsxRuntime_1(AppBarRoot, _extends({
       square: true,
       component: "header",
@@ -18976,7 +18976,7 @@
   function isVirtualElement(element) {
     return !isHTMLElement(element);
   }
-  var useUtilityClasses$1B = function useUtilityClasses() {
+  var useUtilityClasses$1C = function useUtilityClasses() {
     var slots = {
       root: ['root']
     };
@@ -19090,7 +19090,7 @@
     if (TransitionProps !== null) {
       childProps.TransitionProps = TransitionProps;
     }
-    var classes = useUtilityClasses$1B();
+    var classes = useUtilityClasses$1C();
     var Root = (_slots$root = slots.root) != null ? _slots$root : 'div';
     var rootProps = useSlotProps({
       elementType: Root,
@@ -20196,6 +20196,7 @@
       isControlled = _React$useRef.current;
     var inputRef = React__namespace.useRef(null);
     var handleRef = useForkRef(forwardedRef, inputRef);
+    var heightRef = React__namespace.useRef(null);
     var shadowRef = React__namespace.useRef(null);
     var calculateTextareaStyles = React__namespace.useCallback(function () {
       var input = inputRef.current;
@@ -20252,8 +20253,12 @@
       if (isEmpty$1(textareaStyles)) {
         return;
       }
+      var outerHeightStyle = textareaStyles.outerHeightStyle;
       var input = inputRef.current;
-      input.style.height = "".concat(textareaStyles.outerHeightStyle, "px");
+      if (heightRef.current !== outerHeightStyle) {
+        heightRef.current = outerHeightStyle;
+        input.style.height = "".concat(outerHeightStyle, "px");
+      }
       input.style.overflow = textareaStyles.overflowing ? 'hidden' : '';
     }, [calculateTextareaStyles]);
     useEnhancedEffect$1(function () {
@@ -21624,7 +21629,7 @@
   var listSubheaderClasses = generateUtilityClasses$1('MuiListSubheader', ['root', 'colorPrimary', 'colorInherit', 'gutters', 'inset', 'sticky']);
   var listSubheaderClasses$1 = listSubheaderClasses;
 
-  var useUtilityClasses$1A = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1B = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       disableGutters = ownerState.disableGutters,
@@ -21693,7 +21698,7 @@
       disableSticky: disableSticky,
       inset: inset
     });
-    var classes = useUtilityClasses$1A(ownerState);
+    var classes = useUtilityClasses$1B(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ListSubheaderRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
@@ -21761,7 +21766,7 @@
   var chipClasses = generateUtilityClasses$1('MuiChip', ['root', 'sizeSmall', 'sizeMedium', 'colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning', 'disabled', 'clickable', 'clickableColorPrimary', 'clickableColorSecondary', 'deletable', 'deletableColorPrimary', 'deletableColorSecondary', 'outlined', 'filled', 'outlinedPrimary', 'outlinedSecondary', 'filledPrimary', 'filledSecondary', 'avatar', 'avatarSmall', 'avatarMedium', 'avatarColorPrimary', 'avatarColorSecondary', 'icon', 'iconSmall', 'iconMedium', 'iconColorPrimary', 'iconColorSecondary', 'label', 'labelSmall', 'labelMedium', 'deleteIcon', 'deleteIconSmall', 'deleteIconMedium', 'deleteIconColorPrimary', 'deleteIconColorSecondary', 'deleteIconOutlinedColorPrimary', 'deleteIconOutlinedColorSecondary', 'deleteIconFilledColorPrimary', 'deleteIconFilledColorSecondary', 'focusVisible']);
   var chipClasses$1 = chipClasses;
 
-  var useUtilityClasses$1z = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1A = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disabled = ownerState.disabled,
       size = ownerState.size,
@@ -22041,7 +22046,7 @@
       clickable: clickable,
       variant: variant
     });
-    var classes = useUtilityClasses$1z(ownerState);
+    var classes = useUtilityClasses$1A(ownerState);
     var moreProps = component === ButtonBase$1 ? _extends({
       component: ComponentProp || 'div',
       focusVisibleClassName: classes.focusVisible
@@ -22288,7 +22293,7 @@
     var ownerState = props.ownerState;
     return [styles.input, ownerState.size === 'small' && styles.inputSizeSmall, ownerState.multiline && styles.inputMultiline, ownerState.type === 'search' && styles.inputTypeSearch, ownerState.startAdornment && styles.inputAdornedStart, ownerState.endAdornment && styles.inputAdornedEnd, ownerState.hiddenLabel && styles.inputHiddenLabel];
   };
-  var useUtilityClasses$1y = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1z = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       disabled = ownerState.disabled,
@@ -22686,7 +22691,7 @@
       startAdornment: startAdornment,
       type: type
     });
-    var classes = useUtilityClasses$1y(ownerState);
+    var classes = useUtilityClasses$1z(ownerState);
     var Root = slots.root || components.Root || InputBaseRoot;
     var rootProps = slotProps.root || componentsProps.root || {};
     var Input = slots.input || components.Input || InputBaseComponent;
@@ -22998,7 +23003,7 @@
 
   var _styled, _ClearIcon, _ArrowDropDownIcon;
   var useThemeProps$4 = createUseThemeProps();
-  var useUtilityClasses$1x = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1y = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disablePortal = ownerState.disablePortal,
       expanded = ownerState.expanded,
@@ -23469,7 +23474,7 @@
       popupOpen: popupOpen,
       size: size
     });
-    var classes = useUtilityClasses$1x(ownerState);
+    var classes = useUtilityClasses$1y(ownerState);
     var startAdornment;
     if (multiple && value.length > 0) {
       var getCustomizedTagProps = function getCustomizedTagProps(params) {
@@ -23563,7 +23568,7 @@
       }));
     };
     var autocompletePopper = null;
-    if (!loading && groupedOptions.length > 0) {
+    if (groupedOptions.length > 0) {
       autocompletePopper = renderAutocompletePopperChildren( /*#__PURE__*/jsxRuntime_1(AutocompleteListbox, _extends({
         as: ListboxComponent,
         className: classes.listbox,
@@ -24093,7 +24098,7 @@
   var avatarClasses$1 = avatarClasses;
 
   var useThemeProps$3 = createUseThemeProps();
-  var useUtilityClasses$1w = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1x = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant,
       colorDefault = ownerState.colorDefault;
@@ -24258,7 +24263,7 @@
       component: component,
       variant: variant
     });
-    var classes = useUtilityClasses$1w(ownerState);
+    var classes = useUtilityClasses$1x(ownerState);
     var _useSlot = useSlot('img', {
         className: classes.img,
         elementType: AvatarImg,
@@ -24385,7 +24390,7 @@
     small: -16,
     medium: null
   };
-  var useUtilityClasses$1v = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1w = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -24442,7 +24447,7 @@
       component: component,
       variant: variant
     });
-    var classes = useUtilityClasses$1v(ownerState);
+    var classes = useUtilityClasses$1w(ownerState);
     var children = React__namespace.Children.toArray(childrenProp).filter(function (child) {
       {
         if (reactIs_2(child)) {
@@ -24762,7 +24767,7 @@
   var backdropClasses = generateUtilityClasses$1('MuiBackdrop', ['root', 'invisible']);
   var backdropClasses$1 = backdropClasses;
 
-  var useUtilityClasses$1u = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1v = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       invisible = ownerState.invisible;
     var slots = {
@@ -24823,7 +24828,7 @@
       component: component,
       invisible: invisible
     });
-    var classes = useUtilityClasses$1u(ownerState);
+    var classes = useUtilityClasses$1v(ownerState);
     var rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
     return /*#__PURE__*/jsxRuntime_1(TransitionComponent, _extends({
       "in": open,
@@ -24950,7 +24955,7 @@
   var RADIUS_STANDARD = 10;
   var RADIUS_DOT = 4;
   var useThemeProps$2 = createUseThemeProps();
-  var useUtilityClasses$1t = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1u = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       anchorOrigin = ownerState.anchorOrigin,
       invisible = ownerState.invisible,
@@ -25224,7 +25229,7 @@
       overlap: overlap,
       variant: variant
     });
-    var classes = useUtilityClasses$1t(ownerState);
+    var classes = useUtilityClasses$1u(ownerState);
 
     // support both `slots` and `components` for backward compatibility
     var RootSlot = (_ref11 = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref11 : BadgeRoot;
@@ -25378,7 +25383,7 @@
   var bottomNavigationClasses = generateUtilityClasses$1('MuiBottomNavigation', ['root']);
   var bottomNavigationClasses$1 = bottomNavigationClasses;
 
-  var useUtilityClasses$1s = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1t = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -25418,7 +25423,7 @@
       component: component,
       showLabels: showLabels
     });
-    var classes = useUtilityClasses$1s(ownerState);
+    var classes = useUtilityClasses$1t(ownerState);
     return /*#__PURE__*/jsxRuntime_1(BottomNavigationRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
@@ -25496,7 +25501,7 @@
   var bottomNavigationActionClasses = generateUtilityClasses$1('MuiBottomNavigationAction', ['root', 'iconOnly', 'selected', 'label']);
   var bottomNavigationActionClasses$1 = bottomNavigationActionClasses;
 
-  var useUtilityClasses$1r = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1s = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       showLabel = ownerState.showLabel,
       selected = ownerState.selected;
@@ -25571,7 +25576,7 @@
       var value = props.value,
       other = _objectWithoutProperties(props, ["className", "icon", "label", "onChange", "onClick", "selected", "showLabel", "value"]);
     var ownerState = props;
-    var classes = useUtilityClasses$1r(ownerState);
+    var classes = useUtilityClasses$1s(ownerState);
     var handleChange = function handleChange(event) {
       if (onChange) {
         onChange(event, value);
@@ -25765,7 +25770,7 @@
   var breadcrumbsClasses = generateUtilityClasses$1('MuiBreadcrumbs', ['root', 'ol', 'li', 'separator']);
   var breadcrumbsClasses$1 = breadcrumbsClasses;
 
-  var useUtilityClasses$1q = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1r = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -25859,7 +25864,7 @@
       maxItems: maxItems,
       separator: separator
     });
-    var classes = useUtilityClasses$1q(ownerState);
+    var classes = useUtilityClasses$1r(ownerState);
     var collapsedIconSlotProps = useSlotProps({
       elementType: slots.CollapsedIcon,
       externalSlotProps: slotProps.collapsedIcon,
@@ -26024,7 +26029,7 @@
   }
   var ButtonGroupButtonContext$1 = ButtonGroupButtonContext;
 
-  var useUtilityClasses$1p = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1q = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       disableElevation = ownerState.disableElevation,
       fullWidth = ownerState.fullWidth,
@@ -26261,7 +26266,7 @@
       type: type,
       variant: variant
     });
-    var classes = useUtilityClasses$1p(ownerState);
+    var classes = useUtilityClasses$1q(ownerState);
     var startIcon = startIconProp && /*#__PURE__*/jsxRuntime_1(ButtonStartIcon, {
       className: classes.startIcon,
       ownerState: ownerState,
@@ -26393,7 +26398,7 @@
     var ownerState = props.ownerState;
     return [_defineProperty({}, "& .".concat(buttonGroupClasses$1.grouped), styles.grouped), _defineProperty({}, "& .".concat(buttonGroupClasses$1.grouped), styles["grouped".concat(capitalize(ownerState.orientation))]), _defineProperty({}, "& .".concat(buttonGroupClasses$1.grouped), styles["grouped".concat(capitalize(ownerState.variant))]), _defineProperty({}, "& .".concat(buttonGroupClasses$1.grouped), styles["grouped".concat(capitalize(ownerState.variant)).concat(capitalize(ownerState.orientation))]), _defineProperty({}, "& .".concat(buttonGroupClasses$1.grouped), styles["grouped".concat(capitalize(ownerState.variant)).concat(capitalize(ownerState.color))]), _defineProperty({}, "& .".concat(buttonGroupClasses$1.firstButton), styles.firstButton), _defineProperty({}, "& .".concat(buttonGroupClasses$1.lastButton), styles.lastButton), _defineProperty({}, "& .".concat(buttonGroupClasses$1.middleButton), styles.middleButton), styles.root, styles[ownerState.variant], ownerState.disableElevation === true && styles.disableElevation, ownerState.fullWidth && styles.fullWidth, ownerState.orientation === 'vertical' && styles.vertical];
   };
-  var useUtilityClasses$1o = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1p = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       disabled = ownerState.disabled,
@@ -26523,7 +26528,7 @@
       size: size,
       variant: variant
     });
-    var classes = useUtilityClasses$1o(ownerState);
+    var classes = useUtilityClasses$1p(ownerState);
     var context = React__namespace.useMemo(function () {
       return {
         className: classes.grouped,
@@ -26654,7 +26659,7 @@
   var cardClasses = generateUtilityClasses$1('MuiCard', ['root']);
   var cardClasses$1 = cardClasses;
 
-  var useUtilityClasses$1n = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1o = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -26684,7 +26689,7 @@
     var ownerState = _extends({}, props, {
       raised: raised
     });
-    var classes = useUtilityClasses$1n(ownerState);
+    var classes = useUtilityClasses$1o(ownerState);
     return /*#__PURE__*/jsxRuntime_1(CardRoot, _extends({
       className: clsx(classes.root, className),
       elevation: raised ? 8 : undefined,
@@ -26732,7 +26737,7 @@
   var cardActionAreaClasses = generateUtilityClasses$1('MuiCardActionArea', ['root', 'focusVisible', 'focusHighlight']);
   var cardActionAreaClasses$1 = cardActionAreaClasses;
 
-  var useUtilityClasses$1m = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1n = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -26797,7 +26802,7 @@
       focusVisibleClassName = props.focusVisibleClassName,
       other = _objectWithoutProperties(props, ["children", "className", "focusVisibleClassName"]);
     var ownerState = props;
-    var classes = useUtilityClasses$1m(ownerState);
+    var classes = useUtilityClasses$1n(ownerState);
     return /*#__PURE__*/jsxRuntime_2(CardActionAreaRoot, _extends({
       className: clsx(classes.root, className),
       focusVisibleClassName: clsx(focusVisibleClassName, classes.focusVisible),
@@ -26844,7 +26849,7 @@
   var cardActionsClasses = generateUtilityClasses$1('MuiCardActions', ['root', 'spacing']);
   var cardActionsClasses$1 = cardActionsClasses;
 
-  var useUtilityClasses$1l = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1m = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disableSpacing = ownerState.disableSpacing;
     var slots = {
@@ -26883,7 +26888,7 @@
     var ownerState = _extends({}, props, {
       disableSpacing: disableSpacing
     });
-    var classes = useUtilityClasses$1l(ownerState);
+    var classes = useUtilityClasses$1m(ownerState);
     return /*#__PURE__*/jsxRuntime_1(CardActionsRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -26925,7 +26930,7 @@
   var cardContentClasses = generateUtilityClasses$1('MuiCardContent', ['root']);
   var cardContentClasses$1 = cardContentClasses;
 
-  var useUtilityClasses$1k = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1l = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -26958,7 +26963,7 @@
     var ownerState = _extends({}, props, {
       component: component
     });
-    var classes = useUtilityClasses$1k(ownerState);
+    var classes = useUtilityClasses$1l(ownerState);
     return /*#__PURE__*/jsxRuntime_1(CardContentRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
@@ -27001,7 +27006,7 @@
   var cardHeaderClasses = generateUtilityClasses$1('MuiCardHeader', ['root', 'avatar', 'action', 'content', 'title', 'subheader']);
   var cardHeaderClasses$1 = cardHeaderClasses;
 
-  var useUtilityClasses$1j = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1k = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -27078,7 +27083,7 @@
       component: component,
       disableTypography: disableTypography
     });
-    var classes = useUtilityClasses$1j(ownerState);
+    var classes = useUtilityClasses$1k(ownerState);
     var title = titleProp;
     if (title != null && title.type !== Typography$1 && !disableTypography) {
       title = /*#__PURE__*/jsxRuntime_1(Typography$1, _extends({
@@ -27192,7 +27197,7 @@
   var cardMediaClasses = generateUtilityClasses$1('MuiCardMedia', ['root', 'media', 'img']);
   var cardMediaClasses$1 = cardMediaClasses;
 
-  var useUtilityClasses$1i = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1j = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       isMediaComponent = ownerState.isMediaComponent,
       isImageComponent = ownerState.isImageComponent;
@@ -27248,7 +27253,7 @@
       isMediaComponent: isMediaComponent,
       isImageComponent: IMAGE_COMPONENTS.indexOf(component) !== -1
     });
-    var classes = useUtilityClasses$1i(ownerState);
+    var classes = useUtilityClasses$1j(ownerState);
     return /*#__PURE__*/jsxRuntime_1(CardMediaRoot, _extends({
       className: clsx(classes.root, className),
       as: component,
@@ -27316,7 +27321,7 @@
   }
   generateUtilityClasses$1('PrivateSwitchBase', ['root', 'checked', 'disabled', 'input', 'edgeStart', 'edgeEnd']);
 
-  var useUtilityClasses$1h = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1i = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       checked = ownerState.checked,
       disabled = ownerState.disabled,
@@ -27433,7 +27438,7 @@
       disableFocusRipple: disableFocusRipple,
       edge: edge
     });
-    var classes = useUtilityClasses$1h(ownerState);
+    var classes = useUtilityClasses$1i(ownerState);
     return /*#__PURE__*/jsxRuntime_2(SwitchBaseRoot, _extends({
       component: "span",
       className: clsx(classes.root, className),
@@ -27593,7 +27598,7 @@
   var checkboxClasses = generateUtilityClasses$1('MuiCheckbox', ['root', 'checked', 'disabled', 'indeterminate', 'colorPrimary', 'colorSecondary', 'sizeSmall', 'sizeMedium']);
   var checkboxClasses$1 = checkboxClasses;
 
-  var useUtilityClasses$1g = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1h = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       indeterminate = ownerState.indeterminate,
       color = ownerState.color,
@@ -27664,7 +27669,7 @@
       indeterminate: indeterminate,
       size: size
     });
-    var classes = useUtilityClasses$1g(ownerState);
+    var classes = useUtilityClasses$1h(ownerState);
     return /*#__PURE__*/jsxRuntime_1(CheckboxRoot, _extends({
       type: "checkbox",
       inputProps: _extends({
@@ -27796,7 +27801,7 @@
   var SIZE = 44;
   var circularRotateKeyframe = keyframes(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n"])));
   var circularDashKeyframe = keyframes(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n  0% {\n    stroke-dasharray: 1px, 200px;\n    stroke-dashoffset: 0;\n  }\n\n  50% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -15px;\n  }\n\n  100% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -125px;\n  }\n"])));
-  var useUtilityClasses$1f = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1g = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant,
       color = ownerState.color,
@@ -27897,7 +27902,7 @@
       value: value,
       variant: variant
     });
-    var classes = useUtilityClasses$1f(ownerState);
+    var classes = useUtilityClasses$1g(ownerState);
     var circleStyle = {};
     var rootStyle = {};
     var rootProps = {};
@@ -28207,7 +28212,7 @@
   var modalClasses = generateUtilityClasses$1('MuiModal', ['root', 'hidden', 'backdrop']);
   var modalClasses$1 = modalClasses;
 
-  var useUtilityClasses$1e = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1f = function useUtilityClasses(ownerState) {
     var open = ownerState.open,
       exited = ownerState.exited,
       classes = ownerState.classes;
@@ -28330,7 +28335,7 @@
     var ownerState = _extends({}, propsWithDefaults, {
       exited: exited
     });
-    var classes = useUtilityClasses$1e(ownerState);
+    var classes = useUtilityClasses$1f(ownerState);
     var childProps = {};
     if (children.props.tabIndex === undefined) {
       childProps.tabIndex = '-1';
@@ -28603,7 +28608,7 @@
     // Improve scrollable dialog support.
     zIndex: -1
   });
-  var useUtilityClasses$1d = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1e = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       scroll = ownerState.scroll,
       maxWidth = ownerState.maxWidth,
@@ -28741,6 +28746,7 @@
       _props$maxWidth = props.maxWidth,
       maxWidth = _props$maxWidth === void 0 ? 'sm' : _props$maxWidth,
       onBackdropClick = props.onBackdropClick,
+      onClick = props.onClick,
       onClose = props.onClose,
       open = props.open,
       _props$PaperComponent = props.PaperComponent,
@@ -28754,7 +28760,7 @@
       _props$transitionDura = props.transitionDuration,
       transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura,
       TransitionProps = props.TransitionProps,
-      other = _objectWithoutProperties(props, ["aria-describedby", "aria-labelledby", "BackdropComponent", "BackdropProps", "children", "className", "disableEscapeKeyDown", "fullScreen", "fullWidth", "maxWidth", "onBackdropClick", "onClose", "open", "PaperComponent", "PaperProps", "scroll", "TransitionComponent", "transitionDuration", "TransitionProps"]);
+      other = _objectWithoutProperties(props, ["aria-describedby", "aria-labelledby", "BackdropComponent", "BackdropProps", "children", "className", "disableEscapeKeyDown", "fullScreen", "fullWidth", "maxWidth", "onBackdropClick", "onClick", "onClose", "open", "PaperComponent", "PaperProps", "scroll", "TransitionComponent", "transitionDuration", "TransitionProps"]);
     var ownerState = _extends({}, props, {
       disableEscapeKeyDown: disableEscapeKeyDown,
       fullScreen: fullScreen,
@@ -28762,7 +28768,7 @@
       maxWidth: maxWidth,
       scroll: scroll
     });
-    var classes = useUtilityClasses$1d(ownerState);
+    var classes = useUtilityClasses$1e(ownerState);
     var backdropClick = React__namespace.useRef();
     var handleMouseDown = function handleMouseDown(event) {
       // We don't want to close the dialog when clicking the dialog content.
@@ -28770,6 +28776,10 @@
       backdropClick.current = event.target === event.currentTarget;
     };
     var handleBackdropClick = function handleBackdropClick(event) {
+      if (onClick) {
+        onClick(event);
+      }
+
       // Ignore the events not coming from the "backdrop".
       if (!backdropClick.current) {
         return;
@@ -28908,6 +28918,10 @@
      * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.
      */
     onBackdropClick: PropTypes.func,
+    /**
+     * @ignore
+     */
+    onClick: PropTypes.func,
     /**
      * Callback fired when the component requests to be closed.
      *
@@ -28971,7 +28985,7 @@
   var dialogActionsClasses = generateUtilityClasses$1('MuiDialogActions', ['root', 'spacing']);
   var dialogActionsClasses$1 = dialogActionsClasses;
 
-  var useUtilityClasses$1c = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1d = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disableSpacing = ownerState.disableSpacing;
     var slots = {
@@ -29012,7 +29026,7 @@
     var ownerState = _extends({}, props, {
       disableSpacing: disableSpacing
     });
-    var classes = useUtilityClasses$1c(ownerState);
+    var classes = useUtilityClasses$1d(ownerState);
     return /*#__PURE__*/jsxRuntime_1(DialogActionsRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -29060,7 +29074,7 @@
   var dialogTitleClasses = generateUtilityClasses$1('MuiDialogTitle', ['root']);
   var dialogTitleClasses$1 = dialogTitleClasses;
 
-  var useUtilityClasses$1b = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1c = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       dividers = ownerState.dividers;
     var slots = {
@@ -29104,7 +29118,7 @@
     var ownerState = _extends({}, props, {
       dividers: dividers
     });
-    var classes = useUtilityClasses$1b(ownerState);
+    var classes = useUtilityClasses$1c(ownerState);
     return /*#__PURE__*/jsxRuntime_1(DialogContentRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -29146,7 +29160,7 @@
   var dialogContentTextClasses = generateUtilityClasses$1('MuiDialogContentText', ['root']);
   var dialogContentTextClasses$1 = dialogContentTextClasses;
 
-  var useUtilityClasses$1a = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1b = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -29172,7 +29186,7 @@
     props.children;
       var className = props.className,
       ownerState = _objectWithoutProperties(props, ["children", "className"]);
-    var classes = useUtilityClasses$1a(ownerState);
+    var classes = useUtilityClasses$1b(ownerState);
     return /*#__PURE__*/jsxRuntime_1(DialogContentTextRoot, _extends({
       component: "p",
       variant: "body1",
@@ -29208,7 +29222,7 @@
   } ;
   var DialogContentText$1 = DialogContentText;
 
-  var useUtilityClasses$19 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$1a = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -29234,7 +29248,7 @@
       idProp = props.id,
       other = _objectWithoutProperties(props, ["className", "id"]);
     var ownerState = props;
-    var classes = useUtilityClasses$19(ownerState);
+    var classes = useUtilityClasses$1a(ownerState);
     var _React$useContext = React__namespace.useContext(DialogContext$1),
       _React$useContext$tit = _React$useContext.titleId,
       titleId = _React$useContext$tit === void 0 ? idProp : _React$useContext$tit;
@@ -29281,7 +29295,7 @@
   var dividerClasses = generateUtilityClasses$1('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
   var dividerClasses$1 = dividerClasses;
 
-  var useUtilityClasses$18 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$19 = function useUtilityClasses(ownerState) {
     var absolute = ownerState.absolute,
       children = ownerState.children,
       classes = ownerState.classes,
@@ -29439,7 +29453,7 @@
       textAlign: textAlign,
       variant: variant
     });
-    var classes = useUtilityClasses$18(ownerState);
+    var classes = useUtilityClasses$19(ownerState);
     return /*#__PURE__*/jsxRuntime_1(DividerRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
@@ -29850,7 +29864,7 @@
     var ownerState = props.ownerState;
     return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, styles.modal];
   };
-  var useUtilityClasses$17 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$18 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       anchor = ownerState.anchor,
       variant = ownerState.variant;
@@ -30005,7 +30019,7 @@
       open: open,
       variant: variant
     }, other);
-    var classes = useUtilityClasses$17(ownerState);
+    var classes = useUtilityClasses$18(ownerState);
     var drawer = /*#__PURE__*/jsxRuntime_1(DrawerPaper, _extends({
       elevation: variant === 'temporary' ? elevation : 0,
       square: true
@@ -30150,7 +30164,7 @@
   var fabClasses = generateUtilityClasses$1('MuiFab', ['root', 'primary', 'secondary', 'extended', 'circular', 'focusVisible', 'disabled', 'colorInherit', 'sizeSmall', 'sizeMedium', 'sizeLarge', 'info', 'error', 'warning', 'success']);
   var fabClasses$1 = fabClasses;
 
-  var useUtilityClasses$16 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$17 = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       variant = ownerState.variant,
       classes = ownerState.classes,
@@ -30281,7 +30295,7 @@
       size: size,
       variant: variant
     });
-    var classes = useUtilityClasses$16(ownerState);
+    var classes = useUtilityClasses$17(ownerState);
     return /*#__PURE__*/jsxRuntime_1(FabRoot, _extends({
       className: clsx(classes.root, className),
       component: component,
@@ -30365,7 +30379,7 @@
   } ;
   var Fab$1 = Fab;
 
-  var useUtilityClasses$15 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$16 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disableUnderline = ownerState.disableUnderline;
     var slots = {
@@ -30551,7 +30565,7 @@
       multiline: multiline,
       type: type
     });
-    var classes = useUtilityClasses$15(props);
+    var classes = useUtilityClasses$16(props);
     var filledInputComponentsProps = {
       root: {
         ownerState: ownerState
@@ -30780,7 +30794,7 @@
   var formControlClasses = generateUtilityClasses$1('MuiFormControl', ['root', 'marginNone', 'marginNormal', 'marginDense', 'fullWidth', 'disabled']);
   var formControlClasses$1 = formControlClasses;
 
-  var useUtilityClasses$14 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$15 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       margin = ownerState.margin,
       fullWidth = ownerState.fullWidth;
@@ -30884,7 +30898,7 @@
       size: size,
       variant: variant
     });
-    var classes = useUtilityClasses$14(ownerState);
+    var classes = useUtilityClasses$15(ownerState);
     var _React$useState = React__namespace.useState(function () {
         // We need to iterate through the children and find the Input in order
         // to fully support server-side rendering.
@@ -31136,7 +31150,7 @@
   var formControlLabelClasses = generateUtilityClasses$1('MuiFormControlLabel', ['root', 'labelPlacementStart', 'labelPlacementTop', 'labelPlacementBottom', 'disabled', 'label', 'error', 'required', 'asterisk']);
   var formControlLabelClasses$1 = formControlLabelClasses;
 
-  var useUtilityClasses$13 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$14 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disabled = ownerState.disabled,
       labelPlacement = ownerState.labelPlacement,
@@ -31249,7 +31263,7 @@
       required: required,
       error: fcs.error
     });
-    var classes = useUtilityClasses$13(ownerState);
+    var classes = useUtilityClasses$14(ownerState);
     var typographySlotProps = (_slotProps$typography = slotProps.typography) != null ? _slotProps$typography : componentsProps.typography;
     var label = labelProp;
     if (label != null && label.type !== Typography$1 && !disableTypography) {
@@ -31364,7 +31378,7 @@
   var formGroupClasses = generateUtilityClasses$1('MuiFormGroup', ['root', 'row', 'error']);
   var formGroupClasses$1 = formGroupClasses;
 
-  var useUtilityClasses$12 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$13 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       row = ownerState.row,
       error = ownerState.error;
@@ -31415,7 +31429,7 @@
       row: row,
       error: fcs.error
     });
-    var classes = useUtilityClasses$12(ownerState);
+    var classes = useUtilityClasses$13(ownerState);
     return /*#__PURE__*/jsxRuntime_1(FormGroupRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -31458,7 +31472,7 @@
   var formHelperTextClasses$1 = formHelperTextClasses;
 
   var _span$3;
-  var useUtilityClasses$11 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$12 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       contained = ownerState.contained,
       size = ownerState.size,
@@ -31535,7 +31549,7 @@
       focused: fcs.focused,
       required: fcs.required
     });
-    var classes = useUtilityClasses$11(ownerState);
+    var classes = useUtilityClasses$12(ownerState);
     return /*#__PURE__*/jsxRuntime_1(FormHelperTextRoot, _extends({
       as: component,
       ownerState: ownerState,
@@ -31615,7 +31629,7 @@
   var formLabelClasses = generateUtilityClasses$1('MuiFormLabel', ['root', 'colorSecondary', 'focused', 'disabled', 'error', 'filled', 'required', 'asterisk']);
   var formLabelClasses$1 = formLabelClasses;
 
-  var useUtilityClasses$10 = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$11 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       focused = ownerState.focused,
@@ -31696,7 +31710,7 @@
       focused: fcs.focused,
       required: fcs.required
     });
-    var classes = useUtilityClasses$10(ownerState);
+    var classes = useUtilityClasses$11(ownerState);
     return /*#__PURE__*/jsxRuntime_2(FormLabelRoot, _extends({
       as: component,
       ownerState: ownerState,
@@ -32094,7 +32108,7 @@
     });
     return classes;
   }
-  var useUtilityClasses$$ = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$10 = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       container = ownerState.container,
       direction = ownerState.direction,
@@ -32175,7 +32189,7 @@
     }, breakpointsValues, {
       breakpoints: breakpoints.keys
     });
-    var classes = useUtilityClasses$$(ownerState);
+    var classes = useUtilityClasses$10(ownerState);
     return /*#__PURE__*/jsxRuntime_1(GridContext$1.Provider, {
       value: columns,
       children: /*#__PURE__*/jsxRuntime_1(GridRoot, _extends({
@@ -32847,7 +32861,7 @@
   }
   generateUtilityClasses$1('PrivateHiddenCss', ['root', 'xlDown', 'xlUp', 'onlyXl', 'lgDown', 'lgUp', 'onlyLg', 'mdDown', 'mdUp', 'onlyMd', 'smDown', 'smUp', 'onlySm', 'xsDown', 'xsUp', 'onlyXs']);
 
-  var useUtilityClasses$_ = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$$ = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       breakpoints = ownerState.breakpoints;
     var slots = {
@@ -32933,7 +32947,7 @@
     var ownerState = _extends({}, props, {
       breakpoints: breakpoints
     });
-    var classes = useUtilityClasses$_(ownerState);
+    var classes = useUtilityClasses$$(ownerState);
     return /*#__PURE__*/jsxRuntime_1(HiddenCssRoot, {
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -33140,7 +33154,7 @@
   var iconClasses = generateUtilityClasses$1('MuiIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
   var iconClasses$1 = iconClasses;
 
-  var useUtilityClasses$Z = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$_ = function useUtilityClasses(ownerState) {
     var color = ownerState.color,
       fontSize = ownerState.fontSize,
       classes = ownerState.classes;
@@ -33212,7 +33226,7 @@
       component: Component,
       fontSize: fontSize
     });
-    var classes = useUtilityClasses$Z(ownerState);
+    var classes = useUtilityClasses$_(ownerState);
     return /*#__PURE__*/jsxRuntime_1(IconRoot, _extends({
       as: Component,
       className: clsx(baseClassName,
@@ -33288,7 +33302,7 @@
   }
   var ImageListContext$1 = ImageListContext;
 
-  var useUtilityClasses$Y = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$Z = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant;
     var slots = {
@@ -33363,7 +33377,7 @@
       rowHeight: rowHeight,
       variant: variant
     });
-    var classes = useUtilityClasses$Y(ownerState);
+    var classes = useUtilityClasses$Z(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ImageListRoot, _extends({
       as: component,
       className: clsx(classes.root, classes[variant], className),
@@ -33436,7 +33450,7 @@
   var imageListItemClasses = generateUtilityClasses$1('MuiImageListItem', ['root', 'img', 'standard', 'woven', 'masonry', 'quilted']);
   var imageListItemClasses$1 = imageListItemClasses;
 
-  var useUtilityClasses$X = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$Y = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant;
     var slots = {
@@ -33513,7 +33527,7 @@
       rows: rows,
       variant: variant
     });
-    var classes = useUtilityClasses$X(ownerState);
+    var classes = useUtilityClasses$Y(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ImageListItemRoot, _extends({
       as: component,
       className: clsx(classes.root, classes[variant], className),
@@ -33594,7 +33608,7 @@
   var imageListItemBarClasses = generateUtilityClasses$1('MuiImageListItemBar', ['root', 'positionBottom', 'positionTop', 'positionBelow', 'titleWrap', 'titleWrapBottom', 'titleWrapTop', 'titleWrapBelow', 'titleWrapActionPosLeft', 'titleWrapActionPosRight', 'title', 'subtitle', 'actionIcon', 'actionIconActionPosLeft', 'actionIconActionPosRight']);
   var imageListItemBarClasses$1 = imageListItemBarClasses;
 
-  var useUtilityClasses$W = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$X = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       position = ownerState.position,
       actionIcon = ownerState.actionIcon,
@@ -33723,7 +33737,7 @@
       position: position,
       actionPosition: actionPosition
     });
-    var classes = useUtilityClasses$W(ownerState);
+    var classes = useUtilityClasses$X(ownerState);
     return /*#__PURE__*/jsxRuntime_2(ImageListItemBarRoot, _extends({
       ownerState: ownerState,
       className: clsx(classes.root, className),
@@ -33793,7 +33807,7 @@
   } ;
   var ImageListItemBar$1 = ImageListItemBar;
 
-  var useUtilityClasses$V = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$W = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disableUnderline = ownerState.disableUnderline;
     var slots = {
@@ -33900,7 +33914,7 @@
       _props$type = props.type,
       type = _props$type === void 0 ? 'text' : _props$type,
       other = _objectWithoutProperties(props, ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"]);
-    var classes = useUtilityClasses$V(props);
+    var classes = useUtilityClasses$W(props);
     var ownerState = {
       disableUnderline: disableUnderline
     };
@@ -34127,7 +34141,7 @@
     var ownerState = props.ownerState;
     return [styles.root, styles["position".concat(capitalize(ownerState.position))], ownerState.disablePointerEvents === true && styles.disablePointerEvents, styles[ownerState.variant]];
   };
-  var useUtilityClasses$U = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$V = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disablePointerEvents = ownerState.disablePointerEvents,
       hiddenLabel = ownerState.hiddenLabel,
@@ -34202,7 +34216,7 @@
       position: position,
       variant: variant
     });
-    var classes = useUtilityClasses$U(ownerState);
+    var classes = useUtilityClasses$V(ownerState);
     return /*#__PURE__*/jsxRuntime_1(FormControlContext$1.Provider, {
       value: null,
       children: /*#__PURE__*/jsxRuntime_1(InputAdornmentRoot, _extends({
@@ -34279,7 +34293,7 @@
   var inputLabelClasses = generateUtilityClasses$1('MuiInputLabel', ['root', 'focused', 'disabled', 'error', 'required', 'asterisk', 'formControl', 'sizeSmall', 'shrink', 'animated', 'standard', 'filled', 'outlined']);
   var inputLabelClasses$1 = inputLabelClasses;
 
-  var useUtilityClasses$T = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$U = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       formControl = ownerState.formControl,
       size = ownerState.size,
@@ -34398,7 +34412,7 @@
       required: fcs.required,
       focused: fcs.focused
     });
-    var classes = useUtilityClasses$T(ownerState);
+    var classes = useUtilityClasses$U(ownerState);
     return /*#__PURE__*/jsxRuntime_1(InputLabelRoot, _extends({
       "data-shrink": shrink,
       ownerState: ownerState,
@@ -34488,7 +34502,7 @@
   var indeterminate1Keyframe = keyframes(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  0% {\n    left: -35%;\n    right: 100%;\n  }\n\n  60% {\n    left: 100%;\n    right: -90%;\n  }\n\n  100% {\n    left: 100%;\n    right: -90%;\n  }\n"])));
   var indeterminate2Keyframe = keyframes(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n  0% {\n    left: -200%;\n    right: 100%;\n  }\n\n  60% {\n    left: 107%;\n    right: -8%;\n  }\n\n  100% {\n    left: 107%;\n    right: -8%;\n  }\n"])));
   var bufferKeyframe = keyframes(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 1;\n    background-position: 0 -23px;\n  }\n\n  60% {\n    opacity: 0;\n    background-position: 0 -23px;\n  }\n\n  100% {\n    opacity: 1;\n    background-position: -200px -23px;\n  }\n"])));
-  var useUtilityClasses$S = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$T = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant,
       color = ownerState.color;
@@ -34656,7 +34670,7 @@
       color: color,
       variant: variant
     });
-    var classes = useUtilityClasses$S(ownerState);
+    var classes = useUtilityClasses$T(ownerState);
     var isRtl = useRtl();
     var rootProps = {};
     var inlineStyles = {
@@ -34781,7 +34795,7 @@
   };
   var getTextDecoration$1 = getTextDecoration;
 
-  var useUtilityClasses$R = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$S = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       component = ownerState.component,
       focusVisible = ownerState.focusVisible,
@@ -34899,7 +34913,7 @@
       underline: underline,
       variant: variant
     });
-    var classes = useUtilityClasses$R(ownerState);
+    var classes = useUtilityClasses$S(ownerState);
     return /*#__PURE__*/jsxRuntime_1(LinkRoot, _extends({
       color: color,
       className: clsx(classes.root, className),
@@ -34986,7 +35000,7 @@
   var listClasses = generateUtilityClasses$1('MuiList', ['root', 'padding', 'dense', 'subheader']);
   var listClasses$1 = listClasses;
 
-  var useUtilityClasses$Q = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$R = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       disablePadding = ownerState.disablePadding,
       dense = ownerState.dense,
@@ -35042,7 +35056,7 @@
       dense: dense,
       disablePadding: disablePadding
     });
-    var classes = useUtilityClasses$Q(ownerState);
+    var classes = useUtilityClasses$R(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ListContext$1.Provider, {
       value: context,
       children: /*#__PURE__*/jsxRuntime_2(ListRoot, _extends({
@@ -35116,7 +35130,7 @@
     var ownerState = props.ownerState;
     return [styles.root, ownerState.dense && styles.dense, ownerState.alignItems === 'flex-start' && styles.alignItemsFlexStart, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];
   };
-  var useUtilityClasses$P = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$Q = function useUtilityClasses(ownerState) {
     var alignItems = ownerState.alignItems,
       classes = ownerState.classes,
       dense = ownerState.dense,
@@ -35238,7 +35252,7 @@
       divider: divider,
       selected: selected
     });
-    var classes = useUtilityClasses$P(ownerState);
+    var classes = useUtilityClasses$Q(ownerState);
     var handleRef = useForkRef(listItemRef, ref);
     return /*#__PURE__*/jsxRuntime_1(ListContext$1.Provider, {
       value: childContext,
@@ -35343,7 +35357,7 @@
   var listItemSecondaryActionClasses = generateUtilityClasses$1('MuiListItemSecondaryAction', ['root', 'disableGutters']);
   var listItemSecondaryActionClasses$1 = listItemSecondaryActionClasses;
 
-  var useUtilityClasses$O = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$P = function useUtilityClasses(ownerState) {
     var disableGutters = ownerState.disableGutters,
       classes = ownerState.classes;
     var slots = {
@@ -35384,7 +35398,7 @@
     var ownerState = _extends({}, props, {
       disableGutters: context.disableGutters
     });
-    var classes = useUtilityClasses$O(ownerState);
+    var classes = useUtilityClasses$P(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ListItemSecondaryActionRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -35420,7 +35434,7 @@
     var ownerState = props.ownerState;
     return [styles.root, ownerState.dense && styles.dense, ownerState.alignItems === 'flex-start' && styles.alignItemsFlexStart, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters, !ownerState.disablePadding && styles.padding, ownerState.button && styles.button, ownerState.hasSecondaryAction && styles.secondaryAction];
   };
-  var useUtilityClasses$N = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$O = function useUtilityClasses(ownerState) {
     var alignItems = ownerState.alignItems,
       button = ownerState.button,
       classes = ownerState.classes,
@@ -35595,7 +35609,7 @@
       hasSecondaryAction: hasSecondaryAction,
       selected: selected
     });
-    var classes = useUtilityClasses$N(ownerState);
+    var classes = useUtilityClasses$O(ownerState);
     var handleRef = useForkRef(listItemRef, ref);
     var Root = slots.root || components.Root || ListItemRoot;
     var rootProps = slotProps.root || componentsProps.root || {};
@@ -35824,7 +35838,7 @@
   var listItemAvatarClasses = generateUtilityClasses$1('MuiListItemAvatar', ['root', 'alignItemsFlexStart']);
   var listItemAvatarClasses$1 = listItemAvatarClasses;
 
-  var useUtilityClasses$M = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$N = function useUtilityClasses(ownerState) {
     var alignItems = ownerState.alignItems,
       classes = ownerState.classes;
     var slots = {
@@ -35863,7 +35877,7 @@
     var ownerState = _extends({}, props, {
       alignItems: context.alignItems
     });
-    var classes = useUtilityClasses$M(ownerState);
+    var classes = useUtilityClasses$N(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ListItemAvatarRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -35900,7 +35914,7 @@
   var listItemIconClasses = generateUtilityClasses$1('MuiListItemIcon', ['root', 'alignItemsFlexStart']);
   var listItemIconClasses$1 = listItemIconClasses;
 
-  var useUtilityClasses$L = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$M = function useUtilityClasses(ownerState) {
     var alignItems = ownerState.alignItems,
       classes = ownerState.classes;
     var slots = {
@@ -35942,7 +35956,7 @@
     var ownerState = _extends({}, props, {
       alignItems: context.alignItems
     });
-    var classes = useUtilityClasses$L(ownerState);
+    var classes = useUtilityClasses$M(ownerState);
     return /*#__PURE__*/jsxRuntime_1(ListItemIconRoot, _extends({
       className: clsx(classes.root, className),
       ownerState: ownerState,
@@ -35980,7 +35994,7 @@
   var listItemTextClasses = generateUtilityClasses$1('MuiListItemText', ['root', 'multiline', 'dense', 'inset', 'primary', 'secondary']);
   var listItemTextClasses$1 = listItemTextClasses;
 
-  var useUtilityClasses$K = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$L = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       inset = ownerState.inset,
       primary = ownerState.primary,
@@ -36041,7 +36055,7 @@
       secondary: !!secondary,
       dense: dense
     });
-    var classes = useUtilityClasses$K(ownerState);
+    var classes = useUtilityClasses$L(ownerState);
     if (primary != null && primary.type !== Typography$1 && !disableTypography) {
       primary = /*#__PURE__*/jsxRuntime_1(Typography$1, _extends({
         variant: dense ? 'body2' : 'body1',
@@ -36435,7 +36449,7 @@
   function resolveAnchorEl(anchorEl) {
     return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
   }
-  var useUtilityClasses$J = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$K = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -36527,7 +36541,7 @@
       transitionDuration: transitionDurationProp,
       TransitionProps: TransitionProps
     });
-    var classes = useUtilityClasses$J(ownerState);
+    var classes = useUtilityClasses$K(ownerState);
 
     // Returns the top/left offset of the position
     // to attach to on the anchor element (or body if none is provided)
@@ -36943,7 +36957,7 @@
     vertical: 'top',
     horizontal: 'left'
   };
-  var useUtilityClasses$I = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$J = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -37029,7 +37043,7 @@
       TransitionProps: TransitionProps,
       variant: variant
     });
-    var classes = useUtilityClasses$I(ownerState);
+    var classes = useUtilityClasses$J(ownerState);
     var autoFocusItem = autoFocus && !disableAutoFocusItem && open;
     var menuListActionsRef = React__namespace.useRef(null);
     var handleEntering = function handleEntering(element, isAppearing) {
@@ -37245,7 +37259,7 @@
     var ownerState = props.ownerState;
     return [styles.root, ownerState.dense && styles.dense, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];
   };
-  var useUtilityClasses$H = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$I = function useUtilityClasses(ownerState) {
     var disabled = ownerState.disabled,
       dense = ownerState.dense,
       divider = ownerState.divider,
@@ -37374,7 +37388,7 @@
       divider: divider,
       disableGutters: disableGutters
     });
-    var classes = useUtilityClasses$H(props);
+    var classes = useUtilityClasses$I(props);
     var handleRef = useForkRef(menuItemRef, ref);
     var tabIndex;
     if (!props.disabled) {
@@ -37478,7 +37492,7 @@
   var mobileStepperClasses = generateUtilityClasses$1('MuiMobileStepper', ['root', 'positionBottom', 'positionTop', 'positionStatic', 'dots', 'dot', 'dotActive', 'progress']);
   var mobileStepperClasses$1 = mobileStepperClasses;
 
-  var useUtilityClasses$G = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$H = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       position = ownerState.position;
     var slots = {
@@ -37603,7 +37617,7 @@
         value = Math.ceil(activeStep / (steps - 1) * 100);
       }
     }
-    var classes = useUtilityClasses$G(ownerState);
+    var classes = useUtilityClasses$H(ownerState);
     return /*#__PURE__*/jsxRuntime_2(MobileStepperRoot, _extends({
       square: true,
       elevation: 0,
@@ -37689,7 +37703,7 @@
   var nativeSelectClasses = generateUtilityClasses$1('MuiNativeSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput', 'error']);
   var nativeSelectClasses$1 = nativeSelectClasses;
 
-  var useUtilityClasses$F = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$G = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant,
       disabled = ownerState.disabled,
@@ -37808,7 +37822,7 @@
       variant: variant,
       error: error
     });
-    var classes = useUtilityClasses$F(ownerState);
+    var classes = useUtilityClasses$G(ownerState);
     return /*#__PURE__*/jsxRuntime_2(React__namespace.Fragment, {
       children: [/*#__PURE__*/jsxRuntime_1(NativeSelectSelect, _extends({
         ownerState: ownerState,
@@ -37879,7 +37893,7 @@
   } ;
   var NativeSelectInput$1 = NativeSelectInput;
 
-  var useUtilityClasses$E = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$F = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root']
@@ -37915,7 +37929,7 @@
     var ownerState = _extends({}, props, {
       classes: classesProp
     });
-    var classes = useUtilityClasses$E(ownerState);
+    var classes = useUtilityClasses$F(ownerState);
     classesProp.root;
       var otherClasses = _objectWithoutProperties(classesProp, ["root"]);
     return /*#__PURE__*/jsxRuntime_1(React__namespace.Fragment, {
@@ -38120,7 +38134,7 @@
     style: PropTypes.object
   } ;
 
-  var useUtilityClasses$D = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$E = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes;
     var slots = {
       root: ['root'],
@@ -38235,7 +38249,7 @@
       _props$type = props.type,
       type = _props$type === void 0 ? 'text' : _props$type,
       other = _objectWithoutProperties(props, ["components", "fullWidth", "inputComponent", "label", "multiline", "notched", "slots", "type"]);
-    var classes = useUtilityClasses$D(props);
+    var classes = useUtilityClasses$E(props);
     var muiFormControl = useFormControl();
     var fcs = formControlState({
       props: props,
@@ -38599,7 +38613,7 @@
     var ownerState = props.ownerState;
     return [styles.root, styles[ownerState.variant], styles["size".concat(capitalize(ownerState.size))], ownerState.variant === 'text' && styles["text".concat(capitalize(ownerState.color))], ownerState.variant === 'outlined' && styles["outlined".concat(capitalize(ownerState.color))], ownerState.shape === 'rounded' && styles.rounded, ownerState.type === 'page' && styles.page, (ownerState.type === 'start-ellipsis' || ownerState.type === 'end-ellipsis') && styles.ellipsis, (ownerState.type === 'previous' || ownerState.type === 'next') && styles.previousNext, (ownerState.type === 'first' || ownerState.type === 'last') && styles.firstLast];
   };
-  var useUtilityClasses$C = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$D = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       disabled = ownerState.disabled,
@@ -38802,7 +38816,7 @@
       variant: variant
     });
     var isRtl = useRtl();
-    var classes = useUtilityClasses$C(ownerState);
+    var classes = useUtilityClasses$D(ownerState);
     var normalizedIcons = isRtl ? {
       previous: slots.next || components.next || NavigateNextIcon,
       next: slots.previous || components.previous || NavigateBeforeIcon,
@@ -38931,7 +38945,7 @@
   } ;
   var PaginationItem$1 = PaginationItem;
 
-  var useUtilityClasses$B = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$C = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       variant = ownerState.variant;
     var slots = {
@@ -39030,7 +39044,7 @@
       size: size,
       variant: variant
     });
-    var classes = useUtilityClasses$B(ownerState);
+    var classes = useUtilityClasses$C(ownerState);
     return /*#__PURE__*/jsxRuntime_1(PaginationRoot, _extends({
       "aria-label": "pagination navigation",
       className: clsx(classes.root, className),
@@ -39272,7 +39286,7 @@
   var radioClasses = generateUtilityClasses$1('MuiRadio', ['root', 'checked', 'disabled', 'colorPrimary', 'colorSecondary', 'sizeSmall']);
   var radioClasses$1 = radioClasses;
 
-  var useUtilityClasses$A = function useUtilityClasses(ownerState) {
+  var useUtilityClasses$B = function useUtilityClasses(ownerState) {
     var classes = ownerState.classes,
       color = ownerState.color,
       size = ownerState.size;
@@ -39345,7 +39359,7 @@
       color: color,
       size: size
     });
-    var classes = useUtilityClasses$A(ownerState);
+    var classes = useUtilityClasses$B(ownerState);
     var radioGroup = useRadioGroup();
     var checked = checkedProp;
     var onChange = createChainedFunction(onChangeProp, radioGroup && radioGroup.onChange);
@@ -39464,15 +39478,32 @@
   } ;
   var Radio$1 = Radio;
 
+  function getRadioGroupUtilityClass(slot) {
+    return generateUtilityClass$1('MuiRadioGroup', slot);
+  }
+  var radioGroupClasses = generateUtilityClasses$1('MuiRadioGroup', ['root', 'row', 'error']);
+  var radioGroupClasses$1 = radioGroupClasses;
+
+  var useUtilityClasses$A = function useUtilityClasses(props) {
+    var classes = props.classes,
+      row = props.row,
+      error = props.error;
+    var slots = {
+      root: ['root', row && 'row', error && 'error']
+    };
+    return composeClasses(slots, getRadioGroupUtilityClass, classes);
+  };
   var RadioGroup = /*#__PURE__*/React__namespace.forwardRef(function RadioGroup(props, ref) {
     var actions = props.actions,
       children = props.children,
+      className = props.className,
       defaultValue = props.defaultValue,
       nameProp = props.name,
       _onChange = props.onChange,
       valueProp = props.value,
-      other = _objectWithoutProperties(props, ["actions", "children", "defaultValue", "name", "onChange", "value"]);
+      other = _objectWithoutProperties(props, ["actions", "children", "className", "defaultValue", "name", "onChange", "value"]);
     var rootRef = React__namespace.useRef(null);
+    var classes = useUtilityClasses$A(props);
     var _useControlled = useControlled({
         controlled: valueProp,
         "default": defaultValue,
@@ -39512,7 +39543,8 @@
       value: contextValue,
       children: /*#__PURE__*/jsxRuntime_1(FormGroup$1, _extends({
         role: "radiogroup",
-        ref: handleRef
+        ref: handleRef,
+        className: clsx(classes.root, className)
       }, other, {
         children: children
       }))
@@ -39527,6 +39559,10 @@
      * The content of the component.
      */
     children: PropTypes.node,
+    /**
+     * @ignore
+     */
+    className: PropTypes.string,
     /**
      * The default value. Use when the component is not controlled.
      */
@@ -50918,6 +50954,7 @@
   exports.getPaginationUtilityClass = getPaginationUtilityClass;
   exports.getPaperUtilityClass = getPaperUtilityClass;
   exports.getPopoverUtilityClass = getPopoverUtilityClass;
+  exports.getRadioGroupUtilityClass = getRadioGroupUtilityClass;
   exports.getRadioUtilityClass = getRadioUtilityClass;
   exports.getRatingUtilityClass = getRatingUtilityClass;
   exports.getScopedCssBaselineUtilityClass = getScopedCssBaselineUtilityClass;
@@ -51000,6 +51037,7 @@
   exports.private_createTypography = createTypography;
   exports.private_excludeVariablesFromRoot = excludeVariablesFromRoot$1;
   exports.radioClasses = radioClasses$1;
+  exports.radioGroupClasses = radioGroupClasses$1;
   exports.ratingClasses = ratingClasses$1;
   exports.recomposeColor = recomposeColor;
   exports.requirePropFactory = requirePropFactory;