@stridge/kit

React widgets and headless hooks for the Stridge Gateway — drop-in deposit and withdraw flows for crypto apps.

Links  ·  Website  ·  Documentation  ·  Live demo

Install

pnpm add @stridge/kit

Peer dependencies: react, react-dom, viem. wagmi is optional — required only when you enable the deposit/wallet method (the customer signs the source-chain transfer from their connected wallet). Withdraw and deposit/transfer-crypto work without wagmi.

Quick start

import { StridgeProvider } from "@stridge/kit";
import { DepositDialog } from "@stridge/kit/deposit/dialog";
import { WithdrawDialog } from "@stridge/kit/withdraw/dialog";

<StridgeProvider
    gatewayKey={process.env.NEXT_PUBLIC_STRIDGE_GATEWAY_KEY!}
    // `networkId` is the Stridge network id, listed at
    // https://api.stridge.com/v1/uda/supported-assets — "9006" is BSC.
    asset={{ networkId: "9006", symbol: "USDC" }}
    flows={{
        deposit: {
            // Required — where bridged funds settle (your treasury, or the customer's wallet
            // under a same-owner-only gateway-kit configuration).
            destination: { address: customerAddress },
            // Optional — `gateway/start.owner` for deposit UDAs. Falls back to the connected
            // wagmi wallet when omitted.
            owner: { address: customerAddress },
        },
        withdraw: {
            // Required — `gateway/start.owner` for withdraw UDAs. The kit scopes settlement
            // polls against this address.
            owner: { address: customerAddress },
        },
    }}
    appearance={{ theme: "dark", accent: "oklch(78% 0.15 240)", radius: "rounded" }}
>
    <YourApp />
    <DepositDialog />
    <WithdrawDialog balance={liveBalance} onSubmit={handleWithdrawSubmit} />
</StridgeProvider>;

Open or close the dialogs with useDeposit().open() / useWithdraw().open(). Headless integrators render their own UI via useDeposit(), useDepositState(), useDepositSnapshot() and the withdraw mirrors — the root entry ships no UI, so the headless bundle stays clean. useOptionalDeposit() / useOptionalWithdraw() return null when called outside the provider, for hosts that mount <StridgeProvider /> conditionally (e.g. only after a wallet is connected).

Documentation

Full setup, configuration, and integration patterns at docs.stridge.com. A working integration runs at demo.stridge.com.

License

MIT © Stridge Foundation.