Formularios

Switch

Interruptor que activa o desactiva una opción con efecto inmediato, como alternativa visual a la casilla.

Uso

<vadavo-switch> genera su propio input type="checkbox" dentro de su shadow root y participa en FormData como un campo nativo: solo se envía mientras está activado, con el texto del atributo value (por defecto "on").

Estados

Responde a los atributos checked y disabled.


<vadavo-switch></vadavo-switch>
<vadavo-switch checked></vadavo-switch>
<vadavo-switch disabled></vadavo-switch>
<vadavo-switch checked disabled></vadavo-switch>

Con texto asociado

El texto entre las etiquetas de apertura y cierre acompaña al interruptor con una descripción.

Renovación automática activada

<vadavo-switch name="auto-renewal" checked>Renovación automática activada</vadavo-switch>

Tokens semánticos

TokenQué es
--switch--shadow--knobLa sombra del mando del interruptor.