@zerodev/wallet-react-ui 0.0.1 → 0.0.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/dist/_types/auth/index.d.ts +2 -1
- package/dist/_types/auth/index.d.ts.map +1 -1
- package/dist/_types/shared/components/PoweredBy/index.d.ts.map +1 -1
- package/dist/_types/shared/components/Screen/index.d.ts +2 -1
- package/dist/_types/shared/components/Screen/index.d.ts.map +1 -1
- package/dist/_types/shared/components/TopNav/index.d.ts.map +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +269 -258
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +2 -2
- package/src/auth/index.tsx +3 -0
- package/src/shared/components/PoweredBy/index.tsx +1 -5
- package/src/shared/components/Screen/index.tsx +24 -4
- package/src/shared/components/TopNav/index.tsx +4 -1
package/dist/index.mjs
CHANGED
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useId as D, useState as
|
|
1
|
+
import { jsxs as d, jsx as t, Fragment as b } from "react/jsx-runtime";
|
|
2
|
+
import { useId as D, useState as w, useEffect as P, useMemo as ie, useRef as K } from "react";
|
|
3
3
|
import { useStore as O, create as se } from "zustand";
|
|
4
|
-
import { cn as R, IconButton as q, Text as h, Icon as X, Button as C, Wrapper as
|
|
4
|
+
import { cn as R, IconButton as q, Text as h, Icon as X, Button as C, Wrapper as ae, ListItem as Y, Input as de } from "@zerodev/react-ui";
|
|
5
5
|
import { useConfig as le, useConnect as ce } from "wagmi";
|
|
6
6
|
import { useSendMagicLink as J, useSendOTP as Q, useVerifyOTP as ue, useAuthenticateOAuth as pe, useRegisterPasskey as fe, useLoginPasskey as he, useVerifyMagicLink as ze, zeroDevWallet as me, NotAuthenticatedError as ge } from "@zerodev/wallet-react";
|
|
7
7
|
import { subscribeWithSelector as ye } from "zustand/middleware";
|
|
8
8
|
const Z = 52;
|
|
9
9
|
function xe({
|
|
10
10
|
onBack: e,
|
|
11
|
-
onClose:
|
|
12
|
-
title:
|
|
11
|
+
onClose: i,
|
|
12
|
+
title: r,
|
|
13
13
|
logo: n,
|
|
14
|
-
className:
|
|
14
|
+
className: o
|
|
15
15
|
}) {
|
|
16
|
-
return /* @__PURE__ */
|
|
16
|
+
return /* @__PURE__ */ d(
|
|
17
17
|
"div",
|
|
18
18
|
{
|
|
19
19
|
className: R(
|
|
20
20
|
"zd:absolute zd:top-4 zd:left-0 zd:right-0 zd:flex zd:flex-row zd:items-center zd:justify-between",
|
|
21
|
-
|
|
21
|
+
o
|
|
22
22
|
),
|
|
23
|
-
style: { height: Z },
|
|
23
|
+
style: { height: `calc(${Z / 4} * var(--zd-spacing))` },
|
|
24
24
|
children: [
|
|
25
25
|
e ? /* @__PURE__ */ t(q, { iconName: "chevronLeft", onClick: e }) : /* @__PURE__ */ t("div", { className: "zd:h-13 zd:w-13" }),
|
|
26
26
|
n && /* @__PURE__ */ t("div", { className: "zd:absolute zd:left-0 zd:right-0 zd:flex zd:items-center zd:justify-center zd:pointer-events-none", children: n }),
|
|
27
|
-
|
|
28
|
-
/* @__PURE__ */ t(q, { iconName: "x", onClick:
|
|
27
|
+
r && /* @__PURE__ */ t("div", { className: "zd:absolute zd:left-0 zd:right-0 zd:flex zd:items-center zd:justify-center zd:pointer-events-none", children: /* @__PURE__ */ t(h, { className: "zd:text-body1", children: r }) }),
|
|
28
|
+
/* @__PURE__ */ t(q, { iconName: "x", onClick: i })
|
|
29
29
|
]
|
|
30
30
|
}
|
|
31
31
|
);
|
|
32
32
|
}
|
|
33
33
|
function we({
|
|
34
34
|
layer: e,
|
|
35
|
-
rect:
|
|
35
|
+
rect: i
|
|
36
36
|
}) {
|
|
37
|
-
const { id:
|
|
38
|
-
return /* @__PURE__ */
|
|
37
|
+
const { id: r, matrix: n, fillOpacity: o, stops: c } = e;
|
|
38
|
+
return /* @__PURE__ */ d(b, { children: [
|
|
39
39
|
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t(
|
|
40
40
|
"radialGradient",
|
|
41
41
|
{
|
|
42
|
-
id:
|
|
42
|
+
id: r,
|
|
43
43
|
cx: "0",
|
|
44
44
|
cy: "0",
|
|
45
45
|
r: "1",
|
|
@@ -59,12 +59,12 @@ function we({
|
|
|
59
59
|
/* @__PURE__ */ t(
|
|
60
60
|
"rect",
|
|
61
61
|
{
|
|
62
|
-
x:
|
|
63
|
-
y:
|
|
64
|
-
width:
|
|
65
|
-
height:
|
|
66
|
-
fill: `url(#${
|
|
67
|
-
fillOpacity:
|
|
62
|
+
x: i.x,
|
|
63
|
+
y: i.y,
|
|
64
|
+
width: i.width,
|
|
65
|
+
height: i.height,
|
|
66
|
+
fill: `url(#${r})`,
|
|
67
|
+
fillOpacity: o
|
|
68
68
|
}
|
|
69
69
|
)
|
|
70
70
|
] });
|
|
@@ -85,7 +85,7 @@ function Ne() {
|
|
|
85
85
|
) });
|
|
86
86
|
}
|
|
87
87
|
function Se() {
|
|
88
|
-
const e = D(),
|
|
88
|
+
const e = D(), i = [
|
|
89
89
|
{
|
|
90
90
|
// (CSS #6) blue → top-right. x-radius widened so the lobe reaches further
|
|
91
91
|
// left; y-radius kept short so it stays up top and doesn't bleed into the
|
|
@@ -151,7 +151,7 @@ function Se() {
|
|
|
151
151
|
]
|
|
152
152
|
}
|
|
153
153
|
];
|
|
154
|
-
return /* @__PURE__ */ t("div", { className: "zd:absolute zd:inset-0 zd:z-0 zd:rounded-4xl zd:pointer-events-none zd:overflow-hidden", children: /* @__PURE__ */
|
|
154
|
+
return /* @__PURE__ */ t("div", { className: "zd:absolute zd:inset-0 zd:z-0 zd:rounded-4xl zd:pointer-events-none zd:overflow-hidden", children: /* @__PURE__ */ d(
|
|
155
155
|
"svg",
|
|
156
156
|
{
|
|
157
157
|
width: "100%",
|
|
@@ -160,15 +160,15 @@ function Se() {
|
|
|
160
160
|
preserveAspectRatio: "none",
|
|
161
161
|
role: "presentation",
|
|
162
162
|
children: [
|
|
163
|
-
|
|
163
|
+
i.map((r) => /* @__PURE__ */ t(
|
|
164
164
|
we,
|
|
165
165
|
{
|
|
166
|
-
layer:
|
|
166
|
+
layer: r,
|
|
167
167
|
rect: { x: 0, y: 0, width: 400, height: 800 }
|
|
168
168
|
},
|
|
169
|
-
|
|
169
|
+
r.id
|
|
170
170
|
)),
|
|
171
|
-
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */
|
|
171
|
+
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ d(
|
|
172
172
|
"linearGradient",
|
|
173
173
|
{
|
|
174
174
|
id: `${e}-vfade`,
|
|
@@ -196,7 +196,7 @@ function Se() {
|
|
|
196
196
|
fill: `url(#${e}-vfade)`
|
|
197
197
|
}
|
|
198
198
|
),
|
|
199
|
-
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */
|
|
199
|
+
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ d(
|
|
200
200
|
"linearGradient",
|
|
201
201
|
{
|
|
202
202
|
id: `${e}-bluefade`,
|
|
@@ -228,7 +228,7 @@ function Se() {
|
|
|
228
228
|
) });
|
|
229
229
|
}
|
|
230
230
|
function Ee() {
|
|
231
|
-
const e = D(),
|
|
231
|
+
const e = D(), i = [
|
|
232
232
|
{
|
|
233
233
|
id: `${e}-g6`,
|
|
234
234
|
// (CSS #6) blue, top-right
|
|
@@ -304,7 +304,7 @@ function Ee() {
|
|
|
304
304
|
]
|
|
305
305
|
}
|
|
306
306
|
];
|
|
307
|
-
return /* @__PURE__ */ t("div", { className: "zd:absolute zd:inset-0 zd:z-0 zd:rounded-4xl zd:pointer-events-none zd:overflow-hidden", children: /* @__PURE__ */
|
|
307
|
+
return /* @__PURE__ */ t("div", { className: "zd:absolute zd:inset-0 zd:z-0 zd:rounded-4xl zd:pointer-events-none zd:overflow-hidden", children: /* @__PURE__ */ d(
|
|
308
308
|
"svg",
|
|
309
309
|
{
|
|
310
310
|
width: "100%",
|
|
@@ -313,35 +313,35 @@ function Ee() {
|
|
|
313
313
|
role: "presentation",
|
|
314
314
|
children: [
|
|
315
315
|
/* @__PURE__ */ t("rect", { width: "100%", height: "100%", fill: "#130E0B" }),
|
|
316
|
-
/* @__PURE__ */ t("defs", { children:
|
|
316
|
+
/* @__PURE__ */ t("defs", { children: i.map((r) => /* @__PURE__ */ t(
|
|
317
317
|
"radialGradient",
|
|
318
318
|
{
|
|
319
|
-
id:
|
|
320
|
-
cx: `${
|
|
321
|
-
cy: `${
|
|
319
|
+
id: r.id,
|
|
320
|
+
cx: `${r.cx / r.rx * 100}%`,
|
|
321
|
+
cy: `${r.cy / r.ry * 100}%`,
|
|
322
322
|
r: "100%",
|
|
323
323
|
gradientUnits: "objectBoundingBox",
|
|
324
|
-
gradientTransform: `scale(${
|
|
325
|
-
children:
|
|
324
|
+
gradientTransform: `scale(${r.rx}, ${r.ry})`,
|
|
325
|
+
children: r.stops.map((n, o) => /* @__PURE__ */ t(
|
|
326
326
|
"stop",
|
|
327
327
|
{
|
|
328
328
|
offset: n.offset,
|
|
329
329
|
stopColor: n.color,
|
|
330
330
|
stopOpacity: n.opacity
|
|
331
331
|
},
|
|
332
|
-
n.color +
|
|
332
|
+
n.color + o.toString()
|
|
333
333
|
))
|
|
334
334
|
},
|
|
335
|
-
|
|
335
|
+
r.id
|
|
336
336
|
)) }),
|
|
337
|
-
|
|
337
|
+
i.map((r) => /* @__PURE__ */ t(
|
|
338
338
|
"rect",
|
|
339
339
|
{
|
|
340
340
|
width: "100%",
|
|
341
341
|
height: "100%",
|
|
342
|
-
fill: `url(#${
|
|
342
|
+
fill: `url(#${r.id})`
|
|
343
343
|
},
|
|
344
|
-
`${
|
|
344
|
+
`${r.id}-rect`
|
|
345
345
|
))
|
|
346
346
|
]
|
|
347
347
|
}
|
|
@@ -350,41 +350,57 @@ function Ee() {
|
|
|
350
350
|
const be = Z + 16;
|
|
351
351
|
function Ce({
|
|
352
352
|
children: e,
|
|
353
|
-
className:
|
|
354
|
-
contentClassName:
|
|
355
|
-
|
|
356
|
-
|
|
353
|
+
className: i,
|
|
354
|
+
contentClassName: r,
|
|
355
|
+
size: n = "lg",
|
|
356
|
+
style: o,
|
|
357
|
+
topNav: c
|
|
357
358
|
}) {
|
|
358
|
-
return /* @__PURE__ */
|
|
359
|
+
return /* @__PURE__ */ d(
|
|
359
360
|
"div",
|
|
360
361
|
{
|
|
362
|
+
"data-zd-size": n,
|
|
361
363
|
className: R(
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
364
|
+
// 400×810 by default, but never taller/wider than the parent — a
|
|
365
|
+
// consumer wrapper with its own size caps the Screen (max-w/h-full =
|
|
366
|
+
// 100% of the parent). overflow-hidden clips the frame to its rounded
|
|
367
|
+
// border ring; content scrolls in the inner div below.
|
|
368
|
+
"zd:relative zd:flex zd:flex-col zd:text-left",
|
|
369
|
+
// w-100 = 400px, h-202.5 = 810px at density 1; both compile to
|
|
370
|
+
// calc(var(--zd-spacing) * N), so they scale with the size variants.
|
|
371
|
+
// rounded-[38px] = inner card radius (32px) + the 6px border-ring gap,
|
|
372
|
+
// so the ring has a uniform width — equal inner/outer radii would make
|
|
373
|
+
// the corners read thicker than the sides.
|
|
374
|
+
"zd:w-100 zd:h-202.5 zd:max-w-full zd:max-h-full zd:overflow-hidden zd:rounded-[38px]",
|
|
375
|
+
i
|
|
366
376
|
),
|
|
367
|
-
style:
|
|
377
|
+
style: o,
|
|
368
378
|
children: [
|
|
369
379
|
/* @__PURE__ */ t(Ee, {}),
|
|
370
|
-
/* @__PURE__ */
|
|
380
|
+
/* @__PURE__ */ d(
|
|
371
381
|
"div",
|
|
372
382
|
{
|
|
373
383
|
className: R(
|
|
384
|
+
// m-1.5 = calc(var(--zd-spacing) * 1.5) = 6px at density 1, so the
|
|
385
|
+
// gradient border ring thins with the size variants. (Corner radii
|
|
386
|
+
// stay fixed, so at smaller sizes the ring is marginally non-uniform
|
|
387
|
+
// at the corners — a minor cosmetic trade-off.)
|
|
374
388
|
"zd:flex zd:flex-1 zd:flex-col zd:m-1.5 zd:px-4 zd:overflow-hidden zd:rounded-4xl zd:relative",
|
|
375
|
-
|
|
389
|
+
r
|
|
376
390
|
),
|
|
377
391
|
style: { clipPath: "inset(0 round 32px)" },
|
|
378
392
|
children: [
|
|
379
393
|
/* @__PURE__ */ t(Ne, {}),
|
|
380
394
|
/* @__PURE__ */ t(Se, {}),
|
|
381
|
-
/* @__PURE__ */
|
|
382
|
-
|
|
395
|
+
/* @__PURE__ */ d("div", { className: "zd:relative zd:z-10 zd:flex zd:flex-1 zd:flex-col zd:min-h-0", children: [
|
|
396
|
+
c,
|
|
383
397
|
/* @__PURE__ */ t(
|
|
384
398
|
"div",
|
|
385
399
|
{
|
|
386
400
|
className: "zd:flex zd:flex-1 zd:flex-col zd:min-h-0 zd:overflow-y-auto zd:overflow-x-hidden",
|
|
387
|
-
style: {
|
|
401
|
+
style: {
|
|
402
|
+
paddingTop: `calc(${be / 4} * var(--zd-spacing))`
|
|
403
|
+
},
|
|
388
404
|
children: e
|
|
389
405
|
}
|
|
390
406
|
)
|
|
@@ -404,11 +420,11 @@ const ke = "" + new URL("error.webp", import.meta.url).href, Ae = "" + new URL("
|
|
|
404
420
|
};
|
|
405
421
|
function I({
|
|
406
422
|
imageName: e,
|
|
407
|
-
title:
|
|
408
|
-
children:
|
|
423
|
+
title: i,
|
|
424
|
+
children: r,
|
|
409
425
|
className: n
|
|
410
426
|
}) {
|
|
411
|
-
return /* @__PURE__ */
|
|
427
|
+
return /* @__PURE__ */ d(
|
|
412
428
|
"div",
|
|
413
429
|
{
|
|
414
430
|
className: R("zd:flex zd:flex-col zd:gap-8 zd:items-center", n),
|
|
@@ -421,34 +437,34 @@ function I({
|
|
|
421
437
|
className: "zd:w-[118px] zd:h-[118px] zd:bg-transparent"
|
|
422
438
|
}
|
|
423
439
|
),
|
|
424
|
-
/* @__PURE__ */
|
|
425
|
-
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center zd:whitespace-pre-wrap", children:
|
|
426
|
-
/* @__PURE__ */ t(h, { className: "zd:text-center zd:whitespace-pre-wrap", children:
|
|
440
|
+
/* @__PURE__ */ d("div", { className: "zd:flex zd:flex-col zd:gap-4 zd:items-center", children: [
|
|
441
|
+
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center zd:whitespace-pre-wrap", children: i }),
|
|
442
|
+
/* @__PURE__ */ t(h, { className: "zd:text-center zd:whitespace-pre-wrap", children: r })
|
|
427
443
|
] })
|
|
428
444
|
]
|
|
429
445
|
}
|
|
430
446
|
);
|
|
431
447
|
}
|
|
432
448
|
function ee() {
|
|
433
|
-
const
|
|
434
|
-
if (!
|
|
449
|
+
const i = le().connectors.find((r) => r.id === "zerodev-wallet");
|
|
450
|
+
if (!i || !("getKitStore" in i))
|
|
435
451
|
throw new Error("useKitStore must be used with the zeroDevWallet connector");
|
|
436
|
-
return
|
|
452
|
+
return i.getKitStore();
|
|
437
453
|
}
|
|
438
454
|
function F() {
|
|
439
|
-
const e = ee(),
|
|
455
|
+
const e = ee(), i = O(e, (l) => l.auth.step), r = O(e, (l) => l.auth.stepHistory), n = O(e, (l) => l.auth.email), o = O(e, (l) => l.auth.otpId), c = O(
|
|
440
456
|
e,
|
|
441
457
|
(l) => l.auth.otpEncryptionTargetBundle
|
|
442
458
|
), s = O(e, (l) => l.auth.enabledMethods), u = O(e, (l) => l.auth.config);
|
|
443
459
|
return {
|
|
444
|
-
step:
|
|
460
|
+
step: i,
|
|
445
461
|
email: n,
|
|
446
|
-
otpId:
|
|
462
|
+
otpId: o,
|
|
447
463
|
otpEncryptionTargetBundle: c,
|
|
448
464
|
enabledMethods: s,
|
|
449
465
|
config: u,
|
|
450
466
|
goToStep: e.getState().auth.goToStep,
|
|
451
|
-
goBack:
|
|
467
|
+
goBack: r.length > 0 ? e.getState().auth.goBack : null,
|
|
452
468
|
reset: e.getState().auth.reset,
|
|
453
469
|
setEmail: e.getState().auth.setEmail,
|
|
454
470
|
setOtpSession: e.getState().auth.setOtpSession,
|
|
@@ -457,9 +473,9 @@ function F() {
|
|
|
457
473
|
}
|
|
458
474
|
function L({
|
|
459
475
|
className: e,
|
|
460
|
-
style:
|
|
476
|
+
style: i
|
|
461
477
|
}) {
|
|
462
|
-
return /* @__PURE__ */
|
|
478
|
+
return /* @__PURE__ */ d(
|
|
463
479
|
"div",
|
|
464
480
|
{
|
|
465
481
|
className: R(
|
|
@@ -468,31 +484,24 @@ function L({
|
|
|
468
484
|
),
|
|
469
485
|
children: [
|
|
470
486
|
/* @__PURE__ */ t(h, { children: "Powered by" }),
|
|
471
|
-
/* @__PURE__ */ t(
|
|
472
|
-
X,
|
|
473
|
-
{
|
|
474
|
-
name: "zerodevLogo",
|
|
475
|
-
className: "zd:h-[18px] zd:w-auto",
|
|
476
|
-
style: o
|
|
477
|
-
}
|
|
478
|
-
)
|
|
487
|
+
/* @__PURE__ */ t(X, { name: "zerodevLogo", className: "zd:h-4.5 zd:w-auto", style: i })
|
|
479
488
|
]
|
|
480
489
|
}
|
|
481
490
|
);
|
|
482
491
|
}
|
|
483
492
|
function Ie() {
|
|
484
|
-
const { email: e, setOtpSession:
|
|
493
|
+
const { email: e, setOtpSession: i } = F(), { mutateAsync: r, isPending: n } = J(), [o, c] = w(60), s = o <= 0 && !n;
|
|
485
494
|
return P(() => {
|
|
486
|
-
if (
|
|
495
|
+
if (o <= 0) return;
|
|
487
496
|
const l = setInterval(() => {
|
|
488
497
|
c((p) => Math.max(0, p - 1));
|
|
489
498
|
}, 1e3);
|
|
490
499
|
return () => {
|
|
491
500
|
clearInterval(l);
|
|
492
501
|
};
|
|
493
|
-
}, [
|
|
494
|
-
/* @__PURE__ */
|
|
495
|
-
/* @__PURE__ */
|
|
502
|
+
}, [o]), /* @__PURE__ */ d(b, { children: [
|
|
503
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:gap-8 zd:justify-center", children: [
|
|
504
|
+
/* @__PURE__ */ d(
|
|
496
505
|
I,
|
|
497
506
|
{
|
|
498
507
|
imageName: "send",
|
|
@@ -508,7 +517,7 @@ function Ie() {
|
|
|
508
517
|
]
|
|
509
518
|
}
|
|
510
519
|
),
|
|
511
|
-
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-1", children: /* @__PURE__ */
|
|
520
|
+
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-1", children: /* @__PURE__ */ d(h, { className: "zd:text-center", children: [
|
|
512
521
|
"Did not get an email?",
|
|
513
522
|
" ",
|
|
514
523
|
/* @__PURE__ */ t(
|
|
@@ -519,15 +528,15 @@ function Ie() {
|
|
|
519
528
|
onClick: async () => {
|
|
520
529
|
if (!(!e || !s))
|
|
521
530
|
try {
|
|
522
|
-
const { otpId: l, otpEncryptionTargetBundle: p } = await
|
|
531
|
+
const { otpId: l, otpEncryptionTargetBundle: p } = await r({
|
|
523
532
|
email: e
|
|
524
533
|
});
|
|
525
|
-
|
|
534
|
+
i({ otpId: l, otpEncryptionTargetBundle: p }), c(60);
|
|
526
535
|
} catch {
|
|
527
536
|
}
|
|
528
537
|
},
|
|
529
538
|
className: "zd:cursor-pointer zd:underline zd:disabled:opacity-50 zd:disabled:cursor-not-allowed",
|
|
530
|
-
children: s ? "Resend" : `Resend in ${
|
|
539
|
+
children: s ? "Resend" : `Resend in ${o} ${o === 1 ? "second" : "seconds"}`
|
|
531
540
|
}
|
|
532
541
|
)
|
|
533
542
|
] }) })
|
|
@@ -545,27 +554,27 @@ function $() {
|
|
|
545
554
|
}
|
|
546
555
|
function Pe({
|
|
547
556
|
title: e = "Oops, something went wrong",
|
|
548
|
-
message:
|
|
549
|
-
showRetry:
|
|
557
|
+
message: i = "We couldn't complete the sign-in process. This could be due to timeout, an expired link, or a cancelled request.",
|
|
558
|
+
showRetry: r = !1,
|
|
550
559
|
showChooseAnother: n = !0
|
|
551
560
|
}) {
|
|
552
|
-
const { goToStep:
|
|
553
|
-
return /* @__PURE__ */
|
|
554
|
-
/* @__PURE__ */
|
|
555
|
-
/* @__PURE__ */ t(I, { imageName: "error", title: e, children:
|
|
556
|
-
/* @__PURE__ */
|
|
557
|
-
|
|
561
|
+
const { goToStep: o, goBack: c, reset: s } = F();
|
|
562
|
+
return /* @__PURE__ */ d(b, { children: [
|
|
563
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:gap-8 zd:items-center zd:justify-center", children: [
|
|
564
|
+
/* @__PURE__ */ t(I, { imageName: "error", title: e, children: i }),
|
|
565
|
+
/* @__PURE__ */ d("div", { className: "zd:flex zd:flex-col zd:gap-1", children: [
|
|
566
|
+
r && /* @__PURE__ */ t(C, { action: "primary", text: "Try again", onClick: c ?? (() => o("sign-up")) }),
|
|
558
567
|
n && /* @__PURE__ */ t(
|
|
559
568
|
C,
|
|
560
569
|
{
|
|
561
|
-
action:
|
|
570
|
+
action: r ? "secondary" : "primary",
|
|
562
571
|
onClick: () => {
|
|
563
|
-
$(),
|
|
572
|
+
$(), o("sign-up");
|
|
564
573
|
},
|
|
565
574
|
text: "Choose another sign-in method"
|
|
566
575
|
}
|
|
567
576
|
),
|
|
568
|
-
!
|
|
577
|
+
!r && !n && /* @__PURE__ */ t(C, { action: "primary", text: "Start over", onClick: s })
|
|
569
578
|
] })
|
|
570
579
|
] }),
|
|
571
580
|
/* @__PURE__ */ t(L, { className: "zd:self-center zd:pt-4 zd:pb-6" })
|
|
@@ -575,15 +584,15 @@ const Re = 4, Le = 8, $e = 6;
|
|
|
575
584
|
function Ue(e) {
|
|
576
585
|
return Math.max(Re, Math.min(Le, e));
|
|
577
586
|
}
|
|
578
|
-
function Me({ char: e, isFocused:
|
|
587
|
+
function Me({ char: e, isFocused: i }) {
|
|
579
588
|
return /* @__PURE__ */ t(
|
|
580
|
-
|
|
589
|
+
ae,
|
|
581
590
|
{
|
|
582
591
|
"data-testid": "code-input-box",
|
|
583
|
-
"data-active":
|
|
592
|
+
"data-active": i || void 0,
|
|
584
593
|
className: R(
|
|
585
594
|
"zd:h-16 zd:w-14 zd:rounded-lg zd:flex zd:items-center zd:justify-center",
|
|
586
|
-
|
|
595
|
+
i && "zd:border-[1.5px] zd:border-greyScale"
|
|
587
596
|
),
|
|
588
597
|
children: /* @__PURE__ */ t(h, { className: "zd:text-h2", children: e })
|
|
589
598
|
}
|
|
@@ -591,10 +600,10 @@ function Me({ char: e, isFocused: o }) {
|
|
|
591
600
|
}
|
|
592
601
|
function je({
|
|
593
602
|
onChange: e,
|
|
594
|
-
onComplete:
|
|
595
|
-
disabled:
|
|
603
|
+
onComplete: i,
|
|
604
|
+
disabled: r = !1,
|
|
596
605
|
error: n = !1,
|
|
597
|
-
autoFocus:
|
|
606
|
+
autoFocus: o = !1,
|
|
598
607
|
length: c = $e,
|
|
599
608
|
"data-testid": s
|
|
600
609
|
}) {
|
|
@@ -604,21 +613,21 @@ function je({
|
|
|
604
613
|
index: g
|
|
605
614
|
})),
|
|
606
615
|
[u]
|
|
607
|
-
), [p,
|
|
616
|
+
), [p, x] = w(""), [m, N] = w(!1), k = K(null);
|
|
608
617
|
P(() => {
|
|
609
618
|
var f;
|
|
610
|
-
|
|
611
|
-
}, [
|
|
612
|
-
|
|
619
|
+
o && !r && ((f = k.current) == null || f.focus());
|
|
620
|
+
}, [o, r]), P(() => {
|
|
621
|
+
x((f) => f.slice(0, u));
|
|
613
622
|
}, [u]);
|
|
614
623
|
const S = (f) => {
|
|
615
624
|
const g = f.slice(0, u).toUpperCase();
|
|
616
|
-
|
|
625
|
+
x(g), e == null || e(g), g.length === u && setTimeout(() => {
|
|
617
626
|
var T;
|
|
618
|
-
|
|
627
|
+
i == null || i(g), (T = k.current) == null || T.blur();
|
|
619
628
|
}, 0);
|
|
620
629
|
};
|
|
621
|
-
return /* @__PURE__ */
|
|
630
|
+
return /* @__PURE__ */ d(
|
|
622
631
|
"button",
|
|
623
632
|
{
|
|
624
633
|
type: "button",
|
|
@@ -627,7 +636,7 @@ function je({
|
|
|
627
636
|
var f;
|
|
628
637
|
return (f = k.current) == null ? void 0 : f.focus();
|
|
629
638
|
},
|
|
630
|
-
disabled:
|
|
639
|
+
disabled: r,
|
|
631
640
|
"data-testid": s,
|
|
632
641
|
children: [
|
|
633
642
|
/* @__PURE__ */ t(
|
|
@@ -639,7 +648,7 @@ function je({
|
|
|
639
648
|
onFocus: () => N(!0),
|
|
640
649
|
onBlur: () => N(!1),
|
|
641
650
|
maxLength: u,
|
|
642
|
-
disabled:
|
|
651
|
+
disabled: r,
|
|
643
652
|
className: "zd:absolute zd:opacity-0 zd:pointer-events-none",
|
|
644
653
|
style: { position: "absolute", opacity: 0 },
|
|
645
654
|
"aria-label": "Verification code"
|
|
@@ -660,13 +669,13 @@ function je({
|
|
|
660
669
|
function _e() {
|
|
661
670
|
const {
|
|
662
671
|
email: e,
|
|
663
|
-
otpId:
|
|
664
|
-
otpEncryptionTargetBundle:
|
|
672
|
+
otpId: i,
|
|
673
|
+
otpEncryptionTargetBundle: r,
|
|
665
674
|
setOtpSession: n,
|
|
666
|
-
clearOtpSession:
|
|
675
|
+
clearOtpSession: o,
|
|
667
676
|
goToStep: c,
|
|
668
677
|
config: s
|
|
669
|
-
} = F(), { mutateAsync: u, isPending: l } = Q(), { mutateAsync: p, isPending:
|
|
678
|
+
} = F(), { mutateAsync: u, isPending: l } = Q(), { mutateAsync: p, isPending: x } = ue(), [m, N] = w(""), [k, S] = w(!1), [f, g] = w(60);
|
|
670
679
|
P(() => {
|
|
671
680
|
if (f <= 0) return;
|
|
672
681
|
const v = setInterval(() => {
|
|
@@ -676,14 +685,14 @@ function _e() {
|
|
|
676
685
|
}, [f]);
|
|
677
686
|
const T = async () => {
|
|
678
687
|
var v, A;
|
|
679
|
-
if (!(!m.trim() || !
|
|
688
|
+
if (!(!m.trim() || !i || !r)) {
|
|
680
689
|
S(!1);
|
|
681
690
|
try {
|
|
682
691
|
await p({
|
|
683
|
-
otpId:
|
|
692
|
+
otpId: i,
|
|
684
693
|
code: m.trim(),
|
|
685
|
-
otpEncryptionTargetBundle:
|
|
686
|
-
}),
|
|
694
|
+
otpEncryptionTargetBundle: r
|
|
695
|
+
}), o(), c("authenticated"), (v = s == null ? void 0 : s.onSuccess) == null || v.call(s);
|
|
687
696
|
} catch (_) {
|
|
688
697
|
S(!0), (A = s == null ? void 0 : s.onError) == null || A.call(s, _);
|
|
689
698
|
}
|
|
@@ -702,11 +711,11 @@ function _e() {
|
|
|
702
711
|
S(!0);
|
|
703
712
|
}
|
|
704
713
|
}, U = f <= 0 && !l;
|
|
705
|
-
return /* @__PURE__ */
|
|
706
|
-
/* @__PURE__ */
|
|
707
|
-
/* @__PURE__ */
|
|
714
|
+
return /* @__PURE__ */ d(b, { children: [
|
|
715
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:gap-8 zd:justify-center zd:items-center", children: [
|
|
716
|
+
/* @__PURE__ */ d("div", { className: "zd:flex zd:flex-col zd:gap-4", children: [
|
|
708
717
|
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center", children: "Enter verification code" }),
|
|
709
|
-
/* @__PURE__ */
|
|
718
|
+
/* @__PURE__ */ d(h, { className: "zd:text-center", children: [
|
|
710
719
|
"Enter the code from the email we sent to",
|
|
711
720
|
" ",
|
|
712
721
|
/* @__PURE__ */ t(h, { className: "zd:text-solarOrange", children: e })
|
|
@@ -717,7 +726,7 @@ function _e() {
|
|
|
717
726
|
{
|
|
718
727
|
onComplete: y,
|
|
719
728
|
onChange: () => S(!1),
|
|
720
|
-
disabled:
|
|
729
|
+
disabled: x,
|
|
721
730
|
error: k,
|
|
722
731
|
autoFocus: !0
|
|
723
732
|
}
|
|
@@ -727,10 +736,10 @@ function _e() {
|
|
|
727
736
|
{
|
|
728
737
|
text: "Confirm code",
|
|
729
738
|
onClick: T,
|
|
730
|
-
disabled: !m.trim() ||
|
|
739
|
+
disabled: !m.trim() || x
|
|
731
740
|
}
|
|
732
741
|
),
|
|
733
|
-
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-1", children: /* @__PURE__ */
|
|
742
|
+
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-1", children: /* @__PURE__ */ d(h, { className: "zd:text-center", children: [
|
|
734
743
|
"Did not get an email?",
|
|
735
744
|
" ",
|
|
736
745
|
/* @__PURE__ */ t(
|
|
@@ -750,27 +759,27 @@ function _e() {
|
|
|
750
759
|
}
|
|
751
760
|
function He({
|
|
752
761
|
termsAndConditionsUrl: e,
|
|
753
|
-
privacyPolicyUrl:
|
|
754
|
-
agreedToTerms:
|
|
762
|
+
privacyPolicyUrl: i,
|
|
763
|
+
agreedToTerms: r,
|
|
755
764
|
setAgreedToTerms: n,
|
|
756
|
-
highlight:
|
|
765
|
+
highlight: o = !1
|
|
757
766
|
}) {
|
|
758
|
-
return /* @__PURE__ */
|
|
759
|
-
!!(e ||
|
|
767
|
+
return /* @__PURE__ */ d("div", { className: "zd:flex zd:flex-col zd:items-center zd:gap-5", children: [
|
|
768
|
+
!!(e || i) && /* @__PURE__ */ d(
|
|
760
769
|
"div",
|
|
761
770
|
{
|
|
762
|
-
className: `zd:flex zd:flex-row zd:items-center zd:gap-2 zd:rounded-md zd:p-2 zd:transition-colors ${
|
|
771
|
+
className: `zd:flex zd:flex-row zd:items-center zd:gap-2 zd:rounded-md zd:p-2 zd:transition-colors ${o ? "zd:border zd:border-negative" : "zd:border zd:border-transparent"}`,
|
|
763
772
|
children: [
|
|
764
773
|
/* @__PURE__ */ t(
|
|
765
774
|
"input",
|
|
766
775
|
{
|
|
767
776
|
type: "checkbox",
|
|
768
|
-
checked:
|
|
777
|
+
checked: r,
|
|
769
778
|
onChange: (s) => n(s.target.checked),
|
|
770
779
|
className: "zd:cursor-pointer zd:[color-scheme:light]"
|
|
771
780
|
}
|
|
772
781
|
),
|
|
773
|
-
/* @__PURE__ */
|
|
782
|
+
/* @__PURE__ */ d(h, { className: "zd:flex-1", children: [
|
|
774
783
|
"I agree to the",
|
|
775
784
|
" ",
|
|
776
785
|
e && /* @__PURE__ */ t(
|
|
@@ -784,12 +793,12 @@ function He({
|
|
|
784
793
|
children: "Terms & Conditions"
|
|
785
794
|
}
|
|
786
795
|
),
|
|
787
|
-
e &&
|
|
788
|
-
|
|
796
|
+
e && i && " and ",
|
|
797
|
+
i && /* @__PURE__ */ t(
|
|
789
798
|
h,
|
|
790
799
|
{
|
|
791
800
|
as: "a",
|
|
792
|
-
href:
|
|
801
|
+
href: i,
|
|
793
802
|
target: "_blank",
|
|
794
803
|
rel: "noopener noreferrer",
|
|
795
804
|
className: "zd:underline",
|
|
@@ -828,37 +837,37 @@ function H(e) {
|
|
|
828
837
|
return e instanceof Error ? e.name === "AbortError" || e.name === "NotAllowedError" ? !0 : e.message.toLowerCase().includes("oauth popup was closed") : !1;
|
|
829
838
|
}
|
|
830
839
|
function Ve() {
|
|
831
|
-
const { goToStep: e, setEmail:
|
|
840
|
+
const { goToStep: e, setEmail: i, setOtpSession: r, config: n, enabledMethods: o } = F(), [c, s] = w(!1), [u, l] = w(!1), [p, x] = w(""), m = (n == null ? void 0 : n.emailAuthMethod) === "otp", { mutateAsync: N, isPending: k } = Q(), { mutateAsync: S, isPending: f } = J(), g = k || f, [T, y] = w(null), { mutateAsync: j, isPending: U } = pe({
|
|
832
841
|
mutation: {
|
|
833
842
|
onSuccess: async () => {
|
|
834
|
-
var
|
|
835
|
-
e("authenticated"), (
|
|
843
|
+
var a;
|
|
844
|
+
e("authenticated"), (a = n == null ? void 0 : n.onSuccess) == null || a.call(n);
|
|
836
845
|
},
|
|
837
|
-
onError: (
|
|
846
|
+
onError: (a) => {
|
|
838
847
|
var z;
|
|
839
|
-
(z = n == null ? void 0 : n.onError) == null || z.call(n,
|
|
848
|
+
(z = n == null ? void 0 : n.onError) == null || z.call(n, a);
|
|
840
849
|
}
|
|
841
850
|
}
|
|
842
851
|
}), { mutate: v, isPending: A } = fe({
|
|
843
852
|
mutation: {
|
|
844
853
|
onSuccess: () => {
|
|
845
|
-
var
|
|
846
|
-
e("authenticated"), (
|
|
854
|
+
var a;
|
|
855
|
+
e("authenticated"), (a = n == null ? void 0 : n.onSuccess) == null || a.call(n);
|
|
847
856
|
},
|
|
848
|
-
onError: (
|
|
857
|
+
onError: (a) => {
|
|
849
858
|
var z;
|
|
850
|
-
H(
|
|
859
|
+
H(a) || y(a instanceof Error ? a.message : String(a)), (z = n == null ? void 0 : n.onError) == null || z.call(n, a);
|
|
851
860
|
}
|
|
852
861
|
}
|
|
853
862
|
}), { mutate: _, isPending: te } = he({
|
|
854
863
|
mutation: {
|
|
855
864
|
onSuccess: () => {
|
|
856
|
-
var
|
|
857
|
-
e("authenticated"), (
|
|
865
|
+
var a;
|
|
866
|
+
e("authenticated"), (a = n == null ? void 0 : n.onSuccess) == null || a.call(n);
|
|
858
867
|
},
|
|
859
|
-
onError: (
|
|
868
|
+
onError: (a) => {
|
|
860
869
|
var z;
|
|
861
|
-
H(
|
|
870
|
+
H(a) || y(a instanceof Error ? a.message : String(a)), (z = n == null ? void 0 : n.onError) == null || z.call(n, a);
|
|
862
871
|
}
|
|
863
872
|
}
|
|
864
873
|
}), E = U || g || A || te, B = !!(n != null && n.termsAndConditionsUrl || n != null && n.privacyPolicyUrl) && !c, ne = () => {
|
|
@@ -885,9 +894,9 @@ function Ve() {
|
|
|
885
894
|
y(null);
|
|
886
895
|
try {
|
|
887
896
|
await j({ provider: "google" });
|
|
888
|
-
} catch (
|
|
889
|
-
const z =
|
|
890
|
-
H(
|
|
897
|
+
} catch (a) {
|
|
898
|
+
const z = a instanceof Error ? a.message : String(a);
|
|
899
|
+
H(a) || y(z);
|
|
891
900
|
}
|
|
892
901
|
}, W = m ? async () => {
|
|
893
902
|
if (!(!p || E) && M(p)) {
|
|
@@ -897,13 +906,13 @@ function Ve() {
|
|
|
897
906
|
}
|
|
898
907
|
y(null);
|
|
899
908
|
try {
|
|
900
|
-
const { otpId:
|
|
909
|
+
const { otpId: a, otpEncryptionTargetBundle: z } = await N({
|
|
901
910
|
email: p
|
|
902
911
|
});
|
|
903
|
-
|
|
904
|
-
} catch (
|
|
912
|
+
i(p), r({ otpId: a, otpEncryptionTargetBundle: z }), e("otp-input");
|
|
913
|
+
} catch (a) {
|
|
905
914
|
y(
|
|
906
|
-
|
|
915
|
+
a instanceof Error ? a.message : "Failed to send verification code"
|
|
907
916
|
);
|
|
908
917
|
}
|
|
909
918
|
}
|
|
@@ -915,18 +924,18 @@ function Ve() {
|
|
|
915
924
|
}
|
|
916
925
|
y(null);
|
|
917
926
|
try {
|
|
918
|
-
const { otpId:
|
|
927
|
+
const { otpId: a, otpEncryptionTargetBundle: z } = await S({
|
|
919
928
|
email: p
|
|
920
929
|
});
|
|
921
|
-
|
|
922
|
-
} catch (
|
|
930
|
+
i(p), r({ otpId: a, otpEncryptionTargetBundle: z }), e("email-verification");
|
|
931
|
+
} catch (a) {
|
|
923
932
|
y(
|
|
924
|
-
|
|
933
|
+
a instanceof Error ? a.message : "Failed to send verification code"
|
|
925
934
|
);
|
|
926
935
|
}
|
|
927
936
|
}
|
|
928
937
|
};
|
|
929
|
-
return T ? /* @__PURE__ */ t("div", { className: "zd:flex zd:items-center zd:justify-center zd:h-full", children: /* @__PURE__ */
|
|
938
|
+
return T ? /* @__PURE__ */ t("div", { className: "zd:flex zd:items-center zd:justify-center zd:h-full", children: /* @__PURE__ */ d("div", { className: "zd:flex zd:flex-col zd:gap-4 zd:max-w-md", children: [
|
|
930
939
|
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center", children: "Error occurred" }),
|
|
931
940
|
/* @__PURE__ */ t(h, { className: "zd:text-center zd:text-red-500", children: T }),
|
|
932
941
|
/* @__PURE__ */ t(
|
|
@@ -937,16 +946,16 @@ function Ve() {
|
|
|
937
946
|
onClick: () => y(null)
|
|
938
947
|
}
|
|
939
948
|
)
|
|
940
|
-
] }) }) : /* @__PURE__ */
|
|
941
|
-
/* @__PURE__ */
|
|
942
|
-
/* @__PURE__ */
|
|
949
|
+
] }) }) : /* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:justify-between zd:pb-4 zd:overflow-y-auto zd:overflow-x-hidden", children: [
|
|
950
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:justify-center", children: [
|
|
951
|
+
/* @__PURE__ */ d("div", { className: "zd:px-4 zd:flex zd:flex-col zd:items-center", children: [
|
|
943
952
|
/* @__PURE__ */ t("div", { className: "zd:w-full zd:px-16 zd:py-4", children: /* @__PURE__ */ t(qe, { className: "zd:w-full zd:pointer-events-none zd:select-none" }) }),
|
|
944
953
|
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center", children: "Continue to your wallet" }),
|
|
945
954
|
/* @__PURE__ */ t(h, { className: "zd:mt-2 zd:text-center zd:text-greyScale/50", children: "Choose a sign-in method to proceed" })
|
|
946
955
|
] }),
|
|
947
|
-
/* @__PURE__ */
|
|
948
|
-
|
|
949
|
-
/* @__PURE__ */
|
|
956
|
+
/* @__PURE__ */ d("div", { className: "zd:mt-6 zd:flex zd:flex-col zd:gap-4 zd:mb-4", children: [
|
|
957
|
+
o.includes("passkey") && /* @__PURE__ */ d(b, { children: [
|
|
958
|
+
/* @__PURE__ */ d("div", { className: "zd:px-4 zd:flex zd:flex-col zd:gap-2", children: [
|
|
950
959
|
/* @__PURE__ */ t(
|
|
951
960
|
C,
|
|
952
961
|
{
|
|
@@ -970,14 +979,14 @@ function Ve() {
|
|
|
970
979
|
}
|
|
971
980
|
)
|
|
972
981
|
] }),
|
|
973
|
-
/* @__PURE__ */
|
|
982
|
+
/* @__PURE__ */ d("div", { className: "zd:flex zd:items-center zd:gap-3", children: [
|
|
974
983
|
/* @__PURE__ */ t("div", { className: "zd:h-px zd:flex-1 zd:bg-greyScale/30" }),
|
|
975
984
|
/* @__PURE__ */ t(h, { className: "zd:text-body3", children: "or" }),
|
|
976
985
|
/* @__PURE__ */ t("div", { className: "zd:h-px zd:flex-1 zd:bg-greyScale/30" })
|
|
977
986
|
] })
|
|
978
987
|
] }),
|
|
979
|
-
/* @__PURE__ */
|
|
980
|
-
|
|
988
|
+
/* @__PURE__ */ d("div", { className: "zd:px-4 zd:flex zd:flex-col zd:gap-2", children: [
|
|
989
|
+
o.includes("google") && /* @__PURE__ */ t(
|
|
981
990
|
Y,
|
|
982
991
|
{
|
|
983
992
|
iconName: "google",
|
|
@@ -988,21 +997,21 @@ function Ve() {
|
|
|
988
997
|
onClick: re
|
|
989
998
|
}
|
|
990
999
|
),
|
|
991
|
-
|
|
992
|
-
|
|
1000
|
+
o.includes("email") && /* @__PURE__ */ t(
|
|
1001
|
+
de,
|
|
993
1002
|
{
|
|
994
1003
|
iconName: "email",
|
|
995
1004
|
placeholder: "Enter your email",
|
|
996
1005
|
value: p,
|
|
997
|
-
onChange: (
|
|
1006
|
+
onChange: (a) => x(a.target.value),
|
|
998
1007
|
type: "email",
|
|
999
1008
|
autoCapitalize: "none",
|
|
1000
1009
|
autoComplete: "email",
|
|
1001
1010
|
disabled: E,
|
|
1002
1011
|
variant: "listItemStyle",
|
|
1003
1012
|
containerClassName: "zd:rounded-3xl",
|
|
1004
|
-
onKeyDown: (
|
|
1005
|
-
|
|
1013
|
+
onKeyDown: (a) => {
|
|
1014
|
+
a.key === "Enter" && p && !E && W();
|
|
1006
1015
|
},
|
|
1007
1016
|
children: g ? /* @__PURE__ */ t("div", { className: "zd:w-13 zd:h-13 zd:flex zd:items-center zd:justify-center", children: /* @__PURE__ */ t("div", { className: "zd:w-5 zd:h-5 zd:border-2 zd:border-solarOrange zd:border-t-transparent zd:rounded-full zd:animate-spin" }) }) : /* @__PURE__ */ t(
|
|
1008
1017
|
"button",
|
|
@@ -1025,8 +1034,8 @@ function Ve() {
|
|
|
1025
1034
|
termsAndConditionsUrl: n == null ? void 0 : n.termsAndConditionsUrl,
|
|
1026
1035
|
privacyPolicyUrl: n == null ? void 0 : n.privacyPolicyUrl,
|
|
1027
1036
|
agreedToTerms: c,
|
|
1028
|
-
setAgreedToTerms: (
|
|
1029
|
-
s(
|
|
1037
|
+
setAgreedToTerms: (a) => {
|
|
1038
|
+
s(a), a && l(!1);
|
|
1030
1039
|
},
|
|
1031
1040
|
highlight: u
|
|
1032
1041
|
}
|
|
@@ -1039,35 +1048,35 @@ function De() {
|
|
|
1039
1048
|
function Ke() {
|
|
1040
1049
|
const {
|
|
1041
1050
|
otpId: e,
|
|
1042
|
-
otpEncryptionTargetBundle:
|
|
1043
|
-
goToStep:
|
|
1051
|
+
otpEncryptionTargetBundle: i,
|
|
1052
|
+
goToStep: r,
|
|
1044
1053
|
clearOtpSession: n,
|
|
1045
|
-
config:
|
|
1046
|
-
} = F(), [c] =
|
|
1054
|
+
config: o
|
|
1055
|
+
} = F(), [c] = w(De), [s, u] = w(null), l = K(!1), { mutate: p, isPending: x } = ze({
|
|
1047
1056
|
mutation: {
|
|
1048
1057
|
onSuccess: async () => {
|
|
1049
1058
|
var m;
|
|
1050
|
-
n(),
|
|
1059
|
+
n(), r("authenticated"), (m = o == null ? void 0 : o.onSuccess) == null || m.call(o);
|
|
1051
1060
|
},
|
|
1052
1061
|
onError: (m) => {
|
|
1053
1062
|
var N;
|
|
1054
|
-
u(m), (N =
|
|
1063
|
+
u(m), (N = o == null ? void 0 : o.onError) == null || N.call(o, m);
|
|
1055
1064
|
}
|
|
1056
1065
|
}
|
|
1057
1066
|
});
|
|
1058
1067
|
return P(() => {
|
|
1059
1068
|
if (!(l.current || !c)) {
|
|
1060
|
-
if (l.current = !0, !e || !
|
|
1061
|
-
$(),
|
|
1069
|
+
if (l.current = !0, !e || !i) {
|
|
1070
|
+
$(), r(null);
|
|
1062
1071
|
return;
|
|
1063
1072
|
}
|
|
1064
|
-
p({ otpId: e, code: c, otpEncryptionTargetBundle:
|
|
1073
|
+
p({ otpId: e, code: c, otpEncryptionTargetBundle: i });
|
|
1065
1074
|
}
|
|
1066
|
-
}, [e,
|
|
1067
|
-
/* @__PURE__ */
|
|
1068
|
-
!s &&
|
|
1069
|
-
!s && !c && !
|
|
1070
|
-
/* @__PURE__ */
|
|
1075
|
+
}, [e, i, c, p, r]), /* @__PURE__ */ d(b, { children: [
|
|
1076
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:gap-8 zd:items-center zd:justify-center", children: [
|
|
1077
|
+
!s && x && /* @__PURE__ */ t(I, { imageName: "loading", title: "Verifying Your Email", children: "Please wait while we securely connect your wallet." }),
|
|
1078
|
+
!s && !c && !x && /* @__PURE__ */ d(b, { children: [
|
|
1079
|
+
/* @__PURE__ */ d(I, { imageName: "error", title: "Invalid Link", children: [
|
|
1071
1080
|
"This verification link is invalid or incomplete.",
|
|
1072
1081
|
/* @__PURE__ */ t("br", {}),
|
|
1073
1082
|
"Please check your email and try again with the correct link."
|
|
@@ -1077,20 +1086,20 @@ function Ke() {
|
|
|
1077
1086
|
{
|
|
1078
1087
|
action: "primary",
|
|
1079
1088
|
onClick: () => {
|
|
1080
|
-
$(),
|
|
1089
|
+
$(), r("sign-up");
|
|
1081
1090
|
},
|
|
1082
1091
|
text: "Choose another sign-in method"
|
|
1083
1092
|
}
|
|
1084
1093
|
)
|
|
1085
1094
|
] }),
|
|
1086
|
-
s != null && /* @__PURE__ */
|
|
1095
|
+
s != null && /* @__PURE__ */ d(b, { children: [
|
|
1087
1096
|
/* @__PURE__ */ t(I, { imageName: "error", title: "Oops, something went wrong", children: "We couldn't complete the sign-in process. This could be due to timeout, an expired link, or a cancelled request." }),
|
|
1088
1097
|
/* @__PURE__ */ t(
|
|
1089
1098
|
C,
|
|
1090
1099
|
{
|
|
1091
1100
|
action: "primary",
|
|
1092
1101
|
onClick: () => {
|
|
1093
|
-
$(),
|
|
1102
|
+
$(), r("sign-up");
|
|
1094
1103
|
},
|
|
1095
1104
|
text: "Choose another sign-in method"
|
|
1096
1105
|
}
|
|
@@ -1101,8 +1110,8 @@ function Ke() {
|
|
|
1101
1110
|
] });
|
|
1102
1111
|
}
|
|
1103
1112
|
function Xe() {
|
|
1104
|
-
const { goToStep: e } = F(), { connect:
|
|
1105
|
-
|
|
1113
|
+
const { goToStep: e } = F(), { connect: i, connectors: r, isPending: n } = ce(), o = r.filter((s) => s.id !== "zerodev-wallet"), c = (s) => {
|
|
1114
|
+
i(
|
|
1106
1115
|
{ connector: s },
|
|
1107
1116
|
{
|
|
1108
1117
|
onSuccess: () => {
|
|
@@ -1111,10 +1120,10 @@ function Xe() {
|
|
|
1111
1120
|
}
|
|
1112
1121
|
);
|
|
1113
1122
|
};
|
|
1114
|
-
return /* @__PURE__ */
|
|
1115
|
-
/* @__PURE__ */
|
|
1123
|
+
return /* @__PURE__ */ d(b, { children: [
|
|
1124
|
+
/* @__PURE__ */ d("div", { className: "zd:flex-1 zd:flex zd:flex-col zd:gap-8 zd:justify-center", children: [
|
|
1116
1125
|
/* @__PURE__ */ t(h, { className: "zd:text-h2 zd:text-center", children: "Select your wallet" }),
|
|
1117
|
-
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-2", children:
|
|
1126
|
+
/* @__PURE__ */ t("div", { className: "zd:flex zd:flex-col zd:gap-2", children: o.length === 0 ? /* @__PURE__ */ t(h, { className: "zd:text-center", children: "No wallets detected. Install a browser wallet extension to continue." }) : o.map((s) => /* @__PURE__ */ t(
|
|
1118
1127
|
Y,
|
|
1119
1128
|
{
|
|
1120
1129
|
title: s.name,
|
|
@@ -1162,34 +1171,36 @@ function Ze(e) {
|
|
|
1162
1171
|
}
|
|
1163
1172
|
}
|
|
1164
1173
|
function zt({
|
|
1165
|
-
onClose: e
|
|
1174
|
+
onClose: e,
|
|
1175
|
+
size: i
|
|
1166
1176
|
} = {}) {
|
|
1167
|
-
const { step:
|
|
1177
|
+
const { step: r, goToStep: n, goBack: o, reset: c } = F(), s = O(ee(), (x) => x.logo);
|
|
1168
1178
|
P(() => {
|
|
1169
|
-
|
|
1170
|
-
}, [
|
|
1171
|
-
const
|
|
1172
|
-
if (!
|
|
1173
|
-
const
|
|
1174
|
-
$(),
|
|
1175
|
-
},
|
|
1179
|
+
r === null && Fe() && n("verifying-otp");
|
|
1180
|
+
}, [r, n]);
|
|
1181
|
+
const u = Ze(r);
|
|
1182
|
+
if (!u) return null;
|
|
1183
|
+
const l = () => {
|
|
1184
|
+
$(), c(), e == null || e();
|
|
1185
|
+
}, p = r ? Ye[r] : void 0;
|
|
1176
1186
|
return /* @__PURE__ */ t(
|
|
1177
1187
|
Ce,
|
|
1178
1188
|
{
|
|
1179
|
-
|
|
1189
|
+
...i && { size: i },
|
|
1190
|
+
contentClassName: r === "sign-up" ? "zd:px-0" : void 0,
|
|
1180
1191
|
topNav: /* @__PURE__ */ t(
|
|
1181
1192
|
xe,
|
|
1182
1193
|
{
|
|
1183
|
-
...
|
|
1184
|
-
onClose:
|
|
1185
|
-
...
|
|
1186
|
-
...
|
|
1187
|
-
...
|
|
1194
|
+
...o !== null && { onBack: o },
|
|
1195
|
+
onClose: l,
|
|
1196
|
+
...p && { title: p },
|
|
1197
|
+
...r === "sign-up" && {
|
|
1198
|
+
...s && { logo: s },
|
|
1188
1199
|
className: "zd:px-4"
|
|
1189
1200
|
}
|
|
1190
1201
|
}
|
|
1191
1202
|
),
|
|
1192
|
-
children:
|
|
1203
|
+
children: u
|
|
1193
1204
|
}
|
|
1194
1205
|
);
|
|
1195
1206
|
}
|
|
@@ -1199,8 +1210,8 @@ function et() {
|
|
|
1199
1210
|
try {
|
|
1200
1211
|
const e = window.localStorage.getItem(G);
|
|
1201
1212
|
if (!e) return null;
|
|
1202
|
-
const
|
|
1203
|
-
return !(
|
|
1213
|
+
const i = JSON.parse(e);
|
|
1214
|
+
return !(i != null && i.otpId) || !(i != null && i.otpEncryptionTargetBundle) ? null : i;
|
|
1204
1215
|
} catch {
|
|
1205
1216
|
return null;
|
|
1206
1217
|
}
|
|
@@ -1222,7 +1233,7 @@ function V() {
|
|
|
1222
1233
|
} catch {
|
|
1223
1234
|
}
|
|
1224
1235
|
}
|
|
1225
|
-
const nt = (e,
|
|
1236
|
+
const nt = (e, i, r) => ({
|
|
1226
1237
|
auth: {
|
|
1227
1238
|
// Initial state
|
|
1228
1239
|
step: null,
|
|
@@ -1234,37 +1245,37 @@ const nt = (e, o, i) => ({
|
|
|
1234
1245
|
config: null,
|
|
1235
1246
|
// Actions
|
|
1236
1247
|
initialize: (n) => {
|
|
1237
|
-
const
|
|
1248
|
+
const o = et();
|
|
1238
1249
|
e((c) => ({
|
|
1239
1250
|
auth: {
|
|
1240
1251
|
...c.auth,
|
|
1241
1252
|
config: n,
|
|
1242
1253
|
enabledMethods: n.enabledMethods,
|
|
1243
|
-
...
|
|
1244
|
-
otpId:
|
|
1245
|
-
otpEncryptionTargetBundle:
|
|
1254
|
+
...o && {
|
|
1255
|
+
otpId: o.otpId,
|
|
1256
|
+
otpEncryptionTargetBundle: o.otpEncryptionTargetBundle
|
|
1246
1257
|
}
|
|
1247
1258
|
}
|
|
1248
1259
|
}));
|
|
1249
1260
|
},
|
|
1250
1261
|
goToStep: (n) => {
|
|
1251
|
-
e((
|
|
1262
|
+
e((o) => ({
|
|
1252
1263
|
auth: {
|
|
1253
|
-
...
|
|
1264
|
+
...o.auth,
|
|
1254
1265
|
step: n,
|
|
1255
|
-
stepHistory:
|
|
1266
|
+
stepHistory: o.auth.step === null ? o.auth.stepHistory : [...o.auth.stepHistory, o.auth.step]
|
|
1256
1267
|
}
|
|
1257
1268
|
}));
|
|
1258
1269
|
},
|
|
1259
1270
|
goBack: () => {
|
|
1260
|
-
const { auth: n } =
|
|
1271
|
+
const { auth: n } = i();
|
|
1261
1272
|
if (n.stepHistory.length === 0) return;
|
|
1262
|
-
const
|
|
1273
|
+
const o = [...n.stepHistory], c = o.pop();
|
|
1263
1274
|
e((s) => ({
|
|
1264
1275
|
auth: {
|
|
1265
1276
|
...s.auth,
|
|
1266
1277
|
step: c,
|
|
1267
|
-
stepHistory:
|
|
1278
|
+
stepHistory: o
|
|
1268
1279
|
}
|
|
1269
1280
|
}));
|
|
1270
1281
|
},
|
|
@@ -1281,19 +1292,19 @@ const nt = (e, o, i) => ({
|
|
|
1281
1292
|
}));
|
|
1282
1293
|
},
|
|
1283
1294
|
setEmail: (n) => {
|
|
1284
|
-
e((
|
|
1295
|
+
e((o) => ({
|
|
1285
1296
|
auth: {
|
|
1286
|
-
...
|
|
1297
|
+
...o.auth,
|
|
1287
1298
|
email: n
|
|
1288
1299
|
}
|
|
1289
1300
|
}));
|
|
1290
1301
|
},
|
|
1291
|
-
setOtpSession: ({ otpId: n, otpEncryptionTargetBundle:
|
|
1292
|
-
tt({ otpId: n, otpEncryptionTargetBundle:
|
|
1302
|
+
setOtpSession: ({ otpId: n, otpEncryptionTargetBundle: o }) => {
|
|
1303
|
+
tt({ otpId: n, otpEncryptionTargetBundle: o }), e((c) => ({
|
|
1293
1304
|
auth: {
|
|
1294
1305
|
...c.auth,
|
|
1295
1306
|
otpId: n,
|
|
1296
|
-
otpEncryptionTargetBundle:
|
|
1307
|
+
otpEncryptionTargetBundle: o
|
|
1297
1308
|
}
|
|
1298
1309
|
}));
|
|
1299
1310
|
},
|
|
@@ -1308,36 +1319,36 @@ const nt = (e, o, i) => ({
|
|
|
1308
1319
|
}
|
|
1309
1320
|
}
|
|
1310
1321
|
}), ot = (e = {}) => se()(
|
|
1311
|
-
ye((
|
|
1322
|
+
ye((i, r, n) => ({
|
|
1312
1323
|
pendingRequests: [],
|
|
1313
1324
|
userConfirmationListenerActive: !1,
|
|
1314
1325
|
logo: e.logo ?? null,
|
|
1315
|
-
addPendingRequest: (
|
|
1316
|
-
pendingRequests: [...c.pendingRequests,
|
|
1326
|
+
addPendingRequest: (o) => i((c) => ({
|
|
1327
|
+
pendingRequests: [...c.pendingRequests, o]
|
|
1317
1328
|
})),
|
|
1318
|
-
removePendingRequest: (
|
|
1319
|
-
pendingRequests: c.pendingRequests.filter((s) => s.id !==
|
|
1329
|
+
removePendingRequest: (o) => i((c) => ({
|
|
1330
|
+
pendingRequests: c.pendingRequests.filter((s) => s.id !== o)
|
|
1320
1331
|
})),
|
|
1321
|
-
clearPendingRequests: () =>
|
|
1322
|
-
setUserConfirmationListenerActive: (
|
|
1323
|
-
...nt(
|
|
1332
|
+
clearPendingRequests: () => i({ pendingRequests: [] }),
|
|
1333
|
+
setUserConfirmationListenerActive: (o) => i({ userConfirmationListenerActive: o }),
|
|
1334
|
+
...nt(i, r)
|
|
1324
1335
|
}))
|
|
1325
1336
|
);
|
|
1326
1337
|
function rt(e) {
|
|
1327
|
-
return new Promise((
|
|
1338
|
+
return new Promise((i, r) => {
|
|
1328
1339
|
const n = e.subscribe(
|
|
1329
|
-
(
|
|
1330
|
-
(
|
|
1331
|
-
|
|
1340
|
+
(o) => o.auth.step,
|
|
1341
|
+
(o) => {
|
|
1342
|
+
o === "authenticated" ? (n(), i()) : o === null && (n(), r(new Error("Auth flow dismissed")));
|
|
1332
1343
|
}
|
|
1333
1344
|
);
|
|
1334
1345
|
});
|
|
1335
1346
|
}
|
|
1336
1347
|
function mt(e) {
|
|
1337
|
-
var n,
|
|
1338
|
-
const
|
|
1339
|
-
return (
|
|
1340
|
-
const s =
|
|
1348
|
+
var n, o;
|
|
1349
|
+
const i = me(e), r = ot({ logo: (n = e.config) == null ? void 0 : n.logo });
|
|
1350
|
+
return (o = e.config) != null && o.auth && r.getState().auth.initialize(e.config.auth), (c) => {
|
|
1351
|
+
const s = i(c);
|
|
1341
1352
|
return {
|
|
1342
1353
|
...s,
|
|
1343
1354
|
async connect(u) {
|
|
@@ -1347,21 +1358,21 @@ function mt(e) {
|
|
|
1347
1358
|
} catch (p) {
|
|
1348
1359
|
if (u != null && u.isReconnecting || !((l = e.config) != null && l.auth) || !(p instanceof ge))
|
|
1349
1360
|
throw p;
|
|
1350
|
-
if (
|
|
1361
|
+
if (r.getState().auth.step !== null)
|
|
1351
1362
|
throw new Error("Auth flow already in progress");
|
|
1352
|
-
return
|
|
1363
|
+
return r.getState().auth.goToStep("sign-up"), await rt(r), s.connect(u);
|
|
1353
1364
|
}
|
|
1354
1365
|
},
|
|
1355
1366
|
async disconnect() {
|
|
1356
1367
|
var u, l;
|
|
1357
|
-
await ((u = s.disconnect) == null ? void 0 : u.call(s)), (l = e.config) != null && l.auth &&
|
|
1368
|
+
await ((u = s.disconnect) == null ? void 0 : u.call(s)), (l = e.config) != null && l.auth && r.getState().auth.reset();
|
|
1358
1369
|
},
|
|
1359
1370
|
async setup() {
|
|
1360
1371
|
var u;
|
|
1361
1372
|
await ((u = s.setup) == null ? void 0 : u.call(s)), typeof window > "u";
|
|
1362
1373
|
},
|
|
1363
1374
|
getKitStore() {
|
|
1364
|
-
return
|
|
1375
|
+
return r;
|
|
1365
1376
|
}
|
|
1366
1377
|
};
|
|
1367
1378
|
};
|