Phantom React Native SDK

The Phantom React Native SDK provides React hooks for integrating Phantom wallet functionality into your mobile React Native applications with native transaction support across multiple blockchains.

Features

  • React Hooks Integration: Native hooks for seamless React Native integration
  • Multi-Chain Support: Solana, Ethereum, Bitcoin, and Sui networks
  • Native Transaction Support: Direct transaction object handling
  • Cross-Platform: Works on both iOS and Android
  • OAuth Authentication: Google, Apple, and custom JWT providers
  • TypeScript Support: Full TypeScript definitions included

Security

The React Native SDK uses device secure storage with hardware-backed security. This approach ensures:
  • Private keys are stored in device Keychain (iOS) or Keystore (Android)
  • Hardware-backed key protection when available
  • Biometric authentication support
  • User maintains full control of their assets
  • PKCE support for OAuth flows

Installation

npm install @phantom/react-native-sdk

Required Dependencies

Install the required peer dependencies:
npx expo install expo-secure-store expo-web-browser expo-auth-session expo-router

Polyfill Setup

Critical: Add this polyfill import as the first import in your app’s entry file:
// App.tsx or index.js - MUST be the first import
import "react-native-get-random-values";

import React from 'react';
import { PhantomProvider, AddressType } from "@phantom/react-native-sdk";
// ... other imports

Expo Configuration

Update your app.json or app.config.js:
{
  "expo": {
    "scheme": "mywalletapp",
    "ios": {
      "bundleIdentifier": "com.yourcompany.yourapp"
    },
    "android": {
      "package": "com.yourcompany.yourapp"
    }
  }
}

Quick Start

1. Wrap Your App with PhantomProvider

import { PhantomProvider, AddressType } from "@phantom/react-native-sdk";

function App() {
  return (
    <PhantomProvider
      config={{
        organizationId: "your-organization-id",
        scheme: "mywalletapp",
        embeddedWalletType: "user-wallet",
        addressTypes: [AddressType.solana],
        apiBaseUrl: "https://api.phantom.app/v1/wallets"
      }}
    >
      <YourApp />
    </PhantomProvider>
  );
}

2. Connect to Wallet

import { useConnect, useAccounts } from "@phantom/react-native-sdk";

function ConnectButton() {
  const { connect, isLoading } = useConnect();
  const accounts = useAccounts();

  const handleConnect = async () => {
    try {
      const result = await connect();
      console.log("Connected:", result);
    } catch (error) {
      console.error("Connection failed:", error);
    }
  };

  const isConnected = accounts && accounts.length > 0;

  return (
    <View>
      {!isConnected ? (
        <Button 
          title={isLoading ? "Connecting..." : "Connect Phantom"}
          onPress={handleConnect}
          disabled={isLoading}
        />
      ) : (
        <Text>Connected: {accounts[0].address}</Text>
      )}
    </View>
  );
}

Configuration Options

OptionTypeRequiredDescription
organizationIdstringYesYour organization identifier
schemestringYesURL scheme for deep linking
embeddedWalletType"app-wallet" | "user-wallet"NoWallet creation strategy
addressTypesAddressType[]YesSupported blockchain networks
apiBaseUrlstringYesPhantom API endpoint

Authentication Providers

The SDK supports multiple OAuth providers:
  • Google: OAuth with Google accounts
  • Apple: Sign in with Apple (iOS)
  • Custom JWT: Your own authentication system

Platform Requirements

iOS

  • Configure URL schemes in Info.plist
  • Add required capabilities for Keychain access

Android

  • Configure intent filters for deep linking
  • Add permissions for secure storage access

Supported Networks

  • Solana: Mainnet, Devnet, Testnet
  • Ethereum: Mainnet, Sepolia
  • Bitcoin: Mainnet, Testnet
  • Sui: Mainnet, Testnet, Devnet
  • Polygon, Arbitrum, Base

Next Steps