> ## Documentation Index
> Fetch the complete documentation index at: https://dev.moonpay.com/llms.txt
> Use this file to discover all available pages before exploring further.

# MoonPayProvider

> Mount the provider once to make the SDK available throughout your React Native app.

`<MoonPayProvider>` initializes the SDK with a [`sessionToken`](/platform/guides/api-and-sdk-credentials#session-token) and renders MoonPay frames as `react-native-webview` instances when you call SDK methods. Wrap the part of your app that needs access to the client.

```tsx App.tsx theme={null}
import { MoonPayProvider } from "@moonpay/platform-sdk-react-native";

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

Read the client from descendant components with [`useMoonPay()`](/platform/sdk-reference/react-native/use-moonpay).

***

## Props

| Property       | Type        | Required | Description                                                                                                                                                    |
| -------------- | ----------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `sessionToken` | `string`    | ✅        | The [sessionToken](/platform/guides/api-and-sdk-credentials#session-token) created on your server.                                                             |
| `children`     | `ReactNode` | ✅        | Your app tree. Components below the provider can call `useMoonPay()`.                                                                                          |
| `apiBaseUrl`   | `string`    |          | Override the MoonPay Platform API base URL. Defaults to production. Use this only when MoonPay support has asked you to point at a non-production environment. |
| `frameBaseUrl` | `string`    |          | Override the MoonPay frame base URL. Defaults to production. Use this only when MoonPay support has asked you to point at a non-production environment.        |

## Frame rendering

When you call a method that opens a visible frame — such as `client.connect()`,
`client.setupWidget()`, or `client.setupAddCard()` — the provider presents it
in a full-screen native `Modal` with a slide animation. Multiple frames stack
naturally: for example, a challenge frame appears on top of an active widget.
On Android, the hardware back button dismisses the top frame and disposes it.

Hidden utility frames (used by `client.getConnection()`, `client.setupBuy()`,
and `client.resetConnection()`) render as zero-size siblings with no visible
impact on your layout.

```tsx Layout theme={null}
<MoonPayProvider sessionToken="c3N0XzAwMQ==">
  <YourAppShell />
  {/* Hidden utility frames are mounted here as zero-size siblings.
      Visible frames appear in full-screen modals above your content. */}
</MoonPayProvider>
```

## Client methods

The hook exposes a `client` object with every integration method:

* [`client.getConnection()`](/platform/sdk-reference/react-native/get-connection)
* [`client.connect()`](/platform/sdk-reference/react-native/connect)
* [`client.setupAuth()`](/platform/sdk-reference/react-native/setup-auth)
* [`client.resetConnection()`](/platform/sdk-reference/react-native/reset-connection)
* [`client.getPaymentMethods()`](/platform/sdk-reference/react-native/get-payment-methods)
* [`client.deletePaymentMethod()`](/platform/sdk-reference/react-native/delete-payment-method)
* [`client.getQuote()`](/platform/sdk-reference/react-native/get-quote)
* [`client.getTransaction()`](/platform/sdk-reference/react-native/get-transaction)
* [`client.listTransactions()`](/platform/sdk-reference/react-native/list-transactions)
* [`client.setupWidget()`](/platform/sdk-reference/react-native/setup-widget)
* [`client.setupBuy()`](/platform/sdk-reference/react-native/setup-buy)
* [`client.setupChallenge()`](/platform/sdk-reference/react-native/setup-challenge)
* [`client.setupAddCard()`](/platform/sdk-reference/react-native/setup-add-card)
* [`client.setupApplePay()`](/platform/sdk-reference/react-native/setup-apple-pay)
  *(deprecated — use [`<MoonPayApplePayButton>`](/platform/sdk-reference/react-native/components/moonpay-apple-pay-button) instead)*
* [`client.setupGooglePay()`](/platform/sdk-reference/react-native/setup-google-pay)
  *(deprecated — use [`<MoonPayGooglePayButton>`](/platform/sdk-reference/react-native/components/moonpay-google-pay-button) instead)*
* [`client.setupBuyButton()`](/platform/sdk-reference/react-native/setup-buy-button)
  *(deprecated — use [`<MoonPayBuyButton>`](/platform/sdk-reference/react-native/components/moonpay-buy-button) instead)*