The usePayWithDynamic hook provides a unified payment flow that lets users fund transactions using any supported Dynamic method—whether through an external wallet, exchange account, or onramp provider.It accepts a PayWithDynamicProps object (destination address, token symbol, amount, network, and chain name), then renders a contextual UI prompting the user to choose their preferred payment source. After the user selects a method, the hook orchestrates the transaction through their desired funding method. Note that each funding method must be enabled and configured for it to appear as a funding option. See each individual funding method for more details:
  1. External Wallet
  2. Exchange
  3. Onramp
Inputs:
ParameterTypeDescription
destinationAddressstringWhere the transfer should go to
tokenAmountnumberThe amount of the given token to be transfered
tokenSymbolstringThe token to be transfered
networkstring or numberThe network ID to be used on the transaction
chainNameChainEnumThe chain to be used for the transaction
Example:
import { usePayWithDynamic, ChainEnum } from "@dynamic-labs/sdk-react-core";

const pay = usePayWithDynamic();

await pay({
  destinationAddress: '0x123',
  tokenAmount: 5,
  tokenSymbol: 'ETH',
  network: 1,
  chainName: ChainEnum.EVM,
});

Unified View

This view will allow the user to select their desired funding method: An external wallet, exchange, or onramp
Unified View

Error States

Error will states will be displayed on the UI informing a user of why a transaction failed. Example Error Screens:
Unified View
Unified View
Unified View