Modal ✨

1. Import the component:

import ModalBasic from '@/components/ModalBasic';
import ModalConfirmation, { ConfirmStyle } from '@/components/ModalConfirmation';

2. Basic usage:

const [modalOpen, setModalOpen] = useState(false);

<Button onClick={() => setModalOpen(true)}>
  Open Modal
</Button>

<ModalBasic
  modalOpen={modalOpen}
  setModalOpen={setModalOpen}
  title="My Modal"
>
  <div className="p-5">
    <p>Modal content goes here...</p>
  </div>
</ModalBasic>

3. Confirmation modal:

<ModalConfirmation
  modalOpen={confirmOpen}
  setModalOpen={setConfirmOpen}
  style={ConfirmStyle.danger}
  title="Delete Item?"
  description="This action cannot be undone."
  onConfirm={async () => {
    await deleteItem();
  }}
/>