52 lines
1.6 KiB
JavaScript
52 lines
1.6 KiB
JavaScript
'use client';
|
|
|
|
import { Drawer, Modal } from "@mui/material";
|
|
import { styleDefault } from "@/mui";
|
|
import Content from "./Content";
|
|
|
|
function ModalOpenLocation({ open, setOpen, handleClose, children }) {
|
|
|
|
const toggleDrawer = (newOpen) => () => {
|
|
setOpen(newOpen);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
{/* Button Modal */}
|
|
{children}
|
|
{/* Content Modal */}
|
|
<Modal
|
|
open={open}
|
|
onClose={handleClose}
|
|
className="!hidden md:!flex"
|
|
>
|
|
<div
|
|
style={styleDefault}
|
|
className="!pt-[12px] !pb-[28px] !px-[24px] !bg-[#FAFAFA] !rounded-[8px] !overflow-hidden"
|
|
>
|
|
<Content onClose={handleClose} />
|
|
</div>
|
|
</Modal>
|
|
<Drawer
|
|
open={open}
|
|
anchor="bottom"
|
|
onClose={toggleDrawer(false)}
|
|
className="!flex md:!hidden"
|
|
sx={{
|
|
'& .MuiPaper-root': {
|
|
borderRadius: '25px 25px 0px 0px !important',
|
|
overflow: 'hidden'
|
|
}
|
|
}}
|
|
>
|
|
<div
|
|
className="!pt-[12px] !pb-[28px] !px-[24px] !bg-[#FAFAFA] !rounded-[8px] !overflow-hidden !shadow-[0px_1px_24.8px_0px_rgba(155,_155,_155,_0.27)]"
|
|
>
|
|
<Content handleClose={handleClose} />
|
|
</div>
|
|
</Drawer>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default ModalOpenLocation |