Ficha
- Categoría
- Data display
- Nivel
- organismo
- Estado
- en revisión
- Radix
- no
- Actualizado
- 2026-10-26
- Figma
- 394:12639
- Fuente
design-system/componentes/Carousel.md
Carrusel horizontal de tarjetas con controles Anterior / Siguiente (IconButton elevated, objetivo de 44) flotando en los bordes visibles, centrados en vertical. Slot Items: tarjetas en fila, gap space-4x; preferidas BenefitCard y SuggestionCard. La última visible debería ser Variant=hint cuando siguen más.
Cuándo usarlo
- 4 o más tarjetas pares que el usuario recorre (beneficios en una respuesta del coach, escenarios).
Cuándo NO usarlo
- 3 tarjetas o menos (una fila simple); contenido que el usuario debe comparar lado a lado (una tabla).
Anatomía
<section> con pista de scroll horizontal (snap, gap 16) y dos IconButton elevated absolutos en los bordes; Show previous / Show next se derivan de la posición de scroll.
Props
| Prop | Figma | Valores | Por defecto |
|---|---|---|---|
children | Items | nodos | — |
| (Show previous · Show next) | Show previous · Show next | derivados del scroll, nunca un control que no hace nada | — |
label | — | nombre de la región | — |
Estados
Controles visibles según scroll.
Accesibilidad
- Región con aria-roledescription="carousel" y nombre; botones «Anterior» / «Ver más» con aria-controls; los ítems se alcanzan con Tab sin los botones; sin autoplay.
Contenido
Las tarjetas traen su propio contenido; la última visible en hint cuando siguen más.
Errores conocidos
- Ninguno medido.
Changelog
- 2026-10-26 · nace (T-02).