Skip to main content

Latest React Native SDK version - npm

The Crossmint React Native SDK (@crossmint/client-sdk-react-native-ui) provides React Native components and hooks for integrating Crossmint wallets into your mobile application.

Installation

npm install @crossmint/client-sdk-react-native-ui

Provider Setup

Wrap your application with the required providers:
import {
    CrossmintProvider,
    CrossmintWalletProvider,
} from "@crossmint/client-sdk-react-native-ui";

function App() {
    return (
        <CrossmintProvider apiKey="YOUR_CLIENT_API_KEY">
            <CrossmintWalletProvider
                createOnLogin={{
                    chain: "base-sepolia",
                    signer: { type: "email" },
                }}
            >
                {/* Your app components */}
            </CrossmintWalletProvider>
        </CrossmintProvider>
    );
}

Quick Example

Once providers are set up, use hooks to access wallet state:
import { useWallet } from "@crossmint/client-sdk-react-native-ui";
import { View, Text } from "react-native";

function WalletInfo() {
    const { wallet, status } = useWallet();

    if (status === "in-progress") return <Text>Loading wallet...</Text>;
    if (!wallet) return <Text>No wallet connected</Text>;

    return (
        <View>
            <Text>Address: {wallet.address}</Text>
            <Text>Chain: {wallet.chain}</Text>
        </View>
    );
}

Next Steps