@txnlab/use-wallet-ui-react 1.2.1 → 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 (65) hide show
  1. package/README.md +121 -18
  2. package/dist/cjs/chunks/{floating-ui.react-O3sXJ80G.cjs → floating-ui.react-ChfuPAKc.cjs} +1 -1
  3. package/dist/cjs/chunks/{floating-ui.react-O3sXJ80G.cjs.map → floating-ui.react-ChfuPAKc.cjs.map} +1 -1
  4. package/dist/cjs/chunks/passkey-C8Dw6sNL.cjs +2 -0
  5. package/dist/cjs/chunks/passkey-C8Dw6sNL.cjs.map +1 -0
  6. package/dist/cjs/index.cjs +14 -14
  7. package/dist/cjs/index.cjs.map +1 -1
  8. package/dist/cjs/plugins/export-key.cjs +2 -2
  9. package/dist/cjs/plugins/export-key.cjs.map +1 -1
  10. package/dist/cjs/plugins/passkey.cjs +2 -0
  11. package/dist/cjs/plugins/passkey.cjs.map +1 -0
  12. package/dist/esm/chunks/{floating-ui.react-Co7v2aHO.js → floating-ui.react-CxJSDrxv.js} +1 -1
  13. package/dist/esm/chunks/{floating-ui.react-Co7v2aHO.js.map → floating-ui.react-CxJSDrxv.js.map} +1 -1
  14. package/dist/esm/chunks/passkey-BbgvIGki.js +44 -0
  15. package/dist/esm/chunks/passkey-BbgvIGki.js.map +1 -0
  16. package/dist/esm/index.js +2888 -2601
  17. package/dist/esm/index.js.map +1 -1
  18. package/dist/esm/plugins/export-key.js +13 -12
  19. package/dist/esm/plugins/export-key.js.map +1 -1
  20. package/dist/esm/plugins/passkey.js +578 -0
  21. package/dist/esm/plugins/passkey.js.map +1 -0
  22. package/dist/style.css +152 -0
  23. package/dist/types/components/ConnectWalletMenu.d.ts +7 -1
  24. package/dist/types/components/ConnectWalletMenu.d.ts.map +1 -1
  25. package/dist/types/components/ConnectedWalletMenu.d.ts.map +1 -1
  26. package/dist/types/components/PasskeyConnect.d.ts +29 -0
  27. package/dist/types/components/PasskeyConnect.d.ts.map +1 -0
  28. package/dist/types/components/WalletButton.d.ts +7 -1
  29. package/dist/types/components/WalletButton.d.ts.map +1 -1
  30. package/dist/types/components/WalletGroupLabel.d.ts +6 -0
  31. package/dist/types/components/WalletGroupLabel.d.ts.map +1 -0
  32. package/dist/types/components/WalletIcon.d.ts +6 -0
  33. package/dist/types/components/WalletIcon.d.ts.map +1 -0
  34. package/dist/types/components/WalletList.d.ts.map +1 -1
  35. package/dist/types/index.d.cts +5 -0
  36. package/dist/types/index.d.ts +5 -0
  37. package/dist/types/index.d.ts.map +1 -1
  38. package/dist/types/plugins/passkey/PasskeyDisclosure.d.ts +11 -0
  39. package/dist/types/plugins/passkey/PasskeyDisclosure.d.ts.map +1 -0
  40. package/dist/types/plugins/passkey/PasskeyRecoveryDialog.d.ts +10 -0
  41. package/dist/types/plugins/passkey/PasskeyRecoveryDialog.d.ts.map +1 -0
  42. package/dist/types/plugins/passkey/PasskeyRecoveryMenuButton.d.ts +5 -0
  43. package/dist/types/plugins/passkey/PasskeyRecoveryMenuButton.d.ts.map +1 -0
  44. package/dist/types/plugins/passkey/PasskeySessionControl.d.ts +6 -0
  45. package/dist/types/plugins/passkey/PasskeySessionControl.d.ts.map +1 -0
  46. package/dist/types/plugins/passkey/constants.d.ts +3 -0
  47. package/dist/types/plugins/passkey/constants.d.ts.map +1 -0
  48. package/dist/types/plugins/passkey/index.d.cts +36 -0
  49. package/dist/types/plugins/passkey/index.d.ts +36 -0
  50. package/dist/types/plugins/passkey/index.d.ts.map +1 -0
  51. package/dist/types/plugins/passkey/index.test.d.ts +2 -0
  52. package/dist/types/plugins/passkey/index.test.d.ts.map +1 -0
  53. package/dist/types/plugins/passkey/storage.d.ts +5 -0
  54. package/dist/types/plugins/passkey/storage.d.ts.map +1 -0
  55. package/dist/types/plugins/passkey/storage.test.d.ts +2 -0
  56. package/dist/types/plugins/passkey/storage.test.d.ts.map +1 -0
  57. package/dist/types/plugins/passkey/usePasskeyAdapter.d.ts +10 -0
  58. package/dist/types/plugins/passkey/usePasskeyAdapter.d.ts.map +1 -0
  59. package/dist/types/providers/WalletUIProvider.d.ts +15 -1
  60. package/dist/types/providers/WalletUIProvider.d.ts.map +1 -1
  61. package/dist/types/utils/passkey.d.ts +59 -0
  62. package/dist/types/utils/passkey.d.ts.map +1 -0
  63. package/dist/types/utils/passkey.test.d.ts +2 -0
  64. package/dist/types/utils/passkey.test.d.ts.map +1 -0
  65. package/package.json +16 -4
@@ -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