Appearance
CoinbaseProvider
Owns Coinbase withdraw selection state (token, network, funding tokens, dual crypto/fiat amount) and shared fetched data for the React hooks.
When to use
Wrap the Coinbase withdraw UI under SwappedConnectProvider. Selection hooks (useCoinbaseToken, useCoinbaseNetwork, useCoinbaseAmount, …) and startWithdrawal() require this provider.
Example
tsx
import { createSwappedConnectClient } from '@swapped/connect-sdk'
import {
CoinbaseProvider,
SwappedConnectProvider,
} from '@swapped/connect-sdk/react'
const client = createSwappedConnectClient({
sessionId: 'your-session-id',
})
void client.loadSession()
function App() {
return (
<SwappedConnectProvider client={client}>
<CoinbaseProvider>
<WithdrawScreen />
</CoinbaseProvider>
</SwappedConnectProvider>
)
}Props
| Prop | Default | Purpose |
|---|---|---|
enabled | true | Skip balance fetch when false |
onlySupported | false | Filter unsupported tokens from useCoinbaseBalances().balances |
onlyAboveMin | false | Filter below-min balances from balances |
defaultCurrency | — | Preferred initial token |
defaultNetwork | — | Preferred initial network |
autoSelectToken | true | Auto-select the first eligible balance |
autoSelectNetwork | true | true / false / 'only-one' — auto-select network always, never, or only when exactly one active network is available |
resetAmountOnTokenChange | false | Clear amount / touched when the token changes |
maxAmountMode | 'balance' | Which max ceiling blocks submit / Max — see below |
clampToMax | false | Hard-clamp typed amounts to the blocking ceiling |
maxDecimals | getTokenDisplayDecimals | (token) => number override for crypto amount input precision |
Changing the selected token always clears the network selection.
When resetAmountOnTokenChange is false (default), the fiat amount is preserved across token changes and crypto is recomputed from the new token’s exchange rate. If the new token has no rate, crypto is kept and fiat is cleared. Set resetAmountOnTokenChange to true to clear both amounts instead.
Amount typing is capped to the token’s display decimals by default (USDC → 2, ETH → 6, …). Override per token:
tsx
<CoinbaseProvider maxDecimals={token => (token === 'ETH' ? 8 : 2)}>maxAmountMode
There are two ceilings on a Coinbase withdrawal:
- Hard — raw aggregated balance (
above_balance) - Soft — balance minus the $1.50 fee reserve (
above_spendable)
| Mode | Max button | above_spendable | Typical use |
|---|---|---|---|
'balance' (default) | Sets raw balance | Non-blocking warning; submit auto-caps via onAmountAdjusted | Widget-style flow |
'spendable' | Sets spendable max | Blocking error | Strict Max = spendable |
tsx
{/* Widget flow (default) */}
<CoinbaseProvider>
{/* Strict spendable Max */}
<CoinbaseProvider maxAmountMode="spendable">With clampToMax, typing above the blocking ceiling snaps on both sides (balance in 'balance' mode, spendable otherwise):
tsx
<CoinbaseProvider clampToMax>Related hooks
| Hook | Role |
|---|---|
| useCoinbaseBalances | Balance list data |
| useCoinbaseToken | Selected token |
| useCoinbaseFundingTokens | Funding selection |
| useCoinbaseNetwork | Networks + selected network |
| useCoinbaseAmount | Dual crypto/fiat amount + limits |
| useCoinbaseSelection | Full selection snapshot |
| useCoinbaseWithdrawal | startWithdrawal() from context |
Errors
| Code | When |
|---|---|
REACT_COINBASE_PROVIDER_REQUIRED | A selection/data hook is used outside CoinbaseProvider |
See Errors.