I’m using Material UI’s SwipeableDrawer component to create a bottom drawer with a fixed action button container. The container is positioned with position: fixed; bottom: 0;. This works well on desktop browsers, but I’m encountering an issue on mobile devices.

I’m using the https://mui.com/material-ui/ library and importing the TextField component.
What I need is to shape it like this one:
enter image description here