31 lines
678 B
TypeScript
31 lines
678 B
TypeScript
|
import type { ReactNode } from 'react'
|
||
|
|
|
||
|
|
interface ModalProperties {
|
||
|
|
isOpen: boolean
|
||
|
|
onClose: () => void
|
||
|
|
children: ReactNode
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function PopupModal({
|
||
|
|
isOpen,
|
||
|
|
onClose,
|
||
|
|
children,
|
||
|
|
}: ModalProperties) {
|
||
|
|
if (!isOpen) return
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<div className="bg-opacity-50 fixed inset-0 z-50 grid place-items-center bg-gray-300/50">
|
||
|
|
<button
|
||
|
|
onClick={onClose}
|
||
|
|
className="absolute top-5 right-5 z-50 bg-red-500 p-3 text-gray-500 hover:text-gray-800"
|
||
|
|
>
|
||
|
|
✖
|
||
|
|
</button>
|
||
|
|
<div className="relative rounded-lg bg-white p-6 shadow-lg">
|
||
|
|
{children}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|