@mui/codemod 9.0.0-alpha.1 → 9.0.0-beta.0

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

@@ -12,6 +12,183 @@ var _findComponentJSX = _interopRequireDefault(require("../../util/findComponent
 var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
 var _assignObject = _interopRequireDefault(require("../../util/assignObject"));
 var _appendAttribute = _interopRequireDefault(require("../../util/appendAttribute"));
+function getImportedNames(j, root, packageName, componentName) {
+  const importNames = new Set();
+  root.find(j.ImportDeclaration).filter(path => path.node.source.value.match(new RegExp(`^${packageName}(/${componentName})?$`))).forEach(path => {
+    path.node.specifiers.forEach(specifier => {
+      if (specifier.type === 'ImportDefaultSpecifier') {
+        importNames.add(specifier.local.name);
+      }
+      if (specifier.type === 'ImportSpecifier' && specifier.imported.name === componentName) {
+        importNames.add(specifier.local.name);
+      }
+    });
+  });
+  return importNames;
+}
+function getAttributeIndex(element, attributeName) {
+  return element.openingElement.attributes.findIndex(attr => attr.type === 'JSXAttribute' && attr.name.name === attributeName);
+}
+function upsertSlotPropsAttribute(j, element, callback) {
+  const slotPropsIndex = getAttributeIndex(element, 'slotProps');
+  if (slotPropsIndex === -1) {
+    const slotPropsExpression = j.objectExpression([]);
+    callback(slotPropsExpression);
+    (0, _appendAttribute.default)(j, {
+      target: element,
+      attributeName: 'slotProps',
+      expression: slotPropsExpression
+    });
+    return;
+  }
+  const slotPropsAttribute = element.openingElement.attributes[slotPropsIndex];
+  const slotPropsExpression = slotPropsAttribute.value.expression;
+  if (slotPropsExpression.type === 'ObjectExpression') {
+    callback(slotPropsExpression);
+    return;
+  }
+  const nextSlotPropsExpression = j.objectExpression([j.spreadElement(slotPropsExpression)]);
+  callback(nextSlotPropsExpression);
+  slotPropsAttribute.value.expression = nextSlotPropsExpression;
+}
+function moveJsxPropIntoSlotProps(j, element, propName, slotName) {
+  const propIndex = getAttributeIndex(element, propName);
+  if (propIndex === -1) {
+    return;
+  }
+  const removedAttribute = element.openingElement.attributes.splice(propIndex, 1)[0];
+  const removedValue = removedAttribute.value.type === 'StringLiteral' ? j.literal(removedAttribute.value.value) : removedAttribute.value.expression;
+  upsertSlotPropsAttribute(j, element, slotPropsExpression => {
+    const existingSlotIndex = slotPropsExpression.properties.findIndex(property => property.type !== 'SpreadElement' && property.key?.name === slotName);
+    if (existingSlotIndex === -1) {
+      slotPropsExpression.properties.push(j.objectProperty(j.identifier(slotName), removedValue));
+      return;
+    }
+    const existingSlot = slotPropsExpression.properties[existingSlotIndex].value;
+    slotPropsExpression.properties[existingSlotIndex].value = j.objectExpression([j.spreadElement(removedValue), j.spreadElement(existingSlot)]);
+  });
+}
+function ensureParamsSlotPropsSpread(j, element, paramsName) {
+  const hasParamsSpread = element.openingElement.attributes.some(attribute => attribute.type === 'JSXSpreadAttribute' && attribute.argument.type === 'Identifier' && attribute.argument.name === paramsName);
+  if (!hasParamsSpread) {
+    return;
+  }
+  upsertSlotPropsAttribute(j, element, slotPropsExpression => {
+    const hasSlotPropsSpread = slotPropsExpression.properties.some(property => property.type === 'SpreadElement' && property.argument.type === 'MemberExpression' && property.argument.object.type === 'Identifier' && property.argument.object.name === paramsName && property.argument.property.type === 'Identifier' && property.argument.property.name === 'slotProps');
+    if (!hasSlotPropsSpread) {
+      slotPropsExpression.properties.unshift(j.spreadElement(j.memberExpression(j.identifier(paramsName), j.identifier('slotProps'))));
+    }
+  });
+}
+function replaceRenderInputParamsMembers(j, callbackRoot, paramsName) {
+  const slotPropByDeprecatedName = {
+    InputProps: 'input',
+    inputProps: 'htmlInput',
+    InputLabelProps: 'inputLabel'
+  };
+  callbackRoot.find(j.MemberExpression).filter(path => path.node.object.type === 'Identifier' && path.node.object.name === paramsName && path.node.property.type === 'Identifier' && slotPropByDeprecatedName[path.node.property.name]).replaceWith(path => j.memberExpression(j.memberExpression(j.identifier(paramsName), j.identifier('slotProps')), j.identifier(slotPropByDeprecatedName[path.node.property.name])));
+}
+function transformRenderInput(j, root, options) {
+  const packageName = options.packageName || '@mui/material';
+  const textFieldNames = getImportedNames(j, root, packageName, 'TextField');
+  (0, _findComponentJSX.default)(j, {
+    root,
+    packageName: options.packageName,
+    componentName: 'Autocomplete'
+  }, elementPath => {
+    const renderInputIndex = getAttributeIndex(elementPath.node, 'renderInput');
+    if (renderInputIndex === -1) {
+      return;
+    }
+    const renderInputAttribute = elementPath.node.openingElement.attributes[renderInputIndex];
+    const renderInputExpression = renderInputAttribute.value?.expression;
+    if (!renderInputExpression || !['ArrowFunctionExpression', 'FunctionExpression'].includes(renderInputExpression.type) || renderInputExpression.params.length === 0 || renderInputExpression.params[0].type !== 'Identifier') {
+      return;
+    }
+    const paramsName = renderInputExpression.params[0].name;
+    const callbackRoot = j(renderInputExpression.body);
+    replaceRenderInputParamsMembers(j, callbackRoot, paramsName);
+    textFieldNames.forEach(textFieldName => {
+      const textFieldElements = [];
+      if (renderInputExpression.body.type === 'JSXElement' && renderInputExpression.body.openingElement.name.type === 'JSXIdentifier' && renderInputExpression.body.openingElement.name.name === textFieldName) {
+        textFieldElements.push(renderInputExpression.body);
+      }
+      callbackRoot.find(j.JSXElement).filter(textFieldPath => textFieldPath.node.openingElement.name.type === 'JSXIdentifier' && textFieldPath.node.openingElement.name.name === textFieldName).forEach(textFieldPath => {
+        textFieldElements.push(textFieldPath.node);
+      });
+      textFieldElements.forEach(element => {
+        moveJsxPropIntoSlotProps(j, element, 'InputProps', 'input');
+        moveJsxPropIntoSlotProps(j, element, 'inputProps', 'htmlInput');
+        moveJsxPropIntoSlotProps(j, element, 'InputLabelProps', 'inputLabel');
+        moveJsxPropIntoSlotProps(j, element, 'SelectProps', 'select');
+        moveJsxPropIntoSlotProps(j, element, 'FormHelperTextProps', 'formHelperText');
+        if (getAttributeIndex(element, 'slotProps') !== -1) {
+          ensureParamsSlotPropsSpread(j, element, paramsName);
+        }
+      });
+    });
+  });
+}
+function isNonComputedKey(j, path) {
+  const parent = path.parent.node;
+  return (j.ObjectProperty.check(parent) || j.Property.check(parent)) && parent.key === path.node && !parent.computed;
+}
+function renameIdentifiersInScope(j, scopePath, oldName, newName) {
+  const bindingScope = scopePath.scope.lookup(oldName);
+  if (!bindingScope) {
+    return;
+  }
+  j(bindingScope.path).find(j.Identifier, {
+    name: oldName
+  }).filter(path => {
+    if (isNonComputedKey(j, path)) {
+      return false;
+    }
+    return path.scope.lookup(oldName) === bindingScope;
+  }).replaceWith(() => j.identifier(newName));
+}
+function renameRenderTagsCallback(j, callbackPath) {
+  const getTagPropsParam = callbackPath.node.params[1];
+  if (getTagPropsParam?.type === 'Identifier' && getTagPropsParam.name === 'getTagProps') {
+    renameIdentifiersInScope(j, callbackPath, 'getTagProps', 'getItemProps');
+  }
+}
+function renameRenderTagsProp(j, propertyPath) {
+  if (propertyPath.node.key.type === 'Identifier') {
+    propertyPath.node.key.name = 'renderValue';
+  }
+  if (propertyPath.node.value.type === 'ArrowFunctionExpression' || propertyPath.node.value.type === 'FunctionExpression') {
+    renameRenderTagsCallback(j, propertyPath.get('value'));
+  }
+}
+function renameUseAutocompleteReturnMembers(j, root) {
+  const renamedMembers = new Map([['getTagProps', 'getItemProps'], ['focusedTag', 'focusedItem']]);
+  root.find(j.VariableDeclarator).filter(path => {
+    const {
+      id,
+      init
+    } = path.node;
+    return id.type === 'ObjectPattern' && init?.type === 'CallExpression' && init.callee.type === 'Identifier' && init.callee.name === 'useAutocomplete';
+  }).forEach(path => {
+    path.node.id.properties.forEach(property => {
+      if (property.type !== 'ObjectProperty' || property.key.type !== 'Identifier') {
+        return;
+      }
+      const nextName = renamedMembers.get(property.key.name);
+      if (!nextName) {
+        return;
+      }
+      const isShorthand = property.shorthand === true;
+      const localName = property.value.type === 'Identifier' ? property.value.name : null;
+      property.key.name = nextName;
+      if (isShorthand && localName) {
+        renameIdentifiersInScope(j, path, localName, nextName);
+        property.shorthand = true;
+      }
+    });
+  });
+}
+
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -53,6 +230,7 @@ function transformer(file, api, options) {
     packageName: options.packageName,
     componentName: 'Autocomplete'
   });
+  transformRenderInput(j, root, options);
 
   // Move ListboxComponent JSX prop into slotProps.listbox.component
   (0, _findComponentJSX.default)(j, {
@@ -61,6 +239,15 @@ function transformer(file, api, options) {
     componentName: 'Autocomplete'
   }, elementPath => {
     const element = elementPath.node;
+    element.openingElement.attributes.forEach((attribute, index) => {
+      if (attribute.type !== 'JSXAttribute' || attribute.name.name !== 'renderTags') {
+        return;
+      }
+      attribute.name.name = 'renderValue';
+      if (attribute.value?.type === 'JSXExpressionContainer' && (attribute.value.expression.type === 'ArrowFunctionExpression' || attribute.value.expression.type === 'FunctionExpression')) {
+        renameRenderTagsCallback(j, elementPath.get('openingElement', 'attributes', index, 'value', 'expression'));
+      }
+    });
     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;
@@ -127,5 +314,13 @@ function transformer(file, api, options) {
     }
     path.prune();
   });
+  defaultPropsPathCollection.find(j.ObjectProperty, {
+    key: {
+      name: 'renderTags'
+    }
+  }).forEach(path => {
+    renameRenderTagsProp(j, path);
+  });
+  renameUseAutocompleteReturnMembers(j, root);
   return root.toSource(printOptions);
 }

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