mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
94.02k stars 32.3k forks source link

[Autocomplete] Initial render with a value set always causes input label to perform the shrink animation #44506

Open ShotSkydiver opened 11 hours ago

ShotSkydiver commented 11 hours ago

Steps to reproduce

Steps:

  1. Open this link to live example: https://codesandbox.io/p/sandbox/stoic-fire-zz67mz-zz67mz?from-embed=&workspaceId=edc4f89e-5831-4c48-b5ed-57fcd105b256
  2. Click show/hide autocomplete button
  3. Watch the input label do its shrink animation despite there being a value set initially

Current behavior

When providing a value to Autocomplete, on initial render it'll animate the input label shrinking as if a value was entered after the component was rendered, which gets extra visually annoying when having large groups of autocomplete fields that are contained within Steps or show/hide buttons

Expected behavior

The input label is already shrunk at initial render without any animation, like it is for TextField, Select, etc

Context

N/A

Your environment

npx @mui/envinfo ``` System: OS: macOS 15.2 Binaries: Node: 23.2.0 - /opt/homebrew/bin/node npm: 10.9.0 - /opt/homebrew/bin/npm pnpm: Not Found Browsers: Chrome: Not Found Edge: Not Found Safari: 18.2 npmPackages: @emotion/react: 11.13.3 => 11.13.3 @emotion/styled: 11.13.0 => 11.13.0 @mui/base: 5.0.0-beta.61 => 5.0.0-beta.61 @mui/codemod: 6.1.7 => 6.1.7 @mui/core-downloads-tracker: 6.1.4 @mui/icons-material: 6.1.7 => 6.1.7 @mui/lab: 6.0.0-beta.15 => 6.0.0-beta.15 @mui/material: 6.1.7 => 6.1.7 @mui/private-theming: 6.1.7 @mui/styled-engine: 6.1.4 @mui/styles: 6.1.7 => 6.1.7 @mui/system: 6.1.7 => 6.1.7 @mui/types: 7.2.19 @mui/utils: 6.1.4 @mui/x-charts: 7.22.2 => 7.22.2 @mui/x-charts-vendor: 7.20.0 @mui/x-data-grid: 7.22.2 => 7.22.2 @mui/x-date-pickers: 7.22.2 => 7.22.2 @mui/x-internals: 7.21.0 @types/react: 18.3.11 react: 18.3.1 => 18.3.1 react-dom: 18.3.1 => 18.3.1 ```

Search keywords: autocomplete shrink animation initial value