diff --git a/docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md b/docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md index 0b279e951266a0..30b9f6f2d893ec 100644 --- a/docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md +++ b/docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md @@ -1311,6 +1311,35 @@ The following deprecated props have been removed from the `Slider` component: /> ``` +#### Slider deprecated classes removed + +Use the [slider-classes codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#slider-classes) below to migrate the code as described in the following section: + +```bash +npx @mui/codemod@latest deprecations/slider-classes +``` + +The following deprecated classes have been removed: + +- `thumbColorPrimary` — use `.MuiSlider-colorPrimary > .MuiSlider-thumb` instead +- `thumbColorSecondary` — use `.MuiSlider-colorSecondary > .MuiSlider-thumb` instead +- `thumbColorError` — use `.MuiSlider-colorError > .MuiSlider-thumb` instead +- `thumbColorInfo` — use `.MuiSlider-colorInfo > .MuiSlider-thumb` instead +- `thumbColorSuccess` — use `.MuiSlider-colorSuccess > .MuiSlider-thumb` instead +- `thumbColorWarning` — use `.MuiSlider-colorWarning > .MuiSlider-thumb` instead +- `thumbSizeSmall` — use `.MuiSlider-sizeSmall > .MuiSlider-thumb` instead + +```diff +-.MuiSlider-thumbColorPrimary ++.MuiSlider-colorPrimary > .MuiSlider-thumb + +-.MuiSlider-thumbColorSecondary ++.MuiSlider-colorSecondary > .MuiSlider-thumb + +-.MuiSlider-thumbSizeSmall ++.MuiSlider-sizeSmall > .MuiSlider-thumb +``` + #### Snackbar deprecated props removed Use the [snackbar-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#snackbar-props) below to migrate the code as described in the following section: diff --git a/docs/pages/material-ui/api/slider.json b/docs/pages/material-ui/api/slider.json index 9e4bd0c5053553..21be9a7d888cd4 100644 --- a/docs/pages/material-ui/api/slider.json +++ b/docs/pages/material-ui/api/slider.json @@ -250,55 +250,6 @@ "description": "Styles applied to the root element if `size=\"small\"`.", "isGlobal": false }, - { - "key": "thumbColorError", - "className": "MuiSlider-thumbColorError", - "description": "Styles applied to the thumb element if `color=\"error\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbColorInfo", - "className": "MuiSlider-thumbColorInfo", - "description": "Styles applied to the thumb element if `color=\"info\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbColorPrimary", - "className": "MuiSlider-thumbColorPrimary", - "description": "Styles applied to the thumb element if `color=\"primary\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbColorSecondary", - "className": "MuiSlider-thumbColorSecondary", - "description": "Styles applied to the thumb element if `color=\"secondary\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbColorSuccess", - "className": "MuiSlider-thumbColorSuccess", - "description": "Styles applied to the thumb element if `color=\"success\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbColorWarning", - "className": "MuiSlider-thumbColorWarning", - "description": "Styles applied to the thumb element if `color=\"warning\"`.", - "isGlobal": false, - "isDeprecated": true - }, - { - "key": "thumbSizeSmall", - "className": "MuiSlider-thumbSizeSmall", - "description": "Styles applied to the thumb element if `size=\"small\"`.", - "isGlobal": false, - "isDeprecated": true - }, { "key": "trackFalse", "className": "MuiSlider-trackFalse", diff --git a/docs/translations/api-docs/slider/slider.json b/docs/translations/api-docs/slider/slider.json index ea030711cb3bad..ea790883ef4efa 100644 --- a/docs/translations/api-docs/slider/slider.json +++ b/docs/translations/api-docs/slider/slider.json @@ -165,48 +165,6 @@ "nodeName": "the root element", "conditions": "size=\"small\"" }, - "thumbColorError": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"error\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorError classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbColorInfo": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"info\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorInfo classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbColorPrimary": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"primary\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorPrimary classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbColorSecondary": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"secondary\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorSecondary classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbColorSuccess": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"success\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorSuccess classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbColorWarning": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "color=\"warning\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-colorWarning classes instead. See Migrating from deprecated APIs for more details." - }, - "thumbSizeSmall": { - "description": "Styles applied to {{nodeName}} if {{conditions}}.", - "nodeName": "the thumb element", - "conditions": "size=\"small\"", - "deprecationInfo": "Combine the .MuiSlider-thumb and .MuiSlider-sizeSmall classes instead. See Migrating from deprecated APIs for more details." - }, "trackFalse": { "description": "Styles applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", diff --git a/packages/mui-material/src/Slider/Slider.d.ts b/packages/mui-material/src/Slider/Slider.d.ts index a76c0e9e04f276..74d23187c185ce 100644 --- a/packages/mui-material/src/Slider/Slider.d.ts +++ b/packages/mui-material/src/Slider/Slider.d.ts @@ -114,11 +114,6 @@ export type SliderSlotsAndSlotProps = CreateSlotsAndSlotProps< } >; -/** - * @deprecated Use `SliderRootSlotPropsOverrides` instead. - */ -export interface SliderComponentsPropsOverrides {} - export interface SliderOwnerState extends SliderProps { dragging: boolean; marked: boolean; diff --git a/packages/mui-material/src/Slider/Slider.js b/packages/mui-material/src/Slider/Slider.js index 75137bf89e43bd..3e836ec1971934 100644 --- a/packages/mui-material/src/Slider/Slider.js +++ b/packages/mui-material/src/Slider/Slider.js @@ -232,14 +232,6 @@ export const SliderTrack = styled('span', { export const SliderThumb = styled('span', { name: 'MuiSlider', slot: 'Thumb', - overridesResolver: (props, styles) => { - const { ownerState } = props; - return [ - styles.thumb, - styles[`thumbColor${capitalize(ownerState.color)}`], - ownerState.size !== 'medium' && styles[`thumbSize${capitalize(ownerState.size)}`], - ]; - }, })( memoTheme(({ theme }) => ({ position: 'absolute', @@ -535,12 +527,7 @@ const useUtilityClasses = (ownerState) => { markLabel: ['markLabel'], markLabelActive: ['markLabelActive'], valueLabel: ['valueLabel'], - thumb: [ - 'thumb', - disabled && 'disabled', - size && `thumbSize${capitalize(size)}`, - color && `thumbColor${capitalize(color)}`, - ], + thumb: ['thumb', disabled && 'disabled'], active: ['active'], disabled: ['disabled'], focusVisible: ['focusVisible'], diff --git a/packages/mui-material/src/Slider/Slider.test.js b/packages/mui-material/src/Slider/Slider.test.js index 42663b3469727c..7aaee6e1a121da 100644 --- a/packages/mui-material/src/Slider/Slider.test.js +++ b/packages/mui-material/src/Slider/Slider.test.js @@ -1593,7 +1593,7 @@ describe.skipIf(!supportsTouch())('', () => { const root = document.querySelector(`.${classes.root}`); const thumb = document.querySelector(`.${classes.thumb}`); expect(root).not.to.have.class(classes.sizeSmall); - expect(thumb).not.to.have.class(classes.thumbSizeSmall); + expect(thumb).not.to.equal(null); }); it('should render small slider', () => { @@ -1602,7 +1602,7 @@ describe.skipIf(!supportsTouch())('', () => { const root = document.querySelector(`.${classes.root}`); const thumb = document.querySelector(`.${classes.thumb}`); expect(root).to.have.class(classes.sizeSmall); - expect(thumb).to.have.class(classes.thumbSizeSmall); + expect(thumb).not.to.equal(null); }); }); diff --git a/packages/mui-material/src/Slider/sliderClasses.ts b/packages/mui-material/src/Slider/sliderClasses.ts index f62d19e9914bf4..233538e584af05 100644 --- a/packages/mui-material/src/Slider/sliderClasses.ts +++ b/packages/mui-material/src/Slider/sliderClasses.ts @@ -48,34 +48,6 @@ 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-css-MuiSlider-thumb) and [.MuiSlider-colorPrimary](/material-ui/api/slider/#slider-classes-MuiSlider-colorPrimary) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorPrimary: string; - /** Styles applied to the thumb element if `color="secondary"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-colorSecondary](/material-ui/api/slider/#slider-classes-MuiSlider-colorSecondary) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorSecondary: string; - /** Styles applied to the thumb element if `color="error"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-colorError](/material-ui/api/slider/#slider-classes-MuiSlider-colorError) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorError: string; - /** Styles applied to the thumb element if `color="info"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-colorInfo](/material-ui/api/slider/#slider-classes-MuiSlider-colorInfo) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorInfo: string; - /** Styles applied to the thumb element if `color="success"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-colorSuccess](/material-ui/api/slider/#slider-classes-MuiSlider-colorSuccess) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorSuccess: string; - /** Styles applied to the thumb element if `color="warning"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-colorWarning](/material-ui/api/slider/#slider-classes-MuiSlider-colorWarning) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbColorWarning: string; - /** Styles applied to the thumb element if `size="small"`. - * @deprecated Combine the [.MuiSlider-thumb](/material-ui/api/slider/#Slider-css-MuiSlider-thumb) and [.MuiSlider-sizeSmall](/material-ui/api/slider/#slider-classes-MuiSlider-sizeSmall) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. - */ - thumbSizeSmall: string; /** Styles applied to the thumb label element. */ valueLabel: string; /** Styles applied to the thumb label element if it's open. */ @@ -112,16 +84,9 @@ const sliderClasses: SliderClasses = generateUtilityClasses('MuiSlider', [ 'rail', 'sizeSmall', 'thumb', - 'thumbColorPrimary', - 'thumbColorSecondary', - 'thumbColorError', - 'thumbColorSuccess', - 'thumbColorInfo', - 'thumbColorWarning', 'track', 'trackInverted', 'trackFalse', - 'thumbSizeSmall', 'valueLabel', 'valueLabelOpen', 'valueLabelCircle',