On this page

VAlert

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`	Allows setting a custom aria-label for the dismiss button.
removable	`boolean`	Adds a close button to the Alert.
placement	Enum: `top` `top-start` `top-end` `bottom` `bottom-start` `bottom-end`	The placement of the Alert on the screen.
headline	`string`	Adds a headline to the Alert.
text	`string`	The main text of the Alert.
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 ...	The icon to display in the Alert. Takes precedence over the connotation's icon. See the Vivid Icon Gallery for available icons: https://icons.vivid.vonage.com/
timeoutms	`number`	Timeout after which the Alert will close.
connotation	Enum: `accent` `information` `success` `warning` `announcement` `alert`	Sets an appropriate icon / icon color for the connotation.
strategy	Enum: `fixed` `static`	Controls the `position` of the Alert.
open	`boolean`	Open state of the Alert.

Events

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>`	Fired when the Alert is opened
close	`CustomEvent<undefined>`	Fired when the Alert is closed

Slots

Name	Description
main	The main content of the Alert.
action-items	Add action items to the Alert using this slot.
icon	Add an icon to the component.

Methods

Name	Type	Description
openChanged	`(oldValue: boolean,newValue: boolean) => void`