@mui/material 5.10.9 → 5.10.11

package/Popper/Popper.js

@@ -9,6 +9,8 @@ exports.default = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
 var _PopperUnstyled = _interopRequireDefault(require("@mui/base/PopperUnstyled"));
 
 var _system = require("@mui/system");
@@ -23,6 +25,8 @@ var _styles = require("../styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+const _excluded = ["components", "componentsProps", "slots", "slotProps"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -46,14 +50,30 @@ const PopperRoot = (0, _styles.styled)(_PopperUnstyled.default, {
  */
 
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
+  var _slots$root;
+
   const theme = (0, _system.useThemeWithoutDefault)();
-  const props = (0, _styles.useThemeProps)({
+
+  const _useThemeProps = (0, _styles.useThemeProps)({
     props: inProps,
     name: 'MuiPopper'
-  });
+  }),
+        {
+    components,
+    componentsProps,
+    slots,
+    slotProps
+  } = _useThemeProps,
+        other = (0, _objectWithoutPropertiesLoose2.default)(_useThemeProps, _excluded);
+
+  const RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(PopperRoot, (0, _extends2.default)({
-    direction: theme == null ? void 0 : theme.direction
-  }, props, {
+    direction: theme == null ? void 0 : theme.direction,
+    slots: {
+      root: RootComponent
+    },
+    slotProps: slotProps != null ? slotProps : componentsProps
+  }, other, {
     ref: ref
   }));
 });
@@ -179,6 +199,23 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes
    */
   popperRef: _utils.refType,
 
+  /**
+   * The props used for each slot inside the Popper.
+   * @default {}
+   */
+  slotProps: _propTypes.default.shape({
+    root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
+  }),
+
+  /**
+   * The components used for each slot inside the Popper.
+   * Either a string to use a HTML element or a component.
+   * @default {}
+   */
+  slots: _propTypes.default.shape({
+    root: _propTypes.default.elementType
+  }),
+
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/README.md

@@ -7,7 +7,7 @@
 
 **MUI Core** contains foundational React UI component libraries for shipping new features faster.
 
-- [_Material UI_](https://mui.com/material-ui/getting-started/overview/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://material.io/design/introduction/) system.
+- [_Material UI_](https://mui.com/material-ui/getting-started/overview/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system.
 
 - [_Joy UI_](https://mui.com/joy-ui/getting-started/overview/) is a beautifully designed library of React UI components.
 

package/Radio/Radio.d.ts

@@ -55,7 +55,7 @@ export interface RadioProps
  *
  * Demos:
  *
- * - [Radio button](https://mui.com/material-ui/react-radio-button/)
+ * - [Radio Group](https://mui.com/material-ui/react-radio-button/)
  *
  * API:
  *

package/Radio/radioClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getRadioUtilityClass = getRadioUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getRadioUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiRadio', slot);
+  return (0, _generateUtilityClass.default)('MuiRadio', slot);
 }
 
-const radioClasses = (0, _base.generateUtilityClasses)('MuiRadio', ['root', 'checked', 'disabled', 'colorPrimary', 'colorSecondary']);
+const radioClasses = (0, _utils.unstable_generateUtilityClasses)('MuiRadio', ['root', 'checked', 'disabled', 'colorPrimary', 'colorSecondary']);
 var _default = radioClasses;
 exports.default = _default;

package/RadioGroup/RadioGroup.d.ts

@@ -31,7 +31,7 @@ export type RadioGroupClassKey = keyof NonNullable<RadioGroupProps['classes']>;
  *
  * Demos:
  *
- * - [Radio button](https://mui.com/material-ui/react-radio-button/)
+ * - [Radio Group](https://mui.com/material-ui/react-radio-button/)
  *
  * API:
  *

package/Rating/ratingClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getRatingUtilityClass = getRatingUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getRatingUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiRating', slot);
+  return (0, _generateUtilityClass.default)('MuiRating', slot);
 }
 
-const ratingClasses = (0, _base.generateUtilityClasses)('MuiRating', ['root', 'sizeSmall', 'sizeMedium', 'sizeLarge', 'readOnly', 'disabled', 'focusVisible', 'visuallyHidden', 'pristine', 'label', 'labelEmptyValueActive', 'icon', 'iconEmpty', 'iconFilled', 'iconHover', 'iconFocus', 'iconActive', 'decimal']);
+const ratingClasses = (0, _utils.unstable_generateUtilityClasses)('MuiRating', ['root', 'sizeSmall', 'sizeMedium', 'sizeLarge', 'readOnly', 'disabled', 'focusVisible', 'visuallyHidden', 'pristine', 'label', 'labelEmptyValueActive', 'icon', 'iconEmpty', 'iconFilled', 'iconHover', 'iconFocus', 'iconActive', 'decimal']);
 var _default = ratingClasses;
 exports.default = _default;

package/ScopedCssBaseline/scopedCssBaselineClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getScopedCssBaselineUtilityClass = getScopedCssBaselineUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getScopedCssBaselineUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiScopedCssBaseline', slot);
+  return (0, _generateUtilityClass.default)('MuiScopedCssBaseline', slot);
 }
 
-const scopedCssBaselineClasses = (0, _base.generateUtilityClasses)('MuiScopedCssBaseline', ['root']);
+const scopedCssBaselineClasses = (0, _utils.unstable_generateUtilityClasses)('MuiScopedCssBaseline', ['root']);
 var _default = scopedCssBaselineClasses;
 exports.default = _default;

package/Select/selectClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSelectUtilityClasses = getSelectUtilityClasses;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSelectUtilityClasses(slot) {
-  return (0, _base.generateUtilityClass)('MuiSelect', slot);
+  return (0, _generateUtilityClass.default)('MuiSelect', slot);
 }
 
-const selectClasses = (0, _base.generateUtilityClasses)('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
+const selectClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
 var _default = selectClasses;
 exports.default = _default;

package/Skeleton/skeletonClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSkeletonUtilityClass = getSkeletonUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSkeletonUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSkeleton', slot);
+  return (0, _generateUtilityClass.default)('MuiSkeleton', slot);
 }
 
-const skeletonClasses = (0, _base.generateUtilityClasses)('MuiSkeleton', ['root', 'text', 'rectangular', 'rounded', 'circular', 'pulse', 'wave', 'withChildren', 'fitContent', 'heightAuto']);
+const skeletonClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSkeleton', ['root', 'text', 'rectangular', 'rounded', 'circular', 'pulse', 'wave', 'withChildren', 'fitContent', 'heightAuto']);
 var _default = skeletonClasses;
 exports.default = _default;

package/Slider/Slider.d.ts

@@ -26,6 +26,22 @@ export type SliderTypeMap<
      * @default 'primary'
      */
     color?: OverridableStringUnion<'primary' | 'secondary', SliderPropsColorOverrides>;
+    /**
+     * The components used for each slot inside the Slider.
+     * Either a string to use a HTML element or a component.
+     * @default {}
+     */
+    components?: {
+      Root?: React.ElementType;
+      Track?: React.ElementType;
+      Rail?: React.ElementType;
+      Thumb?: React.ElementType;
+      Mark?: React.ElementType;
+      MarkLabel?: React.ElementType;
+      ValueLabel?: React.ElementType;
+      Input?: React.ElementType;
+    };
+    componentsProps?: SliderUnstyledTypeMap['props']['slotProps'];
     /**
      * Override or extend the styles applied to the component.
      */

package/Slider/Slider.js

@@ -19,8 +19,6 @@ var _clsx = _interopRequireDefault(require("clsx"));
 
 var _utils = require("@mui/utils");
 
-var _base = require("@mui/base");
-
 var _SliderUnstyled = _interopRequireWildcard(require("@mui/base/SliderUnstyled"));
 
 var _system = require("@mui/system");
@@ -37,13 +35,13 @@ var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["component", "components", "componentsProps", "color", "size"];
+const _excluded = ["component", "components", "componentsProps", "color", "size", "slotProps", "slots"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const sliderClasses = (0, _extends2.default)({}, _SliderUnstyled.sliderUnstyledClasses, (0, _base.generateUtilityClasses)('MuiSlider', ['colorPrimary', 'colorSecondary', 'thumbColorPrimary', 'thumbColorSecondary', 'sizeSmall', 'thumbSizeSmall']));
+const sliderClasses = (0, _extends2.default)({}, _SliderUnstyled.sliderUnstyledClasses, (0, _utils.unstable_generateUtilityClasses)('MuiSlider', ['colorPrimary', 'colorSecondary', 'thumbColorPrimary', 'thumbColorSecondary', 'sizeSmall', 'thumbSizeSmall']));
 exports.sliderClasses = sliderClasses;
 const SliderRoot = (0, _styled.default)('span', {
   name: 'MuiSlider',
@@ -463,7 +461,7 @@ const extendUtilityClasses = ownerState => {
 };
 
 const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
-  var _componentsProps$root, _componentsProps$thum, _componentsProps$trac, _componentsProps$valu;
+  var _ref, _slots$root, _ref2, _slots$rail, _ref3, _slots$track, _ref4, _slots$thumb, _ref5, _slots$valueLabel, _ref6, _slots$mark, _ref7, _slots$markLabel, _slots$input, _slotProps$root, _slotProps$rail, _slotProps$track, _slotProps$thumb, _slotProps$valueLabel, _slotProps$mark, _slotProps$markLabel, _slotProps$input;
 
   const props = (0, _useThemeProps.default)({
     props: inputProps,
@@ -477,51 +475,75 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     components = {},
     componentsProps = {},
     color = 'primary',
-    size = 'medium'
+    size = 'medium',
+    slotProps,
+    slots
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const ownerState = (0, _extends2.default)({}, props, {
     color,
     size
   });
-  const classes = extendUtilityClasses(ownerState);
+  const classes = extendUtilityClasses(ownerState); // support both `slots` and `components` for backward compatibility
+
+  const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : SliderRoot;
+  const RailSlot = (_ref2 = (_slots$rail = slots == null ? void 0 : slots.rail) != null ? _slots$rail : components.Rail) != null ? _ref2 : SliderRail;
+  const TrackSlot = (_ref3 = (_slots$track = slots == null ? void 0 : slots.track) != null ? _slots$track : components.Track) != null ? _ref3 : SliderTrack;
+  const ThumbSlot = (_ref4 = (_slots$thumb = slots == null ? void 0 : slots.thumb) != null ? _slots$thumb : components.Thumb) != null ? _ref4 : SliderThumb;
+  const ValueLabelSlot = (_ref5 = (_slots$valueLabel = slots == null ? void 0 : slots.valueLabel) != null ? _slots$valueLabel : components.ValueLabel) != null ? _ref5 : SliderValueLabel;
+  const MarkSlot = (_ref6 = (_slots$mark = slots == null ? void 0 : slots.mark) != null ? _slots$mark : components.Mark) != null ? _ref6 : SliderMark;
+  const MarkLabelSlot = (_ref7 = (_slots$markLabel = slots == null ? void 0 : slots.markLabel) != null ? _slots$markLabel : components.MarkLabel) != null ? _ref7 : SliderMarkLabel;
+  const InputSlot = (_slots$input = slots == null ? void 0 : slots.input) != null ? _slots$input : components.Input;
+  const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
+  const railSlotProps = (_slotProps$rail = slotProps == null ? void 0 : slotProps.rail) != null ? _slotProps$rail : componentsProps.rail;
+  const trackSlotProps = (_slotProps$track = slotProps == null ? void 0 : slotProps.track) != null ? _slotProps$track : componentsProps.track;
+  const thumbSlotProps = (_slotProps$thumb = slotProps == null ? void 0 : slotProps.thumb) != null ? _slotProps$thumb : componentsProps.thumb;
+  const valueLabelSlotProps = (_slotProps$valueLabel = slotProps == null ? void 0 : slotProps.valueLabel) != null ? _slotProps$valueLabel : componentsProps.valueLabel;
+  const markSlotProps = (_slotProps$mark = slotProps == null ? void 0 : slotProps.mark) != null ? _slotProps$mark : componentsProps.mark;
+  const markLabelSlotProps = (_slotProps$markLabel = slotProps == null ? void 0 : slotProps.markLabel) != null ? _slotProps$markLabel : componentsProps.markLabel;
+  const inputSlotProps = (_slotProps$input = slotProps == null ? void 0 : slotProps.input) != null ? _slotProps$input : componentsProps.input;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SliderUnstyled.default, (0, _extends2.default)({}, other, {
     isRtl: isRtl,
-    components: (0, _extends2.default)({
-      Root: SliderRoot,
-      Rail: SliderRail,
-      Track: SliderTrack,
-      Thumb: SliderThumb,
-      ValueLabel: SliderValueLabel,
-      Mark: SliderMark,
-      MarkLabel: SliderMarkLabel
-    }, components),
-    componentsProps: (0, _extends2.default)({}, componentsProps, {
-      root: (0, _extends2.default)({}, componentsProps.root, (0, _shouldSpreadAdditionalProps.default)(components.Root) && {
+    slots: {
+      root: RootSlot,
+      rail: RailSlot,
+      track: TrackSlot,
+      thumb: ThumbSlot,
+      valueLabel: ValueLabelSlot,
+      mark: MarkSlot,
+      markLabel: MarkLabelSlot,
+      input: InputSlot
+    },
+    slotProps: (0, _extends2.default)({}, componentsProps, {
+      root: (0, _extends2.default)({}, rootSlotProps, (0, _shouldSpreadAdditionalProps.default)(RootSlot) && {
         as: component,
-        ownerState: (0, _extends2.default)({}, (_componentsProps$root = componentsProps.root) == null ? void 0 : _componentsProps$root.ownerState, {
+        ownerState: (0, _extends2.default)({}, rootSlotProps == null ? void 0 : rootSlotProps.ownerState, {
           color,
           size
         })
       }),
-      thumb: (0, _extends2.default)({}, componentsProps.thumb, (0, _shouldSpreadAdditionalProps.default)(components.Thumb) && {
-        ownerState: (0, _extends2.default)({}, (_componentsProps$thum = componentsProps.thumb) == null ? void 0 : _componentsProps$thum.ownerState, {
+      rail: railSlotProps,
+      thumb: (0, _extends2.default)({}, thumbSlotProps, (0, _shouldSpreadAdditionalProps.default)(ThumbSlot) && {
+        ownerState: (0, _extends2.default)({}, thumbSlotProps == null ? void 0 : thumbSlotProps.ownerState, {
           color,
           size
         })
       }),
-      track: (0, _extends2.default)({}, componentsProps.track, (0, _shouldSpreadAdditionalProps.default)(components.Track) && {
-        ownerState: (0, _extends2.default)({}, (_componentsProps$trac = componentsProps.track) == null ? void 0 : _componentsProps$trac.ownerState, {
+      track: (0, _extends2.default)({}, trackSlotProps, (0, _shouldSpreadAdditionalProps.default)(TrackSlot) && {
+        ownerState: (0, _extends2.default)({}, trackSlotProps == null ? void 0 : trackSlotProps.ownerState, {
           color,
           size
         })
       }),
-      valueLabel: (0, _extends2.default)({}, componentsProps.valueLabel, (0, _shouldSpreadAdditionalProps.default)(components.ValueLabel) && {
-        ownerState: (0, _extends2.default)({}, (_componentsProps$valu = componentsProps.valueLabel) == null ? void 0 : _componentsProps$valu.ownerState, {
+      valueLabel: (0, _extends2.default)({}, valueLabelSlotProps, (0, _shouldSpreadAdditionalProps.default)(ValueLabelSlot) && {
+        ownerState: (0, _extends2.default)({}, valueLabelSlotProps == null ? void 0 : valueLabelSlotProps.ownerState, {
           color,
           size
         })
-      })
+      }),
+      mark: markSlotProps,
+      markLabel: markLabelSlotProps,
+      input: inputSlotProps
     }),
     classes: classes,
     ref: ref
@@ -603,8 +625,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
   }),
 
   /**
-   * The props used for each slot inside the Slider.
-   * @default {}
+   * @ignore
    */
   componentsProps: _propTypes.default.shape({
     input: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
@@ -617,9 +638,6 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
     valueLabel: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
       children: _propTypes.default.element,
       className: _propTypes.default.string,
-      components: _propTypes.default.shape({
-        Root: _propTypes.default.elementType
-      }),
       open: _propTypes.default.bool,
       style: _propTypes.default.object,
       value: _propTypes.default.number,
@@ -736,6 +754,44 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes
   /* @typescript-to-proptypes-ignore */
   .oneOfType([_propTypes.default.oneOf(['small', 'medium']), _propTypes.default.string]),
 
+  /**
+   * The props used for each slot inside the Slider.
+   * @default {}
+   */
+  slotProps: _propTypes.default.shape({
+    input: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    mark: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    markLabel: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    rail: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    thumb: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    track: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+    valueLabel: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
+      children: _propTypes.default.element,
+      className: _propTypes.default.string,
+      open: _propTypes.default.bool,
+      style: _propTypes.default.object,
+      value: _propTypes.default.number,
+      valueLabelDisplay: _propTypes.default.oneOf(['auto', 'off', 'on'])
+    })])
+  }),
+
+  /**
+   * The components used for each slot inside the Slider.
+   * Either a string to use a HTML element or a component.
+   * @default {}
+   */
+  slots: _propTypes.default.shape({
+    input: _propTypes.default.elementType,
+    mark: _propTypes.default.elementType,
+    markLabel: _propTypes.default.elementType,
+    rail: _propTypes.default.elementType,
+    root: _propTypes.default.elementType,
+    thumb: _propTypes.default.elementType,
+    track: _propTypes.default.elementType,
+    valueLabel: _propTypes.default.elementType
+  }),
+
   /**
    * The granularity with which the slider can step through values. (A "discrete" slider.)
    * The `min` prop serves as the origin for the valid values.

package/Snackbar/snackbarClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSnackbarUtilityClass = getSnackbarUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSnackbarUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSnackbar', slot);
+  return (0, _generateUtilityClass.default)('MuiSnackbar', slot);
 }
 
-const snackbarClasses = (0, _base.generateUtilityClasses)('MuiSnackbar', ['root', 'anchorOriginTopCenter', 'anchorOriginBottomCenter', 'anchorOriginTopRight', 'anchorOriginBottomRight', 'anchorOriginTopLeft', 'anchorOriginBottomLeft']);
+const snackbarClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSnackbar', ['root', 'anchorOriginTopCenter', 'anchorOriginBottomCenter', 'anchorOriginTopRight', 'anchorOriginBottomRight', 'anchorOriginTopLeft', 'anchorOriginBottomLeft']);
 var _default = snackbarClasses;
 exports.default = _default;

package/SnackbarContent/snackbarContentClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSnackbarContentUtilityClass = getSnackbarContentUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSnackbarContentUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSnackbarContent', slot);
+  return (0, _generateUtilityClass.default)('MuiSnackbarContent', slot);
 }
 
-const snackbarContentClasses = (0, _base.generateUtilityClasses)('MuiSnackbarContent', ['root', 'message', 'action']);
+const snackbarContentClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSnackbarContent', ['root', 'message', 'action']);
 var _default = snackbarContentClasses;
 exports.default = _default;

package/SpeedDial/SpeedDial.d.ts

@@ -96,7 +96,7 @@ export interface SpeedDialProps
  *
  * Demos:
  *
- * - [Speed dial](https://mui.com/material-ui/react-speed-dial/)
+ * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/)
  *
  * API:
  *

package/SpeedDial/speedDialClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSpeedDialUtilityClass = getSpeedDialUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSpeedDialUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSpeedDial', slot);
+  return (0, _generateUtilityClass.default)('MuiSpeedDial', slot);
 }
 
-const speedDialClasses = (0, _base.generateUtilityClasses)('MuiSpeedDial', ['root', 'fab', 'directionUp', 'directionDown', 'directionLeft', 'directionRight', 'actions', 'actionsClosed']);
+const speedDialClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSpeedDial', ['root', 'fab', 'directionUp', 'directionDown', 'directionLeft', 'directionRight', 'actions', 'actionsClosed']);
 var _default = speedDialClasses;
 exports.default = _default;

package/SpeedDialAction/SpeedDialAction.d.ts

@@ -53,7 +53,7 @@ export interface SpeedDialActionProps extends StandardProps<Partial<TooltipProps
  *
  * Demos:
  *
- * - [Speed dial](https://mui.com/material-ui/react-speed-dial/)
+ * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/)
  *
  * API:
  *

package/SpeedDialAction/speedDialActionClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSpeedDialActionUtilityClass = getSpeedDialActionUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSpeedDialActionUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSpeedDialAction', slot);
+  return (0, _generateUtilityClass.default)('MuiSpeedDialAction', slot);
 }
 
-const speedDialActionClasses = (0, _base.generateUtilityClasses)('MuiSpeedDialAction', ['fab', 'fabClosed', 'staticTooltip', 'staticTooltipClosed', 'staticTooltipLabel', 'tooltipPlacementLeft', 'tooltipPlacementRight']);
+const speedDialActionClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSpeedDialAction', ['fab', 'fabClosed', 'staticTooltip', 'staticTooltipClosed', 'staticTooltipLabel', 'tooltipPlacementLeft', 'tooltipPlacementRight']);
 var _default = speedDialActionClasses;
 exports.default = _default;

package/SpeedDialIcon/SpeedDialIcon.d.ts

@@ -33,7 +33,7 @@ export interface SpeedDialIconProps
  *
  * Demos:
  *
- * - [Speed dial](https://mui.com/material-ui/react-speed-dial/)
+ * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/)
  *
  * API:
  *

package/SpeedDialIcon/speedDialIconClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getSpeedDialIconUtilityClass = getSpeedDialIconUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getSpeedDialIconUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiSpeedDialIcon', slot);
+  return (0, _generateUtilityClass.default)('MuiSpeedDialIcon', slot);
 }
 
-const speedDialIconClasses = (0, _base.generateUtilityClasses)('MuiSpeedDialIcon', ['root', 'icon', 'iconOpen', 'iconWithOpenIconOpen', 'openIcon', 'openIconOpen']);
+const speedDialIconClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSpeedDialIcon', ['root', 'icon', 'iconOpen', 'iconWithOpenIconOpen', 'openIcon', 'openIconOpen']);
 var _default = speedDialIconClasses;
 exports.default = _default;

package/Step/stepClasses.js

@@ -1,17 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.getStepUtilityClass = getStepUtilityClass;
 
-var _base = require("@mui/base");
+var _utils = require("@mui/utils");
+
+var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
 
 function getStepUtilityClass(slot) {
-  return (0, _base.generateUtilityClass)('MuiStep', slot);
+  return (0, _generateUtilityClass.default)('MuiStep', slot);
 }
 
-const stepClasses = (0, _base.generateUtilityClasses)('MuiStep', ['root', 'horizontal', 'vertical', 'alternativeLabel', 'completed']);
+const stepClasses = (0, _utils.unstable_generateUtilityClasses)('MuiStep', ['root', 'horizontal', 'vertical', 'alternativeLabel', 'completed']);
 var _default = stepClasses;
 exports.default = _default;