Overview

This guide covers Google Pay integration for Bolt Embeddable Checkout. The Bolt React Native SDK provides a GoogleWallet component that renders a native Google Pay PayButton on Android. On iOS, the component renders nothing. Merchant and gateway configuration (tokenization spec, merchant IDs) is automatically fetched from Bolt’s API using your publishable key: you only need to provide presentation options like currency and amount.

Usage

import { GoogleWallet } from '@boltpay/react-native/payments';

function CheckoutScreen() {
  return (
    <GoogleWallet
      config=
      buttonType="buy"
      borderRadius={8}
      onComplete={(result) => {
        // result: { token, bin?, expiration?, email?, billingAddress?, boltReference? }
      }}
      onError={(error) => console.error(error)}
    />
  );
}

Props Reference

PropTypeDefaultDescription
configGooglePayConfigrequiredPresentation options: currency, amount, label, billing address format. Merchant config is auto-fetched from Bolt.
onComplete(GooglePayResult) => voidrequiredCalled with token, bin, expiration, and billing address on success.
onError(Error) => void:Called on payment failure or cancellation.
buttonTypeGooglePayButtonType'plain'Maps to Google Pay ButtonConstants.ButtonType. Button text is rendered natively and auto-localized.
buttonThemeGooglePayButtonTheme'dark'Button color theme: 'dark' or 'light'. Maps to ButtonConstants.ButtonTheme.
borderRadiusnumber:Corner radius in dp applied to the Google Pay button.
styleViewStyle:Container style overrides (height, margin, etc.).

GooglePayConfig

PropertyTypeDescription
currencyCodestringISO 4217 currency code (e.g. 'USD').
amountstringTotal payment amount as a string (e.g. '9.99').
labelstringDisplay label for the transaction (e.g. your store name).
billingAddressCollectionFormatstringBilling address collection level (e.g. 'full').
You do not need to configure merchant IDs, gateway parameters, or tokenization specs. All of this is automatically fetched from Bolt’s API using the publishable key you provided when initializing the Bolt client.

GooglePayButtonType Values

'plain', 'buy', 'pay', 'checkout', 'subscribe', 'donate', 'order', 'book'

GooglePayButtonTheme Values

'dark', 'light'

GooglePayResult

{
  token: string;
  bin?: string;
  expiration?: string;
  email?: string;
  billingAddress?: object;
  boltReference?: string;
}