Customize the Pay button

The DEUNA SDK allows you to hide the native "Pay" button from the widget and replace it with a custom button in our merchants' UI. This is functional for:

Checkouts with custom design that seek to maintain visual coherence with your brand.
Advanced validations that ensure prior conditions before allowing payment.

Widget initialized using the **hidePayButton** parameter

Hide the native button

Hide the button:

Initialize the widget.
Activate the behavior > hidePayButton parameter:
- If hidePayButton is false or undefined, the widget shows the standard button.
- If hidePayButtin is true, the widget hides the standard button.

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

📘
This configuration cannot be changed dynamically after initializing the widget.

Validate data and execute payment

In custom buttons, use the following methods to validate and execute payment with DeunaSDK.initPaymentWidget(...):

Method

Description

Response

DeunaSDK.isValid()

Checks whether card information has been entered and if a save attempt can be made.

Returns Promise<true> only if all fields are valid, Promise<false> otherwise.

DeunaSDK.submit()

Executes the payment process, equivalent to pressing the "Pay" button (native button). Performs the same internal validations.

Promise<{status: "success", message: "Payment processed successfully" }>
or

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

...