@furlpay/elements

Embeddable Furlpay UI widgets for React — drop-in stablecoin checkout and secure card credential display.

Install

npm install @furlpay/elements

Peer dependencies: react >= 18, react-dom >= 18.

<FurlpayCheckoutButton />

A drop-in checkout button that handles wallet connection and stablecoin transaction signing. You render it and listen for onSuccess — no chain logic in your app.

import { FurlpayCheckoutButton } from "@furlpay/elements";

<FurlpayCheckoutButton
  amount={25}
  token="USDC"                       // "USDC" | "USDT" | "EURC" | "PYUSD"
  publishableKey={process.env.NEXT_PUBLIC_FURLPAY_PK!}
  onSuccess={({ transactionHash, amount }) => markPaid(transactionHash)}
  onError={(err) => toast.error(err.message)}
  label="Pay $25"                    // optional custom label
/>

| Prop | Type | Notes | | --- | --- | --- | | amount | number | required | | publishableKey | string | required — pk_..., safe for the browser | | token | "USDC" \| "USDT" \| "EURC" \| "PYUSD" | default "USDC" | | currency | string | default "USD" | | onSuccess | ({ transactionHash, amount }) => void | fires after a signed, settled payment | | onError | (err: Error) => void | | | baseUrl | string | default https://api.furlpay.app | | label | string | custom button text |

<FurlpaySecureCardInput />

Securely display virtual card credentials (PAN/CVV) without them ever entering your application state.

Server-side pairing

Elements handles the client; verify and fulfil on the server with @furlpay/furlpay-node webhooks. A complete Next.js App Router flow (button → route handler → verified webhook) is in furlpay-examples/nextjs-checkout.

Security

Publishable keys (pk_...) are browser-safe; never ship secret keys (sk_...) to the client. Report vulnerabilities to [email protected].

License

MIT