VDialog

Props

Name	Type	Description
aria-current	Enum: `page` `step` `location` `date` `time` `true` `false`	Indicates the element that represents the current item within a container or set of related elements.
open	`boolean`	Indicates dialog's state
icon	Enum: `10-sec-backward-line` `10-sec-backward-solid` `10-sec-forward-line` `10-sec-forward-solid` `30-sec-backward-line` `30-sec-backward-solid` `30-sec-forward-line` `30-sec-forward-solid` `5-sec-backward-line` `5-sec-backward-solid` `5-sec-forward-line` `5-sec-forward-solid` ... 1217 more ...	undefined See the Vivid Icon Gallery for available icons: https://icons.vivid.vonage.com/
icon-placement	Enum: `top` `side`
subtitle	`string`
headline	`string`
full-width-body	`boolean`
aria-label	`string`
dismiss-button-aria-label	`string`
no-light-dismiss	`boolean`	Prevents the dialog from being dismissed when clicking outside it.
no-dismiss-on-esc	`boolean`	Prevents the dialog from being dismissed when the escape key is pressed.
no-dismiss-button	`boolean`	Hides the dismiss button.
non-dismissible	`boolean`	Disables all means of dismissal for the dialog.
modal	`boolean`	Controls whether the dialog is modal.

Name	Event Type	Description
click	`MouseEvent`	Fires when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
focus	`FocusEvent`	Fires when the element receives focus.
blur	`FocusEvent`	Fires when the element loses focus.
keydown	`KeyboardEvent`	Fires when a key is pressed.
keyup	`KeyboardEvent`	Fires when a key is released.
input	`Event`	Fires when the value of an element has been changed.
open	`CustomEvent<undefined>`	The `open` event fires when the dialog opens.
close	`CustomEvent<string>`	The `close` event fires when the dialog closes (either via user interaction or via the API). It returns the return value inside the event's details property.
cancel	`CustomEvent<undefined>`	The `cancel` event fires when the user requests to close the dialog. You can prevent the dialog from closing by calling `.preventDefault()` on the event.

Name	Description
graphic	Use the graphic slot in order to replace the icon.
body	Use the body slot in order to add custom HTML to the dialog.
footer	Use the footer slot in order to add action buttons to the bottom of the dialog.
main	Assign nodes to the main slot to fully override a dialog’s predefined flow and style with your own.
action-items	Use the action-items slot in order to add action buttons to the bottom of the dialog.