butr
Get startedFrameworks

Expo (React Native, web target)

WalletManagerProvider with autoDiscovery() and an AsyncStorage-backed storage driver.

Expo works with WalletManagerProvider and autoDiscovery(), but React Native has no localStorage, so you supply an AsyncStorage-backed storage driver. This is the demo-expo-web reference.

src/async-storage-driver.ts
import AsyncStorage from "@react-native-async-storage/async-storage";
import type { StorageDriver } from "@usebutr/core";

const asyncStorageDriver: StorageDriver = {
  getItem: (key) => AsyncStorage.getItem(key),
  setItem: (key, value) => AsyncStorage.setItem(key, value),
  removeItem: (key) => AsyncStorage.removeItem(key),
};

export { asyncStorageDriver };
src/wallet-provider.tsx
import type { WalletManagerConfig } from "@usebutr/core";
import { createWalletStorage } from "@usebutr/core";
import { WalletManagerProvider } from "@usebutr/react";
import { autoDiscovery } from "@usebutr/wallets";
import type { ReactNode } from "react";

import { asyncStorageDriver } from "./async-storage-driver";

const config: WalletManagerConfig = {
  sources: [autoDiscovery()],
  storage: createWalletStorage({
    keyPrefix: "butr-demo",
    persistent: asyncStorageDriver,
    session: asyncStorageDriver,
  }),
};

const WalletProvider = ({ children }: { children: ReactNode }) => (
  <WalletManagerProvider config={config}>{children}</WalletManagerProvider>
);

export { WalletProvider };

With storage set, storageKeyPrefix is ignored: the prefix belongs to createWalletStorage.

demo-expo-web targets the web bundle (expo start --web), where browser wallet discovery works. Native iOS/Android wallet transports (deep links, in-app browsers) are out of scope for this provider; on native you'd pair through WalletConnect instead.

Source: apps/demo-expo-web/src/wallet-provider.tsx in the butr repository. Run pnpm dev --filter=demo-expo-web → https://usebutr.demo-expo-web.localhost. See custom storage for the session-storage caveat.