Skip to content

Why wallet adapters

TokenFlight does not bundle a wallet. For crypto flows, the widget needs a walletAdapter so it can ask the user's wallet to connect, sign, and send transactions.

Card-only checkout can skip this step. Swap, receive with crypto, and mixed crypto/card checkout need a wallet adapter before the user can finish payment.

Choose an adapter

Your appUseWhy
New app, or you want WalletConnect UXAppKitGood default for first integration
Existing wagmi, RainbowKit, or ConnectKit appwagmiReuses your EVM wallet config
Injected EIP-1193 wallet, such as MetaMaskethersSmall EVM-only setup
Your own wallet modal, provider, or signing layerCustom Wallet AdapterLets you connect any wallet system

If you are not sure, start with AppKit.

What the adapter does

A wallet adapter gives the widget these abilities:

  • Connect and disconnect a wallet.
  • Read the current wallet address.
  • Limit the widget to supported chains.
  • Execute EVM and Solana wallet actions.
  • Emit wallet events, such as account changes.
  • Clean up wallet subscriptions when your app unmounts.

The widget builds the action, but the wallet signs it. TokenFlight never handles private keys.

Minimal shape

ts
import { TokenFlightWidget } from '@tokenflight/swap';
import { createAppKitAdapter } from '@tokenflight/adapter-appkit';
import { mainnet, base } from '@reown/appkit/networks';

const { adapter: walletAdapter } = await createAppKitAdapter({
  projectId: 'YOUR_REOWN_PROJECT_ID',
  networks: [mainnet, base],
  metadata: {
    name: 'My TokenFlight App',
    description: 'TokenFlight payment flow',
    url: window.location.origin,
    icons: [],
  },
});

const widget = new TokenFlightWidget({
  container: '#widget',
  config: {
    toToken: { chainId: 8453, address: '0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913' },
    tradeType: 'EXACT_OUTPUT',
    amount: '100',
  },
  walletAdapter,
});
widget.initialize();

Next step