@gataca/qr 3.0.11 → 4.0.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/{esm/qr-code-styling-0eeb38d5.js → cjs/gat-icon-check-c88a30ed.js} +15 -1
- package/dist/cjs/{gataca-qr_2.cjs.entry.js → gataca-qr_3.cjs.entry.js} +380 -45
- package/dist/cjs/gataca-qrws.cjs.entry.js +6 -7
- package/dist/cjs/gataca-ssibuttonws.cjs.entry.js +61 -0
- package/dist/cjs/gatacaqr.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/gataca-qr/components/qr/QR.js +2 -2
- package/dist/collection/components/gataca-qr/components/readQR/ReadQR.js +4 -2
- package/dist/collection/components/gataca-qr/gataca-qr.js +26 -7
- package/dist/collection/components/gataca-qrdisplay/gataca-qrdisplay.js +22 -0
- package/dist/collection/components/gataca-ssibutton/gataca-ssibutton.js +163 -3
- package/dist/components/{gat-icon-alert.js → gat-icon-check.js} +3 -3
- package/dist/components/gataca-qr2.js +40 -37
- package/dist/components/gataca-qrdisplay2.js +5 -0
- package/dist/components/gataca-qrws2.js +1 -1
- package/dist/components/gataca-ssibutton2.js +88 -4
- package/dist/components/index.js +1 -1
- package/dist/{cjs/qr-code-styling-412bbc7a.js → esm/gat-icon-check-c188cd29.js} +8 -2
- package/dist/esm/{gataca-qr_2.entry.js → gataca-qr_3.entry.js} +377 -43
- package/dist/esm/gataca-qrws.entry.js +1 -2
- package/dist/esm/gataca-ssibuttonws.entry.js +57 -0
- package/dist/esm/gatacaqr.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/gatacaqr/gatacaqr.esm.js +1 -1
- package/dist/gatacaqr/p-5be73956.js +1 -0
- package/dist/gatacaqr/p-948e7d94.entry.js +1 -0
- package/dist/gatacaqr/p-e94e9be8.entry.js +1 -0
- package/dist/gatacaqr/p-fb41fad9.entry.js +1 -0
- package/dist/types/components/gataca-qr/components/qr/QR.d.ts +3 -1
- package/dist/types/components/gataca-qr/components/readQR/ReadQR.d.ts +2 -0
- package/dist/types/components/gataca-qr/gataca-qr.d.ts +11 -2
- package/dist/types/components/gataca-qrdisplay/gataca-qrdisplay.d.ts +5 -0
- package/dist/types/components/gataca-ssibutton/gataca-ssibutton.d.ts +30 -1
- package/dist/types/components.d.ts +50 -0
- package/package.json +1 -1
- package/dist/cjs/gat-icon-alert-0ad19b26.js +0 -14
- package/dist/cjs/gataca-ssibutton_2.cjs.entry.js +0 -313
- package/dist/esm/gat-icon-alert-7b06ef3a.js +0 -9
- package/dist/esm/gataca-ssibutton_2.entry.js +0 -308
- package/dist/gatacaqr/p-0be4566d.js +0 -1
- package/dist/gatacaqr/p-2adc0bcc.entry.js +0 -1
- package/dist/gatacaqr/p-2ddbc2fc.entry.js +0 -1
- package/dist/gatacaqr/p-d2dd7c85.entry.js +0 -1
- package/dist/gatacaqr/p-ea783014.js +0 -1
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, c as createEvent } from './index-2be54f32.js';
|
|
2
|
-
import { l as logoGatacaSvg, g as
|
|
3
|
-
import { Q as QRCodeStyling } from './qr-code-styling-0eeb38d5.js';
|
|
2
|
+
import { Q as QRCodeStyling, l as logoGatacaSvg, g as gatIconRefreshSvg, a as gatIconAlertSvg, b as gatIconCheckSvg } from './gat-icon-check-c188cd29.js';
|
|
4
3
|
import { R as RESULT_STATUS, c as checkMobile, b as base64UrlEncode } from './utils-21ffcc1e.js';
|
|
5
4
|
|
|
6
5
|
const GatacaQRDisplay = class {
|
|
@@ -12,6 +11,7 @@ const GatacaQRDisplay = class {
|
|
|
12
11
|
this.logoSize = 0;
|
|
13
12
|
this.logoSrc = undefined;
|
|
14
13
|
this.qrColor = '#1E1E20';
|
|
14
|
+
this.bgColor = '#FFFFFF';
|
|
15
15
|
this.rounded = true;
|
|
16
16
|
}
|
|
17
17
|
componentDidLoad() {
|
|
@@ -35,6 +35,9 @@ const GatacaQRDisplay = class {
|
|
|
35
35
|
imageOptions: {
|
|
36
36
|
margin: 2,
|
|
37
37
|
imageSize: this.logoSize
|
|
38
|
+
},
|
|
39
|
+
backgroundOptions: {
|
|
40
|
+
color: this.bgColor
|
|
38
41
|
}
|
|
39
42
|
});
|
|
40
43
|
qrCode.append(this.qr);
|
|
@@ -46,34 +49,9 @@ const GatacaQRDisplay = class {
|
|
|
46
49
|
}
|
|
47
50
|
};
|
|
48
51
|
|
|
49
|
-
const
|
|
50
|
-
const {
|
|
51
|
-
return
|
|
52
|
-
height: modalHeight ? (modalHeight === null || modalHeight === void 0 ? void 0 : modalHeight.toString()) + 'px' : '300px'
|
|
53
|
-
} },
|
|
54
|
-
h("img", { src: gatIconCheckSvg, height: 52, width: 52 }),
|
|
55
|
-
h("p", { class: "successMsg" }, successLoginLabel)));
|
|
56
|
-
};
|
|
57
|
-
|
|
58
|
-
const RetryButton = (props) => {
|
|
59
|
-
var _a;
|
|
60
|
-
const { errorMessage, modalWidth, clickInsideBoxLabel, refreshQrLabel, scanQrLabel, waitingStartSessionLabel, display, renderRetryQR } = props;
|
|
61
|
-
return (h("div", { class: "reload", style: {
|
|
62
|
-
width: (modalWidth - 48).toString() + 'px',
|
|
63
|
-
height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : ''
|
|
64
|
-
} },
|
|
65
|
-
h("div", { id: "notify", onClick: () => display() },
|
|
66
|
-
h("img", { src: gatIconRefreshSvg, height: 24, width: 24 }),
|
|
67
|
-
h("p", { class: "notify-text" },
|
|
68
|
-
clickInsideBoxLabel,
|
|
69
|
-
" "),
|
|
70
|
-
errorMessage ? h("p", { class: "notify-text bold" }, refreshQrLabel) : h("p", { class: "notify-text bold" }, scanQrLabel),
|
|
71
|
-
errorMessage && (h("div", { class: "alert", style: {
|
|
72
|
-
width: (modalWidth - 48).toString() + 'px'
|
|
73
|
-
} },
|
|
74
|
-
h("img", { src: gatIconAlertSvg, height: 24, width: 24 }),
|
|
75
|
-
h("p", null, errorMessage)))),
|
|
76
|
-
h("div", { id: "qrwait" }, renderRetryQR(waitingStartSessionLabel))));
|
|
52
|
+
const QR = (props) => {
|
|
53
|
+
const { value, useLogo, logoSrc, size, qrType, style } = props;
|
|
54
|
+
return h("gataca-qrdisplay", { qrData: value, rounded: true, qrType: qrType, size: size, "logo-size": useLogo ? 0.33 : 0, "logo-src": logoSrc, qrColor: style === null || style === void 0 ? void 0 : style.color, bgColor: style === null || style === void 0 ? void 0 : style.bgColor });
|
|
77
55
|
};
|
|
78
56
|
|
|
79
57
|
const AnimatedLoader = () => {
|
|
@@ -91,10 +69,12 @@ const AnimatedLoader = () => {
|
|
|
91
69
|
|
|
92
70
|
const ReadQR = (props) => {
|
|
93
71
|
var _a;
|
|
94
|
-
const { modalWidth, readQrMessages, renderQR, url, sizeQR } = props;
|
|
72
|
+
const { modalWidth, readQrMessages, renderQR, url, sizeQR, style } = props;
|
|
95
73
|
return (h("div", { class: "blured", style: {
|
|
96
74
|
width: (modalWidth - 48).toString() + 'px',
|
|
97
|
-
height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : ''
|
|
75
|
+
height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
|
|
76
|
+
backgroundColor: style === null || style === void 0 ? void 0 : style.bgColor,
|
|
77
|
+
color: style === null || style === void 0 ? void 0 : style.color
|
|
98
78
|
} },
|
|
99
79
|
h("div", { id: "notify" },
|
|
100
80
|
h(AnimatedLoader, null),
|
|
@@ -105,19 +85,44 @@ const ReadQR = (props) => {
|
|
|
105
85
|
h("div", { id: "qrwait" }, renderQR(url, false, sizeQR))));
|
|
106
86
|
};
|
|
107
87
|
|
|
108
|
-
const
|
|
109
|
-
|
|
110
|
-
|
|
88
|
+
const RetryButton = (props) => {
|
|
89
|
+
var _a;
|
|
90
|
+
const { errorMessage, modalWidth, clickInsideBoxLabel, refreshQrLabel, scanQrLabel, waitingStartSessionLabel, display, renderRetryQR } = props;
|
|
91
|
+
return (h("div", { class: "reload", style: {
|
|
92
|
+
width: (modalWidth - 48).toString() + 'px',
|
|
93
|
+
height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : ''
|
|
94
|
+
} },
|
|
95
|
+
h("div", { id: "notify", onClick: () => display() },
|
|
96
|
+
h("img", { src: gatIconRefreshSvg, height: 24, width: 24 }),
|
|
97
|
+
h("p", { class: "notify-text" },
|
|
98
|
+
clickInsideBoxLabel,
|
|
99
|
+
" "),
|
|
100
|
+
errorMessage ? h("p", { class: "notify-text bold" }, refreshQrLabel) : h("p", { class: "notify-text bold" }, scanQrLabel),
|
|
101
|
+
errorMessage && (h("div", { class: "alert", style: {
|
|
102
|
+
width: (modalWidth - 48).toString() + 'px'
|
|
103
|
+
} },
|
|
104
|
+
h("img", { src: gatIconAlertSvg, height: 24, width: 24 }),
|
|
105
|
+
h("p", null, errorMessage)))),
|
|
106
|
+
h("div", { id: "qrwait" }, renderRetryQR(waitingStartSessionLabel))));
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
const Success = (props) => {
|
|
110
|
+
const { modalHeight, successLoginLabel } = props;
|
|
111
|
+
return (h("div", { class: 'success', style: {
|
|
112
|
+
height: modalHeight ? (modalHeight === null || modalHeight === void 0 ? void 0 : modalHeight.toString()) + 'px' : '300px'
|
|
113
|
+
} },
|
|
114
|
+
h("img", { src: gatIconCheckSvg, height: 52, width: 52 }),
|
|
115
|
+
h("p", { class: "successMsg" }, successLoginLabel)));
|
|
111
116
|
};
|
|
112
117
|
|
|
113
118
|
const gatacaQrCss = "@import url(\"https://fonts.googleapis.com/css2?family=Ubuntu:wght@100;300;400;500;600;700&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600;700&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400&display=swap\"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}.img-fluid{height:auto;max-width:50%}img{margin-left:auto;margin-right:auto}.brandSection{padding-top:5px;display:flex;align-items:center}.brandSection .gatacaImgSmall{height:13px;width:13px;margin:0;margin-right:10px}.popUpContainer .large-modal{width:300px;min-height:350px}.popUpContainer .modal-window{position:relative;border-radius:6px;overflow:hidden;color:rgba(24, 27, 94, 0.8);box-shadow:0px 3px 10px rgba(48, 48, 48, 0.1);display:flex;flex-direction:column;justify-content:space-between;align-items:center;display:flex;z-index:1001;padding:1px;background-color:white;border-radius:12px;-webkit-transition:opacity 0.5s, visibility 0s 0.5s;transition:opacity 0.5s, visibility 0s 0.5s;visibility:hidden;opacity:0}.popUpContainer .modal-window__content{width:100%;height:100%;text-align:left}.popUpContainer .modal-window__content .hidenText{display:none}.popUpContainer .modal-window .modalText{font-family:\"Ubuntu\", \"Work Sans\", \"Helvetica Neue\", sans-serif;font-size:20px;font-style:normal;font-weight:700;line-height:24px;margin-top:10px;letter-spacing:1px}.popUpContainer .modal-window .qrTitleContainer{padding:14px 24px;padding-bottom:0px}.popUpContainer .modal-window .qrTitle{font-size:20px;font-weight:600;line-height:23.5px}.popUpContainer .modal-window .qrDescription{font-family:\"Poppins\", \"Ubuntu\", \"Work Sans\", \"Helvetica Neue\", sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:16px;color:#707074}.popUpContainer .modal-window .bold{font-weight:700}.popUpContainer .modal-window .qrBrand{margin-top:4px;font-size:14px;font-weight:400;line-height:16.5px;display:flex;align-items:center}.popUpContainer .modal-window .qrBrand img{margin-left:5px;height:12px}.popUpContainer .modal-window .qr-section{width:252px;height:252px}.popUpContainer .noBoxShadow{box-shadow:none}.popUpContainer .is-visible{opacity:1;visibility:visible}.is-transparent{opacity:0}.success{display:flex;height:300px;flex-direction:column;justify-content:center;align-items:center;padding:0px}.success>img{padding-bottom:12px}.success>.successMsg{line-height:23.5px;color:var(--neutral-1000, #1e1e20);text-align:center;font-family:\"Ubuntu\", \"Work Sans\", \"Helvetica Neue\", sans-serif;font-size:20px;font-style:normal;font-weight:700;line-height:24px}.reload,.blured{height:252px;width:252px;border:1px dashed #a1a1a1;border-radius:12px;position:relative;top:24px;margin:0 24px 24px;display:flex;overflow:hidden;justify-content:center;align-items:center}#qrwait{display:flex;justify-content:center}#qrwait,#notify{width:100%;height:100%;top:0;left:0;border-radius:20px}#notify{z-index:10;position:absolute;justify-self:center;justify-items:center;justify-content:center;align-items:center;align-content:center;display:flex;flex-direction:column;box-sizing:border-box;padding:20px;background:rgba(255, 255, 255, 0.95)}#notify>img{padding-bottom:12px}.alert{display:flex;flex-direction:row;justify-content:start;width:252px;position:absolute;bottom:0px;border:1px solid #ee888c;background:#ffdedf;border-radius:11px;box-sizing:border-box;padding:12px;align-items:center;gap:12px}.alert>img{margin:0}.alert>p{font-family:\"Poppins\", \"Ubuntu\", \"Work Sans\", \"Helvetica Neue\", sans-serif;font-size:14px;font-style:normal;font-weight:400;margin-top:0;line-height:16px;color:#1e1e20}.notify-text{font-family:\"Poppins\", \"Ubuntu\", \"Work Sans\", \"Helvetica Neue\", sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:16px;color:#707074;text-align:center}.containerLoader{display:flex;justify-content:center;align-items:center;width:30px;height:30px;margin-bottom:12px}.loader{position:relative;margin-left:0 !important}.loader__item{position:absolute;width:9.68px;height:4px;background:transparent;border-radius:2px}.loader__item__1{transform:translate(2.5846212025px, 5.4246212025px) rotate(45deg);-webkit-animation:translate(2.5846212025px, 5.4246212025px) rotate(45deg);-moz-animation:translate(2.5846212025px, 5.4246212025px) rotate(45deg);-o-animation:translate(2.5846212025px, 5.4246212025px) rotate(45deg);animation:blink 0.8333333333s linear 0.1041666667s infinite;-webkit-animation:blink 0.8333333333s linear 0.1041666667s infinite;-moz-animation:blink 0.8333333333s linear 0.1041666667s infinite;-o-animation:blink 0.8333333333s linear 0.1041666667s infinite}.loader__item__2{transform:translate(-4.84px, 8.5px) rotate(90deg);-webkit-animation:translate(-4.84px, 8.5px) rotate(90deg);-moz-animation:translate(-4.84px, 8.5px) rotate(90deg);-o-animation:translate(-4.84px, 8.5px) rotate(90deg);animation:blink 0.8333333333s linear 0.2083333333s infinite;-webkit-animation:blink 0.8333333333s linear 0.2083333333s infinite;-moz-animation:blink 0.8333333333s linear 0.2083333333s infinite;-o-animation:blink 0.8333333333s linear 0.2083333333s infinite}.loader__item__3{transform:translate(-12.2646212025px, 5.4246212025px) rotate(135deg);-webkit-animation:translate(-12.2646212025px, 5.4246212025px) rotate(135deg);-moz-animation:translate(-12.2646212025px, 5.4246212025px) rotate(135deg);-o-animation:translate(-12.2646212025px, 5.4246212025px) rotate(135deg);animation:blink 0.8333333333s linear 0.3125s infinite;-webkit-animation:blink 0.8333333333s linear 0.3125s infinite;-moz-animation:blink 0.8333333333s linear 0.3125s infinite;-o-animation:blink 0.8333333333s linear 0.3125s infinite}.loader__item__4{transform:translate(-15.3399999992px, -1.9999999999px) rotate(180deg);-webkit-animation:translate(-15.3399999992px, -1.9999999999px) rotate(180deg);-moz-animation:translate(-15.3399999992px, -1.9999999999px) rotate(180deg);-o-animation:translate(-15.3399999992px, -1.9999999999px) rotate(180deg);animation:blink 0.8333333333s linear 0.4166666667s infinite;-webkit-animation:blink 0.8333333333s linear 0.4166666667s infinite;-moz-animation:blink 0.8333333333s linear 0.4166666667s infinite;-o-animation:blink 0.8333333333s linear 0.4166666667s infinite}.loader__item__5{transform:translate(-12.2646210959px, -9.4246211842px) rotate(225deg);-webkit-animation:translate(-12.2646210959px, -9.4246211842px) rotate(225deg);-moz-animation:translate(-12.2646210959px, -9.4246211842px) rotate(225deg);-o-animation:translate(-12.2646210959px, -9.4246211842px) rotate(225deg);animation:blink 0.8333333333s linear 0.5208333333s infinite;-webkit-animation:blink 0.8333333333s linear 0.5208333333s infinite;-moz-animation:blink 0.8333333333s linear 0.5208333333s infinite;-o-animation:blink 0.8333333333s linear 0.5208333333s infinite}.loader__item__6{transform:translate(-4.8399941857px, -12.499998805px) rotate(270deg);-webkit-animation:translate(-4.8399941857px, -12.499998805px) rotate(270deg);-moz-animation:translate(-4.8399941857px, -12.499998805px) rotate(270deg);-o-animation:translate(-4.8399941857px, -12.499998805px) rotate(270deg);animation:blink 0.8333333333s linear 0.625s infinite;-webkit-animation:blink 0.8333333333s linear 0.625s infinite;-moz-animation:blink 0.8333333333s linear 0.625s infinite;-o-animation:blink 0.8333333333s linear 0.625s infinite}.loader__item__7{transform:translate(2.5847915061px, -9.4245803212px) rotate(315deg);-webkit-animation:translate(2.5847915061px, -9.4245803212px) rotate(315deg);-moz-animation:translate(2.5847915061px, -9.4245803212px) rotate(315deg);-o-animation:translate(2.5847915061px, -9.4245803212px) rotate(315deg);animation:blink 0.8333333333s linear 0.7291666667s infinite;-webkit-animation:blink 0.8333333333s linear 0.7291666667s infinite;-moz-animation:blink 0.8333333333s linear 0.7291666667s infinite;-o-animation:blink 0.8333333333s linear 0.7291666667s infinite}.loader__item__8{transform:translate(5.6631628524px, -1.99913122px) rotate(360deg);-webkit-animation:translate(5.6631628524px, -1.99913122px) rotate(360deg);-moz-animation:translate(5.6631628524px, -1.99913122px) rotate(360deg);-o-animation:translate(5.6631628524px, -1.99913122px) rotate(360deg);animation:blink 0.8333333333s linear 0.8333333333s infinite;-webkit-animation:blink 0.8333333333s linear 0.8333333333s infinite;-moz-animation:blink 0.8333333333s linear 0.8333333333s infinite;-o-animation:blink 0.8333333333s linear 0.8333333333s infinite}.loader__item__8{max-width:8.5px}@keyframes blink{0%{background:#4745B7}100%{background:#CCCBF8}}@keyframes rotate{0%{transform:rotate(0deg)}100%{background:rotate(360deg)}}";
|
|
114
119
|
|
|
115
120
|
const DEEP_LINK_PREFIX = 'https://api.gataca.io/qr/redirect.html';
|
|
116
121
|
//Default values
|
|
117
|
-
const DEFAULT_SESSION_TIMEOUT = 300; //5mins as in connect
|
|
118
|
-
const DEFAULT_POLLING_FREQ = 3;
|
|
122
|
+
const DEFAULT_SESSION_TIMEOUT$1 = 300; //5mins as in connect
|
|
123
|
+
const DEFAULT_POLLING_FREQ$1 = 3;
|
|
119
124
|
const GatacaQR = class {
|
|
120
|
-
constructor(hostRef) { registerInstance(this, hostRef); this.gatacaLoginCompleted = createEvent(this, "gatacaLoginCompleted", 7); this.gatacaLoginFailed = createEvent(this, "gatacaLoginFailed", 7); this.checkStatus = undefined; this.createSession = undefined; this.successCallback = undefined; this.errorCallback = undefined; this.qrRole = undefined; this.qrType = 'svg'; this.callbackServer = undefined; this.autostart = true; this.autorefresh = false; this.v = '3'; this.qrModalTitle = 'Quick Access'; this.modalTitleColor = '#4745B7'; this.qrModalDescription = 'Sign up or sign in by scanning the QR Code with the Gataca Wallet'; this.hideModalTexts = false; this.hideModalBoxShadow = false; this.hideBrandTitle = false; this.logoSize = 0; this.logoSrc = logoGatacaSvg; this.qrSize = 300; this.modalWidth = 300; this.modalHeight = undefined; this.qrCodeExpiredLabel = 'QR Code expired'; this.credentialsNotValidatedLabel = 'User credentials not validated'; this.clickInsideBoxLabel = 'Click inside the box to'; this.refreshQrLabel = 'Refresh QR Code'; this.scanQrLabel = 'Scan QR Code'; this.userNotScanInTimeErrorLabel = 'User did not scan the QR in the allowed time'; this.credsNotValidatedErrorLabel = "Provided user credentials couldn't be validated"; this.failedLoginErrorLabel = 'No successful login'; this.successLoginLabel = 'Successful Connection!'; this.byBrandLabel = 'by Gataca'; this.waitingStartSessionLabel = 'waiting to start a session'; this.readQrTitle = 'Processing...'; this.readQrDescription = 'Please wait a moment'; this.hideQrModalDescription = false; this.sessionTimeout = DEFAULT_SESSION_TIMEOUT; this.pollingFrequency = DEFAULT_POLLING_FREQ; this.dynamicLink = true; this.sessionId = undefined; this.authenticationRequest = undefined; this.sessionData = undefined; this.result = RESULT_STATUS.NOT_STARTED; }
|
|
125
|
+
constructor(hostRef) { registerInstance(this, hostRef); this.gatacaLoginCompleted = createEvent(this, "gatacaLoginCompleted", 7); this.gatacaLoginFailed = createEvent(this, "gatacaLoginFailed", 7); this.checkStatus = undefined; this.createSession = undefined; this.successCallback = undefined; this.errorCallback = undefined; this.qrRole = undefined; this.qrType = 'svg'; this.callbackServer = undefined; this.autostart = true; this.autorefresh = false; this.v = '3'; this.qrModalTitle = 'Quick Access'; this.modalTitleColor = '#4745B7'; this.qrModalDescription = 'Sign up or sign in by scanning the QR Code with the Gataca Wallet'; this.hideModalTexts = false; this.hideModalBoxShadow = false; this.hideBrandTitle = false; this.logoSize = 0; this.logoSrc = logoGatacaSvg; this.qrSize = 300; this.modalWidth = 300; this.modalHeight = undefined; this.qrCodeExpiredLabel = 'QR Code expired'; this.credentialsNotValidatedLabel = 'User credentials not validated'; this.clickInsideBoxLabel = 'Click inside the box to'; this.refreshQrLabel = 'Refresh QR Code'; this.scanQrLabel = 'Scan QR Code'; this.userNotScanInTimeErrorLabel = 'User did not scan the QR in the allowed time'; this.credsNotValidatedErrorLabel = "Provided user credentials couldn't be validated"; this.failedLoginErrorLabel = 'No successful login'; this.successLoginLabel = 'Successful Connection!'; this.byBrandLabel = 'by Gataca'; this.waitingStartSessionLabel = 'waiting to start a session'; this.readQrTitle = 'Processing...'; this.readQrDescription = 'Please wait a moment'; this.hideQrModalDescription = false; this.sessionTimeout = DEFAULT_SESSION_TIMEOUT$1; this.pollingFrequency = DEFAULT_POLLING_FREQ$1; this.dynamicLink = true; this.qrStyle = undefined; this.sessionId = undefined; this.authenticationRequest = undefined; this.sessionData = undefined; this.result = RESULT_STATUS.NOT_STARTED; }
|
|
121
126
|
disconnectedCallback() {
|
|
122
127
|
this.stop();
|
|
123
128
|
}
|
|
@@ -194,8 +199,8 @@ const GatacaQR = class {
|
|
|
194
199
|
return DEEP_LINK_PREFIX + authRequestEncoded;
|
|
195
200
|
}
|
|
196
201
|
async poll() {
|
|
197
|
-
let endTime = new Date().getTime() + (this.sessionTimeout || DEFAULT_SESSION_TIMEOUT) * 1000;
|
|
198
|
-
let interval = (this.pollingFrequency || DEFAULT_POLLING_FREQ) * 1000;
|
|
202
|
+
let endTime = new Date().getTime() + (this.sessionTimeout || DEFAULT_SESSION_TIMEOUT$1) * 1000;
|
|
203
|
+
let interval = (this.pollingFrequency || DEFAULT_POLLING_FREQ$1) * 1000;
|
|
199
204
|
let checkFunc = async (component) => {
|
|
200
205
|
if (component.result === RESULT_STATUS.NOT_STARTED) {
|
|
201
206
|
return { result: RESULT_STATUS.NOT_STARTED };
|
|
@@ -257,10 +262,10 @@ const GatacaQR = class {
|
|
|
257
262
|
return h(ReadQR, { modalWidth: this === null || this === void 0 ? void 0 : this.modalWidth, readQrMessages: readQrMessages, url: this.getLink(), sizeQR: (this === null || this === void 0 ? void 0 : this.qrSize) ? (this === null || this === void 0 ? void 0 : this.qrSize) - 50 : undefined, renderQR: this.renderQR.bind(this) });
|
|
258
263
|
}
|
|
259
264
|
renderQR(value, useLogo, sizeQR) {
|
|
260
|
-
return h(QR, { value: value, qrType: this.qrType, useLogo: useLogo && this.logoSize !== 0, size: sizeQR || (this === null || this === void 0 ? void 0 : this.qrSize) || undefined, logoSrc: this === null || this === void 0 ? void 0 : this.logoSrc });
|
|
265
|
+
return h(QR, { value: value, qrType: this.qrType, useLogo: useLogo && this.logoSize !== 0, size: sizeQR || (this === null || this === void 0 ? void 0 : this.qrSize) || undefined, logoSrc: this === null || this === void 0 ? void 0 : this.logoSrc, style: this === null || this === void 0 ? void 0 : this.qrStyle });
|
|
261
266
|
}
|
|
262
267
|
renderRetryQR(value, useLogo) {
|
|
263
|
-
return h(QR, { value: value, useLogo: useLogo && this.logoSize !== 0, qrType: this.qrType, size: (this === null || this === void 0 ? void 0 : this.qrSize) ? (this === null || this === void 0 ? void 0 : this.qrSize) - 50 : undefined, logoSrc: this === null || this === void 0 ? void 0 : this.logoSrc });
|
|
268
|
+
return h(QR, { value: value, useLogo: useLogo && this.logoSize !== 0, qrType: this.qrType, size: (this === null || this === void 0 ? void 0 : this.qrSize) ? (this === null || this === void 0 ? void 0 : this.qrSize) - 50 : undefined, logoSrc: this === null || this === void 0 ? void 0 : this.logoSrc, style: this === null || this === void 0 ? void 0 : this.qrStyle });
|
|
264
269
|
}
|
|
265
270
|
render() {
|
|
266
271
|
var _a, _b;
|
|
@@ -277,4 +282,333 @@ const GatacaQR = class {
|
|
|
277
282
|
};
|
|
278
283
|
GatacaQR.style = gatacaQrCss;
|
|
279
284
|
|
|
280
|
-
|
|
285
|
+
const gatacaSsibuttonCss = "@import url(\"https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400&display=swap\"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}.img-fluid{height:auto;max-width:50%}img{margin-left:auto;margin-right:auto}.buttonContainer{display:inline-block;text-align:right;padding:10px;position:relative}.gatacaButtonWrapper{margin:8px}.gatacaButtonWrapper .gatacaButton{display:flex;min-width:100px;padding:8px 8px;background-color:white;font-size:12px;font-family:\"Work Sans\", sans-serif;letter-spacing:1px;font-weight:2;justify-content:space-between;align-items:center;border-radius:6px;border:1px solid rgba(24, 27, 94, 0.5);color:rgba(24, 27, 94, 0.8);box-shadow:0px 1px 3px rgba(48, 48, 48, 0.15);cursor:pointer}.gatacaButtonWrapper .gatacaButton>span{margin-right:10px}.gatacaButtonWrapper .gatacaButton:hover{box-shadow:0px 2px 8px rgba(48, 48, 48, 0.1)}.gatacaButtonWrapper .buttonText{text-align:right;font-size:8px;color:rgba(24, 27, 94, 0.5);font-family:\"Helvetica Neue\", sans-serif;letter-spacing:1px;padding-right:8px;font-weight:1}.gatacaButtonWrapper .buttonImg{height:25px;width:25px;margin:0;margin-right:20px}";
|
|
286
|
+
|
|
287
|
+
const PHONE_ICON = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAbCAYAAACN1PRVAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHvSURBVHgB3ZZPTttAFMbfe3YjL7qYLopcpZXSG7Q3CDfIsqrSJpyg5QQtJ2h7glgUdVs4AeEE5AYEQSDAgtnw357Hm0hAQDaeIRFCfFKyeKPxzzPzvc+DUKCZN80GEv1ABgWOQgSdGbOwv7u0nDueV4zjTzUIKhuAZna4vdQFR828azbI0K/TI/qodaLvjlP+tLDGDCs+IKv9Lbsi7kcv0w9541Q0EREPYcoieEQ9KiyECRXHzbpBUOcnYTfPFOOaaGVx9WsLiDrSIp0iU0wFNgIx/AQyc9I/OmOjy+Y8aBvHQcDUYebewc6/Xtk8J5htcg5efEPGhk0JtqkyBjo7DuZcnuO2sqCyKv8rUDmfTS9IBURqBAL+I6CkzBjOMOs22TLY21n8fl17KzXR3uDvb/CQk0GEdfvN07QvpnAOaGfYaRT25JzU6+rnG2tTpcWAy+Cp0m3U/URLms8HWfg/rn6RFaGSs9KQkZMpvGBWNs2Vandt46ac6YNBuc0fDLMaOU5DFybQ8039p/KJ4bq4rwPewtqoM/1gsCm/NfBXvWjgHhhuDAeLyd3qVSifHQULeZkou9EqemLhmUmav8qrZ4GEMGA7ivzjKvfeqGptFV2YdWPMPHHq0cCh3DdpVdLl/XCY9J1gVvbCiWa6N+JLocPFjCsx9cAAAAAASUVORK5CYII=';
|
|
288
|
+
//Default values
|
|
289
|
+
const DEFAULT_SESSION_TIMEOUT = 300; //5mins as in connect
|
|
290
|
+
const DEFAULT_POLLING_FREQ = 3;
|
|
291
|
+
const GatacaSSIButton = class {
|
|
292
|
+
constructor(hostRef) {
|
|
293
|
+
registerInstance(this, hostRef);
|
|
294
|
+
this.gatacaLoginCompleted = createEvent(this, "gatacaLoginCompleted", 7);
|
|
295
|
+
this.gatacaLoginFailed = createEvent(this, "gatacaLoginFailed", 7);
|
|
296
|
+
this.gatacaButtonPushed = createEvent(this, "gatacaButtonPushed", 7);
|
|
297
|
+
this.getRequestFromUri = async (authRequest) => {
|
|
298
|
+
const requrl = new URL(authRequest);
|
|
299
|
+
const requri = requrl.searchParams.get('request_uri');
|
|
300
|
+
if (requri) {
|
|
301
|
+
const response = await fetch(requri, {
|
|
302
|
+
method: 'GET',
|
|
303
|
+
headers: {
|
|
304
|
+
'Content-Type': 'application/json'
|
|
305
|
+
}
|
|
306
|
+
});
|
|
307
|
+
const jwt = await response.json();
|
|
308
|
+
const parts = jwt.split('.');
|
|
309
|
+
const base64 = parts[1].replace(/-/g, '+').replace(/_/g, '/');
|
|
310
|
+
const decoded = window.atob(base64);
|
|
311
|
+
let parsed = JSON.parse(decoded);
|
|
312
|
+
parsed.response_mode = 'dc_api';
|
|
313
|
+
return parsed;
|
|
314
|
+
}
|
|
315
|
+
};
|
|
316
|
+
this.buttonText = 'Easy login';
|
|
317
|
+
this.buttonDCAPIText = 'Login with Device Credentials';
|
|
318
|
+
this.qrType = 'svg';
|
|
319
|
+
this.autostart = true;
|
|
320
|
+
this.checkStatus = undefined;
|
|
321
|
+
this.createSession = undefined;
|
|
322
|
+
this.fillSession = undefined;
|
|
323
|
+
this.successCallback = undefined;
|
|
324
|
+
this.errorCallback = undefined;
|
|
325
|
+
this.handleCheckAppLoading = undefined;
|
|
326
|
+
this.checkAppTimeout = 6;
|
|
327
|
+
this.qrRole = undefined;
|
|
328
|
+
this.callbackServer = undefined;
|
|
329
|
+
this.sessionTimeout = undefined;
|
|
330
|
+
this.pollingFrequency = undefined;
|
|
331
|
+
this.autorefresh = false;
|
|
332
|
+
this.v = '3';
|
|
333
|
+
this.qrModalTitle = 'Quick Access';
|
|
334
|
+
this.modalTitleColor = '#4745B7';
|
|
335
|
+
this.qrModalDescription = 'Sign up or sign in by scanning the QR Code with the Gataca Wallet';
|
|
336
|
+
this.hideBrandTitle = false;
|
|
337
|
+
this.dynamicLink = true;
|
|
338
|
+
this.logoSize = 0;
|
|
339
|
+
this.logoSrc = undefined;
|
|
340
|
+
this.qrCodeExpiredLabel = 'QR Code expired';
|
|
341
|
+
this.credentialsNotValidatedLabel = 'User credentials not validated';
|
|
342
|
+
this.clickInsideBoxLabel = 'Click inside the box to';
|
|
343
|
+
this.refreshQrLabel = 'Refresh QR Code';
|
|
344
|
+
this.scanQrLabel = 'Scan QR Code';
|
|
345
|
+
this.userNotScanInTimeErrorLabel = 'User did not scan the QR in the allowed time';
|
|
346
|
+
this.credsNotValidatedErrorLabel = "Provided user credentials couldn't be validated";
|
|
347
|
+
this.failedLoginErrorLabel = 'No successful login';
|
|
348
|
+
this.successLoginLabel = 'Successful Connection!';
|
|
349
|
+
this.byBrandLabel = 'by Gataca';
|
|
350
|
+
this.waitingStartSessionLabel = 'waiting to start a session';
|
|
351
|
+
this.enableDcApi = false;
|
|
352
|
+
this.hideQrModalDescription = false;
|
|
353
|
+
this.qrStyle = undefined;
|
|
354
|
+
this.open = false;
|
|
355
|
+
this.sessionId = undefined;
|
|
356
|
+
this.authenticationRequest = undefined;
|
|
357
|
+
this.sessionData = undefined;
|
|
358
|
+
this.result = RESULT_STATUS.NOT_STARTED;
|
|
359
|
+
this.qr = (h("gataca-qr", { ref: (el) => (this.qrElement = el), checkStatus: this.checkStatus, createSession: this.createSession, successCallback: this.successCallback, errorCallback: this.errorCallback, qrRole: this.qrRole, qrType: this.qrType, callbackServer: this.callbackServer, sessionTimeout: this.sessionTimeout, pollingFrequency: this.pollingFrequency, autostart: this.autostart, autorefresh: this.autorefresh, v: this.v, qrModalTitle: this.qrModalTitle, qrModalDescription: this.qrModalDescription, hideBrandTitle: this.hideBrandTitle, dynamicLink: this.dynamicLink, logoSize: this.logoSize, logoSrc: this.logoSrc, modalTitleColor: this.modalTitleColor, qrCodeExpiredLabel: this.qrCodeExpiredLabel, credentialsNotValidatedLabel: this.credentialsNotValidatedLabel, clickInsideBoxLabel: this.clickInsideBoxLabel, refreshQrLabel: this.refreshQrLabel, scanQrLabel: this.scanQrLabel, userNotScanInTimeErrorLabel: this.userNotScanInTimeErrorLabel, credsNotValidatedErrorLabel: this.credsNotValidatedErrorLabel, failedLoginErrorLabel: this.failedLoginErrorLabel, successLoginLabel: this.successLoginLabel, byBrandLabel: this.byBrandLabel, waitingStartSessionLabel: this.waitingStartSessionLabel, hideQrModalDescription: this.hideQrModalDescription, qrStyle: this.qrStyle }));
|
|
360
|
+
}
|
|
361
|
+
supportsDCAPI() {
|
|
362
|
+
// let mobile = checkMobile();
|
|
363
|
+
// if (!mobile) return false;
|
|
364
|
+
if (!this.enableDcApi) {
|
|
365
|
+
return false;
|
|
366
|
+
}
|
|
367
|
+
//@ts-ignore
|
|
368
|
+
if (typeof window.DigitalCredential === 'undefined')
|
|
369
|
+
return false;
|
|
370
|
+
const protocols = ['org-iso-mdoc', 'openid4vp', 'openid4vci'];
|
|
371
|
+
//@ts-ignore
|
|
372
|
+
const supportedProtocols = protocols.filter(window.DigitalCredential.userAgentAllowsProtocol);
|
|
373
|
+
console.log(supportedProtocols, protocols);
|
|
374
|
+
return true;
|
|
375
|
+
}
|
|
376
|
+
/**
|
|
377
|
+
* Retrieve manually the session data on a successful login
|
|
378
|
+
*/
|
|
379
|
+
async getSessionData() {
|
|
380
|
+
return this.qr.getSessionData();
|
|
381
|
+
}
|
|
382
|
+
async getSessionId() {
|
|
383
|
+
if (this.sessionId) {
|
|
384
|
+
return this.sessionId;
|
|
385
|
+
}
|
|
386
|
+
let { sessionId, authenticationRequest } = await this.createSession();
|
|
387
|
+
this.sessionId = sessionId;
|
|
388
|
+
this.authenticationRequest = authenticationRequest;
|
|
389
|
+
return this.sessionId;
|
|
390
|
+
}
|
|
391
|
+
/**
|
|
392
|
+
* Force manually the start polling
|
|
393
|
+
*/
|
|
394
|
+
async startMobilePolling() {
|
|
395
|
+
await this.getSessionId();
|
|
396
|
+
this.result = RESULT_STATUS.ONGOING;
|
|
397
|
+
this.poll()
|
|
398
|
+
.then((data) => {
|
|
399
|
+
this.result = RESULT_STATUS.SUCCESS;
|
|
400
|
+
this.sessionData = data;
|
|
401
|
+
this.gatacaLoginCompleted.emit(data);
|
|
402
|
+
this.successCallback(data);
|
|
403
|
+
})
|
|
404
|
+
.catch((err) => {
|
|
405
|
+
this.clean();
|
|
406
|
+
let expired = err === RESULT_STATUS.EXPIRED;
|
|
407
|
+
if (expired && this.autorefresh) {
|
|
408
|
+
this.startMobilePolling();
|
|
409
|
+
}
|
|
410
|
+
else {
|
|
411
|
+
if (err !== RESULT_STATUS.NOT_STARTED) {
|
|
412
|
+
let error = expired ? new Error(this.userNotScanInTimeErrorLabel) : new Error(this.credsNotValidatedErrorLabel);
|
|
413
|
+
this.result = err;
|
|
414
|
+
this.gatacaLoginFailed.emit(error);
|
|
415
|
+
this.errorCallback(error);
|
|
416
|
+
}
|
|
417
|
+
}
|
|
418
|
+
});
|
|
419
|
+
}
|
|
420
|
+
/**
|
|
421
|
+
* Stop manually an ongoing session
|
|
422
|
+
*/
|
|
423
|
+
async stop() {
|
|
424
|
+
this.clean();
|
|
425
|
+
if (this.result === RESULT_STATUS.ONGOING || RESULT_STATUS.READ) {
|
|
426
|
+
this.result = RESULT_STATUS.NOT_STARTED;
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
clean() {
|
|
430
|
+
this.sessionData = undefined;
|
|
431
|
+
this.sessionId = undefined;
|
|
432
|
+
}
|
|
433
|
+
renderModal() {
|
|
434
|
+
return this.qr;
|
|
435
|
+
}
|
|
436
|
+
async poll() {
|
|
437
|
+
let endTime = new Date().getTime() + (this.sessionTimeout || DEFAULT_SESSION_TIMEOUT) * 1000;
|
|
438
|
+
let interval = (this.pollingFrequency || DEFAULT_POLLING_FREQ) * 1000;
|
|
439
|
+
let checkFunc = async (component) => {
|
|
440
|
+
if (component.result === RESULT_STATUS.NOT_STARTED) {
|
|
441
|
+
return { result: RESULT_STATUS.NOT_STARTED };
|
|
442
|
+
}
|
|
443
|
+
let id = await component.getSessionId();
|
|
444
|
+
return component.checkStatus(id);
|
|
445
|
+
};
|
|
446
|
+
let component = this;
|
|
447
|
+
let checkCondition = async function (resolve, reject) {
|
|
448
|
+
// If the condition is met, we're done!
|
|
449
|
+
let { result, data } = await checkFunc(component);
|
|
450
|
+
switch (result) {
|
|
451
|
+
case RESULT_STATUS.SUCCESS:
|
|
452
|
+
resolve(data);
|
|
453
|
+
break;
|
|
454
|
+
case RESULT_STATUS.READ:
|
|
455
|
+
component.result = RESULT_STATUS.READ;
|
|
456
|
+
case RESULT_STATUS.ONGOING:
|
|
457
|
+
if (component.sessionTimeout > 0 && new Date().getTime() < endTime) {
|
|
458
|
+
setTimeout(checkCondition, interval, resolve, reject);
|
|
459
|
+
}
|
|
460
|
+
else {
|
|
461
|
+
reject(RESULT_STATUS.EXPIRED);
|
|
462
|
+
}
|
|
463
|
+
break;
|
|
464
|
+
default:
|
|
465
|
+
reject(result);
|
|
466
|
+
break;
|
|
467
|
+
}
|
|
468
|
+
};
|
|
469
|
+
return new Promise(checkCondition);
|
|
470
|
+
}
|
|
471
|
+
isAppInstalled(appScheme, callback) {
|
|
472
|
+
let timeout;
|
|
473
|
+
let detected = false;
|
|
474
|
+
if (appScheme === null || appScheme === void 0 ? void 0 : appScheme.length) {
|
|
475
|
+
window.location.href = appScheme;
|
|
476
|
+
}
|
|
477
|
+
const waitTimeToCheckApp = this.checkAppTimeout * 1000;
|
|
478
|
+
timeout = setTimeout(() => {
|
|
479
|
+
if (!detected) {
|
|
480
|
+
callback(false);
|
|
481
|
+
}
|
|
482
|
+
cleanup();
|
|
483
|
+
}, waitTimeToCheckApp);
|
|
484
|
+
const handleVisibilityChange = () => {
|
|
485
|
+
if (document.hidden) {
|
|
486
|
+
detected = true;
|
|
487
|
+
callback(true);
|
|
488
|
+
if (!this.autostart) {
|
|
489
|
+
this.startMobilePolling();
|
|
490
|
+
}
|
|
491
|
+
cleanup();
|
|
492
|
+
}
|
|
493
|
+
};
|
|
494
|
+
document.addEventListener('visibilitychange', handleVisibilityChange);
|
|
495
|
+
function cleanup() {
|
|
496
|
+
clearTimeout(timeout);
|
|
497
|
+
document.removeEventListener('visibilitychange', handleVisibilityChange);
|
|
498
|
+
}
|
|
499
|
+
}
|
|
500
|
+
renderDesktopButton() {
|
|
501
|
+
return (h("div", { class: "gatacaButtonWrapper" }, h("button", { class: "gatacaButton", onClick: () => {
|
|
502
|
+
this.open = !this.open;
|
|
503
|
+
setTimeout(() => {
|
|
504
|
+
var _a, _b;
|
|
505
|
+
if (this.open) {
|
|
506
|
+
(_a = this.qrElement) === null || _a === void 0 ? void 0 : _a.display();
|
|
507
|
+
}
|
|
508
|
+
else {
|
|
509
|
+
(_b = this.qrElement) === null || _b === void 0 ? void 0 : _b.stop();
|
|
510
|
+
}
|
|
511
|
+
}, 0);
|
|
512
|
+
} }, h("img", { src: PHONE_ICON, class: "buttonImg", alt: this.buttonText }), h("span", null, this.buttonText))));
|
|
513
|
+
}
|
|
514
|
+
async getAuthRequest() {
|
|
515
|
+
let { authenticationRequest } = await this.createSession();
|
|
516
|
+
return authenticationRequest;
|
|
517
|
+
}
|
|
518
|
+
renderMobileButton(isAndroid, isIos) {
|
|
519
|
+
if (this.autostart && !this.supportsDCAPI()) {
|
|
520
|
+
this.startMobilePolling();
|
|
521
|
+
}
|
|
522
|
+
let loading = false;
|
|
523
|
+
const handleLoading = (isLoading) => {
|
|
524
|
+
loading = isLoading;
|
|
525
|
+
if (this.handleCheckAppLoading) {
|
|
526
|
+
this.handleCheckAppLoading(isLoading);
|
|
527
|
+
}
|
|
528
|
+
};
|
|
529
|
+
const executeRedirection = async () => {
|
|
530
|
+
handleLoading(true);
|
|
531
|
+
const androidStoreLink = 'https://play.google.com/store/apps/details?id=com.gataca.identity';
|
|
532
|
+
const iosStoreLink = 'https://apps.apple.com/us/app/gataca/id1498607616';
|
|
533
|
+
try {
|
|
534
|
+
const appScheme = await this.getAuthRequest();
|
|
535
|
+
this.isAppInstalled(appScheme, (installed) => {
|
|
536
|
+
if (!installed) {
|
|
537
|
+
this.stop();
|
|
538
|
+
if (isAndroid) {
|
|
539
|
+
window.location.href = androidStoreLink;
|
|
540
|
+
}
|
|
541
|
+
else if (isIos) {
|
|
542
|
+
window.location.href = iosStoreLink;
|
|
543
|
+
}
|
|
544
|
+
}
|
|
545
|
+
handleLoading(false);
|
|
546
|
+
});
|
|
547
|
+
}
|
|
548
|
+
catch (error) {
|
|
549
|
+
this.stop();
|
|
550
|
+
handleLoading(false);
|
|
551
|
+
}
|
|
552
|
+
};
|
|
553
|
+
return (h("div", { class: "gatacaButtonWrapper" }, h("button", { class: "gatacaButton", onClick: () => {
|
|
554
|
+
this.gatacaButtonPushed.emit();
|
|
555
|
+
executeRedirection();
|
|
556
|
+
}, disabled: loading }, h("img", { src: PHONE_ICON, class: "buttonImg", alt: this.buttonText }), h("span", null, this.buttonText))));
|
|
557
|
+
}
|
|
558
|
+
renderDCAPIButton(isAndroid, isIos) {
|
|
559
|
+
let loading = false;
|
|
560
|
+
console.log('Maybe act different', isAndroid, isIos);
|
|
561
|
+
const handleLoading = (isLoading) => {
|
|
562
|
+
loading = isLoading;
|
|
563
|
+
if (this.handleCheckAppLoading) {
|
|
564
|
+
this.handleCheckAppLoading(isLoading);
|
|
565
|
+
}
|
|
566
|
+
};
|
|
567
|
+
const executeDCAPICall = async () => {
|
|
568
|
+
handleLoading(true);
|
|
569
|
+
try {
|
|
570
|
+
const authRequest = await this.getAuthRequest();
|
|
571
|
+
let request = await this.getRequestFromUri(authRequest);
|
|
572
|
+
let credentialResponse = await navigator.credentials.get({
|
|
573
|
+
//@ts-ignore
|
|
574
|
+
digital: {
|
|
575
|
+
requests: [
|
|
576
|
+
{
|
|
577
|
+
protocol: 'openid4vp-v1-unsigned',
|
|
578
|
+
data: request
|
|
579
|
+
}
|
|
580
|
+
]
|
|
581
|
+
}
|
|
582
|
+
});
|
|
583
|
+
if (credentialResponse.constructor.name == 'DigitalCredential') {
|
|
584
|
+
console.log('Digital Credential - Response Data: ' + credentialResponse);
|
|
585
|
+
}
|
|
586
|
+
//@ts-ignore
|
|
587
|
+
await this.fillSession(request, credentialResponse === null || credentialResponse === void 0 ? void 0 : credentialResponse.data);
|
|
588
|
+
}
|
|
589
|
+
catch (error) {
|
|
590
|
+
this.stop();
|
|
591
|
+
handleLoading(false);
|
|
592
|
+
}
|
|
593
|
+
};
|
|
594
|
+
return (h("div", { class: "gatacaButtonWrapper" }, h("button", { class: "gatacaButton", onClick: () => {
|
|
595
|
+
this.gatacaButtonPushed.emit();
|
|
596
|
+
executeDCAPICall();
|
|
597
|
+
}, disabled: loading }, h("img", { src: PHONE_ICON, class: "buttonImg", alt: this.buttonDCAPIText }), h("span", null, this.buttonDCAPIText))));
|
|
598
|
+
}
|
|
599
|
+
render() {
|
|
600
|
+
const userAgent =
|
|
601
|
+
// @ts-ignore
|
|
602
|
+
(navigator === null || navigator === void 0 ? void 0 : navigator.userAgent) || (navigator === null || navigator === void 0 ? void 0 : navigator.vendor) || (window === null || window === void 0 ? void 0 : window.opera);
|
|
603
|
+
const isAndroid = /android/i.test(userAgent);
|
|
604
|
+
const isIos =
|
|
605
|
+
// @ts-ignore
|
|
606
|
+
(/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
|
|
607
|
+
const isMobile = isAndroid || isIos;
|
|
608
|
+
const displayDCApi = this.supportsDCAPI();
|
|
609
|
+
return (h("div", null, h("div", { class: "buttonContainer" }, isMobile && this.v === '3' ? this.renderMobileButton(isAndroid, isIos) : this.renderDesktopButton(), this.open && (!isMobile || this.v === '3') && this.renderModal()), displayDCApi /** && isMobile */ && h("div", { class: "buttonContainer" }, this.renderDCAPIButton(isAndroid, isIos))));
|
|
610
|
+
}
|
|
611
|
+
};
|
|
612
|
+
GatacaSSIButton.style = gatacaSsibuttonCss;
|
|
613
|
+
|
|
614
|
+
export { GatacaQR as gataca_qr, GatacaQRDisplay as gataca_qrdisplay, GatacaSSIButton as gataca_ssibutton };
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { h, r as registerInstance, c as createEvent } from './index-2be54f32.js';
|
|
2
|
-
import {
|
|
3
|
-
import './qr-code-styling-0eeb38d5.js';
|
|
2
|
+
import { b as gatIconCheckSvg, g as gatIconRefreshSvg, a as gatIconAlertSvg, l as logoGatacaSvg } from './gat-icon-check-c188cd29.js';
|
|
4
3
|
import { R as RESULT_STATUS, c as checkMobile, b as base64UrlEncode } from './utils-21ffcc1e.js';
|
|
5
4
|
|
|
6
5
|
const Success = (props) => {
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { r as registerInstance, c as createEvent, h } from './index-2be54f32.js';
|
|
2
|
+
|
|
3
|
+
const gatacaSsibuttonwsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400&display=swap\"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}.img-fluid{height:auto;max-width:50%}img{margin-left:auto;margin-right:auto}.buttonContainer{display:inline-block;text-align:right;padding:10px;position:relative}.gatacaButtonWrapper{margin:8px}.gatacaButtonWrapper .gatacaButton{display:flex;min-width:100px;padding:8px 8px;background-color:white;font-size:12px;font-family:\"Work Sans\", sans-serif;letter-spacing:1px;font-weight:2;justify-content:space-between;align-items:center;border-radius:6px;border:1px solid rgba(24, 27, 94, 0.5);color:rgba(24, 27, 94, 0.8);box-shadow:0px 1px 3px rgba(48, 48, 48, 0.15);cursor:pointer}.gatacaButtonWrapper .gatacaButton>span{margin-right:10px}.gatacaButtonWrapper .gatacaButton:hover{box-shadow:0px 2px 8px rgba(48, 48, 48, 0.1)}.gatacaButtonWrapper .buttonText{text-align:right;font-size:8px;color:rgba(24, 27, 94, 0.5);font-family:\"Helvetica Neue\", sans-serif;letter-spacing:1px;padding-right:8px;font-weight:1}.gatacaButtonWrapper .buttonImg{height:25px;width:25px;margin:0;margin-right:20px}";
|
|
4
|
+
|
|
5
|
+
const PHONE_ICON = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAbCAYAAACN1PRVAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAHvSURBVHgB3ZZPTttAFMbfe3YjL7qYLopcpZXSG7Q3CDfIsqrSJpyg5QQtJ2h7glgUdVs4AeEE5AYEQSDAgtnw357Hm0hAQDaeIRFCfFKyeKPxzzPzvc+DUKCZN80GEv1ABgWOQgSdGbOwv7u0nDueV4zjTzUIKhuAZna4vdQFR828azbI0K/TI/qodaLvjlP+tLDGDCs+IKv9Lbsi7kcv0w9541Q0EREPYcoieEQ9KiyECRXHzbpBUOcnYTfPFOOaaGVx9WsLiDrSIp0iU0wFNgIx/AQyc9I/OmOjy+Y8aBvHQcDUYebewc6/Xtk8J5htcg5efEPGhk0JtqkyBjo7DuZcnuO2sqCyKv8rUDmfTS9IBURqBAL+I6CkzBjOMOs22TLY21n8fl17KzXR3uDvb/CQk0GEdfvN07QvpnAOaGfYaRT25JzU6+rnG2tTpcWAy+Cp0m3U/URLms8HWfg/rn6RFaGSs9KQkZMpvGBWNs2Vandt46ac6YNBuc0fDLMaOU5DFybQ8039p/KJ4bq4rwPewtqoM/1gsCm/NfBXvWjgHhhuDAeLyd3qVSifHQULeZkou9EqemLhmUmav8qrZ4GEMGA7ivzjKvfeqGptFV2YdWPMPHHq0cCh3DdpVdLl/XCY9J1gVvbCiWa6N+JLocPFjCsx9cAAAAAASUVORK5CYII=';
|
|
6
|
+
const GatacaSSIButtonWS = class {
|
|
7
|
+
constructor(hostRef) {
|
|
8
|
+
registerInstance(this, hostRef);
|
|
9
|
+
this.gatacaLoginCompleted = createEvent(this, "gatacaLoginCompleted", 7);
|
|
10
|
+
this.gatacaLoginFailed = createEvent(this, "gatacaLoginFailed", 7);
|
|
11
|
+
this.buttonText = 'Easy login';
|
|
12
|
+
this.successCallback = undefined;
|
|
13
|
+
this.errorCallback = undefined;
|
|
14
|
+
this.qrType = 'svg';
|
|
15
|
+
this.qrRole = undefined;
|
|
16
|
+
this.callbackServer = undefined;
|
|
17
|
+
this.socketEndpoint = undefined;
|
|
18
|
+
this.sessionTimeout = undefined;
|
|
19
|
+
this.wsOnOpen = undefined;
|
|
20
|
+
this.wsOnMessage = undefined;
|
|
21
|
+
this.autostart = true;
|
|
22
|
+
this.autorefresh = false;
|
|
23
|
+
this.v = '3';
|
|
24
|
+
this.qrModalTitle = 'Quick Access';
|
|
25
|
+
this.qrModalDescription = 'Sign up or sign in by scanning the QR Code with the Gataca Wallet';
|
|
26
|
+
this.hideBrandTitle = false;
|
|
27
|
+
this.dynamicLink = true;
|
|
28
|
+
this.open = false;
|
|
29
|
+
this.qr = (h("gataca-qrws", { wsOnMessage: this.wsOnMessage, wsOnOpen: this.wsOnOpen, successCallback: this.successCallback, errorCallback: this.errorCallback, qrRole: this.qrRole, qrType: this.qrType, callbackServer: this.callbackServer, sessionTimeout: this.sessionTimeout, socketEndpoint: this.socketEndpoint, autostart: true, autorefresh: this.autorefresh, v: this.v, qrModalTitle: this.qrModalTitle, qrModalDescription: this.qrModalDescription, hideBrandTitle: this.hideBrandTitle, dynamicLink: this.dynamicLink }));
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* Retrieve manually the session data on a successful login
|
|
33
|
+
*/
|
|
34
|
+
async getSessionData() {
|
|
35
|
+
return this.qr.getSessionData();
|
|
36
|
+
}
|
|
37
|
+
renderModal() {
|
|
38
|
+
return this.qr;
|
|
39
|
+
}
|
|
40
|
+
renderButton() {
|
|
41
|
+
return (h("div", { class: "gatacaButtonWrapper" }, h("button", { class: "gatacaButton", onClick: () => {
|
|
42
|
+
this.open = !this.open;
|
|
43
|
+
if (this.open) {
|
|
44
|
+
this.qr.display();
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
this.qr.stop();
|
|
48
|
+
}
|
|
49
|
+
} }, h("img", { src: PHONE_ICON, class: "buttonImg", alt: this.buttonText }), h("span", null, this.buttonText))));
|
|
50
|
+
}
|
|
51
|
+
render() {
|
|
52
|
+
return (h("div", { class: "buttonContainer" }, this.renderButton(), this.open && this.renderModal()));
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
GatacaSSIButtonWS.style = gatacaSsibuttonwsCss;
|
|
56
|
+
|
|
57
|
+
export { GatacaSSIButtonWS as gataca_ssibuttonws };
|
package/dist/esm/gatacaqr.js
CHANGED
|
@@ -13,5 +13,5 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
return bootstrapLazy([["gataca-
|
|
16
|
+
return bootstrapLazy([["gataca-qr_3",[[1,"gataca-ssibutton",{"buttonText":[1,"button-text"],"buttonDCAPIText":[1,"button-d-c-a-p-i-text"],"qrType":[1,"qr-type"],"autostart":[4],"checkStatus":[16],"createSession":[16],"fillSession":[16],"successCallback":[16],"errorCallback":[16],"handleCheckAppLoading":[16],"checkAppTimeout":[2,"check-app-timeout"],"qrRole":[1,"qr-role"],"callbackServer":[1,"callback-server"],"sessionTimeout":[2,"session-timeout"],"pollingFrequency":[2,"polling-frequency"],"autorefresh":[4],"v":[1],"qrModalTitle":[1,"qr-modal-title"],"modalTitleColor":[1,"modal-title-color"],"qrModalDescription":[1,"qr-modal-description"],"hideBrandTitle":[4,"hide-brand-title"],"dynamicLink":[4,"dynamic-link"],"logoSize":[2,"logo-size"],"logoSrc":[1,"logo-src"],"qrCodeExpiredLabel":[1,"qr-code-expired-label"],"credentialsNotValidatedLabel":[1,"credentials-not-validated-label"],"clickInsideBoxLabel":[1,"click-inside-box-label"],"refreshQrLabel":[1,"refresh-qr-label"],"scanQrLabel":[1,"scan-qr-label"],"userNotScanInTimeErrorLabel":[1,"user-not-scan-in-time-error-label"],"credsNotValidatedErrorLabel":[1,"creds-not-validated-error-label"],"failedLoginErrorLabel":[1,"failed-login-error-label"],"successLoginLabel":[1,"success-login-label"],"byBrandLabel":[1,"by-brand-label"],"waitingStartSessionLabel":[1,"waiting-start-session-label"],"enableDcApi":[4,"enable-dc-api"],"hideQrModalDescription":[4,"hide-qr-modal-description"],"qrStyle":[16],"open":[32],"sessionId":[32],"authenticationRequest":[32],"sessionData":[32],"result":[32],"getSessionData":[64],"startMobilePolling":[64],"stop":[64]}],[1,"gataca-qr",{"checkStatus":[16],"createSession":[16],"successCallback":[16],"errorCallback":[16],"qrRole":[1,"qr-role"],"qrType":[1,"qr-type"],"callbackServer":[1,"callback-server"],"autostart":[4],"autorefresh":[4],"v":[1],"qrModalTitle":[1,"qr-modal-title"],"modalTitleColor":[1,"modal-title-color"],"qrModalDescription":[1,"qr-modal-description"],"hideModalTexts":[4,"hide-modal-texts"],"hideModalBoxShadow":[4,"hide-modal-box-shadow"],"hideBrandTitle":[4,"hide-brand-title"],"logoSize":[2,"logo-size"],"logoSrc":[1,"logo-src"],"qrSize":[2,"qr-size"],"modalWidth":[2,"modal-width"],"modalHeight":[2,"modal-height"],"qrCodeExpiredLabel":[1,"qr-code-expired-label"],"credentialsNotValidatedLabel":[1,"credentials-not-validated-label"],"clickInsideBoxLabel":[1,"click-inside-box-label"],"refreshQrLabel":[1,"refresh-qr-label"],"scanQrLabel":[1,"scan-qr-label"],"userNotScanInTimeErrorLabel":[1,"user-not-scan-in-time-error-label"],"credsNotValidatedErrorLabel":[1,"creds-not-validated-error-label"],"failedLoginErrorLabel":[1,"failed-login-error-label"],"successLoginLabel":[1,"success-login-label"],"byBrandLabel":[1,"by-brand-label"],"waitingStartSessionLabel":[1,"waiting-start-session-label"],"readQrTitle":[1,"read-qr-title"],"readQrDescription":[1,"read-qr-description"],"hideQrModalDescription":[4,"hide-qr-modal-description"],"sessionTimeout":[2,"session-timeout"],"pollingFrequency":[2,"polling-frequency"],"dynamicLink":[4,"dynamic-link"],"qrStyle":[16],"sessionId":[32],"authenticationRequest":[32],"sessionData":[32],"result":[32],"display":[64],"stop":[64],"getSessionData":[64]}],[0,"gataca-qrdisplay",{"qrData":[1,"qr-data"],"qrType":[1,"qr-type"],"size":[2],"logoSize":[2,"logo-size"],"logoSrc":[1,"logo-src"],"qrColor":[1,"qr-color"],"bgColor":[1,"bg-color"],"rounded":[4]}]]],["gataca-qrws",[[1,"gataca-qrws",{"successCallback":[16],"errorCallback":[16],"qrRole":[1,"qr-role"],"qrType":[1,"qr-type"],"callbackServer":[1,"callback-server"],"socketEndpoint":[1,"socket-endpoint"],"sessionTimeout":[2,"session-timeout"],"wsOnOpen":[16],"wsOnMessage":[16],"autostart":[4],"autorefresh":[4],"v":[1],"qrModalTitle":[1,"qr-modal-title"],"modalTitleColor":[1,"modal-title-color"],"qrModalDescription":[1,"qr-modal-description"],"hideModalTexts":[4,"hide-modal-texts"],"hideModalBoxShadow":[4,"hide-modal-box-shadow"],"hideBrandTitle":[4,"hide-brand-title"],"logoSize":[2,"logo-size"],"logoSrc":[1,"logo-src"],"qrSize":[2,"qr-size"],"modalWidth":[2,"modal-width"],"modalHeight":[2,"modal-height"],"qrCodeExpiredLabel":[1,"qr-code-expired-label"],"credentialsNotValidatedLabel":[1,"credentials-not-validated-label"],"clickInsideBoxLabel":[1,"click-inside-box-label"],"refreshQrLabel":[1,"refresh-qr-label"],"scanQrLabel":[1,"scan-qr-label"],"userNotScanInTimeErrorLabel":[1,"user-not-scan-in-time-error-label"],"credsNotValidatedErrorLabel":[1,"creds-not-validated-error-label"],"failedLoginErrorLabel":[1,"failed-login-error-label"],"successLoginLabel":[1,"success-login-label"],"byBrandLabel":[1,"by-brand-label"],"waitingStartSessionLabel":[1,"waiting-start-session-label"],"readQrTitle":[1,"read-qr-title"],"readQrDescription":[1,"read-qr-description"],"hideQrModalDescription":[4,"hide-qr-modal-description"],"dynamicLink":[4,"dynamic-link"],"sessionId":[32],"authenticationRequest":[32],"sessionData":[32],"result":[32],"display":[64],"stop":[64],"getSessionData":[64]},[[2,"sessionMsg","sessionMsgReceived"]]]]],["gataca-ssibuttonws",[[1,"gataca-ssibuttonws",{"buttonText":[1,"button-text"],"successCallback":[16],"errorCallback":[16],"qrType":[1,"qr-type"],"qrRole":[1,"qr-role"],"callbackServer":[1,"callback-server"],"socketEndpoint":[1,"socket-endpoint"],"sessionTimeout":[2,"session-timeout"],"wsOnOpen":[16],"wsOnMessage":[16],"autostart":[4],"autorefresh":[4],"v":[1],"qrModalTitle":[1,"qr-modal-title"],"qrModalDescription":[1,"qr-modal-description"],"hideBrandTitle":[4,"hide-brand-title"],"dynamicLink":[4,"dynamic-link"],"open":[32],"getSessionData":[64]}]]],["gataca-autoqr",[[1,"gataca-autoqr",{"configId":[1,"config-id"],"qrType":[1,"qr-type"],"configRepository":[1,"config-repository"],"successCallback":[16],"errorCallback":[16],"checkStatus":[16],"createSession":[16],"wsOnOpen":[16],"wsOnMessage":[16],"config":[32],"loading":[32],"getSessionData":[64]}]]]], options);
|
|
17
17
|
});
|