React Material UI component selection problem

Question

If you go to "Select Component" in MUI https://mui.com/material-ui/react-select/

and open the drop-down menu for any selection. You'll notice that you won't be able to interact with the page until you close the dropdown.

Is there any solution to this problem? Can't even scroll after opening dropdown

P.S. I don't want to use NativeSelect.

Answer 1

You may have an event listener for scrolling (see documentation): https://developer.mozilla.org/en-US/docs/Web/API/Document/scroll_event

Then, when this happens, programmatically close the selection using the "open" tag on the selection component.