Drop-in UI
The RecoilPay app's intent experience, packaged for your product. Your user types what they want, like swap 10 USDC on Base Sepolia for USDC on OP Sepolia, sees the best solver quote, confirms in their wallet, and watches it settle. You don't build the parser, the quote card, the Permit2 approval, the signing or the order tracking.
All three packages are published under the @recoilpay organization: @recoilpay/intent-widget, @recoilpay/intent-react and @recoilpay/intent-core. They're released together and always share one version number.
Pick one
| You add | You build | Best for | |
|---|---|---|---|
| Widget | One <script> tag and one <recoilpay-intent> element | Nothing. Wallet connection is included | Any website: plain HTML, WordPress, Webflow, Vue, Angular |
| React component | <RecoilIntent /> | Wallet connection: pass in the one your app already has | React and Next.js apps, especially with wagmi or RainbowKit |
| Headless SDK | createIntentSession() | All of the UI | Custom designs, other frameworks, bots and agents |
They're layers of the same code: the widget is built on the React component, which is built on the SDK. Choosing one doesn't lock you out of the others.
What your users get
- They type an intent in plain English, or click an example. A language model on Hugging Face, called with your token, turns it into a structured intent.
- It's checked against live solver coverage. Anything unsupported, unknown or missing is listed at once so the user can fix it in one edit.
- Solvers race to quote. The best quote is shown as you pay → you receive, with an ETA and how many solvers answered.
- They confirm. Their wallet switches to the right chain, approves Permit2 once for that token, and signs the order. Signatures cost no gas.
- They watch it settle, step by step, ending with a block-explorer link to the fill.
Same-chain sends skip the solvers and go straight from the user's wallet. Sentences with several intents, such as "swap … then send …", run one after another.
The same field also cashes out to a bank account and buys crypto with a bank transfer, in naira. The components collect bank details privately, run the one-time identity check a purchase needs, and follow the trade to the end. See Fiat ramps.
What stays true
- Non-custodial. Funds only move on your user's signature. Neither RecoilPay nor your page ever holds them.
- No API key. The components call the same public API as everything else in this section. Partner keys, when they arrive, will be additive. See Going to production.
- Your credentials, not ours. The packages carry no RecoilPay secrets. Plain-English parsing uses your own Hugging Face token, and mobile wallets use your own WalletConnect project id.
- Testnets today. Base Sepolia, OP Sepolia, Ethereum Sepolia, Polygon Amoy and BNB Chain Testnet, with mock tokens. See Supported networks.
Bring your own Hugging Face token
Plain-English parsing runs in your user's browser: the components send what the user typed to a language model on Hugging Face, using an access token you supply (hf-access-token on the widget, hfAccessToken in React and the SDK).
Because the token ships in your page, anyone can read it. Set it up so that doesn't matter:
- Create a fine-grained token at huggingface.co/settings/tokens with only "Make calls to Inference Providers". It can't read or write anything else on your account.
- Use it only for this, so you can rotate it without touching anything else.
- Watch its usage in your Hugging Face billing settings, and rotate it if someone else starts spending it.
Without a token, everything else still works, but typed sentences aren't parsed. Users see an example sentence instead.
→ Embed the widget is the fastest way to see it working. To build a whole page around it, follow the tutorial Build a landing page with the widget.