Skip to content

Events

EventsDescription
onOpen / on_open(optional) This event gets triggered once the modal shows up. Returns the modal id: { id }.
onClose / on_close(optional) this event gets triggered once the modal gets closed. Returns the modal id: { id, event, triggeredBy }.
onClosePrevent / on_close_prevent(optional) this event gets triggered once the user tries to close the modal, but prevent_close is set to true. Returns a callback close you can call to trigger the close mechanism. More details below. Returns the modal id: { id, event, close: Method, triggeredBy }

Selective on_close_prevent

<Modal
preventClose={true}
onClosePrevent={({ triggeredBy, close /* id, event */ }) => {
switch (triggeredBy) {
case 'keyboard':
case 'button':
close()
break
case 'overlay': {
const timeout = setTimeout(close, 1e3)
return () => clearTimeout(timeout) // clear timeout on unmount
}
}
}}
>
...
</Modal>