Vue Modal Component API

Apply a backdrop on body while modal is open. 'static' keeps the modal open on a backdrop click and bounces it instead.

Flip the modal to the dark color mode, whatever the page around it uses.

Set modal to covers the entire user viewport.

Closes the modal when escape key is pressed.

Open the dialog modally, taking over the page. Set it to false for a dialog that leaves the rest of the page interactive.

Create a scrollable modal that allows scrolling the modal body.

Control the open state. When set, the modal renders what show says and dismiss gestures only emit update:show — nothing closes until the parent flips the prop.

Size the component small, large, or extra large.

Remove animation to create modal that simply appear rather than fade in to view.

By default the component is unmounted after close animation, if you want to keep the component mounted set this property to false.

Toggle the visibility of modal component.

Use show / v-model:show instead — visible is ignored when show is set.

Callback fired once the component has closed.

Callback fired when the modal is shown, its backdrop is static and a click outside the modal or an escape key press is performed with the keyboard option set to false.

Callback fired when the component requests to be shown.

Callback fired when the modal requests an open-state change — a dismiss gesture (Escape, backdrop click) or any internal toggle. In controlled mode update show yourself, or the modal stays as it is.

Sets the aria-label of the close button.

Add a close button component to the header.

Component used for the root node. Either a string to use a HTML element or a component.