@hashgraph/hedera-wallet-connect 1.0.6 → 1.2.0
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +120 -0
- package/dist/browser-cjs-metafile.json +1 -1
- package/dist/browser-cjs.js +11 -1
- package/dist/browser-esm-metafile.json +1 -1
- package/dist/browser-esm.js +11 -1
- package/dist/node-cjs-metafile.json +1 -1
- package/dist/node-cjs.js +142 -131
- package/dist/node-esm-metafile.json +1 -1
- package/dist/node-esm.js +142 -131
- package/dist/types/src/lib/dapp/DAppSigner.d.ts +8 -1
- package/dist/types/src/lib/dapp/DAppSigner.d.ts.map +1 -1
- package/dist/types/src/lib/dapp/index.d.ts +18 -9
- package/dist/types/src/lib/dapp/index.d.ts.map +1 -1
- package/dist/types/src/lib/shared/extensionController.d.ts +18 -0
- package/dist/types/src/lib/shared/extensionController.d.ts.map +1 -0
- package/dist/types/src/lib/shared/index.d.ts +1 -0
- package/dist/types/src/lib/shared/index.d.ts.map +1 -1
- package/dist/types/src/lib/shared/utils.d.ts +12 -0
- package/dist/types/src/lib/shared/utils.d.ts.map +1 -1
- package/dist/types/src/lib/wallet/index.d.ts.map +1 -1
- package/dist/types/src/lib/wallet/provider.d.ts +1 -1
- package/dist/types/test/_helpers.d.ts +7 -3
- package/dist/types/test/_helpers.d.ts.map +1 -1
- package/dist/types/test/dapp/DAppSigner.test.d.ts +2 -0
- package/dist/types/test/dapp/DAppSigner.test.d.ts.map +1 -0
- package/package.json +9 -3
package/README.md
CHANGED
@@ -65,6 +65,65 @@ reference the [WalletConnect documentation](https://docs.walletconnect.com/2.0/)
|
|
65
65
|
Upon successfully configuring your dApp and/or wallet to manage WalletConnect sessions, you can
|
66
66
|
use this library’s functions to easily create and handle requests for the Hedera network.
|
67
67
|
|
68
|
+
### DApps
|
69
|
+
|
70
|
+
#### Signer
|
71
|
+
|
72
|
+
This library provides a `DAppSigner` class that implements the `@hashgraph/sdk`'s `Signer`
|
73
|
+
interface. You may use the `DAppSigner` class to sign and execute transactions on the Hedera
|
74
|
+
network.
|
75
|
+
|
76
|
+
##### Get Signer
|
77
|
+
|
78
|
+
After you have paired your wallet with your dApp, you can get the signer from the
|
79
|
+
`DAppConnector` instance:
|
80
|
+
|
81
|
+
```javascript
|
82
|
+
const signer = dAppConnector.signers[0] // DAppSigner
|
83
|
+
```
|
84
|
+
|
85
|
+
Or, if multiple signers are available, you can find the signer by account ID:
|
86
|
+
|
87
|
+
```javascript
|
88
|
+
const signer = dAppConnector.signers.find(
|
89
|
+
(signer_) => signer_.getAccountId().toString() === '0.0.100',
|
90
|
+
) // DAppSigner
|
91
|
+
```
|
92
|
+
|
93
|
+
##### Sign Transactions
|
94
|
+
|
95
|
+
```javascript
|
96
|
+
const transaction = new TransferTransaction()
|
97
|
+
.addHbarTransfer('0.0.100', new Hbar(-1))
|
98
|
+
.addHbarTransfer('0.0.101', new Hbar(1))
|
99
|
+
|
100
|
+
await transaction.freezeWithSigner(signer)
|
101
|
+
const signedTransaction = await signer.signTransaction(transaction)
|
102
|
+
```
|
103
|
+
|
104
|
+
##### Sign and Execute Transactions
|
105
|
+
|
106
|
+
```javascript
|
107
|
+
const transaction = new TransferTransaction()
|
108
|
+
.addHbarTransfer('0.0.100', new Hbar(-1))
|
109
|
+
.addHbarTransfer('0.0.101', new Hbar(1))
|
110
|
+
|
111
|
+
await transaction.freezeWithSigner(signer)
|
112
|
+
const transactionResponse = await transaction.executeWithSigner(signer)
|
113
|
+
```
|
114
|
+
|
115
|
+
##### Sign and verify messages
|
116
|
+
|
117
|
+
```javascript
|
118
|
+
const text = 'Example message to sign'
|
119
|
+
const base64String = btoa(text)
|
120
|
+
|
121
|
+
const sigMaps = await signer.sign([base64StringToUint8Array(base64String)]) // import { base64StringToUint8Array } from '@hashgraph/hedera-wallet-connect'
|
122
|
+
|
123
|
+
// sigMaps[0].publicKey also contains the public key of the signer, but you should obtain a PublicKey you can trust from a mirror node.
|
124
|
+
const verifiedResult = verifySignerSignature(base64String, sigMaps[0], publicKey) // import { verifySignerSignature } from '@hashgraph/hedera-wallet-connect'
|
125
|
+
```
|
126
|
+
|
68
127
|
### Wallet
|
69
128
|
|
70
129
|
This library provides a Wallet class that extends the
|
@@ -128,6 +187,67 @@ to approve or reject the session:
|
|
128
187
|
Upon receiving a `session_request` event, process the request. For instance, if the dApp
|
129
188
|
requests a transaction to be signed:
|
130
189
|
|
190
|
+
#### Extension popup
|
191
|
+
|
192
|
+
By default, it is not possible to directly pop up an extension with Wallet Connect. However, to
|
193
|
+
allow this possibility, the dAppConnector look for extensions. If you create the AppConnector,
|
194
|
+
it will automatically send a message to the extension to detect if it is installed. In case the
|
195
|
+
extension is installed, it will be added to the available extensions and its data can be found
|
196
|
+
at the extensions property of dAppConnector.
|
197
|
+
|
198
|
+
To connect an available extension, use the method `connectExtension(<extensionId>)`. This will
|
199
|
+
link the extension to the signer and session. Whenever you use the signer created for this
|
200
|
+
session, the extension will automatically open. You can find out if the extension is available
|
201
|
+
by checking the `extensions` property.
|
202
|
+
|
203
|
+
```javascript
|
204
|
+
const dAppConnector = new DAppConnector(
|
205
|
+
dAppMetadata,
|
206
|
+
LedgerId.TESTNET,
|
207
|
+
projectId,
|
208
|
+
Object.values(HederaJsonRpcMethod),
|
209
|
+
[HederaSessionEvent.ChainChanged, HederaSessionEvent.AccountsChanged],
|
210
|
+
[HederaChainId.Testnet]
|
211
|
+
)
|
212
|
+
|
213
|
+
[...]
|
214
|
+
|
215
|
+
dAppConnector?.extensions?.forEach((extension) => {
|
216
|
+
console.log(extension)
|
217
|
+
})
|
218
|
+
|
219
|
+
const extension = dAppConnector?.extensions?.find((extension) => extension.name === '<Extension name>')
|
220
|
+
if (extension.available) {
|
221
|
+
await dAppConnector!.connectExtension(extension.id);
|
222
|
+
const signer = dAppConnector.getSigner(AccountId.fromString('0.0.12345'))
|
223
|
+
|
224
|
+
// This request will open the extension
|
225
|
+
const response = await signer.signAndExecuteTransaction(transaction)
|
226
|
+
}
|
227
|
+
```
|
228
|
+
|
229
|
+
Wallets that are compatible should be able to receive and respond to the following messages:
|
230
|
+
|
231
|
+
- `"hedera-extension-query"`: The extension is required to respond with
|
232
|
+
`"hedera-extension-response"` and provide the next set of data in the metadata property.
|
233
|
+
```javascript
|
234
|
+
let metadata = {
|
235
|
+
id: '<extesnionId>',
|
236
|
+
name: '<Wallet name>',
|
237
|
+
url: '<Wallet url>',
|
238
|
+
icon: '<Wallet con>',
|
239
|
+
description: '<Wallet url>',
|
240
|
+
}
|
241
|
+
```
|
242
|
+
- `"hedera-extension-open-<extensionId>"`: The extension needs to listen to this message and
|
243
|
+
automatically open.
|
244
|
+
- `"hedera-extension-connect-<extensionId>"`: The extension must listen to this message and
|
245
|
+
utilize the `pairingString` property in order to establish a connection.
|
246
|
+
|
247
|
+
This communication protocol between the wallet and web dApps requires an intermediate script to
|
248
|
+
use the Chrome API. Refer to the
|
249
|
+
[Chrome Extensions documentation](https://developer.chrome.com/docs/extensions/develop/concepts/messaging)
|
250
|
+
|
131
251
|
## Demo & docs
|
132
252
|
|
133
253
|
This repository includes a vanilla html/css/javascript implementation with a dApp and wallet
|