Ran into an issue using the MUI Modal component with the nested Popper.
So, we have an edit form that is implemented with MUI Modal (once opened, scroll Y is disabled by default), inside we have a MUI popper that is used with a calendar.
looks fine.
But on smaller screens, when the Popper is open, part of the component is cut off and I can't scroll or do anything.
Here's what it looks like.
I found some solution - add disablePortal prop to Popper, in this case it's nesting to the parent and I can scroll inside of the Modal, but it looks kinda bad for me. (we don't have effect of the floating Popper over Modal).
How it looks with disablePortal, we have a scroll now.
So the problem, I need to make somehow the Modal to react on opened Popper inside.
Do I need to use other components/libs for this?