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.
dismiss-button-aria-label	`string`
full-width-body	`boolean`
headline	`string`
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` ... 1227 more ...	undefined See the Vivid Icon Gallery for available icons: https://icons.vivid.vonage.com/
icon-placement	Enum: `top` `side`
modal	`boolean`	Controls whether the dialog is modal.
no-dismiss-button	`boolean`	Hides the dismiss button.
no-dismiss-on-esc	`boolean`	Prevents the dialog from being dismissed when the escape key is pressed.
no-light-dismiss	`boolean`	Prevents the dialog from being dismissed when clicking outside it.
non-dismissible	`boolean`	Disables all means of dismissal for the dialog.
open	`boolean`	Indicates dialog's state
subtitle	`string`

Name	Event Type	Description
blur	`FocusEvent`	Fires when the element loses focus.
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.
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.
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.
focus	`FocusEvent`	Fires when the element receives focus.
input	`Event`	Fires when the value of an element has been changed.
keydown	`KeyboardEvent`	Fires when a key is pressed.
keyup	`KeyboardEvent`	Fires when a key is released.
open	`CustomEvent<undefined>`	The `open` event fires when the dialog opens.

Name	Description
action-items	Use the action-items slot in order to add action buttons to the bottom of the dialog.
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.
graphic	Use the graphic slot in order to replace the icon.
main	Assign nodes to the main slot to fully override a dialog’s predefined flow and style with your own.