Skip to main content
Every Flow connection and payment needs an interface on the user’s side, where they connect a wallet or choose how to pay. You can send users to a page Dynamic hosts, drop prebuilt React components into your own app, or build every screen yourself.

​
The options

The hosted pages need the least work, and the user leaves your app to use them. The prebuilt components keep the user in your app with little UI work, and you can restyle them to match it. Your own screens give you full control over every step.

​
Prebuilt React components

The @dynamic-labs-sdk/react-ui package provides ready-made widgets for React web apps that use the JavaScript SDK:
  • Connect wallet widget. The user chooses a wallet from a searchable list and connects it, including chain choice, QR pairing for mobile wallets, and error recovery. Your app receives the connected wallet and decides whether to verify it.
  • Flow payment widget. Given the ID of a flow your server created, the widget runs the whole payment: the payer chooses to pay from a wallet, through an exchange, or to a deposit address, and the widget shows the progress and the outcome. Single-method versions are available for pages that offer only one way to pay.
The widgets read the flow’s state, so a payer who reloads the page returns to where they were. They report the outcome to your page, while your server still decides fulfillment from webhooks. You can change their text and styles, and they ship with a light theme only. The components run on the web only, not in React Native. For the details, see React UI components, the connect wallet widget, and the Flow payment widget.

​
Your own screens

When you need screens the components do not provide, such as a cancel control or amount entry in deposit mode, build the interface on an SDK or the API. The SDK gives you the same steps the widgets use: attach a source, get a quote, send the payment, and read the flow until it finishes.

JavaScript SDK

Build a custom payment UI for the web or React Native.

Flutter SDK

Complete a Flow payment from a Flutter app.

API guide

The HTTP requests behind each step.

Payment lifecycle and states

What each state means and which screen to show.
Last modified on November 5, 2026