mui / material-ui

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

Autcomplete (github picker version) missing clear icon #32902

Closed Bidrman closed 2 years ago

Bidrman commented 2 years ago

Duplicates

Latest version

Current behavior 😯

Autocomplete component has props named clearIcon that should clear input value when its being clicked. (the closeIcon on the right side).

However Githbu Picker version of autocmplete kinda ignores that prop and I wonder why, is it because it uses inputBace component for the styledInput or is there anythign else?

here is codesandbox demo: https://codesandbox.io/s/githubpicker-missing-clearicon-w4iilr?file=/demo.tsx

Expected behavior 🤔

after adding clearIcon prop, the icon should be visible, because only through that way we are able to clear the input value without any further complications.

Steps to reproduce 🕹

Steps:

Context 🔦

I tried fe workarounds and placed the clearIcon via styledInput inputProps, but its doesnt react when I clear the value, the input somehow freezes and does not accept the incoming value "", it still shows the searched word....

Your environment 🌎

`npx @mui/envinfo` ``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```
ZeeshanTamboli commented 2 years ago

Since it uses InputBase component for the filter labels input, you can pass the endAdornment prop to InputBase. See the following: https://codesandbox.io/s/githubpicker-missing-clearicon-forked-5zg4rw?file=/demo.tsx:8445-8490

InputBase API docs: https://mui.com/material-ui/api/input-base/#main-content

However, you will have to style the icon/input properly to display it within the input.

github-actions[bot] commented 2 years ago

👋 Thanks for using MUI Core!

We use GitHub issues exclusively as a bug and feature requests tracker, however, this issue appears to be a support request.

For support, please check out https://mui.com/getting-started/support/. Thanks!

If you have a question on StackOverflow, you are welcome to link to it here, it might help others. If your issue is subsequently confirmed as a bug, and the report follows the issue template, it can be reopened.