35 lines
1.4 KiB
TypeScript
35 lines
1.4 KiB
TypeScript
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DialogClose, DialogOverlay } from '@common/components/ui'
|
|
import React from 'react'
|
|
|
|
interface ModalProps {
|
|
isModalOpen: boolean;
|
|
setIsModalOpen: (open: boolean) => void;
|
|
title?: string;
|
|
children: React.ReactNode;
|
|
closeModal: () => void;
|
|
saveModal?: () => void
|
|
}
|
|
|
|
const Modal: React.FC<ModalProps> = ({ isModalOpen, setIsModalOpen, title, children, closeModal,saveModal }) => {
|
|
return (
|
|
<Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
|
|
<DialogOverlay className='z-[200]' />
|
|
<DialogContent className="w-auto max-w-[1200px] min-w-[400px] min-h-[150px] h-auto max-h-[450px] overflow-auto z-[1000]">
|
|
{title ? <DialogHeader>
|
|
<DialogTitle>{title}</DialogTitle>
|
|
</DialogHeader> : null}
|
|
{children}
|
|
<DialogFooter>
|
|
<DialogClose>
|
|
<div className='flex justify-end gap-2'>
|
|
{saveModal ? <button className="px-4 py-2 bg-primary text-white rounded" onClick={saveModal}>저장</button> : null}
|
|
<button className="px-4 py-2 bg-gray-600 text-white rounded" onClick={closeModal}>닫기</button>
|
|
</div>
|
|
</DialogClose>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|
|
|
|
export default Modal |