VButton

Props

Name	Type	Description
active	boolean	Displays the button in active state.
appearance	Enum: filled outlined ghost ghost-light outlined-light	The appearance the button should have.
autofocus	boolean	Determines if the element should receive document focus on page load.
connotation	Enum: accent announcement cta success alert	The connotation the button should have.
disabled	boolean	Sets the element's disabled state. A disabled element will not be included during form submission.
download	string	Prompts the user to save the linked URL. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
dropdown-indicator	boolean	Display a chevron to indicate that the button opens a dropdown.
form	string	The id of a form to associate the element to.
formaction	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
formenctype	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
formmethod	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
formnovalidate	boolean	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
formtarget	Enum: _self _blank _parent _top	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
href	string	The URL the hyperlink references. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
hreflang	string	Hints at the language of the referenced resource. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
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 ... 1231 more ...	A decorative icon the custom element should have. See the Vivid Icon Gallery for available icons: https://icons.vivid.vonage.com/
icon-trailing	boolean	Indicates the icon affix alignment.
initial-value	string	The default value of the element. This value sets the value property only when the value property has not been explicitly set.
label	string	Indicates the button's label.
name	string	The name of the element. This element's value will be surfaced during form submission under the provided name.
pending	boolean	Displays the button in pending state.
ping	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
referrerpolicy	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
rel	string	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
required	boolean	Require the field to be completed prior to form submission.
shape	Enum: rounded pill	The shape the button should have.
size	Enum: super-condensed condensed normal expanded	The size the button should have.
stacked	boolean	Indicates the icon is stacked.
target	Enum: _self _blank _parent _top	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
title	string	Specifies extra information about the button. This information is typically used by browsers to display a tooltip.
type	Enum: submit reset button	See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
value	string	The current value of the element.

Events

Name	Event Type	Description
blur	FocusEvent	Fires when the element loses focus.
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.
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.

Slots

Name	Description
icon	The preferred way to add an icon to the component.

Methods

Name	Type	Description
checkValidity	() => boolean	Return the current validity of the element.
clickHandler	(event: Event) => unknown	Handles click events. Prevents interaction when disabled or pending.
reportValidity	() => boolean	Return the current validity of the element. If false, fires an invalid event at the element.
validate	() => void	{@inheritDoc (FormAssociated:interface).validate}