Perzonaliza botones

Personaliza el botón Pagar

El SDK de DEUNA permite ocultar el botón nativo "Pagar" del widget y reemplazarlo por un botón customizado en la UI nuestros comercios. Esto es funcional para:

Checkouts con diseño propio que busquen mantener coherencia visual con tu marca.
Validaciones avanzadas que asseguren condiciones previas antes de permitir el pago.

Widget inicializado usando en parámetro **hidePayButton**

Ocultar el botón nativo

Oculta el botón:

Inicializa el widget.
Activa el parámetro behavior > hidePayButton:
- Si hidePayButton es false o undefined, el widget muestra el botón estándar.
- Si hidePayButtin es true, el widget oculta el botón estándar.

await DeunaSDK.initPaymentWidget({
  orderToken: "<DEUNA order token>",
  ...
  behavior:{
		hidePayButton: true
  }
});

📘
Esta configuración no puede cambiarse dinámicamente después de inicializar el widget.

Valida datos y ejecuta el pago

En botones personalizados, emplea los siguientes métodos para validar y ejecutar el pago conDeunaSDK.initPaymentWidget(...):

Método	Descripción	Respuesta
`DeunaSDK.isValid()`	Verifica si los campos del widget (tarjeta, CVV, etc.) están completos y son válidos para que el pago pueda ser procesado.	Retorna `Promise<true>` solo si todos los campos son válidos, `Promise<false>` en caso contrario.
`DeunaSDK.submit()`	Ejecuta el proceso de pago, equivalente a presionar el botón de "Pagar" (botón nativo). Realiza las mismas validaciones internas.	`Promise<{status: "success", message: "Pago procesado exitosamente" }>` o `Promise<{status: "error", message: "The submit flow is not available" }>`

Método

Descripción

Respuesta

DeunaSDK.isValid()

Verifica si los campos del widget (tarjeta, CVV, etc.) están completos y son válidos para que el pago pueda ser procesado.

Retorna Promise<true> solo si todos los campos son válidos, Promise<false> en caso contrario.

DeunaSDK.submit()

Ejecuta el proceso de pago, equivalente a presionar el botón de "Pagar" (botón nativo). Realiza las mismas validaciones internas.

Promise<{status: "success", message: "Pago procesado exitosamente" }>
o

Promise<{status: "error", message: "The submit flow is not available" }>

...