@txnlab/use-wallet-ui-react 1.3.0 → 1.4.0

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.
Files changed (57) hide show
  1. package/README.md +95 -2
  2. package/dist/cjs/chunks/passkey-C8Dw6sNL.cjs +2 -0
  3. package/dist/cjs/chunks/passkey-C8Dw6sNL.cjs.map +1 -0
  4. package/dist/cjs/index.cjs +14 -14
  5. package/dist/cjs/index.cjs.map +1 -1
  6. package/dist/cjs/plugins/passkey.cjs +2 -0
  7. package/dist/cjs/plugins/passkey.cjs.map +1 -0
  8. package/dist/esm/chunks/passkey-BbgvIGki.js +44 -0
  9. package/dist/esm/chunks/passkey-BbgvIGki.js.map +1 -0
  10. package/dist/esm/index.js +2966 -2679
  11. package/dist/esm/index.js.map +1 -1
  12. package/dist/esm/plugins/passkey.js +578 -0
  13. package/dist/esm/plugins/passkey.js.map +1 -0
  14. package/dist/style.css +152 -0
  15. package/dist/types/components/ConnectWalletMenu.d.ts +7 -1
  16. package/dist/types/components/ConnectWalletMenu.d.ts.map +1 -1
  17. package/dist/types/components/ConnectedWalletMenu.d.ts.map +1 -1
  18. package/dist/types/components/PasskeyConnect.d.ts +29 -0
  19. package/dist/types/components/PasskeyConnect.d.ts.map +1 -0
  20. package/dist/types/components/WalletButton.d.ts +7 -1
  21. package/dist/types/components/WalletButton.d.ts.map +1 -1
  22. package/dist/types/components/WalletGroupLabel.d.ts +6 -0
  23. package/dist/types/components/WalletGroupLabel.d.ts.map +1 -0
  24. package/dist/types/components/WalletIcon.d.ts +6 -0
  25. package/dist/types/components/WalletIcon.d.ts.map +1 -0
  26. package/dist/types/components/WalletList.d.ts.map +1 -1
  27. package/dist/types/index.d.cts +5 -0
  28. package/dist/types/index.d.ts +5 -0
  29. package/dist/types/index.d.ts.map +1 -1
  30. package/dist/types/plugins/passkey/PasskeyDisclosure.d.ts +11 -0
  31. package/dist/types/plugins/passkey/PasskeyDisclosure.d.ts.map +1 -0
  32. package/dist/types/plugins/passkey/PasskeyRecoveryDialog.d.ts +10 -0
  33. package/dist/types/plugins/passkey/PasskeyRecoveryDialog.d.ts.map +1 -0
  34. package/dist/types/plugins/passkey/PasskeyRecoveryMenuButton.d.ts +5 -0
  35. package/dist/types/plugins/passkey/PasskeyRecoveryMenuButton.d.ts.map +1 -0
  36. package/dist/types/plugins/passkey/PasskeySessionControl.d.ts +6 -0
  37. package/dist/types/plugins/passkey/PasskeySessionControl.d.ts.map +1 -0
  38. package/dist/types/plugins/passkey/constants.d.ts +3 -0
  39. package/dist/types/plugins/passkey/constants.d.ts.map +1 -0
  40. package/dist/types/plugins/passkey/index.d.cts +36 -0
  41. package/dist/types/plugins/passkey/index.d.ts +36 -0
  42. package/dist/types/plugins/passkey/index.d.ts.map +1 -0
  43. package/dist/types/plugins/passkey/index.test.d.ts +2 -0
  44. package/dist/types/plugins/passkey/index.test.d.ts.map +1 -0
  45. package/dist/types/plugins/passkey/storage.d.ts +5 -0
  46. package/dist/types/plugins/passkey/storage.d.ts.map +1 -0
  47. package/dist/types/plugins/passkey/storage.test.d.ts +2 -0
  48. package/dist/types/plugins/passkey/storage.test.d.ts.map +1 -0
  49. package/dist/types/plugins/passkey/usePasskeyAdapter.d.ts +10 -0
  50. package/dist/types/plugins/passkey/usePasskeyAdapter.d.ts.map +1 -0
  51. package/dist/types/providers/WalletUIProvider.d.ts +15 -1
  52. package/dist/types/providers/WalletUIProvider.d.ts.map +1 -1
  53. package/dist/types/utils/passkey.d.ts +59 -0
  54. package/dist/types/utils/passkey.d.ts.map +1 -0
  55. package/dist/types/utils/passkey.test.d.ts +2 -0
  56. package/dist/types/utils/passkey.test.d.ts.map +1 -0
  57. package/package.json +13 -2
@@ -0,0 +1,578 @@
1
+ import { jsxs as a, jsx as e, Fragment as b } from "react/jsx-runtime";
2
+ import { b as $, i as M, g as T } from "../chunks/passkey-BbgvIGki.js";
3
+ import { useState as p, useRef as R, useEffect as f, useCallback as D } from "react";
4
+ import { u as q, b as G, c as Z, d as J, g as Q, h as X } from "../chunks/floating-ui.react-CxJSDrxv.js";
5
+ import { useWalletManager as ee } from "@txnlab/use-wallet-react";
6
+ const U = "passkey-recovery-dialog", te = "This account is created by and for {domain}. Keep only what you need here, and move larger amounts to a wallet you control.";
7
+ function re(r) {
8
+ const t = /* @__PURE__ */ new Set();
9
+ return {
10
+ has(o) {
11
+ if (t.has(o)) return !0;
12
+ try {
13
+ return localStorage.getItem(r + o) === "1";
14
+ } catch {
15
+ return !1;
16
+ }
17
+ },
18
+ set(o) {
19
+ t.add(o);
20
+ try {
21
+ localStorage.setItem(r + o, "1");
22
+ } catch {
23
+ }
24
+ }
25
+ };
26
+ }
27
+ const F = re(
28
+ "wui:passkey-disclosure-dismissed:"
29
+ ), ae = (r) => F.has(r), oe = (r) => F.set(r);
30
+ function se({
31
+ ctx: r,
32
+ text: t
33
+ }) {
34
+ var c, l;
35
+ const o = r.activeAddress, [, d] = p(0);
36
+ if (!o || ae(o)) return null;
37
+ const s = $((l = (c = r.activeWallet) == null ? void 0 : c.activeAccount) == null ? void 0 : l.name), i = () => {
38
+ oe(o), d((u) => u + 1);
39
+ };
40
+ return /* @__PURE__ */ a(
41
+ "div",
42
+ {
43
+ role: "note",
44
+ "data-passkey-disclosure": !0,
45
+ className: "mb-2 flex flex-col gap-2 rounded-[10px] border border-[var(--wui-color-border)] bg-[var(--wui-color-bg-secondary)] px-3 py-2.5",
46
+ children: [
47
+ /* @__PURE__ */ e("p", { className: "text-xs leading-[1.55] text-[var(--wui-color-text-secondary)]", children: t.replaceAll("{domain}", s) }),
48
+ /* @__PURE__ */ e(
49
+ "button",
50
+ {
51
+ type: "button",
52
+ onClick: i,
53
+ className: "self-end rounded-md bg-[var(--wui-color-primary)] px-2.5 py-1 text-xs font-medium text-[var(--wui-color-primary-text)] hover:bg-[var(--wui-color-primary-hover)]",
54
+ children: "Got it"
55
+ }
56
+ )
57
+ ]
58
+ }
59
+ );
60
+ }
61
+ function W(r) {
62
+ const t = ee();
63
+ return !r || !M(r) ? null : t.getWallet(r.walletKey) ?? null;
64
+ }
65
+ const ne = 60;
66
+ function le({
67
+ ctx: r,
68
+ onClose: t,
69
+ displayTimeout: o = ne
70
+ }) {
71
+ const d = W(r.activeWallet), [s, i] = p("warning"), [c, l] = p(null), [u, v] = p(o), [g, h] = p(!1), [_, k] = p(null), [P, S] = p("starting"), y = R(!1), w = R(!0), N = R(!1), { refs: z, context: C } = q({
72
+ open: !0,
73
+ onOpenChange: (n) => {
74
+ n || x();
75
+ }
76
+ }), O = G(C, { outsidePressEvent: "mousedown" }), j = Z(C, { role: "dialog" }), { getFloatingProps: V } = J([O, j]);
77
+ f(() => {
78
+ requestAnimationFrame(() => S("entered"));
79
+ }, []);
80
+ const A = D(() => {
81
+ var n;
82
+ l(null), y.current && (y.current = !1, (n = navigator.clipboard) == null || n.writeText("").catch(() => {
83
+ }));
84
+ }, []), x = D(() => {
85
+ N.current || (N.current = !0, A(), S("exiting"), setTimeout(t, 150));
86
+ }, [A, t]);
87
+ f(() => {
88
+ if (s !== "display") return;
89
+ const n = setInterval(() => {
90
+ v((m) => Math.max(0, m - 1));
91
+ }, 1e3);
92
+ return () => clearInterval(n);
93
+ }, [s]), f(() => {
94
+ s === "display" && u === 0 && x();
95
+ }, [s, u, x]), f(() => (w.current = !0, () => {
96
+ var n;
97
+ w.current = !1, y.current && (y.current = !1, (n = navigator.clipboard) == null || n.writeText("").catch(() => {
98
+ }));
99
+ }), []);
100
+ const Y = () => {
101
+ if (!d) {
102
+ k("No passkey account is connected."), i("error");
103
+ return;
104
+ }
105
+ let n;
106
+ try {
107
+ n = d.exportRecoveryPhrase();
108
+ } catch (m) {
109
+ E(m);
110
+ return;
111
+ }
112
+ i("loading"), n.then(
113
+ ({ phrase: m }) => {
114
+ !w.current || N.current || (l(m.split(" ")), v(o), i("display"));
115
+ },
116
+ (m) => {
117
+ w.current && E(m);
118
+ }
119
+ );
120
+ }, E = (n) => {
121
+ k(
122
+ T(n) ?? (n instanceof Error ? n.message : "Failed to export phrase")
123
+ ), i("error");
124
+ }, H = () => {
125
+ !c || !navigator.clipboard || navigator.clipboard.writeText(c.join(" ")).then(() => {
126
+ y.current = !0, h(!0), setTimeout(() => h(!1), 2e3);
127
+ }).catch(() => {
128
+ });
129
+ }, K = () => {
130
+ k(null), i("warning");
131
+ };
132
+ return /* @__PURE__ */ e(
133
+ Q,
134
+ {
135
+ className: "grid place-items-center px-4 z-50 transition-opacity duration-150 ease-in-out bg-[var(--wui-color-overlay)] data-[state=starting]:opacity-0 data-[state=exiting]:opacity-0 data-[state=entered]:opacity-100",
136
+ "data-state": P,
137
+ lockScroll: !0,
138
+ children: /* @__PURE__ */ e(X, { context: C, modal: !0, children: /* @__PURE__ */ a(
139
+ "div",
140
+ {
141
+ ref: z.setFloating,
142
+ ...V(),
143
+ role: "dialog",
144
+ "aria-label": s === "display" ? "Recovery Phrase" : "Export Recovery Phrase",
145
+ "data-passkey-recovery-dialog": !0,
146
+ "data-state": P,
147
+ className: "w-full max-w-sm max-h-[calc(100dvh-2rem)] overflow-y-auto rounded-3xl bg-[var(--wui-color-bg)] shadow-xl transform transition-all duration-150 ease-in-out data-[state=starting]:opacity-0 data-[state=starting]:scale-90 data-[state=exiting]:opacity-0 data-[state=exiting]:scale-90 data-[state=entered]:opacity-100 data-[state=entered]:scale-100",
148
+ style: { marginTop: "-0.5rem" },
149
+ children: [
150
+ s === "warning" && /* @__PURE__ */ a(b, { children: [
151
+ /* @__PURE__ */ e(
152
+ L,
153
+ {
154
+ title: "Export Recovery Phrase",
155
+ onClose: x
156
+ }
157
+ ),
158
+ /* @__PURE__ */ a("div", { className: "px-6 pb-4 space-y-3", children: [
159
+ /* @__PURE__ */ a("div", { className: "bg-[var(--wui-color-danger-bg)] rounded-xl p-4", children: [
160
+ /* @__PURE__ */ e("p", { className: "text-sm font-medium text-[var(--wui-color-danger-text)] mb-2", children: "Your recovery phrase gives full access to this account and its funds." }),
161
+ /* @__PURE__ */ a("ul", { className: "text-sm text-[var(--wui-color-danger-text)] list-disc pl-5 space-y-1", children: [
162
+ /* @__PURE__ */ e("li", { children: "Never share it with anyone" }),
163
+ /* @__PURE__ */ e("li", { children: "Never enter it on unverified websites" }),
164
+ /* @__PURE__ */ e("li", { children: "Write it down and store it securely" })
165
+ ] })
166
+ ] }),
167
+ /* @__PURE__ */ e(I, {})
168
+ ] }),
169
+ /* @__PURE__ */ a("div", { className: "px-6 pb-5 flex gap-2", children: [
170
+ /* @__PURE__ */ e(
171
+ "button",
172
+ {
173
+ onClick: x,
174
+ className: "flex-1 py-2.5 px-4 bg-[var(--wui-color-bg-tertiary)] text-[var(--wui-color-text-secondary)] font-medium rounded-xl hover:brightness-90 transition-all text-sm",
175
+ children: "Cancel"
176
+ }
177
+ ),
178
+ /* @__PURE__ */ e(
179
+ "button",
180
+ {
181
+ onClick: Y,
182
+ className: "flex-1 py-2.5 px-4 bg-[var(--wui-color-danger-bg)] text-[var(--wui-color-danger-text)] font-medium rounded-xl hover:bg-[var(--wui-color-danger-bg-hover)] transition-colors text-sm",
183
+ children: "Reveal Recovery Phrase"
184
+ }
185
+ )
186
+ ] })
187
+ ] }),
188
+ s === "loading" && /* @__PURE__ */ a("div", { className: "px-6 py-12 flex flex-col items-center gap-3", children: [
189
+ /* @__PURE__ */ e(ie, {}),
190
+ /* @__PURE__ */ e(
191
+ "p",
192
+ {
193
+ role: "status",
194
+ className: "text-sm text-[var(--wui-color-text-secondary)]",
195
+ children: "Confirm with your passkey…"
196
+ }
197
+ )
198
+ ] }),
199
+ s === "display" && c && /* @__PURE__ */ a(b, { children: [
200
+ /* @__PURE__ */ a("div", { className: "relative flex items-center justify-between px-6 pt-5 pb-3", children: [
201
+ /* @__PURE__ */ e("h2", { className: "text-xl font-bold text-[var(--wui-color-text)] wallet-custom-font", children: "Recovery Phrase" }),
202
+ /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
203
+ /* @__PURE__ */ e(
204
+ "span",
205
+ {
206
+ className: "text-sm font-medium tabular-nums text-[var(--wui-color-text-secondary)]",
207
+ "aria-label": `${u} seconds remaining`,
208
+ children: ce(u)
209
+ }
210
+ ),
211
+ /* @__PURE__ */ e(B, { onClick: x })
212
+ ] })
213
+ ] }),
214
+ /* @__PURE__ */ e("div", { className: "px-6 pb-3", children: /* @__PURE__ */ e(
215
+ "ol",
216
+ {
217
+ className: "grid grid-cols-3 gap-1 bg-[var(--wui-color-bg-secondary)] rounded-xl p-2",
218
+ style: { userSelect: "none" },
219
+ "data-passkey-phrase": !0,
220
+ children: c.map((n, m) => /* @__PURE__ */ a(
221
+ "li",
222
+ {
223
+ className: "flex items-baseline gap-1 py-1 px-1.5 rounded-md bg-[var(--wui-color-bg)] border border-[var(--wui-color-border)]",
224
+ children: [
225
+ /* @__PURE__ */ e("span", { className: "w-4 shrink-0 text-right text-[10px] tabular-nums text-[var(--wui-color-text-tertiary)]", children: m + 1 }),
226
+ /* @__PURE__ */ e("span", { className: "text-xs font-medium text-[var(--wui-color-text)]", children: n })
227
+ ]
228
+ },
229
+ m
230
+ ))
231
+ }
232
+ ) }),
233
+ /* @__PURE__ */ e("div", { className: "px-6 pb-3", children: /* @__PURE__ */ e(I, { compact: !0 }) }),
234
+ /* @__PURE__ */ a("div", { className: "px-6 pb-2 flex gap-2", children: [
235
+ /* @__PURE__ */ e(
236
+ "button",
237
+ {
238
+ onClick: H,
239
+ className: "flex-1 py-2 px-4 bg-[var(--wui-color-bg-tertiary)] text-[var(--wui-color-text-secondary)] font-medium rounded-xl hover:brightness-90 transition-all text-sm",
240
+ children: g ? "Copied" : "Copy"
241
+ }
242
+ ),
243
+ /* @__PURE__ */ e(
244
+ "button",
245
+ {
246
+ onClick: x,
247
+ className: "flex-1 py-2 px-4 bg-[var(--wui-color-primary)] text-[var(--wui-color-primary-text)] font-medium rounded-xl hover:bg-[var(--wui-color-primary-hover)] transition-colors text-sm",
248
+ children: "Done"
249
+ }
250
+ )
251
+ ] }),
252
+ /* @__PURE__ */ e("p", { className: "px-6 pb-5 text-xs text-[var(--wui-color-text-tertiary)] text-center", children: "Clear your clipboard after you paste it" })
253
+ ] }),
254
+ s === "error" && /* @__PURE__ */ a(b, { children: [
255
+ /* @__PURE__ */ e(
256
+ L,
257
+ {
258
+ title: "Export Recovery Phrase",
259
+ onClose: x
260
+ }
261
+ ),
262
+ /* @__PURE__ */ e("div", { className: "px-6 pb-4", children: /* @__PURE__ */ e(
263
+ "p",
264
+ {
265
+ role: "alert",
266
+ className: "bg-[var(--wui-color-danger-bg)] rounded-xl p-4 text-sm text-[var(--wui-color-danger-text)]",
267
+ children: _ || "An unexpected error occurred."
268
+ }
269
+ ) }),
270
+ /* @__PURE__ */ a("div", { className: "px-6 pb-5 flex gap-2", children: [
271
+ /* @__PURE__ */ e(
272
+ "button",
273
+ {
274
+ onClick: x,
275
+ className: "flex-1 py-2.5 px-4 bg-[var(--wui-color-bg-tertiary)] text-[var(--wui-color-text-secondary)] font-medium rounded-xl hover:brightness-90 transition-all text-sm",
276
+ children: "Cancel"
277
+ }
278
+ ),
279
+ /* @__PURE__ */ e(
280
+ "button",
281
+ {
282
+ onClick: K,
283
+ className: "flex-1 py-2.5 px-4 bg-[var(--wui-color-primary)] text-[var(--wui-color-primary-text)] font-medium rounded-xl hover:bg-[var(--wui-color-primary-hover)] transition-colors text-sm",
284
+ children: "Try Again"
285
+ }
286
+ )
287
+ ] })
288
+ ] })
289
+ ]
290
+ }
291
+ ) })
292
+ }
293
+ );
294
+ }
295
+ function I({ compact: r = !1 }) {
296
+ return /* @__PURE__ */ a(
297
+ "div",
298
+ {
299
+ "data-passkey-falcon-note": !0,
300
+ className: "rounded-xl border border-[var(--wui-color-border)] bg-[var(--wui-color-bg-secondary)] p-3 text-sm text-[var(--wui-color-text)]",
301
+ children: [
302
+ /* @__PURE__ */ e("p", { className: "font-medium", children: "Import it as a Falcon / quantum account" }),
303
+ !r && /* @__PURE__ */ a("ul", { className: "mt-1.5 list-disc pl-5 space-y-1 text-[var(--wui-color-text-secondary)]", children: [
304
+ /* @__PURE__ */ a("li", { children: [
305
+ "Lute: Add account → ",
306
+ /* @__PURE__ */ e("strong", { children: "Falcon25 account" }),
307
+ " → Import"
308
+ ] }),
309
+ /* @__PURE__ */ e("li", { children: "Pera: use the quantum account import" })
310
+ ] }),
311
+ /* @__PURE__ */ e("p", { className: "mt-1.5 text-[var(--wui-color-text-secondary)]", children: "A regular 25-word import restores a different, empty account." })
312
+ ]
313
+ }
314
+ );
315
+ }
316
+ function L({
317
+ title: r,
318
+ onClose: t
319
+ }) {
320
+ return /* @__PURE__ */ a("div", { className: "relative flex items-center px-6 pt-5 pb-4", children: [
321
+ /* @__PURE__ */ e("h2", { className: "text-xl font-bold text-[var(--wui-color-text)] wallet-custom-font", children: r }),
322
+ /* @__PURE__ */ e(B, { onClick: t, className: "absolute right-4" })
323
+ ] });
324
+ }
325
+ function B({
326
+ onClick: r,
327
+ className: t = ""
328
+ }) {
329
+ return /* @__PURE__ */ e(
330
+ "button",
331
+ {
332
+ onClick: r,
333
+ className: `${t} rounded-full bg-[var(--wui-color-bg-tertiary)] p-2 text-[var(--wui-color-text-secondary)] hover:brightness-90 transition-all`,
334
+ "aria-label": "Close dialog",
335
+ children: /* @__PURE__ */ e(
336
+ "svg",
337
+ {
338
+ xmlns: "http://www.w3.org/2000/svg",
339
+ className: "h-5 w-5",
340
+ viewBox: "0 0 20 20",
341
+ fill: "currentColor",
342
+ "aria-hidden": "true",
343
+ children: /* @__PURE__ */ e(
344
+ "path",
345
+ {
346
+ fillRule: "evenodd",
347
+ d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
348
+ clipRule: "evenodd"
349
+ }
350
+ )
351
+ }
352
+ )
353
+ }
354
+ );
355
+ }
356
+ function ie() {
357
+ return /* @__PURE__ */ a(
358
+ "svg",
359
+ {
360
+ className: "h-8 w-8 text-[var(--wui-color-text-tertiary)] animate-spin",
361
+ xmlns: "http://www.w3.org/2000/svg",
362
+ fill: "none",
363
+ viewBox: "0 0 24 24",
364
+ "aria-hidden": "true",
365
+ children: [
366
+ /* @__PURE__ */ e(
367
+ "circle",
368
+ {
369
+ className: "opacity-25",
370
+ cx: "12",
371
+ cy: "12",
372
+ r: "10",
373
+ stroke: "currentColor",
374
+ strokeWidth: "4"
375
+ }
376
+ ),
377
+ /* @__PURE__ */ e(
378
+ "path",
379
+ {
380
+ className: "opacity-75",
381
+ fill: "currentColor",
382
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
383
+ }
384
+ )
385
+ ]
386
+ }
387
+ );
388
+ }
389
+ function ce(r) {
390
+ const t = Math.floor(r / 60), o = r % 60;
391
+ return `${t}:${o.toString().padStart(2, "0")}`;
392
+ }
393
+ function de({ ctx: r }) {
394
+ return /* @__PURE__ */ a(b, { children: [
395
+ /* @__PURE__ */ e("div", { className: "border-t border-[var(--wui-color-border)] mt-2 mb-2" }),
396
+ /* @__PURE__ */ a(
397
+ "button",
398
+ {
399
+ onClick: () => {
400
+ r.closeMenu(), r.openDialog(U);
401
+ },
402
+ className: "w-full flex items-center gap-2 px-2 py-2 rounded-lg text-sm text-[var(--wui-color-text-secondary)] hover:bg-[var(--wui-color-bg-hover)] transition-colors",
403
+ children: [
404
+ /* @__PURE__ */ e(
405
+ "svg",
406
+ {
407
+ xmlns: "http://www.w3.org/2000/svg",
408
+ className: "h-4 w-4 shrink-0",
409
+ viewBox: "0 0 20 20",
410
+ fill: "currentColor",
411
+ "aria-hidden": "true",
412
+ children: /* @__PURE__ */ e("path", { d: "M9.661 2.237a.531.531 0 0 1 .678 0 11.947 11.947 0 0 0 7.078 2.749.5.5 0 0 1 .479.425c.069.52.104 1.05.104 1.59 0 5.162-3.26 9.563-7.834 11.256a.48.48 0 0 1-.332 0C5.26 16.564 2 12.163 2 7c0-.538.035-1.069.104-1.589a.5.5 0 0 1 .48-.425 11.947 11.947 0 0 0 7.077-2.75Z" })
413
+ }
414
+ ),
415
+ /* @__PURE__ */ e("span", { className: "flex-1 text-left", children: "Back up account" }),
416
+ /* @__PURE__ */ e(
417
+ "svg",
418
+ {
419
+ xmlns: "http://www.w3.org/2000/svg",
420
+ className: "h-4 w-4 shrink-0 opacity-50",
421
+ viewBox: "0 0 20 20",
422
+ fill: "currentColor",
423
+ "aria-hidden": "true",
424
+ children: /* @__PURE__ */ e(
425
+ "path",
426
+ {
427
+ fillRule: "evenodd",
428
+ d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",
429
+ clipRule: "evenodd"
430
+ }
431
+ )
432
+ }
433
+ )
434
+ ]
435
+ }
436
+ )
437
+ ] });
438
+ }
439
+ const ue = 1e3;
440
+ function me({ ctx: r }) {
441
+ const t = W(r.activeWallet), [o, d] = p(() => !!(t != null && t.isUnlocked)), [s, i] = p(!1), [c, l] = p(null);
442
+ return f(() => {
443
+ if (!t) return;
444
+ d(t.isUnlocked);
445
+ const g = setInterval(
446
+ () => d(t.isUnlocked),
447
+ ue
448
+ );
449
+ return () => clearInterval(g);
450
+ }, [t]), t ? /* @__PURE__ */ a("div", { "data-passkey-session": !0, className: "mb-2", children: [
451
+ /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-2 px-1 py-0.5", children: [
452
+ /* @__PURE__ */ a("span", { className: "flex items-center gap-2 text-sm text-[var(--wui-color-text-secondary)]", children: [
453
+ o ? /* @__PURE__ */ e(xe, {}) : /* @__PURE__ */ e(pe, {}),
454
+ /* @__PURE__ */ e("span", { children: o ? "Unlocked" : "Locked" })
455
+ ] }),
456
+ o ? /* @__PURE__ */ e(
457
+ "button",
458
+ {
459
+ onClick: () => {
460
+ t.lock(), d(t.isUnlocked), l(null);
461
+ },
462
+ className: "py-1 px-2.5 bg-[var(--wui-color-bg-tertiary)] text-[var(--wui-color-text-secondary)] font-medium rounded-md hover:brightness-90 transition-all text-xs",
463
+ children: "Lock"
464
+ }
465
+ ) : /* @__PURE__ */ e(
466
+ "button",
467
+ {
468
+ onClick: () => {
469
+ l(null);
470
+ const g = t.unlock();
471
+ i(!0), g.then(() => d(t.isUnlocked)).catch((h) => {
472
+ l(
473
+ T(h) ?? (h instanceof Error ? h.message : "Unlock failed")
474
+ );
475
+ }).finally(() => i(!1));
476
+ },
477
+ disabled: s,
478
+ className: "py-1 px-2.5 bg-[var(--wui-color-primary)] text-[var(--wui-color-primary-text)] font-medium rounded-md hover:bg-[var(--wui-color-primary-hover)] transition-colors text-xs disabled:opacity-50 disabled:cursor-not-allowed",
479
+ children: s ? "Waiting…" : "Unlock"
480
+ }
481
+ )
482
+ ] }),
483
+ !o && !c && /* @__PURE__ */ e("p", { className: "px-1 text-xs text-[var(--wui-color-text-tertiary)]", children: "The next signature asks for your passkey." }),
484
+ c && /* @__PURE__ */ e(
485
+ "p",
486
+ {
487
+ role: "alert",
488
+ className: "mt-1 rounded-lg bg-[var(--wui-color-danger-bg)] px-3 py-2 text-xs text-[var(--wui-color-danger-text)]",
489
+ children: c
490
+ }
491
+ )
492
+ ] }) : null;
493
+ }
494
+ function pe() {
495
+ return /* @__PURE__ */ e(
496
+ "svg",
497
+ {
498
+ xmlns: "http://www.w3.org/2000/svg",
499
+ className: "h-4 w-4 shrink-0",
500
+ viewBox: "0 0 20 20",
501
+ fill: "currentColor",
502
+ "aria-hidden": "true",
503
+ children: /* @__PURE__ */ e(
504
+ "path",
505
+ {
506
+ fillRule: "evenodd",
507
+ d: "M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z",
508
+ clipRule: "evenodd"
509
+ }
510
+ )
511
+ }
512
+ );
513
+ }
514
+ function xe() {
515
+ return /* @__PURE__ */ e(
516
+ "svg",
517
+ {
518
+ xmlns: "http://www.w3.org/2000/svg",
519
+ className: "h-4 w-4 shrink-0",
520
+ viewBox: "0 0 20 20",
521
+ fill: "currentColor",
522
+ "aria-hidden": "true",
523
+ children: /* @__PURE__ */ e("path", { d: "M10 2a5 5 0 00-5 5v2a2 2 0 00-2 2v5a2 2 0 002 2h10a2 2 0 002-2v-5a2 2 0 00-2-2H7V7a3 3 0 015.905-.75 1 1 0 001.937-.5A5.002 5.002 0 0010 2z" })
524
+ }
525
+ );
526
+ }
527
+ function we(r = {}) {
528
+ const { recoveryPhrase: t = !0, session: o = !1, disclosure: d = !1 } = r, s = (l) => M(l.activeWallet), i = [], c = [];
529
+ if (d) {
530
+ const l = typeof d == "string" ? d : te;
531
+ i.push({
532
+ key: "passkey-disclosure",
533
+ slot: "after-wallet-info",
534
+ order: 5,
535
+ enabled: s,
536
+ render: (u) => /* @__PURE__ */ e(se, { ctx: u, text: l })
537
+ });
538
+ }
539
+ if (o && i.push({
540
+ key: "passkey-session",
541
+ slot: "after-wallet-info",
542
+ order: 10,
543
+ enabled: s,
544
+ render: (l) => /* @__PURE__ */ e(me, { ctx: l })
545
+ }), t) {
546
+ const l = typeof t == "object" ? t.displayTimeout : void 0;
547
+ i.push({
548
+ key: "passkey-recovery-trigger",
549
+ slot: "after-wallet-info",
550
+ order: 20,
551
+ enabled: s,
552
+ render: (u) => /* @__PURE__ */ e(de, { ctx: u })
553
+ }), c.push({
554
+ key: U,
555
+ render: ({ onClose: u, ctx: v }) => /* @__PURE__ */ e(
556
+ le,
557
+ {
558
+ ctx: v,
559
+ onClose: u,
560
+ displayTimeout: l
561
+ }
562
+ )
563
+ });
564
+ }
565
+ return {
566
+ id: "passkey",
567
+ name: "Passkey",
568
+ menuItems: i,
569
+ dialogs: c
570
+ };
571
+ }
572
+ export {
573
+ te as DEFAULT_PASSKEY_DISCLOSURE,
574
+ U as PASSKEY_RECOVERY_DIALOG,
575
+ we as passkeyPlugin,
576
+ W as usePasskeyAdapter
577
+ };
578
+ //# sourceMappingURL=passkey.js.map