Herald Exchange Onramp SDK Widget
npm install herald-exchange-onramp-widget
or
yarn add herald-exchange-onramp-widget
You can install Herald Exchange Onramp 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
- ⚠️ 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
redirectUrl string required
- The URL to which the user will be redirected **after completing the transaction**.
- A **callback** will be made to this URL along with the **transaction result or status** as query parameters or payload (depending on the integration).
- Example: https://yourapp.com/transaction-complete
buyParameters string required
- Defines the default configuration for the buy flow.
- from_amount: A string representing the default amount to be displayed in the input field (e.g., "25").
- token_type: The token that should be selected by default for purchase (e.g., "USDC").
- ⚠️ If the passed token_type is not active, the widget will automatically fall back to the first activated token.