@solana/wallet-adapter

Modular TypeScript wallet adapters and components for Solana applications.

Quick Links

• Docs
• Example

Packages

package	description	npm	version
wallets	All wallets with icons	@solana/wallet-adapter-wallets	0.6.0
react	React hooks and context for dApps	@solana/wallet-adapter-react	0.6.0
base	Adapter interface, errors, and utilities	@solana/wallet-adapter-base	0.4.1
phantom	Adapter for Phantom	@solana/wallet-adapter-phantom	0.4.1
solflare	Adapter for Solflare	@solana/wallet-adapter-solflare	0.1.0
torus	Adapter for Torus	@solana/wallet-adapter-torus	0.5.0
ledger	Adapter for Ledger	@solana/wallet-adapter-ledger	0.4.1
solong	Adapter for Solong	@solana/wallet-adapter-solong	0.4.1
mathwallet	Adapter for MathWallet	@solana/wallet-adapter-mathwallet	0.4.1
sollet	Adapter for Sollet	@solana/wallet-adapter-sollet	0.4.1
walletconnect	Adapter for WalletConnect (coming soon)	@solana/wallet-adapter-walletconnect	0.0.0
material-ui	Components for Material UI	@solana/wallet-adapter-material-ui	0.6.0
material-ui-starter	Create React App project using Material UI	@solana/wallet-adapter-material-ui-starter	0.3.0
example	Demo of components	@solana/wallet-adapter-example	0.6.0

Quick Setup (using React with Material UI)

See the material-ui-starter package for a more complete example.

Install

Install these peer dependencies (or skip this if you have them already):

yarn add @material-ui/core \
         @material-ui/icons \
         @solana/web3.js \
         react

Install these dependencies:

yarn add @solana/wallet-adapter-wallets \
         @solana/wallet-adapter-react \
         @solana/wallet-adapter-material-ui \
         @solana/wallet-adapter-base

Code

import React, { FC, useMemo } from 'react';
import { WalletProvider } from '@solana/wallet-adapter-react';
import {
    getLedgerWallet,
    getMathWallet,
    getPhantomWallet,
    getSolflareWallet,
    getSolletWallet,
    getSolongWallet,
    getTorusWallet,
} from '@solana/wallet-adapter-wallets';
import {
    WalletDialogProvider,
    WalletDisconnectButton,
    WalletMultiButton,
} from '@solana/wallet-adapter-material-ui';

export const Wallet: FC = () => {
    // @solana/wallet-adapter-wallets includes all the adapters but supports tree shaking --
    // Only the wallets you want to instantiate here will be compiled into your application
    const wallets = useMemo(() => [
        getPhantomWallet(),
        getSolflareWallet(),
        getTorusWallet({
            options: { clientId: 'Go to https://developer.tor.us and create a client ID' }
        }),
        getLedgerWallet(),
        getSolongWallet(),
        getMathWallet(),
        getSolletWallet(),
    ], []);

    return (
        <WalletProvider wallets={wallets} autoConnect>
            <WalletDialogProvider>
                <WalletMultiButton/>
                <WalletDisconnectButton/>
            </WalletDialogProvider>
        </WalletProvider>
    );
};