Ficha
- Categoría
- Data display
- Nivel
- átomo
- Estado
- en revisión
- Radix
- no
- Actualizado
- 2026-10-26
- Figma
- 494:16504
- Fuente
design-system/componentes/TypingIndicator.md
Cuándo usarlo
- En el hilo de la simulación, junto a la cara del cliente, mientras el modelo responde.
Cuándo NO usarlo
- Carga de página o de contenido → skeletons; respuestas del coach.
Anatomía
<div role="status">, padding vertical 12: tres puntos de 8 (gap 4) + etiqueta (caption/md, visible solo con Show label).
Props
| Prop | Figma | Valores | Por defecto |
|---|---|---|---|
label | Label | «<Nombre> está respondiendo…» | El cliente está respondiendo… |
showLabel | Show label | boolean | false |
Estados
Animado (pulso en secuencia: opacidad 40→100 %, ciclo 1.2 s, desfase 0.2 s) · estático con prefers-reduced-motion (puntos al 100/70/40 %, como en Figma).
Accesibilidad
- role=status con aria-live=polite anuncia la etiqueta aunque no se muestre; los puntos son decorativos.
- Movimiento respetuoso: sin animación con prefers-reduced-motion.
Contenido
Etiqueta: «<Nombre> está respondiendo…».
Errores conocidos
- Ninguno medido (test
@R-01.8: el campo sigue activo mientras se muestra). La animación es no automatizable: revisada a mano.
Changelog
- 2026-10-26 · nace (T-02).