> ## Documentation Index
> Fetch the complete documentation index at: https://www.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Funding

> The React SDK opened funding, on-ramp, and exchange screens from hooks like useFundWithWallet and useOnramp. In the JavaScript SDK each funding path is a function (and hook), and you build the menu that routes between them.

The React SDK bundled funding behind a set of hooks (`useFundWithWallet`, `useOnramp`, `useExchangeAccounts`, `useOpenFundingOptions`, `usePayWithDynamic`) that opened the widget's funding modals. The JavaScript SDK exposes each funding path — wallet transfer, on-ramp providers, and exchange transfers — as its own function (with a matching React hook), and leaves the "how do you want to add funds?" menu to you.

The on-ramp provider surfaces (MoonPay, Coinbase) are the same build in any JavaScript SDK app: [**Funding flows** (Building UI)](/docs/javascript/building-ui/funding-flows) covers them with full code. This page is the React→JavaScript translation across every funding path plus what the widget's funding menu did for you.

## Transfer from a connected wallet

| React SDK             | JavaScript SDK                             |
| --------------------- | ------------------------------------------ |
| `useFundWithWallet()` | `transferAmount()` / `useTransferAmount()` |

`transferAmount()` sends native currency or a token from a specific `walletAccount` (from `getWalletAccounts()`) to a recipient and resolves with the `transactionHash`. Omit `token` for the native asset; for an ERC-20 include its `{ address, decimals }`.

## On-ramps (buy crypto)

`useOnramp` becomes one function per provider — build the URL (or order), open it, then reconcile the result in your UI. The MoonPay and Coinbase surfaces are built in [Funding flows (Building UI)](/docs/javascript/building-ui/funding-flows).

| React SDK (`useOnramp`) | JavaScript SDK                                                                                |
| ----------------------- | --------------------------------------------------------------------------------------------- |
| MoonPay                 | `getMoonPayUrl()` / `useGetMoonPayUrl()`, `getMoonPayCurrencies()`                            |
| Coinbase                | `getCoinbaseBuyUrl()`, `createCoinbaseOnrampOrder()`, `addCoinbaseOnrampOrderEventListener()` |
| Crypto.com              | `createCryptoDotComPayment()` / `useCreateCryptoDotComPayment()`                              |

For Coinbase, `createCoinbaseOnrampOrder()` starts an order and `addCoinbaseOnrampOrderEventListener()` reports its progress; `getMissingVerificationForCoinbaseOnrampOrder()` tells you what identity step (if any) the user still needs.

## Exchange transfers

`useExchangeAccounts` becomes the Kraken functions — read the user's accounts, resolve where funds can go, and start a transfer. See the [Kraken integration reference](/docs/javascript/reference/client/kraken-integration) for each function's parameters and return shape.

| React SDK               | JavaScript SDK                                                           |
| ----------------------- | ------------------------------------------------------------------------ |
| `useExchangeAccounts()` | `getKrakenAccounts()` / `useGetKrakenAccounts()`                         |
| whitelisted addresses   | `getKrakenWhitelistedAddresses()` / `useGetKrakenWhitelistedAddresses()` |
| start a transfer        | `createKrakenExchangeTransfer()` / `useCreateKrakenExchangeTransfer()`   |

## The funding menu (what the widget did for you)

`useOpenFundingOptions` and `usePayWithDynamic` opened the widget's funding chooser. There is no modal to open now — and no runtime API that reports which funding methods are enabled, so decide which paths to offer based on what you've configured in your Dynamic dashboard, render your own "add funds" menu, and route each choice to the function above. For a pay/checkout experience, compose the deposit flow described in [Building for Flow](/docs/javascript/building-ui/building-for-flow). Concretely, you now own:

* **The "add funds" menu** — the chooser that offered wallet transfer, on-ramp, and exchange.
* **Provider surfaces** — where you open the on-ramp URL (tab, popup, or embedded frame) and how you reconcile the result.
* **Transfer forms** — amount, token, and recipient inputs feeding `transferAmount()`.
* **Progress & receipts** — the confirmation UI once a transfer or order completes.

## Errors you now own

| Situation                         | What to do                                                                                       |
| --------------------------------- | ------------------------------------------------------------------------------------------------ |
| `transferAmount` rejects          | Nothing was sent — surface the failure and let the user retry with the same inputs.              |
| On-ramp URL build fails           | The provider or currency isn't available — hide that option or show why it's unavailable.        |
| Coinbase order needs verification | Use `getMissingVerificationForCoinbaseOnrampOrder()` to prompt for the missing identity step.    |
| Exchange transfer rejects         | Check the destination is whitelisted (`getKrakenWhitelistedAddresses()`) and surface the reason. |

## See also

* [Funding flows (Building UI)](/docs/javascript/building-ui/funding-flows) — build the full add-funds menu and provider surfaces
* [Connecting external wallets (Building UI)](/docs/javascript/building-ui/connecting-external-wallets) — add a wallet to fund from
* [Building for Flow (Building UI)](/docs/javascript/building-ui/building-for-flow) — deposit and checkout flows
* [Using connected wallets](/docs/javascript/migrating-from-react/using-connected-wallets) — pick the wallet to transfer from