Home > Back-end >  How not to spin mui autocomplete popup icon?
How not to spin mui autocomplete popup icon?

Time:10-11

how not to spin search icon after open autocomplete input?

<Autocomplete
  popupIcon={<Search />}
  onChange={(e, value) => handleFound(value)}
  options={['0', '2', '3', '1']}
  sx={{ width: '100%' }}
  renderInput={(params) =>
    <TextField {...params} placeholder={'type anything...'} />
  }
/>

CodePudding user response:

You need to stop the rotation from the popup indicator styles, like this:

<Autocomplete
  popupIcon={<Search />}
  onChange={(e, value) => handleFound(value)}
  options={["0", "2", "3", "1"]}
  sx={{
    width: "100%",
    "& .MuiAutocomplete-popupIndicator": { transform: "none" },
  }}
  renderInput={(params) => (
    <TextField {...params} placeholder={"type anything..."} />
  )}
/>

Note that this is not the only solution but in my opinion is the fastest...

  • Related