Dialog

A flexible Dialog component.

import { Button } from "swash/Button";
import { Dialog, DialogDisclosure, useDialogStore } from "swash/Dialog";
() => {
  const dialog = useDialogStore();

  return (
    <>
      <DialogDisclosure store={dialog} render={<Button />}>
        Ouvrir la boîte de dialogue
      </DialogDisclosure>
      <Dialog store={dialog} className="p-4">
        <h2>Titre de la boîte de dialogue</h2>
        <p>Contenu de la boîte de dialogue</p>
        <Button onClick={() => dialog.hide()}>Fermer</Button>
      </Dialog>
    </>
  );
}