@yourself_id/siwys-react-js 0.0.23 → 0.0.24-sapp-106-export-qr-code.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +12 -3
- package/dist/index.d.ts +12 -3
- package/dist/index.js +224 -143
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +215 -138
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -109,6 +109,30 @@ function _object_spread(target) {
|
|
|
109
109
|
}
|
|
110
110
|
return target;
|
|
111
111
|
}
|
|
112
|
+
function ownKeys(object, enumerableOnly) {
|
|
113
|
+
var keys = Object.keys(object);
|
|
114
|
+
if (Object.getOwnPropertySymbols) {
|
|
115
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
116
|
+
if (enumerableOnly) {
|
|
117
|
+
symbols = symbols.filter(function(sym) {
|
|
118
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
keys.push.apply(keys, symbols);
|
|
122
|
+
}
|
|
123
|
+
return keys;
|
|
124
|
+
}
|
|
125
|
+
function _object_spread_props(target, source) {
|
|
126
|
+
source = source != null ? source : {};
|
|
127
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
128
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
129
|
+
} else {
|
|
130
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
131
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
return target;
|
|
135
|
+
}
|
|
112
136
|
function _object_without_properties(source, excluded) {
|
|
113
137
|
if (source == null) return {};
|
|
114
138
|
var target = _object_without_properties_loose(source, excluded);
|
|
@@ -254,7 +278,8 @@ function _ts_generator(thisArg, body) {
|
|
|
254
278
|
}
|
|
255
279
|
function _templateObject() {
|
|
256
280
|
var data = _tagged_template_literal([
|
|
257
|
-
"\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3rem;\n width: fit-content;\n border-radius: 60px;\n border: none;\n
|
|
281
|
+
"\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3rem;\n width: fit-content;\n border-radius: 60px;\n border: none;\n padding: 12px 40px 12px 40px;\n white-space: nowrap;\n\n ",
|
|
282
|
+
"\n\n ",
|
|
258
283
|
"\n\n ",
|
|
259
284
|
"\n"
|
|
260
285
|
]);
|
|
@@ -265,7 +290,7 @@ function _templateObject() {
|
|
|
265
290
|
}
|
|
266
291
|
function _templateObject1() {
|
|
267
292
|
var data = _tagged_template_literal([
|
|
268
|
-
"\n
|
|
293
|
+
"\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"
|
|
269
294
|
]);
|
|
270
295
|
_templateObject1 = function _templateObject() {
|
|
271
296
|
return data;
|
|
@@ -274,7 +299,8 @@ function _templateObject1() {
|
|
|
274
299
|
}
|
|
275
300
|
function _templateObject2() {
|
|
276
301
|
var data = _tagged_template_literal([
|
|
277
|
-
"\n
|
|
302
|
+
"\n animation: ",
|
|
303
|
+
" 2s linear infinite;\n transform-origin: center;\n"
|
|
278
304
|
]);
|
|
279
305
|
_templateObject2 = function _templateObject() {
|
|
280
306
|
return data;
|
|
@@ -283,7 +309,7 @@ function _templateObject2() {
|
|
|
283
309
|
}
|
|
284
310
|
function _templateObject3() {
|
|
285
311
|
var data = _tagged_template_literal([
|
|
286
|
-
"\n
|
|
312
|
+
"\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-left: 0.5rem;\n"
|
|
287
313
|
]);
|
|
288
314
|
_templateObject3 = function _templateObject() {
|
|
289
315
|
return data;
|
|
@@ -292,7 +318,7 @@ function _templateObject3() {
|
|
|
292
318
|
}
|
|
293
319
|
function _templateObject4() {
|
|
294
320
|
var data = _tagged_template_literal([
|
|
295
|
-
"\n
|
|
321
|
+
"\n width: 305px; // fixed width to support loading indicator\n"
|
|
296
322
|
]);
|
|
297
323
|
_templateObject4 = function _templateObject() {
|
|
298
324
|
return data;
|
|
@@ -301,7 +327,7 @@ function _templateObject4() {
|
|
|
301
327
|
}
|
|
302
328
|
function _templateObject5() {
|
|
303
329
|
var data = _tagged_template_literal([
|
|
304
|
-
"\n
|
|
330
|
+
"\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border-right: 1px solid #3d414c;\n padding: 3rem 6rem;\n\n @media (max-width: 767px) {\n border: none;\n }\n"
|
|
305
331
|
]);
|
|
306
332
|
_templateObject5 = function _templateObject() {
|
|
307
333
|
return data;
|
|
@@ -310,8 +336,7 @@ function _templateObject5() {
|
|
|
310
336
|
}
|
|
311
337
|
function _templateObject6() {
|
|
312
338
|
var data = _tagged_template_literal([
|
|
313
|
-
"\n
|
|
314
|
-
" 2s linear infinite;\n transform-origin: center;\n }\n"
|
|
339
|
+
"\n color: white;\n font-size: 2rem;\n white-space: nowrap;\n"
|
|
315
340
|
]);
|
|
316
341
|
_templateObject6 = function _templateObject() {
|
|
317
342
|
return data;
|
|
@@ -320,7 +345,7 @@ function _templateObject6() {
|
|
|
320
345
|
}
|
|
321
346
|
function _templateObject7() {
|
|
322
347
|
var data = _tagged_template_literal([
|
|
323
|
-
"\n
|
|
348
|
+
"\n margin-top: 3rem;\n"
|
|
324
349
|
]);
|
|
325
350
|
_templateObject7 = function _templateObject() {
|
|
326
351
|
return data;
|
|
@@ -329,7 +354,7 @@ function _templateObject7() {
|
|
|
329
354
|
}
|
|
330
355
|
function _templateObject8() {
|
|
331
356
|
var data = _tagged_template_literal([
|
|
332
|
-
"\n
|
|
357
|
+
"\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"
|
|
333
358
|
]);
|
|
334
359
|
_templateObject8 = function _templateObject() {
|
|
335
360
|
return data;
|
|
@@ -338,7 +363,8 @@ function _templateObject8() {
|
|
|
338
363
|
}
|
|
339
364
|
function _templateObject9() {
|
|
340
365
|
var data = _tagged_template_literal([
|
|
341
|
-
"\n display: flex;\n justify-content:
|
|
366
|
+
"\n display: flex;\n justify-content: center;\n align-items: center;\n width: 212px;\n height: 212px;\n\n & > svg {\n animation: ",
|
|
367
|
+
" 2s linear infinite;\n transform-origin: center;\n }\n"
|
|
342
368
|
]);
|
|
343
369
|
_templateObject9 = function _templateObject() {
|
|
344
370
|
return data;
|
|
@@ -347,8 +373,7 @@ function _templateObject9() {
|
|
|
347
373
|
}
|
|
348
374
|
function _templateObject10() {
|
|
349
375
|
var data = _tagged_template_literal([
|
|
350
|
-
"\n display:
|
|
351
|
-
";\n"
|
|
376
|
+
"\n display: inline-block;\n flex-direction: column;\n gap: 1rem;\n background: #121318;\n border: 1px solid #3d414c;\n border-radius: 8px;\n padding: 1.5rem 2rem;\n margin-top: 1rem;\n"
|
|
352
377
|
]);
|
|
353
378
|
_templateObject10 = function _templateObject() {
|
|
354
379
|
return data;
|
|
@@ -357,7 +382,7 @@ function _templateObject10() {
|
|
|
357
382
|
}
|
|
358
383
|
function _templateObject11() {
|
|
359
384
|
var data = _tagged_template_literal([
|
|
360
|
-
"\n display: flex;\n
|
|
385
|
+
"\n display: flex;\n justify-content: space-between;\n color: white;\n white-space: nowrap;\n"
|
|
361
386
|
]);
|
|
362
387
|
_templateObject11 = function _templateObject() {
|
|
363
388
|
return data;
|
|
@@ -366,7 +391,7 @@ function _templateObject11() {
|
|
|
366
391
|
}
|
|
367
392
|
function _templateObject12() {
|
|
368
393
|
var data = _tagged_template_literal([
|
|
369
|
-
"\n
|
|
394
|
+
"\n display: flex;\n justify-content: space-evenly;\n align-items: flex-end;\n gap: 0.5rem;\n margin-top: 1rem;\n"
|
|
370
395
|
]);
|
|
371
396
|
_templateObject12 = function _templateObject() {
|
|
372
397
|
return data;
|
|
@@ -375,7 +400,8 @@ function _templateObject12() {
|
|
|
375
400
|
}
|
|
376
401
|
function _templateObject13() {
|
|
377
402
|
var data = _tagged_template_literal([
|
|
378
|
-
"\n
|
|
403
|
+
"\n display: flex;\n align-items: center;\n justify-content: center;\n height: 51px;\n width: 51px;\n border: 1px solid #3d414c;\n border-radius: 10px;\n background: ",
|
|
404
|
+
";\n"
|
|
379
405
|
]);
|
|
380
406
|
_templateObject13 = function _templateObject() {
|
|
381
407
|
return data;
|
|
@@ -384,7 +410,7 @@ function _templateObject13() {
|
|
|
384
410
|
}
|
|
385
411
|
function _templateObject14() {
|
|
386
412
|
var data = _tagged_template_literal([
|
|
387
|
-
"\n
|
|
413
|
+
"\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border-right: 1px solid #3d414c;\n border-radius: 16px;\n padding: 3rem 6rem;\n\n @media (max-width: 767px) {\n border: none;\n }\n"
|
|
388
414
|
]);
|
|
389
415
|
_templateObject14 = function _templateObject() {
|
|
390
416
|
return data;
|
|
@@ -393,7 +419,7 @@ function _templateObject14() {
|
|
|
393
419
|
}
|
|
394
420
|
function _templateObject15() {
|
|
395
421
|
var data = _tagged_template_literal([
|
|
396
|
-
"\n
|
|
422
|
+
"\n color: white;\n font-size: 2rem;\n white-space: nowrap;\n"
|
|
397
423
|
]);
|
|
398
424
|
_templateObject15 = function _templateObject() {
|
|
399
425
|
return data;
|
|
@@ -402,7 +428,7 @@ function _templateObject15() {
|
|
|
402
428
|
}
|
|
403
429
|
function _templateObject16() {
|
|
404
430
|
var data = _tagged_template_literal([
|
|
405
|
-
"\n
|
|
431
|
+
"\n color: white;\n font-size: 4rem;\n margin-top: 2rem;\n"
|
|
406
432
|
]);
|
|
407
433
|
_templateObject16 = function _templateObject() {
|
|
408
434
|
return data;
|
|
@@ -411,7 +437,7 @@ function _templateObject16() {
|
|
|
411
437
|
}
|
|
412
438
|
function _templateObject17() {
|
|
413
439
|
var data = _tagged_template_literal([
|
|
414
|
-
"\n
|
|
440
|
+
"\n * {\n margin: 0;\n padding: 0;\n }\n"
|
|
415
441
|
]);
|
|
416
442
|
_templateObject17 = function _templateObject() {
|
|
417
443
|
return data;
|
|
@@ -420,7 +446,7 @@ function _templateObject17() {
|
|
|
420
446
|
}
|
|
421
447
|
function _templateObject18() {
|
|
422
448
|
var data = _tagged_template_literal([
|
|
423
|
-
"\n
|
|
449
|
+
"\n display: flex;\n justify-content: center;\n background: radial-gradient(\n circle at 24.1% 68.8%,\n rgb(50, 50, 50) 0%,\n rgb(0, 0, 0) 99.4%\n );\n border-radius: 16px;\n font-weight: 700;\n @media (max-width: 767px) {\n display: block;\n }\n"
|
|
424
450
|
]);
|
|
425
451
|
_templateObject18 = function _templateObject() {
|
|
426
452
|
return data;
|
|
@@ -429,18 +455,52 @@ function _templateObject18() {
|
|
|
429
455
|
}
|
|
430
456
|
function _templateObject19() {
|
|
431
457
|
var data = _tagged_template_literal([
|
|
432
|
-
"\n
|
|
458
|
+
"\n display: flex;\n border-radius: 16px;\n border: 1px solid #3d414c;\n\n @media (max-width: 767px) {\n flex-direction: column-reverse;\n border: none;\n padding: 5rem 2rem;\n }\n"
|
|
433
459
|
]);
|
|
434
460
|
_templateObject19 = function _templateObject() {
|
|
435
461
|
return data;
|
|
436
462
|
};
|
|
437
463
|
return data;
|
|
438
464
|
}
|
|
439
|
-
|
|
465
|
+
function _templateObject20() {
|
|
466
|
+
var data = _tagged_template_literal([
|
|
467
|
+
"\n display: flex;\n flex-direction: column;\n color: white;\n padding: 2rem 5rem;\n @media (max-width: 767px) {\n padding: 0;\n }\n"
|
|
468
|
+
]);
|
|
469
|
+
_templateObject20 = function _templateObject() {
|
|
470
|
+
return data;
|
|
471
|
+
};
|
|
472
|
+
return data;
|
|
473
|
+
}
|
|
474
|
+
function _templateObject21() {
|
|
475
|
+
var data = _tagged_template_literal([
|
|
476
|
+
"\n margin-bottom: 2rem;\n"
|
|
477
|
+
]);
|
|
478
|
+
_templateObject21 = function _templateObject() {
|
|
479
|
+
return data;
|
|
480
|
+
};
|
|
481
|
+
return data;
|
|
482
|
+
}
|
|
483
|
+
function _templateObject22() {
|
|
484
|
+
var data = _tagged_template_literal([
|
|
485
|
+
"\n list-style: decimal;\n line-height: 2rem;\n padding-left: 1.5rem;\n font-weight: 500;\n"
|
|
486
|
+
]);
|
|
487
|
+
_templateObject22 = function _templateObject() {
|
|
488
|
+
return data;
|
|
489
|
+
};
|
|
490
|
+
return data;
|
|
491
|
+
}
|
|
492
|
+
import React13, { useMemo, useState } from "react";
|
|
493
|
+
import styled3 from "styled-components";
|
|
440
494
|
// src/components/button/Button.tsx
|
|
441
495
|
import React from "react";
|
|
442
496
|
import styled from "styled-components";
|
|
443
497
|
var StyledButton = styled.button(_templateObject(), function(props) {
|
|
498
|
+
if (!props.$disabled) {
|
|
499
|
+
return "\n cursor: pointer;\n &:active {\n transform: scale(0.98);\n }\n ";
|
|
500
|
+
} else {
|
|
501
|
+
return "cursor: default;";
|
|
502
|
+
}
|
|
503
|
+
}, function(props) {
|
|
444
504
|
if (props.$glow) {
|
|
445
505
|
return "\n &:hover {\n box-shadow: 0px 0px 42px rgba(255, 255, 255, 0.5);\n }\n ";
|
|
446
506
|
}
|
|
@@ -456,14 +516,16 @@ var StyledButton = styled.button(_templateObject(), function(props) {
|
|
|
456
516
|
}
|
|
457
517
|
});
|
|
458
518
|
var Button = function(param) {
|
|
459
|
-
var children = param.children, onClick = param.onClick, className = param.className, colorTheme = param.colorTheme, glow = param.glow;
|
|
519
|
+
var children = param.children, onClick = param.onClick, className = param.className, colorTheme = param.colorTheme, glow = param.glow, disabled = param.disabled;
|
|
460
520
|
return /* @__PURE__ */ React.createElement(StyledButton, {
|
|
461
521
|
type: "button",
|
|
462
522
|
role: "button",
|
|
463
523
|
className: className,
|
|
464
524
|
onClick: onClick,
|
|
525
|
+
disabled: disabled,
|
|
526
|
+
$disabled: disabled,
|
|
465
527
|
$colorTheme: colorTheme,
|
|
466
|
-
$glow: glow
|
|
528
|
+
$glow: glow && !disabled
|
|
467
529
|
}, children);
|
|
468
530
|
};
|
|
469
531
|
var Button_default = Button;
|
|
@@ -692,165 +754,182 @@ var SvgGooglePlayStore = function(props) {
|
|
|
692
754
|
}))));
|
|
693
755
|
};
|
|
694
756
|
var GooglePlayStore_default = SvgGooglePlayStore;
|
|
695
|
-
// src/icons/
|
|
757
|
+
// src/icons/LoadingIndicator.tsx
|
|
696
758
|
import * as React8 from "react";
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
759
|
+
import styled2, { keyframes } from "styled-components";
|
|
760
|
+
var rotate = keyframes(_templateObject1());
|
|
761
|
+
var LoadingIcon = styled2.svg(_templateObject2(), rotate);
|
|
762
|
+
var LoadingIndicator = function(props) {
|
|
763
|
+
return /* @__PURE__ */ React8.createElement(LoadingIcon, _object_spread({
|
|
764
|
+
width: "24",
|
|
765
|
+
height: "24",
|
|
766
|
+
viewBox: "0 0 24 24",
|
|
702
767
|
fill: "none",
|
|
703
|
-
|
|
768
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
704
769
|
}, props), /* @__PURE__ */ React8.createElement("path", {
|
|
705
|
-
|
|
706
|
-
|
|
770
|
+
d: "M20.6121 12C21.9447 12 23.0511 10.9073 22.7646 9.60581C22.374 7.83117 21.5521 6.16649 20.3561 4.76626C18.6336 2.74969 16.248 1.41398 13.6285 0.999404C11.009 0.584833 8.32754 1.11862 6.06649 2.50474C3.80545 3.89085 2.11325 6.03832 1.2943 8.56081C0.475348 11.0833 0.583411 13.8152 1.59905 16.2652C2.61468 18.7151 4.47122 20.7222 6.83469 21.9254C9.19815 23.1286 11.9134 23.4489 14.492 22.8287C16.2824 22.3981 17.9254 21.5336 19.284 20.3269C20.2803 19.4419 20.0267 17.9076 18.9482 17.1248C17.8697 16.342 16.3722 16.6368 15.2436 17.3454C14.6683 17.7066 14.0341 17.9753 13.3634 18.1366C11.9022 18.4881 10.3634 18.3065 9.02407 17.6247C7.6847 16.9428 6.63259 15.8054 6.05703 14.4171C5.48147 13.0287 5.42023 11.4805 5.88433 10.051C6.34843 8.62151 7.3074 7.40454 8.58874 6.61903C9.87007 5.83352 11.3897 5.53102 12.8741 5.76596C14.3586 6.00089 15.7105 6.75784 16.6867 7.90064C17.1347 8.42516 17.4901 9.01516 17.7435 9.64536C18.2406 10.8818 19.2794 12 20.6121 12Z",
|
|
771
|
+
fill: props.fill || "black"
|
|
707
772
|
}));
|
|
708
773
|
};
|
|
709
|
-
var
|
|
710
|
-
// src/icons/
|
|
774
|
+
var LoadingIndicator_default = LoadingIndicator;
|
|
775
|
+
// src/icons/QrCodeLoading.tsx
|
|
711
776
|
import * as React9 from "react";
|
|
712
|
-
var
|
|
777
|
+
var SvgQrCodeLoading = function(props) {
|
|
713
778
|
return /* @__PURE__ */ React9.createElement("svg", _object_spread({
|
|
714
779
|
xmlns: "http://www.w3.org/2000/svg",
|
|
715
780
|
width: "1em",
|
|
716
781
|
height: "1em",
|
|
717
782
|
fill: "none",
|
|
718
|
-
viewBox: "0 0
|
|
783
|
+
viewBox: "0 0 32 32"
|
|
719
784
|
}, props), /* @__PURE__ */ React9.createElement("path", {
|
|
720
|
-
fill: "#
|
|
721
|
-
d: "
|
|
785
|
+
fill: "#83A1F1",
|
|
786
|
+
d: "M29.334 16c1.472 0 2.689-1.202 2.444-2.654a16 16 0 1 0-6.498 15.688c1.2-.854 1.19-2.564.148-3.606-1.041-1.041-2.72-1.005-3.986-.254A10.668 10.668 0 0 1 6.145 11.918a10.667 10.667 0 0 1 20.19 1.443C26.7 14.788 27.862 16 29.335 16"
|
|
722
787
|
}));
|
|
723
788
|
};
|
|
724
|
-
var
|
|
725
|
-
// src/icons/
|
|
789
|
+
var QrCodeLoading_default = SvgQrCodeLoading;
|
|
790
|
+
// src/icons/QrCodeLogo.tsx
|
|
726
791
|
import * as React10 from "react";
|
|
792
|
+
// src/icons/SelfTextLogoBlack.tsx
|
|
793
|
+
import * as React11 from "react";
|
|
727
794
|
var SvgSelfTextLogoBlack = function(props) {
|
|
728
|
-
return /* @__PURE__ */
|
|
795
|
+
return /* @__PURE__ */ React11.createElement("svg", _object_spread({
|
|
729
796
|
xmlns: "http://www.w3.org/2000/svg",
|
|
730
797
|
width: "1em",
|
|
731
798
|
height: "1em",
|
|
732
799
|
fill: "none",
|
|
733
800
|
viewBox: "0 0 70 14"
|
|
734
|
-
}, props), /* @__PURE__ */
|
|
801
|
+
}, props), /* @__PURE__ */ React11.createElement("path", {
|
|
735
802
|
fill: "#000",
|
|
736
803
|
d: "M10.513 13.872H2.148a.595.595 0 0 1-.598-.593v-2.085c0-.327.268-.593.598-.593h8.265c.84 0 1.321-.455 1.321-1.03s-.48-1.05-1.32-1.05H5.511C2.47 8.52.75 6.678.75 4.3S2.77 0 5.512 0h8.705c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H5.672c-.96 0-1.36.555-1.36 1.03 0 .477.46.972 1.36.972h4.722c2.84 0 4.901 1.685 4.901 4.3 0 2.358-1.82 4.3-4.782 4.3M44.304 0h11.849c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592h-8.208a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.948c.33 0 .598.265.598.592V7.97a.595.595 0 0 1-.598.592h-7.948a.595.595 0 0 0-.598.593v4.127a.595.595 0 0 1-.598.592h-2.446a.595.595 0 0 1-.598-.593V.592c0-.326.268-.592.598-.592M30.379 0h2.445c.33 0 .599.265.599.592v9.418c0 .326.267.592.597.592h8.048c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H30.38a.595.595 0 0 1-.598-.592V.592c0-.327.267-.592.598-.592M16.713 0h11.429c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592h-7.827a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.107c.33 0 .598.265.598.592V7.97a.595.595 0 0 1-.598.592h-7.107a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.747c.33 0 .598.265.598.593v2.085a.595.595 0 0 1-.598.592H16.713a.595.595 0 0 1-.598-.592V.592c0-.327.268-.592.598-.592M64.155 5.393q-.036-.002-.038-.038V.038q.002-.036.038-.038h1.482c.018 0 .037.008.045.03l1.222 3.46c.011.03.041.03.053 0l1.23-3.46c.007-.022.026-.03.045-.03h1.481q.036.002.038.038v5.317q-.002.036-.038.038h-.955q-.035-.002-.037-.038V1.328c0-.034-.03-.042-.042-.008l-1.452 4.043c-.007.023-.026.03-.045.03h-.5c-.019 0-.038-.007-.045-.03L65.189 1.32c-.011-.034-.041-.026-.041.008v4.027q-.002.036-.038.038zM61.119 5.393q-.036-.002-.038-.038V.944c0-.023-.015-.038-.037-.038h-1.256Q59.752.904 59.75.87V.038q.002-.036.038-.038h3.61q.036.002.038.038v.83q-.002.036-.038.038h-1.249c-.022 0-.037.015-.037.038v4.411q-.002.036-.038.038z"
|
|
737
804
|
}));
|
|
738
805
|
};
|
|
739
806
|
var SelfTextLogoBlack_default = SvgSelfTextLogoBlack;
|
|
740
807
|
// src/icons/SelfTextLogoWhite.tsx
|
|
741
|
-
import * as
|
|
808
|
+
import * as React12 from "react";
|
|
742
809
|
var SvgSelfTextLogoWhite = function(props) {
|
|
743
|
-
return /* @__PURE__ */
|
|
810
|
+
return /* @__PURE__ */ React12.createElement("svg", _object_spread({
|
|
744
811
|
xmlns: "http://www.w3.org/2000/svg",
|
|
745
812
|
width: "1em",
|
|
746
813
|
height: "1em",
|
|
747
814
|
fill: "none",
|
|
748
815
|
viewBox: "0 0 70 14"
|
|
749
|
-
}, props), /* @__PURE__ */
|
|
816
|
+
}, props), /* @__PURE__ */ React12.createElement("path", {
|
|
750
817
|
fill: "#fff",
|
|
751
818
|
d: "M10.388 13.872H2.023a.595.595 0 0 1-.598-.593v-2.085c0-.327.268-.593.598-.593h8.265c.84 0 1.321-.455 1.321-1.03s-.48-1.05-1.32-1.05H5.386C2.345 8.52.625 6.678.625 4.3S2.645 0 5.387 0h8.705c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H5.547c-.96 0-1.36.555-1.36 1.03 0 .477.46.972 1.36.972h4.722c2.84 0 4.901 1.685 4.901 4.3 0 2.358-1.82 4.3-4.782 4.3M44.179 0h11.849c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H47.82a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.948c.33 0 .598.265.598.592V7.97a.595.595 0 0 1-.598.592H47.82a.595.595 0 0 0-.598.593v4.127a.595.595 0 0 1-.598.592h-2.446a.595.595 0 0 1-.598-.593V.592c0-.326.268-.592.598-.592M30.254 0h2.445c.33 0 .599.265.599.592v9.418c0 .326.267.592.597.592h8.048c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H30.254a.595.595 0 0 1-.598-.592V.592c0-.327.267-.592.598-.592M16.588 0h11.429c.33 0 .598.265.598.592v2.086a.595.595 0 0 1-.598.592H20.19a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.107c.33 0 .598.265.598.592V7.97a.595.595 0 0 1-.598.592H20.19a.595.595 0 0 0-.598.593v.857c0 .327.267.592.598.592h7.747c.33 0 .598.265.598.593v2.085a.595.595 0 0 1-.598.592H16.588a.595.595 0 0 1-.598-.592V.592c0-.327.268-.592.598-.592M64.03 5.393q-.036-.002-.038-.038V.038q.002-.036.038-.038h1.482c.018 0 .037.008.045.03l1.222 3.46c.011.03.041.03.053 0l1.23-3.46c.007-.022.026-.03.045-.03h1.481q.036.002.038.038v5.317q-.002.036-.038.038h-.955q-.035-.002-.037-.038V1.328c0-.034-.03-.042-.042-.008l-1.452 4.043c-.007.023-.026.03-.045.03h-.5c-.019 0-.038-.007-.045-.03L65.064 1.32c-.011-.034-.041-.026-.041.008v4.027q-.002.036-.038.038zM60.994 5.393q-.036-.002-.038-.038V.944c0-.023-.015-.038-.037-.038h-1.256q-.036-.002-.038-.037V.038q.002-.036.038-.038h3.61q.036.002.038.038v.83q-.002.036-.038.038h-1.249c-.022 0-.037.015-.037.038v4.411q-.002.036-.038.038z"
|
|
752
819
|
}));
|
|
753
820
|
};
|
|
754
821
|
var SelfTextLogoWhite_default = SvgSelfTextLogoWhite;
|
|
755
822
|
// src/components/button/SignInButton.tsx
|
|
756
|
-
|
|
757
|
-
var
|
|
758
|
-
var
|
|
823
|
+
var SignInMessage = styled3.span(_templateObject3());
|
|
824
|
+
var StyledButton2 = styled3(Button_default)(_templateObject4());
|
|
825
|
+
var SignInButton = function(_param) {
|
|
759
826
|
var type = _param.type, rest = _object_without_properties(_param, [
|
|
760
827
|
"type"
|
|
761
828
|
]);
|
|
762
|
-
var colorTheme = rest.colorTheme;
|
|
829
|
+
var colorTheme = rest.colorTheme, onClick = rest.onClick;
|
|
830
|
+
var _useState = _sliced_to_array(useState(false), 2), clicked = _useState[0], setClicked = _useState[1];
|
|
763
831
|
var darkModeEnabled = useMemo(function() {
|
|
764
832
|
return typeof window !== "undefined" && window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
765
833
|
}, []);
|
|
766
834
|
var showBlackIcons = colorTheme === "light" || colorTheme === "blue" || !colorTheme && !darkModeEnabled;
|
|
767
835
|
var label = type === "signIn" ? "Sign in with your" : "Connect your";
|
|
768
|
-
|
|
836
|
+
var handleClick = function() {
|
|
837
|
+
setClicked(true);
|
|
838
|
+
onClick();
|
|
839
|
+
};
|
|
840
|
+
return /* @__PURE__ */ React13.createElement(StyledButton2, _object_spread_props(_object_spread({}, rest), {
|
|
841
|
+
disabled: clicked,
|
|
842
|
+
onClick: handleClick
|
|
843
|
+
}), !clicked && /* @__PURE__ */ React13.createElement(React13.Fragment, null, showBlackIcons && /* @__PURE__ */ React13.createElement(CircleLogoBlack_default, {
|
|
769
844
|
width: "1.5rem",
|
|
770
845
|
height: "1.5rem"
|
|
771
|
-
}), !showBlackIcons && /* @__PURE__ */
|
|
846
|
+
}), !showBlackIcons && /* @__PURE__ */ React13.createElement(CircleLogoWhite_default, {
|
|
772
847
|
width: "2rem",
|
|
773
848
|
height: "2rem"
|
|
774
|
-
}), /* @__PURE__ */
|
|
849
|
+
}), /* @__PURE__ */ React13.createElement(SignInMessage, null, /* @__PURE__ */ React13.createElement("span", {
|
|
775
850
|
style: {
|
|
776
851
|
fontSize: "1rem"
|
|
777
852
|
}
|
|
778
|
-
}, label), showBlackIcons && /* @__PURE__ */
|
|
853
|
+
}, label), showBlackIcons && /* @__PURE__ */ React13.createElement(SelfTextLogoBlack_default, {
|
|
779
854
|
width: "4rem"
|
|
780
|
-
}), !showBlackIcons && /* @__PURE__ */
|
|
855
|
+
}), !showBlackIcons && /* @__PURE__ */ React13.createElement(SelfTextLogoWhite_default, {
|
|
781
856
|
width: "4rem"
|
|
782
|
-
})))
|
|
857
|
+
}))), clicked && /* @__PURE__ */ React13.createElement(LoadingIndicator_default, {
|
|
858
|
+
fill: showBlackIcons ? "black" : "white"
|
|
859
|
+
}));
|
|
783
860
|
};
|
|
784
|
-
var
|
|
861
|
+
var CysButton = function(_param) {
|
|
785
862
|
var props = _extends({}, _object_destructuring_empty(_param));
|
|
786
|
-
return /* @__PURE__ */
|
|
863
|
+
return /* @__PURE__ */ React13.createElement(SignInButton, _object_spread({
|
|
787
864
|
type: "connect"
|
|
788
865
|
}, props));
|
|
789
866
|
};
|
|
790
|
-
var
|
|
867
|
+
var SiwysButton = function(_param) {
|
|
791
868
|
var props = _extends({}, _object_destructuring_empty(_param));
|
|
792
|
-
return /* @__PURE__ */
|
|
869
|
+
return /* @__PURE__ */ React13.createElement(SignInButton, _object_spread({
|
|
793
870
|
type: "signIn"
|
|
794
871
|
}, props));
|
|
795
872
|
};
|
|
796
873
|
// src/components/signin/SignInWithYourSelf.tsx
|
|
797
|
-
import
|
|
798
|
-
import
|
|
874
|
+
import React18, { useEffect, useState as useState2 } from "react";
|
|
875
|
+
import styled7 from "styled-components";
|
|
799
876
|
// src/components/signin/Challenge.tsx
|
|
800
|
-
import
|
|
801
|
-
import {
|
|
802
|
-
|
|
803
|
-
import
|
|
877
|
+
import React15 from "react";
|
|
878
|
+
import styled4, { keyframes as keyframes2 } from "styled-components";
|
|
879
|
+
// src/components/signin/QrCode.tsx
|
|
880
|
+
import React14 from "react";
|
|
804
881
|
import { QRCodeSVG } from "qrcode.react";
|
|
805
|
-
var
|
|
806
|
-
var
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
882
|
+
var SelfSvg = '\n<svg width="104" height="32" viewBox="0 0 104 32" fill="none" xmlns="http://www.w3.org/2000/svg">\n<rect width="104" height="31.5" fill="white"/>\n<path d="M28.1416 25.0276H16.8487C16.4035 25.0276 16.0414 24.6699 16.0414 24.228V21.4124C16.0414 20.9714 16.4026 20.6127 16.8487 20.6127H28.0064C29.1408 20.6127 29.7893 19.9976 29.7893 19.2213C29.7893 18.4451 29.1408 17.8037 28.0064 17.8037H21.3891C17.2836 17.8037 14.9609 15.3159 14.9609 12.1052C14.9609 8.89444 17.6891 6.30078 21.3891 6.30078H33.1414C33.5867 6.30078 33.9487 6.65846 33.9487 7.10042V9.91599C33.9487 10.357 33.5876 10.7156 33.1414 10.7156H21.6056C20.3096 10.7156 19.7689 11.4647 19.7689 12.107C19.7689 12.7494 20.3899 13.4179 21.6056 13.4179H27.9799C31.8151 13.4179 34.5972 15.6923 34.5972 19.2232C34.5972 22.4068 32.1394 25.0285 28.1416 25.0285V25.0276Z" fill="black"/>\n<path d="M73.7575 6.30078H89.7533C90.1985 6.30078 90.5606 6.65846 90.5606 7.10042V9.91599C90.5606 10.357 90.1995 10.7156 89.7533 10.7156H78.6732C78.2279 10.7156 77.8658 11.0733 77.8658 11.5153V12.6726C77.8658 13.1136 78.227 13.4722 78.6732 13.4722H89.4026C89.8478 13.4722 90.2099 13.8299 90.2099 14.2718V17.0603C90.2099 17.5013 89.8488 17.8599 89.4026 17.8599H78.6732C78.2279 17.8599 77.8658 18.2176 77.8658 18.6595V24.2308C77.8658 24.6718 77.5047 25.0304 77.0585 25.0304H73.7565C73.3113 25.0304 72.9492 24.6727 72.9492 24.2308V7.10042C72.9492 6.6594 73.3103 6.30078 73.7565 6.30078H73.7575Z" fill="black"/>\n<path d="M54.9587 6.30078H58.2607C58.706 6.30078 59.068 6.65846 59.068 7.10042V19.814C59.068 20.2551 59.4291 20.6137 59.8753 20.6137H70.7399C71.1852 20.6137 71.5472 20.9714 71.5472 21.4133V24.2289C71.5472 24.6699 71.1861 25.0285 70.7399 25.0285H54.9597C54.5144 25.0285 54.1523 24.6708 54.1523 24.2289V7.10042C54.1514 6.65846 54.5125 6.30078 54.9587 6.30078Z" fill="black"/>\n<path d="M36.5104 6.30078H51.9391C52.3843 6.30078 52.7464 6.65846 52.7464 7.10042V9.91599C52.7464 10.357 52.3853 10.7156 51.9391 10.7156H41.3722C40.927 10.7156 40.5649 11.0733 40.5649 11.5153V12.6726C40.5649 13.1136 40.926 13.4722 41.3722 13.4722H50.9673C51.4125 13.4722 51.7746 13.8299 51.7746 14.2718V17.0603C51.7746 17.5013 51.4135 17.8599 50.9673 17.8599H41.3722C40.927 17.8599 40.5649 18.2176 40.5649 18.6595V19.8169C40.5649 20.2579 40.926 20.6165 41.3722 20.6165H51.8313C52.2765 20.6165 52.6386 20.9742 52.6386 21.4161V24.2317C52.6386 24.6727 52.2775 25.0313 51.8313 25.0313H36.5104C36.0652 25.0313 35.7031 24.6737 35.7031 24.2317V7.10042C35.7031 6.65846 36.0642 6.30078 36.5104 6.30078Z" fill="black"/>\n<path d="M94.8749 10.6208C93.6613 10.6208 92.7227 9.6821 92.7227 8.45819C92.7227 7.23946 93.6613 6.30078 94.8749 6.30078C96.104 6.30078 97.0427 7.23946 97.0427 8.45819C97.0427 9.6821 96.104 10.6208 94.8749 10.6208ZM94.8749 10.3044C95.9225 10.3044 96.7263 9.50059 96.7263 8.45819C96.7263 7.40542 95.9225 6.60157 94.8749 6.60157C93.8273 6.60157 93.0234 7.4106 93.0234 8.45819C93.0234 9.50059 93.8273 10.3044 94.8749 10.3044ZM94.097 9.63543C94.0658 9.63543 94.0451 9.61468 94.0451 9.58357V7.34318C94.0451 7.31207 94.0658 7.29132 94.097 7.29132H95.1238C95.518 7.29132 95.8136 7.59211 95.8136 7.99663C95.8136 8.25593 95.6891 8.45819 95.4868 8.57747C95.4609 8.59821 95.4557 8.61896 95.4661 8.65007L95.855 9.57319C95.8706 9.6095 95.8499 9.63543 95.8136 9.63543H95.4142C95.3883 9.63543 95.3676 9.62506 95.3572 9.59394L95.0097 8.71231C94.9993 8.68119 94.9786 8.67082 94.9527 8.67082H94.5637C94.5326 8.67082 94.5119 8.69156 94.5119 8.72268V9.58357C94.5119 9.61468 94.4911 9.63543 94.46 9.63543H94.097ZM95.0201 8.27668C95.2327 8.27668 95.3468 8.1574 95.3468 7.99663C95.3468 7.81512 95.2275 7.70102 95.0201 7.70102H94.5637C94.5326 7.70102 94.5119 7.72177 94.5119 7.75288V8.22481C94.5119 8.25593 94.5326 8.27668 94.5637 8.27668H95.0201Z" fill="black"/>\n</svg>\n\n';
|
|
883
|
+
var QRCode = function(props) {
|
|
884
|
+
return /* @__PURE__ */ React14.createElement(QRCodeSVG, {
|
|
885
|
+
value: props.challengeUrl,
|
|
886
|
+
size: props.size,
|
|
887
|
+
level: props.level || "M",
|
|
888
|
+
marginSize: 2,
|
|
889
|
+
imageSettings: {
|
|
890
|
+
src: "data:image/svg+xml,".concat(SelfSvg),
|
|
891
|
+
height: 32,
|
|
892
|
+
width: 104,
|
|
893
|
+
excavate: true
|
|
894
|
+
},
|
|
895
|
+
className: props.className,
|
|
896
|
+
style: {
|
|
897
|
+
borderRadius: "16px"
|
|
898
|
+
}
|
|
815
899
|
});
|
|
816
|
-
return div.innerHTML;
|
|
817
900
|
};
|
|
901
|
+
var QrCode_default = QRCode;
|
|
902
|
+
// src/components/signin/Challenge.tsx
|
|
903
|
+
var Wrapper = styled4.div(_templateObject5());
|
|
904
|
+
var Header = styled4.h1(_templateObject6());
|
|
905
|
+
var StyledButton3 = styled4(SiwysButton)(_templateObject7());
|
|
906
|
+
var rotate2 = keyframes2(_templateObject8());
|
|
907
|
+
var LoadingIcon2 = styled4.div(_templateObject9(), rotate2);
|
|
818
908
|
var Challenge = function(param) {
|
|
819
909
|
var challengeUrl = param.challengeUrl;
|
|
820
|
-
|
|
821
|
-
height: 20,
|
|
822
|
-
width: 82
|
|
823
|
-
})));
|
|
824
|
-
return /* @__PURE__ */ React13.createElement(Wrapper, null, /* @__PURE__ */ React13.createElement(CircleLogoWhite_default, {
|
|
910
|
+
return /* @__PURE__ */ React15.createElement(Wrapper, null, /* @__PURE__ */ React15.createElement(CircleLogoWhite_default, {
|
|
825
911
|
width: "4rem",
|
|
826
912
|
height: "4rem"
|
|
827
|
-
}), /* @__PURE__ */
|
|
913
|
+
}), /* @__PURE__ */ React15.createElement(Header, null, "Sign in with your", " ", /* @__PURE__ */ React15.createElement("span", {
|
|
828
914
|
style: {
|
|
829
915
|
color: "#D8EE4F"
|
|
830
916
|
}
|
|
831
|
-
}, "SELF", /* @__PURE__ */
|
|
917
|
+
}, "SELF", /* @__PURE__ */ React15.createElement("sup", {
|
|
832
918
|
style: {
|
|
833
919
|
fontSize: "1rem"
|
|
834
920
|
}
|
|
835
|
-
}, "\u2122"))), !challengeUrl && /* @__PURE__ */
|
|
921
|
+
}, "\u2122"))), !challengeUrl && /* @__PURE__ */ React15.createElement(LoadingIcon2, null, /* @__PURE__ */ React15.createElement(QrCodeLoading_default, {
|
|
836
922
|
width: "2rem",
|
|
837
923
|
height: "2rem"
|
|
838
|
-
})), challengeUrl && /* @__PURE__ */
|
|
839
|
-
value: challengeUrl,
|
|
840
|
-
size: 212,
|
|
841
|
-
level: "M",
|
|
924
|
+
})), challengeUrl && /* @__PURE__ */ React15.createElement("div", {
|
|
842
925
|
style: {
|
|
843
|
-
marginTop: "3rem"
|
|
844
|
-
borderRadius: "16px"
|
|
845
|
-
},
|
|
846
|
-
marginSize: 3,
|
|
847
|
-
imageSettings: {
|
|
848
|
-
src: qrCodeLogoDataUrl,
|
|
849
|
-
height: 24,
|
|
850
|
-
width: 104,
|
|
851
|
-
excavate: true
|
|
926
|
+
marginTop: "3rem"
|
|
852
927
|
}
|
|
853
|
-
}
|
|
928
|
+
}, /* @__PURE__ */ React15.createElement(QrCode_default, {
|
|
929
|
+
challengeUrl: challengeUrl,
|
|
930
|
+
size: 212,
|
|
931
|
+
level: "M"
|
|
932
|
+
})), /* @__PURE__ */ React15.createElement(StyledButton3, {
|
|
854
933
|
colorTheme: "blue",
|
|
855
934
|
onClick: function() {
|
|
856
935
|
return console.log("Open SELF App");
|
|
@@ -860,35 +939,35 @@ var Challenge = function(param) {
|
|
|
860
939
|
};
|
|
861
940
|
var Challenge_default = Challenge;
|
|
862
941
|
// src/components/signin/DownloadApp.tsx
|
|
863
|
-
import
|
|
864
|
-
import
|
|
865
|
-
var Wrapper2 =
|
|
866
|
-
var Header2 =
|
|
867
|
-
var Footer =
|
|
868
|
-
var Box =
|
|
942
|
+
import React16 from "react";
|
|
943
|
+
import styled5 from "styled-components";
|
|
944
|
+
var Wrapper2 = styled5.div(_templateObject10());
|
|
945
|
+
var Header2 = styled5.div(_templateObject11());
|
|
946
|
+
var Footer = styled5.div(_templateObject12());
|
|
947
|
+
var Box = styled5.div(_templateObject13(), function(props) {
|
|
869
948
|
return props.$background;
|
|
870
949
|
});
|
|
871
950
|
var DownloadApp = function(param) {
|
|
872
951
|
var ref = _object_destructuring_empty(param);
|
|
873
|
-
return /* @__PURE__ */
|
|
952
|
+
return /* @__PURE__ */ React16.createElement(Wrapper2, null, /* @__PURE__ */ React16.createElement(Header2, null, /* @__PURE__ */ React16.createElement("h3", null, "Get", " ", /* @__PURE__ */ React16.createElement("span", {
|
|
874
953
|
style: {
|
|
875
954
|
color: "#D8EE4F"
|
|
876
955
|
}
|
|
877
|
-
}, "SELF", /* @__PURE__ */
|
|
956
|
+
}, "SELF", /* @__PURE__ */ React16.createElement("sup", {
|
|
878
957
|
style: {
|
|
879
958
|
fontSize: "0.5rem"
|
|
880
959
|
}
|
|
881
|
-
}, "\u2122"))), /* @__PURE__ */
|
|
960
|
+
}, "\u2122"))), /* @__PURE__ */ React16.createElement("p", null, "Available to download now:")), /* @__PURE__ */ React16.createElement(Footer, null, /* @__PURE__ */ React16.createElement(Box, {
|
|
882
961
|
$background: "white"
|
|
883
|
-
}, /* @__PURE__ */
|
|
962
|
+
}, /* @__PURE__ */ React16.createElement(CheckerLogoBlack_default, {
|
|
884
963
|
width: "2rem",
|
|
885
964
|
height: "1rem"
|
|
886
|
-
})), /* @__PURE__ */
|
|
965
|
+
})), /* @__PURE__ */ React16.createElement(Box, {
|
|
887
966
|
$background: "black"
|
|
888
|
-
}, /* @__PURE__ */
|
|
967
|
+
}, /* @__PURE__ */ React16.createElement(CheckerLogoWhite_default, {
|
|
889
968
|
width: "2rem",
|
|
890
969
|
height: "1rem"
|
|
891
|
-
})), /* @__PURE__ */
|
|
970
|
+
})), /* @__PURE__ */ React16.createElement(AppleAppStore_default, {
|
|
892
971
|
width: "8rem",
|
|
893
972
|
height: "2.5rem",
|
|
894
973
|
onClick: function() {
|
|
@@ -897,7 +976,7 @@ var DownloadApp = function(param) {
|
|
|
897
976
|
style: {
|
|
898
977
|
cursor: "pointer"
|
|
899
978
|
}
|
|
900
|
-
}), /* @__PURE__ */
|
|
979
|
+
}), /* @__PURE__ */ React16.createElement(GooglePlayStore_default, {
|
|
901
980
|
width: "8rem",
|
|
902
981
|
height: "2.5rem",
|
|
903
982
|
onClick: function() {
|
|
@@ -912,50 +991,49 @@ var DownloadApp_default = DownloadApp;
|
|
|
912
991
|
// src/components/signin/SignInWithYourSelf.tsx
|
|
913
992
|
import { createGlobalStyle } from "styled-components";
|
|
914
993
|
// src/components/signin/Success.tsx
|
|
915
|
-
import
|
|
916
|
-
import
|
|
917
|
-
var Wrapper3 =
|
|
918
|
-
var Header3 =
|
|
919
|
-
var SuccessMessage =
|
|
994
|
+
import React17 from "react";
|
|
995
|
+
import styled6 from "styled-components";
|
|
996
|
+
var Wrapper3 = styled6.div(_templateObject14());
|
|
997
|
+
var Header3 = styled6.h1(_templateObject15());
|
|
998
|
+
var SuccessMessage = styled6.p(_templateObject16());
|
|
920
999
|
var Success = function() {
|
|
921
|
-
return /* @__PURE__ */
|
|
1000
|
+
return /* @__PURE__ */ React17.createElement(Wrapper3, null, /* @__PURE__ */ React17.createElement(CircleLogoWhite_default, {
|
|
922
1001
|
width: "4rem",
|
|
923
1002
|
height: "4rem"
|
|
924
|
-
}), /* @__PURE__ */
|
|
1003
|
+
}), /* @__PURE__ */ React17.createElement(Header3, null, "Sign in with your", " ", /* @__PURE__ */ React17.createElement("span", {
|
|
925
1004
|
style: {
|
|
926
1005
|
color: "#D8EE4F"
|
|
927
1006
|
}
|
|
928
|
-
}, "SELF", /* @__PURE__ */
|
|
1007
|
+
}, "SELF", /* @__PURE__ */ React17.createElement("sup", {
|
|
929
1008
|
style: {
|
|
930
1009
|
fontSize: "1rem"
|
|
931
1010
|
}
|
|
932
|
-
}, "\u2122"))), /* @__PURE__ */
|
|
1011
|
+
}, "\u2122"))), /* @__PURE__ */ React17.createElement(SuccessMessage, null, "Success"));
|
|
933
1012
|
};
|
|
934
1013
|
var Success_default = Success;
|
|
935
1014
|
// src/components/signin/SignInWithYourSelf.tsx
|
|
936
|
-
var GlobalStyle = createGlobalStyle(
|
|
937
|
-
var Wrapper4 =
|
|
938
|
-
var ModalWrapper =
|
|
939
|
-
var InstructionsWrapper =
|
|
940
|
-
var InstructionsSet =
|
|
941
|
-
var List =
|
|
1015
|
+
var GlobalStyle = createGlobalStyle(_templateObject17());
|
|
1016
|
+
var Wrapper4 = styled7.div(_templateObject18());
|
|
1017
|
+
var ModalWrapper = styled7.div(_templateObject19());
|
|
1018
|
+
var InstructionsWrapper = styled7.div(_templateObject20());
|
|
1019
|
+
var InstructionsSet = styled7.div(_templateObject21());
|
|
1020
|
+
var List = styled7.ol(_templateObject22());
|
|
942
1021
|
var SignInWithYourSelf = function(param) {
|
|
943
1022
|
var createChallengeUrl = param.createChallengeUrl, checkAuthUrl = param.checkAuthUrl;
|
|
944
1023
|
var _useState2 = _sliced_to_array(useState2(""), 2), challengeDid = _useState2[0], setChallengeDid = _useState2[1];
|
|
945
1024
|
var _useState21 = _sliced_to_array(useState2(""), 2), challengeUrl = _useState21[0], setChallengeUrl = _useState21[1];
|
|
946
1025
|
var _useState22 = _sliced_to_array(useState2(false), 2), isAuthenticated = _useState22[0], setIsAuthenticated = _useState22[1];
|
|
947
|
-
|
|
1026
|
+
useEffect(function() {
|
|
948
1027
|
fetch(createChallengeUrl, {
|
|
949
1028
|
method: "POST"
|
|
950
1029
|
}).then(function(resp) {
|
|
951
1030
|
return resp.json();
|
|
952
1031
|
}).then(function(json) {
|
|
953
|
-
console.debug("Create challenge response:", json);
|
|
954
1032
|
setChallengeDid(json.challenge);
|
|
955
1033
|
setChallengeUrl(json.challengeUrl);
|
|
956
1034
|
});
|
|
957
1035
|
}, []);
|
|
958
|
-
|
|
1036
|
+
useEffect(function() {
|
|
959
1037
|
if (!challengeDid || isAuthenticated) return;
|
|
960
1038
|
var interval = setInterval(/*#__PURE__*/ _async_to_generator(function() {
|
|
961
1039
|
return _ts_generator(this, function(_state) {
|
|
@@ -968,7 +1046,6 @@ var SignInWithYourSelf = function(param) {
|
|
|
968
1046
|
};
|
|
969
1047
|
}).then(function(json) {
|
|
970
1048
|
if (json.match) {
|
|
971
|
-
console.log("Check auth response:", json);
|
|
972
1049
|
setIsAuthenticated(json.match);
|
|
973
1050
|
}
|
|
974
1051
|
}).catch(function() {});
|
|
@@ -984,18 +1061,18 @@ var SignInWithYourSelf = function(param) {
|
|
|
984
1061
|
challengeDid,
|
|
985
1062
|
isAuthenticated
|
|
986
1063
|
]);
|
|
987
|
-
return /* @__PURE__ */
|
|
1064
|
+
return /* @__PURE__ */ React18.createElement(Wrapper4, null, /* @__PURE__ */ React18.createElement(GlobalStyle, null), /* @__PURE__ */ React18.createElement(ModalWrapper, null, isAuthenticated && /* @__PURE__ */ React18.createElement(Success_default, null), !isAuthenticated && /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(Challenge_default, {
|
|
988
1065
|
challengeUrl: challengeUrl
|
|
989
|
-
}), /* @__PURE__ */
|
|
1066
|
+
}), /* @__PURE__ */ React18.createElement(InstructionsWrapper, null, /* @__PURE__ */ React18.createElement("p", {
|
|
990
1067
|
style: {
|
|
991
1068
|
marginBottom: "2rem"
|
|
992
1069
|
}
|
|
993
|
-
}, /* @__PURE__ */
|
|
1070
|
+
}, /* @__PURE__ */ React18.createElement("b", null, "Instructions:")), /* @__PURE__ */ React18.createElement(InstructionsSet, null, "If you are signing in on a device that has the SELF app installed:", /* @__PURE__ */ React18.createElement(List, null, /* @__PURE__ */ React18.createElement("li", null, "Tap the SELF.id connect button."), /* @__PURE__ */ React18.createElement("li", null, "Approve the connection request within the SELF app."))), /* @__PURE__ */ React18.createElement(InstructionsSet, null, "If you are ", /* @__PURE__ */ React18.createElement("u", null, "not"), " signing in on a device that has the SELF app installed:", /* @__PURE__ */ React18.createElement(List, null, /* @__PURE__ */ React18.createElement("li", null, "Open the SELF app on the device with the app installed."), /* @__PURE__ */ React18.createElement("li", null, "Use the scanning feature in the SELF app to scan the QR code."), /* @__PURE__ */ React18.createElement("li", null, "Approve the connection request within the SELF app."))), /* @__PURE__ */ React18.createElement("p", {
|
|
994
1071
|
style: {
|
|
995
1072
|
marginTop: "3rem"
|
|
996
1073
|
}
|
|
997
|
-
}, "Don't have the ", /* @__PURE__ */
|
|
1074
|
+
}, "Don't have the ", /* @__PURE__ */ React18.createElement("i", null, "SELF"), " app?"), /* @__PURE__ */ React18.createElement(DownloadApp_default, null)))));
|
|
998
1075
|
};
|
|
999
1076
|
var SignInWithYourSelf_default = SignInWithYourSelf;
|
|
1000
|
-
export {
|
|
1077
|
+
export { CysButton, QrCode_default as QRCode, SignInWithYourSelf_default as SignInWithYourSelf, SiwysButton };
|
|
1001
1078
|
//# sourceMappingURL=index.mjs.map
|