🧩 Mini-apps de QvaPay ✅: ahora se sienten parte de la app

Llega con QvaPay 3.7.0 y ya puedes probarlo en el simulador.

Barra superior integrada
Tu mini-app ya no necesita pintar su propia cabecera. Usa la de QvaPay: el logo y el nombre de tu ficha (con el check de verificada), un subtítulo que cambias en cada pantalla y hasta 2 botones de acción con icono y contador.

QvaPay.ui.header.set({
subtitle: 'Carrito · 3 productos',
actions: [{ id: 'cart', icon: 'cart', label: 'Carrito', badge: 3 }],
})
QvaPay.on('headerAction', ({ id }) => {
if (id === 'cart') openCart()
})

Botón atrás automático
Si tu página tiene historial, la X se convierte en flecha y retrocede, igual que el atrás de Android. Con React Router, Vue Router o Next.js no tienes que hacer nada. Si mantienes pulsada la flecha, la mini-app se cierra.

Y además
✅ mainButton.set cambia solo lo que mandas: set({ loading: true }) conserva el texto.
✅ Los errores del SDK llegan en el idioma del usuario, listos para mostrar.
✅ 21 iconos para tus acciones: cart, search, filter, bell, wallet, ticket…

Compatibilidad
Tu mini-app sigue funcionando igual sin tocar nada. Para usar lo nuevo sin dejar fuera a quien aún no ha actualizado, comprueba que existe:

if (window.QvaPay?.ui.header) {
// usa la barra de QvaPay y esconde la tuya
}

📚 Docs: https://www.qvapay.com/docs/miniapps/sdk#encabezado
🛠 Simulador: https://www.qvapay.com/dev

#QvaPayDev #MiniApps