Receiving payment method data

To receive payment method data to display to the user in the payment UI, you can use either ready-to-use components, or SDK methods.

Use components

1. Add the psdk-payment-methods component to the HTML markup of the payment UI to display the list of available payment methods.

<psdk-payment-methods country="US"></psdk-payment-methods>

2. Add the handling of the selectionChange event sent when the user selects a particular payment method.

const paymentMethods = document.querySelector('psdk-payment-methods');
paymentMethods?.addEventListener('selectionChange', (event) => {
  console.log(event.detail);
});

Use SDK methods

const methods = await headlessCheckout.getRegularMethods();