@provablehq/aleo-wallet-adaptor-react-ui 0.3.0-alpha.2 → 0.3.0-alpha.4
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/dist/index.js +123 -140
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +126 -143
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +21 -18
- package/package.json +6 -6
package/dist/index.mjs
CHANGED
|
@@ -53,7 +53,7 @@ var WalletIcon = ({ wallet, ...props }) => {
|
|
|
53
53
|
return wallet && /* @__PURE__ */ jsx2(
|
|
54
54
|
"img",
|
|
55
55
|
{
|
|
56
|
-
style: { borderRadius: "
|
|
56
|
+
style: { borderRadius: "22%" },
|
|
57
57
|
src: wallet.adapter.icon,
|
|
58
58
|
alt: `${wallet.adapter.name} icon`,
|
|
59
59
|
...props
|
|
@@ -102,7 +102,7 @@ var WalletConnectButton = ({
|
|
|
102
102
|
};
|
|
103
103
|
|
|
104
104
|
// src/WalletModal.tsx
|
|
105
|
-
import { useCallback as useCallback2, useLayoutEffect as useLayoutEffect2, useMemo as useMemo2, useRef as useRef2, useState } from "react";
|
|
105
|
+
import { useCallback as useCallback2, useEffect, useLayoutEffect as useLayoutEffect2, useMemo as useMemo2, useRef as useRef2, useState } from "react";
|
|
106
106
|
import { createPortal } from "react-dom";
|
|
107
107
|
|
|
108
108
|
// src/Collapse.tsx
|
|
@@ -182,62 +182,15 @@ var WalletListItem = ({ handleClick, tabIndex, wallet }) => {
|
|
|
182
182
|
] }) });
|
|
183
183
|
};
|
|
184
184
|
|
|
185
|
-
// src/AleoIcon.tsx
|
|
186
|
-
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
187
|
-
var AleoIcon = () => {
|
|
188
|
-
return /* @__PURE__ */ jsxs3(
|
|
189
|
-
"svg",
|
|
190
|
-
{
|
|
191
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
192
|
-
width: "216",
|
|
193
|
-
height: "80",
|
|
194
|
-
viewBox: "0 0 216 80",
|
|
195
|
-
fill: "none",
|
|
196
|
-
children: [
|
|
197
|
-
/* @__PURE__ */ jsx6("path", { d: "M73.426 0V8.93824H81.6842V78.8961H90.6045V0H73.426Z", fill: "#F5F5F5" }),
|
|
198
|
-
/* @__PURE__ */ jsx6(
|
|
199
|
-
"path",
|
|
200
|
-
{
|
|
201
|
-
d: "M154.145 51.4216C154.145 32.5518 143.683 21.297 127.604 21.297C111.526 21.297 100.954 32.0007 100.954 50.8687C100.954 69.7367 111.415 80 127.604 80C140.378 80 149.96 72.6061 152.603 62.3447H142.692C140.488 67.0902 135.975 71.2829 127.604 71.2829C116.812 71.2829 111.307 64.4419 110.205 54.6209H154.145V51.4216ZM110.316 46.125C111.636 36.6357 117.364 29.9035 127.604 29.9035C137.845 29.9035 143.242 36.5251 144.564 46.125H110.316Z",
|
|
202
|
-
fill: "#F5F5F5"
|
|
203
|
-
}
|
|
204
|
-
),
|
|
205
|
-
/* @__PURE__ */ jsx6(
|
|
206
|
-
"path",
|
|
207
|
-
{
|
|
208
|
-
d: "M189.272 21.297C173.083 21.297 162.622 32.0007 162.622 50.8687C162.622 69.7367 173.083 80 189.272 80C205.461 80 215.812 70.0684 215.812 50.8687C215.812 31.669 205.351 21.297 189.272 21.297ZM189.272 71.5041C177.709 71.5041 171.432 62.4553 171.432 50.76C171.432 39.0647 177.709 29.6842 189.272 29.6842C200.836 29.6842 207.003 38.8436 207.003 50.76C207.003 62.6764 200.946 71.5041 189.272 71.5041Z",
|
|
209
|
-
fill: "#F5F5F5"
|
|
210
|
-
}
|
|
211
|
-
),
|
|
212
|
-
/* @__PURE__ */ jsx6(
|
|
213
|
-
"path",
|
|
214
|
-
{
|
|
215
|
-
d: "M46.5565 0H28.3849L12.6134 46.125H22.2179L34.9933 8.49593H39.6189L52.3925 46.125H22.2179L19.2457 54.6209H55.2561L63.5143 78.8961H73.426L46.5565 0Z",
|
|
216
|
-
fill: "#F5F5F5"
|
|
217
|
-
}
|
|
218
|
-
),
|
|
219
|
-
/* @__PURE__ */ jsx6(
|
|
220
|
-
"path",
|
|
221
|
-
{
|
|
222
|
-
d: "M1.40508 78.8961H10.9857L19.2457 54.6209L9.7074 54.6209L1.40508 78.8961Z",
|
|
223
|
-
fill: "#F5F5F5"
|
|
224
|
-
}
|
|
225
|
-
),
|
|
226
|
-
/* @__PURE__ */ jsx6("path", { d: "M3.0935 46.125L0.1875 54.6209H9.7074L12.6134 46.125H3.0935Z", fill: "#F5F5F5" })
|
|
227
|
-
]
|
|
228
|
-
}
|
|
229
|
-
);
|
|
230
|
-
};
|
|
231
|
-
|
|
232
185
|
// src/WalletModal.tsx
|
|
233
186
|
import { useWallet as useWallet2 } from "@provablehq/aleo-wallet-adaptor-react";
|
|
234
187
|
import { WalletReadyState as WalletReadyState2 } from "@provablehq/aleo-wallet-standard";
|
|
235
188
|
import { Network as Network2 } from "@provablehq/aleo-types";
|
|
236
189
|
|
|
237
190
|
// src/ProvableLogo.tsx
|
|
238
|
-
import { jsx as
|
|
191
|
+
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
239
192
|
var ProvableLogo = () => {
|
|
240
|
-
return /* @__PURE__ */
|
|
193
|
+
return /* @__PURE__ */ jsx6(
|
|
241
194
|
"svg",
|
|
242
195
|
{
|
|
243
196
|
width: "115",
|
|
@@ -245,69 +198,69 @@ var ProvableLogo = () => {
|
|
|
245
198
|
viewBox: "0 0 115 18",
|
|
246
199
|
fill: "none",
|
|
247
200
|
xmlns: "http://www.w3.org/2000/svg",
|
|
248
|
-
children: /* @__PURE__ */
|
|
249
|
-
/* @__PURE__ */
|
|
201
|
+
children: /* @__PURE__ */ jsxs3("g", { opacity: "0.88", children: [
|
|
202
|
+
/* @__PURE__ */ jsx6(
|
|
250
203
|
"path",
|
|
251
204
|
{
|
|
252
205
|
d: "M0 3.89265C0 2.29508 1.29508 1 2.89265 1H13.1073C14.7048 1 15.9999 2.29508 15.9999 3.89265V14.1074C15.9999 15.7049 14.7049 17 13.1073 17H10.4926C10.0937 17 9.7702 16.6766 9.7702 16.2776V8.67463C9.7702 7.87665 9.12331 7.22976 8.32533 7.22976H0.722439C0.323447 7.22976 0 6.90631 0 6.50732L0 3.89265Z",
|
|
253
|
-
fill: "
|
|
206
|
+
fill: "currentColor"
|
|
254
207
|
}
|
|
255
208
|
),
|
|
256
|
-
/* @__PURE__ */
|
|
209
|
+
/* @__PURE__ */ jsx6(
|
|
257
210
|
"path",
|
|
258
211
|
{
|
|
259
212
|
d: "M6.22973 12.2151C6.22973 11.4171 5.58284 10.7702 4.78485 10.7702H0.722439C0.323447 10.7702 0 11.0937 0 11.4927L0 14.1074C0 15.7049 1.29508 17 2.89265 17H5.50729C5.90628 17 6.22973 16.6766 6.22973 16.2776V12.2151Z",
|
|
260
|
-
fill: "
|
|
213
|
+
fill: "currentColor"
|
|
261
214
|
}
|
|
262
215
|
),
|
|
263
|
-
/* @__PURE__ */
|
|
216
|
+
/* @__PURE__ */ jsx6(
|
|
264
217
|
"path",
|
|
265
218
|
{
|
|
266
219
|
d: "M108.725 17.272C105.098 17.272 102.695 14.7107 102.695 10.88C102.695 7.04935 105.098 4.48802 108.725 4.48802C112.85 4.48802 115.275 7.52535 114.686 11.968H106.118C106.39 13.6453 107.319 14.5973 108.793 14.5973C110.039 14.5973 110.901 14.0533 111.263 13.056H114.663C114.006 15.7533 111.898 17.272 108.725 17.272ZM106.118 9.70135H111.467C111.195 8.04668 110.266 7.16268 108.793 7.16268C107.342 7.16268 106.413 8.06935 106.118 9.70135Z",
|
|
267
|
-
fill: "
|
|
220
|
+
fill: "currentColor"
|
|
268
221
|
}
|
|
269
222
|
),
|
|
270
|
-
/* @__PURE__ */
|
|
271
|
-
/* @__PURE__ */
|
|
223
|
+
/* @__PURE__ */ jsx6("path", { d: "M98.3672 17V0.317363L101.699 0.0453644V17H98.3672Z", fill: "currentColor" }),
|
|
224
|
+
/* @__PURE__ */ jsx6(
|
|
272
225
|
"path",
|
|
273
226
|
{
|
|
274
227
|
d: "M84.9072 17V0.317363L88.2392 0.0453644V6.50535H88.3752C89.1232 5.21336 90.3246 4.55602 92.0245 4.55602C95.2432 4.55602 97.3512 7.07202 97.3512 10.88C97.3512 14.688 95.2432 17.2267 92.0245 17.2267C90.3246 17.2267 89.1232 16.5693 88.3752 15.2547H88.2392V17H84.9072ZM91.0952 7.32135C89.3726 7.32135 88.2392 8.72668 88.2392 10.88C88.2392 13.056 89.3726 14.4613 91.0952 14.4613C92.8405 14.4613 93.9512 13.056 93.9512 10.88C93.9512 8.72668 92.8405 7.32135 91.0952 7.32135Z",
|
|
275
|
-
fill: "
|
|
228
|
+
fill: "currentColor"
|
|
276
229
|
}
|
|
277
230
|
),
|
|
278
|
-
/* @__PURE__ */
|
|
231
|
+
/* @__PURE__ */ jsx6(
|
|
279
232
|
"path",
|
|
280
233
|
{
|
|
281
234
|
d: "M76.3143 17.1813C73.9117 17.1813 72.3477 15.6853 72.3477 13.3733C72.3477 11.4013 73.685 10.1093 76.0423 9.83735L79.2836 9.47468C79.8956 9.38401 80.1903 9.11201 80.1903 8.61335C80.1903 7.68402 79.4876 7.11735 78.3543 7.11735C77.221 7.11735 76.4503 7.68402 76.3143 8.61335H72.8917C73.141 6.05202 75.249 4.48802 78.3996 4.48802C81.641 4.48802 83.5223 6.09735 83.5223 8.88535V17H80.1903V15.4133H80.0543C79.4423 16.456 77.9236 17.1813 76.3143 17.1813ZM77.4023 14.5973C78.8303 14.5973 80.1903 13.3507 80.1903 11.9V11.4693C80.0316 11.5827 79.8503 11.628 79.6236 11.6507L77.1983 11.9227C76.3143 12.0133 75.8157 12.4893 75.8157 13.2373C75.8157 14.076 76.4276 14.5973 77.4023 14.5973Z",
|
|
282
|
-
fill: "
|
|
235
|
+
fill: "currentColor"
|
|
283
236
|
}
|
|
284
237
|
),
|
|
285
|
-
/* @__PURE__ */
|
|
238
|
+
/* @__PURE__ */ jsx6(
|
|
286
239
|
"path",
|
|
287
240
|
{
|
|
288
241
|
d: "M64.509 17L60.1797 4.76003H63.5117L66.549 13.94H66.685L69.6997 4.76003H72.873L68.5437 17H64.509Z",
|
|
289
|
-
fill: "
|
|
242
|
+
fill: "currentColor"
|
|
290
243
|
}
|
|
291
244
|
),
|
|
292
|
-
/* @__PURE__ */
|
|
245
|
+
/* @__PURE__ */ jsx6(
|
|
293
246
|
"path",
|
|
294
247
|
{
|
|
295
248
|
d: "M54.3613 17.272C50.6666 17.272 48.1279 14.6653 48.1279 10.88C48.1279 7.09468 50.6666 4.48802 54.3613 4.48802C58.0559 4.48802 60.5946 7.09468 60.5946 10.88C60.5946 14.6653 58.0559 17.272 54.3613 17.272ZM54.3613 14.5067C56.1519 14.5067 57.2399 13.1467 57.2399 10.88C57.2399 8.61335 56.1519 7.25335 54.3613 7.25335C52.5706 7.25335 51.4826 8.61335 51.4826 10.88C51.4826 13.1467 52.5706 14.5067 54.3613 14.5067Z",
|
|
296
|
-
fill: "
|
|
249
|
+
fill: "currentColor"
|
|
297
250
|
}
|
|
298
251
|
),
|
|
299
|
-
/* @__PURE__ */
|
|
252
|
+
/* @__PURE__ */ jsx6(
|
|
300
253
|
"path",
|
|
301
254
|
{
|
|
302
255
|
d: "M40.0801 17V4.76002H43.4121V6.23335H43.5481C43.9561 5.10002 44.8401 4.48802 46.1094 4.48802H47.8094L48.0814 7.93335H45.6561C44.2054 7.93335 43.4121 8.56802 43.4121 9.74668V17H40.0801Z",
|
|
303
|
-
fill: "
|
|
256
|
+
fill: "currentColor"
|
|
304
257
|
}
|
|
305
258
|
),
|
|
306
|
-
/* @__PURE__ */
|
|
259
|
+
/* @__PURE__ */ jsx6(
|
|
307
260
|
"path",
|
|
308
261
|
{
|
|
309
262
|
d: "M26.3848 17V0.99736H33.0261C36.6981 0.99736 39.0554 3.08269 39.0554 6.34668C39.0554 9.63334 36.6981 11.764 33.0261 11.764H29.8754V17H26.3848ZM33.0261 8.72668C34.5674 8.72668 35.5647 7.82002 35.5647 6.41468C35.5647 5.00935 34.5674 4.10269 33.0261 4.10269H29.8754V8.72668H33.0261Z",
|
|
310
|
-
fill: "
|
|
263
|
+
fill: "currentColor"
|
|
311
264
|
}
|
|
312
265
|
)
|
|
313
266
|
] })
|
|
@@ -316,7 +269,9 @@ var ProvableLogo = () => {
|
|
|
316
269
|
};
|
|
317
270
|
|
|
318
271
|
// src/WalletModal.tsx
|
|
319
|
-
import { Fragment, jsx as
|
|
272
|
+
import { Fragment, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
273
|
+
var INSTALL_REDIRECT_MAX_AGE_MS = 10 * 60 * 1e3;
|
|
274
|
+
var WALLET_INSTALL_REDIRECT_KEY = "aleo-wallet-adaptor-install-redirect-timestamp";
|
|
320
275
|
var WalletModal = ({
|
|
321
276
|
className = "",
|
|
322
277
|
container = "body",
|
|
@@ -348,13 +303,28 @@ var WalletModal = ({
|
|
|
348
303
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
349
304
|
installedWallets[0]
|
|
350
305
|
) : wallets.find(
|
|
351
|
-
(wallet2) => wallet2.adapter.name
|
|
352
|
-
// TODO: Add Provable Wallet
|
|
306
|
+
(wallet2) => wallet2.adapter.name.toLowerCase().includes("shield")
|
|
353
307
|
) || wallets.find(
|
|
354
308
|
(wallet2) => wallet2.readyState === WalletReadyState2.LOADABLE
|
|
355
309
|
) || // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
356
310
|
otherWallets[0];
|
|
357
311
|
}, [installedWallets, wallets, otherWallets]);
|
|
312
|
+
useEffect(() => {
|
|
313
|
+
function handleVisibilityChange() {
|
|
314
|
+
if (document.visibilityState !== "visible") return;
|
|
315
|
+
try {
|
|
316
|
+
const raw = sessionStorage.getItem(WALLET_INSTALL_REDIRECT_KEY);
|
|
317
|
+
if (!raw) return;
|
|
318
|
+
const timestamp = Number(raw);
|
|
319
|
+
if (Number.isNaN(timestamp) || Date.now() - timestamp > INSTALL_REDIRECT_MAX_AGE_MS) return;
|
|
320
|
+
sessionStorage.removeItem(WALLET_INSTALL_REDIRECT_KEY);
|
|
321
|
+
window.location.reload();
|
|
322
|
+
} catch {
|
|
323
|
+
}
|
|
324
|
+
}
|
|
325
|
+
document.addEventListener("visibilitychange", handleVisibilityChange);
|
|
326
|
+
return () => document.removeEventListener("visibilitychange", handleVisibilityChange);
|
|
327
|
+
}, []);
|
|
358
328
|
const hideModal = useCallback2(() => {
|
|
359
329
|
setFadeIn(false);
|
|
360
330
|
setTimeout(() => setVisible(false), 150);
|
|
@@ -373,6 +343,22 @@ var WalletModal = ({
|
|
|
373
343
|
},
|
|
374
344
|
[selectWallet, handleClose]
|
|
375
345
|
);
|
|
346
|
+
const handleNotInstalledWalletClick = useCallback2(
|
|
347
|
+
(event, walletName) => {
|
|
348
|
+
event.preventDefault();
|
|
349
|
+
const wallet2 = wallets.find(
|
|
350
|
+
(wallet3) => wallet3.adapter.name === walletName
|
|
351
|
+
);
|
|
352
|
+
if (wallet2) {
|
|
353
|
+
try {
|
|
354
|
+
sessionStorage.setItem(WALLET_INSTALL_REDIRECT_KEY, String(Date.now()));
|
|
355
|
+
} catch {
|
|
356
|
+
}
|
|
357
|
+
window.open(wallet2.adapter.url, "_blank");
|
|
358
|
+
}
|
|
359
|
+
},
|
|
360
|
+
[wallets]
|
|
361
|
+
);
|
|
376
362
|
const handleCollapseClick = useCallback2(() => setExpanded(!expanded), [expanded]);
|
|
377
363
|
const handleTabKey = useCallback2(
|
|
378
364
|
(event) => {
|
|
@@ -421,7 +407,7 @@ var WalletModal = ({
|
|
|
421
407
|
}
|
|
422
408
|
}, [wallet]);
|
|
423
409
|
return portal && createPortal(
|
|
424
|
-
/* @__PURE__ */
|
|
410
|
+
/* @__PURE__ */ jsxs4(
|
|
425
411
|
"div",
|
|
426
412
|
{
|
|
427
413
|
"aria-labelledby": "wallet-adapter-modal-title",
|
|
@@ -430,12 +416,12 @@ var WalletModal = ({
|
|
|
430
416
|
ref,
|
|
431
417
|
role: "dialog",
|
|
432
418
|
children: [
|
|
433
|
-
/* @__PURE__ */
|
|
434
|
-
/* @__PURE__ */
|
|
435
|
-
installedWallets.length ? /* @__PURE__ */
|
|
436
|
-
/* @__PURE__ */
|
|
437
|
-
/* @__PURE__ */
|
|
438
|
-
installedWallets.map((wallet2) => /* @__PURE__ */
|
|
419
|
+
/* @__PURE__ */ jsx7("div", { className: "wallet-adapter-modal-container", children: /* @__PURE__ */ jsxs4("div", { className: "wallet-adapter-modal-wrapper", children: [
|
|
420
|
+
/* @__PURE__ */ jsx7("button", { onClick: handleClose, className: "wallet-adapter-modal-button-close", children: /* @__PURE__ */ jsx7("svg", { width: "14", height: "14", children: /* @__PURE__ */ jsx7("path", { d: "M14 12.461 8.3 6.772l5.234-5.233L12.006 0 6.772 5.234 1.54 0 0 1.539l5.234 5.233L0 12.006l1.539 1.528L6.772 8.3l5.69 5.7L14 12.461z" }) }) }),
|
|
421
|
+
installedWallets.length ? /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
422
|
+
/* @__PURE__ */ jsx7("h1", { className: "wallet-adapter-modal-title", children: "Connect an Aleo wallet" }),
|
|
423
|
+
/* @__PURE__ */ jsxs4("ul", { className: "wallet-adapter-modal-list", children: [
|
|
424
|
+
installedWallets.map((wallet2) => /* @__PURE__ */ jsx7(
|
|
439
425
|
WalletListItem,
|
|
440
426
|
{
|
|
441
427
|
handleClick: (event) => handleWalletClick(event, wallet2.adapter.name),
|
|
@@ -443,7 +429,7 @@ var WalletModal = ({
|
|
|
443
429
|
},
|
|
444
430
|
wallet2.adapter.name
|
|
445
431
|
)),
|
|
446
|
-
otherWallets.length ? /* @__PURE__ */
|
|
432
|
+
otherWallets.length ? /* @__PURE__ */ jsx7(Collapse, { expanded, id: "wallet-adapter-modal-collapse", children: otherWallets.map((wallet2) => /* @__PURE__ */ jsx7(
|
|
447
433
|
WalletListItem,
|
|
448
434
|
{
|
|
449
435
|
handleClick: (event) => handleWalletClick(event, wallet2.adapter.name),
|
|
@@ -453,18 +439,18 @@ var WalletModal = ({
|
|
|
453
439
|
wallet2.adapter.name
|
|
454
440
|
)) }) : null
|
|
455
441
|
] }),
|
|
456
|
-
otherWallets.length ? /* @__PURE__ */
|
|
442
|
+
otherWallets.length ? /* @__PURE__ */ jsxs4(
|
|
457
443
|
"button",
|
|
458
444
|
{
|
|
459
445
|
className: "wallet-adapter-modal-list-more",
|
|
460
446
|
onClick: handleCollapseClick,
|
|
461
447
|
tabIndex: 0,
|
|
462
448
|
children: [
|
|
463
|
-
/* @__PURE__ */
|
|
449
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
464
450
|
expanded ? "Less " : "More ",
|
|
465
451
|
"options"
|
|
466
452
|
] }),
|
|
467
|
-
/* @__PURE__ */
|
|
453
|
+
/* @__PURE__ */ jsx7(
|
|
468
454
|
"svg",
|
|
469
455
|
{
|
|
470
456
|
width: "13",
|
|
@@ -472,39 +458,36 @@ var WalletModal = ({
|
|
|
472
458
|
viewBox: "0 0 13 7",
|
|
473
459
|
xmlns: "http://www.w3.org/2000/svg",
|
|
474
460
|
className: `${expanded ? "wallet-adapter-modal-list-more-icon-rotate" : ""}`,
|
|
475
|
-
children: /* @__PURE__ */
|
|
461
|
+
children: /* @__PURE__ */ jsx7("path", { d: "M0.71418 1.626L5.83323 6.26188C5.91574 6.33657 6.0181 6.39652 6.13327 6.43762C6.24844 6.47872 6.37371 6.5 6.50048 6.5C6.62725 6.5 6.75252 6.47872 6.8677 6.43762C6.98287 6.39652 7.08523 6.33657 7.16774 6.26188L12.2868 1.626C12.7753 1.1835 12.3703 0.5 11.6195 0.5H1.37997C0.629216 0.5 0.224175 1.1835 0.71418 1.626Z" })
|
|
476
462
|
}
|
|
477
463
|
)
|
|
478
464
|
]
|
|
479
465
|
}
|
|
480
466
|
) : null
|
|
481
|
-
] }) : /* @__PURE__ */
|
|
482
|
-
/* @__PURE__ */
|
|
483
|
-
/* @__PURE__ */
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
"button",
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
] }),
|
|
495
|
-
otherWallets.length ? /* @__PURE__ */ jsxs5(Fragment, { children: [
|
|
496
|
-
/* @__PURE__ */ jsxs5(
|
|
467
|
+
] }) : /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
468
|
+
/* @__PURE__ */ jsx7("h1", { className: "wallet-adapter-modal-title", children: "Get an Aleo wallet to continue" }),
|
|
469
|
+
/* @__PURE__ */ jsx7("div", { className: "wallet-adapter-modal-middle", children: /* @__PURE__ */ jsx7(
|
|
470
|
+
"button",
|
|
471
|
+
{
|
|
472
|
+
type: "button",
|
|
473
|
+
className: "wallet-adapter-modal-middle-button",
|
|
474
|
+
onClick: (event) => handleNotInstalledWalletClick(event, getStartedWallet?.adapter.name),
|
|
475
|
+
children: "Get started"
|
|
476
|
+
}
|
|
477
|
+
) }),
|
|
478
|
+
otherWallets.length ? /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
479
|
+
/* @__PURE__ */ jsxs4(
|
|
497
480
|
"button",
|
|
498
481
|
{
|
|
499
482
|
className: "wallet-adapter-modal-list-more",
|
|
500
483
|
onClick: handleCollapseClick,
|
|
501
484
|
tabIndex: 0,
|
|
502
485
|
children: [
|
|
503
|
-
/* @__PURE__ */
|
|
486
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
504
487
|
expanded ? "Hide " : "View other ",
|
|
505
488
|
"options"
|
|
506
489
|
] }),
|
|
507
|
-
/* @__PURE__ */
|
|
490
|
+
/* @__PURE__ */ jsx7(
|
|
508
491
|
"svg",
|
|
509
492
|
{
|
|
510
493
|
width: "13",
|
|
@@ -512,16 +495,16 @@ var WalletModal = ({
|
|
|
512
495
|
viewBox: "0 0 13 7",
|
|
513
496
|
xmlns: "http://www.w3.org/2000/svg",
|
|
514
497
|
className: `${expanded ? "wallet-adapter-modal-list-more-icon-rotate" : ""}`,
|
|
515
|
-
children: /* @__PURE__ */
|
|
498
|
+
children: /* @__PURE__ */ jsx7("path", { d: "M0.71418 1.626L5.83323 6.26188C5.91574 6.33657 6.0181 6.39652 6.13327 6.43762C6.24844 6.47872 6.37371 6.5 6.50048 6.5C6.62725 6.5 6.75252 6.47872 6.8677 6.43762C6.98287 6.39652 7.08523 6.33657 7.16774 6.26188L12.2868 1.626C12.7753 1.1835 12.3703 0.5 11.6195 0.5H1.37997C0.629216 0.5 0.224175 1.1835 0.71418 1.626Z" })
|
|
516
499
|
}
|
|
517
500
|
)
|
|
518
501
|
]
|
|
519
502
|
}
|
|
520
503
|
),
|
|
521
|
-
/* @__PURE__ */
|
|
504
|
+
/* @__PURE__ */ jsx7(Collapse, { expanded, id: "wallet-adapter-modal-collapse", children: /* @__PURE__ */ jsx7("ul", { className: "wallet-adapter-modal-list", children: otherWallets.map((wallet2) => /* @__PURE__ */ jsx7(
|
|
522
505
|
WalletListItem,
|
|
523
506
|
{
|
|
524
|
-
handleClick: (event) =>
|
|
507
|
+
handleClick: (event) => handleNotInstalledWalletClick(event, wallet2.adapter.name),
|
|
525
508
|
tabIndex: expanded ? 0 : -1,
|
|
526
509
|
wallet: wallet2
|
|
527
510
|
},
|
|
@@ -529,18 +512,18 @@ var WalletModal = ({
|
|
|
529
512
|
)) }) })
|
|
530
513
|
] }) : null
|
|
531
514
|
] }),
|
|
532
|
-
/* @__PURE__ */
|
|
515
|
+
/* @__PURE__ */ jsx7(
|
|
533
516
|
"a",
|
|
534
517
|
{
|
|
535
518
|
className: "wallet-adapter-modal-footer",
|
|
536
519
|
href: "https://provable.com/",
|
|
537
520
|
target: "_blank",
|
|
538
521
|
rel: "noopener noreferrer",
|
|
539
|
-
children: /* @__PURE__ */
|
|
522
|
+
children: /* @__PURE__ */ jsx7(ProvableLogo, {})
|
|
540
523
|
}
|
|
541
524
|
)
|
|
542
525
|
] }) }),
|
|
543
|
-
/* @__PURE__ */
|
|
526
|
+
/* @__PURE__ */ jsx7("div", { className: "wallet-adapter-modal-overlay", onMouseDown: handleClose })
|
|
544
527
|
]
|
|
545
528
|
}
|
|
546
529
|
),
|
|
@@ -550,7 +533,7 @@ var WalletModal = ({
|
|
|
550
533
|
|
|
551
534
|
// src/WalletModalButton.tsx
|
|
552
535
|
import { useCallback as useCallback3 } from "react";
|
|
553
|
-
import { jsx as
|
|
536
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
554
537
|
var WalletModalButton = ({
|
|
555
538
|
children = "Connect Wallet",
|
|
556
539
|
onClick,
|
|
@@ -564,15 +547,15 @@ var WalletModalButton = ({
|
|
|
564
547
|
},
|
|
565
548
|
[onClick, setVisible, visible]
|
|
566
549
|
);
|
|
567
|
-
return /* @__PURE__ */
|
|
550
|
+
return /* @__PURE__ */ jsx8(Button, { className: "wallet-adapter-button-trigger", onClick: handleClick, ...props, children });
|
|
568
551
|
};
|
|
569
552
|
|
|
570
553
|
// src/WalletModalProvider.tsx
|
|
571
554
|
import { useState as useState2 } from "react";
|
|
572
|
-
import { jsx as
|
|
555
|
+
import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
573
556
|
var WalletModalProvider = ({ children, ...props }) => {
|
|
574
557
|
const [visible, setVisible] = useState2(false);
|
|
575
|
-
return /* @__PURE__ */
|
|
558
|
+
return /* @__PURE__ */ jsxs5(
|
|
576
559
|
WalletModalContext.Provider,
|
|
577
560
|
{
|
|
578
561
|
value: {
|
|
@@ -581,7 +564,7 @@ var WalletModalProvider = ({ children, ...props }) => {
|
|
|
581
564
|
},
|
|
582
565
|
children: [
|
|
583
566
|
children,
|
|
584
|
-
visible && /* @__PURE__ */
|
|
567
|
+
visible && /* @__PURE__ */ jsx9(WalletModal, { ...props })
|
|
585
568
|
]
|
|
586
569
|
}
|
|
587
570
|
);
|
|
@@ -590,7 +573,7 @@ var WalletModalProvider = ({ children, ...props }) => {
|
|
|
590
573
|
// src/WalletDisconnectButton.tsx
|
|
591
574
|
import { useCallback as useCallback4, useMemo as useMemo3 } from "react";
|
|
592
575
|
import { useWallet as useWallet3 } from "@provablehq/aleo-wallet-adaptor-react";
|
|
593
|
-
import { jsx as
|
|
576
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
594
577
|
var WalletDisconnectButton = ({
|
|
595
578
|
children,
|
|
596
579
|
disabled,
|
|
@@ -612,12 +595,12 @@ var WalletDisconnectButton = ({
|
|
|
612
595
|
if (wallet) return "Disconnect";
|
|
613
596
|
return "Disconnect Wallet";
|
|
614
597
|
}, [children, disconnecting, wallet]);
|
|
615
|
-
return /* @__PURE__ */
|
|
598
|
+
return /* @__PURE__ */ jsx10(
|
|
616
599
|
Button,
|
|
617
600
|
{
|
|
618
601
|
className: "wallet-adapter-button-trigger",
|
|
619
602
|
disabled: disabled || !wallet,
|
|
620
|
-
startIcon: wallet ? /* @__PURE__ */
|
|
603
|
+
startIcon: wallet ? /* @__PURE__ */ jsx10(WalletIcon, { wallet }) : void 0,
|
|
621
604
|
onClick: handleClick,
|
|
622
605
|
...props,
|
|
623
606
|
children: content
|
|
@@ -626,12 +609,12 @@ var WalletDisconnectButton = ({
|
|
|
626
609
|
};
|
|
627
610
|
|
|
628
611
|
// src/WalletMultiButton.tsx
|
|
629
|
-
import { useCallback as useCallback5, useEffect, useMemo as useMemo4, useRef as useRef3, useState as useState3 } from "react";
|
|
612
|
+
import { useCallback as useCallback5, useEffect as useEffect2, useMemo as useMemo4, useRef as useRef3, useState as useState3 } from "react";
|
|
630
613
|
import { useWallet as useWallet4 } from "@provablehq/aleo-wallet-adaptor-react";
|
|
631
614
|
|
|
632
615
|
// src/icons.tsx
|
|
633
|
-
import { jsx as
|
|
634
|
-
var CopyIcon = () => /* @__PURE__ */
|
|
616
|
+
import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
617
|
+
var CopyIcon = () => /* @__PURE__ */ jsxs6(
|
|
635
618
|
"svg",
|
|
636
619
|
{
|
|
637
620
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -644,12 +627,12 @@ var CopyIcon = () => /* @__PURE__ */ jsxs7(
|
|
|
644
627
|
strokeLinecap: "round",
|
|
645
628
|
strokeLinejoin: "round",
|
|
646
629
|
children: [
|
|
647
|
-
/* @__PURE__ */
|
|
648
|
-
/* @__PURE__ */
|
|
630
|
+
/* @__PURE__ */ jsx11("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
|
|
631
|
+
/* @__PURE__ */ jsx11("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
|
|
649
632
|
]
|
|
650
633
|
}
|
|
651
634
|
);
|
|
652
|
-
var CheckIcon = () => /* @__PURE__ */
|
|
635
|
+
var CheckIcon = () => /* @__PURE__ */ jsx11(
|
|
653
636
|
"svg",
|
|
654
637
|
{
|
|
655
638
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -661,10 +644,10 @@ var CheckIcon = () => /* @__PURE__ */ jsx12(
|
|
|
661
644
|
strokeWidth: "2",
|
|
662
645
|
strokeLinecap: "round",
|
|
663
646
|
strokeLinejoin: "round",
|
|
664
|
-
children: /* @__PURE__ */
|
|
647
|
+
children: /* @__PURE__ */ jsx11("path", { d: "M20 6 9 17l-5-5" })
|
|
665
648
|
}
|
|
666
649
|
);
|
|
667
|
-
var GenericWalletIcon = () => /* @__PURE__ */
|
|
650
|
+
var GenericWalletIcon = () => /* @__PURE__ */ jsxs6(
|
|
668
651
|
"svg",
|
|
669
652
|
{
|
|
670
653
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -677,14 +660,14 @@ var GenericWalletIcon = () => /* @__PURE__ */ jsxs7(
|
|
|
677
660
|
strokeLinecap: "round",
|
|
678
661
|
strokeLinejoin: "round",
|
|
679
662
|
children: [
|
|
680
|
-
/* @__PURE__ */
|
|
681
|
-
/* @__PURE__ */
|
|
663
|
+
/* @__PURE__ */ jsx11("path", { d: "M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1" }),
|
|
664
|
+
/* @__PURE__ */ jsx11("path", { d: "M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4" })
|
|
682
665
|
]
|
|
683
666
|
}
|
|
684
667
|
);
|
|
685
668
|
|
|
686
669
|
// src/WalletMultiButton.tsx
|
|
687
|
-
import { Fragment as Fragment2, jsx as
|
|
670
|
+
import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
688
671
|
var WalletMultiButton = ({ children, ...props }) => {
|
|
689
672
|
const { address, wallet, disconnect } = useWallet4();
|
|
690
673
|
const { setVisible } = useWalletModal();
|
|
@@ -718,7 +701,7 @@ var WalletMultiButton = ({ children, ...props }) => {
|
|
|
718
701
|
disconnect();
|
|
719
702
|
closeDropdown();
|
|
720
703
|
}, [disconnect, closeDropdown]);
|
|
721
|
-
|
|
704
|
+
useEffect2(() => {
|
|
722
705
|
const listener = (event) => {
|
|
723
706
|
const node = ref.current;
|
|
724
707
|
if (!node || node.contains(event.target)) return;
|
|
@@ -731,22 +714,22 @@ var WalletMultiButton = ({ children, ...props }) => {
|
|
|
731
714
|
document.removeEventListener("touchstart", listener);
|
|
732
715
|
};
|
|
733
716
|
}, [ref, closeDropdown]);
|
|
734
|
-
if (!wallet) return /* @__PURE__ */
|
|
735
|
-
if (!base58) return /* @__PURE__ */
|
|
736
|
-
return /* @__PURE__ */
|
|
737
|
-
/* @__PURE__ */
|
|
717
|
+
if (!wallet) return /* @__PURE__ */ jsx12(WalletModalButton, { ...props, children });
|
|
718
|
+
if (!base58) return /* @__PURE__ */ jsx12(WalletConnectButton, { ...props, children });
|
|
719
|
+
return /* @__PURE__ */ jsxs7("div", { className: "wallet-adapter-dropdown", children: [
|
|
720
|
+
/* @__PURE__ */ jsx12(
|
|
738
721
|
Button,
|
|
739
722
|
{
|
|
740
723
|
"aria-expanded": active,
|
|
741
724
|
className: "wallet-adapter-button-trigger",
|
|
742
725
|
style: { pointerEvents: active ? "none" : "auto", ...props.style },
|
|
743
726
|
onClick: openDropdown,
|
|
744
|
-
startIcon: /* @__PURE__ */
|
|
727
|
+
startIcon: /* @__PURE__ */ jsx12(WalletIcon, { wallet }),
|
|
745
728
|
...props,
|
|
746
729
|
children: content
|
|
747
730
|
}
|
|
748
731
|
),
|
|
749
|
-
/* @__PURE__ */
|
|
732
|
+
/* @__PURE__ */ jsxs7(
|
|
750
733
|
"ul",
|
|
751
734
|
{
|
|
752
735
|
"aria-label": "dropdown-list",
|
|
@@ -754,18 +737,18 @@ var WalletMultiButton = ({ children, ...props }) => {
|
|
|
754
737
|
ref,
|
|
755
738
|
role: "menu",
|
|
756
739
|
children: [
|
|
757
|
-
/* @__PURE__ */
|
|
740
|
+
/* @__PURE__ */ jsx12("li", { onClick: copyAddress, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: copied ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
|
|
758
741
|
"Copied",
|
|
759
|
-
/* @__PURE__ */
|
|
760
|
-
] }) : /* @__PURE__ */
|
|
742
|
+
/* @__PURE__ */ jsx12(CheckIcon, {})
|
|
743
|
+
] }) : /* @__PURE__ */ jsxs7(Fragment2, { children: [
|
|
761
744
|
"Copy address ",
|
|
762
|
-
/* @__PURE__ */
|
|
745
|
+
/* @__PURE__ */ jsx12(CopyIcon, {})
|
|
763
746
|
] }) }),
|
|
764
|
-
/* @__PURE__ */
|
|
747
|
+
/* @__PURE__ */ jsxs7("li", { onClick: openModal, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: [
|
|
765
748
|
"Change wallet ",
|
|
766
|
-
/* @__PURE__ */
|
|
749
|
+
/* @__PURE__ */ jsx12(GenericWalletIcon, {})
|
|
767
750
|
] }),
|
|
768
|
-
/* @__PURE__ */
|
|
751
|
+
/* @__PURE__ */ jsx12("li", { onClick: onDisconnect, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: "Disconnect" })
|
|
769
752
|
]
|
|
770
753
|
}
|
|
771
754
|
)
|