[linear progress] Remove deprecated CSS classes (#48068)

Author: mj12albert

docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md

@@ -1050,6 +1050,61 @@ The following deprecated prop has been removed:
  />
 ```
 
+#### LinearProgress deprecated CSS classes removed
+
+Use the [linear-progress-classes codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#linear-progress-classes) below to migrate the code as described in the following section:
+
+```bash
+npx @mui/codemod@latest deprecations/linear-progress-classes <path>
+```
+
+The following deprecated `LinearProgress` CSS classes have been removed:
+
+- `bar1Buffer` → use `.MuiLinearProgress-buffer > .MuiLinearProgress-bar1`
+- `bar1Determinate` → use `.MuiLinearProgress-determinate > .MuiLinearProgress-bar1`
+- `bar1Indeterminate` → use `.MuiLinearProgress-indeterminate > .MuiLinearProgress-bar1`
+- `bar2Buffer` → use `.MuiLinearProgress-buffer > .MuiLinearProgress-bar2`
+- `bar2Indeterminate` → use `.MuiLinearProgress-indeterminate > .MuiLinearProgress-bar2`
+- `barColorPrimary` → use `.MuiLinearProgress-colorPrimary > .MuiLinearProgress-bar`
+- `barColorSecondary` → use `.MuiLinearProgress-colorSecondary > .MuiLinearProgress-bar`
+- `dashedColorPrimary` → use `.MuiLinearProgress-colorPrimary > .MuiLinearProgress-dashed`
+- `dashedColorSecondary` → use `.MuiLinearProgress-colorSecondary > .MuiLinearProgress-dashed`
+
+If you were using these deprecated class names as `styleOverrides` keys in your theme, use the `variants` array in the appropriate slot override instead:
+
+```diff
+ const theme = createTheme({
+   components: {
+     MuiLinearProgress: {
+       styleOverrides: {
+-        bar1Determinate: { transition: 'none' },
+-        bar1Indeterminate: { width: 'auto' },
+-        bar1Buffer: { zIndex: 1 },
+-        barColorPrimary: { backgroundColor: 'red' },
+-        dashedColorPrimary: { backgroundSize: '10px 10px' },
++        bar1: {
++          variants: [
++            { props: { variant: 'determinate' }, style: { transition: 'none' } },
++            { props: { variant: 'indeterminate' }, style: { width: 'auto' } },
++            { props: { variant: 'buffer' }, style: { zIndex: 1 } },
++          ],
++        },
++        bar: {
++          variants: [
++            { props: { color: 'primary' }, style: { backgroundColor: 'red' } },
++          ],
++        },
++        dashed: {
++          variants: [
++            { props: { color: 'primary' }, style: { backgroundSize: '10px 10px' } },
++          ],
++        },
+       },
+     },
+   },
+ });
+```
+
 #### ListItem deprecated props removed
 
 Use the [list-item-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#list-item-props) below to migrate the code as described in the following section:

docs/pages/material-ui/api/linear-progress.json

@@ -43,61 +43,12 @@
       "description": "Styles applied to the bar1 element.",
       "isGlobal": false
     },
-    {
-      "key": "bar1Buffer",
-      "className": "MuiLinearProgress-bar1Buffer",
-      "description": "Styles applied to the bar1 element if `variant=\"buffer\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "bar1Determinate",
-      "className": "MuiLinearProgress-bar1Determinate",
-      "description": "Styles applied to the bar1 element if `variant=\"determinate\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "bar1Indeterminate",
-      "className": "MuiLinearProgress-bar1Indeterminate",
-      "description": "Styles applied to the bar1 element if `variant=\"indeterminate or query\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
     {
       "key": "bar2",
       "className": "MuiLinearProgress-bar2",
       "description": "Styles applied to the bar2 element.",
       "isGlobal": false
     },
-    {
-      "key": "bar2Buffer",
-      "className": "MuiLinearProgress-bar2Buffer",
-      "description": "Styles applied to the bar2 element if `variant=\"buffer\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "bar2Indeterminate",
-      "className": "MuiLinearProgress-bar2Indeterminate",
-      "description": "Styles applied to the bar2 element if `variant=\"indeterminate or query\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "barColorPrimary",
-      "className": "MuiLinearProgress-barColorPrimary",
-      "description": "Styles applied to the bar elements if `color=\"primary\"`; bar2 if `variant` not \"buffer\".",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "barColorSecondary",
-      "className": "MuiLinearProgress-barColorSecondary",
-      "description": "Styles applied to the bar elements if `color=\"secondary\"`; bar2 if `variant` not \"buffer\".",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
     {
       "key": "buffer",
       "className": "MuiLinearProgress-buffer",
@@ -122,20 +73,6 @@
       "description": "Styles applied to the additional bar element if `variant=\"buffer\"`.",
       "isGlobal": false
     },
-    {
-      "key": "dashedColorPrimary",
-      "className": "MuiLinearProgress-dashedColorPrimary",
-      "description": "Styles applied to the additional bar element if `variant=\"buffer\"` and `color=\"primary\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
-    {
-      "key": "dashedColorSecondary",
-      "className": "MuiLinearProgress-dashedColorSecondary",
-      "description": "Styles applied to the additional bar element if `variant=\"buffer\"` and `color=\"secondary\"`.",
-      "isGlobal": false,
-      "isDeprecated": true
-    },
     {
       "key": "determinate",
       "className": "MuiLinearProgress-determinate",

docs/translations/api-docs/linear-progress/linear-progress.json

@@ -22,49 +22,7 @@
       "nodeName": "the layered bar1 and bar2 elements"
     },
     "bar1": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the bar1 element" },
-    "bar1Buffer": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar1 element",
-      "conditions": "<code>variant=\"buffer\"</code>",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar1\">.MuiLinearProgress-bar1</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-buffer\">.MuiLinearProgress-buffer</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "bar1Determinate": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar1 element",
-      "conditions": "<code>variant=\"determinate\"</code>",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar1\">.MuiLinearProgress-bar1</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-determinate\">.MuiLinearProgress-determinate</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "bar1Indeterminate": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar1 element",
-      "conditions": "<code>variant=\"indeterminate or query\"</code>",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar1\">.MuiLinearProgress-bar1</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-indeterminate\">.MuiLinearProgress-indeterminate</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
     "bar2": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the bar2 element" },
-    "bar2Buffer": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar2 element",
-      "conditions": "<code>variant=\"buffer\"</code>",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar2\">.MuiLinearProgress-bar2</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-buffer\">.MuiLinearProgress-buffer</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "bar2Indeterminate": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar2 element",
-      "conditions": "<code>variant=\"indeterminate or query\"</code>",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar2\">.MuiLinearProgress-bar2</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-indeterminate\">.MuiLinearProgress-indeterminate</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "barColorPrimary": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar elements",
-      "conditions": "<code>color=\"primary\"</code>; bar2 if <code>variant</code> not &quot;buffer&quot;",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar\">.MuiLinearProgress-bar</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-colorPrimary\">.MuiLinearProgress-colorPrimary</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "barColorSecondary": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the bar elements",
-      "conditions": "<code>color=\"secondary\"</code>; bar2 if <code>variant</code> not &quot;buffer&quot;",
-      "deprecationInfo": "Use the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-bar\">.MuiLinearProgress-bar</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-colorSecondary\">.MuiLinearProgress-colorSecondary</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
     "buffer": {
       "description": "Styles applied to {{nodeName}} if {{conditions}}.",
       "nodeName": "the root element",
@@ -85,18 +43,6 @@
       "nodeName": "the additional bar element",
       "conditions": "<code>variant=\"buffer\"</code>"
     },
-    "dashedColorPrimary": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the additional bar element",
-      "conditions": "<code>variant=\"buffer\"</code> and <code>color=\"primary\"</code>",
-      "deprecationInfo": "Combine the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-dashed\">.MuiLinearProgress-dashed</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-colorPrimary\">.MuiLinearProgress-colorPrimary</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
-    "dashedColorSecondary": {
-      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
-      "nodeName": "the additional bar element",
-      "conditions": "<code>variant=\"buffer\"</code> and <code>color=\"secondary\"</code>",
-      "deprecationInfo": "Combine the <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-dashed\">.MuiLinearProgress-dashed</a> and <a href=\"/material-ui/api/linear-progress/#linear-progress-classes-MuiLinearProgress-colorSecondary\">.MuiLinearProgress-colorSecondary</a> classes instead. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>"
-    },
     "determinate": {
       "description": "Styles applied to {{nodeName}} if {{conditions}}.",
       "nodeName": "the root element",

packages/mui-material/src/LinearProgress/LinearProgress.js

@@ -90,23 +90,9 @@ const useUtilityClasses = (ownerState) => {
 
   const slots = {
     root: ['root', `color${capitalize(color)}`, variant],
-    dashed: ['dashed', `dashedColor${capitalize(color)}`],
-    bar1: [
-      'bar',
-      'bar1',
-      `barColor${capitalize(color)}`,
-      (variant === 'indeterminate' || variant === 'query') && 'bar1Indeterminate',
-      variant === 'determinate' && 'bar1Determinate',
-      variant === 'buffer' && 'bar1Buffer',
-    ],
-    bar2: [
-      'bar',
-      'bar2',
-      variant !== 'buffer' && `barColor${capitalize(color)}`,
-      variant === 'buffer' && `color${capitalize(color)}`,
-      (variant === 'indeterminate' || variant === 'query') && 'bar2Indeterminate',
-      variant === 'buffer' && 'bar2Buffer',
-    ],
+    dashed: ['dashed'],
+    bar1: ['bar', 'bar1'],
+    bar2: ['bar', 'bar2', variant === 'buffer' && `color${capitalize(color)}`],
   };
 
   return composeClasses(slots, getLinearProgressUtilityClass, classes);
@@ -185,9 +171,7 @@ const LinearProgressDashed = styled('span', {
   name: 'MuiLinearProgress',
   slot: 'Dashed',
   overridesResolver: (props, styles) => {
-    const { ownerState } = props;
-
-    return [styles.dashed, styles[`dashedColor${capitalize(ownerState.color)}`]];
+    return [styles.dashed];
   },
 })(
   memoTheme(({ theme }) => ({
@@ -228,17 +212,7 @@ const LinearProgressBar1 = styled('span', {
   name: 'MuiLinearProgress',
   slot: 'Bar1',
   overridesResolver: (props, styles) => {
-    const { ownerState } = props;
-
-    return [
-      styles.bar,
-      styles.bar1,
-      styles[`barColor${capitalize(ownerState.color)}`],
-      (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') &&
-        styles.bar1Indeterminate,
-      ownerState.variant === 'determinate' && styles.bar1Determinate,
-      ownerState.variant === 'buffer' && styles.bar1Buffer,
-    ];
+    return [styles.bar, styles.bar1];
   },
 })(
   memoTheme(({ theme }) => ({
@@ -305,16 +279,7 @@ const LinearProgressBar2 = styled('span', {
   name: 'MuiLinearProgress',
   slot: 'Bar2',
   overridesResolver: (props, styles) => {
-    const { ownerState } = props;
-
-    return [
-      styles.bar,
-      styles.bar2,
-      styles[`barColor${capitalize(ownerState.color)}`],
-      (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') &&
-        styles.bar2Indeterminate,
-      ownerState.variant === 'buffer' && styles.bar2Buffer,
-    ];
+    return [styles.bar, styles.bar2];
   },
 })(
   memoTheme(({ theme }) => ({