Quick start

What you need, and how to mount the widget.

What you need

A page address for pageUrl: a deployment of this page that allows your site's origin. Until it does, the frame stays empty.
A wallet your site already connects. Wallet shows a one-line adapter for each common library.
The SDK. @tokenflight/widget is not on npm yet. It lives in packages/sdk of this repository: use it as a workspace package, or build it with pnpm --filter @tokenflight/widget build (output in dist).

1. Mount it

import { TokenFlightWidget } from "@tokenflight/widget";

const widget = new TokenFlightWidget({
  pageUrl: "https://fly.tokenflight.ai", // the page address you use
  walletAdapter, // your site's wallet, see Wallet
  container: "#convert", // an element or a selector
}).initialize();

That is a working widget. The user picks the tokens and the amount.

2. Optional: start from a pair

ts, inside the options

config: {
  fromToken: "eip155:8453:0x833589fcd6edb6e08f4c7c32d4f71b54bda02913",
  toToken: "eip155:42161:0xaf88d065e77c8cc2239327c5edb3a432268e5831",
  amount: "10",
}

3. Optional: hear about orders

widget.on("orderCreated", ({ orderId }) => save(orderId));
widget.on("orderCompleted", ({ orderId, outcome }) => console.log(orderId, outcome));