@cookill/wallet-adapter 2.4.0 → 2.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +91 -280
- package/dist/ErrorBoundary.cjs +107 -0
- package/dist/ErrorBoundary.cjs.map +1 -0
- package/dist/ErrorBoundary.d.cts +21 -0
- package/dist/ErrorBoundary.d.ts +21 -0
- package/dist/ErrorBoundary.js +102 -0
- package/dist/ErrorBoundary.js.map +1 -0
- package/dist/LoadingStates.cjs +269 -0
- package/dist/LoadingStates.cjs.map +1 -0
- package/dist/LoadingStates.d.cts +32 -0
- package/dist/LoadingStates.d.ts +32 -0
- package/dist/LoadingStates.js +262 -0
- package/dist/LoadingStates.js.map +1 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +440 -48
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +11 -2
- package/dist/react.d.ts +11 -2
- package/dist/react.js +389 -7
- package/dist/react.js.map +1 -1
- package/dist/standard.cjs +6 -6
- package/dist/standard.cjs.map +1 -1
- package/dist/standard.d.cts +3 -3
- package/dist/standard.d.ts +3 -3
- package/dist/standard.js +6 -6
- package/dist/standard.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,146 +1,60 @@
|
|
|
1
|
-
# @cookill/wallet-adapter
|
|
1
|
+
# @cookill/wallet-adapter v2.5.0
|
|
2
2
|
|
|
3
|
-
Official wallet adapter for **Sheep Wallet** on Rialo blockchain.
|
|
4
|
-
|
|
5
|
-
## Version 2.3.0
|
|
6
|
-
|
|
7
|
-
- Full TypeScript support
|
|
8
|
-
- React hooks and components
|
|
9
|
-
- Wallet Standard support
|
|
10
|
-
- EIP-6963 compatibility
|
|
11
|
-
- Auto-connect support
|
|
12
|
-
- Multi-network support (Mainnet, Testnet, Devnet, Localnet)
|
|
3
|
+
Official wallet adapter for **Sheep Wallet** on Rialo blockchain.
|
|
13
4
|
|
|
14
5
|
## Installation
|
|
15
6
|
|
|
16
7
|
```bash
|
|
17
8
|
npm install @cookill/wallet-adapter
|
|
18
|
-
# or
|
|
19
|
-
yarn add @cookill/wallet-adapter
|
|
20
|
-
# or
|
|
21
|
-
bun add @cookill/wallet-adapter
|
|
22
9
|
```
|
|
23
10
|
|
|
24
11
|
## Quick Start
|
|
25
12
|
|
|
26
|
-
### React (Recommended)
|
|
27
|
-
|
|
28
13
|
```tsx
|
|
29
|
-
import {
|
|
14
|
+
import {
|
|
15
|
+
WalletProvider,
|
|
16
|
+
ConnectButton,
|
|
17
|
+
WalletErrorBoundary,
|
|
18
|
+
} from '@cookill/wallet-adapter/react';
|
|
30
19
|
|
|
31
20
|
function App() {
|
|
32
21
|
return (
|
|
33
|
-
<
|
|
34
|
-
<
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
function YourDApp() {
|
|
42
|
-
const { connected, activeAccount, signMessage, sendTransaction } = useWallet();
|
|
43
|
-
|
|
44
|
-
const handleSign = async () => {
|
|
45
|
-
const result = await signMessage('Hello Rialo!');
|
|
46
|
-
console.log('Signature:', result.signature);
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
const handleSend = async () => {
|
|
50
|
-
const result = await sendTransaction({
|
|
51
|
-
to: 'RecipientBase58Address...', // Base58 address
|
|
52
|
-
value: '1000000000', // 1 dRLO in kelvins
|
|
53
|
-
});
|
|
54
|
-
console.log('TX Hash:', result.hash);
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
if (!connected) return <p>Please connect your wallet</p>;
|
|
58
|
-
|
|
59
|
-
return (
|
|
60
|
-
<div>
|
|
61
|
-
<p>Connected: {activeAccount?.address}</p>
|
|
62
|
-
<button onClick={handleSign}>Sign Message</button>
|
|
63
|
-
<button onClick={handleSend}>Send 1 RLO</button>
|
|
64
|
-
</div>
|
|
22
|
+
<WalletErrorBoundary>
|
|
23
|
+
<WalletProvider network="devnet" autoConnect>
|
|
24
|
+
<ConnectButton />
|
|
25
|
+
<YourDApp />
|
|
26
|
+
</WalletProvider>
|
|
27
|
+
</WalletErrorBoundary>
|
|
65
28
|
);
|
|
66
29
|
}
|
|
67
30
|
```
|
|
68
31
|
|
|
69
|
-
### Vanilla JavaScript
|
|
70
|
-
|
|
71
|
-
```typescript
|
|
72
|
-
import { RialoWallet, isRialoInstalled, formatBalance } from '@cookill/wallet-adapter';
|
|
73
|
-
|
|
74
|
-
const wallet = new RialoWallet();
|
|
75
|
-
|
|
76
|
-
// Check if installed
|
|
77
|
-
if (!isRialoInstalled()) {
|
|
78
|
-
console.log('Please install Sheep Wallet from https://rialo.io/wallet');
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
// Connect
|
|
82
|
-
const accounts = await wallet.connect();
|
|
83
|
-
console.log('Connected:', accounts[0].address);
|
|
84
|
-
|
|
85
|
-
// Get balance
|
|
86
|
-
const balance = await wallet.getBalance();
|
|
87
|
-
console.log('Balance:', formatBalance(balance), 'RLO');
|
|
88
|
-
|
|
89
|
-
// Sign message
|
|
90
|
-
const signed = await wallet.signMessage('Hello Rialo!');
|
|
91
|
-
console.log('Signature:', signed.signature);
|
|
92
|
-
|
|
93
|
-
// Send transaction
|
|
94
|
-
const tx = await wallet.signAndSendTransaction({
|
|
95
|
-
to: 'RecipientBase58Address...', // Base58 address
|
|
96
|
-
value: '1000000000', // 1 RLO
|
|
97
|
-
});
|
|
98
|
-
console.log('TX Hash:', tx.hash);
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
### Direct Provider Access
|
|
102
|
-
|
|
103
|
-
```typescript
|
|
104
|
-
// Access the injected provider directly
|
|
105
|
-
if (window.rialo) {
|
|
106
|
-
const accounts = await window.rialo.connect();
|
|
107
|
-
const balance = await window.rialo.getBalance();
|
|
108
|
-
|
|
109
|
-
const tx = await window.rialo.signAndSendTransaction({
|
|
110
|
-
to: 'RecipientBase58Address...',
|
|
111
|
-
value: '1000000000',
|
|
112
|
-
});
|
|
113
|
-
}
|
|
114
|
-
```
|
|
115
|
-
|
|
116
32
|
## React Hooks
|
|
117
33
|
|
|
118
34
|
### useWallet
|
|
119
35
|
|
|
120
|
-
Main hook with all functionality:
|
|
121
|
-
|
|
122
36
|
```tsx
|
|
123
37
|
const {
|
|
124
38
|
// State
|
|
125
|
-
connected,
|
|
126
|
-
connecting,
|
|
127
|
-
accounts,
|
|
128
|
-
activeAccount,
|
|
129
|
-
network,
|
|
130
|
-
chainId,
|
|
131
|
-
balance,
|
|
132
|
-
error,
|
|
39
|
+
connected, // boolean - is wallet connected
|
|
40
|
+
connecting, // boolean - connection in progress
|
|
41
|
+
accounts, // WalletAccount[] - all connected accounts
|
|
42
|
+
activeAccount, // WalletAccount | null - primary account
|
|
43
|
+
network, // 'mainnet' | 'testnet' | 'devnet' | 'localnet'
|
|
44
|
+
chainId, // 'rialo:devnet' etc
|
|
45
|
+
balance, // string | null (in kelvins)
|
|
46
|
+
error, // Error | null
|
|
133
47
|
|
|
134
48
|
// Actions
|
|
135
|
-
connect,
|
|
136
|
-
disconnect,
|
|
137
|
-
switchNetwork,
|
|
138
|
-
refreshBalance,
|
|
49
|
+
connect, // () => Promise<WalletAccount[]>
|
|
50
|
+
disconnect, // () => Promise<void>
|
|
51
|
+
switchNetwork, // (network) => Promise<void>
|
|
52
|
+
refreshBalance, // () => Promise<void>
|
|
139
53
|
|
|
140
54
|
// Transactions
|
|
141
|
-
signMessage,
|
|
142
|
-
signTransaction,
|
|
143
|
-
sendTransaction,
|
|
55
|
+
signMessage, // (message: string) => Promise<SignedMessage>
|
|
56
|
+
signTransaction, // (tx) => Promise<string>
|
|
57
|
+
sendTransaction, // (tx) => Promise<TransactionResult>
|
|
144
58
|
signAndSendTransaction, // (tx) => Promise<TransactionResult>
|
|
145
59
|
|
|
146
60
|
// Modal
|
|
@@ -150,43 +64,33 @@ const {
|
|
|
150
64
|
} = useWallet();
|
|
151
65
|
```
|
|
152
66
|
|
|
153
|
-
###
|
|
67
|
+
### useConnectWallet
|
|
154
68
|
|
|
155
69
|
```tsx
|
|
156
|
-
|
|
157
|
-
|
|
70
|
+
const {
|
|
71
|
+
connect, // Opens modal (recommended)
|
|
72
|
+
connectDirect, // Calls provider directly
|
|
73
|
+
connecting,
|
|
74
|
+
isInstalled,
|
|
75
|
+
error,
|
|
76
|
+
openModal,
|
|
77
|
+
} = useConnectWallet();
|
|
158
78
|
|
|
159
|
-
|
|
160
|
-
|
|
79
|
+
<button onClick={connect}>Connect Wallet</button>
|
|
80
|
+
```
|
|
161
81
|
|
|
162
|
-
|
|
163
|
-
const accounts = useAccounts();
|
|
82
|
+
### Other Hooks
|
|
164
83
|
|
|
165
|
-
|
|
84
|
+
```tsx
|
|
85
|
+
const connected = useIsConnected();
|
|
86
|
+
const account = useActiveAccount();
|
|
87
|
+
const accounts = useAccounts();
|
|
166
88
|
const { balance, formatted, refresh } = useBalance();
|
|
167
|
-
|
|
168
|
-
// Network info
|
|
169
89
|
const { network, chainId, config } = useNetwork();
|
|
170
|
-
|
|
171
|
-
// Chain ID only
|
|
172
|
-
const chainId = useChainId();
|
|
173
|
-
|
|
174
|
-
// Switch network with loading state
|
|
175
|
-
const { switchNetwork, switching, error, currentNetwork } = useSwitchNetwork();
|
|
176
|
-
|
|
177
|
-
// Connect with loading state
|
|
178
|
-
const { connect, connecting, isInstalled, error } = useConnectWallet();
|
|
179
|
-
|
|
180
|
-
// Disconnect
|
|
90
|
+
const { switchNetwork, switching, error } = useSwitchNetwork();
|
|
181
91
|
const { disconnect, connected } = useDisconnectWallet();
|
|
182
|
-
|
|
183
|
-
// Sign message with state
|
|
184
|
-
const { sign, signing, signature, error, address } = useSignMessage();
|
|
185
|
-
|
|
186
|
-
// Sign transaction with state
|
|
92
|
+
const { sign, signing, signature, error } = useSignMessage();
|
|
187
93
|
const { sign, signing, signature, error } = useSignTransaction();
|
|
188
|
-
|
|
189
|
-
// Send transaction with state
|
|
190
94
|
const { send, sending, txHash, error, reset } = useSendTransaction();
|
|
191
95
|
```
|
|
192
96
|
|
|
@@ -196,21 +100,11 @@ const { send, sending, txHash, error, reset } = useSendTransaction();
|
|
|
196
100
|
|
|
197
101
|
```tsx
|
|
198
102
|
<ConnectButton
|
|
199
|
-
connectLabel="Connect Wallet"
|
|
200
|
-
disconnectLabel="Disconnect"
|
|
201
|
-
showAddress={true}
|
|
202
|
-
showBalance={false}
|
|
203
|
-
className="my-button"
|
|
204
|
-
style={{ ... }} // Custom styles
|
|
205
|
-
/>
|
|
206
|
-
```
|
|
207
|
-
|
|
208
|
-
### WalletModal
|
|
209
|
-
|
|
210
|
-
```tsx
|
|
211
|
-
<WalletModal
|
|
212
|
-
title="Select Wallet" // Modal title
|
|
213
|
-
className="my-modal" // Custom class
|
|
103
|
+
connectLabel="Connect Wallet"
|
|
104
|
+
disconnectLabel="Disconnect"
|
|
105
|
+
showAddress={true}
|
|
106
|
+
showBalance={false}
|
|
107
|
+
className="my-button"
|
|
214
108
|
/>
|
|
215
109
|
```
|
|
216
110
|
|
|
@@ -218,61 +112,48 @@ const { send, sending, txHash, error, reset } = useSendTransaction();
|
|
|
218
112
|
|
|
219
113
|
```tsx
|
|
220
114
|
<WalletProvider
|
|
221
|
-
network="devnet"
|
|
222
|
-
autoConnect={true}
|
|
223
|
-
wallets={[customWallet]} // Additional wallets
|
|
115
|
+
network="devnet"
|
|
116
|
+
autoConnect={true}
|
|
224
117
|
onConnect={(accounts) => console.log('Connected', accounts)}
|
|
225
118
|
onDisconnect={() => console.log('Disconnected')}
|
|
226
|
-
onNetworkChange={(network) => console.log('Network
|
|
119
|
+
onNetworkChange={(network) => console.log('Network:', network)}
|
|
227
120
|
onError={(error) => console.error(error)}
|
|
228
121
|
>
|
|
229
122
|
{children}
|
|
230
123
|
</WalletProvider>
|
|
231
124
|
```
|
|
232
125
|
|
|
233
|
-
##
|
|
234
|
-
|
|
235
|
-
For advanced integrations using the Wallet Standard:
|
|
126
|
+
## Vanilla JavaScript
|
|
236
127
|
|
|
237
128
|
```typescript
|
|
238
|
-
import {
|
|
239
|
-
RialoWalletStandard,
|
|
240
|
-
registerRialoWallet,
|
|
241
|
-
getRialoWallet,
|
|
242
|
-
RIALO_SIGN_MESSAGE,
|
|
243
|
-
RIALO_SIGN_TRANSACTION,
|
|
244
|
-
RIALO_SIGN_AND_SEND_TRANSACTION,
|
|
245
|
-
} from '@cookill/wallet-adapter/standard';
|
|
246
|
-
|
|
247
|
-
// Get registered wallet
|
|
248
|
-
const wallet = getRialoWallet();
|
|
249
|
-
|
|
250
|
-
if (wallet) {
|
|
251
|
-
// Connect
|
|
252
|
-
const { accounts } = await wallet.features['standard:connect'].connect();
|
|
253
|
-
|
|
254
|
-
// Sign message
|
|
255
|
-
const message = new TextEncoder().encode('Hello Rialo!');
|
|
256
|
-
const { signature } = await wallet.features[RIALO_SIGN_MESSAGE].signMessage({
|
|
257
|
-
account: accounts[0],
|
|
258
|
-
message,
|
|
259
|
-
});
|
|
260
|
-
|
|
261
|
-
// Listen for changes
|
|
262
|
-
const unsubscribe = wallet.features['standard:events'].on('change', (data) => {
|
|
263
|
-
console.log('Wallet changed:', data);
|
|
264
|
-
});
|
|
265
|
-
}
|
|
266
|
-
```
|
|
129
|
+
import { RialoWallet, isRialoInstalled, formatBalance } from '@cookill/wallet-adapter';
|
|
267
130
|
|
|
268
|
-
|
|
131
|
+
const wallet = new RialoWallet();
|
|
269
132
|
|
|
270
|
-
|
|
133
|
+
if (!isRialoInstalled()) {
|
|
134
|
+
console.log('Please install Sheep Wallet');
|
|
135
|
+
}
|
|
271
136
|
|
|
137
|
+
const accounts = await wallet.connect();
|
|
138
|
+
const balance = await wallet.getBalance();
|
|
139
|
+
const signed = await wallet.signMessage('Hello!');
|
|
140
|
+
const tx = await wallet.signAndSendTransaction({
|
|
141
|
+
to: 'RecipientAddress...',
|
|
142
|
+
value: '1000000000', // 1 RLO in kelvins
|
|
143
|
+
});
|
|
272
144
|
```
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
145
|
+
|
|
146
|
+
## Direct Provider Access
|
|
147
|
+
|
|
148
|
+
```typescript
|
|
149
|
+
if (window.rialo) {
|
|
150
|
+
const accounts = await window.rialo.connect();
|
|
151
|
+
const balance = await window.rialo.getBalance();
|
|
152
|
+
const tx = await window.rialo.signAndSendTransaction({
|
|
153
|
+
to: 'RecipientAddress...',
|
|
154
|
+
value: '1000000000',
|
|
155
|
+
});
|
|
156
|
+
}
|
|
276
157
|
```
|
|
277
158
|
|
|
278
159
|
## Networks
|
|
@@ -284,27 +165,25 @@ Rialo uses **base58** encoded addresses (32-50 characters). Examples:
|
|
|
284
165
|
| Devnet | rialo:devnet | https://devnet.rialo.io:4101 | dRLO |
|
|
285
166
|
| Localnet | rialo:localnet | http://localhost:4101 | lRLO |
|
|
286
167
|
|
|
287
|
-
##
|
|
168
|
+
## Utilities
|
|
288
169
|
|
|
289
170
|
```typescript
|
|
290
171
|
import {
|
|
291
|
-
formatAddress,
|
|
292
|
-
formatBalance,
|
|
293
|
-
parseBalance,
|
|
294
|
-
isValidAddress,
|
|
295
|
-
toChainId,
|
|
296
|
-
fromChainId,
|
|
297
|
-
isRialoInstalled,
|
|
298
|
-
getRialoProvider,
|
|
299
|
-
waitForRialoProvider, // (timeout?) => Promise<RialoProvider
|
|
300
|
-
NETWORKS,
|
|
172
|
+
formatAddress, // (address, chars?) => "5YNm...VWr8"
|
|
173
|
+
formatBalance, // (kelvins, decimals?) => "1.0000"
|
|
174
|
+
parseBalance, // (rlo) => bigint (kelvins)
|
|
175
|
+
isValidAddress, // (address) => boolean
|
|
176
|
+
toChainId, // (network) => 'rialo:devnet'
|
|
177
|
+
fromChainId, // (chainId) => 'devnet'
|
|
178
|
+
isRialoInstalled, // () => boolean
|
|
179
|
+
getRialoProvider, // () => RialoProvider | undefined
|
|
180
|
+
waitForRialoProvider, // (timeout?) => Promise<RialoProvider>
|
|
181
|
+
NETWORKS, // Network configurations
|
|
301
182
|
} from '@cookill/wallet-adapter';
|
|
302
183
|
```
|
|
303
184
|
|
|
304
185
|
## TypeScript
|
|
305
186
|
|
|
306
|
-
Full TypeScript support included:
|
|
307
|
-
|
|
308
187
|
```typescript
|
|
309
188
|
import type {
|
|
310
189
|
WalletAccount,
|
|
@@ -317,77 +196,9 @@ import type {
|
|
|
317
196
|
RialoProvider,
|
|
318
197
|
RialoNetwork,
|
|
319
198
|
RialoChain,
|
|
320
|
-
WalletEvent,
|
|
321
199
|
} from '@cookill/wallet-adapter';
|
|
322
200
|
```
|
|
323
201
|
|
|
324
|
-
## Building a Compatible Wallet
|
|
325
|
-
|
|
326
|
-
To make your wallet compatible with this adapter, inject a provider at `window.rialo`:
|
|
327
|
-
|
|
328
|
-
```typescript
|
|
329
|
-
window.rialo = {
|
|
330
|
-
isRialo: true,
|
|
331
|
-
isSheepWallet: true, // Identify as Sheep Wallet
|
|
332
|
-
name: 'Sheep Wallet',
|
|
333
|
-
walletName: 'Sheep Wallet',
|
|
334
|
-
version: '2.3.0',
|
|
335
|
-
|
|
336
|
-
// Connection
|
|
337
|
-
connect: async () => [{ address: '5YNmS1R9...', publicKey: '5YNmS1R9...' }],
|
|
338
|
-
disconnect: async () => {},
|
|
339
|
-
isConnected: async () => true,
|
|
340
|
-
getAccounts: async () => [{ address: '5YNmS1R9...' }],
|
|
341
|
-
|
|
342
|
-
// Transactions
|
|
343
|
-
signTransaction: async (tx) => ({ signature: '...', signedTransaction: '...' }),
|
|
344
|
-
sendTransaction: async (tx) => ({ hash: '...', status: 'pending' }),
|
|
345
|
-
signAndSendTransaction: async (tx) => ({ hash: '...', status: 'pending' }),
|
|
346
|
-
|
|
347
|
-
// Message signing
|
|
348
|
-
signMessage: async (message) => ({
|
|
349
|
-
signature: '...',
|
|
350
|
-
message,
|
|
351
|
-
address: '5YNmS1R9...'
|
|
352
|
-
}),
|
|
353
|
-
|
|
354
|
-
// Network
|
|
355
|
-
getNetwork: async () => 'devnet',
|
|
356
|
-
switchNetwork: async (network) => ({ success: true }),
|
|
357
|
-
getChainId: async () => 'rialo:devnet',
|
|
358
|
-
getBalance: async (address) => ({
|
|
359
|
-
balance: '1.0',
|
|
360
|
-
balanceKelvins: '1000000000',
|
|
361
|
-
formatted: '1.0000 RLO'
|
|
362
|
-
}),
|
|
363
|
-
|
|
364
|
-
// Events
|
|
365
|
-
on: (event, callback) => () => {},
|
|
366
|
-
off: (event, callback) => {},
|
|
367
|
-
removeListener: (event, callback) => {},
|
|
368
|
-
removeAllListeners: (event) => {},
|
|
369
|
-
|
|
370
|
-
// Utilities (optional)
|
|
371
|
-
utils: {
|
|
372
|
-
isValidAddress: (address) => /^[1-9A-HJ-NP-Za-km-z]{32,50}$/.test(address),
|
|
373
|
-
formatAddress: (address, chars = 4) => `${address.slice(0, chars)}...${address.slice(-chars)}`,
|
|
374
|
-
},
|
|
375
|
-
|
|
376
|
-
// Wallet Standard features (optional)
|
|
377
|
-
features: ['standard:connect', 'standard:disconnect', 'rialo:signTransaction', ...],
|
|
378
|
-
supportsFeature: (feature) => true,
|
|
379
|
-
};
|
|
380
|
-
```
|
|
381
|
-
|
|
382
|
-
## Publishing to NPM
|
|
383
|
-
|
|
384
|
-
```bash
|
|
385
|
-
cd packages/wallet-adapter
|
|
386
|
-
npm install
|
|
387
|
-
npm run build
|
|
388
|
-
npm publish --access public
|
|
389
|
-
```
|
|
390
|
-
|
|
391
202
|
## License
|
|
392
203
|
|
|
393
|
-
MIT
|
|
204
|
+
MIT
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var react = require('react');
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
|
|
8
|
+
// src/ErrorBoundary.tsx
|
|
9
|
+
var WalletErrorBoundary = class extends react.Component {
|
|
10
|
+
constructor() {
|
|
11
|
+
super(...arguments);
|
|
12
|
+
this.state = {
|
|
13
|
+
hasError: false,
|
|
14
|
+
error: null
|
|
15
|
+
};
|
|
16
|
+
this.handleRetry = () => {
|
|
17
|
+
this.setState({ hasError: false, error: null });
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
static getDerivedStateFromError(error) {
|
|
21
|
+
return { hasError: true, error };
|
|
22
|
+
}
|
|
23
|
+
componentDidCatch(error, errorInfo) {
|
|
24
|
+
console.error("[WalletAdapter] Error caught by boundary:", error, errorInfo);
|
|
25
|
+
this.props.onError?.(error, errorInfo);
|
|
26
|
+
}
|
|
27
|
+
render() {
|
|
28
|
+
if (this.state.hasError) {
|
|
29
|
+
if (this.props.fallback) {
|
|
30
|
+
return this.props.fallback;
|
|
31
|
+
}
|
|
32
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
33
|
+
"div",
|
|
34
|
+
{
|
|
35
|
+
style: {
|
|
36
|
+
padding: "20px",
|
|
37
|
+
borderRadius: "12px",
|
|
38
|
+
border: "1px solid #fee2e2",
|
|
39
|
+
backgroundColor: "#fef2f2",
|
|
40
|
+
textAlign: "center"
|
|
41
|
+
},
|
|
42
|
+
children: [
|
|
43
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
44
|
+
"div",
|
|
45
|
+
{
|
|
46
|
+
style: {
|
|
47
|
+
width: "48px",
|
|
48
|
+
height: "48px",
|
|
49
|
+
margin: "0 auto 12px",
|
|
50
|
+
borderRadius: "50%",
|
|
51
|
+
backgroundColor: "#fecaca",
|
|
52
|
+
display: "flex",
|
|
53
|
+
alignItems: "center",
|
|
54
|
+
justifyContent: "center"
|
|
55
|
+
},
|
|
56
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
57
|
+
"svg",
|
|
58
|
+
{
|
|
59
|
+
width: "24",
|
|
60
|
+
height: "24",
|
|
61
|
+
viewBox: "0 0 24 24",
|
|
62
|
+
fill: "none",
|
|
63
|
+
stroke: "#dc2626",
|
|
64
|
+
strokeWidth: "2",
|
|
65
|
+
strokeLinecap: "round",
|
|
66
|
+
strokeLinejoin: "round",
|
|
67
|
+
children: [
|
|
68
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
|
|
69
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
|
|
70
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
|
|
71
|
+
]
|
|
72
|
+
}
|
|
73
|
+
)
|
|
74
|
+
}
|
|
75
|
+
),
|
|
76
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { margin: "0 0 8px", fontSize: "16px", fontWeight: 600, color: "#991b1b" }, children: "Wallet Connection Error" }),
|
|
77
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: "0 0 16px", fontSize: "14px", color: "#b91c1c" }, children: this.state.error?.message || "Something went wrong" }),
|
|
78
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
79
|
+
"button",
|
|
80
|
+
{
|
|
81
|
+
onClick: this.handleRetry,
|
|
82
|
+
style: {
|
|
83
|
+
padding: "8px 16px",
|
|
84
|
+
borderRadius: "8px",
|
|
85
|
+
border: "none",
|
|
86
|
+
backgroundColor: "#dc2626",
|
|
87
|
+
color: "white",
|
|
88
|
+
cursor: "pointer",
|
|
89
|
+
fontSize: "14px",
|
|
90
|
+
fontWeight: 500
|
|
91
|
+
},
|
|
92
|
+
children: "Try Again"
|
|
93
|
+
}
|
|
94
|
+
)
|
|
95
|
+
]
|
|
96
|
+
}
|
|
97
|
+
);
|
|
98
|
+
}
|
|
99
|
+
return this.props.children;
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
var ErrorBoundary_default = WalletErrorBoundary;
|
|
103
|
+
|
|
104
|
+
exports.WalletErrorBoundary = WalletErrorBoundary;
|
|
105
|
+
exports.default = ErrorBoundary_default;
|
|
106
|
+
//# sourceMappingURL=ErrorBoundary.cjs.map
|
|
107
|
+
//# sourceMappingURL=ErrorBoundary.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ErrorBoundary.tsx"],"names":["Component","jsxs","jsx"],"mappings":"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","file":"ErrorBoundary.cjs","sourcesContent":["/**\n * @cookill/wallet-adapter - Error Boundary\n * Prevents blank screens from uncaught errors\n */\n\nimport React, { Component, ErrorInfo, ReactNode } from 'react';\n\ninterface Props {\n children: ReactNode;\n fallback?: ReactNode;\n onError?: (error: Error, errorInfo: ErrorInfo) => void;\n}\n\ninterface State {\n hasError: boolean;\n error: Error | null;\n}\n\nexport class WalletErrorBoundary extends Component<Props, State> {\n public state: State = {\n hasError: false,\n error: null,\n };\n\n public static getDerivedStateFromError(error: Error): State {\n return { hasError: true, error };\n }\n\n public componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n console.error('[WalletAdapter] Error caught by boundary:', error, errorInfo);\n this.props.onError?.(error, errorInfo);\n }\n\n private handleRetry = () => {\n this.setState({ hasError: false, error: null });\n };\n\n public render() {\n if (this.state.hasError) {\n if (this.props.fallback) {\n return this.props.fallback;\n }\n\n return (\n <div\n style={{\n padding: '20px',\n borderRadius: '12px',\n border: '1px solid #fee2e2',\n backgroundColor: '#fef2f2',\n textAlign: 'center',\n }}\n >\n <div\n style={{\n width: '48px',\n height: '48px',\n margin: '0 auto 12px',\n borderRadius: '50%',\n backgroundColor: '#fecaca',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"#dc2626\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\" />\n <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\" />\n </svg>\n </div>\n <h3 style={{ margin: '0 0 8px', fontSize: '16px', fontWeight: 600, color: '#991b1b' }}>\n Wallet Connection Error\n </h3>\n <p style={{ margin: '0 0 16px', fontSize: '14px', color: '#b91c1c' }}>\n {this.state.error?.message || 'Something went wrong'}\n </p>\n <button\n onClick={this.handleRetry}\n style={{\n padding: '8px 16px',\n borderRadius: '8px',\n border: 'none',\n backgroundColor: '#dc2626',\n color: 'white',\n cursor: 'pointer',\n fontSize: '14px',\n fontWeight: 500,\n }}\n >\n Try Again\n </button>\n </div>\n );\n }\n\n return this.props.children;\n }\n}\n\nexport default WalletErrorBoundary;\n"]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import React, { Component, ReactNode, ErrorInfo } from 'react';
|
|
3
|
+
|
|
4
|
+
interface Props {
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
fallback?: ReactNode;
|
|
7
|
+
onError?: (error: Error, errorInfo: ErrorInfo) => void;
|
|
8
|
+
}
|
|
9
|
+
interface State {
|
|
10
|
+
hasError: boolean;
|
|
11
|
+
error: Error | null;
|
|
12
|
+
}
|
|
13
|
+
declare class WalletErrorBoundary extends Component<Props, State> {
|
|
14
|
+
state: State;
|
|
15
|
+
static getDerivedStateFromError(error: Error): State;
|
|
16
|
+
componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
|
|
17
|
+
private handleRetry;
|
|
18
|
+
render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { WalletErrorBoundary, WalletErrorBoundary as default };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import React, { Component, ReactNode, ErrorInfo } from 'react';
|
|
3
|
+
|
|
4
|
+
interface Props {
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
fallback?: ReactNode;
|
|
7
|
+
onError?: (error: Error, errorInfo: ErrorInfo) => void;
|
|
8
|
+
}
|
|
9
|
+
interface State {
|
|
10
|
+
hasError: boolean;
|
|
11
|
+
error: Error | null;
|
|
12
|
+
}
|
|
13
|
+
declare class WalletErrorBoundary extends Component<Props, State> {
|
|
14
|
+
state: State;
|
|
15
|
+
static getDerivedStateFromError(error: Error): State;
|
|
16
|
+
componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
|
|
17
|
+
private handleRetry;
|
|
18
|
+
render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { WalletErrorBoundary, WalletErrorBoundary as default };
|