Componentes
Feedback y estados
Cada pantalla tiene cuatro estados: cargando, vacío, error y con datos. Diseñarlos todos es parte del componente.
Toast#
Mensajes efímeros abajo, centrados, sobre la barra de pestañas en móvil. Usa
useToast() dentro de ToastProvider.Alert#
Datos de la comunidad
La información la aportan viajeros; compruébala antes de ir.
Opinión publicada
Gracias por ayudar a otros viajeros.
Altura limitada
Barrera de 2,10 m en la entrada.
No se pudo cargar el mapa
Revisa tu conexión.
Consejo: guarda sitios para verlos sin conexión.
Carga#
Esqueletos con la forma del contenido final; spinner solo para acciones cortas.
Estado vacío#
Aún no tienes favoritos
Pulsa el corazón en cualquier lugar para guardarlo aquí y tenerlo a mano en ruta.
Sin resultados en esta zona
Prueba a alejar el mapa o quitar algún filtro.
API#
| Prop | Tipo | Por defecto | Descripción |
|---|---|---|---|
| toast({ title, description?, tone?, action? }) | neutral | success | danger | neutral | Máximo 3 en pantalla, 4,5 s |
| Alert.tone | info | success | warning | danger | neutral | info | role=alert solo en danger |
| Progress.value | 0–100 | — | Barra fina de 4 px |
| EmptyState.icon/title/description/action | — | — | Ilustración duotone en círculo coral suave |