latest

frontend/src/components/shared/Modal.tsx

@@ -0,0 +1,23 @@
+import type { ReactNode } from 'react'
+import { Overlay } from './Overlay'
+
+interface ModalProps {
+  open: boolean
+  onClose: () => void
+  title?: string
+  children: ReactNode
+}
+
+export function Modal({ open, onClose, title, children }: ModalProps) {
+  return (
+    <Overlay
+      open={open}
+      onClose={onClose}
+      position="center"
+      className="w-full max-w-md rounded-lg bg-white p-6 shadow-xl dark:bg-gray-900"
+    >
+      {title && <h2 className="mb-4 text-lg font-semibold text-gray-900 dark:text-gray-100">{title}</h2>}
+      {children}
+    </Overlay>
+  )
+}