pernocta

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.
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#

PropTipoPor defectoDescripción
toast({ title, description?, tone?, action? })neutral | success | dangerneutralMáximo 3 en pantalla, 4,5 s
Alert.toneinfo | success | warning | danger | neutralinforole=alert solo en danger
Progress.value0–100—Barra fina de 4 px
EmptyState.icon/title/description/action——Ilustración duotone en círculo coral suave