@mui/codemod 6.1.7 → 6.1.8

package/README.md

@@ -275,12 +275,14 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 -  }}
 +  slots={{
 +    paper: CustomPaper,
-+    popper: CustomPopper,
-+    listbox: CustomListbox,
++    popper: CustomPopper
 +  }}
 +  slotProps={{
 +    chip: { height: 10 },
-+    listbox: { height: 12 },
++    listbox: {
++        component: CustomListbox,
++        ...{ height: 12 },
++    },
 +    clearIndicator: { width: 10 },
 +    paper: { width: 12 },
 +    popper: { width: 14 },
@@ -306,11 +308,13 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 +    slots: {
 +      paper: CustomPaper,
 +      popper: CustomPopper,
-+      listbox: CustomListbox,
 +    },
 +    slotProps: {
 +      chip: { height: 10 },
-+      listbox: { height: 12 },
++      listbox: {
++        component: CustomListbox,
++        ...{ height: 12 },
++      },
 +      clearIndicator: { width: 10 },
 +      paper: { width: 12 },
 +      popper: { width: 14 },
@@ -1408,19 +1412,43 @@ npx @mui/codemod@latest deprecations/slider-props <path>
  <Tooltip
 -  components={{ Arrow: CustomArrow }}
 -  componentsProps={{ arrow: { testid: 'test-id' } }}
-+  slots={{ arrow: CustomArrow }}
-+  slotProps={{ arrow: { testid: 'test-id' } }}
+-  PopperComponent={CustomPopperComponent}
+-  TransitionComponent={CustomTransitionComponent}
+-  PopperProps={CustomPopperProps}
+-  TransitionProps={CustomTransitionProps}
++  slots={{
++    arrow: CustomArrow,
++    popper: CustomPopperComponent,
++    transition: CustomTransitionComponent,
++  }}
++  slotProps={{
++    arrow: { testid: 'test-id' },
++    popper: CustomPopperProps,
++    transition: CustomTransitionProps,
++  }}
  />
 ```
 
 ```diff
  MuiTooltip: {
    defaultProps: {
+-    PopperComponent: CustomPopperComponent,
+-    TransitionComponent: CustomTransitionComponent,
+-    PopperProps: CustomPopperProps,
+-    TransitionProps: CustomTransitionProps,
 -    components: { Arrow: CustomArrow }
-+    slots: { arrow: CustomArrow },
++    slots: {
++      arrow: CustomArrow,
++      popper: CustomPopperComponent,
++      transition: CustomTransitionComponent,
++    },
 -    componentsProps: { arrow: { testid: 'test-id' }}
-+    slotProps: { arrow: { testid: 'test-id' } },
-  },
++    slotProps: {
++      arrow: { testid: 'test-id' },
++      popper: CustomPopperProps,
++      transition: CustomTransitionProps,
++    },
+   },
  },
 ```
 
@@ -1451,6 +1479,10 @@ JS transforms:
  },
 ```
 
+```bash
+npx @mui/codemod@next deprecations/step-connector-classes <path>
+```
+
 #### `step-label-props`
 
 ```diff

package/node/deprecations/all/deprecations-all.js

@@ -6,9 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = deprecationsAll;
 var _accordionSummaryClasses = _interopRequireDefault(require("../accordion-summary-classes"));
+var _accordionProps = _interopRequireDefault(require("../accordion-props"));
 var _alertClasses = _interopRequireDefault(require("../alert-classes"));
 var _avatarGroupProps = _interopRequireDefault(require("../avatar-group-props"));
 var _autocompleteProps = _interopRequireDefault(require("../autocomplete-props"));
+var _avatarProps = _interopRequireDefault(require("../avatar-props"));
 var _backdropProps = _interopRequireDefault(require("../backdrop-props"));
 var _buttonClasses = _interopRequireDefault(require("../button-classes"));
 var _buttonGroupClasses = _interopRequireDefault(require("../button-group-classes"));
@@ -23,21 +25,25 @@ var _inputProps = _interopRequireDefault(require("../input-props"));
 var _modalProps = _interopRequireDefault(require("../modal-props"));
 var _outlinedInputProps = _interopRequireDefault(require("../outlined-input-props"));
 var _paginationItemClasses = _interopRequireDefault(require("../pagination-item-classes"));
+var _speedDialProps = _interopRequireDefault(require("../speed-dial-props"));
 var _tableSortLabelClasses = _interopRequireDefault(require("../table-sort-label-classes"));
 var _stepConnectorClasses = _interopRequireDefault(require("../step-connector-classes"));
 var _stepLabelProps = _interopRequireDefault(require("../step-label-props"));
 var _textFieldProps = _interopRequireDefault(require("../text-field-props"));
 var _tabClasses = _interopRequireDefault(require("../tab-classes"));
 var _toggleButtonGroupClasses = _interopRequireDefault(require("../toggle-button-group-classes"));
+var _tooltipProps = _interopRequireDefault(require("../tooltip-props"));
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
  */
 function deprecationsAll(file, api, options) {
   file.source = (0, _accordionSummaryClasses.default)(file, api, options);
+  file.source = (0, _accordionProps.default)(file, api, options);
   file.source = (0, _alertClasses.default)(file, api, options);
   file.source = (0, _avatarGroupProps.default)(file, api, options);
   file.source = (0, _autocompleteProps.default)(file, api, options);
+  file.source = (0, _avatarProps.default)(file, api, options);
   file.source = (0, _backdropProps.default)(file, api, options);
   file.source = (0, _buttonClasses.default)(file, api, options);
   file.source = (0, _buttonGroupClasses.default)(file, api, options);
@@ -52,11 +58,13 @@ function deprecationsAll(file, api, options) {
   file.source = (0, _modalProps.default)(file, api, options);
   file.source = (0, _outlinedInputProps.default)(file, api, options);
   file.source = (0, _paginationItemClasses.default)(file, api, options);
+  file.source = (0, _speedDialProps.default)(file, api, options);
   file.source = (0, _stepConnectorClasses.default)(file, api, options);
   file.source = (0, _stepLabelProps.default)(file, api, options);
   file.source = (0, _tableSortLabelClasses.default)(file, api, options);
   file.source = (0, _textFieldProps.default)(file, api, options);
   file.source = (0, _tabClasses.default)(file, api, options);
   file.source = (0, _toggleButtonGroupClasses.default)(file, api, options);
+  file.source = (0, _tooltipProps.default)(file, api, options);
   return file.source;
 }

package/node/deprecations/autocomplete-props/autocomplete-props.js

@@ -5,7 +5,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
+var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
+var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
 var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
+var _findComponentJSX = _interopRequireDefault(require("../../util/findComponentJSX"));
+var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
+var _assignObject = _interopRequireDefault(require("../../util/assignObject"));
+var _appendAttribute = _interopRequireDefault(require("../../util/appendAttribute"));
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -14,9 +20,105 @@ function transformer(file, api, options) {
   const j = api.jscodeshift;
   const root = j(file.source);
   const printOptions = options.printOptions;
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'Autocomplete',
+    propName: 'PaperComponent',
+    slotName: 'paper'
+  });
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'Autocomplete',
+    propName: 'PopperComponent',
+    slotName: 'popper'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'Autocomplete',
+    propName: 'ListboxProps',
+    slotName: 'listbox'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'Autocomplete',
+    propName: 'ChipProps',
+    slotName: 'chip'
+  });
   (0, _replaceComponentsWithSlots.default)(j, {
     root,
     componentName: 'Autocomplete'
   });
+
+  // Move ListboxComponent JSX prop into slotProps.listbox.component
+  (0, _findComponentJSX.default)(j, {
+    root,
+    componentName: 'Autocomplete'
+  }, elementPath => {
+    const element = elementPath.node;
+    const propIndex = element.openingElement.attributes.findIndex(attr => attr.type === 'JSXAttribute' && attr.name.name === 'ListboxComponent');
+    if (propIndex !== -1) {
+      const removedValue = element.openingElement.attributes.splice(propIndex, 1)[0].value.expression;
+      let hasSlotProps = false;
+      element.openingElement.attributes.forEach(attr => {
+        if (attr.name?.name === 'slotProps') {
+          hasSlotProps = true;
+          const slots = attr.value.expression;
+          const slotIndex = slots.properties.findIndex(prop => prop?.key?.name === 'listbox');
+          if (slotIndex === -1) {
+            (0, _assignObject.default)(j, {
+              target: attr,
+              key: 'listbox',
+              expression: j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)])
+            });
+          } else {
+            const slotPropsSlotValue = slots.properties.splice(slotIndex, 1)[0].value;
+            (0, _assignObject.default)(j, {
+              target: attr,
+              key: 'listbox',
+              expression: j.objectExpression([j.objectProperty(j.identifier('component'), removedValue), j.spreadElement(slotPropsSlotValue)])
+            });
+          }
+        }
+      });
+      if (!hasSlotProps) {
+        (0, _appendAttribute.default)(j, {
+          target: element,
+          attributeName: 'slotProps',
+          expression: j.objectExpression([j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)]))])
+        });
+      }
+    }
+  });
+
+  // Move ListboxComponent default prop into slotProps.listbox.component
+  const defaultPropsPathCollection = (0, _findComponentDefaultProps.default)(j, {
+    root,
+    componentName: 'Autocomplete'
+  });
+  defaultPropsPathCollection.find(j.ObjectProperty, {
+    key: {
+      name: 'ListboxComponent'
+    }
+  }).forEach(path => {
+    const removedValue = path.value.value;
+    const defaultProps = path.parent.value;
+    let hasSlotProps = false;
+    defaultProps.properties.forEach(property => {
+      if (property.key?.name === 'slotProps') {
+        hasSlotProps = true;
+        const slotIndex = property.value.properties.findIndex(prop => prop?.key?.name === 'listbox');
+        if (slotIndex === -1) {
+          property.value.properties.push(j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)])));
+        } else {
+          const slotPropsSlotValue = property.value.properties.splice(slotIndex, 1)[0].value;
+          property.value.properties.push(j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue), j.spreadElement(slotPropsSlotValue)])));
+        }
+      }
+    });
+    if (!hasSlotProps) {
+      defaultProps.properties.push(j.objectProperty(j.identifier('slotProps'), j.objectExpression([j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)]))])));
+    }
+    path.prune();
+  });
   return root.toSource(printOptions);
 }

package/node/deprecations/autocomplete-props/test-cases/actual.js

@@ -5,6 +5,15 @@ var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete")
 var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  ChipProps: {
+    height: 10
+  },
+  PaperComponent: CustomPaper,
+  PopperComponent: CustomPopper,
+  ListboxComponent: CustomListbox,
+  ListboxProps: {
+    height: 12
+  },
   componentsProps: {
     clearIndicator: {
       width: 10
@@ -21,6 +30,15 @@ var _jsxRuntime = require("react/jsx-runtime");
   }
 });
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  ChipProps: {
+    height: 10
+  },
+  PaperComponent: CustomPaper,
+  PopperComponent: CustomPopper,
+  ListboxComponent: CustomListbox,
+  ListboxProps: {
+    height: 12
+  },
   slotProps: {
     popupIndicator: {
       width: 20
@@ -42,6 +60,15 @@ var _jsxRuntime = require("react/jsx-runtime");
   }
 });
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  ChipProps: {
+    height: 10
+  },
+  PaperComponent: CustomPaper,
+  PopperComponent: CustomPopper,
+  ListboxComponent: CustomListbox,
+  ListboxProps: {
+    height: 12
+  },
   componentsProps: {
     clearIndicator: {
       width: 10
@@ -72,4 +99,15 @@ var _jsxRuntime = require("react/jsx-runtime");
       width: 16
     }
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  ChipProps: {
+    height: 10
+  },
+  PaperComponent: CustomPaper,
+  PopperComponent: CustomPopper,
+  ListboxComponent: CustomListbox,
+  ListboxProps: {
+    height: 12
+  }
 });

package/node/deprecations/autocomplete-props/test-cases/expected.js

@@ -5,7 +5,14 @@ var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete")
 var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  slots: {
+    paper: CustomPaper,
+    popper: CustomPopper
+  },
   slotProps: {
+    chip: {
+      height: 10
+    },
     clearIndicator: {
       width: 10
     },
@@ -17,11 +24,20 @@ var _jsxRuntime = require("react/jsx-runtime");
     },
     popupIndicator: {
       width: 16
+    },
+    listbox: {
+      component: CustomListbox,
+      ...{
+        height: 12
+      }
     }
   }
 });
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
   slotProps: {
+    chip: {
+      height: 10
+    },
     clearIndicator: {
       width: 10
     },
@@ -38,11 +54,28 @@ var _jsxRuntime = require("react/jsx-runtime");
       ...{
         width: 20
       }
+    },
+    listbox: {
+      component: CustomListbox,
+      ...{
+        height: 12
+      }
     }
+  },
+  slots: {
+    paper: CustomPaper,
+    popper: CustomPopper
   }
 });
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  slots: {
+    paper: CustomPaper,
+    popper: CustomPopper
+  },
   slotProps: {
+    chip: {
+      height: 10
+    },
     clearIndicator: {
       width: 10
     },
@@ -54,6 +87,12 @@ var _jsxRuntime = require("react/jsx-runtime");
     },
     popupIndicator: {
       width: 16
+    },
+    listbox: {
+      component: CustomListbox,
+      ...{
+        height: 12
+      }
     }
   }
 });
@@ -72,4 +111,15 @@ var _jsxRuntime = require("react/jsx-runtime");
       width: 16
     }
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  ChipProps: {
+    height: 10
+  },
+  PaperComponent: CustomPaper,
+  PopperComponent: CustomPopper,
+  ListboxComponent: CustomListbox,
+  ListboxProps: {
+    height: 12
+  }
 });

package/node/deprecations/autocomplete-props/test-cases/theme.actual.js

@@ -3,6 +3,15 @@
 fn({
   MuiAutocomplete: {
     defaultProps: {
+      ChipProps: {
+        height: 10
+      },
+      PaperComponent: CustomPaper,
+      PopperComponent: CustomPopper,
+      ListboxComponent: CustomListbox,
+      ListboxProps: {
+        height: 12
+      },
       componentsProps: {
         clearIndicator: {
           width: 10
@@ -23,6 +32,15 @@ fn({
 fn({
   MuiAutocomplete: {
     defaultProps: {
+      ChipProps: {
+        height: 10
+      },
+      PaperComponent: CustomPaper,
+      PopperComponent: CustomPopper,
+      ListboxComponent: CustomListbox,
+      ListboxProps: {
+        height: 12
+      },
       slotProps: {
         popupIndicator: {
           width: 20

package/node/deprecations/autocomplete-props/test-cases/theme.expected.js

@@ -3,6 +3,10 @@
 fn({
   MuiAutocomplete: {
     defaultProps: {
+      slots: {
+        paper: CustomPaper,
+        popper: CustomPopper
+      },
       slotProps: {
         clearIndicator: {
           width: 10
@@ -15,6 +19,15 @@ fn({
         },
         popupIndicator: {
           width: 16
+        },
+        chip: {
+          height: 10
+        },
+        listbox: {
+          component: CustomListbox,
+          ...{
+            height: 12
+          }
         }
       }
     }
@@ -40,7 +53,20 @@ fn({
           ...{
             width: 20
           }
+        },
+        chip: {
+          height: 10
+        },
+        listbox: {
+          component: CustomListbox,
+          ...{
+            height: 12
+          }
         }
+      },
+      slots: {
+        paper: CustomPaper,
+        popper: CustomPopper
       }
     }
   }

package/node/deprecations/backdrop-props/backdrop-props.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
+var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
 var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
 /**
  * @param {import('jscodeshift').FileInfo} file
@@ -18,5 +19,11 @@ function transformer(file, api, options) {
     root,
     componentName: 'Backdrop'
   });
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'Backdrop',
+    propName: 'TransitionComponent',
+    slotName: 'transition'
+  });
   return root.toSource(printOptions);
 }

package/node/deprecations/backdrop-props/test-cases/actual.js

@@ -4,6 +4,36 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 var _Backdrop = _interopRequireDefault(require("@mui/material/Backdrop"));
 var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  TransitionComponent: CustomTransition
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Backdrop, {
+  TransitionComponent: CustomTransition
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  TransitionComponent: CustomTransition,
+  slots: {
+    root: 'div'
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Backdrop, {
+  TransitionComponent: CustomTransition,
+  slots: {
+    ...outerSlots
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  TransitionComponent: ComponentTransition,
+  slots: {
+    root: 'div',
+    transition: SlotTransition
+  }
+});
+
+// should skip non MUI components
+/*#__PURE__*/(0, _jsxRuntime.jsx)(NonMuiBackdrop, {
+  TransitionComponent: CustomTransition
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
   components: {
     Root: ComponentsRoot

package/node/deprecations/backdrop-props/test-cases/expected.js

@@ -4,6 +4,39 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 var _Backdrop = _interopRequireDefault(require("@mui/material/Backdrop"));
 var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  slots: {
+    transition: CustomTransition
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Backdrop, {
+  slots: {
+    transition: CustomTransition
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  slots: {
+    root: 'div',
+    transition: CustomTransition
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Backdrop, {
+  slots: {
+    ...outerSlots,
+    transition: CustomTransition
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
+  slots: {
+    root: 'div',
+    transition: SlotTransition
+  }
+});
+
+// should skip non MUI components
+/*#__PURE__*/(0, _jsxRuntime.jsx)(NonMuiBackdrop, {
+  TransitionComponent: CustomTransition
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Backdrop.default, {
   slots: {
     root: ComponentsRoot

package/node/deprecations/backdrop-props/test-cases/theme.actual.js

@@ -1,5 +1,33 @@
 "use strict";
 
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      TransitionComponent: CustomTransition
+    }
+  }
+});
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      TransitionComponent: CustomTransition,
+      slots: {
+        root: 'div'
+      }
+    }
+  }
+});
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      TransitionComponent: ComponentTransition,
+      slots: {
+        root: 'div',
+        transition: SlotTransition
+      }
+    }
+  }
+});
 fn({
   MuiBackdrop: {
     defaultProps: {

package/node/deprecations/backdrop-props/test-cases/theme.expected.js

@@ -1,5 +1,34 @@
 "use strict";
 
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      slots: {
+        transition: CustomTransition
+      }
+    }
+  }
+});
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      slots: {
+        root: 'div',
+        transition: CustomTransition
+      }
+    }
+  }
+});
+fn({
+  MuiBackdrop: {
+    defaultProps: {
+      slots: {
+        root: 'div',
+        transition: SlotTransition
+      }
+    }
+  }
+});
 fn({
   MuiBackdrop: {
     defaultProps: {

package/node/deprecations/step-label-props/step-label-props.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = transformer;
 var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
+var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
+var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -18,5 +20,17 @@ function transformer(file, api, options) {
     root,
     componentName: 'StepLabel'
   });
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'StepLabel',
+    propName: 'StepIconComponent',
+    slotName: 'stepIcon'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'StepLabel',
+    propName: 'StepIconProps',
+    slotName: 'stepIcon'
+  });
   return root.toSource(printOptions);
 }

package/node/deprecations/step-label-props/test-cases/actual.js

@@ -18,4 +18,27 @@ var _jsxRuntime = require("react/jsx-runtime");
   componentsProps: {
     label: componentsLabelProps
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  componentsProps: {
+    label: componentsLabelProps
+  },
+  StepIconProps: StepIconProps
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  slots: {
+    label: SlotsLabel
+  },
+  slotProps: {
+    label: slotLabelProps
+  },
+  componentsProps: {
+    label: componentsLabelProps
+  },
+  StepIconComponent: StepIconComponent,
+  StepIconProps: StepIconProps
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  StepIconComponent: StepIconComponent,
+  StepIconProps: StepIconProps
 });

package/node/deprecations/step-label-props/test-cases/expected.js

@@ -18,4 +18,31 @@ var _jsxRuntime = require("react/jsx-runtime");
       ...slotLabelProps
     }
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  slotProps: {
+    label: componentsLabelProps,
+    stepIcon: StepIconProps
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  slots: {
+    label: SlotsLabel,
+    stepIcon: StepIconComponent
+  },
+  slotProps: {
+    label: {
+      ...componentsLabelProps,
+      ...slotLabelProps
+    },
+    stepIcon: StepIconProps
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepLabel.default, {
+  slots: {
+    stepIcon: StepIconComponent
+  },
+  slotProps: {
+    stepIcon: StepIconProps
+  }
 });

package/node/deprecations/step-label-props/test-cases/theme.actual.js

@@ -20,4 +20,26 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiStepLabel: {
+    defaultProps: {
+      StepIconComponent: StepIconComponent,
+      StepIconProps: StepIconProps
+    }
+  }
+});
+fn({
+  MuiStepLabel: {
+    defaultProps: {
+      componentsProps: {
+        label: componentsLabelProps
+      },
+      slotProps: {
+        label: slotLabelProps
+      },
+      StepIconComponent: StepIconComponent,
+      StepIconProps: StepIconProps
+    }
+  }
 });

package/node/deprecations/step-label-props/test-cases/theme.expected.js

@@ -20,4 +20,32 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiStepLabel: {
+    defaultProps: {
+      slots: {
+        stepIcon: StepIconComponent
+      },
+      slotProps: {
+        stepIcon: StepIconProps
+      }
+    }
+  }
+});
+fn({
+  MuiStepLabel: {
+    defaultProps: {
+      slotProps: {
+        label: {
+          ...componentsLabelProps,
+          ...slotLabelProps
+        },
+        stepIcon: StepIconProps
+      },
+      slots: {
+        stepIcon: StepIconComponent
+      }
+    }
+  }
 });

package/node/deprecations/tooltip-props/test-cases/actual.js

@@ -2,6 +2,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
   components: {
@@ -89,4 +90,52 @@ var _jsxRuntime = require("react/jsx-runtime");
     tooltip: componentsTooltipProps,
     transition: componentsTransitionProps
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+  PopperComponent: CustomPopper,
+  TransitionComponent: CustomTransition,
+  PopperProps: {
+    disablePortal: true
+  },
+  TransitionProps: {
+    timeout: 200
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+  PopperComponent: CustomPopper,
+  TransitionComponent: CustomTransition,
+  PopperProps: {
+    disablePortal: true
+  },
+  TransitionProps: {
+    timeout: 200
+  },
+  slotProps: {
+    tooltip: {
+      height: 20
+    }
+  },
+  slots: {
+    tooltip: "div"
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+  PopperComponent: CustomPopper,
+  TransitionComponent: CustomTransition,
+  PopperProps: {
+    disablePortal: true
+  },
+  TransitionProps: {
+    timeout: 200
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTooltip, {
+  PopperComponent: CustomPopper,
+  TransitionComponent: CustomTransition,
+  PopperProps: {
+    disablePortal: true
+  },
+  TransitionProps: {
+    timeout: 200
+  }
 });

package/node/deprecations/tooltip-props/test-cases/expected.js

@@ -2,6 +2,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
   slots: {
@@ -81,4 +82,60 @@ var _jsxRuntime = require("react/jsx-runtime");
       ...slotsTransitionProps
     }
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+  slots: {
+    popper: CustomPopper,
+    transition: CustomTransition
+  },
+  slotProps: {
+    popper: {
+      disablePortal: true
+    },
+    transition: {
+      timeout: 200
+    }
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+  slotProps: {
+    tooltip: {
+      height: 20
+    },
+    popper: {
+      disablePortal: true
+    },
+    transition: {
+      timeout: 200
+    }
+  },
+  slots: {
+    tooltip: "div",
+    popper: CustomPopper,
+    transition: CustomTransition
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
+  slots: {
+    popper: CustomPopper,
+    transition: CustomTransition
+  },
+  slotProps: {
+    popper: {
+      disablePortal: true
+    },
+    transition: {
+      timeout: 200
+    }
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTooltip, {
+  PopperComponent: CustomPopper,
+  TransitionComponent: CustomTransition,
+  PopperProps: {
+    disablePortal: true
+  },
+  TransitionProps: {
+    timeout: 200
+  }
 });

package/node/deprecations/tooltip-props/test-cases/theme.actual.js

@@ -70,4 +70,40 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiTooltip: {
+    defaultProps: {
+      PopperComponent: CustomPopper,
+      TransitionComponent: CustomTransition,
+      PopperProps: {
+        disablePortal: true
+      },
+      TransitionProps: {
+        timeout: 200
+      }
+    }
+  }
+});
+fn({
+  MuiTooltip: {
+    defaultProps: {
+      PopperComponent: CustomPopper,
+      TransitionComponent: CustomTransition,
+      PopperProps: {
+        disablePortal: true
+      },
+      TransitionProps: {
+        timeout: 200
+      },
+      slotProps: {
+        tooltip: {
+          height: 20
+        }
+      },
+      slots: {
+        tooltip: "div"
+      }
+    }
+  }
 });

package/node/deprecations/tooltip-props/test-cases/theme.expected.js

@@ -62,4 +62,44 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiTooltip: {
+    defaultProps: {
+      slots: {
+        popper: CustomPopper,
+        transition: CustomTransition
+      },
+      slotProps: {
+        popper: {
+          disablePortal: true
+        },
+        transition: {
+          timeout: 200
+        }
+      }
+    }
+  }
+});
+fn({
+  MuiTooltip: {
+    defaultProps: {
+      slotProps: {
+        tooltip: {
+          height: 20
+        },
+        popper: {
+          disablePortal: true
+        },
+        transition: {
+          timeout: 200
+        }
+      },
+      slots: {
+        tooltip: "div",
+        popper: CustomPopper,
+        transition: CustomTransition
+      }
+    }
+  }
 });

package/node/deprecations/tooltip-props/tooltip-props.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = transformer;
 var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
+var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
+var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -18,5 +20,29 @@ function transformer(file, api, options) {
     root,
     componentName: 'Tooltip'
   });
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'Tooltip',
+    propName: 'PopperComponent',
+    slotName: 'popper'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'Tooltip',
+    propName: 'PopperProps',
+    slotName: 'popper'
+  });
+  (0, _movePropIntoSlots.default)(j, {
+    root,
+    componentName: 'Tooltip',
+    propName: 'TransitionComponent',
+    slotName: 'transition'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'Tooltip',
+    propName: 'TransitionProps',
+    slotName: 'transition'
+  });
   return root.toSource(printOptions);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/codemod",
-  "version": "6.1.7",
+  "version": "6.1.8",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",
@@ -29,7 +29,7 @@
     "@babel/traverse": "^7.25.9",
     "jscodeshift": "^17.1.1",
     "jscodeshift-add-imports": "^1.0.11",
-    "postcss": "^8.4.47",
+    "postcss": "^8.4.49",
     "postcss-cli": "^11.0.0",
     "yargs": "^17.7.2"
   },