Sistema de diseño
Switch
Un componente switch, también conocido como interruptor o conmutador, es un elemento de interfaz que permite a los usuarios alternar entre dos estados con un simple clic o toque.
Figma
Storybook
AEM
Overview
Es comúnmente utilizado en aplicaciones y sitios web para activar o desactivar funciones, opciones o configuraciones específicas.
Nombre
Descripción / Uso
Ejemplo
No items found.
Variantes
Tiene variantes por estado de interacción.
Variantes según estado
Nombre
Descripción / Uso
Ejemplo
Default
Estado por defecto del elemento
Disabled
Estado desactivado
Active
Estado encendido del elemento
Active disabled
Un switch encendido que no se puede apagar
Nombre
Descripción / Uso
Ejemplo
No items found.
Opciones
Cada una de las variantes del componente tiene las siguientes opciones de configuración:
Label
Por defecto está activo y es buena práctica que esté visible. Sin embargo, hay casos en los que puede no aparecer.
Label and icon
El icono requiere que el label esté activado para mostrarse. Se utiliza comúnmente el ícono de información.
Nombre
Descripción / Uso
Ejemplo
No items found.
Nombre
Descripción / Uso
Ejemplo
No items found.
Behaviour
Overflow / Resizing
No se recomienda utilizar un label con más de una línea de texto. Si el label se extiende, crecerá verticalmente mientras el switch permanece alineado con la primera línea del texto.
Recursos adicionales
Encuentra más información y documentación específica para cada plataforma
Anterior
Overview componentes
Siguiente
Overview componentes