@vechain/dapp-kit-ui
- An extension of
@vechain/connex
to containing UI components to simplify wallet connection and interaction - Please refer to the official documentation here
Installation
Build Locally
yarn build
Usage
Optional: Wallet Connection Options
import type { WalletConnectOptions } from '@vechain/dapp-kit';
const walletConnectOptions: WalletConnectOptions = {
projectId: '<PROJECT_ID>',
metadata: {
name: 'My dApp',
description: 'My dApp description',
url: window.location.origin,
icons: [`${window.location.origin}/images/my-dapp-icon.png`],
},
};
import type { WalletConnectOptions, DAppKitOptions } from '@vechain/dapp-kit';
import { DAppKitUI } from '@vechain/dapp-kit-ui';
const walletConnectOptions: WalletConnectOptions = {
projectId: '<PROJECT_ID>',
metadata: {
name: 'Sample VeChain dApp',
description: 'A sample VeChain dApp',
url: window.location.origin,
icons: [`${window.location.origin}/images/logo/my-dapp.png`],
},
};
const options: DAppKitOptions = {
nodeUrl: 'https://testnet.vechain.org/',
genesis: 'test',
walletConnectOptions,
usePersistence: true,
};
DAppKitUI.configure(options);
- Add the following HTML. This will add a button to your page, when clicked it will open a modal with the wallet
connect QR code:
<body>
<vwk-connect-button-with-modal mode="DARK"></vwk-connect-button-with-modal>
</body>