Customize Apple Pay

Customise the Apple Pay button appearance including style, type, and locale.

Button Options

Option	Type	Description
`paymentRequest`	`object`	Apple Pay payment request overrides. Pass `recurringPaymentRequest` here to save the card together with `save_payment_method: true`, see Saving an Apple Pay card
`buttonType`	`ApplePayButtonType`	Button label variant (see below)
`buttonStyle`	`'black' \| 'white' \| 'white-outline'`	Button colour
`buttonLocale`	`string`	Override the button locale (defaults to SDK locale)
`disabled`	`boolean`	Disable the button

Button Types

Available buttonType values:

Value	Label
`plain`	Apple Pay (no prefix)
`buy`	Buy with Apple Pay
`donate`	Donate with Apple Pay
`checkout`	Check out with Apple Pay
`book`	Book with Apple Pay
`subscribe`	Subscribe with Apple Pay
`pay`	Pay with Apple Pay
`order`	Order with Apple Pay
`reload`	Reload with Apple Pay
`add-money`	Add Money with Apple Pay
`top-up`	Top Up with Apple Pay
`rent`	Rent with Apple Pay
`support`	Support with Apple Pay
`contribute`	Contribute with Apple Pay
`tip`	Tip with Apple Pay

Callbacks

Callback	Description
`onReady`	Fired when the element is mounted and ready
`onChange`	Fired when availability changes (`{ available: boolean }`)
`onClick`	Fired when the button is clicked
`onSuccess`	Fired on successful payment - receives `PaymentSubmitResponse`
`onCancel`	Fired when the user cancels the Apple Pay sheet
`onError`	Fired when an error occurs
`onSessionStarted`	Fired when the Apple Pay session starts
`onSessionEnded`	Fired when the Apple Pay session ends

PaymentSubmitResponse

Passed to the onSuccess callback on successful payment:

interface PaymentSubmitResponse {
  paymentMethod: string;
  transactionId: string;
  status: 'SUCCESS';
}

PaymentSubmitError

Passed to the onError callback when a payment fails:

interface PaymentSubmitError {
  code: string;
  message: string;
  transactionId?: string;
  redirectHtml?: string; // 3DS redirect HTML (if applicable)
}

Methods

// Check if Apple Pay is available
const available = await applePay.canMakePayments();

// Initiate Apple Pay payment
const result = await applePay.createPaymentMethod();