# Switch Alterna entre dos opciones mutuamente excluyentes con efecto inmediato. Úsalo cuando el cambio se aplica al instante, sin necesidad de un botón de guardar. ```tsx import { Switch } from "@fluentui/react-components"; setValue(data.checked)} /> ``` ## Default ### Cuándo usar - Configuraciones binarias con efecto inmediato: activar notificaciones, modo oscuro, sincronización. - Cuando ambos estados son entendibles por sí solos sin una etiqueta extra de Sí o No. ### Cuándo no usarlo - Si el cambio requiere confirmación o se aplica solo al guardar: usa Checkbox. - Si hay tres o más opciones: usa Radio o Dropdown. ## Con label ### Etiqueta integrada Prefiere usar la prop `label` para que la etiqueta quede asociada y sea clickeable. ```tsx setValue(data.checked)} /> ``` ## Estados ### Activado, apagado y deshabilitado ```tsx ``` ## Accesibilidad ### Teclado y roles - El Switch expone role="switch" con aria-checked. - Espacio activa o desactiva el control; el foco debe ser claramente visible. - Siempre acompaña con un label visible que describa qué se activa.