@jacobp100/dialog
v0.17.0
Published
Accessible React Modal Dialog.
Downloads
45
Readme
@reach/dialog
An accessible dialog or modal window.
import { Dialog } from "@reach/dialog";
import "@reach/dialog/styles.css";
function Example(props) {
const [showDialog, setShowDialog] = React.useState(false);
const open = () => setShowDialog(true);
const close = () => setShowDialog(false);
return (
<div>
<button onClick={open}>Open Dialog</button>
<Dialog isOpen={showDialog} onDismiss={close}>
<button className="close-button" onClick={close}>
<VisuallyHidden>Close</VisuallyHidden>
<span aria-hidden>×</span>
</button>
<p>Hello there. I am a dialog</p>
</Dialog>
</div>
);
}