@mui/material 6.4.4 → 7.0.0-alpha.0

package/Popover/Popover.js

@@ -15,12 +15,12 @@ import { useDefaultProps } from "../DefaultPropsProvider/index.js";
 import debounce from "../utils/debounce.js";
 import ownerDocument from "../utils/ownerDocument.js";
 import ownerWindow from "../utils/ownerWindow.js";
-import useForkRef from "../utils/useForkRef.js";
 import Grow from "../Grow/index.js";
 import Modal from "../Modal/index.js";
 import PaperBase from "../Paper/index.js";
 import { getPopoverUtilityClass } from "./popoverClasses.js";
 import useSlot from "../utils/useSlot.js";
+import { mergeSlotProps } from "../utils/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export function getOffsetTop(rect, vertical) {
   let offset = 0;
@@ -103,22 +103,21 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     marginThreshold = 16,
     open,
     PaperProps: PaperPropsProp = {},
+    // TODO: remove in v7
     slots = {},
     slotProps = {},
     transformOrigin = {
       vertical: 'top',
       horizontal: 'left'
     },
-    TransitionComponent = Grow,
+    TransitionComponent,
+    // TODO: remove in v7
     transitionDuration: transitionDurationProp = 'auto',
-    TransitionProps: {
-      onEntering,
-      ...TransitionProps
-    } = {},
+    TransitionProps = {},
+    // TODO: remove in v7
     disableScrollLock = false,
     ...other
   } = props;
-  const externalPaperSlotProps = slotProps?.paper ?? PaperPropsProp;
   const paperRef = React.useRef();
   const ownerState = {
     ...props,
@@ -126,7 +125,6 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     anchorReference,
     elevation,
     marginThreshold,
-    externalPaperSlotProps,
     transformOrigin,
     TransitionComponent,
     transitionDuration: transitionDurationProp,
@@ -255,10 +253,7 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     }
     return () => window.removeEventListener('scroll', setPositioningStyles);
   }, [anchorEl, disableScrollLock, setPositioningStyles]);
-  const handleEntering = (element, isAppearing) => {
-    if (onEntering) {
-      onEntering(element, isAppearing);
-    }
+  const handleEntering = () => {
     setPositioningStyles();
   };
   const handleExited = () => {
@@ -289,45 +284,65 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     };
   }, [anchorEl, open, setPositioningStyles]);
   let transitionDuration = transitionDurationProp;
-  if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
-    transitionDuration = undefined;
-  }
-
-  // If the container prop is provided, use that
-  // If the anchorEl prop is provided, use its parent body element as the container
-  // If neither are provided let the Modal take care of choosing the container
-  const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
   const externalForwardedProps = {
-    slots,
+    slots: {
+      transition: TransitionComponent,
+      ...slots
+    },
     slotProps: {
-      ...slotProps,
-      paper: externalPaperSlotProps
+      transition: TransitionProps,
+      paper: PaperPropsProp,
+      ...slotProps
     }
   };
-  const [PaperSlot, paperProps] = useSlot('paper', {
-    elementType: PopoverPaper,
+  const [TransitionSlot, transitionSlotProps] = useSlot('transition', {
+    elementType: Grow,
     externalForwardedProps,
-    additionalProps: {
-      elevation,
-      className: clsx(classes.paper, externalPaperSlotProps?.className),
-      style: isPositioned ? externalPaperSlotProps.style : {
-        ...externalPaperSlotProps.style,
-        opacity: 0
+    ownerState,
+    getSlotProps: handlers => ({
+      ...handlers,
+      onEntering: (element, isAppearing) => {
+        handlers.onEntering?.(element, isAppearing);
+        handleEntering();
+      },
+      onExited: element => {
+        handlers.onExited?.(element);
+        handleExited();
       }
-    },
-    ownerState
+    }),
+    additionalProps: {
+      appear: true,
+      in: open
+    }
   });
+  if (transitionDurationProp === 'auto' && !TransitionSlot.muiSupportAuto) {
+    transitionDuration = undefined;
+  }
+
+  // If the container prop is provided, use that
+  // If the anchorEl prop is provided, use its parent body element as the container
+  // If neither are provided let the Modal take care of choosing the container
+  const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
   const [RootSlot, {
+    slots: rootSlotsProp,
     slotProps: rootSlotPropsProp,
     ...rootProps
   }] = useSlot('root', {
+    ref,
     elementType: PopoverRoot,
-    externalForwardedProps,
+    externalForwardedProps: {
+      ...externalForwardedProps,
+      ...other
+    },
+    shouldForwardComponentProp: true,
     additionalProps: {
+      slots: {
+        backdrop: slots.backdrop
+      },
       slotProps: {
-        backdrop: {
+        backdrop: mergeSlotProps(typeof slotProps.backdrop === 'function' ? slotProps.backdrop(ownerState) : slotProps.backdrop, {
           invisible: true
-        }
+        })
       },
       container,
       open
@@ -335,25 +350,32 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     ownerState,
     className: clsx(classes.root, className)
   });
-  const handlePaperRef = useForkRef(paperRef, paperProps.ref);
+  const [PaperSlot, paperProps] = useSlot('paper', {
+    ref: paperRef,
+    className: classes.paper,
+    elementType: PopoverPaper,
+    externalForwardedProps,
+    shouldForwardComponentProp: true,
+    additionalProps: {
+      elevation,
+      style: isPositioned ? undefined : {
+        opacity: 0
+      }
+    },
+    ownerState
+  });
   return /*#__PURE__*/_jsx(RootSlot, {
     ...rootProps,
     ...(!isHostComponent(RootSlot) && {
+      slots: rootSlotsProp,
       slotProps: rootSlotPropsProp,
       disableScrollLock
     }),
-    ...other,
-    ref: ref,
-    children: /*#__PURE__*/_jsx(TransitionComponent, {
-      appear: true,
-      in: open,
-      onEntering: handleEntering,
-      onExited: handleExited,
+    children: /*#__PURE__*/_jsx(TransitionSlot, {
+      ...transitionSlotProps,
       timeout: transitionDuration,
-      ...TransitionProps,
       children: /*#__PURE__*/_jsx(PaperSlot, {
         ...paperProps,
-        ref: handlePaperRef,
         children: children
       })
     })
@@ -421,8 +443,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
   anchorReference: PropTypes.oneOf(['anchorEl', 'anchorPosition', 'none']),
   /**
    * A backdrop component. This prop enables custom backdrop rendering.
-   * @deprecated Use `slotProps.root.slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.
-   * Use the `slotProps.root.slots.backdrop` prop to make your application ready for the next version of Material UI.
+   * @deprecated Use `slots.backdrop` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default styled(Backdrop, {
    *   name: 'MuiModal',
    *   slot: 'Backdrop',
@@ -436,7 +457,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
   BackdropComponent: PropTypes.elementType,
   /**
    * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element.
-   * @deprecated Use `slotProps.root.slotProps.backdrop` instead.
+   * @deprecated Use `slotProps.backdrop` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   BackdropProps: PropTypes.object,
   /**
@@ -500,16 +521,20 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
    * @default {}
    */
   slotProps: PropTypes.shape({
+    backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
     paper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
-    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    transition: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
   }),
   /**
    * The components used for each slot inside.
    * @default {}
    */
   slots: PropTypes.shape({
+    backdrop: PropTypes.elementType,
     paper: PropTypes.elementType,
-    root: PropTypes.elementType
+    root: PropTypes.elementType,
+    transition: PropTypes.elementType
   }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
@@ -534,6 +559,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
   /**
    * The component used for the transition.
    * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @deprecated use the `slots.transition` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default Grow
    */
   TransitionComponent: PropTypes.elementType,
@@ -549,6 +575,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
   /**
    * Props applied to the transition element.
    * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   * @deprecated use the `slotProps.transition` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default {}
    */
   TransitionProps: PropTypes.object

package/Popper/Popper.d.ts

@@ -34,13 +34,13 @@ export interface PopperProps extends Omit<BasePopperProps, 'direction'> {
  *
  * Demos:
  *
- * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- * - [Popper](https://mui.com/material-ui/react-popper/)
+ * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/)
+ * - [Menu](https://next.mui.com/material-ui/react-menu/)
+ * - [Popper](https://next.mui.com/material-ui/react-popper/)
  *
  * API:
  *
- * - [Popper API](https://mui.com/material-ui/api/popper/)
+ * - [Popper API](https://next.mui.com/material-ui/api/popper/)
  */
 declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<HTMLDivElement>>;
 export default Popper;

package/Popper/Popper.js

@@ -19,13 +19,13 @@ const PopperRoot = styled(BasePopper, {
  *
  * Demos:
  *
- * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- * - [Popper](https://mui.com/material-ui/react-popper/)
+ * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/)
+ * - [Menu](https://next.mui.com/material-ui/react-menu/)
+ * - [Popper](https://next.mui.com/material-ui/react-popper/)
  *
  * API:
  *
- * - [Popper API](https://mui.com/material-ui/api/popper/)
+ * - [Popper API](https://next.mui.com/material-ui/api/popper/)
  */
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   const isRtl = useRtl();

package/Portal/Portal.d.ts

@@ -6,11 +6,11 @@ import { PortalProps } from './Portal.types';
  *
  * Demos:
  *
- * - [Portal](https://mui.com/material-ui/react-portal/)
+ * - [Portal](https://next.mui.com/material-ui/react-portal/)
  *
  * API:
  *
- * - [Portal API](https://mui.com/material-ui/api/portal/)
+ * - [Portal API](https://next.mui.com/material-ui/api/portal/)
  */
 declare const Portal: React.ForwardRefExoticComponent<PortalProps & React.RefAttributes<Element>>;
 export default Portal;

package/Portal/Portal.js

@@ -14,11 +14,11 @@ function getContainer(container) {
  *
  * Demos:
  *
- * - [Portal](https://mui.com/material-ui/react-portal/)
+ * - [Portal](https://next.mui.com/material-ui/react-portal/)
  *
  * API:
  *
- * - [Portal API](https://mui.com/material-ui/api/portal/)
+ * - [Portal API](https://next.mui.com/material-ui/api/portal/)
  */
 const Portal = /*#__PURE__*/React.forwardRef(function Portal(props, forwardedRef) {
   const {

package/README.md

@@ -1,6 +1,7 @@
+<!-- #default-branch-switch -->
 <!-- markdownlint-disable-next-line -->
 <p align="center">
-  <a href="https://mui.com/material-ui/" rel="noopener" target="_blank"><img width="150" height="133" src="https://mui.com/static/logo.svg" alt="Material UI logo"></a>
+  <a href="https://next.mui.com/material-ui/" rel="noopener" target="_blank"><img width="150" height="133" src="https://mui.com/static/logo.svg" alt="Material UI logo"></a>
 </p>
 
 <h1 align="center">Material UI</h1>
@@ -14,12 +15,12 @@ Install the package in your project directory with:
 <!-- #default-branch-switch -->
 
 ```bash
-npm install @mui/material @emotion/react @emotion/styled
+npm install @mui/material@next @emotion/react @emotion/styled
 ```
 
 ## Documentation
 
-Visit [https://mui.com/material-ui/](https://mui.com/material-ui/) to view the full documentation.
+Visit [https://next.mui.com/material-ui/](https://next.mui.com/material-ui/) to view the full documentation.
 
 ## Questions
 

package/Radio/Radio.d.ts

@@ -55,11 +55,11 @@ export interface RadioProps
  *
  * Demos:
  *
- * - [Radio Group](https://mui.com/material-ui/react-radio-button/)
+ * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/)
  *
  * API:
  *
- * - [Radio API](https://mui.com/material-ui/api/radio/)
- * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/)
+ * - [Radio API](https://next.mui.com/material-ui/api/radio/)
+ * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
  */
 export default function Radio(props: RadioProps): React.JSX.Element;

package/RadioGroup/RadioGroup.d.ts

@@ -29,11 +29,11 @@ export interface RadioGroupProps extends Omit<FormGroupProps, 'onChange'> {
  *
  * Demos:
  *
- * - [Radio Group](https://mui.com/material-ui/react-radio-button/)
+ * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/)
  *
  * API:
  *
- * - [RadioGroup API](https://mui.com/material-ui/api/radio-group/)
- * - inherits [FormGroup API](https://mui.com/material-ui/api/form-group/)
+ * - [RadioGroup API](https://next.mui.com/material-ui/api/radio-group/)
+ * - inherits [FormGroup API](https://next.mui.com/material-ui/api/form-group/)
  */
 export default function RadioGroup(props: RadioGroupProps): React.JSX.Element;

package/Rating/Rating.d.ts

@@ -126,11 +126,11 @@ export type RatingTypeMap<
  *
  * Demos:
  *
- * - [Rating](https://mui.com/material-ui/react-rating/)
+ * - [Rating](https://next.mui.com/material-ui/react-rating/)
  *
  * API:
  *
- * - [Rating API](https://mui.com/material-ui/api/rating/)
+ * - [Rating API](https://next.mui.com/material-ui/api/rating/)
  */
 declare const Rating: OverridableComponent<RatingTypeMap>;
 

package/ScopedCssBaseline/ScopedCssBaseline.d.ts

@@ -36,11 +36,11 @@ export interface ScopedCssBaselineTypeMap<
  *
  * Demos:
  *
- * - [CSS Baseline](https://mui.com/material-ui/react-css-baseline/)
+ * - [CSS Baseline](https://next.mui.com/material-ui/react-css-baseline/)
  *
  * API:
  *
- * - [ScopedCssBaseline API](https://mui.com/material-ui/api/scoped-css-baseline/)
+ * - [ScopedCssBaseline API](https://next.mui.com/material-ui/api/scoped-css-baseline/)
  */
 declare const ScopedCssBaseline: OverridableComponent<ScopedCssBaselineTypeMap>;
 

package/Select/Select.d.ts

@@ -195,12 +195,12 @@ export type SelectProps<Value = unknown> =
  *
  * Demos:
  *
- * - [Select](https://mui.com/material-ui/react-select/)
+ * - [Select](https://next.mui.com/material-ui/react-select/)
  *
  * API:
  *
- * - [Select API](https://mui.com/material-ui/api/select/)
- * - inherits [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/)
+ * - [Select API](https://next.mui.com/material-ui/api/select/)
+ * - inherits [OutlinedInput API](https://next.mui.com/material-ui/api/outlined-input/)
  */
 declare const Select: (<Value = unknown>(props: SelectProps<Value>) => React.JSX.Element) & {
   muiName: string;

package/Skeleton/Skeleton.d.ts

@@ -58,11 +58,11 @@ export interface SkeletonTypeMap<
  *
  * Demos:
  *
- * - [Skeleton](https://mui.com/material-ui/react-skeleton/)
+ * - [Skeleton](https://next.mui.com/material-ui/react-skeleton/)
  *
  * API:
  *
- * - [Skeleton API](https://mui.com/material-ui/api/skeleton/)
+ * - [Skeleton API](https://next.mui.com/material-ui/api/skeleton/)
  */
 declare const Skeleton: OverridableComponent<SkeletonTypeMap>;
 

package/Slide/Slide.d.ts

@@ -48,17 +48,17 @@ export interface SlideProps extends TransitionProps {
 }
 
 /**
- * The Slide transition is used by the [Drawer](https://mui.com/material-ui/react-drawer/) component.
+ * The Slide transition is used by the [Drawer](https://next.mui.com/material-ui/react-drawer/) component.
  * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
  *
  * Demos:
  *
- * - [Dialog](https://mui.com/material-ui/react-dialog/)
- * - [Transitions](https://mui.com/material-ui/transitions/)
+ * - [Dialog](https://next.mui.com/material-ui/react-dialog/)
+ * - [Transitions](https://next.mui.com/material-ui/transitions/)
  *
  * API:
  *
- * - [Slide API](https://mui.com/material-ui/api/slide/)
+ * - [Slide API](https://next.mui.com/material-ui/api/slide/)
  * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props)
  */
 export default function Slide(props: SlideProps): React.JSX.Element;

package/Slider/Slider.d.ts

@@ -20,7 +20,7 @@ export interface SliderOwnerState extends SliderProps {
   focusedThumbIndex: number;
 }
 
-export interface SliderOwnProps {
+export interface SliderOwnProps<Value extends number | number[]> {
   /**
    * The label of the slider.
    */
@@ -93,7 +93,7 @@ export interface SliderOwnProps {
   /**
    * The default value. Use when the component is not controlled.
    */
-  defaultValue?: number | number[];
+  defaultValue?: Value;
   /**
    * If `true`, the component is disabled.
    * @default false
@@ -148,17 +148,17 @@ export interface SliderOwnProps {
    * @param {Event} event The event source of the callback.
    * You can pull out the new value by accessing `event.target.value` (any).
    * **Warning**: This is a generic event not a change event.
-   * @param {number | number[]} value The new value.
+   * @param {Value} value The new value.
    * @param {number} activeThumb Index of the currently moved thumb.
    */
-  onChange?: (event: Event, value: number | number[], activeThumb: number) => void;
+  onChange?: (event: Event, value: Value, activeThumb: number) => void;
   /**
    * Callback function that is fired when the `mouseup` is triggered.
    *
    * @param {React.SyntheticEvent | Event} event The event source of the callback. **Warning**: This is a generic event not a change event.
-   * @param {number | number[]} value The new value.
+   * @param {Value} value The new value.
    */
-  onChangeCommitted?: (event: React.SyntheticEvent | Event, value: number | number[]) => void;
+  onChangeCommitted?: (event: React.SyntheticEvent | Event, value: Value) => void;
   /**
    * The component orientation.
    * @default 'horizontal'
@@ -246,7 +246,7 @@ export interface SliderOwnProps {
    * The value of the slider.
    * For ranged sliders, provide an array with two values.
    */
-  value?: number | number[];
+  value?: Value;
   /**
    * Controls when the value label is displayed:
    *
@@ -275,11 +275,20 @@ export interface SliderOwnProps {
 export interface SliderTypeMap<
   RootComponent extends React.ElementType = 'span',
   AdditionalProps = {},
+  Value extends number | number[] = number | number[],
 > {
-  props: AdditionalProps & SliderOwnProps;
+  props: AdditionalProps & SliderOwnProps<Value>;
   defaultComponent: RootComponent;
 }
 
+export type SliderComponent<Value extends number | number[]> = OverridableComponent<
+  SliderTypeMap<'span', {}, Value>
+>;
+
+export type SliderType = SliderComponent<number> &
+  SliderComponent<number[]> &
+  SliderComponent<number | number[]>;
+
 export interface SliderValueLabelProps extends React.HTMLAttributes<HTMLSpanElement> {
   children: React.ReactElement<unknown>;
   index: number;
@@ -306,13 +315,13 @@ export declare const SliderValueLabel: React.FC<SliderValueLabelProps>;
  *
  * Demos:
  *
- * - [Slider](https://mui.com/material-ui/react-slider/)
+ * - [Slider](https://next.mui.com/material-ui/react-slider/)
  *
  * API:
  *
- * - [Slider API](https://mui.com/material-ui/api/slider/)
+ * - [Slider API](https://next.mui.com/material-ui/api/slider/)
  */
-declare const Slider: OverridableComponent<SliderTypeMap>;
+declare const Slider: SliderType;
 
 export type SliderProps<
   RootComponent extends React.ElementType = SliderTypeMap['defaultComponent'],

package/Slider/Slider.js

@@ -966,7 +966,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * @param {Event} event The event source of the callback.
    * You can pull out the new value by accessing `event.target.value` (any).
    * **Warning**: This is a generic event not a change event.
-   * @param {number | number[]} value The new value.
+   * @param {Value} value The new value.
    * @param {number} activeThumb Index of the currently moved thumb.
    */
   onChange: PropTypes.func,
@@ -974,7 +974,7 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * Callback function that is fired when the `mouseup` is triggered.
    *
    * @param {React.SyntheticEvent | Event} event The event source of the callback. **Warning**: This is a generic event not a change event.
-   * @param {number | number[]} value The new value.
+   * @param {Value} value The new value.
    */
   onChangeCommitted: PropTypes.func,
   /**

package/Slider/sliderClasses.d.ts

@@ -45,33 +45,19 @@ export interface SliderClasses {
     markLabelActive: string;
     /** Styles applied to the root element if `size="small"`. */
     sizeSmall: string;
-    /** Styles applied to the thumb element if `color="primary"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorPrimary](/material-ui/api/slider/#slider-classes-colorPrimary) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="primary"`. */
     thumbColorPrimary: string;
-    /** Styles applied to the thumb element if `color="secondary"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorSecondary](/material-ui/api/slider/#slider-classes-colorSecondary) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="secondary"`. */
     thumbColorSecondary: string;
-    /** Styles applied to the thumb element if `color="error"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorError](/material-ui/api/slider/#slider-classes-colorError) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="error"`. */
     thumbColorError: string;
-    /** Styles applied to the thumb element if `color="info"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorInfo](/material-ui/api/slider/#slider-classes-colorInfo) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="info"`. */
     thumbColorInfo: string;
-    /** Styles applied to the thumb element if `color="success"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorSuccess](/material-ui/api/slider/#slider-classes-colorSuccess) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="success"`. */
     thumbColorSuccess: string;
-    /** Styles applied to the thumb element if `color="warning"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-colorWarning](/material-ui/api/slider/#slider-classes-colorWarning) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `color="warning"`. */
     thumbColorWarning: string;
-    /** Styles applied to the thumb element if `size="small"`.
-     * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#slider-classes-thumb) and [.MuiSlider-sizeSmall](/material-ui/api/slider/#slider-classes-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-     */
+    /** Styles applied to the thumb element if `size="small"`. */
     thumbSizeSmall: string;
     /** Styles applied to the thumb label element. */
     valueLabel: string;