@worldcoin/idkit 2.2.1 → 2.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/index.cjs +218 -203
- package/build/index.js +165 -150
- package/package.json +1 -2
package/build/index.cjs
CHANGED
|
@@ -204,10 +204,7 @@ var useIDKit = ({ handleVerify, onSuccess } = {}) => {
|
|
|
204
204
|
var useIDKit_default = useIDKit;
|
|
205
205
|
|
|
206
206
|
// src/components/IDKitWidget/index.tsx
|
|
207
|
-
var
|
|
208
|
-
|
|
209
|
-
// src/components/IDKitWidget/BaseWidget.tsx
|
|
210
|
-
var import_react_shadow = __toESM(require("react-shadow"), 1);
|
|
207
|
+
var import_react9 = require("react");
|
|
211
208
|
|
|
212
209
|
// src/hooks/useMedia.ts
|
|
213
210
|
var import_react2 = require("react");
|
|
@@ -233,7 +230,7 @@ var useMedia = () => {
|
|
|
233
230
|
var useMedia_default = useMedia;
|
|
234
231
|
|
|
235
232
|
// src/components/IDKitWidget/BaseWidget.tsx
|
|
236
|
-
var
|
|
233
|
+
var import_react_dom2 = require("react-dom");
|
|
237
234
|
|
|
238
235
|
// src/styles/styles.css
|
|
239
236
|
var styles_default = `/* TODO: Use an alternative to avoid the extra request to Google (e.g. hosting ourselves, or local file) */
|
|
@@ -1386,12 +1383,30 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
1386
1383
|
var Styles = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: styles_default });
|
|
1387
1384
|
var Styles_default = Styles;
|
|
1388
1385
|
|
|
1386
|
+
// src/components/IDKitWidget/ShadowHost.tsx
|
|
1387
|
+
var import_react_dom = __toESM(require("react-dom"), 1);
|
|
1388
|
+
var import_react3 = require("react");
|
|
1389
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
1390
|
+
var ShadowHost = ({ id, children, mode = "open", delegatesFocus = false }) => {
|
|
1391
|
+
const [shadowRoot, setShadowRoot] = (0, import_react3.useState)(null);
|
|
1392
|
+
const hostRef = (0, import_react3.useCallback)(
|
|
1393
|
+
(node) => {
|
|
1394
|
+
if (node) {
|
|
1395
|
+
const root = node.shadowRoot ?? node.attachShadow({ mode, delegatesFocus });
|
|
1396
|
+
setShadowRoot(root);
|
|
1397
|
+
}
|
|
1398
|
+
},
|
|
1399
|
+
[mode, delegatesFocus]
|
|
1400
|
+
);
|
|
1401
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: hostRef, id, children: shadowRoot && import_react_dom.default.createPortal(children, shadowRoot) });
|
|
1402
|
+
};
|
|
1403
|
+
|
|
1389
1404
|
// src/components/IDKitWidget/BaseWidget.tsx
|
|
1390
1405
|
var import_shallow3 = require("zustand/shallow");
|
|
1391
1406
|
|
|
1392
1407
|
// src/components/Icons/XMarkIcon.tsx
|
|
1393
|
-
var
|
|
1394
|
-
var XMarkIcon = (props) => /* @__PURE__ */ (0,
|
|
1408
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
1409
|
+
var XMarkIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
1395
1410
|
"path",
|
|
1396
1411
|
{
|
|
1397
1412
|
strokeWidth: "1.5",
|
|
@@ -1420,14 +1435,14 @@ function clsx() {
|
|
|
1420
1435
|
var clsx_default = clsx;
|
|
1421
1436
|
|
|
1422
1437
|
// src/components/Icons/ErrorIcon.tsx
|
|
1423
|
-
var
|
|
1424
|
-
var ErrorIcon = (props) => /* @__PURE__ */ (0,
|
|
1425
|
-
/* @__PURE__ */ (0,
|
|
1426
|
-
/* @__PURE__ */ (0,
|
|
1427
|
-
/* @__PURE__ */ (0,
|
|
1428
|
-
/* @__PURE__ */ (0,
|
|
1438
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
1439
|
+
var ErrorIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 100 100", children: [
|
|
1440
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "50", cy: "50", r: "49.375", fill: "url(#a)", fillOpacity: ".65", stroke: "url(#b)", strokeWidth: "1.25" }),
|
|
1441
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("g", { filter: "url(#c)", children: [
|
|
1442
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "50", cy: "50", r: "35", fill: "#fff" }),
|
|
1443
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "50", cy: "50", r: "34.432", stroke: "#FFC9AD", strokeWidth: "1.136" })
|
|
1429
1444
|
] }),
|
|
1430
|
-
/* @__PURE__ */ (0,
|
|
1445
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
1431
1446
|
"path",
|
|
1432
1447
|
{
|
|
1433
1448
|
stroke: "#FF4732",
|
|
@@ -1437,16 +1452,16 @@ var ErrorIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg",
|
|
|
1437
1452
|
d: "m57.5 42.5-15 14.999m15 .001-15-14.999"
|
|
1438
1453
|
}
|
|
1439
1454
|
),
|
|
1440
|
-
/* @__PURE__ */ (0,
|
|
1441
|
-
/* @__PURE__ */ (0,
|
|
1442
|
-
/* @__PURE__ */ (0,
|
|
1443
|
-
/* @__PURE__ */ (0,
|
|
1455
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("defs", { children: [
|
|
1456
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("linearGradient", { id: "a", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1457
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { stopColor: "#FFA483" }),
|
|
1458
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { offset: "1", stopColor: "#FFA483", stopOpacity: "0" })
|
|
1444
1459
|
] }),
|
|
1445
|
-
/* @__PURE__ */ (0,
|
|
1446
|
-
/* @__PURE__ */ (0,
|
|
1447
|
-
/* @__PURE__ */ (0,
|
|
1460
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("linearGradient", { id: "b", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1461
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { stopColor: "#FFA483" }),
|
|
1462
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { offset: ".713", stopColor: "#FFA483", stopOpacity: "0" })
|
|
1448
1463
|
] }),
|
|
1449
|
-
/* @__PURE__ */ (0,
|
|
1464
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
1450
1465
|
"filter",
|
|
1451
1466
|
{
|
|
1452
1467
|
id: "c",
|
|
@@ -1457,13 +1472,13 @@ var ErrorIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg",
|
|
|
1457
1472
|
colorInterpolationFilters: "sRGB",
|
|
1458
1473
|
filterUnits: "userSpaceOnUse",
|
|
1459
1474
|
children: [
|
|
1460
|
-
/* @__PURE__ */ (0,
|
|
1461
|
-
/* @__PURE__ */ (0,
|
|
1462
|
-
/* @__PURE__ */ (0,
|
|
1463
|
-
/* @__PURE__ */ (0,
|
|
1464
|
-
/* @__PURE__ */ (0,
|
|
1465
|
-
/* @__PURE__ */ (0,
|
|
1466
|
-
/* @__PURE__ */ (0,
|
|
1475
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
1476
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feColorMatrix", { in: "SourceAlpha", result: "hardAlpha", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" }),
|
|
1477
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feOffset", { dy: "1.875" }),
|
|
1478
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feGaussianBlur", { stdDeviation: "1.875" }),
|
|
1479
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feColorMatrix", { values: "0 0 0 0 1 0 0 0 0 0.788235 0 0 0 0 0.678431 0 0 0 0.45 0" }),
|
|
1480
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feBlend", { in2: "BackgroundImageFix", result: "effect1_dropShadow_39_740" }),
|
|
1481
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("feBlend", { in: "SourceGraphic", in2: "effect1_dropShadow_39_740", result: "shape" })
|
|
1467
1482
|
]
|
|
1468
1483
|
}
|
|
1469
1484
|
)
|
|
@@ -1475,8 +1490,8 @@ var ErrorIcon_default = ErrorIcon;
|
|
|
1475
1490
|
var import_idkit_core2 = require("@worldcoin/idkit-core");
|
|
1476
1491
|
|
|
1477
1492
|
// src/components/Icons/ReloadIcon.tsx
|
|
1478
|
-
var
|
|
1479
|
-
var ReloadIcon = (props) => /* @__PURE__ */ (0,
|
|
1493
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
1494
|
+
var ReloadIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
1480
1495
|
"path",
|
|
1481
1496
|
{
|
|
1482
1497
|
d: "M12.3809 1.6665L13.3626 4.24214C12.3754 3.66434 11.2263 3.33317 9.99992 3.33317C6.31802 3.33317 3.33325 6.31794 3.33325 9.99984C3.33325 11.2141 3.6579 12.3526 4.22513 13.3332M7.61897 18.3332L6.63719 15.7575C7.62438 16.3353 8.77348 16.6665 9.99992 16.6665C13.6818 16.6665 16.6666 13.6817 16.6666 9.99984C16.6666 8.78555 16.3419 7.64708 15.7747 6.6665",
|
|
@@ -1489,9 +1504,9 @@ var ReloadIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg",
|
|
|
1489
1504
|
var ReloadIcon_default = ReloadIcon;
|
|
1490
1505
|
|
|
1491
1506
|
// src/components/Icons/WarningIcon.tsx
|
|
1492
|
-
var
|
|
1493
|
-
var WarningIcon = (props) => /* @__PURE__ */ (0,
|
|
1494
|
-
/* @__PURE__ */ (0,
|
|
1507
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
1508
|
+
var WarningIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 100 100", ...props, children: [
|
|
1509
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
1495
1510
|
"circle",
|
|
1496
1511
|
{
|
|
1497
1512
|
cx: "50",
|
|
@@ -1503,11 +1518,11 @@ var WarningIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg"
|
|
|
1503
1518
|
strokeWidth: "1.25"
|
|
1504
1519
|
}
|
|
1505
1520
|
),
|
|
1506
|
-
/* @__PURE__ */ (0,
|
|
1507
|
-
/* @__PURE__ */ (0,
|
|
1508
|
-
/* @__PURE__ */ (0,
|
|
1521
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("g", { filter: "url(#warning-c)", children: [
|
|
1522
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "50", cy: "50", r: "35", fill: "#fff" }),
|
|
1523
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "50", cy: "50", r: "34.432", stroke: "#FFE999", strokeWidth: "1.136" })
|
|
1509
1524
|
] }),
|
|
1510
|
-
/* @__PURE__ */ (0,
|
|
1525
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
1511
1526
|
"path",
|
|
1512
1527
|
{
|
|
1513
1528
|
fill: "#FFB200",
|
|
@@ -1516,16 +1531,16 @@ var WarningIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg"
|
|
|
1516
1531
|
clipRule: "evenodd"
|
|
1517
1532
|
}
|
|
1518
1533
|
),
|
|
1519
|
-
/* @__PURE__ */ (0,
|
|
1520
|
-
/* @__PURE__ */ (0,
|
|
1521
|
-
/* @__PURE__ */ (0,
|
|
1522
|
-
/* @__PURE__ */ (0,
|
|
1534
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("defs", { children: [
|
|
1535
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("linearGradient", { id: "warning-a", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1536
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("stop", { stopColor: "#FFDA66" }),
|
|
1537
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("stop", { offset: "1", stopColor: "#FFDA66", stopOpacity: "0" })
|
|
1523
1538
|
] }),
|
|
1524
|
-
/* @__PURE__ */ (0,
|
|
1525
|
-
/* @__PURE__ */ (0,
|
|
1526
|
-
/* @__PURE__ */ (0,
|
|
1539
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("linearGradient", { id: "warning-b", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1540
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("stop", { stopColor: "#FFDA66" }),
|
|
1541
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("stop", { offset: ".713", stopColor: "#FFDA66", stopOpacity: "0" })
|
|
1527
1542
|
] }),
|
|
1528
|
-
/* @__PURE__ */ (0,
|
|
1543
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
1529
1544
|
"filter",
|
|
1530
1545
|
{
|
|
1531
1546
|
id: "warning-c",
|
|
@@ -1536,13 +1551,13 @@ var WarningIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg"
|
|
|
1536
1551
|
colorInterpolationFilters: "sRGB",
|
|
1537
1552
|
filterUnits: "userSpaceOnUse",
|
|
1538
1553
|
children: [
|
|
1539
|
-
/* @__PURE__ */ (0,
|
|
1540
|
-
/* @__PURE__ */ (0,
|
|
1541
|
-
/* @__PURE__ */ (0,
|
|
1542
|
-
/* @__PURE__ */ (0,
|
|
1543
|
-
/* @__PURE__ */ (0,
|
|
1544
|
-
/* @__PURE__ */ (0,
|
|
1545
|
-
/* @__PURE__ */ (0,
|
|
1554
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
1555
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feColorMatrix", { in: "SourceAlpha", result: "hardAlpha", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" }),
|
|
1556
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feOffset", { dy: "1.875" }),
|
|
1557
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feGaussianBlur", { stdDeviation: "1.875" }),
|
|
1558
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feColorMatrix", { values: "0 0 0 0 1 0 0 0 0 0.913725 0 0 0 0 0.6 0 0 0 0.45 0" }),
|
|
1559
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feBlend", { in2: "BackgroundImageFix", result: "effect1_dropShadow_39_758" }),
|
|
1560
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("feBlend", { in: "SourceGraphic", in2: "effect1_dropShadow_39_758", result: "shape" })
|
|
1546
1561
|
]
|
|
1547
1562
|
}
|
|
1548
1563
|
)
|
|
@@ -1551,7 +1566,7 @@ var WarningIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg"
|
|
|
1551
1566
|
var WarningIcon_default = WarningIcon;
|
|
1552
1567
|
|
|
1553
1568
|
// src/components/IDKitWidget/States/ErrorState.tsx
|
|
1554
|
-
var
|
|
1569
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
1555
1570
|
var getParams = ({ retryFlow, errorState }) => ({ retryFlow, errorState });
|
|
1556
1571
|
var ERROR_TITLES = {
|
|
1557
1572
|
[import_idkit_core2.AppErrorCodes.GenericError]: __("Something went wrong"),
|
|
@@ -1582,20 +1597,20 @@ var ERROR_MESSAGES = {
|
|
|
1582
1597
|
var ErrorState = (props) => {
|
|
1583
1598
|
const { retryFlow, errorState } = idkit_default(getParams);
|
|
1584
1599
|
const { show_modal } = props;
|
|
1585
|
-
return /* @__PURE__ */ (0,
|
|
1586
|
-
/* @__PURE__ */ (0,
|
|
1587
|
-
/* @__PURE__ */ (0,
|
|
1588
|
-
/* @__PURE__ */ (0,
|
|
1589
|
-
/* @__PURE__ */ (0,
|
|
1600
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "space-y-8", children: [
|
|
1601
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: clsx_default("flex items-center justify-center", show_modal ? "-mt-5" : ""), children: errorState?.code == import_idkit_core2.AppErrorCodes.VerificationRejected ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(WarningIcon_default, { className: "w-24" }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorIcon_default, { className: "w-24" }) }),
|
|
1602
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
|
|
1603
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: (errorState?.code && ERROR_TITLES[errorState.code]) ?? ERROR_TITLES[import_idkit_core2.AppErrorCodes.GenericError] }),
|
|
1604
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mx-auto mt-2 max-w-[224px] text-center text-657080", children: errorState?.message ?? ERROR_MESSAGES[errorState?.code ?? import_idkit_core2.AppErrorCodes.GenericError] })
|
|
1590
1605
|
] }),
|
|
1591
|
-
/* @__PURE__ */ (0,
|
|
1606
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
1592
1607
|
"button",
|
|
1593
1608
|
{
|
|
1594
1609
|
type: "button",
|
|
1595
1610
|
onClick: retryFlow,
|
|
1596
1611
|
className: "inline-flex items-center rounded-lg border border-ebecef bg-transparent px-8 py-3 font-medium text-3c424b shadow-sm transition duration-300 hover:shadow focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-40",
|
|
1597
1612
|
children: [
|
|
1598
|
-
/* @__PURE__ */ (0,
|
|
1613
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ReloadIcon_default, { className: "mr-1.5 size-5" }),
|
|
1599
1614
|
__("Try Again")
|
|
1600
1615
|
]
|
|
1601
1616
|
}
|
|
@@ -1608,9 +1623,9 @@ var ErrorState_default = ErrorState;
|
|
|
1608
1623
|
var Toast = __toESM(require("@radix-ui/react-toast"), 1);
|
|
1609
1624
|
|
|
1610
1625
|
// src/components/Icons/CheckIcon.tsx
|
|
1611
|
-
var
|
|
1612
|
-
var CheckIcon = (props) => /* @__PURE__ */ (0,
|
|
1613
|
-
/* @__PURE__ */ (0,
|
|
1626
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
1627
|
+
var CheckIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 100 100", ...props, children: [
|
|
1628
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1614
1629
|
"circle",
|
|
1615
1630
|
{
|
|
1616
1631
|
cx: "50",
|
|
@@ -1622,11 +1637,11 @@ var CheckIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg",
|
|
|
1622
1637
|
strokeWidth: "1.25"
|
|
1623
1638
|
}
|
|
1624
1639
|
),
|
|
1625
|
-
/* @__PURE__ */ (0,
|
|
1626
|
-
/* @__PURE__ */ (0,
|
|
1627
|
-
/* @__PURE__ */ (0,
|
|
1640
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("g", { filter: "url(#success-c)", children: [
|
|
1641
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("circle", { cx: "50", cy: "50", r: "35", fill: "#fff" }),
|
|
1642
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("circle", { cx: "50", cy: "50", r: "34.432", stroke: "#CCEBCC", strokeWidth: "1.136" })
|
|
1628
1643
|
] }),
|
|
1629
|
-
/* @__PURE__ */ (0,
|
|
1644
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
1630
1645
|
"path",
|
|
1631
1646
|
{
|
|
1632
1647
|
stroke: "#090",
|
|
@@ -1636,16 +1651,16 @@ var CheckIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg",
|
|
|
1636
1651
|
d: "m41.25 52.5 4.375 4.375 13.125-13.75"
|
|
1637
1652
|
}
|
|
1638
1653
|
),
|
|
1639
|
-
/* @__PURE__ */ (0,
|
|
1640
|
-
/* @__PURE__ */ (0,
|
|
1641
|
-
/* @__PURE__ */ (0,
|
|
1642
|
-
/* @__PURE__ */ (0,
|
|
1654
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("defs", { children: [
|
|
1655
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("linearGradient", { id: "success-a", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1656
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("stop", { stopColor: "#99D699" }),
|
|
1657
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("stop", { offset: "1", stopColor: "#99D699", stopOpacity: "0" })
|
|
1643
1658
|
] }),
|
|
1644
|
-
/* @__PURE__ */ (0,
|
|
1645
|
-
/* @__PURE__ */ (0,
|
|
1646
|
-
/* @__PURE__ */ (0,
|
|
1659
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("linearGradient", { id: "success-b", x1: "50", x2: "50", y1: "0", y2: "100", gradientUnits: "userSpaceOnUse", children: [
|
|
1660
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("stop", { stopColor: "#99D699" }),
|
|
1661
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("stop", { offset: ".713", stopColor: "#99D699", stopOpacity: "0" })
|
|
1647
1662
|
] }),
|
|
1648
|
-
/* @__PURE__ */ (0,
|
|
1663
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
1649
1664
|
"filter",
|
|
1650
1665
|
{
|
|
1651
1666
|
id: "success-c",
|
|
@@ -1656,13 +1671,13 @@ var CheckIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg",
|
|
|
1656
1671
|
colorInterpolationFilters: "sRGB",
|
|
1657
1672
|
filterUnits: "userSpaceOnUse",
|
|
1658
1673
|
children: [
|
|
1659
|
-
/* @__PURE__ */ (0,
|
|
1660
|
-
/* @__PURE__ */ (0,
|
|
1661
|
-
/* @__PURE__ */ (0,
|
|
1662
|
-
/* @__PURE__ */ (0,
|
|
1663
|
-
/* @__PURE__ */ (0,
|
|
1664
|
-
/* @__PURE__ */ (0,
|
|
1665
|
-
/* @__PURE__ */ (0,
|
|
1674
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
|
|
1675
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feColorMatrix", { in: "SourceAlpha", result: "hardAlpha", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" }),
|
|
1676
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feOffset", { dy: "1.875" }),
|
|
1677
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feGaussianBlur", { stdDeviation: "1.875" }),
|
|
1678
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feColorMatrix", { values: "0 0 0 0 0.8 0 0 0 0 0.921569 0 0 0 0 0.8 0 0 0 0.45 0" }),
|
|
1679
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feBlend", { in2: "BackgroundImageFix", result: "effect1_dropShadow_39_712" }),
|
|
1680
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("feBlend", { in: "SourceGraphic", in2: "effect1_dropShadow_39_712", result: "shape" })
|
|
1666
1681
|
]
|
|
1667
1682
|
}
|
|
1668
1683
|
)
|
|
@@ -1671,13 +1686,13 @@ var CheckIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg",
|
|
|
1671
1686
|
var CheckIcon_default = CheckIcon;
|
|
1672
1687
|
|
|
1673
1688
|
// src/components/IDKitWidget/States/SuccessState.tsx
|
|
1674
|
-
var
|
|
1689
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
1675
1690
|
var SuccessState = (props) => {
|
|
1676
|
-
return /* @__PURE__ */ (0,
|
|
1677
|
-
/* @__PURE__ */ (0,
|
|
1678
|
-
/* @__PURE__ */ (0,
|
|
1679
|
-
/* @__PURE__ */ (0,
|
|
1680
|
-
/* @__PURE__ */ (0,
|
|
1691
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "space-y-6", children: [
|
|
1692
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: clsx_default("flex items-center justify-center", props.show_modal ? "-mt-5" : ""), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckIcon_default, { className: "w-24 text-white" }) }),
|
|
1693
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
|
|
1694
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: __("Successfully verified") }),
|
|
1695
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "mx-auto mt-2 max-w-[224px] text-center text-lg text-657080", children: __("Your World ID verification was successful") })
|
|
1681
1696
|
] })
|
|
1682
1697
|
] });
|
|
1683
1698
|
};
|
|
@@ -1687,9 +1702,9 @@ var SuccessState_default = SuccessState;
|
|
|
1687
1702
|
var import_copy_to_clipboard = __toESM(require("copy-to-clipboard"), 1);
|
|
1688
1703
|
|
|
1689
1704
|
// src/components/QRCode.tsx
|
|
1690
|
-
var
|
|
1705
|
+
var import_react4 = require("react");
|
|
1691
1706
|
var import_qrcode = __toESM(require("qrcode/lib/core/qrcode.js"), 1);
|
|
1692
|
-
var
|
|
1707
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
1693
1708
|
var generateMatrix = (data) => {
|
|
1694
1709
|
const arr = import_qrcode.default.create(data, { errorCorrectionLevel: "M" }).modules.data;
|
|
1695
1710
|
const sqrt = Math.sqrt(arr.length);
|
|
@@ -1703,7 +1718,7 @@ var generateMatrix = (data) => {
|
|
|
1703
1718
|
);
|
|
1704
1719
|
};
|
|
1705
1720
|
var Qrcode = ({ data, size = 300 }) => {
|
|
1706
|
-
const dots = (0,
|
|
1721
|
+
const dots = (0, import_react4.useMemo)(() => {
|
|
1707
1722
|
const dots2 = [];
|
|
1708
1723
|
const matrix = generateMatrix(data);
|
|
1709
1724
|
const cellSize = size / matrix.length;
|
|
@@ -1717,7 +1732,7 @@ var Qrcode = ({ data, size = 300 }) => {
|
|
|
1717
1732
|
const y1 = (matrix.length - 7) * cellSize * y;
|
|
1718
1733
|
for (let i = 0; i < 3; i++) {
|
|
1719
1734
|
dots2.push(
|
|
1720
|
-
/* @__PURE__ */ (0,
|
|
1735
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1721
1736
|
"rect",
|
|
1722
1737
|
{
|
|
1723
1738
|
fill: "currentColor",
|
|
@@ -1739,7 +1754,7 @@ var Qrcode = ({ data, size = 300 }) => {
|
|
|
1739
1754
|
if (!matrix[i][j]) return;
|
|
1740
1755
|
if (i < 7 && j < 7 || i > matrix.length - 8 && j < 7 || i < 7 && j > matrix.length - 8) return;
|
|
1741
1756
|
dots2.push(
|
|
1742
|
-
/* @__PURE__ */ (0,
|
|
1757
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1743
1758
|
"circle",
|
|
1744
1759
|
{
|
|
1745
1760
|
fill: "currentColor",
|
|
@@ -1755,17 +1770,17 @@ var Qrcode = ({ data, size = 300 }) => {
|
|
|
1755
1770
|
});
|
|
1756
1771
|
return dots2;
|
|
1757
1772
|
}, [size, data]);
|
|
1758
|
-
return /* @__PURE__ */ (0,
|
|
1773
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("svg", { height: size, width: size, "data-test-id": "qr-code", children: dots });
|
|
1759
1774
|
};
|
|
1760
|
-
var QRCode_default = (0,
|
|
1775
|
+
var QRCode_default = (0, import_react4.memo)(Qrcode);
|
|
1761
1776
|
|
|
1762
1777
|
// src/components/IDKitWidget/States/WorldID/QRState.tsx
|
|
1763
|
-
var
|
|
1778
|
+
var import_react5 = require("react");
|
|
1764
1779
|
var import_framer_motion = require("framer-motion");
|
|
1765
1780
|
|
|
1766
1781
|
// src/components/Icons/WorldcoinIcon.tsx
|
|
1767
|
-
var
|
|
1768
|
-
var WorldcoinIcon = (props) => /* @__PURE__ */ (0,
|
|
1782
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1783
|
+
var WorldcoinIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 33 32", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1769
1784
|
"path",
|
|
1770
1785
|
{
|
|
1771
1786
|
fill: "currentColor",
|
|
@@ -1775,9 +1790,9 @@ var WorldcoinIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("sv
|
|
|
1775
1790
|
var WorldcoinIcon_default = WorldcoinIcon;
|
|
1776
1791
|
|
|
1777
1792
|
// src/components/Icons/QRPlaceholderIcon.tsx
|
|
1778
|
-
var
|
|
1779
|
-
var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0,
|
|
1780
|
-
/* @__PURE__ */ (0,
|
|
1793
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
1794
|
+
var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 200 200", children: [
|
|
1795
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1781
1796
|
"path",
|
|
1782
1797
|
{
|
|
1783
1798
|
fill: "#EBECEF",
|
|
@@ -1786,14 +1801,14 @@ var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs
|
|
|
1786
1801
|
clipRule: "evenodd"
|
|
1787
1802
|
}
|
|
1788
1803
|
),
|
|
1789
|
-
/* @__PURE__ */ (0,
|
|
1804
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1790
1805
|
"path",
|
|
1791
1806
|
{
|
|
1792
1807
|
fill: "#EBECEF",
|
|
1793
1808
|
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"
|
|
1794
1809
|
}
|
|
1795
1810
|
),
|
|
1796
|
-
/* @__PURE__ */ (0,
|
|
1811
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1797
1812
|
"path",
|
|
1798
1813
|
{
|
|
1799
1814
|
fill: "#EBECEF",
|
|
@@ -1802,14 +1817,14 @@ var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs
|
|
|
1802
1817
|
clipRule: "evenodd"
|
|
1803
1818
|
}
|
|
1804
1819
|
),
|
|
1805
|
-
/* @__PURE__ */ (0,
|
|
1820
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1806
1821
|
"path",
|
|
1807
1822
|
{
|
|
1808
1823
|
fill: "#EBECEF",
|
|
1809
1824
|
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"
|
|
1810
1825
|
}
|
|
1811
1826
|
),
|
|
1812
|
-
/* @__PURE__ */ (0,
|
|
1827
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1813
1828
|
"path",
|
|
1814
1829
|
{
|
|
1815
1830
|
fill: "url(#a)",
|
|
@@ -1818,14 +1833,14 @@ var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs
|
|
|
1818
1833
|
clipRule: "evenodd"
|
|
1819
1834
|
}
|
|
1820
1835
|
),
|
|
1821
|
-
/* @__PURE__ */ (0,
|
|
1836
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1822
1837
|
"path",
|
|
1823
1838
|
{
|
|
1824
1839
|
fill: "url(#a)",
|
|
1825
1840
|
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"
|
|
1826
1841
|
}
|
|
1827
1842
|
),
|
|
1828
|
-
/* @__PURE__ */ (0,
|
|
1843
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1829
1844
|
"path",
|
|
1830
1845
|
{
|
|
1831
1846
|
fill: "url(#a)",
|
|
@@ -1834,7 +1849,7 @@ var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs
|
|
|
1834
1849
|
clipRule: "evenodd"
|
|
1835
1850
|
}
|
|
1836
1851
|
),
|
|
1837
|
-
/* @__PURE__ */ (0,
|
|
1852
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1838
1853
|
"path",
|
|
1839
1854
|
{
|
|
1840
1855
|
fill: "url(#a)",
|
|
@@ -1843,62 +1858,62 @@ var QRPlaceholderIcon = (props) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs
|
|
|
1843
1858
|
clipRule: "evenodd"
|
|
1844
1859
|
}
|
|
1845
1860
|
),
|
|
1846
|
-
/* @__PURE__ */ (0,
|
|
1861
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1847
1862
|
"path",
|
|
1848
1863
|
{
|
|
1849
1864
|
fill: "url(#a)",
|
|
1850
1865
|
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"
|
|
1851
1866
|
}
|
|
1852
1867
|
),
|
|
1853
|
-
/* @__PURE__ */ (0,
|
|
1868
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1854
1869
|
"path",
|
|
1855
1870
|
{
|
|
1856
1871
|
fill: "url(#a)",
|
|
1857
1872
|
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"
|
|
1858
1873
|
}
|
|
1859
1874
|
),
|
|
1860
|
-
/* @__PURE__ */ (0,
|
|
1875
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1861
1876
|
"path",
|
|
1862
1877
|
{
|
|
1863
1878
|
fill: "url(#a)",
|
|
1864
1879
|
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"
|
|
1865
1880
|
}
|
|
1866
1881
|
),
|
|
1867
|
-
/* @__PURE__ */ (0,
|
|
1882
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1868
1883
|
"path",
|
|
1869
1884
|
{
|
|
1870
1885
|
fill: "url(#a)",
|
|
1871
1886
|
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"
|
|
1872
1887
|
}
|
|
1873
1888
|
),
|
|
1874
|
-
/* @__PURE__ */ (0,
|
|
1889
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1875
1890
|
"path",
|
|
1876
1891
|
{
|
|
1877
1892
|
fill: "url(#a)",
|
|
1878
1893
|
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"
|
|
1879
1894
|
}
|
|
1880
1895
|
),
|
|
1881
|
-
/* @__PURE__ */ (0,
|
|
1882
|
-
/* @__PURE__ */ (0,
|
|
1883
|
-
/* @__PURE__ */ (0,
|
|
1884
|
-
/* @__PURE__ */ (0,
|
|
1896
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("linearGradient", { id: "a", x1: "0", x2: "200", y1: "0", y2: "200", gradientUnits: "userSpaceOnUse", children: [
|
|
1897
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("stop", { offset: ".37", stopColor: "#fff", stopOpacity: "0" }),
|
|
1898
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("stop", { offset: ".5", stopColor: "#fff", stopOpacity: ".85" }),
|
|
1899
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("stop", { offset: ".63", stopColor: "#fff", stopOpacity: "0" })
|
|
1885
1900
|
] }) })
|
|
1886
1901
|
] });
|
|
1887
1902
|
var QRPlaceholderIcon_default = QRPlaceholderIcon;
|
|
1888
1903
|
|
|
1889
1904
|
// src/components/IDKitWidget/States/WorldID/QRState.tsx
|
|
1890
|
-
var
|
|
1905
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
1891
1906
|
var QRState = ({ qrData, showQR, setShowQR }) => {
|
|
1892
1907
|
const media = useMedia_default();
|
|
1893
|
-
const [copiedLink, setCopiedLink] = (0,
|
|
1894
|
-
const copyLink = (0,
|
|
1908
|
+
const [copiedLink, setCopiedLink] = (0, import_react5.useState)(false);
|
|
1909
|
+
const copyLink = (0, import_react5.useCallback)(() => {
|
|
1895
1910
|
(0, import_copy_to_clipboard.default)(qrData ?? "");
|
|
1896
1911
|
setCopiedLink(true);
|
|
1897
1912
|
setTimeout(() => setCopiedLink(false), 2e3);
|
|
1898
1913
|
}, [qrData]);
|
|
1899
|
-
return /* @__PURE__ */ (0,
|
|
1900
|
-
/* @__PURE__ */ (0,
|
|
1901
|
-
/* @__PURE__ */ (0,
|
|
1914
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
1915
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: clsx_default("md:hidden", { "mb-10 space-y-4": !showQR }), children: [
|
|
1916
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
1902
1917
|
import_framer_motion.motion.a,
|
|
1903
1918
|
{
|
|
1904
1919
|
href: qrData ?? "",
|
|
@@ -1912,8 +1927,8 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
|
|
|
1912
1927
|
{ hidden: showQR }
|
|
1913
1928
|
),
|
|
1914
1929
|
children: [
|
|
1915
|
-
/* @__PURE__ */ (0,
|
|
1916
|
-
/* @__PURE__ */ (0,
|
|
1930
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(WorldcoinIcon_default, { className: "size-5" }),
|
|
1931
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1917
1932
|
import_framer_motion.motion.span,
|
|
1918
1933
|
{
|
|
1919
1934
|
className: "flex-1 text-center",
|
|
@@ -1925,13 +1940,13 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
|
|
|
1925
1940
|
]
|
|
1926
1941
|
}
|
|
1927
1942
|
),
|
|
1928
|
-
/* @__PURE__ */ (0,
|
|
1929
|
-
/* @__PURE__ */ (0,
|
|
1930
|
-
/* @__PURE__ */ (0,
|
|
1931
|
-
/* @__PURE__ */ (0,
|
|
1932
|
-
/* @__PURE__ */ (0,
|
|
1943
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: clsx_default("mb-3", { "space-y-4": !showQR, hidden: media === "mobile" }), children: [
|
|
1944
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: clsx_default("flex items-center space-x-4 ", { hidden: showQR }), children: [
|
|
1945
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("hr", { className: "flex-1" }),
|
|
1946
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-xs font-medium text-9ba3ae", children: "or" }),
|
|
1947
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("hr", { className: "flex-1" })
|
|
1933
1948
|
] }),
|
|
1934
|
-
/* @__PURE__ */ (0,
|
|
1949
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1935
1950
|
import_framer_motion.motion.button,
|
|
1936
1951
|
{
|
|
1937
1952
|
className: "w-full rounded-2xl border border-ebecef p-4 text-lg font-medium text-3c424b",
|
|
@@ -1941,8 +1956,8 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
|
|
|
1941
1956
|
)
|
|
1942
1957
|
] })
|
|
1943
1958
|
] }),
|
|
1944
|
-
(media == "desktop" || showQR) && /* @__PURE__ */ (0,
|
|
1945
|
-
/* @__PURE__ */ (0,
|
|
1959
|
+
(media == "desktop" || showQR) && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
1960
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_framer_motion.AnimatePresence, { children: copiedLink && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1946
1961
|
import_framer_motion.motion.div,
|
|
1947
1962
|
{
|
|
1948
1963
|
className: "text-sm text-9eafc0",
|
|
@@ -1975,14 +1990,14 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
|
|
|
1975
1990
|
}
|
|
1976
1991
|
}
|
|
1977
1992
|
},
|
|
1978
|
-
children: /* @__PURE__ */ (0,
|
|
1993
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "rounded-lg border border-f1f5f8 px-2 py-1 text-sm", children: __("QR Code copied") })
|
|
1979
1994
|
},
|
|
1980
1995
|
"copied"
|
|
1981
1996
|
) }),
|
|
1982
|
-
/* @__PURE__ */ (0,
|
|
1997
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "relative inline-flex items-center justify-center rounded-2xl border border-f1f5f8 p-2 dark:border-f1f5f8/10", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "text-29343f dark:text-white", children: qrData ? (
|
|
1983
1998
|
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
|
|
1984
|
-
/* @__PURE__ */ (0,
|
|
1985
|
-
) : /* @__PURE__ */ (0,
|
|
1999
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { onClick: copyLink, className: "cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(QRCode_default, { data: qrData, size: 244 }) })
|
|
2000
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex size-[244px] items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(QRPlaceholderIcon_default, { className: "size-[244px] animate-pulse" }) }) }) })
|
|
1986
2001
|
] })
|
|
1987
2002
|
] });
|
|
1988
2003
|
};
|
|
@@ -1990,15 +2005,15 @@ var QRState_default = QRState;
|
|
|
1990
2005
|
|
|
1991
2006
|
// src/components/IDKitWidget/States/WorldIDState.tsx
|
|
1992
2007
|
var import_shallow2 = require("zustand/shallow");
|
|
1993
|
-
var
|
|
2008
|
+
var import_react7 = require("react");
|
|
1994
2009
|
|
|
1995
2010
|
// src/services/wld-bridge.ts
|
|
1996
|
-
var
|
|
2011
|
+
var import_react6 = require("react");
|
|
1997
2012
|
var import_idkit_core3 = require("@worldcoin/idkit-core");
|
|
1998
2013
|
var useWorldBridge = (app_id, action, signal, bridge_url, verification_level, action_description, partner) => {
|
|
1999
|
-
const ref_verification_level = (0,
|
|
2014
|
+
const ref_verification_level = (0, import_react6.useRef)(verification_level);
|
|
2000
2015
|
const { reset, result, connectorURI, createClient, pollForUpdates, verificationState, errorCode } = (0, import_idkit_core3.useWorldBridgeStore)();
|
|
2001
|
-
(0,
|
|
2016
|
+
(0, import_react6.useEffect)(() => {
|
|
2002
2017
|
if (!connectorURI) {
|
|
2003
2018
|
void createClient({
|
|
2004
2019
|
app_id,
|
|
@@ -2021,7 +2036,7 @@ var useWorldBridge = (app_id, action, signal, bridge_url, verification_level, ac
|
|
|
2021
2036
|
connectorURI,
|
|
2022
2037
|
partner
|
|
2023
2038
|
]);
|
|
2024
|
-
(0,
|
|
2039
|
+
(0, import_react6.useEffect)(() => {
|
|
2025
2040
|
if (!connectorURI || result || errorCode) return;
|
|
2026
2041
|
const interval = setInterval(() => void pollForUpdates(), 3e3);
|
|
2027
2042
|
return () => clearInterval(interval);
|
|
@@ -2030,8 +2045,8 @@ var useWorldBridge = (app_id, action, signal, bridge_url, verification_level, ac
|
|
|
2030
2045
|
};
|
|
2031
2046
|
|
|
2032
2047
|
// src/components/Icons/LoadingIcon.tsx
|
|
2033
|
-
var
|
|
2034
|
-
var LoadingIcon = ({ className, ...props }) => /* @__PURE__ */ (0,
|
|
2048
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
2049
|
+
var LoadingIcon = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
2035
2050
|
"svg",
|
|
2036
2051
|
{
|
|
2037
2052
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2040,8 +2055,8 @@ var LoadingIcon = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_ru
|
|
|
2040
2055
|
className: `animate-spin motion-reduce:animate-[spin_1.5s_linear_infinite] ${className}`,
|
|
2041
2056
|
...props,
|
|
2042
2057
|
children: [
|
|
2043
|
-
/* @__PURE__ */ (0,
|
|
2044
|
-
/* @__PURE__ */ (0,
|
|
2058
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("circle", { cx: "12", cy: "12", r: "10.75", stroke: "#191C20", strokeOpacity: ".16", strokeWidth: "2.5" }),
|
|
2059
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2045
2060
|
"path",
|
|
2046
2061
|
{
|
|
2047
2062
|
fill: "#191C20",
|
|
@@ -2055,7 +2070,7 @@ var LoadingIcon_default = LoadingIcon;
|
|
|
2055
2070
|
|
|
2056
2071
|
// src/components/IDKitWidget/States/WorldIDState.tsx
|
|
2057
2072
|
var import_idkit_core4 = require("@worldcoin/idkit-core");
|
|
2058
|
-
var
|
|
2073
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
2059
2074
|
var getOptions = (store) => ({
|
|
2060
2075
|
signal: store.signal,
|
|
2061
2076
|
app_id: store.app_id,
|
|
@@ -2070,7 +2085,7 @@ var getOptions = (store) => ({
|
|
|
2070
2085
|
});
|
|
2071
2086
|
var WorldIDState = (props) => {
|
|
2072
2087
|
const media = useMedia_default();
|
|
2073
|
-
const [showQR, setShowQR] = (0,
|
|
2088
|
+
const [showQR, setShowQR] = (0, import_react7.useState)(false);
|
|
2074
2089
|
const {
|
|
2075
2090
|
app_id,
|
|
2076
2091
|
action,
|
|
@@ -2092,8 +2107,8 @@ var WorldIDState = (props) => {
|
|
|
2092
2107
|
action_description,
|
|
2093
2108
|
partner
|
|
2094
2109
|
);
|
|
2095
|
-
(0,
|
|
2096
|
-
(0,
|
|
2110
|
+
(0, import_react7.useEffect)(() => reset, [reset]);
|
|
2111
|
+
(0, import_react7.useEffect)(() => {
|
|
2097
2112
|
if (verificationState === import_idkit_core4.VerificationState.Failed) {
|
|
2098
2113
|
setStage("ERROR" /* ERROR */);
|
|
2099
2114
|
setErrorState({ code: errorCode ?? import_idkit_core4.AppErrorCodes.GenericError });
|
|
@@ -2109,7 +2124,7 @@ var WorldIDState = (props) => {
|
|
|
2109
2124
|
}
|
|
2110
2125
|
}, [result, handleVerify, verificationState, setStage, errorCode, setErrorState, verification_level]);
|
|
2111
2126
|
const { show_modal } = props;
|
|
2112
|
-
return /* @__PURE__ */ (0,
|
|
2127
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2113
2128
|
"div",
|
|
2114
2129
|
{
|
|
2115
2130
|
className: clsx_default(
|
|
@@ -2117,33 +2132,33 @@ var WorldIDState = (props) => {
|
|
|
2117
2132
|
show_modal ? showQR ? "-mt-6 space-y-5 " : "-mt-6 space-y-10 " : ""
|
|
2118
2133
|
),
|
|
2119
2134
|
children: [
|
|
2120
|
-
/* @__PURE__ */ (0,
|
|
2121
|
-
/* @__PURE__ */ (0,
|
|
2122
|
-
/* @__PURE__ */ (0,
|
|
2123
|
-
/* @__PURE__ */ (0,
|
|
2135
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: clsx_default(!show_modal ? "hidden" : ""), children: [
|
|
2136
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "mb-4 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorldcoinIcon_default, { className: "h-10 text-0d151d dark:text-white" }) }),
|
|
2137
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "font-sora text-2xl font-semibold text-gray-900 dark:text-white", children: __("Verify with World ID") }),
|
|
2138
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("p", { className: clsx_default("mt-3 text-657080 dark:text-9eafc0 md:mt-2", { hidden: media === "mobile" }), children: [
|
|
2124
2139
|
"Use your camera to scan the QR code. ",
|
|
2125
|
-
/* @__PURE__ */ (0,
|
|
2140
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("br", {}),
|
|
2126
2141
|
" ",
|
|
2127
|
-
/* @__PURE__ */ (0,
|
|
2142
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-red-500", children: "Keep this window open after scanning." })
|
|
2128
2143
|
] })
|
|
2129
2144
|
] }),
|
|
2130
|
-
/* @__PURE__ */ (0,
|
|
2131
|
-
verificationState === import_idkit_core4.VerificationState.WaitingForApp && /* @__PURE__ */ (0,
|
|
2132
|
-
/* @__PURE__ */ (0,
|
|
2133
|
-
/* @__PURE__ */ (0,
|
|
2134
|
-
/* @__PURE__ */ (0,
|
|
2135
|
-
/* @__PURE__ */ (0,
|
|
2136
|
-
/* @__PURE__ */ (0,
|
|
2145
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "relative w-full", children: [
|
|
2146
|
+
verificationState === import_idkit_core4.VerificationState.WaitingForApp && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "absolute inset-0 flex flex-col items-center justify-center space-y-6", children: [
|
|
2147
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LoadingIcon_default, { className: "size-6" }),
|
|
2148
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
|
|
2149
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "font-bold text-657080", children: "Verifying" }),
|
|
2150
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-sm text-657080", children: "Please continue in app" }),
|
|
2151
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: clsx_default(show_modal ? "" : "hidden", "mt-2 text-sm font-bold text-red-500"), children: "Don't close this window" })
|
|
2137
2152
|
] })
|
|
2138
2153
|
] }),
|
|
2139
|
-
/* @__PURE__ */ (0,
|
|
2154
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2140
2155
|
"div",
|
|
2141
2156
|
{
|
|
2142
2157
|
className: clsx_default(
|
|
2143
2158
|
"transition duration-500 ease-in-out",
|
|
2144
2159
|
verificationState === import_idkit_core4.VerificationState.WaitingForApp && "opacity-40 blur-lg"
|
|
2145
2160
|
),
|
|
2146
|
-
children: /* @__PURE__ */ (0,
|
|
2161
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "mx-auto", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(QRState_default, { showQR, setShowQR, qrData: connectorURI }) })
|
|
2147
2162
|
}
|
|
2148
2163
|
)
|
|
2149
2164
|
] })
|
|
@@ -2155,21 +2170,21 @@ var WorldIDState_default = WorldIDState;
|
|
|
2155
2170
|
|
|
2156
2171
|
// src/components/IDKitWidget/BaseWidget.tsx
|
|
2157
2172
|
var Dialog = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
2158
|
-
var
|
|
2173
|
+
var import_react8 = require("react");
|
|
2159
2174
|
var import_framer_motion2 = require("framer-motion");
|
|
2160
2175
|
|
|
2161
2176
|
// src/components/IDKitWidget/States/HostAppVerificationState.tsx
|
|
2162
|
-
var
|
|
2177
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
2163
2178
|
var HostAppVerificationState = () => {
|
|
2164
|
-
return /* @__PURE__ */ (0,
|
|
2165
|
-
/* @__PURE__ */ (0,
|
|
2166
|
-
/* @__PURE__ */ (0,
|
|
2179
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "space-y-6", children: [
|
|
2180
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LoadingIcon_default, { className: "size-24" }) }),
|
|
2181
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mt-4 text-70868f", children: __("Transmitting verification to host app. Please wait...") })
|
|
2167
2182
|
] });
|
|
2168
2183
|
};
|
|
2169
2184
|
var HostAppVerificationState_default = HostAppVerificationState;
|
|
2170
2185
|
|
|
2171
2186
|
// src/components/IDKitWidget/BaseWidget.tsx
|
|
2172
|
-
var
|
|
2187
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
2173
2188
|
var getParams2 = ({ open, processing, onOpenChange, stage, setStage, setOptions }) => ({
|
|
2174
2189
|
stage,
|
|
2175
2190
|
setStage,
|
|
@@ -2187,31 +2202,31 @@ var IDKitWidget = ({
|
|
|
2187
2202
|
}) => {
|
|
2188
2203
|
const media = useMedia_default();
|
|
2189
2204
|
const { isOpen, onOpenChange, stage, setOptions } = idkit_default(getParams2, import_shallow3.shallow);
|
|
2190
|
-
(0,
|
|
2205
|
+
(0, import_react8.useEffect)(() => {
|
|
2191
2206
|
if (config.action === "") {
|
|
2192
2207
|
throw new Error(__("Action cannot be an empty string."));
|
|
2193
2208
|
}
|
|
2194
2209
|
setOptions(config, "props" /* PROPS */);
|
|
2195
2210
|
}, [config, setOptions]);
|
|
2196
|
-
const StageContent = (0,
|
|
2211
|
+
const StageContent = (0, import_react8.useMemo)(() => {
|
|
2197
2212
|
switch (stage) {
|
|
2198
2213
|
case "WORLD_ID" /* WORLD_ID */:
|
|
2199
|
-
return /* @__PURE__ */ (0,
|
|
2214
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(WorldIDState_default, { show_modal });
|
|
2200
2215
|
case "SUCCESS" /* SUCCESS */:
|
|
2201
|
-
return /* @__PURE__ */ (0,
|
|
2216
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SuccessState_default, {});
|
|
2202
2217
|
case "ERROR" /* ERROR */:
|
|
2203
|
-
return /* @__PURE__ */ (0,
|
|
2218
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ErrorState_default, {});
|
|
2204
2219
|
case "HOST_APP_VERIFICATION" /* HOST_APP_VERIFICATION */:
|
|
2205
|
-
return /* @__PURE__ */ (0,
|
|
2220
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(HostAppVerificationState_default, {});
|
|
2206
2221
|
default:
|
|
2207
2222
|
throw new Error(__("Invalid IDKitStage :stage.", { stage }));
|
|
2208
2223
|
}
|
|
2209
2224
|
}, [stage, show_modal]);
|
|
2210
|
-
const widgetContent = /* @__PURE__ */ (0,
|
|
2211
|
-
/* @__PURE__ */ (0,
|
|
2212
|
-
/* @__PURE__ */ (0,
|
|
2213
|
-
/* @__PURE__ */ (0,
|
|
2214
|
-
/* @__PURE__ */ (0,
|
|
2225
|
+
const widgetContent = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(ShadowHost, { mode: "open", id: "idkit-widget", children: [
|
|
2226
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Styles_default, {}),
|
|
2227
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Toast.Provider, { children: [
|
|
2228
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Toast.Viewport, { className: "flex justify-center" }),
|
|
2229
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2215
2230
|
"div",
|
|
2216
2231
|
{
|
|
2217
2232
|
id: "widget-content-inline",
|
|
@@ -2224,7 +2239,7 @@ var IDKitWidget = ({
|
|
|
2224
2239
|
if (!show_modal && container_id) {
|
|
2225
2240
|
const containerElement = document.getElementById(container_id);
|
|
2226
2241
|
if (containerElement) {
|
|
2227
|
-
return (0,
|
|
2242
|
+
return (0, import_react_dom2.createPortal)(widgetContent, containerElement);
|
|
2228
2243
|
}
|
|
2229
2244
|
console.warn(`Container element with id "${container_id}" not found. Rendering widget inline.`);
|
|
2230
2245
|
}
|
|
@@ -2233,12 +2248,12 @@ var IDKitWidget = ({
|
|
|
2233
2248
|
e.preventDefault();
|
|
2234
2249
|
}
|
|
2235
2250
|
};
|
|
2236
|
-
return /* @__PURE__ */ (0,
|
|
2251
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Dialog.Root, { open: isOpen, onOpenChange, children: [
|
|
2237
2252
|
children?.({ open: () => onOpenChange(true) }),
|
|
2238
|
-
/* @__PURE__ */ (0,
|
|
2239
|
-
/* @__PURE__ */ (0,
|
|
2240
|
-
/* @__PURE__ */ (0,
|
|
2241
|
-
/* @__PURE__ */ (0,
|
|
2253
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Portal, { forceMount: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react8.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_framer_motion2.AnimatePresence, { children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(ShadowHost, { mode: "open", id: "idkit-widget", children: [
|
|
2254
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Styles_default, {}),
|
|
2255
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { id: "modal", className: "fixed z-[9999] font-sans", children: [
|
|
2256
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Overlay, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2242
2257
|
import_framer_motion2.motion.div,
|
|
2243
2258
|
{
|
|
2244
2259
|
initial: { opacity: 0 },
|
|
@@ -2247,15 +2262,15 @@ var IDKitWidget = ({
|
|
|
2247
2262
|
className: "fixed inset-0 bg-black/50 backdrop-blur-lg"
|
|
2248
2263
|
}
|
|
2249
2264
|
) }),
|
|
2250
|
-
/* @__PURE__ */ (0,
|
|
2251
|
-
/* @__PURE__ */ (0,
|
|
2252
|
-
/* @__PURE__ */ (0,
|
|
2265
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fixed inset-0 z-[9999] overflow-y-hidden md:overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex min-h-full items-end justify-center text-center md:items-center md:p-4", children: [
|
|
2266
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Title, {}),
|
|
2267
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2253
2268
|
Dialog.Content,
|
|
2254
2269
|
{
|
|
2255
2270
|
asChild: true,
|
|
2256
2271
|
onPointerDownOutside: avoidDefaultDomBehavior,
|
|
2257
2272
|
onInteractOutside: avoidDefaultDomBehavior,
|
|
2258
|
-
children: /* @__PURE__ */ (0,
|
|
2273
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2259
2274
|
import_framer_motion2.motion.div,
|
|
2260
2275
|
{
|
|
2261
2276
|
layout: media == "mobile" ? "position" : true,
|
|
@@ -2270,11 +2285,11 @@ var IDKitWidget = ({
|
|
|
2270
2285
|
},
|
|
2271
2286
|
transition: { layout: { duration: 0.15 } },
|
|
2272
2287
|
className: "relative z-50 flex min-h-screen w-full flex-col bg-white pt-6 shadow focus:outline-none focus-visible:ring focus-visible:ring-purple-500/75 dark:bg-0d151d md:min-h-[35rem] md:max-w-md md:rounded-2xl",
|
|
2273
|
-
children: /* @__PURE__ */ (0,
|
|
2274
|
-
/* @__PURE__ */ (0,
|
|
2275
|
-
/* @__PURE__ */ (0,
|
|
2276
|
-
/* @__PURE__ */ (0,
|
|
2277
|
-
/* @__PURE__ */ (0,
|
|
2288
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Toast.Provider, { children: [
|
|
2289
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Toast.Viewport, { className: "flex justify-center" }),
|
|
2290
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mx-6 mb-12 flex items-center justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Close, { className: "flex size-11 items-center justify-center rounded-full text-black dark:text-white", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(XMarkIcon_default, { className: "size-5" }) }) }),
|
|
2291
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "relative mx-6 mb-6 flex flex-1 flex-col items-center justify-center", children: StageContent }),
|
|
2292
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-center border-t border-f5f5f7 p-7 md:rounded-b-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2278
2293
|
"a",
|
|
2279
2294
|
{
|
|
2280
2295
|
href: "https://developer.worldcoin.org/privacy-statement",
|
|
@@ -2297,7 +2312,7 @@ var IDKitWidget = ({
|
|
|
2297
2312
|
var BaseWidget_default = IDKitWidget;
|
|
2298
2313
|
|
|
2299
2314
|
// src/components/IDKitWidget/index.tsx
|
|
2300
|
-
var IDKitWidget_default = (0,
|
|
2315
|
+
var IDKitWidget_default = (0, import_react9.memo)(BaseWidget_default);
|
|
2301
2316
|
|
|
2302
2317
|
// src/index.ts
|
|
2303
2318
|
var import_hashing = require("@worldcoin/idkit-core/hashing");
|
|
@@ -2305,7 +2320,7 @@ var import_backend = require("@worldcoin/idkit-core/backend");
|
|
|
2305
2320
|
var import_idkit_core7 = require("@worldcoin/idkit-core");
|
|
2306
2321
|
|
|
2307
2322
|
// src/hooks/useSession.ts
|
|
2308
|
-
var
|
|
2323
|
+
var import_react10 = require("react");
|
|
2309
2324
|
var import_shallow4 = require("zustand/react/shallow");
|
|
2310
2325
|
var import_idkit_core5 = require("@worldcoin/idkit-core");
|
|
2311
2326
|
var import_idkit_core6 = require("@worldcoin/idkit-core");
|
|
@@ -2322,12 +2337,12 @@ function useSession(config) {
|
|
|
2322
2337
|
errorCode: state.errorCode
|
|
2323
2338
|
}))
|
|
2324
2339
|
);
|
|
2325
|
-
(0,
|
|
2340
|
+
(0, import_react10.useEffect)(() => {
|
|
2326
2341
|
if (verificationState === import_idkit_core5.VerificationState.PreparingClient && !connectorURI) {
|
|
2327
2342
|
void createClient(config);
|
|
2328
2343
|
}
|
|
2329
2344
|
}, [verificationState, connectorURI, createClient, config]);
|
|
2330
|
-
(0,
|
|
2345
|
+
(0, import_react10.useEffect)(() => {
|
|
2331
2346
|
if (TERMINAL_STATES.includes(verificationState)) return;
|
|
2332
2347
|
const interval = setInterval(() => {
|
|
2333
2348
|
void pollForUpdates();
|