Skip to content

[Autocomplete] Prevent shrink animation in controlled Autocomplete when initial value is provided #45734

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

imadx
Copy link
Contributor

@imadx imadx commented Mar 29, 2025

To address #45724, we can set initialInputValue on useAutocomplete to avoid shrinking its label when an initial value is already set.

Fixes #45724

Before: https://stackblitz.com/edit/stackblitz-starters-bukupsze
After: https://codesandbox.io/p/sandbox/material-ui-cra-ts-forked-ct2y7y

@ZeeshanTamboli ZeeshanTamboli added bug 🐛 Something doesn't work component: autocomplete This is the name of the generic UI component, not the React module! labels Mar 29, 2025
@mui-bot
Copy link

mui-bot commented Mar 29, 2025

Netlify deploy preview

https://deploy-preview-45734--material-ui.netlify.app/

Bundle size report

Details of bundle changes (Toolpad)
Details of bundle changes

Generated by 🚫 dangerJS against 9e84295

@ZeeshanTamboli ZeeshanTamboli changed the title [material-ui][Autocomplete] Update initial input value in useAutocomplete to consume initial valueProp [material-ui][Autocomplete] Fix label flickering when providing initial controlled value Mar 29, 2025
@ZeeshanTamboli ZeeshanTamboli changed the title [material-ui][Autocomplete] Fix label flickering when providing initial controlled value [material-ui][Autocomplete] Prevent shrink animation when providing initial controlled value Mar 29, 2025
@ZeeshanTamboli ZeeshanTamboli changed the title [material-ui][Autocomplete] Prevent shrink animation when providing initial controlled value [material-ui][Autocomplete] Prevent shrink animation in controlled Autocomplete when initial value is provided Mar 29, 2025
@imadx
Copy link
Contributor Author

imadx commented Mar 29, 2025

Thanks for the help @ZeeshanTamboli with the updates.. Super neat! Do let me know if I can be of any help with the changes!

@ZeeshanTamboli ZeeshanTamboli added v6.x needs cherry-pick The PR should be cherry-picked to master after merge labels Mar 29, 2025
Copy link
Member

@ZeeshanTamboli ZeeshanTamboli left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work on this, @imadx! Thanks for your contribution. Just made some updates.

@ZeeshanTamboli ZeeshanTamboli merged commit c70698f into mui:master Mar 29, 2025
21 checks passed
Copy link

Cherry-pick PRs will be created targeting branches: v6.x

github-actions bot pushed a commit that referenced this pull request Mar 29, 2025
…tocomplete when initial `value` is provided (#45734)

Co-authored-by: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
@oliviertassinari oliviertassinari changed the title [material-ui][Autocomplete] Prevent shrink animation in controlled Autocomplete when initial value is provided [Autocomplete] Prevent shrink animation in controlled Autocomplete when initial value is provided Mar 29, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: autocomplete This is the name of the generic UI component, not the React module! needs cherry-pick The PR should be cherry-picked to master after merge v6.x
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Autocomplete] Label flickering when using controlled value
3 participants