@mui/codemod 7.3.8 → 7.3.10

package/CHANGELOG.md

@@ -1,5 +1,91 @@
 # [Versions](https://mui.com/versions/)
 
+## 7.3.10
+
+<!-- generated comparing v7.3.9..v7.x -->
+
+_Apr 8, 2026_
+
+A big thanks to the 15 contributors who made this release possible. A few highlights ✨:
+
+- 📖 Added the Menubar component page to the docs.
+
+### `@mui/material@7.3.10`
+
+- [alert][dialog] Accessibility improvements (#48161) @silviuaavram
+- [autocomplete] Add `root` slot (#47916) @GerardasB
+- [autocomplete] Fix helper text focusing input when clicked (#48162) @mj12albert
+- [autocomplete] Fix popup reopening on window focus regain with openOnFocus (#47914) @aman44444
+- [autocomplete] Optimize selected option lookup (#48027) @anchmelev
+- [autocomplete] Support full slots for clearIndicator and popupIndicator (#47913) @silviuaavram
+- [button-base] Fix native button detection (#47994) @mj12albert
+- [input] Fix high contrast cutoff on first character (#48160) @silviuaavram
+- [list item text][card header] Revert cleanup of duplicated CSS rules (#47938) @sai6855
+- [popper] Add missing classes export (#48033) @mj12albert
+- [select] Fix focus visible always set on menu item (#48022) @silviuaavram
+- [slider] Accept readonly array for the value prop (#47961) @pcorpet
+- [switch] Add border to make it visible in high contrast mode (#48210) @silviuaavram
+- [theme] Do not create channel tokens for custom colors when `nativeColor` is used (#48144) @ZeeshanTamboli
+- [transitions] Performance improvements & misc fixes (#48217) @mj12albert
+
+### Docs
+
+- [codemod] Add v7 migration docs for deprecated Autocomplete APIs and Autocomplete codemod (#47954) @ZeeshanTamboli
+- [menubar] Add Menubar component page (#47942) @siriwatknp
+- [progress] Label all demo components (#48168) @mj12albert
+- [system] Update `styled` API docs for easier understanding (#47969) @olivier-lxo
+- Fix the dark mode footer row shadow for the Data Grid on the advanced components page (#48152) @arminmeh
+- Fix MUI X redirects (#47917) @cherniavskii
+- Use direct palette vars in Tailwind v4 snippet (#47955) @Ahmad-Alaziz
+
+### Core
+
+- [blog] Blogpost for upcoming price changes for MUI X (#47820) @DanailH
+- [blog] Update the 2026 price changes blogpost (#47944) @DanailH
+- [code-infra] Add pkg-pr-new as dev dependency (#48023) @silviuaavram
+- [docs-infra] Update Release Instructions and Search Index v7 (#48109) @dav-is
+
+All contributors of this release in alphabetical order: @Ahmad-Alaziz, @aman44444, @anchmelev, @arminmeh, @cherniavskii, @DanailH, @dav-is, @GerardasB, @mj12albert, @olivier-lxo, @pcorpet, @sai6855, @silviuaavram, @siriwatknp, @ZeeshanTamboli
+
+## 7.3.9
+
+<!-- generated comparing v7.3.8..v7.x -->
+
+_Mar 5, 2026_
+
+A big thanks to the 15 contributors who made this release possible.
+
+### `@mui/material@7.3.9`
+
+- Clean up duplicated CSS rules (#47893) @sai6855
+- [theme] Generate `color-mix` value on top of default generated Material UI CSS variables (#47791) @ZeeshanTamboli
+- [tooltip] Fix error is thrown when wrapping an input which is disabled while focused (#47841) @ZeeshanTamboli
+- [table cell][theme] Apply `alpha` before color mixing to border bottom color when nativeColor + cssVariables is used (#47840) @ZeeshanTamboli
+
+### Docs
+
+- Fix small typo in NumberField page (#47888) @arthur-plazanet
+- Fix Theme builder video (#47855) @oliviertassinari
+- Add updated community theme resource (#47853) @PeterTYLiu
+- Fix the keyboard navigation in GroupedMenu example (#47848) @silviuaavram
+- Few copy fixes (#47810) @pavan-sh
+- Fix JSX in Overriding component structure docs (#47805) @ZeeshanTamboli
+- Fix SSR flicker sentence grammar (#47794) @pavan-sh
+- [system] Update sizing docs to clarify `(0, 1]` behavior. (#47851) @matthias-ccri
+- [theme] Fix `nativeColor` docs (#47759) (#47789) @ZeeshanTamboli
+
+### Core
+
+- point v7 subdomain to MUI X v7 docs (#113) @vmakhaev
+- [blog] Blogpost for upcoming price changes for MUI X (#47748) (#47910) @DanailH
+- [blog] Company Update: What we've been working on (and why) (alethomas) (#47626) (#47908) @alelthomas
+- [core] Update releaseChangelog.mjs (#47862) @mnajdova
+- [code-infra] Detect browser envs that don't support layout (#47813) (#47873) @Janpot
+- [code-infra] Enable undefined addition to optional properties (#47815) @brijeshb42
+- [docs-infra] Reapply Cookie Banner with Design Fixes (#47744) @dav-is
+
+All contributors of this release in alphabetical order: @alelthomas, @arthur-plazanet, @brijeshb42, @DanailH, @dav-is, @Janpot, @matthias-ccri, @mnajdova, @oliviertassinari, @pavan-sh, @PeterTYLiu, @sai6855, @silviuaavram, @vmakhaev, @ZeeshanTamboli
+
 ## 7.3.8
 
 <!-- generated comparing v7.3.7..master -->

package/README.md

@@ -14,7 +14,7 @@ Some of the codemods also run [postcss](https://github.com/postcss/postcss) plug
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod <codemod> <paths...>
+npx @mui/codemod@^7.0.0 <codemod> <paths...>
 
 Applies a `@mui/codemod` to the specified paths
 
@@ -278,6 +278,11 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 -  PopperComponent={CustomPopper}
 -  ListboxComponent={CustomListbox}
 -  ListboxProps={{ height: 12 }}
+-  renderTags={(value, getTagProps, ownerState) =>
+-    value.map((option, index) => (
+-      <Chip label={option.label} {...getTagProps({ index })} />
+-    ))
+-  }
 -  componentsProps={{
 -    clearIndicator: { width: 10 },
 -    paper: { width: 12 },
@@ -299,6 +304,11 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 +    popper: { width: 14 },
 +    popupIndicator: { width: 16 },
 +  }}
++  renderValue={(value, getItemProps, ownerState) =>
++    value.map((option, index) => (
++      <Chip label={option.label} {...getItemProps({ index })} />
++    ))
++  }
  />
 ```
 
@@ -310,6 +320,10 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 -    PopperComponent: CustomPopper,
 -    ListboxComponent: CustomListbox,
 -    ListboxProps: { height: 12 },
+-    renderTags: (value, getTagProps, ownerState) =>
+-      value.map((option, index) => (
+-        <Chip label={option.label} {...getTagProps({ index })} />
+-      )),
 -    componentsProps: {
 -       clearIndicator: { width: 10 },
 -       paper: { width: 12 },
@@ -331,10 +345,23 @@ npx @mui/codemod@latest deprecations/alert-props <path>
 +      popper: { width: 14 },
 +      popupIndicator: { width: 16 },
 +    },
++    renderValue: (value, getItemProps, ownerState) =>
++      value.map((option, index) => (
++        <Chip label={option.label} {...getItemProps({ index })} />
++      )),
    },
  },
 ```
 
+```diff
+ const {
+-  getTagProps,
+-  focusedTag,
++  getItemProps,
++  focusedItem,
+ } = useAutocomplete(props);
+```
+
 ```bash
 npx @mui/codemod@latest deprecations/autocomplete-props <path>
 ```
@@ -2182,7 +2209,7 @@ Replace the usage of the `alpha()`, `lighten()`, and `darken()` functions from `
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/grid-props <path>
+npx @mui/codemod@^7.0.0 v7.0.0/grid-props <path>
 ```
 
 Updates the usage of the `@mui/material/Grid`, `@mui/system/Grid`, and `@mui/joy/Grid` components to their updated APIs.
@@ -2203,7 +2230,7 @@ You can provide the theme breakpoints via options, for example, `--jscodeshift='
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/grid-props <path> --jscodeshift='--muiBreakpoints=mobile,desktop'
+npx @mui/codemod@^7.0.0 v7.0.0/grid-props <path> --jscodeshift='--muiBreakpoints=mobile,desktop'
 ```
 
 ```diff
@@ -2216,7 +2243,7 @@ npx @mui/codemod v7.0.0/grid-props <path> --jscodeshift='--muiBreakpoints=mobile
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/lab-removed-components <path>
+npx @mui/codemod@^7.0.0 v7.0.0/lab-removed-components <path>
 ```
 
 Update the import of the following components and hook moved from `@mui/lab` to `@mui/material`:
@@ -2262,12 +2289,12 @@ Updates the `InputLabel`'s `size` value from `normal` to `medium`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/input-label-size-normal-medium <path>
+npx @mui/codemod@^7.0.0 v7.0.0/input-label-size-normal-medium <path>
 ```
 
 <!-- #host-reference -->
 
-You can find more details about this breaking change in [the migration guide](https://next.mui.com/material-ui/migration/upgrade-to-v7/#inputlabel).
+You can find more details about this breaking change in [the migration guide](https://v7.mui.com/material-ui/migration/upgrade-to-v7/#inputlabel).
 
 ### v6.0.0
 
@@ -2782,7 +2809,7 @@ Renames `Autocomplete`'s `closeIcon` prop to `clearIcon`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/autocomplete-rename-closeicon  <path>
+npx @mui/codemod@^7.0.0 v5.0.0/autocomplete-rename-closeicon  <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#autocomplete).
@@ -2801,7 +2828,7 @@ Renames `Autocomplete`'s `getOptionSelected` to `isOptionEqualToValue`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/autocomplete-rename-option  <path>
+npx @mui/codemod@^7.0.0 v5.0.0/autocomplete-rename-option  <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#autocomplete).
@@ -2820,7 +2847,7 @@ Updates the `Avatar`'s `variant` value and `classes` key from 'circle' to 'circu
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/avatar-circle-circular <path>
+npx @mui/codemod@^7.0.0 v5.0.0/avatar-circle-circular <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#avatar).
@@ -2855,7 +2882,7 @@ Renames the badge's props.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/badge-overlap-value <path>
+npx @mui/codemod@^7.0.0 v5.0.0/badge-overlap-value <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#badge).
@@ -2879,7 +2906,7 @@ This change only affects Base UI components.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/base-rename-components-to-slots <path>
+npx @mui/codemod@^7.0.0 v5.0.0/base-rename-components-to-slots <path>
 ```
 
 The associated breaking change was done in [#34693](https://github.com/mui/material-ui/pull/34693).
@@ -2898,7 +2925,7 @@ Updates the Box API from separate system props to `sx`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/box-borderradius-values <path>
+npx @mui/codemod@^7.0.0 v5.0.0/box-borderradius-values <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#box).
@@ -2934,7 +2961,7 @@ Renames the Box `grid*Gap` props.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/box-rename-gap <path>
+npx @mui/codemod@^7.0.0 v5.0.0/box-rename-gap <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#box).
@@ -2951,7 +2978,7 @@ Removes the outdated `color` prop values.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/button-color-prop <path>
+npx @mui/codemod@^7.0.0 v5.0.0/button-color-prop <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#button).
@@ -2968,7 +2995,7 @@ Removes the Chip `variant` prop if the value is `"default"`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/chip-variant-prop <path>
+npx @mui/codemod@^7.0.0 v5.0.0/chip-variant-prop <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#chip).
@@ -2985,7 +3012,7 @@ Renames the CircularProgress `static` variant to `determinate`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/circularprogress-variant <path>
+npx @mui/codemod@^7.0.0 v5.0.0/circularprogress-variant <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#circularprogress).
@@ -3004,7 +3031,7 @@ Renames `Collapse`'s `collapsedHeight` prop to `collapsedSize`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/collapse-rename-collapsedheight <path>
+npx @mui/codemod@^7.0.0 v5.0.0/collapse-rename-collapsedheight <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#collapse).
@@ -3023,7 +3050,7 @@ A generic codemod to rename any component prop.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/component-rename-prop <path> -- --component=Grid --from=prop --to=newProp
+npx @mui/codemod@^7.0.0 v5.0.0/component-rename-prop <path> -- --component=Grid --from=prop --to=newProp
 ```
 
 #### `core-styles-import`
@@ -3135,7 +3162,7 @@ Renames the `fade` style utility import and calls to `alpha()`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/fade-rename-alpha <path>
+npx @mui/codemod@^7.0.0 v5.0.0/fade-rename-alpha <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#styles).
@@ -3152,7 +3179,7 @@ Renames `Grid`'s `justify` prop to `justifyContent`.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/grid-justify-justifycontent <path>
+npx @mui/codemod@^7.0.0 v5.0.0/grid-justify-justifycontent <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#grid).
@@ -3436,7 +3463,7 @@ or
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/moved-lab-modules <path>
+npx @mui/codemod@^7.0.0 v5.0.0/moved-lab-modules <path>
 ```
 
 You can find more details about this breaking change in the migration guide.
@@ -3500,7 +3527,7 @@ Fix private import paths.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/optimal-imports <path>
+npx @mui/codemod@^7.0.0 v5.0.0/optimal-imports <path>
 ```
 
 #### `root-ref`
@@ -3629,7 +3656,7 @@ Updates breakpoint values to match new logic. ⚠️ This mod is not idempotent,
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/theme-breakpoints <path>
+npx @mui/codemod@^7.0.0 v5.0.0/theme-breakpoints <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme).
@@ -3703,7 +3730,7 @@ Removes the 'px' suffix from some template strings.
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/theme-spacing <path>
+npx @mui/codemod@^7.0.0 v5.0.0/theme-spacing <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme).
@@ -3736,7 +3763,7 @@ Converts all `@mui/material` submodule imports to the root module:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/top-level-imports <path>
+npx @mui/codemod@^7.0.0 v5.0.0/top-level-imports <path>
 ```
 
 Head to https://mui.com/material-ui/guides/minimizing-bundle-size/ to understand when it's useful.
@@ -3788,7 +3815,7 @@ Updates Dialog, Menu, Popover, and Snackbar to use the `TransitionProps` prop to
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/use-transitionprops <path>
+npx @mui/codemod@^7.0.0 v5.0.0/use-transitionprops <path>
 ```
 
 You can find more details about this breaking change in [the migration guide](/material-ui/migration/v5-component-changes/#dialog).
@@ -3818,7 +3845,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v5.0.0/variant-prop <path>
+npx @mui/codemod@^7.0.0 v5.0.0/variant-prop <path>
 ```
 
 #### `with-mobile-dialog`
@@ -3929,7 +3956,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v4.0.0/theme-spacing-api <path>
+npx @mui/codemod@^7.0.0 v4.0.0/theme-spacing-api <path>
 ```
 
 This codemod tries to perform a basic expression simplification which can be improved for expressions that use more than one operation.
@@ -3956,7 +3983,7 @@ Converts all `@material-ui/core` imports more than 1 level deep to the optimal f
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v4.0.0/optimal-imports <path>
+npx @mui/codemod@^7.0.0 v4.0.0/optimal-imports <path>
 ```
 
 Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's useful.
@@ -3974,7 +4001,7 @@ Converts all `@material-ui/core` submodule imports to the root module:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v4.0.0/top-level-imports <path>
+npx @mui/codemod@^7.0.0 v4.0.0/top-level-imports <path>
 ```
 
 Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's useful.
@@ -3995,7 +4022,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v1.0.0/import-path <path>
+npx @mui/codemod@^7.0.0 v1.0.0/import-path <path>
 ```
 
 **Notice**: if you are migrating from pre-v1.0, and your imports use `material-ui`, you will need to manually find and replace all references to `material-ui` in your code to `@material-ui/core`. E.g.:
@@ -4022,7 +4049,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v1.0.0/color-imports <path>
+npx @mui/codemod@^7.0.0 v1.0.0/color-imports <path>
 ```
 
 **additional options**
@@ -4030,7 +4057,7 @@ npx @mui/codemod@latest v1.0.0/color-imports <path>
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v1.0.0/color-imports <path> -- --importPath='mui/styles/colors' --targetPath='mui/colors'
+npx @mui/codemod@^7.0.0 v1.0.0/color-imports <path> -- --importPath='mui/styles/colors' --targetPath='mui/colors'
 ```
 
 #### `svg-icon-imports`
@@ -4048,7 +4075,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v1.0.0/svg-icon-imports <path>
+npx @mui/codemod@^7.0.0 v1.0.0/svg-icon-imports <path>
 ```
 
 #### `menu-item-primary-text`
@@ -4066,7 +4093,7 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v1.0.0/menu-item-primary-text <path>
+npx @mui/codemod@^7.0.0 v1.0.0/menu-item-primary-text <path>
 ```
 
 ### v0.15.0
@@ -4090,5 +4117,5 @@ The diff should look like this:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod@latest v0.15.0/import-path <path>
+npx @mui/codemod@^7.0.0 v0.15.0/import-path <path>
 ```

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

@@ -12,6 +12,66 @@ 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 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
@@ -61,6 +121,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 +196,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/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/codemod",
-  "version": "7.3.8",
+  "version": "7.3.10",
   "author": "MUI Team",
   "description": "Codemod scripts for Material UI.",
   "bin": "./codemod.js",
@@ -26,6 +26,7 @@
     "@babel/core": "^7.28.6",
     "@babel/runtime": "^7.28.6",
     "@babel/traverse": "^7.28.6",
+    "@mui/material-v5": "npm:@mui/material@5.18.0",
     "jscodeshift": "^17.1.2",
     "jscodeshift-add-imports": "^1.0.11",
     "postcss": "^8.5.6",

package/v5.0.0/path-imports.js

@@ -6,11 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = transformer;
 var _jscodeshiftAddImports = _interopRequireDefault(require("jscodeshift-add-imports"));
-// istanbul ignore next
-if (globalThis.MUI_TEST_ENV) {
-  const resolve = require.resolve;
-  require.resolve = source => resolve(source.replace(/^@mui\/material\/modern/, '../../../mui-material/src'));
-}
 const barrelImportsToTransform = {
   material: {},
   'icons-material': {}

package/v5.0.0/top-level-imports.js

@@ -12,11 +12,7 @@ function transformer(fileInfo, api, options) {
   const j = api.jscodeshift;
   const importModule = options.importModule || '@mui/material';
   const targetModule = options.targetModule || '@mui/material';
-  let resolveModule = importModule;
-  if (globalThis.MUI_TEST_ENV) {
-    resolveModule = resolveModule.replace(/^@mui\/material/, '@mui/material-v5');
-  }
-  const whitelist = (0, _getJSExports.default)(require.resolve(`${resolveModule}/modern`, {
+  const whitelist = (0, _getJSExports.default)(require.resolve(`@mui/material-v5/modern`, {
     paths: [(0, _path.dirname)(fileInfo.path)]
   }));
   const printOptions = options.printOptions || {