@mui/material 5.0.4 → 5.1.1

package/Tooltip/Tooltip.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { MUIStyledCommonProps, SxProps } from '@mui/system';
+import { PopperProps } from '@mui/material/Popper';
 import { InternalStandardProps as StandardProps, Theme } from '..';
 import { TransitionProps } from '../transitions/transition';
-import { PopperProps } from '../Popper/Popper';
 import { TooltipClasses } from './tooltipClasses';
 
 export interface TooltipComponentsPropsOverrides {}
@@ -34,10 +34,12 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv
   };
   /**
    * The props used for each slot inside the Tooltip.
+   * Note that `componentsProps.popper` prop values win over `PopperProps`
+   * and `componentsProps.transition` prop values win over `TransitionProps` if both are applied.
    * @default {}
    */
   componentsProps?: {
-    popper?: PopperProps & TooltipComponentsPropsOverrides;
+    popper?: Partial<PopperProps> & TooltipComponentsPropsOverrides;
     transition?: TransitionProps & TooltipComponentsPropsOverrides;
     tooltip?: React.HTMLProps<HTMLDivElement> &
       MUIStyledCommonProps &

package/Tooltip/Tooltip.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { elementAcceptingRef } from '@mui/utils';
-import { unstable_composeClasses as composeClasses, appendOwnerState } from '@mui/core';
+import { unstable_composeClasses as composeClasses, appendOwnerState } from '@mui/base';
 import { alpha } from '@mui/system';
 import styled from '../styles/styled';
 import useTheme from '../styles/useTheme';
@@ -211,11 +211,11 @@ function composeEventHandler(handler, eventHandler) {
 
     handler(event);
   };
-} // TODO (v6) Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps.
+} // TODO v6: Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps.
 
 
 const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
-  var _components$Popper, _ref, _components$Tooltip, _components$Arrow, _componentsProps$popp;
+  var _components$Popper, _ref, _components$Transitio, _components$Tooltip, _components$Arrow, _componentsProps$popp;
 
   const props = useThemeProps({
     props: inProps,
@@ -586,7 +586,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
 
   const classes = useUtilityClasses(ownerState);
   const PopperComponent = (_components$Popper = components.Popper) != null ? _components$Popper : TooltipPopper;
-  const TransitionComponent = (_ref = TransitionComponentProp != null ? TransitionComponentProp : components.Transition) != null ? _ref : Grow;
+  const TransitionComponent = (_ref = (_components$Transitio = components.Transition) != null ? _components$Transitio : TransitionComponentProp) != null ? _ref : Grow;
   const TooltipComponent = (_components$Tooltip = components.Tooltip) != null ? _components$Tooltip : TooltipTooltip;
   const ArrowComponent = (_components$Arrow = components.Arrow) != null ? _components$Arrow : TooltipArrow;
   const popperProps = appendOwnerState(PopperComponent, _extends({}, PopperProps, componentsProps.popper), ownerState);
@@ -612,7 +612,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
       id: id,
       transition: true
     }, interactiveWrapperListeners, popperProps, {
-      className: clsx(classes.popper, (_componentsProps$popp = componentsProps.popper) == null ? void 0 : _componentsProps$popp.className),
+      className: clsx(classes.popper, PopperProps == null ? void 0 : PopperProps.className, (_componentsProps$popp = componentsProps.popper) == null ? void 0 : _componentsProps$popp.className),
       popperOptions: popperOptions,
       children: ({
         TransitionProps: TransitionPropsInner
@@ -677,6 +677,8 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes
 
   /**
    * The props used for each slot inside the Tooltip.
+   * Note that `componentsProps.popper` prop values win over `PopperProps`
+   * and `componentsProps.transition` prop values win over `TransitionProps` if both are applied.
    * @default {}
    */
   componentsProps: PropTypes.object,
@@ -797,7 +799,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * Tooltip title. Zero-length titles string are never displayed.

package/Tooltip/tooltipClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getTooltipUtilityClass(slot) {
   return generateUtilityClass('MuiTooltip', slot);
 }

package/Typography/Typography.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_extendSxProp as extendSxProp } from '@mui/system';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
@@ -180,7 +180,7 @@ process.env.NODE_ENV !== "production" ? Typography.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * Applies the theme typography styles.

package/Typography/typographyClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getTypographyUtilityClass(slot) {
   return generateUtilityClass('MuiTypography', slot);
 }

package/Unstable_TrapFocus/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from '@mui/core/Unstable_TrapFocus';
-export * from '@mui/core/Unstable_TrapFocus';
+export { default } from '@mui/base/Unstable_TrapFocus';
+export * from '@mui/base/Unstable_TrapFocus';

package/Unstable_TrapFocus/index.js

@@ -1 +1 @@
-export { default } from '@mui/core/Unstable_TrapFocus';
+export { default } from '@mui/base/Unstable_TrapFocus';

package/index.d.ts

@@ -74,7 +74,7 @@ export * from './styles';
 
 export * from './utils';
 
-export * from '@mui/core';
+export * from '@mui/base';
 
 export { default as Accordion } from './Accordion';
 export * from './Accordion';
@@ -172,6 +172,9 @@ export * from './Container';
 export { default as CssBaseline } from './CssBaseline';
 export * from './CssBaseline';
 
+/**
+ * @deprecated use color-scheme in CssBaseline or ScopedCssBaseline to modify scrollbar color
+ */
 export { default as darkScrollbar } from './darkScrollbar';
 export * from './darkScrollbar';
 

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.4
+/** @license MUI v5.1.1
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -8,7 +8,7 @@ import * as colors from './colors';
 export { colors };
 export * from './styles';
 export * from './utils';
-export * from '@mui/core';
+export * from '@mui/base';
 export { default as Accordion } from './Accordion';
 export * from './Accordion';
 export { default as AccordionActions } from './AccordionActions';

package/internal/SwitchBase.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { refType } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import capitalize from '../utils/capitalize';
 import styled from '../styles/styled';
 import useControlled from '../utils/useControlled';

package/internal/switchBaseClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getSwitchBaseUtilityClass(slot) {
   return generateUtilityClass('PrivateSwitchBase', slot);
 }

package/legacy/Accordion/Accordion.js

@@ -8,7 +8,7 @@ import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { chainPropTypes } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Collapse from '../Collapse';
@@ -269,7 +269,7 @@ process.env.NODE_ENV !== "production" ? Accordion.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The component used for the transition.

package/legacy/Accordion/accordionClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAccordionUtilityClass(slot) {
   return generateUtilityClass('MuiAccordion', slot);
 }

package/legacy/AccordionActions/AccordionActions.js

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { getAccordionActionsUtilityClass } from './accordionActionsClasses';
@@ -92,6 +92,6 @@ process.env.NODE_ENV !== "production" ? AccordionActions.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default AccordionActions;

package/legacy/AccordionActions/accordionActionsClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAccordionActionsUtilityClass(slot) {
   return generateUtilityClass('MuiAccordionActions', slot);
 }

package/legacy/AccordionDetails/AccordionDetails.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import { getAccordionDetailsUtilityClass } from './accordionDetailsClasses';
@@ -72,6 +72,6 @@ process.env.NODE_ENV !== "production" ? AccordionDetails.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default AccordionDetails;

package/legacy/AccordionDetails/accordionDetailsClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAccordionDetailsUtilityClass(slot) {
   return generateUtilityClass('MuiAccordionDetails', slot);
 }

package/legacy/AccordionSummary/AccordionSummary.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import ButtonBase from '../ButtonBase';
@@ -202,6 +202,6 @@ process.env.NODE_ENV !== "production" ? AccordionSummary.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default AccordionSummary;

package/legacy/AccordionSummary/accordionSummaryClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAccordionSummaryUtilityClass(slot) {
   return generateUtilityClass('MuiAccordionSummary', slot);
 }

package/legacy/Alert/Alert.js

@@ -7,7 +7,7 @@ var _CloseIcon;
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { darken, lighten } from '@mui/system';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
@@ -271,7 +271,7 @@ process.env.NODE_ENV !== "production" ? Alert.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The variant to use.

package/legacy/Alert/alertClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAlertUtilityClass(slot) {
   return generateUtilityClass('MuiAlert', slot);
 }

package/legacy/AlertTitle/AlertTitle.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Typography from '../Typography';
@@ -76,6 +76,6 @@ process.env.NODE_ENV !== "production" ? AlertTitle.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default AlertTitle;

package/legacy/AlertTitle/alertTitleClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAlertTitleUtilityClass(slot) {
   return generateUtilityClass('MuiAlertTitle', slot);
 }

package/legacy/AppBar/AppBar.js

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
@@ -163,6 +163,6 @@ process.env.NODE_ENV !== "production" ? AppBar.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default AppBar;

package/legacy/AppBar/appBarClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAppBarUtilityClass(slot) {
   return generateUtilityClass('MuiAppBar', slot);
 }

package/legacy/Autocomplete/Autocomplete.js

@@ -8,13 +8,17 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { chainPropTypes, integerPropType } from '@mui/utils';
-import { unstable_composeClasses as composeClasses, useAutocomplete, createFilterOptions } from '@mui/core';
+import { unstable_composeClasses as composeClasses, useAutocomplete, createFilterOptions } from '@mui/base';
 import { alpha } from '@mui/system';
 import Popper from '../Popper';
 import ListSubheader from '../ListSubheader';
 import Paper from '../Paper';
 import IconButton from '../IconButton';
 import Chip from '../Chip';
+import inputClasses from '../Input/inputClasses';
+import inputBaseClasses from '../InputBase/inputBaseClasses';
+import outlinedInputClasses from '../OutlinedInput/outlinedInputClasses';
+import filledInputClasses from '../FilledInput/filledInputClasses';
 import ClearIcon from '../internal/svg-icons/Close';
 import ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';
 import useThemeProps from '../styles/useThemeProps';
@@ -67,7 +71,7 @@ var AutocompleteRoot = styled('div', {
     return [_defineProperty({}, "& .".concat(autocompleteClasses.tag), styles.tag), _defineProperty({}, "& .".concat(autocompleteClasses.tag), styles["tagSize".concat(capitalize(size))]), _defineProperty({}, "& .".concat(autocompleteClasses.inputRoot), styles.inputRoot), _defineProperty({}, "& .".concat(autocompleteClasses.input), styles.input), _defineProperty({}, "& .".concat(autocompleteClasses.input), inputFocused && styles.inputFocused), styles.root, fullWidth && styles.fullWidth, hasPopupIcon && styles.hasPopupIcon, hasClearIcon && styles.hasClearIcon];
   }
 })(function (_ref6) {
-  var _extends2, _$concat, _MuiOutlinedInput, _MuiFilledInputRo, _extends3;
+  var _extends2, _$concat, _$concat2, _$concat3, _extends3;
 
   var ownerState = _ref6.ownerState;
   return _extends((_extends2 = {}, _defineProperty(_extends2, "&.".concat(autocompleteClasses.focused, " .").concat(autocompleteClasses.clearIndicator), {
@@ -91,45 +95,44 @@ var AutocompleteRoot = styled('div', {
   }), _defineProperty(_$concat, "& .".concat(autocompleteClasses.input), {
     width: 0,
     minWidth: 30
-  }), _$concat)), _defineProperty(_extends3, '& .MuiInput-root', {
+  }), _$concat)), _defineProperty(_extends3, "& .".concat(inputClasses.root), {
     paddingBottom: 1,
     '& .MuiInput-input': {
       padding: '4px 4px 4px 0px'
     }
-  }), _defineProperty(_extends3, '& .MuiInput-root.MuiInputBase-sizeSmall', {
-    '& .MuiInput-input': {
-      padding: '2px 4px 3px 0'
-    }
-  }), _defineProperty(_extends3, '& .MuiOutlinedInput-root', (_MuiOutlinedInput = {
+  }), _defineProperty(_extends3, "& .".concat(inputClasses.root, ".").concat(inputBaseClasses.sizeSmall), _defineProperty({}, "& .".concat(inputClasses.input), {
+    padding: '2px 4px 3px 0'
+  })), _defineProperty(_extends3, "& .".concat(outlinedInputClasses.root), (_$concat2 = {
     padding: 9
-  }, _defineProperty(_MuiOutlinedInput, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
+  }, _defineProperty(_$concat2, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
     paddingRight: 26 + 4 + 9
-  }), _defineProperty(_MuiOutlinedInput, ".".concat(autocompleteClasses.hasPopupIcon, ".").concat(autocompleteClasses.hasClearIcon, "&"), {
+  }), _defineProperty(_$concat2, ".".concat(autocompleteClasses.hasPopupIcon, ".").concat(autocompleteClasses.hasClearIcon, "&"), {
     paddingRight: 52 + 4 + 9
-  }), _defineProperty(_MuiOutlinedInput, "& .".concat(autocompleteClasses.input), {
+  }), _defineProperty(_$concat2, "& .".concat(autocompleteClasses.input), {
     padding: '7.5px 4px 7.5px 6px'
-  }), _defineProperty(_MuiOutlinedInput, "& .".concat(autocompleteClasses.endAdornment), {
+  }), _defineProperty(_$concat2, "& .".concat(autocompleteClasses.endAdornment), {
     right: 9
-  }), _MuiOutlinedInput)), _defineProperty(_extends3, '& .MuiOutlinedInput-root.MuiInputBase-sizeSmall', _defineProperty({
+  }), _$concat2)), _defineProperty(_extends3, "& .".concat(outlinedInputClasses.root, ".").concat(inputBaseClasses.sizeSmall), _defineProperty({
     padding: 6
   }, "& .".concat(autocompleteClasses.input), {
     padding: '2.5px 4px 2.5px 6px'
-  })), _defineProperty(_extends3, '& .MuiFilledInput-root', (_MuiFilledInputRo = {
+  })), _defineProperty(_extends3, "& .".concat(filledInputClasses.root), (_$concat3 = {
     paddingTop: 19,
     paddingLeft: 8
-  }, _defineProperty(_MuiFilledInputRo, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
+  }, _defineProperty(_$concat3, ".".concat(autocompleteClasses.hasPopupIcon, "&, .").concat(autocompleteClasses.hasClearIcon, "&"), {
     paddingRight: 26 + 4 + 9
-  }), _defineProperty(_MuiFilledInputRo, ".".concat(autocompleteClasses.hasPopupIcon, ".").concat(autocompleteClasses.hasClearIcon, "&"), {
+  }), _defineProperty(_$concat3, ".".concat(autocompleteClasses.hasPopupIcon, ".").concat(autocompleteClasses.hasClearIcon, "&"), {
     paddingRight: 52 + 4 + 9
-  }), _defineProperty(_MuiFilledInputRo, '& .MuiFilledInput-input', {
+  }), _defineProperty(_$concat3, "& .".concat(filledInputClasses.input), {
     padding: '7px 4px'
-  }), _defineProperty(_MuiFilledInputRo, "& .".concat(autocompleteClasses.endAdornment), {
+  }), _defineProperty(_$concat3, "& .".concat(autocompleteClasses.endAdornment), {
     right: 9
-  }), _MuiFilledInputRo)), _defineProperty(_extends3, '& .MuiFilledInput-root.MuiInputBase-sizeSmall', {
-    paddingBottom: 1,
-    '& .MuiFilledInput-input': {
-      padding: '2.5px 4px'
-    }
+  }), _$concat3)), _defineProperty(_extends3, "& .".concat(filledInputClasses.root, ".").concat(inputBaseClasses.sizeSmall), _defineProperty({
+    paddingBottom: 1
+  }, "& .".concat(filledInputClasses.input), {
+    padding: '2.5px 4px'
+  })), _defineProperty(_extends3, "& .".concat(inputBaseClasses.hiddenLabel), {
+    paddingTop: 8
   }), _defineProperty(_extends3, "& .".concat(autocompleteClasses.input), _extends({
     flexGrow: 1,
     textOverflow: 'ellipsis',
@@ -239,7 +242,7 @@ var AutocompleteListbox = styled('div', {
     return styles.listbox;
   }
 })(function (_ref14) {
-  var _ariaSelectedTru, _$concat2;
+  var _ariaSelectedTru, _$concat4;
 
   var theme = _ref14.theme;
   return _defineProperty({
@@ -248,7 +251,7 @@ var AutocompleteListbox = styled('div', {
     padding: '8px 0',
     maxHeight: '40vh',
     overflow: 'auto'
-  }, "& .".concat(autocompleteClasses.option), (_$concat2 = {
+  }, "& .".concat(autocompleteClasses.option), (_$concat4 = {
     minHeight: 48,
     display: 'flex',
     overflow: 'hidden',
@@ -262,20 +265,20 @@ var AutocompleteListbox = styled('div', {
     paddingBottom: 6,
     paddingLeft: 16,
     paddingRight: 16
-  }, _defineProperty(_$concat2, theme.breakpoints.up('sm'), {
+  }, _defineProperty(_$concat4, theme.breakpoints.up('sm'), {
     minHeight: 'auto'
-  }), _defineProperty(_$concat2, "&.".concat(autocompleteClasses.focused), {
+  }), _defineProperty(_$concat4, "&.".concat(autocompleteClasses.focused), {
     backgroundColor: theme.palette.action.hover,
     // Reset on touch devices, it doesn't add specificity
     '@media (hover: none)': {
       backgroundColor: 'transparent'
     }
-  }), _defineProperty(_$concat2, '&[aria-disabled="true"]', {
+  }), _defineProperty(_$concat4, '&[aria-disabled="true"]', {
     opacity: theme.palette.action.disabledOpacity,
     pointerEvents: 'none'
-  }), _defineProperty(_$concat2, "&.".concat(autocompleteClasses.focusVisible), {
+  }), _defineProperty(_$concat4, "&.".concat(autocompleteClasses.focusVisible), {
     backgroundColor: theme.palette.action.focus
-  }), _defineProperty(_$concat2, '&[aria-selected="true"]', (_ariaSelectedTru = {
+  }), _defineProperty(_$concat4, '&[aria-selected="true"]', (_ariaSelectedTru = {
     backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
   }, _defineProperty(_ariaSelectedTru, "&.".concat(autocompleteClasses.focused), {
     backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
@@ -285,7 +288,7 @@ var AutocompleteListbox = styled('div', {
     }
   }), _defineProperty(_ariaSelectedTru, "&.".concat(autocompleteClasses.focusVisible), {
     backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
-  }), _ariaSelectedTru)), _$concat2));
+  }), _ariaSelectedTru)), _$concat4));
 });
 var AutocompleteGroupLabel = styled(ListSubheader, {
   name: 'MuiAutocomplete',
@@ -1071,7 +1074,7 @@ process.env.NODE_ENV !== "production" ? Autocomplete.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The value of the autocomplete.

package/legacy/Autocomplete/autocompleteClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAutocompleteUtilityClass(slot) {
   return generateUtilityClass('MuiAutocomplete', slot);
 }

package/legacy/Avatar/Avatar.js

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Person from '../internal/svg-icons/Person';
@@ -258,7 +258,7 @@ process.env.NODE_ENV !== "production" ? Avatar.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The shape of the avatar.

package/legacy/Avatar/avatarClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAvatarUtilityClass(slot) {
   return generateUtilityClass('MuiAvatar', slot);
 }

package/legacy/AvatarGroup/AvatarGroup.js

@@ -6,10 +6,10 @@ import PropTypes from 'prop-types';
 import { isFragment } from 'react-is';
 import clsx from 'clsx';
 import { chainPropTypes } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
-import Avatar from '../Avatar';
+import Avatar, { avatarClasses } from '../Avatar';
 import avatarGroupClasses, { getAvatarGroupUtilityClass } from './avatarGroupClasses';
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var SPACINGS = {
@@ -36,7 +36,7 @@ var AvatarGroupRoot = styled('div', {
   var _ref2;
 
   var theme = _ref.theme;
-  return _ref2 = {}, _defineProperty(_ref2, "& .MuiAvatar-root", {
+  return _ref2 = {}, _defineProperty(_ref2, "& .".concat(avatarClasses.root), {
     border: "2px solid ".concat(theme.palette.background.default),
     boxSizing: 'content-box',
     marginLeft: -8,
@@ -166,7 +166,7 @@ process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The variant to use.

package/legacy/AvatarGroup/avatarGroupClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getAvatarGroupUtilityClass(slot) {
   return generateUtilityClass('MuiAvatarGroup', slot);
 }

package/legacy/Backdrop/Backdrop.js

@@ -2,8 +2,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { isHostComponent } from '@mui/core';
-import BackdropUnstyled, { backdropUnstyledClasses } from '@mui/core/BackdropUnstyled';
+import { isHostComponent } from '@mui/base';
+import BackdropUnstyled, { backdropUnstyledClasses } from '@mui/base/BackdropUnstyled';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Fade from '../Fade';
@@ -140,7 +140,7 @@ process.env.NODE_ENV !== "production" ? Backdrop.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The duration for the transition, in milliseconds.

package/legacy/Badge/Badge.js

@@ -5,8 +5,8 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { usePreviousProps } from '@mui/utils';
-import { generateUtilityClasses, isHostComponent } from '@mui/core';
-import BadgeUnstyled, { badgeUnstyledClasses, getBadgeUtilityClass } from '@mui/core/BadgeUnstyled';
+import { generateUtilityClasses, isHostComponent } from '@mui/base';
+import BadgeUnstyled, { badgeUnstyledClasses, getBadgeUtilityClass } from '@mui/base/BadgeUnstyled';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
@@ -293,7 +293,7 @@ process.env.NODE_ENV !== "production" ? Badge.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The variant to use.