# SuperwallProvider

`<SuperwallProvider />` is the root component for the Superwall SDK. It is used to initialize the SDK with your API key.

Props [#props]

<TypeTable
  type="{
  apiKeys: {
    type: &#x22;{ ios?: string; android?: string }&#x22;,
    description: &#x22;API keys for each platform (use the platform you ship).&#x22;,
    required: true,
  },
  options: {
    type: &#x22;PartialSuperwallOptions?&#x22;,
    description: &#x22;Optional configuration options. See /expo/guides/configuring for available fields.&#x22;,
  },
  onConfigurationError: {
    type: &#x22;(error: Error) => void&#x22;,
    description: &#x22;Optional callback invoked when SDK configuration fails.&#x22;,
  },
  children: {
    type: &#x22;React.ReactNode&#x22;,
    description: &#x22;App content to render once configuration succeeds.&#x22;,
    required: true,
  },
}"
/>

apiKeys [#apikeys]

<TypeTable
  type="{
  ios: {
    type: &#x22;string?&#x22;,
    description: &#x22;iOS API key.&#x22;,
  },
  android: {
    type: &#x22;string?&#x22;,
    description: &#x22;Android API key.&#x22;,
  },
}"
/>

```tsx
<SuperwallProvider
  apiKeys={{ ios: "YOUR_SUPERWALL_API_KEY" }}
  onConfigurationError={(error) => {
    console.error("Superwall configuration failed:", error);
    // Handle error, show UI, or retry
  }}
>
  {/* Your app content */}
</SuperwallProvider>
```

Example [#example]

```tsx
import { SuperwallProvider } from "expo-superwall";

// Replace with your actual Superwall API key
export default function App() {
  return (
    <SuperwallProvider apiKeys={{ ios: "YOUR_SUPERWALL_API_KEY" /* android: API_KEY */ }}>
      {/* Your app content goes here */}
    </SuperwallProvider>
  );
}
```

Consume rerouted Android back buttons [#consume-rerouted-android-back-buttons]

If the **Reroute back button** toggle is enabled on a paywall (/dashboard/dashboard-creating-paywalls/paywall-editor-settings#reroute-back-button), Superwall can hand control back to your app. Provide `options.paywalls.onBackPressed` to intercept the event and return `true` to consume it.

```tsx
<SuperwallProvider
  apiKeys={{ ios: "ios_key", android: "android_key" }}
  options={{
    paywalls: {
      onBackPressed: (paywallInfo) => {
        if (paywallInfo.identifier === "survey") {
          showExitConfirmation();
          return true; // Prevent Superwall from dismissing automatically
        }
        return false; // Keep the default dismissal behavior
      },
    },
  }}
/>
```

This callback only fires on Android and only when rerouting is enabled in the paywall editor. Use it to show confirmation modals, capture analytics, or resume gameplay before closing the paywall.