Material-ui: [Autocomplete] Ability to change the IconButton SVG Icon

[AbdallahElroby]

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Summary 💡

I'd like to change the IconButton SVG Icon instead of the original <ArrowDropDownIcon /> with having all of its handlers and classes being able to change.

Examples 🌈

This is how it would be. This is my SVG Icon <KeyboardArrowDownIcon/>

This is the original one used.

Motivation 🔦

An app that I'm working on requires an autocomplete field but it's required from me to change the Icon to fit all the app Icons

[oliviertassinari]

@AbdallahElroby Have you thought of the API you would like to use for this customization? Maybe a PopupIconButtonComponent prop?

[mbrookes]

PopupIconComponent ?

[AbdallahElroby]

@oliviertassinari I think it might be like you suggested but the catch is that we've two IconButtons actually, one for the CloseIcon and one for the <ArrowDropDownIcon /> and right now I can replace them using this:
InputProps={{
...params.InputProps,
endAdornment: (

{(this.state.loading && x.id === this.state.id) ? : null}
{openIcon}

),
}}

Now let's say the proper API for these two Icons will be:

1. CloseIcon: CloseIconComponent .
2. ArrowDropDownIcon : PopupIconComponent as suggested by @mbrookes

[oliviertassinari]

@AbdallahElroby This sounds good to me

[AbdallahElroby]

@oliviertassinari So when will we see a pull request by these APIs

[joshwooding]

@AbdallahElroby This issue is marked "good first issue". This means core team members tend to not work on them and leave them for the community, therefore giving a deadline is quite a difficult task as it relies on a member of the community or a new contributor picking up the issue. If you would like to see it added quicker I would recommend reading CONTRIBUTING.md and giving it a go yourself, we are happy to help you if you get stuck :)

[AbdallahElroby]

@oliviertassinari I've made a PR with this issue
I'm kinda urgently need it to the project I'm working on