@mui/material 5.12.2 → 5.12.3

package/legacy/Drawer/Drawer.js

@@ -138,10 +138,10 @@ var Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {
     elevation = _props$elevation === void 0 ? 16 : _props$elevation,
     _props$hideBackdrop = props.hideBackdrop,
     hideBackdrop = _props$hideBackdrop === void 0 ? false : _props$hideBackdrop,
-    _props$ModalProps = props.ModalProps;
-  _props$ModalProps = _props$ModalProps === void 0 ? {} : _props$ModalProps;
-  var BackdropPropsProp = _props$ModalProps.BackdropProps,
-    ModalProps = _objectWithoutProperties(_props$ModalProps, ["BackdropProps"]),
+    _props$ModalProps = props.ModalProps,
+    _props$ModalProps2 = _props$ModalProps === void 0 ? {} : _props$ModalProps,
+    BackdropPropsProp = _props$ModalProps2.BackdropProps,
+    ModalProps = _objectWithoutProperties(_props$ModalProps2, ["BackdropProps"]),
     onClose = props.onClose,
     _props$open = props.open,
     open = _props$open === void 0 ? false : _props$open,

package/legacy/InputBase/InputBase.js

@@ -375,7 +375,7 @@ var InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref) {
     if (inputRef.current && event.currentTarget === event.target) {
       inputRef.current.focus();
     }
-    if (onClick) {
+    if (onClick && !fcs.disabled) {
       onClick(event);
     }
   };

package/legacy/ListItem/ListItem.js

@@ -142,10 +142,10 @@ var ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
     componentsProps = _props$componentsProp === void 0 ? {} : _props$componentsProp,
     _props$ContainerCompo = props.ContainerComponent,
     ContainerComponent = _props$ContainerCompo === void 0 ? 'li' : _props$ContainerCompo,
-    _props$ContainerProps = props.ContainerProps;
-  _props$ContainerProps = _props$ContainerProps === void 0 ? {} : _props$ContainerProps;
-  var ContainerClassName = _props$ContainerProps.className,
-    ContainerProps = _objectWithoutProperties(_props$ContainerProps, ["className"]),
+    _props$ContainerProps = props.ContainerProps,
+    _props$ContainerProps2 = _props$ContainerProps === void 0 ? {} : _props$ContainerProps,
+    ContainerClassName = _props$ContainerProps2.className,
+    ContainerProps = _objectWithoutProperties(_props$ContainerProps2, ["className"]),
     _props$dense = props.dense,
     dense = _props$dense === void 0 ? false : _props$dense,
     _props$disabled = props.disabled,

package/legacy/Menu/Menu.js

@@ -84,10 +84,10 @@ var Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     PopoverClasses = props.PopoverClasses,
     _props$transitionDura = props.transitionDuration,
     transitionDuration = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura,
-    _props$TransitionProp = props.TransitionProps;
-  _props$TransitionProp = _props$TransitionProp === void 0 ? {} : _props$TransitionProp;
-  var onEntering = _props$TransitionProp.onEntering,
-    TransitionProps = _objectWithoutProperties(_props$TransitionProp, ["onEntering"]),
+    _props$TransitionProp = props.TransitionProps,
+    _props$TransitionProp2 = _props$TransitionProp === void 0 ? {} : _props$TransitionProp,
+    onEntering = _props$TransitionProp2.onEntering,
+    TransitionProps = _objectWithoutProperties(_props$TransitionProp2, ["onEntering"]),
     _props$variant = props.variant,
     variant = _props$variant === void 0 ? 'selectedMenu' : _props$variant,
     other = _objectWithoutProperties(props, ["autoFocus", "children", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant"]);

package/legacy/Popover/Popover.js

@@ -114,10 +114,10 @@ var Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,
     _props$transitionDura = props.transitionDuration,
     transitionDurationProp = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura,
-    _props$TransitionProp = props.TransitionProps;
-  _props$TransitionProp = _props$TransitionProp === void 0 ? {} : _props$TransitionProp;
-  var onEntering = _props$TransitionProp.onEntering,
-    TransitionProps = _objectWithoutProperties(_props$TransitionProp, ["onEntering"]),
+    _props$TransitionProp = props.TransitionProps,
+    _props$TransitionProp2 = _props$TransitionProp === void 0 ? {} : _props$TransitionProp,
+    onEntering = _props$TransitionProp2.onEntering,
+    TransitionProps = _objectWithoutProperties(_props$TransitionProp2, ["onEntering"]),
     other = _objectWithoutProperties(props, ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"]);
   var paperRef = React.useRef();
   var handlePaperRef = useForkRef(paperRef, PaperProps.ref);

package/legacy/Popper/Popper.js

@@ -53,7 +53,6 @@ var Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   var RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;
   var otherProps = _extends({
     anchorEl: anchorEl,
-    component: component,
     container: container,
     disablePortal: disablePortal,
     keepMounted: keepMounted,
@@ -65,6 +64,7 @@ var Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
     transition: transition
   }, other);
   return /*#__PURE__*/_jsx(PopperRoot, _extends({
+    as: component,
     direction: theme == null ? void 0 : theme.direction,
     slots: {
       root: RootComponent
@@ -91,9 +91,10 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
    */
   children: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.node, PropTypes.func]),
   /**
-   * @ignore
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
    */
-  component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
+  component: PropTypes.elementType,
   /**
    * The components used for each slot inside the Popper.
    * Either a string to use a HTML element or a component.

package/legacy/Slider/Slider.js

@@ -514,7 +514,7 @@ var Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     valueLabelFormat: valueLabelFormat
   });
   var _useSlider = useSlider(_extends({}, ownerState, {
-      ref: ref
+      rootRef: ref
     })),
     axisProps = _useSlider.axisProps,
     getRootProps = _useSlider.getRootProps,

package/legacy/Snackbar/Snackbar.js

@@ -76,13 +76,13 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     exit: theme.transitions.duration.leavingScreen
   };
   var action = props.action,
-    _props$anchorOrigin = props.anchorOrigin;
-  _props$anchorOrigin = _props$anchorOrigin === void 0 ? {
-    vertical: 'bottom',
-    horizontal: 'left'
-  } : _props$anchorOrigin;
-  var vertical = _props$anchorOrigin.vertical,
-    horizontal = _props$anchorOrigin.horizontal,
+    _props$anchorOrigin = props.anchorOrigin,
+    _props$anchorOrigin2 = _props$anchorOrigin === void 0 ? {
+      vertical: 'bottom',
+      horizontal: 'left'
+    } : _props$anchorOrigin,
+    vertical = _props$anchorOrigin2.vertical,
+    horizontal = _props$anchorOrigin2.horizontal,
     _props$autoHideDurati = props.autoHideDuration,
     autoHideDuration = _props$autoHideDurati === void 0 ? null : _props$autoHideDurati,
     children = props.children,
@@ -103,11 +103,11 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,
     _props$transitionDura = props.transitionDuration,
     transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura,
-    _props$TransitionProp = props.TransitionProps;
-  _props$TransitionProp = _props$TransitionProp === void 0 ? {} : _props$TransitionProp;
-  var onEnter = _props$TransitionProp.onEnter,
-    onExited = _props$TransitionProp.onExited,
-    TransitionProps = _objectWithoutProperties(_props$TransitionProp, ["onEnter", "onExited"]),
+    _props$TransitionProp = props.TransitionProps,
+    _props$TransitionProp2 = _props$TransitionProp === void 0 ? {} : _props$TransitionProp,
+    onEnter = _props$TransitionProp2.onEnter,
+    onExited = _props$TransitionProp2.onExited,
+    TransitionProps = _objectWithoutProperties(_props$TransitionProp2, ["onEnter", "onExited"]),
     other = _objectWithoutProperties(props, ["action", "anchorOrigin", "autoHideDuration", "children", "className", "ClickAwayListenerProps", "ContentProps", "disableWindowBlurListener", "message", "onBlur", "onClose", "onFocus", "onMouseEnter", "onMouseLeave", "open", "resumeHideDuration", "TransitionComponent", "transitionDuration", "TransitionProps"]);
   var ownerState = _extends({}, props, {
     anchorOrigin: {
@@ -120,9 +120,7 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     transitionDuration: transitionDuration
   });
   var classes = useUtilityClasses(ownerState);
-  var _useSnackbar = useSnackbar(_extends({}, ownerState, {
-      ref: ref
-    })),
+  var _useSnackbar = useSnackbar(_extends({}, ownerState)),
     getRootProps = _useSnackbar.getRootProps,
     onClickAway = _useSnackbar.onClickAway;
   var _React$useState = React.useState(true),
@@ -133,6 +131,9 @@ var Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
     getSlotProps: getRootProps,
     externalForwardedProps: other,
     ownerState: ownerState,
+    additionalProps: {
+      ref: ref
+    },
     className: [classes.root, className]
   });
   var handleExited = function handleExited(node) {

package/legacy/SpeedDial/SpeedDial.js

@@ -130,10 +130,10 @@ var SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref) {
     exit: theme.transitions.duration.leavingScreen
   };
   var ariaLabel = props.ariaLabel,
-    _props$FabProps = props.FabProps;
-  _props$FabProps = _props$FabProps === void 0 ? {} : _props$FabProps;
-  var origDialButtonRef = _props$FabProps.ref,
-    FabProps = _objectWithoutProperties(_props$FabProps, ["ref"]),
+    _props$FabProps = props.FabProps,
+    _props$FabProps2 = _props$FabProps === void 0 ? {} : _props$FabProps,
+    origDialButtonRef = _props$FabProps2.ref,
+    FabProps = _objectWithoutProperties(_props$FabProps2, ["ref"]),
     childrenProp = props.children,
     className = props.className,
     _props$direction = props.direction,
@@ -329,10 +329,10 @@ var SpeedDial = /*#__PURE__*/React.forwardRef(function SpeedDial(inProps, ref) {
   });
   var children = allItems.map(function (child, index) {
     var _child$props = child.props,
-      _child$props$FabProps = _child$props.FabProps;
-    _child$props$FabProps = _child$props$FabProps === void 0 ? {} : _child$props$FabProps;
-    var origButtonRef = _child$props$FabProps.ref,
-      ChildFabProps = _objectWithoutProperties(_child$props$FabProps, ["ref"]),
+      _child$props$FabProps = _child$props.FabProps,
+      _child$props$FabProps2 = _child$props$FabProps === void 0 ? {} : _child$props$FabProps,
+      origButtonRef = _child$props$FabProps2.ref,
+      ChildFabProps = _objectWithoutProperties(_child$props$FabProps2, ["ref"]),
       tooltipPlacementProp = _child$props.tooltipPlacement;
     var tooltipPlacement = tooltipPlacementProp || (getOrientation(direction) === 'vertical' ? 'left' : 'top');
     return /*#__PURE__*/React.cloneElement(child, {

package/legacy/SwipeableDrawer/SwipeableDrawer.js

@@ -138,10 +138,10 @@ var SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(inP
     allowSwipeInChildren = _props$allowSwipeInCh === void 0 ? false : _props$allowSwipeInCh,
     _props$minFlingVeloci = props.minFlingVelocity,
     minFlingVelocity = _props$minFlingVeloci === void 0 ? 450 : _props$minFlingVeloci,
-    _props$ModalProps = props.ModalProps;
-  _props$ModalProps = _props$ModalProps === void 0 ? {} : _props$ModalProps;
-  var BackdropProps = _props$ModalProps.BackdropProps,
-    ModalPropsProp = _objectWithoutProperties(_props$ModalProps, ["BackdropProps"]),
+    _props$ModalProps = props.ModalProps,
+    _props$ModalProps2 = _props$ModalProps === void 0 ? {} : _props$ModalProps,
+    BackdropProps = _props$ModalProps2.BackdropProps,
+    ModalPropsProp = _objectWithoutProperties(_props$ModalProps2, ["BackdropProps"]),
     onClose = props.onClose,
     onOpen = props.onOpen,
     _props$open = props.open,

package/legacy/TextField/TextField.js

@@ -103,6 +103,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref) {
     name = props.name,
     onBlur = props.onBlur,
     onChange = props.onChange,
+    onClick = props.onClick,
     onFocus = props.onFocus,
     placeholder = props.placeholder,
     _props$required = props.required,
@@ -115,7 +116,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref) {
     value = props.value,
     _props$variant = props.variant,
     variant = _props$variant === void 0 ? 'outlined' : _props$variant,
-    other = _objectWithoutProperties(props, ["autoComplete", "autoFocus", "children", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onFocus", "placeholder", "required", "rows", "select", "SelectProps", "type", "value", "variant"]);
+    other = _objectWithoutProperties(props, ["autoComplete", "autoFocus", "children", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "placeholder", "required", "rows", "select", "SelectProps", "type", "value", "variant"]);
   var ownerState = _extends({}, props, {
     autoFocus: autoFocus,
     color: color,
@@ -169,6 +170,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref) {
     onBlur: onBlur,
     onChange: onChange,
     onFocus: onFocus,
+    onClick: onClick,
     placeholder: placeholder,
     inputProps: inputProps
   }, InputMore, InputProps));
@@ -327,6 +329,10 @@ process.env.NODE_ENV !== "production" ? TextField.propTypes /* remove-proptypes
    * You can pull out the new value by accessing `event.target.value` (string).
    */
   onChange: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
   /**
    * @ignore
    */

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.12.2
+ * @mui/material v5.12.3
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/useMediaQuery/useMediaQuery.js

@@ -7,6 +7,14 @@ import useEnhancedEffect from '../utils/useEnhancedEffect';
  * @deprecated Not used internally. Use `MediaQueryListEvent` from lib.dom.d.ts instead.
  */
 
+/**
+ * @deprecated Not used internally. Use `MediaQueryList` from lib.dom.d.ts instead.
+ */
+
+/**
+ * @deprecated Not used internally. Use `(event: MediaQueryListEvent) => void` instead.
+ */
+
 function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
   var _React$useState = React.useState(function () {
       if (noSsr && matchMedia) {

package/locale/index.d.ts

@@ -1,76 +1,76 @@
-import { ComponentsPropsList } from '../styles/props';
-export interface Localization {
-    components?: {
-        MuiAlert?: {
-            defaultProps: Pick<ComponentsPropsList['MuiAlert'], 'closeText'>;
-        };
-        MuiBreadcrumbs?: {
-            defaultProps: Pick<ComponentsPropsList['MuiBreadcrumbs'], 'expandText'>;
-        };
-        MuiTablePagination?: {
-            defaultProps: Pick<ComponentsPropsList['MuiTablePagination'], 'labelRowsPerPage' | 'labelDisplayedRows' | 'getItemAriaLabel'>;
-        };
-        MuiRating?: {
-            defaultProps: Pick<ComponentsPropsList['MuiRating'], 'emptyLabelText' | 'getLabelText'>;
-        };
-        MuiAutocomplete?: {
-            defaultProps: Pick<ComponentsPropsList['MuiAutocomplete'], 'clearText' | 'closeText' | 'loadingText' | 'noOptionsText' | 'openText'>;
-        };
-        MuiPagination?: {
-            defaultProps: Pick<ComponentsPropsList['MuiPagination'], 'aria-label' | 'getItemAriaLabel'>;
-        };
-    };
-}
-export declare const amET: Localization;
-export declare const arEG: Localization;
-export declare const arSA: Localization;
-export declare const arSD: Localization;
-export declare const azAZ: Localization;
-export declare const bnBD: Localization;
-export declare const beBY: Localization;
-export declare const bgBG: Localization;
-export declare const caES: Localization;
-export declare const csCZ: Localization;
-export declare const daDK: Localization;
-export declare const deDE: Localization;
-export declare const elGR: Localization;
-export declare const enUS: Localization;
-export declare const esES: Localization;
-export declare const etEE: Localization;
-export declare const faIR: Localization;
-export declare const fiFI: Localization;
-export declare const frFR: Localization;
-export declare const heIL: Localization;
-export declare const hiIN: Localization;
-export declare const hrHR: Localization;
-export declare const huHU: Localization;
-export declare const hyAM: Localization;
-export declare const idID: Localization;
-export declare const isIS: Localization;
-export declare const itIT: Localization;
-export declare const jaJP: Localization;
-export declare const khKH: Localization;
-export declare const koKR: Localization;
-export declare const kuCKB: Localization;
-export declare const kuLatn: Localization;
-export declare const kkKZ: Localization;
-export declare const mkMK: Localization;
-export declare const nbNO: Localization;
-export declare const nlNL: Localization;
-export declare const plPL: Localization;
-export declare const ptBR: Localization;
-export declare const ptPT: Localization;
-export declare const roRO: Localization;
-export declare const srRS: Localization;
-export declare const ruRU: Localization;
-export declare const siLK: Localization;
-export declare const skSK: Localization;
-export declare const svSE: Localization;
-export declare const thTH: Localization;
-export declare const trTR: Localization;
-export declare const ukUA: Localization;
-export declare const urPK: Localization;
-export declare const viVN: Localization;
-export declare const zhCN: Localization;
-export declare const zhHK: Localization;
-export declare const zhTW: Localization;
+import { ComponentsPropsList } from '../styles/props';
+export interface Localization {
+    components?: {
+        MuiAlert?: {
+            defaultProps: Pick<ComponentsPropsList['MuiAlert'], 'closeText'>;
+        };
+        MuiBreadcrumbs?: {
+            defaultProps: Pick<ComponentsPropsList['MuiBreadcrumbs'], 'expandText'>;
+        };
+        MuiTablePagination?: {
+            defaultProps: Pick<ComponentsPropsList['MuiTablePagination'], 'labelRowsPerPage' | 'labelDisplayedRows' | 'getItemAriaLabel'>;
+        };
+        MuiRating?: {
+            defaultProps: Pick<ComponentsPropsList['MuiRating'], 'emptyLabelText' | 'getLabelText'>;
+        };
+        MuiAutocomplete?: {
+            defaultProps: Pick<ComponentsPropsList['MuiAutocomplete'], 'clearText' | 'closeText' | 'loadingText' | 'noOptionsText' | 'openText'>;
+        };
+        MuiPagination?: {
+            defaultProps: Pick<ComponentsPropsList['MuiPagination'], 'aria-label' | 'getItemAriaLabel'>;
+        };
+    };
+}
+export declare const amET: Localization;
+export declare const arEG: Localization;
+export declare const arSA: Localization;
+export declare const arSD: Localization;
+export declare const azAZ: Localization;
+export declare const bnBD: Localization;
+export declare const beBY: Localization;
+export declare const bgBG: Localization;
+export declare const caES: Localization;
+export declare const csCZ: Localization;
+export declare const daDK: Localization;
+export declare const deDE: Localization;
+export declare const elGR: Localization;
+export declare const enUS: Localization;
+export declare const esES: Localization;
+export declare const etEE: Localization;
+export declare const faIR: Localization;
+export declare const fiFI: Localization;
+export declare const frFR: Localization;
+export declare const heIL: Localization;
+export declare const hiIN: Localization;
+export declare const hrHR: Localization;
+export declare const huHU: Localization;
+export declare const hyAM: Localization;
+export declare const idID: Localization;
+export declare const isIS: Localization;
+export declare const itIT: Localization;
+export declare const jaJP: Localization;
+export declare const khKH: Localization;
+export declare const koKR: Localization;
+export declare const kuCKB: Localization;
+export declare const kuLatn: Localization;
+export declare const kkKZ: Localization;
+export declare const mkMK: Localization;
+export declare const nbNO: Localization;
+export declare const nlNL: Localization;
+export declare const plPL: Localization;
+export declare const ptBR: Localization;
+export declare const ptPT: Localization;
+export declare const roRO: Localization;
+export declare const srRS: Localization;
+export declare const ruRU: Localization;
+export declare const siLK: Localization;
+export declare const skSK: Localization;
+export declare const svSE: Localization;
+export declare const thTH: Localization;
+export declare const trTR: Localization;
+export declare const ukUA: Localization;
+export declare const urPK: Localization;
+export declare const viVN: Localization;
+export declare const zhCN: Localization;
+export declare const zhHK: Localization;
+export declare const zhTW: Localization;

package/modern/BottomNavigationAction/BottomNavigationAction.js

@@ -86,7 +86,10 @@ const BottomNavigationAction = /*#__PURE__*/React.forwardRef(function BottomNavi
       icon,
       label,
       onChange,
-      onClick,
+      onClick
+      // eslint-disable-next-line react/prop-types -- private, always overridden by BottomNavigation
+      ,
+
       value
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);

package/modern/ButtonGroup/ButtonGroup.js

@@ -83,9 +83,15 @@ const ButtonGroupRoot = styled('div', {
       borderBottomRightRadius: 0,
       borderBottomLeftRadius: 0
     }, ownerState.variant === 'text' && ownerState.orientation === 'horizontal' && {
-      borderRight: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`
+      borderRight: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
+      [`&.${buttonGroupClasses.disabled}`]: {
+        borderRight: `1px solid ${(theme.vars || theme).palette.action.disabled}`
+      }
     }, ownerState.variant === 'text' && ownerState.orientation === 'vertical' && {
-      borderBottom: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`
+      borderBottom: theme.vars ? `1px solid rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : `1px solid ${theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'}`,
+      [`&.${buttonGroupClasses.disabled}`]: {
+        borderBottom: `1px solid ${(theme.vars || theme).palette.action.disabled}`
+      }
     }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
       borderColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : alpha(theme.palette[ownerState.color].main, 0.5)
     }, ownerState.variant === 'outlined' && ownerState.orientation === 'horizontal' && {

package/modern/Chip/Chip.js

@@ -293,7 +293,7 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       size = 'medium',
       variant = 'filled',
       tabIndex,
-      skipFocusWhenDisabled = false
+      skipFocusWhenDisabled = false // TODO v6: Rename to `focusableWhenDisabled`.
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const chipRef = React.useRef(null);

package/modern/Divider/Divider.js

@@ -70,7 +70,6 @@ const DividerRoot = styled('div', {
   alignSelf: 'stretch',
   height: 'auto'
 }), ({
-  theme,
   ownerState
 }) => _extends({}, ownerState.children && {
   display: 'flex',
@@ -78,12 +77,16 @@ const DividerRoot = styled('div', {
   textAlign: 'center',
   border: 0,
   '&::before, &::after': {
-    position: 'relative',
-    width: '100%',
-    borderTop: `thin solid ${(theme.vars || theme).palette.divider}`,
-    top: '50%',
     content: '""',
-    transform: 'translateY(50%)'
+    alignSelf: 'center'
+  }
+}), ({
+  theme,
+  ownerState
+}) => _extends({}, ownerState.children && ownerState.orientation !== 'vertical' && {
+  '&::before, &::after': {
+    width: '100%',
+    borderTop: `thin solid ${(theme.vars || theme).palette.divider}`
   }
 }), ({
   theme,
@@ -92,11 +95,7 @@ const DividerRoot = styled('div', {
   flexDirection: 'column',
   '&::before, &::after': {
     height: '100%',
-    top: '0%',
-    left: '50%',
-    borderTop: 0,
-    borderLeft: `thin solid ${(theme.vars || theme).palette.divider}`,
-    transform: 'translateX(0%)'
+    borderLeft: `thin solid ${(theme.vars || theme).palette.divider}`
   }
 }), ({
   ownerState

package/modern/InputBase/InputBase.js

@@ -371,7 +371,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
     if (inputRef.current && event.currentTarget === event.target) {
       inputRef.current.focus();
     }
-    if (onClick) {
+    if (onClick && !fcs.disabled) {
       onClick(event);
     }
   };

package/modern/Popper/Popper.js

@@ -53,7 +53,6 @@ const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   const RootComponent = slots?.root ?? components?.Root;
   const otherProps = _extends({
     anchorEl,
-    component,
     container,
     disablePortal,
     keepMounted,
@@ -65,6 +64,7 @@ const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
     transition
   }, other);
   return /*#__PURE__*/_jsx(PopperRoot, _extends({
+    as: component,
     direction: theme?.direction,
     slots: {
       root: RootComponent
@@ -91,9 +91,10 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
    */
   children: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.node, PropTypes.func]),
   /**
-   * @ignore
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
    */
-  component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
+  component: PropTypes.elementType,
   /**
    * The components used for each slot inside the Popper.
    * Either a string to use a HTML element or a component.

package/modern/Select/SelectInput.js

@@ -134,7 +134,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       readOnly,
       renderValue,
       SelectDisplayProps = {},
-      tabIndex: tabIndexProp,
+      tabIndex: tabIndexProp
+      // catching `type` from Input which makes no sense for SelectInput
+      ,
+
       value: valueProp,
       variant = 'standard'
     } = props,

package/modern/Slider/Slider.js

@@ -508,7 +508,7 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     trackOffset,
     trackLeap
   } = useSlider(_extends({}, ownerState, {
-    ref
+    rootRef: ref
   }));
   ownerState.marked = marks.length > 0 && marks.some(mark => mark.label);
   ownerState.dragging = dragging;

package/modern/Snackbar/Snackbar.js

@@ -123,15 +123,16 @@ const Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(inProps, ref) {
   const {
     getRootProps,
     onClickAway
-  } = useSnackbar(_extends({}, ownerState, {
-    ref
-  }));
+  } = useSnackbar(_extends({}, ownerState));
   const [exited, setExited] = React.useState(true);
   const rootProps = useSlotProps({
     elementType: SnackbarRoot,
     getSlotProps: getRootProps,
     externalForwardedProps: other,
     ownerState,
+    additionalProps: {
+      ref
+    },
     className: [classes.root, className]
   });
   const handleExited = node => {

package/modern/SwipeableDrawer/SwipeableDrawer.js

@@ -145,7 +145,7 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
       SwipeAreaProps,
       swipeAreaWidth = 20,
       transitionDuration = transitionDurationDefault,
-      variant = 'temporary'
+      variant = 'temporary' // Mobile first.
     } = props,
     ModalPropsProp = _objectWithoutPropertiesLoose(props.ModalProps, _excluded),
     other = _objectWithoutPropertiesLoose(props, _excluded2);