https://github.com/paritytech/polkadot-onboard
A wallet integration SDK to facilitate adding different type of wallets (extension, WC, Ledger) to Dapps.
https://github.com/paritytech/polkadot-onboard
Last synced: about 1 year ago
JSON representation
A wallet integration SDK to facilitate adding different type of wallets (extension, WC, Ledger) to Dapps.
- Host: GitHub
- URL: https://github.com/paritytech/polkadot-onboard
- Owner: paritytech
- License: apache-2.0
- Created: 2022-08-18T20:26:07.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2024-10-10T10:02:51.000Z (over 1 year ago)
- Last Synced: 2025-03-30T18:09:13.410Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://paritytech.github.io/polkadot-onboard
- Size: 3.28 MB
- Stars: 28
- Watchers: 5
- Forks: 15
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
⚠️ ⚠️**This repository has been discontinued and it is no longer maintained by any team** ⚠️ ⚠️
# @polkadot-onboard
_@polkadot-onboard_ provides a set of packages for developers to easily onboard and add different type of polkadot wallets to their dapps. It provides a universal interface for working with different type of wallets (e.g. Injected-wallets, Wallet-Connect, hardware-wallets).
## install the packages:
```ts
// npm
npm install \
@polkadot-onboard/core\
@polkadot-onboard/injected-wallets\
@polkadot-onboard/wallet-connect\
@polkadot-onboard/react
// yarn
yarn add \
@polkadot-onboard/core\
@polkadot-onboard/injected-wallets\
@polkadot-onboard/wallet-connect\
@polkadot-onboard/react
```
## example for using it in a react-app:
```ts
import { WalletAggregator } from '@polkadot-onboard/core';
import { InjectedWalletProvider } from '@polkadot-onboard/injected-wallets';
import { WalletConnectProvider } from '@polkadot-onboard/wallet-connect';
import { PolkadotWalletsContextProvider, useWallets } from '@polkadot-onboard/react';
const APP_NAME = 'Polkadot wallets example';
const ConnectContainer = () => {
let walletConnectParams = {
projectId: '4fae...',
relayUrl: 'wss://relay.walletconnect.com',
metadata: {
name: 'Polkadot Demo',
description: 'Polkadot Demo',
url: '#',
icons: ['https://walletconnect.com/walletconnect-logo.png'],
},
};
let walletAggregator = new WalletAggregator([
new InjectedWalletProvider({}, APP_NAME),
new WalletConnectProvider(walletConnectParams, APP_NAME)
]);
return (
/*
all wallets are available inside this context to all children.
const { wallets } = useWallets();
each wallet provides a universal interface including a signer that can be used to sign messages and transactions:
interface BaseWallet {
...
signer: Signer | undefined; // signer is available after connect() is called.
connect: () => Promise;
disconnect: () => Promise;
isConnected: () => boolean;
getAccounts: () => Promise;
...
}
*/
);
```
check the full examples:
- [headless](examples/react-headless/)
- [react-next](examples/react-next)
For wallet-connect you need a mobile apps that supports wallet-connect.
[wallet-connect demo video](https://www.youtube.com/watch?v=5YkYi5HWeJQ)