npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

wallet-hub

v0.1.3

Published

Simple web3 wallet adapter for Solana and other chains with React hooks support

Readme

Wallet Hub

A lightweight, type-safe wallet adapter for Solana and EVM-compatible blockchains with React hooks support.

Features

  • 🦄 Multi-chain support - Solana and EVM chains
  • 🔌 Multiple wallets - Phantom, Solflare, MetaMask, Trust Wallet
  • ⚛️ React hooks - Ready-to-use hooks for React applications
  • 🔄 Unified adapter - Manage multiple wallets with a single interface
  • 📦 Lightweight - Minimal dependencies
  • 🔒 Type-safe - Full TypeScript support
  • 🛡️ Error handling - Structured error responses

Installation

npm install wallet-hub
# or
yarn add wallet-hub
# or
pnpm add wallet-hub

Quick Start

Using React Hooks (Recommended)

import { WalletAdapterProvider, PhantomWalletAdapter, MetaMaskAdapter } from 'wallet-hub';
import { useWalletAdapter } from 'wallet-hub';

function App() {
  const wallets = [
    new PhantomWalletAdapter(),
    new MetaMaskAdapter()
  ];

  return (
    <WalletAdapterProvider wallets={wallets}>
      <WalletComponent />
    </WalletAdapterProvider>
  );
}

function WalletComponent() {
  const {
    wallets,
    activeWallet,
    selectWallet,
    connect,
    disconnect,
    connected,
    publicKey,
    shortenedPublicKey,
    isPhantom,
    isMetaMask
  } = useWalletAdapter();

  return (
    <div>
      {wallets.map(wallet => (
        <button key={wallet.name} onClick={() => selectWallet(wallet)}>
          {wallet.name}
        </button>
      ))}
      
      {activeWallet && (
        <>
          {!connected ? (
            <button onClick={connect}>Connect</button>
          ) : (
            <>
              <p>Connected: {shortenedPublicKey}</p>
              <button onClick={disconnect}>Disconnect</button>
            </>
          )}
        </>
      )}
    </div>
  );
}

Using Individual Adapters

import { PhantomAdapterProvider, usePhantomAdapter } from 'wallet-hub';

function PhantomComponent() {
  const { connect, disconnect, connected, publicKey, shortenedPublicKey } = usePhantomAdapter();

  return (
    <div>
      {!connected ? (
        <button onClick={connect}>Connect Phantom</button>
      ) : (
        <>
          <p>Connected: {shortenedPublicKey}</p>
          <button onClick={disconnect}>Disconnect</button>
        </>
      )}
    </div>
  );
}

function App() {
  return (
    <PhantomAdapterProvider>
      <PhantomComponent />
    </PhantomAdapterProvider>
  );
}

Direct Adapter Usage (Without React)

import { PhantomWalletAdapter, MetaMaskAdapter } from 'wallet-hub';

// Solana - Phantom
const phantom = new PhantomWalletAdapter();
await phantom.connect();
console.log(phantom.publicKey);

phantom.on('connect', (publicKey) => {
  console.log('Connected:', publicKey);
});

phantom.on('disconnect', () => {
  console.log('Disconnected');
});

// EVM - MetaMask
const metamask = new MetaMaskAdapter();
await metamask.connect();
console.log(metamask.publicKey);

Message Signing

Sign Message (Uint8Array)

const signature = await adapter.signMessage({
  message: new TextEncoder().encode('Hello, World!')
});

Sign Message and Encode to Base58 (String)

const signature = await adapter.signMessageAndEncodeToBase58('Hello, World!');

Supported Wallets

Solana

  • Phantom - PhantomWalletAdapter
  • Solflare - SolflareWalletAdapter

EVM

  • MetaMask - MetaMaskAdapter
  • Trust Wallet - TrustWalletAdapter

API Reference

Unified Wallet Adapter

import { WalletAdapterProvider, useWalletAdapter } from 'wallet-hub';

// Hook returns:
{
  wallets: BaseAdapter[];           // All available wallets
  activeWallet: BaseAdapter | null;  // Currently selected wallet
  selectWallet: (wallet) => void;    // Select a wallet
  connect: () => Promise<void>;       // Connect to active wallet
  disconnect: () => Promise<void>;    // Disconnect from active wallet
  signMessage: (options) => Promise<Uint8Array>;
  signMessageAndEncodeToBase58: (message: string) => Promise<string>;
  request: (args) => Promise<any>;   // EVM wallets only
  connected: boolean;
  connecting: boolean;
  publicKey: string | null;
  shortenedPublicKey: string | null;
  isPhantom: boolean;
  isSolflare: boolean;
  isMetaMask: boolean;
  isTrust: boolean;
  error: WalletError | null;
  errorResponse: WalletErrorResponse | null;
}

Individual Wallet Hooks

  • usePhantomAdapter() - Phantom wallet hook
  • useSolflareAdapter() - Solflare wallet hook
  • useEthereumAdapter() - MetaMask wallet hook
  • useTrustWalletAdapter() - Trust Wallet hook

Error Handling

All errors are wrapped in WalletError with structured responses:

try {
  await adapter.connect();
} catch (error) {
  if (error instanceof WalletError) {
    console.log(error.code);      // e.g., "user_rejected"
    console.log(error.reason);     // e.g., "User rejected the request"
    console.log(error.toJSON());   // { success: false, reason: "...", code: "..." }
  }
}

Development

# Install dependencies
npm install

# Build
npm run build

# Development mode
npm run dev

License

MIT