Skip to content
On this page

VSwitch

Props

NameTypeDescription
aria-currentEnum:
page
step
location
date
time
true
false
Indicates the element that represents the current item within a container or set of related elements.
disabledbooleanSets the element's disabled state. A disabled element will not be included during form submission.
initial-valuestringThe initial value of the form. This value sets the value property only when the value property has not been explicitly set.
valuestringThe current value of the element. This property serves as a mechanism to set the value property through both property assignment and the .setAttribute() method. This is useful for setting the field's value in UI libraries that bind data through the .setAttribute() API and don't support IDL attribute binding.
namestringThe name of the element. This element's value will be surfaced during form submission under the provided name.
requiredbooleanRequire the field to be completed prior to form submission.
default-checkedbooleanProvides the default checkedness of the input element
checkedbooleanThe current checkedness of the element. This property serves as a mechanism to set the checked property through both property assignment and the .setAttribute() method. This is useful for setting the field's checkedness in UI libraries that bind data through the .setAttribute() API and don't support IDL attribute binding.
labelstringIndicates the switch's label.
connotationEnum:
accent
alert
announcement
success
cta
Indicates the switch's connotation.
readonlybooleanWhen true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly

Events

NameEvent TypeDescription
clickMouseEventFires 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.
focusFocusEventFires when the element receives focus.
blurFocusEventFires when the element loses focus.
keydownKeyboardEventFires when a key is pressed.
keyupKeyboardEventFires when a key is released.
inputEventFires when the value of an element has been changed.
changeCustomEvent<undefined>Emits a custom change event when the checked state changes