React Native

DaimoFrameRN renders the hosted Daimo deposit, withdraw, or transfer flow inside a react-native-webview, covering chain selection, wallet connection, signing, and status updates.

If you’re not using React Native, see Native WebView to embed the same flow with a raw iOS WKWebView, Android WebView, or a plain react-native-webview.

Install

npm install @daimo/sdk react-native-webview

react-native-webview is a peer dependency. @daimo/sdk/native imports nothing from the web build, so no react-dom or wallet libraries are pulled in. Create a session on your server (see Quickstart), pass its sessionId and clientSecret to the client, then render DaimoFrameRN:

import { DaimoFrameRN } from "@daimo/sdk/native";

function DepositButton({ sessionId, clientSecret }) {
  const [open, setOpen] = useState(false);

  return (
    <>
      <Button title="Deposit" onPress={() => setOpen(true)} />
      {open && (
        <DaimoFrameRN
          layout="modal"
          sessionId={sessionId}
          clientSecret={clientSecret}
          onClose={() => setOpen(false)}
        />
      )}
    </>
  );
}

The modal layout (default) presents the flow in a dimmed bottom sheet and sizes itself to the content; you never manage its height. It has a close button; tapping the dimmed backdrop does not dismiss it (too easy to hit by accident), and Android hardware back does.

Don’t close the sheet from onPaymentCompleted. The flow shows a completed screen (a checkmark), which also appears when you open an already-finished session, so let the user dismiss it via the close button (onClose).

Embed layout

Use layout="embed" to render the flow inline inside your own screen or sheet. It fills its container’s width and follows the content height; you own the surrounding chrome, dismissal, and keyboard avoidance. Wrap it in a KeyboardAvoidingView if it sits near the bottom of the screen. The modal layout handles the keyboard for you.

<DaimoFrameRN
  layout="embed"
  sessionId={sessionId}
  clientSecret={clientSecret}
/>

Deeplink schemes

Some payment methods run outside the WebView: Apple Pay and bank redirects open the system browser, and wallet deposits open a wallet app. DaimoFrameRN hands these off with Linking.openURL. HTTPS and universal links work with no setup. To open wallet apps that use custom URL schemes, and to let Linking.canOpenURL detect them, declare those schemes.

This is what keeps Apple Pay working with no host-app certification: it runs in the system browser under Daimo’s merchant identity, never your app’s.

Expo
Bare (Info.plist)

Add the schemes to app.json (or app.config.js). Expo writes them into the native project on prebuild:

{
  "expo": {
    "ios": {
      "infoPlist": {
        "LSApplicationQueriesSchemes": [
          "metamask",
          "trust",
          "rainbow",
          "tronlink"
        ]
      }
    }
  }
}

On Android 11+, apps you deeplink to must be listed in a <queries> element; add it with expo-build-properties or a small config plugin.

Add the schemes to ios/<YourApp>/Info.plist:

<key>LSApplicationQueriesSchemes</key>
<array>
  <string>metamask</string>
  <string>trust</string>
  <string>rainbow</string>
  <string>tronlink</string>
</array>

On Android 11+, add a matching <queries> element to android/app/src/main/AndroidManifest.xml for the wallet apps you support.

Declare only the wallets you support. Universal (https) links, whether to wallets or to daimo.com itself, need no entry. For an in-app Safari sheet instead of the full system browser, pass expo-web-browser’s openBrowserAsync as onOpenExternalUrl.

Props

Prop	Type	Default	Description
`sessionId`	`string`	-	Session ID, created server-side. (required)
`clientSecret`	`string`	-	Client secret, returned at session creation. (required)
`layout`	`"modal" \| "embed"`	`"modal"`	Daimo-owned bottom sheet, or inline in your UI.
`onClose`	`() => void`	-	Called when the user dismisses the flow.
`onPaymentStarted`	`() => void`	-	User’s deposit transaction was detected.
`onPaymentCompleted`	`() => void`	-	Funds delivered to the destination.
`onOpenExternalUrl`	`(url: string) => void`	`Linking.openURL`	Override how Apple Pay / wallet / fiat links leave the WebView.
`borderRadius`	`number`	`42`	Corner radius of the modal sheet, in points.
`baseUrl`	`string`	`https://daimo.com`	Hosted flow origin. Override only for staging.

Tracking status

onPaymentStarted and onPaymentCompleted are notifications only. To get full session details (tx hash, chain, amounts), poll GET /v1/sessions/{sessionId} after a payment event.

Getting Started

Accept Deposits

Withdrawals

Advanced

Resources

React Native

Install

Embed layout

Deeplink schemes

Props

Tracking status

​Install

​Modal layout

​Embed layout

​Deeplink schemes

​Props

​Tracking status

Install

Modal layout

Embed layout

Deeplink schemes

Props

Tracking status