跳到主要内容

Hooks API Reference

Complete API reference for all React hooks.

For detailed documentation and examples, see the individual hook pages:

Contract Hooks​

useContract​

Get ethers Contract instance.

Full Documentation

function useContract<TAbi extends Abi = Abi>(
  parameters: UseContractParameters<TAbi>
): UseContractReturnType<TAbi>

useReadContract​

Read from contracts with auto-decryption.

Full Documentation

function useReadContract<TAbi extends Abi = Abi>(
  parameters: UseReadContractParameters<TAbi>
): UseReadContractReturnType

useWriteContract​

Write to contracts with auto-encryption.

Full Documentation

function useWriteContract<TAbi extends Abi = Abi>(
  parameters: UseWriteContractParameters<TAbi>
): UseWriteContractReturnType

useDecryptedValue​

Decrypt specific encrypted handles.

Full Documentation

function useDecryptedValue(
  parameters: UseDecryptedValueParameters
): UseDecryptedValueReturnType

Token Hooks​

useTokenBalance​

Read token balances.

Full Documentation

function useTokenBalance(
  parameters: UseTokenBalanceParameters
): UseTokenBalanceReturnType

useTokenTransfer​

Transfer tokens (standard or confidential).

Full Documentation

function useTokenTransfer<TAbi extends Abi = Abi>(
  parameters: UseTokenTransferParameters<TAbi>
): UseTokenTransferReturnType

Utility Hooks​

useOperator​

Manage operator permissions.

Full Documentation

function useOperator(
  parameters: UseOperatorParameters
): UseOperatorReturnType

useBatchTransactions​

Batch multiple transactions.

Full Documentation

function useBatchTransactions(
  parameters: UseBatchTransactionsParameters
): UseBatchTransactionsReturnType

Context Hooks​

useFhevmContext​

Access FHEVM provider context.

function useFhevmContext(): FhevmContextValue

type FhevmContextValue = {
  config: FhevmConfig;
  state: FhevmState;
  instance: FhevmInstance | undefined;
  decryptCache: DecryptCacheStore;
  updateState: (updates: Partial<FhevmState>) => void;
  clearCache: () => void;
};

Example:

import { useFhevmContext } from '@fhevm/sdk';

function MyComponent() {
  const { instance, state, clearCache } = useFhevmContext();

  return (
    <div>
      <div>Chain: {state.chainId}</div>
      <div>Account: {state.account}</div>
      <button onClick={clearCache}>Clear Cache</button>
    </div>
  );
}

useSyncWithWallet​

Sync FHEVM state with wallet.

function useSyncWithWallet(params: {
  chainId?: number;
  address?: string;
  signer?: ethers.Signer;
  provider?: ethers.Provider;
}): void

Example:

import { useSyncWithWallet } from '@fhevm/sdk';
import { useAccount, useWalletClient } from 'wagmi';
import { BrowserProvider } from 'ethers';
import { useMemo } from 'react';

function WalletSync() {
  const { address, chainId } = useAccount();
  const { data: walletClient } = useWalletClient();

  const ethersSigner = useMemo(() => {
    if (!walletClient) return undefined;
    const provider = new BrowserProvider(walletClient);
    return provider.getSigner();
  }, [walletClient]);

  useSyncWithWallet({
    address,
    chainId,
    signer: ethersSigner,
  });

  return null;
}

Lower-Level Hooks​

useFhevm​

Core FHEVM instance management (from react/useFhevm.tsx).

function useFhevm(parameters: {
  provider: string | ethers.Eip1193Provider | undefined;
  chainId: number | undefined;
  enabled?: boolean;
  initialMockChains?: Readonly<Record<number, string>>;
}): {
  instance: FhevmInstance | undefined;
  refresh: () => void;
  error: Error | undefined;
  status: FhevmGoState;
}

useFHEEncryption​

Encryption utilities (from react/useFHEEncryption.ts).

function useFHEEncryption(params: {
  instance: FhevmInstance | undefined;
  ethersSigner: ethers.Signer | undefined;
  contractAddress: `0x${string}` | undefined;
}): {
  canEncrypt: boolean;
  encryptWith: (buildFn: (builder: RelayerEncryptedInput) => void) => Promise<EncryptResult | undefined>;
}

useFHEDecrypt​

Decryption utilities (from react/useFHEDecrypt.ts).

function useFHEDecrypt(params: {
  instance: FhevmInstance | undefined;
  ethersSigner: ethers.Signer | undefined;
  fhevmDecryptionSignatureStorage: GenericStringStorage;
  chainId: number | undefined;
  requests: readonly FHEDecryptRequest[] | undefined;
}): {
  canDecrypt: boolean;
  decrypt: () => void;
  isDecrypting: boolean;
  message: string;
  results: Record<string, string | bigint | boolean>;
  error: string | null;
  setMessage: (message: string) => void;
  setError: (error: string | null) => void;
}

Hook Patterns​

Combining Hooks​

function TokenManager() {
  const { address } = useAccount();

  // Read balance
  const { decryptedData: balance } = useReadContract({
    name: 'token',
    functionName: 'balanceOf',
    args: [address],
    decrypt: true,
  });

  // Transfer hook
  const { transfer, isLoading } = useTokenTransfer({
    name: 'token',
    isConfidential: true,
  });

  return (
    <div>
      <div>Balance: {balance?.toString()}</div>
      <button onClick={() => transfer({ to: '0x...', amount: '100', decimals: 18 })}>
        Transfer
      </button>
    </div>
  );
}

Conditional Execution​

function ConditionalRead({ enabled }: { enabled: boolean }) {
  const { data } = useReadContract({
    name: 'contract',
    functionName: 'getData',
    enabled, // Only fetch when enabled
  });

  return <div>{data}</div>;
}

Error Handling​

function WithErrors() {
  const { data, error, isError } = useReadContract({
    name: 'contract',
    functionName: 'getData',
  });

  if (isError) {
    return <div className="error">{error?.message}</div>;
  }

  return <div>{data}</div>;
}

Next Steps​