Sistema de diseño
Selection chip
Este componente se utiliza para representar las selecciones realizadas dentro de una lista, conjunto de datos o categorías.
Figma
Storybook
AEM
Overview
Estos chips, también conocidos como etiquetas de selección, ofrecen una representación visual clara de las opciones seleccionadas por el usuario. Facilitan la gestión y eliminación de selecciones.
Nombre
Descripción / Uso
Ejemplo
No items found.
Variantes
El selection chip tiene variantes por estado de interacción.
Variantes según estado
Nombre
Descripción / Uso
Ejemplo
Default
Estado por defecto del elemento
Hover
Efecto hover
Selected
Selección hecha
Default highlight
Estado por defecto de un chip destacado
Selected highlight
Chip destacado seleccionado
Disabled
Chip inactivo
Selected disabled
Chip aplicado inactivo
Nombre
Descripción / Uso
Ejemplo
No items found.
Opciones
Dentro de la configuración de este componente encontramos varias opciones:
Shadow
El componente chip puede utilizar sombra para destacar sobre el fondo, si es necesario.
Highlight
Utiliza la opción “Highlight” para destacar un chip sobre el resto del listado.
Icon
Si diseño lo decide, el filter chip puede llevar un icono de apoyo o prescindir de él.
Nombre
Descripción / Uso
Ejemplo
No items found.
Nombre
Descripción / Uso
Ejemplo
No items found.
Behaviour
Recursos adicionales
Encuentra más información y documentación específica para cada plataforma
Anterior
Overview componentes
Siguiente
Overview componentes