@mui/codemod 9.0.0-alpha.1 → 9.0.0-alpha.4

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

@@ -3,6 +3,8 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
 var _material = require("@mui/material");
+var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
+var _useAutocomplete = _interopRequireDefault(require("@mui/material/useAutocomplete"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
   ChipProps: {
@@ -110,4 +112,33 @@ var _jsxRuntime = require("react/jsx-runtime");
   ListboxProps: {
     height: 12
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  multiple: true,
+  options: options,
+  renderTags: (value, getTagProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+    label: option.label,
+    "data-focused": ownerState.focused,
+    ...getTagProps({
+      index
+    })
+  }))
+});
+const {
+  getTagProps,
+  focusedTag
+} = (0, _useAutocomplete.default)(props);
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+  ...getTagProps({
+    index: focusedTag
+  })
+});
+const {
+  getTagProps: getAutocompleteTagProps,
+  focusedTag: focusedAutocompleteTag
+} = (0, _useAutocomplete.default)(props);
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+  ...getAutocompleteTagProps({
+    index: focusedAutocompleteTag
+  })
 });

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

@@ -3,6 +3,8 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
 var _material = require("@mui/material");
+var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
+var _useAutocomplete = _interopRequireDefault(require("@mui/material/useAutocomplete"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
   slots: {
@@ -122,4 +124,33 @@ var _jsxRuntime = require("react/jsx-runtime");
   ListboxProps: {
     height: 12
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  multiple: true,
+  options: options,
+  renderValue: (value, getItemProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+    label: option.label,
+    "data-focused": ownerState.focused,
+    ...getItemProps({
+      index
+    })
+  }))
+});
+const {
+  getItemProps,
+  focusedItem
+} = (0, _useAutocomplete.default)(props);
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+  ...getItemProps({
+    index: focusedItem
+  })
+});
+const {
+  getItemProps: getAutocompleteTagProps,
+  focusedItem: focusedAutocompleteTag
+} = (0, _useAutocomplete.default)(props);
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+  ...getAutocompleteTagProps({
+    index: focusedAutocompleteTag
+  })
 });

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

@@ -3,6 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Autocomplete = _interopRequireDefault(require("@org/ui/material/Autocomplete"));
 var _material = require("@org/ui/material");
+var _Chip = _interopRequireDefault(require("@org/ui/material/Chip"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
   ChipProps: {
@@ -110,4 +111,14 @@ var _jsxRuntime = require("react/jsx-runtime");
   ListboxProps: {
     height: 12
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  multiple: true,
+  options: options,
+  renderTags: (value, getTagProps) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+    label: option.label,
+    ...getTagProps({
+      index
+    })
+  }))
 });

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

@@ -3,6 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _Autocomplete = _interopRequireDefault(require("@org/ui/material/Autocomplete"));
 var _material = require("@org/ui/material");
+var _Chip = _interopRequireDefault(require("@org/ui/material/Chip"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
   slots: {
@@ -122,4 +123,14 @@ var _jsxRuntime = require("react/jsx-runtime");
   ListboxProps: {
     height: 12
   }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  multiple: true,
+  options: options,
+  renderValue: (value, getItemProps) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+    label: option.label,
+    ...getItemProps({
+      index
+    })
+  }))
 });

package/deprecations/autocomplete-props/test-cases/render-input-package.actual.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _TextField = _interopRequireDefault(require("@org/ui/material/TextField"));
+var _Autocomplete = _interopRequireDefault(require("@org/ui/material/Autocomplete"));
+var _material = require("@org/ui/material");
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    inputProps: {
+      ...params.inputProps,
+      autoComplete: 'new-password'
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    inputProps: {
+      ...params.inputProps,
+      autoComplete: 'new-password'
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    inputProps: {
+      ...params.inputProps,
+      autoComplete: 'new-password'
+    }
+  })
+});

package/deprecations/autocomplete-props/test-cases/render-input-package.expected.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _TextField = _interopRequireDefault(require("@org/ui/material/TextField"));
+var _Autocomplete = _interopRequireDefault(require("@org/ui/material/Autocomplete"));
+var _material = require("@org/ui/material");
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      htmlInput: {
+        ...params.slotProps.htmlInput,
+        autoComplete: 'new-password'
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      htmlInput: {
+        ...params.slotProps.htmlInput,
+        autoComplete: 'new-password'
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    inputProps: {
+      ...params.inputProps,
+      autoComplete: 'new-password'
+    }
+  })
+});

package/deprecations/autocomplete-props/test-cases/render-input.actual.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var React = _interopRequireWildcard(require("react"));
+var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
+var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
+var _material = require("@mui/material");
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    InputProps: {
+      ...params.InputProps,
+      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+        children: params.InputProps.endAdornment
+      })
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    inputProps: {
+      ...params.inputProps,
+      autoComplete: 'new-password'
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      input: {
+        ...params.InputProps,
+        type: 'search'
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      inputLabel: {
+        ...params.InputLabelProps,
+        shrink: true
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ref: params.InputProps.ref,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+      ...params.inputProps
+    })
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    InputProps: {
+      ...params.InputProps,
+      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+        children: params.InputProps.endAdornment
+      })
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    InputProps: {
+      ...params.InputProps,
+      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+        children: params.InputProps.endAdornment
+      })
+    }
+  })
+});

package/deprecations/autocomplete-props/test-cases/render-input.expected.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var React = _interopRequireWildcard(require("react"));
+var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
+var _Autocomplete = _interopRequireDefault(require("@mui/material/Autocomplete"));
+var _material = require("@mui/material");
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      input: {
+        ...params.slotProps.input,
+        endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+          children: params.slotProps.input.endAdornment
+        })
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      htmlInput: {
+        ...params.slotProps.htmlInput,
+        autoComplete: 'new-password'
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      input: {
+        ...params.slotProps.input,
+        type: 'search'
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      inputLabel: {
+        ...params.slotProps.inputLabel,
+        shrink: true
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Autocomplete.default, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ref: params.slotProps.input.ref,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+      ...params.slotProps.htmlInput
+    })
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    slotProps: {
+      ...params.slotProps,
+      input: {
+        ...params.slotProps.input,
+        endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+          children: params.slotProps.input.endAdornment
+        })
+      }
+    }
+  })
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(CustomAutocomplete, {
+  renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+    ...params,
+    InputProps: {
+      ...params.InputProps,
+      endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+        children: params.InputProps.endAdornment
+      })
+    }
+  })
+});

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

@@ -1,5 +1,6 @@
 "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
 fn({
   MuiAutocomplete: {
     defaultProps: {
@@ -12,6 +13,13 @@ fn({
       ListboxProps: {
         height: 12
       },
+      renderTags: (value, getTagProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+        label: option.label,
+        "data-focused": ownerState.focused,
+        ...getTagProps({
+          index
+        })
+      })),
       componentsProps: {
         clearIndicator: {
           width: 10
@@ -41,6 +49,13 @@ fn({
       ListboxProps: {
         height: 12
       },
+      renderTags: (value, getTagProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+        label: option.label,
+        "data-focused": ownerState.focused,
+        ...getTagProps({
+          index
+        })
+      })),
       slotProps: {
         popupIndicator: {
           width: 20

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

@@ -1,8 +1,16 @@
 "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
 fn({
   MuiAutocomplete: {
     defaultProps: {
+      renderValue: (value, getItemProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+        label: option.label,
+        "data-focused": ownerState.focused,
+        ...getItemProps({
+          index
+        })
+      })),
       slots: {
         paper: CustomPaper,
         popper: CustomPopper
@@ -36,6 +44,13 @@ fn({
 fn({
   MuiAutocomplete: {
     defaultProps: {
+      renderValue: (value, getItemProps, ownerState) => value.map((option, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+        label: option.label,
+        "data-focused": ownerState.focused,
+        ...getItemProps({
+          index
+        })
+      })),
       slotProps: {
         clearIndicator: {
           width: 10

package/deprecations/circular-progress-classes/circular-progress-classes.js

@@ -34,7 +34,7 @@ function transformer(file, api, options) {
             if (parent.type === j.TemplateLiteral.name) {
               const memberExpressionIndex = parent.expressions.findIndex(expression => expression === memberExpression.value);
               const precedingTemplateElement = parent.quasis[memberExpressionIndex];
-              const atomicClasses = replacementSelector.replaceAll('MuiCircularProgress-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').split('.').filter(Boolean);
+              const atomicClasses = replacementSelector.replaceAll('MuiCircularProgress-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').replaceAll(' ', '').split('.').filter(Boolean);
               if (precedingTemplateElement.value.raw.endsWith(deprecatedClass.startsWith(' ') ? `${replacementSelectorPrefix} .` : `${replacementSelectorPrefix}.`)) {
                 const atomicClassesArgs = [memberExpressionIndex, 1, ...atomicClasses.map(atomicClass => j.memberExpression(memberExpression.value.object, j.identifier(atomicClass)))];
                 parent.expressions.splice(...atomicClassesArgs);
@@ -53,6 +53,21 @@ function transformer(file, api, options) {
                     }, false));
                   }
                   parent.quasis.splice(...quasisArgs);
+                } else if (replacementSelector.includes(' .')) {
+                  const quasisArgs = [memberExpressionIndex, 1, j.templateElement({
+                    raw: precedingTemplateElement.value.raw.replace(/ \.$/, '.'),
+                    cooked: precedingTemplateElement.value.cooked.replace(/ \.$/, '.')
+                  }, false), j.templateElement({
+                    raw: ' .',
+                    cooked: ' .'
+                  }, false)];
+                  if (atomicClasses.length === 3) {
+                    quasisArgs.splice(3, 0, j.templateElement({
+                      raw: ' .',
+                      cooked: ' .'
+                    }, false));
+                  }
+                  parent.quasis.splice(...quasisArgs);
                 } else {
                   parent.quasis.splice(memberExpressionIndex, 1, j.templateElement({
                     raw: precedingTemplateElement.value.raw,

package/deprecations/circular-progress-classes/postcss-plugin.js

@@ -2,10 +2,10 @@
 
 const classes = [{
   deprecatedClass: ' .MuiCircularProgress-circleDeterminate',
-  replacementSelector: '.MuiCircularProgress-determinate > .MuiCircularProgress-circle'
+  replacementSelector: '.MuiCircularProgress-determinate .MuiCircularProgress-circle'
 }, {
   deprecatedClass: ' .MuiCircularProgress-circleIndeterminate',
-  replacementSelector: '.MuiCircularProgress-indeterminate > .MuiCircularProgress-circle'
+  replacementSelector: '.MuiCircularProgress-indeterminate .MuiCircularProgress-circle'
 }];
 const plugin = () => {
   return {

package/deprecations/circular-progress-classes/test-cases/expected.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _CircularProgress = require("@mui/material/CircularProgress");
-"&.MuiCircularProgress-determinate > .MuiCircularProgress-circle";
-"&.MuiCircularProgress-indeterminate > .MuiCircularProgress-circle";
-`&.${_CircularProgress.circularProgressClasses.determinate} > .${_CircularProgress.circularProgressClasses.circle}`;
-`&.${_CircularProgress.circularProgressClasses.indeterminate} > .${_CircularProgress.circularProgressClasses.circle}`;
+"&.MuiCircularProgress-determinate .MuiCircularProgress-circle";
+"&.MuiCircularProgress-indeterminate .MuiCircularProgress-circle";
+`&.${_CircularProgress.circularProgressClasses.determinate} .${_CircularProgress.circularProgressClasses.circle}`;
+`&.${_CircularProgress.circularProgressClasses.indeterminate} .${_CircularProgress.circularProgressClasses.circle}`;

package/deprecations/circular-progress-classes/test-cases/package.expected.js

@@ -1,7 +1,7 @@
 "use strict";
 
 var _CircularProgress = require("@org/ui/material/CircularProgress");
-"&.MuiCircularProgress-determinate > .MuiCircularProgress-circle";
-"&.MuiCircularProgress-indeterminate > .MuiCircularProgress-circle";
-`&.${_CircularProgress.circularProgressClasses.determinate} > .${_CircularProgress.circularProgressClasses.circle}`;
-`&.${_CircularProgress.circularProgressClasses.indeterminate} > .${_CircularProgress.circularProgressClasses.circle}`;
+"&.MuiCircularProgress-determinate .MuiCircularProgress-circle";
+"&.MuiCircularProgress-indeterminate .MuiCircularProgress-circle";
+`&.${_CircularProgress.circularProgressClasses.determinate} .${_CircularProgress.circularProgressClasses.circle}`;
+`&.${_CircularProgress.circularProgressClasses.indeterminate} .${_CircularProgress.circularProgressClasses.circle}`;

package/deprecations/tabs-props/tabs-props.js

@@ -7,6 +7,37 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = transformer;
 var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
 var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
+var _findComponentJSX = _interopRequireDefault(require("../../util/findComponentJSX"));
+var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
+const slotKeyRenames = {
+  StartScrollButtonIcon: 'startScrollButtonIcon',
+  EndScrollButtonIcon: 'endScrollButtonIcon'
+};
+function renameSlotKey(property) {
+  const name = property.key?.name || property.key?.value;
+  if (name && slotKeyRenames[name]) {
+    property.key.name = slotKeyRenames[name];
+  }
+}
+function renameJsxSlotKeys(j, element, attributeName) {
+  element.openingElement.attributes.forEach(attr => {
+    if (attr.type === 'JSXAttribute' && attr.name?.name === attributeName && attr.value?.expression?.type === 'ObjectExpression') {
+      attr.value.expression.properties.forEach(renameSlotKey);
+    }
+  });
+}
+function renameDefaultPropsSlotKeys(j, defaultPropsPathCollection, attributeName) {
+  defaultPropsPathCollection.find(j.ObjectProperty, {
+    key: {
+      name: attributeName
+    }
+  }).forEach(path => {
+    if (path.value.value.type === 'ObjectExpression') {
+      path.value.value.properties.forEach(renameSlotKey);
+    }
+  });
+}
+
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -36,5 +67,18 @@ function transformer(file, api, options) {
     propName: 'TabIndicatorProps',
     slotName: 'indicator'
   });
+  (0, _findComponentJSX.default)(j, {
+    root,
+    packageName: options.packageName,
+    componentName: 'Tabs'
+  }, elementPath => {
+    renameJsxSlotKeys(j, elementPath.node, 'slots');
+  });
+  const defaultPropsPathCollection = (0, _findComponentDefaultProps.default)(j, {
+    root,
+    packageName: options.packageName,
+    componentName: 'Tabs'
+  });
+  renameDefaultPropsSlotKeys(j, defaultPropsPathCollection, 'slots');
   return root.toSource(printOptions);
 }

package/deprecations/tabs-props/test-cases/actual.js

@@ -22,6 +22,17 @@ var _jsxRuntime = require("react/jsx-runtime");
     className: 'indicator'
   }
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+  slots: {
+    StartScrollButtonIcon: CustomIcon,
+    EndScrollButtonIcon: CustomIcon2
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tabs, {
+  slots: {
+    StartScrollButtonIcon: CustomIcon
+  }
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
   ScrollButtonComponent: CustomScrollButton,
   TabScrollButtonProps: {

package/deprecations/tabs-props/test-cases/expected.js

@@ -30,6 +30,17 @@ var _jsxRuntime = require("react/jsx-runtime");
     }
   }
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+  slots: {
+    startScrollButtonIcon: CustomIcon,
+    endScrollButtonIcon: CustomIcon2
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tabs, {
+  slots: {
+    startScrollButtonIcon: CustomIcon
+  }
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
   ScrollButtonComponent: CustomScrollButton,
   TabScrollButtonProps: {

package/deprecations/tabs-props/test-cases/package.actual.js

@@ -22,6 +22,12 @@ var _jsxRuntime = require("react/jsx-runtime");
     className: 'indicator'
   }
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+  slots: {
+    StartScrollButtonIcon: CustomIcon,
+    EndScrollButtonIcon: CustomIcon2
+  }
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
   ScrollButtonComponent: CustomScrollButton,
   TabScrollButtonProps: {

package/deprecations/tabs-props/test-cases/package.expected.js

@@ -30,6 +30,12 @@ var _jsxRuntime = require("react/jsx-runtime");
     }
   }
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+  slots: {
+    startScrollButtonIcon: CustomIcon,
+    endScrollButtonIcon: CustomIcon2
+  }
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTabs, {
   ScrollButtonComponent: CustomScrollButton,
   TabScrollButtonProps: {

package/deprecations/tabs-props/test-cases/theme.actual.js

@@ -12,4 +12,14 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiTabs: {
+    defaultProps: {
+      slots: {
+        StartScrollButtonIcon: CustomIcon,
+        EndScrollButtonIcon: CustomIcon2
+      }
+    }
+  }
 });

package/deprecations/tabs-props/test-cases/theme.expected.js

@@ -16,4 +16,14 @@ fn({
       }
     }
   }
+});
+fn({
+  MuiTabs: {
+    defaultProps: {
+      slots: {
+        startScrollButtonIcon: CustomIcon,
+        endScrollButtonIcon: CustomIcon2
+      }
+    }
+  }
 });