[Autocomplete][material-ui] Passing a click handler to the popup indicator

[KarenBoyakhchyan]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example:

<Autocomplete
popupIcon={
<IconButton onClick={handlePupupClick} disableRipple disableFocusRipple disableTouchRipple sx={{ py: 0 }}>
<KeyboardArrowDownIcon sx={{ color: theme.palette.primary.main }} />

}
/>

Current behavior 😯

<Autocomplete
popupIcon={
<IconButton onClick={handlePupupClick} disableRipple disableFocusRipple disableTouchRipple sx={{ py: 0 }}>
<KeyboardArrowDownIcon sx={{ color: theme.palette.primary.main }} />

}
/>

• If I write like this, can see the following error in the console - Failed prop type: MUI: You are providing an onClick event
  listener to a child of a button element. Prefer applying it to the IconButton directly. This guarantees that the whole will be responsive to click events.

• If I don't put IconButton and pass onClick directly to KeyboardArrowDownIcon, I can see following error - Warning: validateDOMNesting(...): cannot appear as a descendant of .

Expected behavior 🤔

Expected:

Wrap popup icon in div.

Context 🔦

No response

Your environment 🌎

Google Chrome

[mj12albert]

@KarenBoyakhchyan You can pass a click handler to the popup indicator using slotProps.popupIndicator like this:

<Autocomplete
  disablePortal
  id="combo-box-demo"
  options={top100Films}
  renderInput={(params) => <TextField {...params} label="Movie" />}
  slotProps={{
    popupIndicator: {
      onClick: handleClick,
    }
  }}
/>

[github-actions]

👋 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 Stack Overflow, 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.