🖥
For Developers
Do you wish to integrate HQ Multisend with your application? Our HQ Javascript Toolkit allows you to do so easily.
HQ Multisend allows you to quickly distribute funds to multiple recipients. Using our HQ Javascript Toolkit, you can embed a button into your website that provides a link to pre-fill the HQ Multisend form with a list of recipient wallets and corresponding token amounts.
Javascript
ReactJs
<script src="./hq-0.1.3.min.js"></script>
Initialise the HQ Javascript Toolkit by calling the
init function. The parameters name, url and logoUrl are required.window.addEventListener('DOMContentLoaded', function () {
hq.init({
name: 'My Web Project',
url: 'https://mywebproject.com',
logoUrl: 'https://mywebproject.com/img/logo.svg'
})
})
Import the latest version of HQ Multisend with React using the following command.
npm install hq-toolkit
Javascript
ReactJs
The
multisend function expects a DOM element id as elem which the button will be rendered in. A purpose will describe the transaction and recipients is an array containing objects with the details of each recipient. An optional label text can be passed to change the button label. Calling the function multiple times will update the parameters.hq.multisend({
elem: 'multisend',
purpose: 'Distribute funds',
label: 'Send transaction with HQ Multisend',
recipients: [{
address: '0xcEe6FeBe294D5591ed3ec94EBfcE35067cBA901F',
token: 'USDC',
amount: 0.01,
remarks: 'Remarks'
}]
})
Import and make a variable available for use in your React component that holds the following configuration:
import { Multisend } from 'hq-toolkit'
const hq_config = {
name: 'My Web Project',
url: 'https://mywebproject.com',
logoUrl: 'https://mywebproject.com/img/logo.svg'
}
In your React function, use the Multisend component in the following way and pass the
recipients array, the transfer purpose, and the optional button label.<Multisend
config={hq_config}
purpose='Distribute funds'
label='Send transaction with HQ Multisend'
recipients={[{
address: '0xcEe6FeBe294D5591ed3ec94EBfcE35067cBA901F',
token: 'USDC',
amount: 0.01,
remarks: 'Remarks'
}]}
/>
Check out our latest version of this toolkit here:
Last modified 1mo ago