# Google Pay

> Accept Google Pay payments on Android using the Bolt React Native SDK for Embeddable Checkout.

Source: https://help.boltapp.com/developers/sdks/react-native/google-pay

## Overview [#overview]

This guide covers Google Pay integration for [Bolt Embeddable Checkout](/products/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 [#usage]

```typescript title="TypeScript"
import { GoogleWallet } from '@boltpay/react-native/payments';

function CheckoutScreen() {
  return (
    <GoogleWallet
      config={{
        currencyCode: 'USD',
        amount: '9.99',
        label: 'Your Store',
        billingAddressCollectionFormat: 'full',
      }}
      buttonType="buy"
      borderRadius={8}
      onComplete={(result) => {
        // result: { token, bin?, last4?, expiration?, email?, billingAddress? }
      }}
      onError={(error) => console.error(error)}
    />
  );
}
```

## Props Reference [#props-reference]

| Prop           | Type                        | Default   | Description                                                                                                       |
| -------------- | --------------------------- | --------- | ----------------------------------------------------------------------------------------------------------------- |
| `config`       | `GooglePayConfig`           | required  | Presentation options: currency, amount, label, billing address format. Merchant config is auto-fetched from Bolt. |
| `onComplete`   | `(GooglePayResult) => void` | required  | Called with token, bin, expiration, and billing address on success.                                               |
| `onError`      | `(Error) => void`           | :         | Called on payment failure or cancellation.                                                                        |
| `buttonType`   | `GooglePayButtonType`       | `'plain'` | Maps to Google Pay `ButtonConstants.ButtonType`. Button text is rendered natively and auto-localized.             |
| `buttonTheme`  | `GooglePayButtonTheme`      | `'dark'`  | Button color theme: `'dark'` or `'light'`. Maps to `ButtonConstants.ButtonTheme`.                                 |
| `borderRadius` | `number`                    | :         | Corner radius in dp applied to the Google Pay button.                                                             |
| `style`        | `ViewStyle`                 | :         | Container style overrides (height, margin, etc.).                                                                 |

### GooglePayConfig [#googlepayconfig]

| Property                         | Type     | Description                                               |
| -------------------------------- | -------- | --------------------------------------------------------- |
| `currencyCode`                   | `string` | ISO 4217 currency code (e.g. `'USD'`).                    |
| `amount`                         | `string` | Total payment amount as a string (e.g. `'9.99'`).         |
| `label`                          | `string` | Display label for the transaction (e.g. your store name). |
| `billingAddressCollectionFormat` | `string` | Billing address collection level (e.g. `'full'`).         |

<Note>
  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.
</Note>

### GooglePayButtonType Values [#googlepaybuttontype-values]

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

### GooglePayButtonTheme Values [#googlepaybuttontheme-values]

`'dark'`, `'light'`

### GooglePayResult [#googlepayresult]

```typescript title="TypeScript"
{
  token: string;
  bin?: string;
  expiration?: string;
  email?: string;
  billingAddress?: object;
  boltReference?: string;
}
```