tessl/npm-wagmi

React Hooks for Ethereum providing reactive primitives for wallet connections, smart contract interactions, and blockchain data

—

Pending

Overview

Eval results

Files

Blockchain Data

Name: tessl/npm-wagmi
Author: tessl

Access to blocks, chain information, balances, and general blockchain state with real-time updates. This module provides comprehensive hooks for reading blockchain data including blocks, balances, chain information, and contract storage.

Capabilities

useBlockNumber

Hook to get the current block number with automatic updates.

/**
 * Hook to get current block number
 * @param parameters - Optional configuration parameters
 * @returns Current block number with query state
 */
function useBlockNumber<config = Config, selectData = UseBlockNumberReturnType>(
  parameters?: UseBlockNumberParameters<config, selectData>
): UseBlockNumberReturnType<selectData>;

interface UseBlockNumberParameters<config = Config, selectData = UseBlockNumberReturnType> {
  /** Chain to use for block number */
  chainId?: config['chains'][number]['id'];
  /** Custom config */
  config?: Config | config;
  /** TanStack Query parameters */
  query?: {
    enabled?: boolean;
    staleTime?: number;
    refetchInterval?: number;
    select?: (data: UseBlockNumberReturnType) => selectData;
  };
}

type UseBlockNumberReturnType = bigint;

useBlock

Hook to get detailed block information by number or hash.

/**
 * Hook to get block information
 * @param parameters - Block query parameters
 * @returns Block data with transaction details
 */
function useBlock<config = Config, selectData = UseBlockReturnType>(
  parameters?: UseBlockParameters<config, selectData>
): UseBlockReturnType<selectData>;

interface UseBlockParameters<config = Config, selectData = UseBlockReturnType> {
  /** Block number or hash to fetch */
  blockNumber?: bigint;
  blockHash?: Hash;
  blockTag?: 'latest' | 'earliest' | 'pending' | 'safe' | 'finalized';
  /** Include full transaction data */
  includeTransactions?: boolean;
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseBlockReturnType) => selectData;
  };
}

interface UseBlockReturnType {
  /** Block hash */
  hash: Hash;
  /** Block number */
  number: bigint;
  /** Parent block hash */
  parentHash: Hash;
  /** Timestamp */
  timestamp: bigint;
  /** Gas limit */
  gasLimit: bigint;
  /** Gas used */
  gasUsed: bigint;
  /** Miner/validator address */
  miner: Address;
  /** Transaction hashes or full transactions */
  transactions: Hash[] | Transaction[];
  /** Additional block properties */
  difficulty?: bigint;
  totalDifficulty?: bigint;
  size?: bigint;
  nonce?: Hex;
  baseFeePerGas?: bigint;
}

useBalance

Hook to get account balance for native currency or ERC-20 tokens.

/**
 * Hook to get account balance
 * @param parameters - Balance query parameters
 * @returns Balance data with decimals and symbol
 */
function useBalance<config = Config, selectData = UseBalanceReturnType>(
  parameters: UseBalanceParameters<config, selectData>
): UseBalanceReturnType<selectData>;

interface UseBalanceParameters<config = Config, selectData = UseBalanceReturnType> {
  /** Account address to check balance for */
  address: Address;
  /** Token contract address (omit for native currency) */
  token?: Address;
  /** Block number to check balance at */
  blockNumber?: bigint;
  blockTag?: 'latest' | 'earliest' | 'pending' | 'safe' | 'finalized';
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseBalanceReturnType) => selectData;
  };
}

interface UseBalanceReturnType {
  /** Token decimals */
  decimals: number;
  /** Formatted balance string */
  formatted: string;
  /** Token symbol */
  symbol: string;
  /** Raw balance value */
  value: bigint;
}

Usage Example:

import { useBalance } from "wagmi";

function Balance({ address }: { address: `0x${string}` }) {
  const { data: balance } = useBalance({
    address,
  });

  // Get USDC balance
  const { data: usdcBalance } = useBalance({
    address,
    token: '0xA0b86a33E6417C90CC5F6d2c4a29f9D7e5D8ecf0', // USDC
  });

  return (
    <div>
      <p>ETH: {balance?.formatted} {balance?.symbol}</p>
      <p>USDC: {usdcBalance?.formatted} {usdcBalance?.symbol}</p>
    </div>
  );
}

useChainId

Hook to get the current chain ID.

/**
 * Hook to get current chain ID
 * @param parameters - Optional configuration parameters  
 * @returns Current chain ID
 */
function useChainId<config = Config>(
  parameters?: UseChainIdParameters<config>
): UseChainIdReturnType<config>;

interface UseChainIdParameters<config = Config> {
  config?: Config | config;
}

type UseChainIdReturnType<config = Config> = config['chains'][number]['id'];

useChains

Hook to get all configured chains.

/**
 * Hook to get configured chains
 * @param parameters - Optional configuration parameters
 * @returns Array of configured chains
 */
function useChains<config = Config>(
  parameters?: UseChainsParameters<config>
): UseChainsReturnType<config>;

interface UseChainsParameters<config = Config> {
  config?: Config | config;
}

type UseChainsReturnType<config = Config> = config['chains'];

useClient

Hook to get a Viem client instance for making direct RPC calls.

/**
 * Hook to get viem client
 * @param parameters - Client configuration parameters
 * @returns Viem client instance
 */
function useClient<config = Config>(
  parameters?: UseClientParameters<config>
): UseClientReturnType<config>;

interface UseClientParameters<config = Config> {
  /** Chain ID for the client */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
}

type UseClientReturnType<config = Config> = Client<Transport, config['chains'][number]>;

usePublicClient

Hook to get a public Viem client for read-only operations.

/**
 * Hook to get public viem client
 * @param parameters - Public client configuration parameters
 * @returns Public viem client instance
 */
function usePublicClient<config = Config>(
  parameters?: UsePublicClientParameters<config>
): UsePublicClientReturnType<config>;

interface UsePublicClientParameters<config = Config> {
  /** Chain ID for the client */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
}

type UsePublicClientReturnType<config = Config> = PublicClient<Transport, config['chains'][number]>;

useBytecode

Hook to get contract bytecode at a specific address.

/**
 * Hook to get contract bytecode
 * @param parameters - Bytecode query parameters
 * @returns Contract bytecode
 */
function useBytecode<config = Config, selectData = UseBytecodeReturnType>(
  parameters: UseBytecodeParameters<config, selectData>
): UseBytecodeReturnType<selectData>;

interface UseBytecodeParameters<config = Config, selectData = UseBytecodeReturnType> {
  /** Contract address to get bytecode for */
  address: Address;
  /** Block number to check bytecode at */
  blockNumber?: bigint;
  blockTag?: 'latest' | 'earliest' | 'pending' | 'safe' | 'finalized';
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseBytecodeReturnType) => selectData;
  };
}

type UseBytecodeReturnType = Hex | undefined;

useStorageAt

Hook to read contract storage at a specific slot.

/**
 * Hook to read contract storage
 * @param parameters - Storage query parameters
 * @returns Storage value at the specified slot
 */
function useStorageAt<config = Config, selectData = UseStorageAtReturnType>(
  parameters: UseStorageAtParameters<config, selectData>
): UseStorageAtReturnType<selectData>;

interface UseStorageAtParameters<config = Config, selectData = UseStorageAtReturnType> {
  /** Contract address */
  address: Address;
  /** Storage slot to read */
  slot: Hex;
  /** Block number to read storage at */
  blockNumber?: bigint;
  blockTag?: 'latest' | 'earliest' | 'pending' | 'safe' | 'finalized';
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseStorageAtReturnType) => selectData;
  };
}

type UseStorageAtReturnType = Hex | undefined;

useBlockTransactionCount

Hook to get the number of transactions in a block.

/**
 * Hook to get transaction count in a block
 * @param parameters - Block transaction count parameters
 * @returns Number of transactions in the block
 */
function useBlockTransactionCount<config = Config, selectData = UseBlockTransactionCountReturnType>(
  parameters?: UseBlockTransactionCountParameters<config, selectData>
): UseBlockTransactionCountReturnType<selectData>;

interface UseBlockTransactionCountParameters<config = Config, selectData = UseBlockTransactionCountReturnType> {
  /** Block number or hash */
  blockNumber?: bigint;
  blockHash?: Hash;
  blockTag?: 'latest' | 'earliest' | 'pending' | 'safe' | 'finalized';
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseBlockTransactionCountReturnType) => selectData;
  };
}

type UseBlockTransactionCountReturnType = number;

useConfig

Hook to get the current Wagmi configuration.

/**
 * Hook to get wagmi config
 * @param parameters - Optional configuration parameters
 * @returns Current wagmi configuration
 */
function useConfig<config = Config>(
  parameters?: UseConfigParameters<config>
): UseConfigReturnType<config>;

interface UseConfigParameters<config = Config> {
  config?: Config | config;
}

type UseConfigReturnType<config = Config> = config;

Token Information

useToken (deprecated)

Hook to get ERC-20 token information. This hook is deprecated - use useBalance or contract reads instead.

/**
 * Hook to get ERC-20 token information (deprecated)
 * @param parameters - Token query parameters
 * @returns Token metadata
 * @deprecated Use useBalance or useReadContract instead
 */
function useToken<config = Config, selectData = UseTokenReturnType>(
  parameters: UseTokenParameters<config, selectData>
): UseTokenReturnType<selectData>;

interface UseTokenParameters<config = Config, selectData = UseTokenReturnType> {
  /** Token contract address */
  address: Address;
  /** Chain to use */
  chainId?: config['chains'][number]['id'];
  config?: Config | config;
  query?: {
    enabled?: boolean;
    staleTime?: number;
    select?: (data: UseTokenReturnType) => selectData;
  };
}

interface UseTokenReturnType {
  /** Token address */
  address: Address;
  /** Token decimals */
  decimals: number;
  /** Token name */
  name?: string;
  /** Token symbol */
  symbol?: string;
  /** Total supply */
  totalSupply?: {
    formatted: string;
    value: bigint;
  };
}

Common Types

type Hash = `0x${string}`;
type Hex = `0x${string}`;
type Address = `0x${string}`;

interface Transaction {
  hash: Hash;
  blockHash?: Hash;
  blockNumber?: bigint;
  transactionIndex?: number;
  from: Address;
  to?: Address;
  value: bigint;
  gas: bigint;
  gasPrice?: bigint;
  maxFeePerGas?: bigint;
  maxPriorityFeePerGas?: bigint;
  input: Hex;
  nonce: number;
  type?: 'legacy' | 'eip2930' | 'eip1559';
}

interface Chain {
  id: number;
  name: string;
  network: string;
  nativeCurrency: {
    name: string;
    symbol: string;
    decimals: number;
  };
  rpcUrls: {
    default: { http: readonly string[] };
    public: { http: readonly string[] };
  };
  blockExplorers?: {
    default: { name: string; url: string };
  };
}

interface Client<TTransport = Transport, TChain = Chain> {
  transport: TTransport;
  chain?: TChain;
  key: string;
  name: string;
  pollingInterval: number;
  type: string;
  uid: string;
}

interface PublicClient<TTransport = Transport, TChain = Chain> extends Client<TTransport, TChain> {
  mode: 'public';
}

interface Transport {
  key: string;
  name: string;
  request: (request: { method: string; params?: any[] }) => Promise<any>;
  type: string;
}

Install with Tessl CLI