@worldcoin/idkit 2.4.2 → 4.0.0-dev.fe98789

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs ADDED
@@ -0,0 +1,1764 @@
1
+ 'use strict';
2
+
3
+ var idkitCore = require('@worldcoin/idkit-core');
4
+ var react = require('react');
5
+ var reactDom = require('react-dom');
6
+ var jsxRuntime = require('react/jsx-runtime');
7
+ var QRCodeUtil = require('qrcode/lib/core/qrcode.js');
8
+
9
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
10
+
11
+ var QRCodeUtil__default = /*#__PURE__*/_interopDefault(QRCodeUtil);
12
+
13
+ // src/hooks/useIDKitRequest.ts
14
+ function createInitialHookState() {
15
+ return {
16
+ isOpen: false,
17
+ status: "idle",
18
+ connectorURI: null,
19
+ result: null,
20
+ errorCode: null
21
+ };
22
+ }
23
+ function ensureNotAborted(signal) {
24
+ if (signal?.aborted) {
25
+ throw idkitCore.IDKitErrorCodes.Cancelled;
26
+ }
27
+ }
28
+ async function delay(ms, signal) {
29
+ if (!signal) {
30
+ await new Promise((resolve) => setTimeout(resolve, ms));
31
+ return;
32
+ }
33
+ await new Promise((resolve, reject) => {
34
+ const timeout = setTimeout(() => {
35
+ signal.removeEventListener("abort", abortHandler);
36
+ resolve();
37
+ }, ms);
38
+ const abortHandler = () => {
39
+ clearTimeout(timeout);
40
+ signal.removeEventListener("abort", abortHandler);
41
+ reject(idkitCore.IDKitErrorCodes.Cancelled);
42
+ };
43
+ signal.addEventListener("abort", abortHandler, { once: true });
44
+ });
45
+ }
46
+ var knownErrorCodes = new Set(Object.values(idkitCore.IDKitErrorCodes));
47
+ function asKnownErrorCode(value) {
48
+ if (typeof value === "string" && knownErrorCodes.has(value)) {
49
+ return value;
50
+ }
51
+ return null;
52
+ }
53
+ function toErrorCode(error) {
54
+ const directCode = asKnownErrorCode(error);
55
+ if (directCode) {
56
+ return directCode;
57
+ }
58
+ if (typeof error === "object" && error !== null && "code" in error) {
59
+ const nestedCode = asKnownErrorCode(error.code);
60
+ if (nestedCode) {
61
+ return nestedCode;
62
+ }
63
+ }
64
+ return idkitCore.IDKitErrorCodes.GenericError;
65
+ }
66
+
67
+ // src/hooks/useIDKitFlow.ts
68
+ function useIDKitFlow(createFlowHandle, config) {
69
+ const [state, setState] = react.useState(
70
+ createInitialHookState
71
+ );
72
+ const abortRef = react.useRef(null);
73
+ const createFlowHandleRef = react.useRef(createFlowHandle);
74
+ const configRef = react.useRef(config);
75
+ createFlowHandleRef.current = createFlowHandle;
76
+ configRef.current = config;
77
+ const reset = react.useCallback(() => {
78
+ abortRef.current?.abort();
79
+ abortRef.current = null;
80
+ setState(createInitialHookState);
81
+ }, []);
82
+ const open = react.useCallback(() => {
83
+ setState((prev) => {
84
+ if (prev.isOpen) {
85
+ return prev;
86
+ }
87
+ return {
88
+ isOpen: true,
89
+ status: "waiting_for_connection",
90
+ connectorURI: null,
91
+ result: null,
92
+ errorCode: null
93
+ };
94
+ });
95
+ }, []);
96
+ react.useEffect(() => {
97
+ if (!state.isOpen) {
98
+ return;
99
+ }
100
+ const controller = new AbortController();
101
+ abortRef.current = controller;
102
+ const setFailed = (errorCode) => {
103
+ setState((prev) => {
104
+ if (prev.status === "failed" && prev.errorCode === errorCode) {
105
+ return prev;
106
+ }
107
+ return {
108
+ ...prev,
109
+ status: "failed",
110
+ errorCode
111
+ };
112
+ });
113
+ };
114
+ void (async () => {
115
+ try {
116
+ await idkitCore.IDKit.init();
117
+ ensureNotAborted(controller.signal);
118
+ const request = await createFlowHandleRef.current();
119
+ ensureNotAborted(controller.signal);
120
+ setState((prev) => {
121
+ if (prev.connectorURI === request.connectorURI) {
122
+ return prev;
123
+ }
124
+ return { ...prev, connectorURI: request.connectorURI };
125
+ });
126
+ const pollInterval = configRef.current.polling?.interval ?? 1e3;
127
+ const timeout = configRef.current.polling?.timeout ?? 3e5;
128
+ const startedAt = Date.now();
129
+ while (true) {
130
+ ensureNotAborted(controller.signal);
131
+ if (Date.now() - startedAt > timeout) {
132
+ setFailed(idkitCore.IDKitErrorCodes.Timeout);
133
+ return;
134
+ }
135
+ const nextStatus = await request.pollOnce();
136
+ ensureNotAborted(controller.signal);
137
+ if (nextStatus.type === "confirmed") {
138
+ const confirmedResult = nextStatus.result;
139
+ if (!confirmedResult) {
140
+ setFailed(idkitCore.IDKitErrorCodes.UnexpectedResponse);
141
+ return;
142
+ }
143
+ setState((prev) => ({
144
+ ...prev,
145
+ status: "confirmed",
146
+ result: confirmedResult,
147
+ errorCode: null
148
+ }));
149
+ return;
150
+ }
151
+ if (nextStatus.type === "failed") {
152
+ setFailed(nextStatus.error ?? idkitCore.IDKitErrorCodes.GenericError);
153
+ return;
154
+ }
155
+ setState((prev) => {
156
+ if (prev.status === nextStatus.type) {
157
+ return prev;
158
+ }
159
+ return { ...prev, status: nextStatus.type };
160
+ });
161
+ await delay(pollInterval, controller.signal);
162
+ }
163
+ } catch (error) {
164
+ if (controller.signal.aborted) {
165
+ return;
166
+ }
167
+ setFailed(toErrorCode(error));
168
+ }
169
+ })();
170
+ return () => {
171
+ controller.abort();
172
+ if (abortRef.current === controller) {
173
+ abortRef.current = null;
174
+ }
175
+ };
176
+ }, [state.isOpen]);
177
+ return {
178
+ open,
179
+ reset,
180
+ isAwaitingUserConnection: state.status === "waiting_for_connection",
181
+ isAwaitingUserConfirmation: state.status === "awaiting_confirmation",
182
+ isSuccess: state.status === "confirmed",
183
+ isError: state.status === "failed",
184
+ connectorURI: state.connectorURI,
185
+ result: state.result,
186
+ errorCode: state.errorCode,
187
+ isOpen: state.isOpen
188
+ };
189
+ }
190
+
191
+ // src/hooks/useIDKitRequest.ts
192
+ function useIDKitRequest(config) {
193
+ return useIDKitFlow(
194
+ () => idkitCore.IDKit.request({
195
+ app_id: config.app_id,
196
+ action: config.action,
197
+ rp_context: config.rp_context,
198
+ action_description: config.action_description,
199
+ bridge_url: config.bridge_url,
200
+ allow_legacy_proofs: config.allow_legacy_proofs,
201
+ override_connect_base_url: config.override_connect_base_url,
202
+ environment: config.environment
203
+ }).preset(config.preset),
204
+ config
205
+ );
206
+ }
207
+ function assertSessionId(sessionId) {
208
+ if (sessionId === void 0) {
209
+ return void 0;
210
+ }
211
+ if (sessionId.trim().length === 0) {
212
+ throw idkitCore.IDKitErrorCodes.MalformedRequest;
213
+ }
214
+ return sessionId;
215
+ }
216
+ function useIDKitSession(config) {
217
+ return useIDKitFlow(() => {
218
+ const existingSessionId = assertSessionId(config.existing_session_id);
219
+ const builder = existingSessionId ? idkitCore.IDKit.proveSession(existingSessionId, {
220
+ app_id: config.app_id,
221
+ rp_context: config.rp_context,
222
+ action_description: config.action_description,
223
+ bridge_url: config.bridge_url,
224
+ override_connect_base_url: config.override_connect_base_url,
225
+ environment: config.environment
226
+ }) : idkitCore.IDKit.createSession({
227
+ app_id: config.app_id,
228
+ rp_context: config.rp_context,
229
+ action_description: config.action_description,
230
+ bridge_url: config.bridge_url,
231
+ override_connect_base_url: config.override_connect_base_url,
232
+ environment: config.environment
233
+ });
234
+ return builder.preset(config.preset);
235
+ }, config);
236
+ }
237
+
238
+ // src/styles/widgetStyles.ts
239
+ var WIDGET_STYLES = `
240
+ @font-face {
241
+ font-family: 'TWK Lausanne';
242
+ src: url('https://world-id-assets.com/fonts/TWKLausanne-200.woff2') format('woff2');
243
+ font-weight: 200;
244
+ font-style: normal;
245
+ font-display: swap;
246
+ }
247
+ @font-face {
248
+ font-family: 'TWK Lausanne';
249
+ src: url('https://world-id-assets.com/fonts/TWKLausanne-300.woff2') format('woff2');
250
+ font-weight: 300;
251
+ font-style: normal;
252
+ font-display: swap;
253
+ }
254
+ @font-face {
255
+ font-family: 'TWK Lausanne';
256
+ src: url('https://world-id-assets.com/fonts/TWKLausanne-400.woff2') format('woff2');
257
+ font-weight: 400;
258
+ font-style: normal;
259
+ font-display: swap;
260
+ }
261
+ @font-face {
262
+ font-family: 'TWK Lausanne';
263
+ src: url('https://world-id-assets.com/fonts/TWKLausanne-500.woff2') format('woff2');
264
+ font-weight: 500;
265
+ font-style: normal;
266
+ font-display: swap;
267
+ }
268
+ @font-face {
269
+ font-family: 'TWK Lausanne';
270
+ src: url('https://world-id-assets.com/fonts/TWKLausanne-600.woff2') format('woff2');
271
+ font-weight: 600;
272
+ font-style: normal;
273
+ font-display: swap;
274
+ }
275
+
276
+ /* CSS Custom Properties */
277
+ :host {
278
+ --idkit-font: 'TWK Lausanne', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
279
+ --idkit-bg: #ffffff;
280
+ --idkit-text: #0d151d;
281
+ --idkit-text-muted: #657080;
282
+ --idkit-text-secondary: #9eafc0;
283
+ --idkit-border: #EBECEF;
284
+ --idkit-border-light: #f1f5f8;
285
+ --idkit-surface: #f8fafc;
286
+ --idkit-success: #00C230;
287
+ --idkit-error: #9BA3AE;
288
+ --idkit-warning: #FFAE00;
289
+ --idkit-btn-bg: #0d151d;
290
+ --idkit-btn-text: #ffffff;
291
+ }
292
+ :host(.dark) {
293
+ --idkit-bg: #0d151d;
294
+ --idkit-text: #ffffff;
295
+ --idkit-text-muted: #9eafc0;
296
+ --idkit-text-secondary: #657080;
297
+ --idkit-border: rgba(235, 236, 239, 0.15);
298
+ --idkit-border-light: rgba(241, 245, 248, 0.1);
299
+ --idkit-surface: rgba(255, 255, 255, 0.05);
300
+ --idkit-btn-bg: #ffffff;
301
+ --idkit-btn-text: #0d151d;
302
+ }
303
+
304
+ /* Animations */
305
+ @keyframes idkit-fade-in {
306
+ from { opacity: 0; }
307
+ to { opacity: 1; }
308
+ }
309
+ @keyframes idkit-scale-in {
310
+ from { opacity: 0; transform: scale(0.9); }
311
+ to { opacity: 1; transform: scale(1); }
312
+ }
313
+ @keyframes idkit-slide-up {
314
+ from { transform: translateY(100%); }
315
+ to { transform: translateY(0); }
316
+ }
317
+ @keyframes idkit-spin {
318
+ from { transform: rotate(0deg); }
319
+ to { transform: rotate(360deg); }
320
+ }
321
+ @keyframes idkit-pulse {
322
+ 0%, 100% { opacity: 1; }
323
+ 50% { opacity: 0.5; }
324
+ }
325
+
326
+ /* Backdrop */
327
+ .idkit-backdrop {
328
+ position: fixed;
329
+ inset: 0;
330
+ background: rgba(0, 0, 0, 0.5);
331
+ backdrop-filter: blur(12px);
332
+ -webkit-backdrop-filter: blur(12px);
333
+ display: flex;
334
+ align-items: center;
335
+ justify-content: center;
336
+ z-index: 2147483646;
337
+ padding: 16px;
338
+ animation: idkit-fade-in 0.2s ease-out;
339
+ }
340
+
341
+ /* Modal */
342
+ .idkit-modal {
343
+ position: relative;
344
+ width: 100%;
345
+ max-width: 448px;
346
+ min-height: 35rem;
347
+ background: var(--idkit-bg);
348
+ border-radius: 24px;
349
+ box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28), 0 0 0 1px rgba(0, 0, 0, 0.04);
350
+ font-family: var(--idkit-font);
351
+ color: var(--idkit-text);
352
+ display: flex;
353
+ flex-direction: column;
354
+ overflow: hidden;
355
+ animation: idkit-scale-in 0.25s ease-out;
356
+ }
357
+
358
+ /* Close button */
359
+ .idkit-close {
360
+ position: absolute;
361
+ top: 24px;
362
+ right: 24px;
363
+ display: flex;
364
+ align-items: center;
365
+ justify-content: center;
366
+ width: 32px;
367
+ height: 32px;
368
+ border: 1.2px solid var(--idkit-border);
369
+ border-radius: 50%;
370
+ background: transparent;
371
+ color: var(--idkit-text);
372
+ cursor: pointer;
373
+ padding: 0;
374
+ z-index: 1;
375
+ transition: background 0.15s ease;
376
+ }
377
+ .idkit-close:hover {
378
+ background: var(--idkit-surface);
379
+ }
380
+ .idkit-close svg {
381
+ width: 16px;
382
+ height: 16px;
383
+ }
384
+
385
+ /* Content area */
386
+ .idkit-content {
387
+ flex: 1;
388
+ display: flex;
389
+ flex-direction: column;
390
+ align-items: center;
391
+ justify-content: center;
392
+ padding: 24px 24px 24px;
393
+ text-align: center;
394
+ }
395
+
396
+ /* Footer */
397
+ .idkit-footer {
398
+ border-top: 1px solid #F5F5F7;
399
+ padding: 28px 32px;
400
+ text-align: center;
401
+ }
402
+ :host(.dark) .idkit-footer {
403
+ border-top-color: rgba(245, 245, 247, 0.15);
404
+ }
405
+ .idkit-footer a {
406
+ color: var(--idkit-text-muted);
407
+ font-size: 14px;
408
+ text-decoration: none;
409
+ transition: color 0.15s ease;
410
+ }
411
+ .idkit-footer a:hover {
412
+ color: var(--idkit-text);
413
+ }
414
+
415
+ /* World ID State */
416
+ .idkit-worldid-icon {
417
+ display: flex;
418
+ align-items: center;
419
+ justify-content: center;
420
+ width: 56px;
421
+ height: 56px;
422
+ border-radius: 50%;
423
+ border: 1.2px solid var(--idkit-border);
424
+ margin-bottom: 16px;
425
+ }
426
+ .idkit-worldid-icon svg {
427
+ width: 32px;
428
+ height: 32px;
429
+ color: var(--idkit-text);
430
+ }
431
+
432
+ .idkit-heading {
433
+ margin: 0;
434
+ font-size: 24px;
435
+ font-weight: 600;
436
+ line-height: 1.2;
437
+ color: var(--idkit-text);
438
+ }
439
+
440
+ .idkit-subtext {
441
+ margin: 12px 0 0;
442
+ font-size: 16px;
443
+ line-height: 1.4;
444
+ color: var(--idkit-text-muted);
445
+ }
446
+
447
+ /* QR Container */
448
+ .idkit-qr-container {
449
+ position: relative;
450
+ width: 100%;
451
+ margin-top: 40px;
452
+ }
453
+
454
+ .idkit-qr-overlay {
455
+ position: absolute;
456
+ inset: 0;
457
+ display: flex;
458
+ flex-direction: column;
459
+ align-items: center;
460
+ justify-content: center;
461
+ gap: 24px;
462
+ z-index: 2;
463
+ }
464
+
465
+ .idkit-qr-blur {
466
+ transition: filter 0.5s ease-in-out, opacity 0.5s ease-in-out;
467
+ }
468
+ .idkit-qr-blur.blurred {
469
+ filter: blur(16px);
470
+ opacity: 0.4;
471
+ }
472
+
473
+ .idkit-qr-wrapper {
474
+ display: inline-flex;
475
+ align-items: center;
476
+ justify-content: center;
477
+ border-radius: 16px;
478
+ border: 1px solid var(--idkit-border-light);
479
+ padding: 12px;
480
+ }
481
+
482
+ .idkit-qr-inner {
483
+ color: var(--idkit-text);
484
+ }
485
+
486
+ /* QR Code SVG colors for finder patterns */
487
+ .idkit-qr-inner .qr-finder-dark { color: #000000; }
488
+ .idkit-qr-inner .qr-finder-light { color: #ffffff; }
489
+ :host(.dark) .idkit-qr-inner .qr-finder-dark { color: #000000; }
490
+ :host(.dark) .idkit-qr-inner .qr-finder-light { color: #ffffff; }
491
+ .idkit-qr-inner .qr-dot { color: #000000; }
492
+ :host(.dark) .idkit-qr-inner .qr-dot { color: #ffffff; }
493
+
494
+ /* QR Placeholder */
495
+ .idkit-qr-placeholder {
496
+ width: 200px;
497
+ height: 200px;
498
+ display: flex;
499
+ align-items: center;
500
+ justify-content: center;
501
+ }
502
+ .idkit-qr-placeholder svg {
503
+ width: 200px;
504
+ height: 200px;
505
+ animation: idkit-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
506
+ }
507
+
508
+ /* Copy toast \u2014 absolutely positioned so it never shifts layout */
509
+ .idkit-copy-toast {
510
+ position: absolute;
511
+ bottom: 100%;
512
+ left: 50%;
513
+ transform: translateX(-50%);
514
+ margin-bottom: 8px;
515
+ opacity: 0;
516
+ transition: opacity 0.25s ease-in-out;
517
+ pointer-events: none;
518
+ white-space: nowrap;
519
+ }
520
+ .idkit-copy-toast.visible {
521
+ opacity: 1;
522
+ transition: opacity 0.2s ease-in-out 0.05s;
523
+ }
524
+ .idkit-copy-toast > span {
525
+ display: inline-block;
526
+ border-radius: 8px;
527
+ border: 1px solid var(--idkit-border-light);
528
+ padding: 4px 8px;
529
+ font-size: 14px;
530
+ color: var(--idkit-text-secondary);
531
+ }
532
+
533
+ /* Mobile deep-link button */
534
+ .idkit-deeplink-btn {
535
+ display: flex;
536
+ width: 100%;
537
+ align-items: center;
538
+ gap: 8px;
539
+ border-radius: 16px;
540
+ border: 1px solid transparent;
541
+ background: var(--idkit-btn-bg);
542
+ color: var(--idkit-btn-text);
543
+ padding: 16px;
544
+ font-family: var(--idkit-font);
545
+ font-size: 16px;
546
+ font-weight: 500;
547
+ text-decoration: none;
548
+ cursor: pointer;
549
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
550
+ }
551
+ .idkit-deeplink-btn svg {
552
+ width: 20px;
553
+ height: 20px;
554
+ flex-shrink: 0;
555
+ }
556
+ .idkit-deeplink-btn span {
557
+ flex: 1;
558
+ text-align: center;
559
+ }
560
+
561
+ /* Loading spinner */
562
+ .idkit-spinner {
563
+ animation: idkit-spin 1s linear infinite;
564
+ }
565
+ .idkit-spinner svg {
566
+ width: 24px;
567
+ height: 24px;
568
+ }
569
+
570
+ .idkit-connecting-text {
571
+ text-align: center;
572
+ }
573
+ .idkit-connecting-text p:first-child {
574
+ font-weight: 500;
575
+ color: var(--idkit-text-muted);
576
+ margin: 0;
577
+ }
578
+ .idkit-connecting-text p:last-child {
579
+ font-size: 14px;
580
+ font-weight: 300;
581
+ color: var(--idkit-text-muted);
582
+ margin: 4px 0 0;
583
+ }
584
+
585
+ /* Success State */
586
+ .idkit-success-icon {
587
+ display: flex;
588
+ align-items: center;
589
+ justify-content: center;
590
+ margin-bottom: 24px;
591
+ }
592
+ .idkit-success-icon svg {
593
+ width: 96px;
594
+ height: 96px;
595
+ }
596
+
597
+ /* Error State */
598
+ .idkit-error-icon {
599
+ display: flex;
600
+ align-items: center;
601
+ justify-content: center;
602
+ margin-bottom: 24px;
603
+ }
604
+ .idkit-error-icon svg {
605
+ width: 96px;
606
+ height: 96px;
607
+ }
608
+
609
+ .idkit-error-title {
610
+ margin: 0;
611
+ font-size: 24px;
612
+ font-weight: 600;
613
+ color: var(--idkit-text);
614
+ }
615
+
616
+ .idkit-error-message {
617
+ margin: 8px auto 0;
618
+ max-width: 224px;
619
+ font-size: 16px;
620
+ color: var(--idkit-text-muted);
621
+ line-height: 1.4;
622
+ }
623
+
624
+ /* Retry button */
625
+ .idkit-retry-btn {
626
+ display: inline-flex;
627
+ align-items: center;
628
+ border-radius: 9999px;
629
+ border: 1.2px solid var(--idkit-border);
630
+ background: transparent;
631
+ padding: 12px 32px;
632
+ font-family: var(--idkit-font);
633
+ font-size: 16px;
634
+ font-weight: 600;
635
+ color: var(--idkit-text);
636
+ cursor: pointer;
637
+ transition: box-shadow 0.3s ease;
638
+ margin-top: 32px;
639
+ }
640
+ .idkit-retry-btn:hover {
641
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
642
+ }
643
+
644
+ /* Success subtext: old SDK used text-lg (18px) */
645
+ .idkit-success-icon ~ .idkit-subtext {
646
+ font-size: 18px;
647
+ line-height: 1.56;
648
+ }
649
+
650
+ /* Responsive: mobile full-screen bottom-anchored */
651
+ @media (max-width: 1024px) {
652
+ .idkit-backdrop {
653
+ align-items: flex-end;
654
+ padding: 0;
655
+ }
656
+ .idkit-modal {
657
+ max-width: 100%;
658
+ min-height: auto;
659
+ max-height: 95vh;
660
+ border-radius: 24px 24px 0 0;
661
+ animation: idkit-slide-up 0.3s ease-out;
662
+ }
663
+
664
+ /* Hide desktop QR on mobile */
665
+ .idkit-desktop-only {
666
+ display: none;
667
+ }
668
+ .idkit-mobile-only {
669
+ display: block;
670
+ }
671
+ }
672
+
673
+ @media (min-width: 1025px) {
674
+ .idkit-mobile-only {
675
+ display: none;
676
+ }
677
+ .idkit-desktop-only {
678
+ display: block;
679
+ position: relative;
680
+ }
681
+ .idkit-subtext {
682
+ margin-top: 8px;
683
+ }
684
+ }
685
+ `;
686
+ function ShadowHost({ children }) {
687
+ const [root, setRoot] = react.useState(null);
688
+ react.useEffect(() => {
689
+ if (typeof document === "undefined") {
690
+ return;
691
+ }
692
+ const host = document.createElement("div");
693
+ host.setAttribute("data-idkit-shadow-host", "true");
694
+ document.body.appendChild(host);
695
+ const shadowRoot = host.attachShadow({ mode: "open" });
696
+ setRoot(shadowRoot);
697
+ return () => {
698
+ host.remove();
699
+ setRoot(null);
700
+ };
701
+ }, []);
702
+ if (!root) {
703
+ return null;
704
+ }
705
+ return reactDom.createPortal(children, root);
706
+ }
707
+ function XMarkIcon(props) {
708
+ return /* @__PURE__ */ jsxRuntime.jsx(
709
+ "svg",
710
+ {
711
+ xmlns: "http://www.w3.org/2000/svg",
712
+ fill: "none",
713
+ viewBox: "0 0 24 24",
714
+ ...props,
715
+ children: /* @__PURE__ */ jsxRuntime.jsx(
716
+ "path",
717
+ {
718
+ strokeWidth: "1.5",
719
+ stroke: "currentColor",
720
+ strokeLinecap: "round",
721
+ strokeLinejoin: "round",
722
+ d: "m16.243 7.758-8.485 8.485m8.485 0L7.758 7.758"
723
+ }
724
+ )
725
+ }
726
+ );
727
+ }
728
+
729
+ // src/lang/translations/en.ts
730
+ var en = {
731
+ "All set!": "All set!",
732
+ "Your World ID is now connected": "Your World ID is now connected",
733
+ "Something went wrong": "Something went wrong",
734
+ "Request cancelled": "Request cancelled",
735
+ "You've cancelled the request in World App.": "You've cancelled the request in World App.",
736
+ "Connection lost": "Connection lost",
737
+ "Please check your connection and try again.": "Please check your connection and try again.",
738
+ "We couldn't complete your request. Please try again.": "We couldn't complete your request. Please try again.",
739
+ "Try Again": "Try Again",
740
+ "Open World App": "Open World App",
741
+ "QR Code copied": "QR Code copied",
742
+ "Connect your World ID": "Connect your World ID",
743
+ "Use phone camera to scan the QR code": "Use phone camera to scan the QR code",
744
+ "Connecting...": "Connecting...",
745
+ "Please continue in app": "Please continue in app",
746
+ "You will be redirected to the app, please return to this page once you're done": "You will be redirected to the app, please return to this page once you're done",
747
+ "Terms & Privacy": "Terms & Privacy"
748
+ };
749
+
750
+ // src/lang/translations/es.ts
751
+ var es = {
752
+ "All set!": "\xA1Todo listo!",
753
+ "Your World ID is now connected": "Tu World ID ahora est\xE1 conectado",
754
+ "Something went wrong": "Algo sali\xF3 mal",
755
+ "Request cancelled": "Solicitud cancelada",
756
+ "You've cancelled the request in World App.": "Has cancelado la solicitud en World App.",
757
+ "Connection lost": "Conexion perdida",
758
+ "Please check your connection and try again.": "Por favor verifica tu conexion e intenta de nuevo.",
759
+ "We couldn't complete your request. Please try again.": "No pudimos completar tu solicitud. Por favor intenta de nuevo.",
760
+ "Try Again": "Intentar de nuevo",
761
+ "Open World App": "Abrir World App",
762
+ "QR Code copied": "C\xF3digo QR copiado",
763
+ "Connect your World ID": "Conecta tu World ID",
764
+ "Use phone camera to scan the QR code": "Usa la c\xE1mara del tel\xE9fono para escanear el c\xF3digo QR",
765
+ "Connecting...": "Conectando...",
766
+ "Please continue in app": "Por favor contin\xFAa en la aplicaci\xF3n",
767
+ "You will be redirected to the app, please return to this page once you're done": "Ser\xE1s redirigido a la aplicaci\xF3n, por favor regresa a esta p\xE1gina una vez que hayas terminado",
768
+ "Terms & Privacy": "T\xE9rminos y privacidad"
769
+ };
770
+
771
+ // src/lang/translations/th.ts
772
+ var th = {
773
+ "All set!": "\u0E40\u0E23\u0E35\u0E22\u0E1A\u0E23\u0E49\u0E2D\u0E22!",
774
+ "Your World ID is now connected": "World ID \u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D\u0E41\u0E25\u0E49\u0E27",
775
+ "Something went wrong": "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14",
776
+ "Request cancelled": "\u0E04\u0E33\u0E02\u0E2D\u0E16\u0E39\u0E01\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01",
777
+ "You've cancelled the request in World App.": "\u0E04\u0E38\u0E13\u0E44\u0E14\u0E49\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01\u0E04\u0E33\u0E02\u0E2D\u0E43\u0E19 World App",
778
+ "Connection lost": "\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D\u0E02\u0E32\u0E14\u0E2B\u0E32\u0E22",
779
+ "Please check your connection and try again.": "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E15\u0E23\u0E27\u0E08\u0E2A\u0E2D\u0E1A\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D\u0E41\u0E25\u0E49\u0E27\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
780
+ "We couldn't complete your request. Please try again.": "\u0E40\u0E23\u0E32\u0E44\u0E21\u0E48\u0E2A\u0E32\u0E21\u0E32\u0E23\u0E16\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E15\u0E32\u0E21\u0E04\u0E33\u0E02\u0E2D\u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
781
+ "Try Again": "\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
782
+ "Open World App": "\u0E40\u0E1B\u0E34\u0E14 World App",
783
+ "QR Code copied": "\u0E04\u0E31\u0E14\u0E25\u0E2D\u0E01 QR Code \u0E41\u0E25\u0E49\u0E27",
784
+ "Connect your World ID": "\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D World ID \u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13",
785
+ "Use phone camera to scan the QR code": "\u0E43\u0E0A\u0E49\u0E01\u0E25\u0E49\u0E2D\u0E07\u0E42\u0E17\u0E23\u0E28\u0E31\u0E1E\u0E17\u0E4C\u0E40\u0E1E\u0E37\u0E48\u0E2D\u0E2A\u0E41\u0E01\u0E19 QR code",
786
+ "Connecting...": "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D...",
787
+ "Please continue in app": "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E15\u0E48\u0E2D\u0E43\u0E19\u0E41\u0E2D\u0E1B",
788
+ "You will be redirected to the app, please return to this page once you're done": "\u0E04\u0E38\u0E13\u0E08\u0E30\u0E16\u0E39\u0E01\u0E19\u0E33\u0E44\u0E1B\u0E22\u0E31\u0E07\u0E41\u0E2D\u0E1B \u0E01\u0E23\u0E38\u0E13\u0E32\u0E01\u0E25\u0E31\u0E1A\u0E21\u0E32\u0E17\u0E35\u0E48\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49\u0E40\u0E21\u0E37\u0E48\u0E2D\u0E40\u0E2A\u0E23\u0E47\u0E08\u0E41\u0E25\u0E49\u0E27",
789
+ "Terms & Privacy": "\u0E02\u0E49\u0E2D\u0E01\u0E33\u0E2B\u0E19\u0E14\u0E41\u0E25\u0E30\u0E04\u0E27\u0E32\u0E21\u0E40\u0E1B\u0E47\u0E19\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27"
790
+ };
791
+
792
+ // src/lang/translations/index.ts
793
+ var translations = {
794
+ en,
795
+ es,
796
+ th
797
+ };
798
+
799
+ // src/lang/localization.ts
800
+ var currentConfig = {};
801
+ var setLocalizationConfig = (config) => {
802
+ currentConfig = config;
803
+ };
804
+ var getLocalizationConfig = () => currentConfig;
805
+ var detectBrowserLanguage = () => {
806
+ if (typeof navigator === "undefined") return void 0;
807
+ for (const lang of navigator.languages) {
808
+ const [language] = lang.split("-");
809
+ const normalizedLang = language.toLowerCase();
810
+ if (normalizedLang in translations) {
811
+ return normalizedLang;
812
+ }
813
+ }
814
+ return void 0;
815
+ };
816
+ var getCurrentLanguage = () => {
817
+ const config = getLocalizationConfig();
818
+ if (config.language && config.language in translations) {
819
+ return config.language;
820
+ }
821
+ const browserLang = detectBrowserLanguage();
822
+ if (browserLang) {
823
+ return browserLang;
824
+ }
825
+ return "en";
826
+ };
827
+ var getTranslations = () => {
828
+ const currentLang = getCurrentLanguage();
829
+ return translations[currentLang];
830
+ };
831
+
832
+ // src/lang/index.ts
833
+ var getLang = () => {
834
+ return getTranslations();
835
+ };
836
+ var replaceParams = (str, params) => {
837
+ if (!params) return str;
838
+ let result = str;
839
+ for (const [key, value] of Object.entries(params)) {
840
+ result = result.replace(`:${key}`, value);
841
+ }
842
+ return result;
843
+ };
844
+ function __(str, ...args) {
845
+ const [params] = args;
846
+ if (typeof navigator === "undefined" && typeof window === "undefined") {
847
+ return replaceParams(str, params);
848
+ }
849
+ const translated = getLang()?.[str] ?? str;
850
+ return replaceParams(translated, params);
851
+ }
852
+ function ModalContent({
853
+ onOpenChange,
854
+ children
855
+ }) {
856
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
857
+ /* @__PURE__ */ jsxRuntime.jsx("style", { children: WIDGET_STYLES }),
858
+ /* @__PURE__ */ jsxRuntime.jsx(
859
+ "div",
860
+ {
861
+ className: "idkit-backdrop",
862
+ role: "presentation",
863
+ onClick: () => onOpenChange(false),
864
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
865
+ "section",
866
+ {
867
+ className: "idkit-modal",
868
+ role: "dialog",
869
+ "aria-modal": "true",
870
+ onClick: (event) => event.stopPropagation(),
871
+ children: [
872
+ /* @__PURE__ */ jsxRuntime.jsx(
873
+ "button",
874
+ {
875
+ type: "button",
876
+ className: "idkit-close",
877
+ onClick: () => onOpenChange(false),
878
+ "aria-label": "Close",
879
+ children: /* @__PURE__ */ jsxRuntime.jsx(XMarkIcon, {})
880
+ }
881
+ ),
882
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-content", children }),
883
+ /* @__PURE__ */ jsxRuntime.jsx("footer", { className: "idkit-footer", children: /* @__PURE__ */ jsxRuntime.jsx(
884
+ "a",
885
+ {
886
+ href: "https://developer.world.org/privacy-statement",
887
+ target: "_blank",
888
+ rel: "noopener noreferrer",
889
+ children: __("Terms & Privacy")
890
+ }
891
+ ) })
892
+ ]
893
+ }
894
+ )
895
+ }
896
+ )
897
+ ] });
898
+ }
899
+ function IDKitModal({
900
+ open,
901
+ onOpenChange,
902
+ children
903
+ }) {
904
+ react.useEffect(() => {
905
+ if (!open || typeof document === "undefined") {
906
+ return;
907
+ }
908
+ const handleEsc = (event) => {
909
+ if (event.key === "Escape") {
910
+ onOpenChange(false);
911
+ }
912
+ };
913
+ window.addEventListener("keydown", handleEsc);
914
+ return () => window.removeEventListener("keydown", handleEsc);
915
+ }, [onOpenChange, open]);
916
+ if (!open || typeof document === "undefined") {
917
+ return null;
918
+ }
919
+ const content = /* @__PURE__ */ jsxRuntime.jsx(ModalContent, { onOpenChange, children });
920
+ return /* @__PURE__ */ jsxRuntime.jsx(ShadowHost, { children: content });
921
+ }
922
+ function useMedia() {
923
+ const getInitialState = () => {
924
+ if (typeof window !== "undefined") {
925
+ return window.matchMedia("(max-width: 1024px)").matches ? "mobile" : "desktop";
926
+ }
927
+ return "desktop";
928
+ };
929
+ const [media, setMedia] = react.useState(getInitialState);
930
+ react.useEffect(() => {
931
+ const mql = window.matchMedia("(max-width: 1024px)");
932
+ const handleChange = (e) => setMedia(e.matches ? "mobile" : "desktop");
933
+ handleChange(mql);
934
+ mql.addEventListener("change", handleChange);
935
+ return () => {
936
+ mql.removeEventListener("change", handleChange);
937
+ };
938
+ }, []);
939
+ return media;
940
+ }
941
+ function WorldcoinIcon(props) {
942
+ return /* @__PURE__ */ jsxRuntime.jsx(
943
+ "svg",
944
+ {
945
+ xmlns: "http://www.w3.org/2000/svg",
946
+ width: "32",
947
+ height: "32",
948
+ viewBox: "0 0 32 32",
949
+ fill: "none",
950
+ ...props,
951
+ children: /* @__PURE__ */ jsxRuntime.jsx(
952
+ "path",
953
+ {
954
+ d: "M30.7367 9.77239C29.9301 7.86586 28.7772 6.15721 27.3084 4.68831C25.8397 3.21941 24.1275 2.06636 22.225 1.2596C20.2502 0.422405 18.1574 0 15.9962 0C13.8388 0 11.7422 0.422405 9.76742 1.2596C7.86112 2.06636 6.15268 3.21941 4.68395 4.68831C3.21522 6.15721 2.06231 7.86966 1.25565 9.77239C0.422354 11.7436 0 13.8404 0 15.9981C0 18.1558 0.422354 20.2526 1.25945 22.2276C2.06611 24.1341 3.21903 25.8428 4.68775 27.3117C6.15648 28.7806 7.86873 29.9336 9.77122 30.7404C11.746 31.5738 13.8388 32 16 32C18.1574 32 20.254 31.5776 22.2288 30.7404C24.1351 29.9336 25.8435 28.7806 27.3122 27.3117C28.781 25.8428 29.9339 24.1303 30.7405 22.2276C31.5738 20.2526 32 18.1596 32 15.9981C31.9962 13.8404 31.57 11.7436 30.7367 9.77239ZM10.6844 14.4949C11.3503 11.9377 13.679 10.0464 16.4452 10.0464H27.552C28.2673 11.4278 28.7239 12.9309 28.9027 14.4949H10.6844ZM28.9027 17.5012C28.7239 19.0653 28.2635 20.5684 27.552 21.9498H16.4452C13.6828 21.9498 11.3541 20.0585 10.6844 17.5012H28.9027ZM6.81094 6.81175C9.26516 4.35724 12.526 3.0063 15.9962 3.0063C19.4663 3.0063 22.7272 4.35724 25.1815 6.81175C25.2576 6.88786 25.3298 6.96397 25.4021 7.04008H16.4452C14.0518 7.04008 11.8031 7.97241 10.1099 9.66583C8.77812 10.9977 7.91819 12.6759 7.60999 14.4988H3.09346C3.42449 11.5952 4.71439 8.90855 6.81094 6.81175ZM15.9962 28.9937C12.526 28.9937 9.26516 27.6428 6.81094 25.1883C4.71439 23.0915 3.42449 20.4048 3.09346 17.5051H7.60999C7.91439 19.3279 8.77812 21.0061 10.1099 22.338C11.8031 24.0314 14.0518 24.9637 16.4452 24.9637H25.4059C25.3337 25.0398 25.2576 25.1159 25.1853 25.1921C22.731 27.639 19.4663 28.9937 15.9962 28.9937Z",
955
+ fill: "currentColor"
956
+ }
957
+ )
958
+ }
959
+ );
960
+ }
961
+ function LoadingIcon(props) {
962
+ return /* @__PURE__ */ jsxRuntime.jsxs(
963
+ "svg",
964
+ {
965
+ xmlns: "http://www.w3.org/2000/svg",
966
+ fill: "none",
967
+ viewBox: "0 0 24 24",
968
+ ...props,
969
+ children: [
970
+ /* @__PURE__ */ jsxRuntime.jsx(
971
+ "circle",
972
+ {
973
+ cx: "12",
974
+ cy: "12",
975
+ r: "10.75",
976
+ stroke: "#191C20",
977
+ strokeOpacity: ".16",
978
+ strokeWidth: "2.5"
979
+ }
980
+ ),
981
+ /* @__PURE__ */ jsxRuntime.jsx(
982
+ "path",
983
+ {
984
+ fill: "#191C20",
985
+ d: "M17.28 2.633c.338-.6.127-1.368-.505-1.642A12 12 0 0 0 7.459.892c-.638.261-.864 1.024-.539 1.632.326.607 1.08.827 1.725.584a9.504 9.504 0 0 1 6.897.073c.64.257 1.399.053 1.737-.548Z"
986
+ }
987
+ )
988
+ ]
989
+ }
990
+ );
991
+ }
992
+ var generateMatrix = (data) => {
993
+ const arr = QRCodeUtil__default.default.create(data, { errorCorrectionLevel: "M" }).modules.data;
994
+ const sqrt = Math.sqrt(arr.length);
995
+ return arr.reduce(
996
+ (rows, key, index) => {
997
+ if (index % sqrt === 0) rows.push([key]);
998
+ else rows[rows.length - 1].push(key);
999
+ return rows;
1000
+ },
1001
+ []
1002
+ );
1003
+ };
1004
+ function QRCodeInner({ data, size = 200 }) {
1005
+ const dots = react.useMemo(() => {
1006
+ const elements = [];
1007
+ const matrix = generateMatrix(data);
1008
+ const cellSize = size / matrix.length;
1009
+ const qrList = [
1010
+ { x: 0, y: 0 },
1011
+ { x: 1, y: 0 },
1012
+ { x: 0, y: 1 }
1013
+ ];
1014
+ qrList.forEach(({ x, y }) => {
1015
+ const x1 = (matrix.length - 7) * cellSize * x;
1016
+ const y1 = (matrix.length - 7) * cellSize * y;
1017
+ for (let i = 0; i < 3; i++) {
1018
+ elements.push(
1019
+ /* @__PURE__ */ jsxRuntime.jsx(
1020
+ "rect",
1021
+ {
1022
+ fill: "currentColor",
1023
+ x: x1 + cellSize * i,
1024
+ y: y1 + cellSize * i,
1025
+ width: cellSize * (7 - i * 2),
1026
+ height: cellSize * (7 - i * 2),
1027
+ rx: (i - 2) * -5,
1028
+ ry: (i - 2) * -5,
1029
+ className: i % 3 === 0 ? "qr-finder-dark" : i % 3 === 1 ? "qr-finder-light" : "qr-finder-dark"
1030
+ },
1031
+ `${i}-${x}-${y}`
1032
+ )
1033
+ );
1034
+ }
1035
+ });
1036
+ matrix.forEach((row, i) => {
1037
+ row.forEach((_, j) => {
1038
+ if (!matrix[i][j]) return;
1039
+ if (i < 7 && j < 7 || i > matrix.length - 8 && j < 7 || i < 7 && j > matrix.length - 8)
1040
+ return;
1041
+ elements.push(
1042
+ /* @__PURE__ */ jsxRuntime.jsx(
1043
+ "circle",
1044
+ {
1045
+ fill: "currentColor",
1046
+ r: cellSize / 2.2,
1047
+ cx: i * cellSize + cellSize / 2,
1048
+ cy: j * cellSize + cellSize / 2,
1049
+ className: "qr-dot"
1050
+ },
1051
+ `circle-${i}-${j}`
1052
+ )
1053
+ );
1054
+ });
1055
+ });
1056
+ return elements;
1057
+ }, [size, data]);
1058
+ return /* @__PURE__ */ jsxRuntime.jsx("svg", { height: size, width: size, "data-test-id": "qr-code", children: dots });
1059
+ }
1060
+ var QRCode = react.memo(QRCodeInner);
1061
+ function QRPlaceholderIcon(props) {
1062
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1063
+ "svg",
1064
+ {
1065
+ xmlns: "http://www.w3.org/2000/svg",
1066
+ fill: "none",
1067
+ viewBox: "0 0 200 200",
1068
+ ...props,
1069
+ children: [
1070
+ /* @__PURE__ */ jsxRuntime.jsx(
1071
+ "path",
1072
+ {
1073
+ fill: "#EBECEF",
1074
+ fillRule: "evenodd",
1075
+ d: "M12.1 0C5.417 0 0 5.417 0 12.1v18.505c0 6.682 5.417 12.1 12.1 12.1h18.505c6.682 0 12.1-5.418 12.1-12.1V12.1c0-6.683-5.418-12.1-12.1-12.1H12.1Zm18.505 11.388H12.1a.712.712 0 0 0-.712.712v18.505c0 .393.319.712.712.712h18.505a.712.712 0 0 0 .712-.712V12.1a.712.712 0 0 0-.712-.712Z",
1076
+ clipRule: "evenodd"
1077
+ }
1078
+ ),
1079
+ /* @__PURE__ */ jsxRuntime.jsx(
1080
+ "path",
1081
+ {
1082
+ fill: "#EBECEF",
1083
+ d: "M197.026 200c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-17.616c0-.778-.313-1.525-.871-2.076a2.996 2.996 0 0 0-2.103-.86h-5.948c-.789 0-1.545.31-2.103.86a2.918 2.918 0 0 0-.871 2.076v8.808h-11.897v-11.744h-11.896v-23.487h11.896v8.808c0 .778.314 1.525.872 2.076.557.55 1.314.86 2.102.86h5.949c.788 0 1.545-.31 2.103-.86a2.922 2.922 0 0 0 .871-2.076v-8.808h8.922c.789 0 1.545-.309 2.103-.86a2.916 2.916 0 0 0 .871-2.076v-5.872c0-.779-.313-1.525-.871-2.076a2.992 2.992 0 0 0-2.103-.86h-29.741c-.789 0-1.545.309-2.103.86a2.916 2.916 0 0 0-.871 2.076v8.808h-23.792v-11.744h8.922c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-5.872c0-.778-.313-1.525-.871-2.076a2.996 2.996 0 0 0-2.103-.86h-5.948c-.789 0-1.546.31-2.103.86a2.918 2.918 0 0 0-.871 2.076v8.808H119.7c-.789 0-1.545.309-2.103.86a2.916 2.916 0 0 0-.871 2.076v5.872c0 .779.313 1.525.871 2.076.558.551 1.314.86 2.103.86h20.819v8.808c0 .778.313 1.525.871 2.076.557.55 1.314.86 2.103.86h8.922v8.808c0 .778.313 1.525.871 2.076.558.55 1.314.859 2.103.859h8.922v11.744h-20.818c-.789 0-1.546.31-2.103.86a2.916 2.916 0 0 0-.871 2.076v5.872c0 .779.313 1.526.871 2.076a2.99 2.99 0 0 0 2.103.86h17.844c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-8.808h11.896v8.808c0 .779.314 1.526.872 2.076a2.99 2.99 0 0 0 2.102.86h17.845Z"
1084
+ }
1085
+ ),
1086
+ /* @__PURE__ */ jsxRuntime.jsx(
1087
+ "path",
1088
+ {
1089
+ fill: "#EBECEF",
1090
+ fillRule: "evenodd",
1091
+ d: "M157.295 12.1c0-6.683 5.418-12.1 12.1-12.1H187.9c6.683 0 12.1 5.417 12.1 12.1v18.505c0 6.682-5.417 12.1-12.1 12.1h-18.505c-6.682 0-12.1-5.418-12.1-12.1V12.1Zm12.1-.712H187.9c.393 0 .712.319.712.712v18.505a.712.712 0 0 1-.712.712h-18.505a.712.712 0 0 1-.712-.712V12.1c0-.393.319-.712.712-.712ZM12.1 157.295c-6.683 0-12.1 5.418-12.1 12.1V187.9c0 6.683 5.417 12.1 12.1 12.1h18.505c6.682 0 12.1-5.417 12.1-12.1v-18.505c0-6.682-5.418-12.1-12.1-12.1H12.1Zm19.217 12.1a.712.712 0 0 0-.712-.712H12.1a.712.712 0 0 0-.712.712V187.9c0 .393.319.712.712.712h18.505a.712.712 0 0 0 .712-.712v-18.505Z",
1092
+ clipRule: "evenodd"
1093
+ }
1094
+ ),
1095
+ /* @__PURE__ */ jsxRuntime.jsx(
1096
+ "path",
1097
+ {
1098
+ fill: "#EBECEF",
1099
+ d: "M6.05 89.68A6.05 6.05 0 0 0 0 95.73v9.252a6.05 6.05 0 0 0 6.05 6.05h9.253a6.05 6.05 0 0 0 6.05-6.05V95.73c0-.678-.112-1.33-.318-1.94.445.105.908.16 1.385.16h27.758a6.05 6.05 0 0 0 6.05-6.05v-9.252a6.05 6.05 0 0 0-6.05-6.05H22.42a6.05 6.05 0 0 0-6.05 6.05V87.9c0 .678.112 1.33.317 1.939a6.065 6.065 0 0 0-1.385-.16H6.05Zm102.135-40.926a6.05 6.05 0 0 1 6.05-6.05h9.253a6.05 6.05 0 0 1 6.049 6.05v9.253a6.05 6.05 0 0 1-6.049 6.05h-9.253a6.05 6.05 0 0 1-6.05-6.05v-9.253ZM67.616 184.698a6.05 6.05 0 0 1 6.05-6.05h9.252c.678 0 1.33.111 1.939.317a6.064 6.064 0 0 1-.16-1.385v-9.253a6.05 6.05 0 0 1 6.05-6.049H100a6.05 6.05 0 0 1 6.05 6.049v9.253a6.05 6.05 0 0 1-6.05 6.05h-9.253c-.678 0-1.33-.112-1.938-.317.104.444.159.908.159 1.385v9.252a6.05 6.05 0 0 1-6.05 6.05h-9.253a6.05 6.05 0 0 1-6.05-6.05v-9.252Zm78.291-120.285a6.05 6.05 0 0 1 6.05-6.05h41.993a6.05 6.05 0 0 1 6.05 6.05v9.252a6.05 6.05 0 0 1-6.05 6.05h-41.993a6.05 6.05 0 0 1-6.05-6.05v-9.252ZM95.018 0a6.05 6.05 0 0 0-6.05 6.05v17.082a6.05 6.05 0 0 0 6.05 6.05h9.252a6.05 6.05 0 0 0 6.05-6.05V6.05A6.05 6.05 0 0 0 104.27 0h-9.252Z"
1100
+ }
1101
+ ),
1102
+ /* @__PURE__ */ jsxRuntime.jsx(
1103
+ "path",
1104
+ {
1105
+ fill: "url(#idkit_qr_placeholder_gradient)",
1106
+ fillRule: "evenodd",
1107
+ d: "M12.1 0C5.417 0 0 5.417 0 12.1v18.505c0 6.682 5.417 12.1 12.1 12.1h18.505c6.682 0 12.1-5.418 12.1-12.1V12.1c0-6.683-5.418-12.1-12.1-12.1H12.1Zm18.505 11.388H12.1a.712.712 0 0 0-.712.712v18.505c0 .393.319.712.712.712h18.505a.712.712 0 0 0 .712-.712V12.1a.712.712 0 0 0-.712-.712Z",
1108
+ clipRule: "evenodd"
1109
+ }
1110
+ ),
1111
+ /* @__PURE__ */ jsxRuntime.jsx(
1112
+ "path",
1113
+ {
1114
+ fill: "url(#idkit_qr_placeholder_gradient)",
1115
+ d: "M197.026 200c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-17.616c0-.778-.313-1.525-.871-2.076a2.996 2.996 0 0 0-2.103-.86h-5.948c-.789 0-1.545.31-2.103.86a2.918 2.918 0 0 0-.871 2.076v8.808h-11.897v-11.744h-11.896v-23.487h11.896v8.808c0 .778.314 1.525.872 2.076.557.55 1.314.86 2.102.86h5.949c.788 0 1.545-.31 2.103-.86a2.922 2.922 0 0 0 .871-2.076v-8.808h8.922c.789 0 1.545-.309 2.103-.86a2.916 2.916 0 0 0 .871-2.076v-5.872c0-.779-.313-1.525-.871-2.076a2.992 2.992 0 0 0-2.103-.86h-29.741c-.789 0-1.545.309-2.103.86a2.916 2.916 0 0 0-.871 2.076v8.808h-23.792v-11.744h8.922c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-5.872c0-.778-.313-1.525-.871-2.076a2.996 2.996 0 0 0-2.103-.86h-5.948c-.789 0-1.546.31-2.103.86a2.918 2.918 0 0 0-.871 2.076v8.808H119.7c-.789 0-1.545.309-2.103.86a2.916 2.916 0 0 0-.871 2.076v5.872c0 .779.313 1.525.871 2.076.558.551 1.314.86 2.103.86h20.819v8.808c0 .778.313 1.525.871 2.076.557.55 1.314.86 2.103.86h8.922v8.808c0 .778.313 1.525.871 2.076.558.55 1.314.859 2.103.859h8.922v11.744h-20.818c-.789 0-1.546.31-2.103.86a2.916 2.916 0 0 0-.871 2.076v5.872c0 .779.313 1.526.871 2.076a2.99 2.99 0 0 0 2.103.86h17.844c.789 0 1.545-.309 2.103-.86.558-.55.871-1.297.871-2.076v-8.808h11.896v8.808c0 .779.314 1.526.872 2.076a2.99 2.99 0 0 0 2.102.86h17.845Z"
1116
+ }
1117
+ ),
1118
+ /* @__PURE__ */ jsxRuntime.jsx(
1119
+ "path",
1120
+ {
1121
+ fill: "url(#idkit_qr_placeholder_gradient)",
1122
+ fillRule: "evenodd",
1123
+ d: "M157.295 12.1c0-6.683 5.418-12.1 12.1-12.1H187.9c6.683 0 12.1 5.417 12.1 12.1v18.505c0 6.682-5.417 12.1-12.1 12.1h-18.505c-6.682 0-12.1-5.418-12.1-12.1V12.1Zm12.1-.712H187.9c.393 0 .712.319.712.712v18.505a.712.712 0 0 1-.712.712h-18.505a.712.712 0 0 1-.712-.712V12.1c0-.393.319-.712.712-.712Z",
1124
+ clipRule: "evenodd"
1125
+ }
1126
+ ),
1127
+ /* @__PURE__ */ jsxRuntime.jsx(
1128
+ "path",
1129
+ {
1130
+ fill: "url(#idkit_qr_placeholder_gradient)",
1131
+ fillRule: "evenodd",
1132
+ d: "M12.1 157.295c-6.683 0-12.1 5.418-12.1 12.1V187.9c0 6.683 5.417 12.1 12.1 12.1h18.505c6.682 0 12.1-5.417 12.1-12.1v-18.505c0-6.682-5.418-12.1-12.1-12.1H12.1Zm19.217 12.1a.712.712 0 0 0-.712-.712H12.1a.712.712 0 0 0-.712.712V187.9c0 .393.319.712.712.712h18.505a.712.712 0 0 0 .712-.712v-18.505Z",
1133
+ clipRule: "evenodd"
1134
+ }
1135
+ ),
1136
+ /* @__PURE__ */ jsxRuntime.jsx(
1137
+ "path",
1138
+ {
1139
+ fill: "url(#idkit_qr_placeholder_gradient)",
1140
+ d: "M6.05 89.68A6.05 6.05 0 0 0 0 95.73v9.252a6.05 6.05 0 0 0 6.05 6.05h9.253a6.05 6.05 0 0 0 6.05-6.05V95.73c0-.678-.112-1.33-.318-1.94.445.105.908.16 1.385.16h27.758a6.05 6.05 0 0 0 6.05-6.05v-9.252a6.05 6.05 0 0 0-6.05-6.05H22.42a6.05 6.05 0 0 0-6.05 6.05V87.9c0 .678.112 1.33.317 1.939a6.065 6.065 0 0 0-1.385-.16H6.05Z"
1141
+ }
1142
+ ),
1143
+ /* @__PURE__ */ jsxRuntime.jsx(
1144
+ "path",
1145
+ {
1146
+ fill: "url(#idkit_qr_placeholder_gradient)",
1147
+ d: "M108.185 48.754a6.05 6.05 0 0 1 6.05-6.05h9.253a6.05 6.05 0 0 1 6.049 6.05v9.253a6.05 6.05 0 0 1-6.049 6.05h-9.253a6.05 6.05 0 0 1-6.05-6.05v-9.253Z"
1148
+ }
1149
+ ),
1150
+ /* @__PURE__ */ jsxRuntime.jsx(
1151
+ "path",
1152
+ {
1153
+ fill: "url(#idkit_qr_placeholder_gradient)",
1154
+ d: "M67.616 184.698a6.05 6.05 0 0 1 6.05-6.05h9.252c.678 0 1.33.111 1.939.317a6.064 6.064 0 0 1-.16-1.385v-9.253a6.05 6.05 0 0 1 6.05-6.049H100a6.05 6.05 0 0 1 6.05 6.049v9.253a6.05 6.05 0 0 1-6.05 6.05h-9.253c-.678 0-1.33-.112-1.938-.317.104.444.159.908.159 1.385v9.252a6.05 6.05 0 0 1-6.05 6.05h-9.253a6.05 6.05 0 0 1-6.05-6.05v-9.252Z"
1155
+ }
1156
+ ),
1157
+ /* @__PURE__ */ jsxRuntime.jsx(
1158
+ "path",
1159
+ {
1160
+ fill: "url(#idkit_qr_placeholder_gradient)",
1161
+ d: "M145.907 64.413a6.05 6.05 0 0 1 6.05-6.05h41.993a6.05 6.05 0 0 1 6.05 6.05v9.252a6.05 6.05 0 0 1-6.05 6.05h-41.993a6.05 6.05 0 0 1-6.05-6.05v-9.252Z"
1162
+ }
1163
+ ),
1164
+ /* @__PURE__ */ jsxRuntime.jsx(
1165
+ "path",
1166
+ {
1167
+ fill: "url(#idkit_qr_placeholder_gradient)",
1168
+ d: "M95.018 0a6.05 6.05 0 0 0-6.05 6.05v17.082a6.05 6.05 0 0 0 6.05 6.05h9.252a6.05 6.05 0 0 0 6.05-6.05V6.05A6.05 6.05 0 0 0 104.27 0h-9.252Z"
1169
+ }
1170
+ ),
1171
+ /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs(
1172
+ "linearGradient",
1173
+ {
1174
+ id: "idkit_qr_placeholder_gradient",
1175
+ x1: "0",
1176
+ x2: "200",
1177
+ y1: "0",
1178
+ y2: "200",
1179
+ gradientUnits: "userSpaceOnUse",
1180
+ children: [
1181
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: ".37", stopColor: "#fff", stopOpacity: "0" }),
1182
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: ".5", stopColor: "#fff", stopOpacity: ".85" }),
1183
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: ".63", stopColor: "#fff", stopOpacity: "0" })
1184
+ ]
1185
+ }
1186
+ ) })
1187
+ ]
1188
+ }
1189
+ );
1190
+ }
1191
+ function QRState({ qrData }) {
1192
+ const media = useMedia();
1193
+ const [copiedLink, setCopiedLink] = react.useState(false);
1194
+ const copyLink = react.useCallback(() => {
1195
+ if (!qrData) return;
1196
+ void navigator.clipboard.writeText(qrData);
1197
+ setCopiedLink(true);
1198
+ setTimeout(() => setCopiedLink(false), 2e3);
1199
+ }, [qrData]);
1200
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1201
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-mobile-only", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { href: qrData ?? void 0, className: "idkit-deeplink-btn", children: [
1202
+ /* @__PURE__ */ jsxRuntime.jsx(WorldcoinIcon, {}),
1203
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: __("Open World App") })
1204
+ ] }) }),
1205
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "idkit-desktop-only", children: [
1206
+ /* @__PURE__ */ jsxRuntime.jsx(
1207
+ "div",
1208
+ {
1209
+ className: `idkit-copy-toast ${copiedLink ? "visible" : "hidden"}`,
1210
+ style: {
1211
+ textAlign: "center",
1212
+ fontSize: "14px",
1213
+ color: "var(--idkit-text-secondary)"
1214
+ },
1215
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: __("QR Code copied") })
1216
+ }
1217
+ ),
1218
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-qr-wrapper", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-qr-inner", children: qrData ? /* @__PURE__ */ jsxRuntime.jsx(
1219
+ "div",
1220
+ {
1221
+ onClick: copyLink,
1222
+ onKeyDown: (e) => {
1223
+ if (e.key === "Enter") copyLink();
1224
+ },
1225
+ role: "button",
1226
+ tabIndex: 0,
1227
+ style: { cursor: "pointer" },
1228
+ children: /* @__PURE__ */ jsxRuntime.jsx(QRCode, { data: qrData, size: media === "mobile" ? 160 : 200 })
1229
+ }
1230
+ ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-qr-placeholder", children: /* @__PURE__ */ jsxRuntime.jsx(QRPlaceholderIcon, {}) }) }) })
1231
+ ] })
1232
+ ] });
1233
+ }
1234
+ function WorldIDState({
1235
+ connectorURI,
1236
+ isAwaitingUserConfirmation
1237
+ }) {
1238
+ const media = useMedia();
1239
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1240
+ "div",
1241
+ {
1242
+ style: {
1243
+ display: "flex",
1244
+ flexDirection: "column",
1245
+ alignItems: "center",
1246
+ textAlign: "center"
1247
+ },
1248
+ children: [
1249
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-worldid-icon", children: /* @__PURE__ */ jsxRuntime.jsx(WorldcoinIcon, {}) }),
1250
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "idkit-heading", children: __("Connect your World ID") }),
1251
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "idkit-subtext", children: media === "mobile" ? __(
1252
+ "You will be redirected to the app, please return to this page once you're done"
1253
+ ) : __("Use phone camera to scan the QR code") }),
1254
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "idkit-qr-container", children: [
1255
+ isAwaitingUserConfirmation && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "idkit-qr-overlay", children: [
1256
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-spinner", children: /* @__PURE__ */ jsxRuntime.jsx(LoadingIcon, {}) }),
1257
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "idkit-connecting-text", children: [
1258
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: __("Connecting...") }),
1259
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: __("Please continue in app") })
1260
+ ] })
1261
+ ] }),
1262
+ /* @__PURE__ */ jsxRuntime.jsx(
1263
+ "div",
1264
+ {
1265
+ className: `idkit-qr-blur ${isAwaitingUserConfirmation ? "blurred" : ""}`,
1266
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx(QRState, { qrData: connectorURI }) })
1267
+ }
1268
+ )
1269
+ ] })
1270
+ ]
1271
+ }
1272
+ );
1273
+ }
1274
+ function CheckIcon(props) {
1275
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1276
+ "svg",
1277
+ {
1278
+ width: "88",
1279
+ height: "88",
1280
+ viewBox: "0 0 88 88",
1281
+ fill: "none",
1282
+ xmlns: "http://www.w3.org/2000/svg",
1283
+ ...props,
1284
+ children: [
1285
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "88", height: "88", rx: "44", fill: "#00C230" }),
1286
+ /* @__PURE__ */ jsxRuntime.jsx(
1287
+ "rect",
1288
+ {
1289
+ opacity: "0.2",
1290
+ width: "88",
1291
+ height: "88",
1292
+ rx: "44",
1293
+ fill: "url(#idkit_check_radial)"
1294
+ }
1295
+ ),
1296
+ /* @__PURE__ */ jsxRuntime.jsx(
1297
+ "rect",
1298
+ {
1299
+ x: "0.5",
1300
+ y: "0.5",
1301
+ width: "87",
1302
+ height: "87",
1303
+ rx: "43.5",
1304
+ stroke: "url(#idkit_check_linear)"
1305
+ }
1306
+ ),
1307
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M29.5 45.5L37.5 53.5L57.5 33.5", stroke: "white", strokeWidth: "3" }),
1308
+ /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
1309
+ /* @__PURE__ */ jsxRuntime.jsxs(
1310
+ "radialGradient",
1311
+ {
1312
+ id: "idkit_check_radial",
1313
+ cx: "0",
1314
+ cy: "0",
1315
+ r: "1",
1316
+ gradientUnits: "userSpaceOnUse",
1317
+ gradientTransform: "translate(20 -1.6729e-06) rotate(63.4349) scale(98.387 97.9627)",
1318
+ children: [
1319
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white" }),
1320
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1321
+ ]
1322
+ }
1323
+ ),
1324
+ /* @__PURE__ */ jsxRuntime.jsxs(
1325
+ "linearGradient",
1326
+ {
1327
+ id: "idkit_check_linear",
1328
+ x1: "44",
1329
+ y1: "0",
1330
+ x2: "44",
1331
+ y2: "88",
1332
+ gradientUnits: "userSpaceOnUse",
1333
+ children: [
1334
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white", stopOpacity: "0.3" }),
1335
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1336
+ ]
1337
+ }
1338
+ )
1339
+ ] })
1340
+ ]
1341
+ }
1342
+ );
1343
+ }
1344
+ function SuccessState() {
1345
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1346
+ "div",
1347
+ {
1348
+ style: {
1349
+ display: "flex",
1350
+ flexDirection: "column",
1351
+ alignItems: "center",
1352
+ textAlign: "center"
1353
+ },
1354
+ children: [
1355
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-success-icon", children: /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {}) }),
1356
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "idkit-heading", children: __("All set!") }),
1357
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "idkit-subtext", style: { maxWidth: 260 }, children: __("Your World ID is now connected") })
1358
+ ]
1359
+ }
1360
+ );
1361
+ }
1362
+ function ErrorIcon(props) {
1363
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1364
+ "svg",
1365
+ {
1366
+ width: "88",
1367
+ height: "88",
1368
+ viewBox: "0 0 88 88",
1369
+ fill: "none",
1370
+ xmlns: "http://www.w3.org/2000/svg",
1371
+ ...props,
1372
+ children: [
1373
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "88", height: "88", rx: "44", fill: "#9BA3AE" }),
1374
+ /* @__PURE__ */ jsxRuntime.jsx(
1375
+ "rect",
1376
+ {
1377
+ opacity: "0.2",
1378
+ width: "88",
1379
+ height: "88",
1380
+ rx: "44",
1381
+ fill: "url(#idkit_error_radial)"
1382
+ }
1383
+ ),
1384
+ /* @__PURE__ */ jsxRuntime.jsx(
1385
+ "rect",
1386
+ {
1387
+ x: "0.5",
1388
+ y: "0.5",
1389
+ width: "87",
1390
+ height: "87",
1391
+ rx: "43.5",
1392
+ stroke: "url(#idkit_error_linear)"
1393
+ }
1394
+ ),
1395
+ /* @__PURE__ */ jsxRuntime.jsx(
1396
+ "path",
1397
+ {
1398
+ d: "M33.0146 53.9853L43.4999 43.5M53.9851 33.0147L43.4999 43.5M43.4999 43.5L33.0146 33.0147M43.4999 43.5L53.9851 53.9853",
1399
+ stroke: "white",
1400
+ strokeWidth: "3"
1401
+ }
1402
+ ),
1403
+ /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
1404
+ /* @__PURE__ */ jsxRuntime.jsxs(
1405
+ "radialGradient",
1406
+ {
1407
+ id: "idkit_error_radial",
1408
+ cx: "0",
1409
+ cy: "0",
1410
+ r: "1",
1411
+ gradientUnits: "userSpaceOnUse",
1412
+ gradientTransform: "translate(20 -1.6729e-06) rotate(63.4349) scale(98.387 97.9627)",
1413
+ children: [
1414
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white" }),
1415
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1416
+ ]
1417
+ }
1418
+ ),
1419
+ /* @__PURE__ */ jsxRuntime.jsxs(
1420
+ "linearGradient",
1421
+ {
1422
+ id: "idkit_error_linear",
1423
+ x1: "44",
1424
+ y1: "0",
1425
+ x2: "44",
1426
+ y2: "88",
1427
+ gradientUnits: "userSpaceOnUse",
1428
+ children: [
1429
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white", stopOpacity: "0.3" }),
1430
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1431
+ ]
1432
+ }
1433
+ )
1434
+ ] })
1435
+ ]
1436
+ }
1437
+ );
1438
+ }
1439
+ function WarningIcon(props) {
1440
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1441
+ "svg",
1442
+ {
1443
+ width: "88",
1444
+ height: "88",
1445
+ viewBox: "0 0 88 88",
1446
+ fill: "none",
1447
+ xmlns: "http://www.w3.org/2000/svg",
1448
+ ...props,
1449
+ children: [
1450
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "88", height: "88", rx: "44", fill: "#FFAE00" }),
1451
+ /* @__PURE__ */ jsxRuntime.jsx(
1452
+ "rect",
1453
+ {
1454
+ opacity: "0.2",
1455
+ width: "88",
1456
+ height: "88",
1457
+ rx: "44",
1458
+ fill: "url(#idkit_warning_radial)"
1459
+ }
1460
+ ),
1461
+ /* @__PURE__ */ jsxRuntime.jsx(
1462
+ "rect",
1463
+ {
1464
+ x: "0.5",
1465
+ y: "0.5",
1466
+ width: "87",
1467
+ height: "87",
1468
+ rx: "43.5",
1469
+ stroke: "url(#idkit_warning_linear)"
1470
+ }
1471
+ ),
1472
+ /* @__PURE__ */ jsxRuntime.jsx(
1473
+ "path",
1474
+ {
1475
+ d: "M64.1707 59.5415H22.8298L43.4998 22.3354L64.1707 59.5415ZM42.1208 51.3003L42.1218 54.0503H44.8992L44.8982 51.3003H42.1208ZM42.1248 46.7085H44.8748V36.6255H42.1248V46.7085Z",
1476
+ fill: "white"
1477
+ }
1478
+ ),
1479
+ /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
1480
+ /* @__PURE__ */ jsxRuntime.jsxs(
1481
+ "radialGradient",
1482
+ {
1483
+ id: "idkit_warning_radial",
1484
+ cx: "0",
1485
+ cy: "0",
1486
+ r: "1",
1487
+ gradientUnits: "userSpaceOnUse",
1488
+ gradientTransform: "translate(20 -1.6729e-06) rotate(63.4349) scale(98.387 97.9627)",
1489
+ children: [
1490
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white" }),
1491
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1492
+ ]
1493
+ }
1494
+ ),
1495
+ /* @__PURE__ */ jsxRuntime.jsxs(
1496
+ "linearGradient",
1497
+ {
1498
+ id: "idkit_warning_linear",
1499
+ x1: "44",
1500
+ y1: "0",
1501
+ x2: "44",
1502
+ y2: "88",
1503
+ gradientUnits: "userSpaceOnUse",
1504
+ children: [
1505
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "white", stopOpacity: "0.3" }),
1506
+ /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0" })
1507
+ ]
1508
+ }
1509
+ )
1510
+ ] })
1511
+ ]
1512
+ }
1513
+ );
1514
+ }
1515
+ var errorCodeVariants = {
1516
+ [idkitCore.IDKitErrorCodes.UserRejected]: "cancelled",
1517
+ [idkitCore.IDKitErrorCodes.VerificationRejected]: "cancelled",
1518
+ [idkitCore.IDKitErrorCodes.FailedByHostApp]: "cancelled",
1519
+ [idkitCore.IDKitErrorCodes.Cancelled]: "cancelled",
1520
+ [idkitCore.IDKitErrorCodes.ConnectionFailed]: "connection"
1521
+ };
1522
+ var variantConfig = {
1523
+ cancelled: {
1524
+ title: "Request cancelled",
1525
+ message: "You've cancelled the request in World App.",
1526
+ Icon: WarningIcon
1527
+ },
1528
+ connection: {
1529
+ title: "Connection lost",
1530
+ message: "Please check your connection and try again.",
1531
+ Icon: ErrorIcon
1532
+ // placeholder — swap for WifiOffIcon later
1533
+ },
1534
+ generic: {
1535
+ title: "Something went wrong",
1536
+ message: "We couldn't complete your request. Please try again.",
1537
+ Icon: ErrorIcon
1538
+ }
1539
+ };
1540
+ function getVariant(errorCode) {
1541
+ if (!errorCode) {
1542
+ return "generic";
1543
+ }
1544
+ return errorCodeVariants[errorCode] ?? "generic";
1545
+ }
1546
+ function ErrorState({
1547
+ errorCode,
1548
+ onRetry
1549
+ }) {
1550
+ const variant = getVariant(errorCode);
1551
+ const { title, message, Icon } = variantConfig[variant];
1552
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1553
+ "div",
1554
+ {
1555
+ style: {
1556
+ display: "flex",
1557
+ flexDirection: "column",
1558
+ alignItems: "center",
1559
+ textAlign: "center"
1560
+ },
1561
+ children: [
1562
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "idkit-error-icon", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, {}) }),
1563
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "idkit-error-title", children: __(title) }),
1564
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "idkit-error-message", children: __(message) }),
1565
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "idkit-retry-btn", onClick: onRetry, children: __("Try Again") })
1566
+ ]
1567
+ }
1568
+ );
1569
+ }
1570
+ function getVisualStage(isSuccess, isError) {
1571
+ if (isSuccess) {
1572
+ return "success";
1573
+ }
1574
+ if (isError) {
1575
+ return "error";
1576
+ }
1577
+ return "worldid";
1578
+ }
1579
+ function IDKitRequestWidget({
1580
+ open,
1581
+ onOpenChange,
1582
+ onSuccess,
1583
+ onError,
1584
+ autoClose = true,
1585
+ language,
1586
+ ...config
1587
+ }) {
1588
+ const flow = useIDKitRequest(config);
1589
+ const { open: openFlow, reset: resetFlow } = flow;
1590
+ const lastResultRef = react.useRef(null);
1591
+ const lastErrorCodeRef = react.useRef(null);
1592
+ react.useEffect(() => {
1593
+ if (language) {
1594
+ setLocalizationConfig({ language });
1595
+ }
1596
+ }, [language]);
1597
+ react.useEffect(() => {
1598
+ if (open) {
1599
+ openFlow();
1600
+ return;
1601
+ }
1602
+ resetFlow();
1603
+ }, [open, openFlow, resetFlow]);
1604
+ react.useEffect(() => {
1605
+ if (!flow.result || flow.result === lastResultRef.current) {
1606
+ return;
1607
+ }
1608
+ lastResultRef.current = flow.result;
1609
+ void Promise.resolve(onSuccess?.(flow.result)).catch(() => {
1610
+ });
1611
+ }, [onSuccess, flow.result]);
1612
+ react.useEffect(() => {
1613
+ if (!flow.errorCode || flow.errorCode === lastErrorCodeRef.current) {
1614
+ return;
1615
+ }
1616
+ lastErrorCodeRef.current = flow.errorCode;
1617
+ void Promise.resolve(onError?.(flow.errorCode)).catch(() => {
1618
+ });
1619
+ }, [flow.errorCode, onError]);
1620
+ react.useEffect(() => {
1621
+ if (flow.isSuccess && autoClose) {
1622
+ const timer = setTimeout(() => onOpenChange(false), 2500);
1623
+ return () => clearTimeout(timer);
1624
+ }
1625
+ }, [flow.isSuccess, autoClose, onOpenChange]);
1626
+ const stage = getVisualStage(flow.isSuccess, flow.isError);
1627
+ return /* @__PURE__ */ jsxRuntime.jsxs(IDKitModal, { open, onOpenChange, children: [
1628
+ stage === "worldid" && /* @__PURE__ */ jsxRuntime.jsx(
1629
+ WorldIDState,
1630
+ {
1631
+ connectorURI: flow.connectorURI,
1632
+ isAwaitingUserConfirmation: flow.isAwaitingUserConfirmation
1633
+ }
1634
+ ),
1635
+ stage === "success" && /* @__PURE__ */ jsxRuntime.jsx(SuccessState, {}),
1636
+ stage === "error" && /* @__PURE__ */ jsxRuntime.jsx(
1637
+ ErrorState,
1638
+ {
1639
+ errorCode: flow.errorCode,
1640
+ onRetry: () => {
1641
+ resetFlow();
1642
+ openFlow();
1643
+ }
1644
+ }
1645
+ )
1646
+ ] });
1647
+ }
1648
+ function getVisualStage2(isSuccess, isError) {
1649
+ if (isSuccess) {
1650
+ return "success";
1651
+ }
1652
+ if (isError) {
1653
+ return "error";
1654
+ }
1655
+ return "worldid";
1656
+ }
1657
+ function IDKitSessionWidget({
1658
+ open,
1659
+ onOpenChange,
1660
+ onSuccess,
1661
+ onError,
1662
+ autoClose = true,
1663
+ language,
1664
+ ...config
1665
+ }) {
1666
+ const flow = useIDKitSession(config);
1667
+ const { open: openFlow, reset: resetFlow } = flow;
1668
+ const lastResultRef = react.useRef(null);
1669
+ const lastErrorCodeRef = react.useRef(null);
1670
+ react.useEffect(() => {
1671
+ if (language) {
1672
+ setLocalizationConfig({ language });
1673
+ }
1674
+ }, [language]);
1675
+ react.useEffect(() => {
1676
+ if (open) {
1677
+ openFlow();
1678
+ return;
1679
+ }
1680
+ resetFlow();
1681
+ }, [open, openFlow, resetFlow]);
1682
+ react.useEffect(() => {
1683
+ if (!flow.result || flow.result === lastResultRef.current) {
1684
+ return;
1685
+ }
1686
+ lastResultRef.current = flow.result;
1687
+ void Promise.resolve(onSuccess?.(flow.result)).catch(() => {
1688
+ });
1689
+ }, [onSuccess, flow.result]);
1690
+ react.useEffect(() => {
1691
+ if (!flow.errorCode || flow.errorCode === lastErrorCodeRef.current) {
1692
+ return;
1693
+ }
1694
+ lastErrorCodeRef.current = flow.errorCode;
1695
+ void Promise.resolve(onError?.(flow.errorCode)).catch(() => {
1696
+ });
1697
+ }, [flow.errorCode, onError]);
1698
+ react.useEffect(() => {
1699
+ if (flow.isSuccess && autoClose) {
1700
+ const timer = setTimeout(() => onOpenChange(false), 2500);
1701
+ return () => clearTimeout(timer);
1702
+ }
1703
+ }, [flow.isSuccess, autoClose, onOpenChange]);
1704
+ const stage = getVisualStage2(flow.isSuccess, flow.isError);
1705
+ return /* @__PURE__ */ jsxRuntime.jsxs(IDKitModal, { open, onOpenChange, children: [
1706
+ stage === "worldid" && /* @__PURE__ */ jsxRuntime.jsx(
1707
+ WorldIDState,
1708
+ {
1709
+ connectorURI: flow.connectorURI,
1710
+ isAwaitingUserConfirmation: flow.isAwaitingUserConfirmation
1711
+ }
1712
+ ),
1713
+ stage === "success" && /* @__PURE__ */ jsxRuntime.jsx(SuccessState, {}),
1714
+ stage === "error" && /* @__PURE__ */ jsxRuntime.jsx(
1715
+ ErrorState,
1716
+ {
1717
+ errorCode: flow.errorCode,
1718
+ onRetry: () => {
1719
+ resetFlow();
1720
+ openFlow();
1721
+ }
1722
+ }
1723
+ )
1724
+ ] });
1725
+ }
1726
+
1727
+ Object.defineProperty(exports, "CredentialRequest", {
1728
+ enumerable: true,
1729
+ get: function () { return idkitCore.CredentialRequest; }
1730
+ });
1731
+ Object.defineProperty(exports, "IDKit", {
1732
+ enumerable: true,
1733
+ get: function () { return idkitCore.IDKit; }
1734
+ });
1735
+ Object.defineProperty(exports, "IDKitErrorCodes", {
1736
+ enumerable: true,
1737
+ get: function () { return idkitCore.IDKitErrorCodes; }
1738
+ });
1739
+ Object.defineProperty(exports, "all", {
1740
+ enumerable: true,
1741
+ get: function () { return idkitCore.all; }
1742
+ });
1743
+ Object.defineProperty(exports, "any", {
1744
+ enumerable: true,
1745
+ get: function () { return idkitCore.any; }
1746
+ });
1747
+ Object.defineProperty(exports, "documentLegacy", {
1748
+ enumerable: true,
1749
+ get: function () { return idkitCore.documentLegacy; }
1750
+ });
1751
+ Object.defineProperty(exports, "orbLegacy", {
1752
+ enumerable: true,
1753
+ get: function () { return idkitCore.orbLegacy; }
1754
+ });
1755
+ Object.defineProperty(exports, "secureDocumentLegacy", {
1756
+ enumerable: true,
1757
+ get: function () { return idkitCore.secureDocumentLegacy; }
1758
+ });
1759
+ exports.IDKitRequestWidget = IDKitRequestWidget;
1760
+ exports.IDKitSessionWidget = IDKitSessionWidget;
1761
+ exports.useIDKitRequest = useIDKitRequest;
1762
+ exports.useIDKitSession = useIDKitSession;
1763
+ //# sourceMappingURL=index.cjs.map
1764
+ //# sourceMappingURL=index.cjs.map