ConnectButton_detailsButtonOptions
Options for configuring the ConnectButton
's Details Button
type ConnectButton_detailsButtonOptions = { className?: string; connectedAccountAvatarUrl?: string; connectedAccountName?: React.ReactNode; displayBalanceToken?: Record<number, string>; render?: () => JSX.Element; style?: React.CSSProperties;};
CSS class to apply to the details button element
type className = string;
Use custom avatar URL for the connected wallet image in the ConnectButton
details button, overriding ENS avatar or Blobbie icon.
type connectedAccountAvatarUrl = string;
Render custom UI for the connected wallet name in the ConnectButton
details button, overriding ENS name or wallet address.
type connectedAccountName = React.ReactNode;
Display the balance of a token instead of the native token in ConnectButton
details button.
type displayBalanceToken = Record<number, string>;
<ConnectButton detailsButton={{ displayBalanceToken:{ // show USDC balance when connected to Ethereum mainnet or Polygon [ethereum.id]: "0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599", [polygon.id]: "0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359", } })/>
CSS styles to apply to the details button element
type style = React.CSSProperties;