Skip to content

StaticDialog

import { StaticDialog } from 'react-dialog-async';

Allows for dialogs intended to be used with useDialog() to instead be rendered statically in the component tree.

This allows you to control the lifecycle of the dialog declaratively via state and callbacks, rather than imperatively via the open() method returned by useDialog().

const [open, setOpen] = React.useState(false);
return (
<StaticDialog
dialog={ConfirmationDialog}
data={{ message: "Are you sure?" }}
isOpen={open}
onClose={() => setOpen(false)}
/>
);
function StaticDialog<D,R>(props: StaticDialogProps<D, R>): JSX.Element
PropTypeDefaultDescription
dialogAsyncDialogComponent<D, R>-The dialog component to render.
isOpenbooleanfalseWhether the dialog is open or closed.
dataDundefinedThe data to pass to the dialog component.
onClose(result?: R) => voidundefinedCallback invoked when the dialog is closed. Receives the result passed to the handleClose() function in the dialog component.

View on GitHub