import { Modal as ModalRAC, ModalOverlay } from "react-aria-components"

import Button from "./Button"
import ModalContent from "./ModalContent"

import styles from "./modal.module.css"

export default function Modal({
  children,
  isOpen,
  onOpenChange,
}: React.PropsWithChildren<{
  isOpen?: boolean
  onOpenChange?: (value: boolean) => void
}>) {
  return (
    <ModalOverlay
      className={styles.overlay}
      isDismissable
      isOpen={isOpen}
      onOpenChange={onOpenChange}
    >
      <ModalRAC className={styles.modal}>{children}</ModalRAC>
    </ModalOverlay>
  )
}

Modal.Button = Button
Modal.Content = ModalContent
