On the Frontend

To get started, install the latest version of the Bigmi core and client packages.

Installation

The @bigmi/client package provides wallet connectors and tools to integrate Bitcoin wallet extensions with your web applications. This package is essential for building Bitcoin applications that need to interact with various wallet providers.

pnpm add @bigmi/core @bigmi/client

Configuration

The client works with a config object that manages the core Bigmi client, connectors, storage, and events.

import { bitcoin, http, createClient } from '@bigmi/core'
import { binance, xverse, phantom, createConfig } from '@bigmi/client'

// Create wallet connectors
const connectors = [
  binance(),
  xverse(),
  phantom()
]

// Create configuration
const config = createConfig({
  chains: [bitcoin],
  connectors,
  client: ({ chain }) => createClient({ chain, transport: http() }),
  ssr: true // if using Next.js or SSR
})

Wallet Interactions

The Bigmi library provides connectors for connecting to 10+ wallets.

import { config } from './config.ts'
import { phantom, getConnectorClient, connect, disconnect } from '@bigmi/client'
import { signPsbt } from '@bigmi/core'

// Connect to the phantom wallet
const { accounts, chainId } =  await connect(config, { connector: phantom() })

// get client object
// returns a wallet connector wrapped as a bigmi client
const client = await getConnectorClient(config)

// send a transaction to the wallet for the user to sign
const signedPsbt = await signPsbt(client, {
    psbt: 'base64_encoded_psbt',
    account: accounts[0]
})

// disconnect from the current wallet
await disconnect(config)

import { bitcoin, http, createClient } from '@bigmi/core'
import { binance, xverse, phantom, createConfig } from '@bigmi/client'

// Create wallet connectors
const connectors = [
  binance(),
  xverse(),
  phantom()
]

// Create configuration
export const config = createConfig({
  chains: [bitcoin],
  connectors,
  client: ({ chain }) => createClient({ chain, transport: http() }),
  ssr: true // if using Next.js or SSR
})

Supported Wallets

Binance Wallet
Xverse
Phantom
Bitget
Ctrl
Leather
OKX
Onekey
Oyl
Unisat
Magic Eden
Dynamic (embedded wallet)

Custom Connectors

You can create custom connectors by defining a function that returns a createConnector with config properties and methods implemented.

import { createConnector, type UTXOConnectorParameters } from '@bigmi/client'
import { Chain, type Account, type ChainId } from '@bigmi/core'

export function customConnector(parameters: UTXOConnectorParameters = {}) {
    return createConnector((config) => ({
        id: 'connector_id', 
        name: 'custom connector', // name of the wallet
        type: 'UTXO', 
        icon: 'data:image/svg+xml', //data URI of image

        async setup() {
            // method called when the connector is instantiated to run setup logic
        },

        async getInternalProvider(): Promise<any> {
            // method that returns the provider object from the wallet
            // usually obtained from the window object
        },

        async connect (): Promise<{ accounts: string[], chainId: string }> {
            // method to call connect method of the provider 
            //  returns the connected account, and the chain
        },

        async request(params): Promise<any> {
            // method used to send rpc requests to the provider
        },
        async getAccounts(): Promise<Account[]> {
            // method to get accounts from the wallet
        },
        async getChainId(): Promise<ChainId> {
            // method to get the current chain from the wallet
        }

    }))
}

Advanced Configuration

Transport vs Client Configuration

Bigmi’s createConfig supports two mutually exclusive configuration patterns - you can use either transports or client, but not both:

Static `transports` Approach

const config = createConfig({
  chains: [bitcoin, testnet],
  connectors: [phantom(), xverse()],
  transports: {
    [bitcoin.id]: fallback([ankr(), mempool()]),
    [testnet.id]: mempool({ baseUrl: 'https://mempool.space/testnet/api' })
  },
  cacheTime: 4000, // applies to all chains
})

Bigmi automatically creates clients using your transport mapping
Supports chain-specific properties via objects
More concise for straightforward configurations

Dynamic `client` Approach

const config = createConfig({
  chains: [bitcoin, testnet],
  connectors: [phantom(), xverse()],
  client: ({ chain }) => createClient({
    chain,
    transport: chain.testnet ? mempool() : fallback([ankr(), mempool()]),
    cacheTime: chain.testnet ? 2000 : 4000,
  })
})

You control client creation with a factory function
Enables conditional logic based on chain properties
More flexible for complex configurations

When to Use Each:

Use transports when:

Simple static transport mapping is sufficient
You want Bigmi to handle client creation automatically
Configuration is straightforward and doesn’t need runtime logic

Use client when:

You need conditional logic based on chain properties
You want full control over client configuration
You need environment-specific or complex transport selection

​Installation

​Configuration

​Wallet Interactions

​Supported Wallets

​Custom Connectors

​Advanced Configuration

​Transport vs Client Configuration

​Static transports Approach

​Dynamic client Approach

​When to Use Each: