Herald Exchange Offramp SDK Widget
npm install herald-exchange-offramp-widget
or
yarn add herald-exchange-offramp-widget
You can install Herald Exchange Offramp SDK Widget via npm
Usage
To use widget in your React application, follow these steps:
To Generate API Key Please Visit Herald Exchange .
Supported Token Types : ["USDT", "USDC", "ETH", "BNB", "POL", "SOL", "TRX"]
Note
-
In development mode, the widget operates on
testnet and runs in a sandbox environment. -
Transactions are simulated based on the fromAmount value:
- 100 → Success
- 200 → Failure
- Any other value → Initiated
- In development mode, when you'll be manually entering a transaction hash, ensure the hash is valid, and that the amount and currency match the transaction. If they don’t, the simulation will fail.
- In production mode, the widget uses **mainnet** to process real transactions.
- ⚠️ Ensure your application is deployed in a **production environment** when going live to enable accurate transaction tracking and wallet interactions.
Props
apiKey string required
- A unique API key generated via the Herald Exchange App
- This key is used to authenticate and authorize the widget.
- Example: 4bb06e2fdbfb8e392a0ab49e4d9819ae072dcef82d79af7893625a5ff1416f
mode string Optional
- Allowed Values: development | production
- Default: "development"
-
Description: Specifies the environment in which the widget runs.
- development is used for testing and debugging purposes.
- production should be used in live environments for optimized performance.
clientReferenceID string required
- A unique identifier (UUID) generated via the Herald Exchange App , used to associate a transaction with a specific user or session.
- Helps track user activity and transaction flow.
- Example: 34edd6d6-eb12-422f-bd0e-63c5733527
sellParameters string required
- Defines the default configuration for the sell flow.
- from_amount: A string representing the default amount to sell (e.g., "25").
- from_currency: The token the user wants to sell (e.g., "USDT").
- to_currency: The currency the user wants to receive (e.g., "USD").
- ⚠️ If the selected currencies are not available or not active, the widget will default to the first available currency pair.