DEPRECATION
Legacy page. This is an earlier copy of the SDK guide (April 2026) and may contain outdated code. For current setup, see the current guide.
This SDK is for use with Bolt Embeddable Checkout. For the full backend API documentation, see the Embeddable Checkout API Reference.
Root Exports
Import from: @boltpay/react-native
| Export | Description |
|---|---|
Bolt |
Client class. Takes { publishableKey, environment?, language? }. |
BoltProvider |
React context provider. Wrap your app with <BoltProvider client={bolt}>. |
useBolt() |
Hook to access the Bolt client from any component. |
bolt.configureOnPageStyles(styles) |
Set global v3 styles applied to all elements. |
Payment Exports
Import from: @boltpay/react-native/payments
| Export | Description |
|---|---|
CreditCard.Component |
WebView-based credit card input. |
CreditCard.useController(options?) |
Returns a controller with tokenize(), on(), and setStyles(). |
useThreeDSecure() |
Hook returning { Component, fetchReferenceID(), challengeWithConfig() }. |
ApplePay |
Native PKPaymentButton (iOS only; renders nothing on Android). |
GoogleWallet |
Native Google Pay PayButton (Android only; renders nothing on iOS). |
Credit Card Controller
| Method | Description |
|---|---|
tokenize() |
Returns Promise<TokenResult | Error>. Never throws. |
on(event, callback) |
Register event listener. Events: valid, error, blur, focus. |
setStyles(styles) |
Update input field styles. |
3D Secure
| Method | Description |
|---|---|
fetchReferenceID(creditCardInfo) |
Accepts TokenResult or CreditCardId. Returns Promise<string>. Throws ThreeDSError. |
challengeWithConfig(orderToken, config) |
Returns Promise<ThreeDSResult>. Never throws. Check result.success. |
ApplePay Props
| Prop | Type | Default | Description |
|---|---|---|---|
config |
ApplePayConfig |
required | Country/currency, total amount, and optional merchant ID (mode='native' only). |
onComplete |
(ApplePayResult) => void |
required | Called with token, bin, expiration, and billing contact on success. |
onError |
(Error) => void |
: | Called on payment failure. |
mode |
'webview' | 'native' |
'webview' |
'webview' uses the Bolt-hosted iframe. 'native' uses PassKit. |
buttonType |
ApplePayButtonType |
'plain' |
Button label variant. Auto-localized by Apple. |
buttonStyle |
'black' | 'white' | 'whiteOutline' |
'black' |
Button color theme. |
referrer |
string |
: | Merchant website URL. Required for mode='webview'. |
style |
ViewStyle |
: | Container style overrides. |
GoogleWallet Props
| 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 ButtonConstants.ButtonType. Auto-localized. |
buttonTheme |
GooglePayButtonTheme |
'dark' |
'dark' or 'light'. Maps to ButtonConstants.ButtonTheme. |
borderRadius |
number |
: | Corner radius in dp. |
style |
ViewStyle |
: | Container style overrides. |
Types
Import from: @boltpay/react-native/payments
Styles
type Styles = { [key: `--bolt-${string}`]: string };
V3 CSS custom properties. See Styling for usage.
TokenResult
{
token?: string;
last4?: string;
bin?: string;
network?: string;
expiration?: string;
postal_code?: string;
}
CreditCardId
{
id: string; // from Bolt's Add Card API
expiration: string;
}
CreditCardInfo
type CreditCardInfo = CreditCardId | TokenResult;
Input for fetchReferenceID().
ThreeDSConfig
{
referenceID: string;
jwtPayload: string;
stepUpUrl: string;
}
ThreeDSResult
{
success: boolean;
error?: ThreeDSError;
}
ThreeDSError
Error subclass with a numeric code property (1001–1010). See Error Codes below.
EventType
type EventType = 'error' | 'valid' | 'blur' | 'focus';
ApplePayResult
{
token: string;
bin?: string;
expiration?: string;
billingContact?: object;
boltReference?: string;
}
ApplePayButtonType
Apple-approved button label variants:
'plain' | 'buy' | 'checkout' | 'book' | 'subscribe' | 'donate' | 'order' | 'setUp' | 'inStore' | 'reload' | 'addMoney' | 'topUp' | 'rent' | 'support' | 'contribute' | 'tip'
ApplePayConfig
Apple Pay configuration including merchant ID (for native mode), country/currency, and total amount.
GooglePayResult
{
token: string;
bin?: string;
expiration?: string;
email?: string;
billingAddress?: object;
boltReference?: string;
}
GooglePayButtonType
Google-approved button label variants:
'plain' | 'buy' | 'pay' | 'checkout' | 'subscribe' | 'donate' | 'order' | 'book'
GooglePayButtonTheme
'dark' | 'light'
GooglePayConfig
{
billingAddressCollectionFormat?: string;
currencyCode?: string;
label?: string;
amount?: string;
}
Merchant and gateway config is auto-fetched from Bolt: you only provide presentation options.
Error Codes
ThreeDSError includes a numeric code property with the following values:
| Code | Description |
|---|---|
| 1001 | Credit card id or token must be supplied |
| 1002 | Credit card id and token cannot both be supplied |
| 1003 | Malformed credit card token |
| 1004 | Order token does not exist |
| 1005 | API response error during verification |
| 1006 | Verification not required |
| 1007 | Setup error during verification |
| 1008 | Authentication failed |
| 1009 | Failed to create challenge or challenge failed |
| 1010 | Failed to get device data collection jwt |