Skip to main content
The React Native SDK wraps the MoonPay Developer Platform in a <MoonPayProvider> and a useMoonPay() hook. The SDK ships with TypeScript types for autocomplete and inference. The SDK is tested against:
  • React Native 0.73+
  • React >=18
  • react-native-webview 13.0+
  • iOS 14+ and Android API 26+

​
Install

Install the SDK package and its peer dependency: 
pnpm i @moonpay/platform-sdk-react-native react-native-webview
Follow the react-native-webview install guide to link the native module. On iOS, run pod install from your ios/ directory.

​
Conventions

​
Provider + hook

Mount <MoonPayProvider> near the top of your app tree and call useMoonPay() from any descendant component to get the client. The SDK presents frames in two ways:
  • Client methods such as client.connect() or client.setupWidget() open a full-screen modal managed by the provider. Hidden utility frames (connection check, headless buy, reset) render at zero size.
  • Inline components such as <MoonPayConnect> or <MoonPayWidget> render the frame wherever you place them in your layout.
App.tsx
import { MoonPayProvider } from "@moonpay/platform-sdk-react-native";

export default function App() {
  return (
    <MoonPayProvider sessionToken="c3N0XzAwMQ==">
      <YourApp />
    </MoonPayProvider>
  );
}

​
Result<T, E>

Most SDK functions return a Result<T, E> instead of throwing.
FieldTypeRequiredDescription
okboolean✅Whether the operation succeeded.
valueTPresent when ok is true.
errorEPresent when ok is false.
Use this pattern to branch on success vs failure: 
const result = await client.getConnection();

if (!result.ok) {
  // Handle error
  console.error(result.error);
  return;
}

console.log(result.value);

​
Function reference

These pages document the provider, hook, and individual SDK functions:

Mount the provider

Access the client with useMoonPay()

Check the customer's connection

Connect a customer

Reset the customer's connection

List payment methods

Get a quote

Auth (email/OTP)

Set up Apple Pay

Set up Google Pay

Set up the widget

Set up the buy frame

Set up the buy button

Add a card

Set up the Challenge frame

Get a transaction

List transactions

Delete a payment method

​
Inline components

Every frame also has a declarative component you can render directly in your JSX tree. Components are a good fit when you want a frame embedded in a custom screen. The three deprecated methods below have direct component replacements.
Deprecated methodComponent replacement
client.setupApplePay()<MoonPayApplePayButton>
client.setupGooglePay()<MoonPayGooglePayButton>
client.setupBuyButton()<MoonPayBuyButton>

Inline components overview

Auth (email/OTP) — inline