0G Pay SDK

React SDK for accepting deposits on the 0G network via the TokenFlight widget.

Installation

npm install @0gfoundation/0g-pay-sdk

Peer Dependencies

npm install react react-dom

Usage

Basic — drop-in deposit button

Renders a Deposit button that opens the deposit modal on click.

import { OGPay } from '@0gfoundation/0g-pay-sdk';

export function App() {
  // EIP-1193 provider — e.g. window.ethereum, or from wagmi / viem
  const provider = window.ethereum;

  return <OGPay provider={provider} />;
}

Custom trigger element

Pass any element as children to replace the default button.

<OGPay provider={provider}>
  <button className="my-button">Fund Account</button>
</OGPay>

Pre-fill amount and lock token

<OGPay
  provider={provider}
  outputAmount="100"
  lockFromToken={true}
/>

Custom logo in the modal header

<OGPay provider={provider} logo={<img src="/logo.svg" height={24} />} />

Success / error callbacks

<OGPay
  provider={provider}
  onSuccess={(data) => console.log('tx:', data.txHash)}
  onError={(data) => console.error('error:', data.message)}
/>

API Reference

<OGPay>

| Prop | Type | Default | Description | |---|---|---|---| | provider | EIP1193Provider | — | Required. EIP-1193 wallet provider | | children | ReactNode | <button>Deposit</button> | Custom trigger element | | methods | string[] | ['crypto', 'card'] | Payment methods to display | | outputAmount | string | — | Pre-fill the output amount | | lockFromToken | boolean | false | Lock the source token to the native token | | tradeType | string | 'EXACT_INPUT' | Trade type passed to the widget | | logo | ReactNode | 0G logo | Custom logo in the modal header | | onSuccess | (data) => void | — | Called when the deposit completes successfully | | onError | (data) => void | — | Called when the deposit fails |

EIP1193Provider

interface EIP1193Provider {
  request: (args: { method: string; params?: unknown[] }) => Promise<unknown>;
}

Compatible with window.ethereum, wagmi's useWalletClient, and any EIP-1193 provider.

TypeScript

The package ships with full type definitions. Import types directly:

import type { OGPayProps, EIP1193Provider } from '@0gfoundation/0g-pay-sdk';

License

MIT © 0G Labs