@gataca/qr 4.0.1 → 4.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/cjs/{gat-icon-check-c88a30ed.js → gat-icon-check-6b6780eb.js} +0 -3
  2. package/dist/cjs/gataca-autoqr.cjs.entry.js +1 -1
  3. package/dist/cjs/gataca-qr_3.cjs.entry.js +42 -33
  4. package/dist/cjs/gataca-qrws.cjs.entry.js +5 -3
  5. package/dist/cjs/gataca-ssibuttonws.cjs.entry.js +1 -1
  6. package/dist/cjs/gatacaqr.cjs.js +1 -1
  7. package/dist/cjs/{index-93d47a75.js → index-1332a8ce.js} +32 -1
  8. package/dist/cjs/loader.cjs.js +1 -1
  9. package/dist/collection/assets/icons/RefreshIcon.js +6 -0
  10. package/dist/collection/components/gataca-qr/components/readQR/ReadQR.js +4 -8
  11. package/dist/collection/components/gataca-qr/components/readQR/components/AnimatedLoader.js +4 -2
  12. package/dist/collection/components/gataca-qr/components/retryButton/RetryButton.js +6 -4
  13. package/dist/collection/components/gataca-qr/components/success/Success.js +3 -2
  14. package/dist/collection/components/gataca-qr/gataca-qr.css +14 -4
  15. package/dist/collection/components/gataca-qr/gataca-qr.js +8 -8
  16. package/dist/collection/components/gataca-ssibutton/gataca-ssibutton.js +1 -1
  17. package/dist/components/gat-icon-check.js +1 -3
  18. package/dist/components/gataca-qr2.js +41 -32
  19. package/dist/components/gataca-qrws2.js +3 -1
  20. package/dist/esm/{gat-icon-check-c188cd29.js → gat-icon-check-7320c81b.js} +1 -3
  21. package/dist/esm/gataca-autoqr.entry.js +1 -1
  22. package/dist/esm/gataca-qr_3.entry.js +42 -33
  23. package/dist/esm/gataca-qrws.entry.js +4 -2
  24. package/dist/esm/gataca-ssibuttonws.entry.js +1 -1
  25. package/dist/esm/gatacaqr.js +1 -1
  26. package/dist/esm/{index-2be54f32.js → index-055790a7.js} +32 -1
  27. package/dist/esm/loader.js +1 -1
  28. package/dist/gatacaqr/gatacaqr.esm.js +1 -1
  29. package/dist/gatacaqr/{p-5be73956.js → p-29119208.js} +1 -1
  30. package/dist/gatacaqr/{p-e94e9be8.entry.js → p-49cf321c.entry.js} +1 -1
  31. package/dist/gatacaqr/{p-948e7d94.entry.js → p-9f83bae1.entry.js} +1 -1
  32. package/dist/gatacaqr/{p-5e81ab9e.entry.js → p-c65f810b.entry.js} +1 -1
  33. package/dist/gatacaqr/p-f185cc34.entry.js +1 -0
  34. package/dist/gatacaqr/p-fccf9d4d.js +2 -0
  35. package/dist/types/assets/icons/RefreshIcon.d.ts +8 -0
  36. package/dist/types/components/gataca-qr/components/readQR/components/AnimatedLoader.d.ts +5 -1
  37. package/dist/types/components/gataca-qr/components/success/Success.d.ts +2 -0
  38. package/dist/types/components/gataca-qr/gataca-qr.d.ts +3 -1
  39. package/package.json +1 -1
  40. package/dist/gatacaqr/p-5ae5f952.js +0 -2
  41. package/dist/gatacaqr/p-831794a4.entry.js +0 -1
package/dist/cjs/{gat-icon-check-c88a30ed.js → gat-icon-check-6b6780eb.js} RENAMED
@@ -27,8 +27,6 @@ var qrCodeStyling = createCommonjsModule(function (module, exports) {
27
27
 
28
28
  const QRCodeStyling = /*@__PURE__*/getDefaultExportFromCjs(qrCodeStyling);
29
29
 
30
- const gatIconRefreshSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIzIDRWMTBIMTciIHN0cm9rZT0iIzhCOEI4QiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIwLjQ4OTkgMTVDMTkuODM5OSAxNi44Mzk5IDE4LjYwOTQgMTguNDE4NyAxNi45ODQgMTkuNDk4NUMxNS4zNTg2IDIwLjU3ODMgMTMuNDI2MyAyMS4xMDA2IDExLjQ3ODMgMjAuOTg2NkM5LjUzMDI2IDIwLjg3MjYgNy42NzIwMyAyMC4xMjg2IDYuMTgzNjMgMTguODY2N0M0LjY5NTI0IDE3LjYwNDcgMy42NTczIDE1Ljg5MzIgMy4yMjYyNSAxMy45OTAxQzIuNzk1MTkgMTIuMDg2OSAyLjk5NDM2IDEwLjA5NTIgMy43OTM3NCA4LjMxNTA4QzQuNTkzMTMgNi41MzQ5NiA1Ljk0OTQyIDUuMDYyODggNy42NTgyMyA0LjEyMDY1QzkuMzY3MDUgMy4xNzg0MyAxMS4zMzU4IDIuODE3MTEgMTMuMjY3OCAzLjA5MTE2QzE1LjE5OTkgMy4zNjUyIDE2Ljk5MDUgNC4yNTk3NSAxOC4zNjk5IDUuNjQwMDFMMjIuOTk5OSAxMCIgc3Ryb2tlPSIjOEI4QjhCIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
31
-
32
30
  const gatIconAlertSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjI5MDggMy44NjAyTDEuODIwNzUgMTguMDAwMkMxLjY0NjEyIDE4LjMwMjYgMS41NTM3MiAxOC42NDU1IDEuNTUyNzQgMTguOTk0N0MxLjU1MTc2IDE5LjM0MzkgMS42NDIyNCAxOS42ODczIDEuODE1MTggMTkuOTkwN0MxLjk4ODEyIDIwLjI5NDEgMi4yMzc0OCAyMC41NDcgMi41Mzg0NiAyMC43MjQxQzIuODM5NDQgMjAuOTAxMiAzLjE4MTU1IDIwLjk5NjQgMy41MzA3NSAyMS4wMDAySDIwLjQ3MDhDMjAuODIgMjAuOTk2NCAyMS4xNjIxIDIwLjkwMTIgMjEuNDYzIDIwLjcyNDFDMjEuNzY0IDIwLjU0NyAyMi4wMTM0IDIwLjI5NDEgMjIuMTg2MyAxOS45OTA3QzIyLjM1OTMgMTkuNjg3MyAyMi40NDk3IDE5LjM0MzkgMjIuNDQ4OCAxOC45OTQ3QzIyLjQ0NzggMTguNjQ1NSAyMi4zNTU0IDE4LjMwMjYgMjIuMTgwOCAxOC4wMDAyTDEzLjcxMDggMy44NjAyQzEzLjUzMjUgMy41NjYzMSAxMy4yODE1IDMuMzIzMzIgMTIuOTgxOSAzLjE1NDY5QzEyLjY4MjQgMi45ODYwNSAxMi4zNDQ1IDIuODk3NDYgMTIuMDAwOCAyLjg5NzQ2QzExLjY1NyAyLjg5NzQ2IDExLjMxOTEgMi45ODYwNSAxMS4wMTk2IDMuMTU0NjlDMTAuNzIgMy4zMjMzMiAxMC40NjkgMy41NjYzMSAxMC4yOTA4IDMuODYwMlYzLjg2MDJaIiBzdHJva2U9IiNDRDJCMzEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMiA5VjEzIiBzdHJva2U9IiNDRDJCMzEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMiAxN0gxMi4wMSIgc3Ryb2tlPSIjQ0QyQjMxIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
33
31
 
34
32
  const gatIconCheckSvg = 'data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjUyIiBoZWlnaHQ9IjUzIiB2aWV3Qm94PSIwIDAgNTIgNTMiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxjaXJjbGUgY3g9IjI2IiBjeT0iMjYuNjcxOSIgcj0iMjYiIGZpbGw9IiMzRDlBNTAiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zOC41MiAxNy43NDk1QzM5LjU4MDUgMTguODA5OSAzOS41ODA1IDIwLjUyOTMgMzguNTIgMjEuNTg5OEwyMy41ODQ2IDM2LjUyNTFDMjIuNTI0MiAzNy41ODU2IDIwLjgwNDggMzcuNTg1NiAxOS43NDQzIDM2LjUyNTFMMTIuOTU1NSAyOS43MzYzQzExLjg5NSAyOC42NzU5IDExLjg5NSAyNi45NTY1IDEyLjk1NTUgMjUuODk2QzE0LjAxNiAyNC44MzU1IDE1LjczNTQgMjQuODM1NSAxNi43OTU4IDI1Ljg5NkwyMS42NjQ1IDMwLjc2NDdMMzQuNjc5NyAxNy43NDk1QzM1Ljc0MDIgMTYuNjg5IDM3LjQ1OTUgMTYuNjg5IDM4LjUyIDE3Ljc0OTVaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K';
@@ -36,5 +34,4 @@ const gatIconCheckSvg = 'data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjUyIiBoZWlna
36
34
  exports.QRCodeStyling = QRCodeStyling;
37
35
  exports.gatIconAlertSvg = gatIconAlertSvg;
38
36
  exports.gatIconCheckSvg = gatIconCheckSvg;
39
- exports.gatIconRefreshSvg = gatIconRefreshSvg;
40
37
  exports.logoGatacaSvg = logoGatacaSvg;
package/dist/cjs/gataca-autoqr.cjs.entry.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-93d47a75.js');
5
+ const index = require('./index-1332a8ce.js');
6
6
 
7
7
  const gatacaAutoqrCss = "@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}";
8
8
 
package/dist/cjs/gataca-qr_3.cjs.entry.js CHANGED
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-93d47a75.js');
6
- const gatIconCheck = require('./gat-icon-check-c88a30ed.js');
5
+ const index = require('./index-1332a8ce.js');
6
+ const gatIconCheck = require('./gat-icon-check-6b6780eb.js');
7
7
  const utils = require('./utils-b4e62bc0.js');
8
8
 
9
9
  const GatacaQRDisplay = class {
@@ -58,8 +58,10 @@ const QR = (props) => {
58
58
  return index.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 });
59
59
  };
60
60
 
61
- const AnimatedLoader = () => {
62
- return (index.h("div", { class: "containerLoader" },
61
+ const AnimatedLoader = (props) => {
62
+ const { color = '#4745B7' } = props;
63
+ const style = { '--loader-color': color };
64
+ return (index.h("div", { class: "containerLoader", style: style },
63
65
  index.h("div", { class: "loader" },
64
66
  index.h("div", { class: "loader__item loader__item__1" }),
65
67
  index.h("div", { class: "loader__item loader__item__2" }),
@@ -74,6 +76,8 @@ const AnimatedLoader = () => {
74
76
  const ReadQR = (props) => {
75
77
  var _a;
76
78
  const { modalWidth, readQrMessages, renderQR, url, sizeQR, style } = props;
79
+ const bgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white' };
80
+ const color = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074' };
77
81
  return (index.h("div", { class: "blured", style: {
78
82
  width: (modalWidth - 48).toString() + 'px',
79
83
  height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
@@ -81,53 +85,58 @@ const ReadQR = (props) => {
81
85
  color: style === null || style === void 0 ? void 0 : style.color,
82
86
  border: (style === null || style === void 0 ? void 0 : style.color) ? `1px dashed ${style === null || style === void 0 ? void 0 : style.color}` : `1px dashed #a1a1a1`
83
87
  } },
84
- index.h("div", { id: "notify", style: {
85
- backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white'
86
- } },
87
- index.h(AnimatedLoader, null),
88
- index.h("p", { class: "notify-text", style: {
89
- color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074'
90
- } }, readQrMessages === null || readQrMessages === void 0 ? void 0 :
88
+ index.h("div", { id: "notify", style: bgStyle },
89
+ index.h(AnimatedLoader, { color: style === null || style === void 0 ? void 0 : style.color }),
90
+ index.h("p", { class: "notify-text", style: color }, readQrMessages === null || readQrMessages === void 0 ? void 0 :
91
91
  readQrMessages.title,
92
92
  ' '),
93
- index.h("p", { class: "notify-text bold", style: {
94
- color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074'
95
- } }, readQrMessages === null || readQrMessages === void 0 ? void 0 : readQrMessages.description)),
93
+ index.h("p", { class: "notify-text bold", style: color }, readQrMessages === null || readQrMessages === void 0 ? void 0 : readQrMessages.description)),
96
94
  index.h("div", { id: "qrwait" }, renderQR(url, false, sizeQR))));
97
95
  };
98
96
 
97
+ const RefreshIcon = (props) => {
98
+ const { height = 24, width = 24, color } = props;
99
+ const strokeColor = color ? color : '#8B8B8B';
100
+ return (index.h("svg", { width: width, height: height, viewBox: `0 0 ${width} ${height}`, fill: "none", xmlns: "http://www.w3.org/2000/svg" },
101
+ index.h("path", { d: "M23 4V10H17", stroke: strokeColor, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
102
+ index.h("path", { d: "M20.4899 15C19.8399 16.8399 18.6094 18.4187 16.984 19.4985C15.3586 20.5783 13.4263 21.1006 11.4783 20.9866C9.53026 20.8726 7.67203 20.1286 6.18363 18.8667C4.69524 17.6047 3.6573 15.8932 3.22625 13.9901C2.79519 12.0869 2.99436 10.0952 3.79374 8.31508C4.59313 6.53496 5.94942 5.06288 7.65823 4.12065C9.36705 3.17843 11.3358 2.81711 13.2678 3.09116C15.1999 3.3652 16.9905 4.25975 18.3699 5.64001L22.9999 10", stroke: strokeColor, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
103
+ };
104
+
99
105
  const RetryButton = (props) => {
100
106
  var _a;
101
107
  const { errorMessage, modalWidth, clickInsideBoxLabel, refreshQrLabel, scanQrLabel, waitingStartSessionLabel, style, display, renderRetryQR } = props;
108
+ const bgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white' };
109
+ const alertBgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.alertBgColor) ? style === null || style === void 0 ? void 0 : style.alertBgColor : '#ffdedf' };
110
+ const alertBorderColor = { borderColor: (style === null || style === void 0 ? void 0 : style.alertBorderColor) ? style === null || style === void 0 ? void 0 : style.alertBorderColor : '#ee888c' };
111
+ const color = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074' };
102
112
  return (index.h("div", { class: "reload", style: {
103
113
  width: (modalWidth - 48).toString() + 'px',
104
114
  height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
105
115
  border: (style === null || style === void 0 ? void 0 : style.color) ? `1px dashed ${style === null || style === void 0 ? void 0 : style.color}` : `1px dashed #a1a1a1`
106
116
  } },
107
- index.h("div", { id: "notify", onClick: () => display() },
108
- index.h("img", { src: gatIconCheck.gatIconRefreshSvg, height: 24, width: 24 }),
109
- index.h("p", { class: "notify-text" },
117
+ index.h("div", { id: "notify", onClick: () => display(), style: bgStyle },
118
+ index.h(RefreshIcon, { color: style === null || style === void 0 ? void 0 : style.color, height: 24, width: 24 }),
119
+ index.h("p", { class: "notify-text", style: color },
110
120
  clickInsideBoxLabel,
111
- " "),
112
- errorMessage ? index.h("p", { class: "notify-text bold" }, refreshQrLabel) : index.h("p", { class: "notify-text bold" }, scanQrLabel),
113
- errorMessage && (index.h("div", { class: "alert", style: {
114
- width: (modalWidth - 48).toString() + 'px'
115
- } },
121
+ ' '),
122
+ errorMessage ? (index.h("p", { class: "notify-text bold", style: color }, refreshQrLabel)) : (index.h("p", { class: "notify-text bold", style: color }, scanQrLabel)),
123
+ errorMessage && (index.h("div", { class: "alert", style: Object.assign(Object.assign({ width: (modalWidth - 48).toString() + 'px' }, alertBgStyle), { border: `1px solid ${alertBorderColor}` }) },
116
124
  index.h("img", { src: gatIconCheck.gatIconAlertSvg, height: 24, width: 24 }),
117
- index.h("p", null, errorMessage)))),
125
+ index.h("p", { style: { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#1e1e20' } }, errorMessage)))),
118
126
  index.h("div", { id: "qrwait" }, renderRetryQR(waitingStartSessionLabel))));
119
127
  };
120
128
 
121
129
  const Success = (props) => {
122
- const { modalHeight, successLoginLabel } = props;
130
+ const { modalHeight, successLoginLabel, style } = props;
131
+ const colorStyle = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#1e1e20' };
123
132
  return (index.h("div", { class: 'success', style: {
124
133
  height: modalHeight ? (modalHeight === null || modalHeight === void 0 ? void 0 : modalHeight.toString()) + 'px' : '300px'
125
134
  } },
126
135
  index.h("img", { src: gatIconCheck.gatIconCheckSvg, height: 52, width: 52 }),
127
- index.h("p", { class: "successMsg" }, successLoginLabel)));
136
+ index.h("p", { class: "successMsg", style: colorStyle }, successLoginLabel)));
128
137
  };
129
138
 
130
- 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:20px;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)}}";
139
+ 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:20px;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>svg{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-color:var(--loader-color, #4745B7);border-radius:2px;--to-opacity:1;opacity:var(--to-opacity)}.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);--to-opacity:calc(1 - (0 / 8));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);--to-opacity:calc(1 - (1 / 8));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);--to-opacity:calc(1 - (2 / 8));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);--to-opacity:calc(1 - (3 / 8));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);--to-opacity:calc(1 - (4 / 8));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);--to-opacity:calc(1 - (5 / 8));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);--to-opacity:calc(1 - (6 / 8));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);--to-opacity:calc(1 - (7 / 8));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%{opacity:1}100%{opacity:var(--to-opacity)}}@keyframes rotate{0%{transform:rotate(0deg)}100%{background:rotate(360deg)}}";
131
140
 
132
141
  const DEEP_LINK_PREFIX = 'https://api.gataca.io/qr/redirect.html';
133
142
  //Default values
@@ -248,7 +257,7 @@ const GatacaQR = class {
248
257
  renderQRSection() {
249
258
  switch (this.result) {
250
259
  case utils.RESULT_STATUS.NOT_STARTED:
251
- return this.renderRetryButton();
260
+ return this.renderQR(this.getLink(), true);
252
261
  case utils.RESULT_STATUS.ONGOING:
253
262
  return this.renderQR(this.getLink(), true);
254
263
  case utils.RESULT_STATUS.EXPIRED:
@@ -265,13 +274,13 @@ const GatacaQR = class {
265
274
  }
266
275
  }
267
276
  renderSuccess() {
268
- return index.h(Success, { modalHeight: this === null || this === void 0 ? void 0 : this.modalHeight, successLoginLabel: this === null || this === void 0 ? void 0 : this.successLoginLabel });
277
+ return index.h(Success, { modalHeight: this === null || this === void 0 ? void 0 : this.modalHeight, successLoginLabel: this === null || this === void 0 ? void 0 : this.successLoginLabel, style: this === null || this === void 0 ? void 0 : this.qrStyle });
269
278
  }
270
279
  renderRetryButton(errorMessage) {
271
- return (index.h(RetryButton, { errorMessage: errorMessage, modalWidth: this === null || this === void 0 ? void 0 : this.modalWidth, clickInsideBoxLabel: this === null || this === void 0 ? void 0 : this.clickInsideBoxLabel, refreshQrLabel: this === null || this === void 0 ? void 0 : this.refreshQrLabel, scanQrLabel: this === null || this === void 0 ? void 0 : this.scanQrLabel, waitingStartSessionLabel: this === null || this === void 0 ? void 0 : this.waitingStartSessionLabel, display: this.display.bind(this), renderRetryQR: this.renderRetryQR.bind(this) }));
280
+ return (index.h(RetryButton, { errorMessage: errorMessage, modalWidth: this === null || this === void 0 ? void 0 : this.modalWidth, clickInsideBoxLabel: this === null || this === void 0 ? void 0 : this.clickInsideBoxLabel, refreshQrLabel: this === null || this === void 0 ? void 0 : this.refreshQrLabel, scanQrLabel: this === null || this === void 0 ? void 0 : this.scanQrLabel, waitingStartSessionLabel: this === null || this === void 0 ? void 0 : this.waitingStartSessionLabel, display: this.display.bind(this), renderRetryQR: this.renderRetryQR.bind(this), style: this === null || this === void 0 ? void 0 : this.qrStyle }));
272
281
  }
273
282
  renderReadQR(readQrMessages) {
274
- return index.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) });
283
+ return (index.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), style: this.qrStyle }));
275
284
  }
276
285
  renderQR(value, useLogo, sizeQR) {
277
286
  return index.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 });
@@ -280,17 +289,17 @@ const GatacaQR = class {
280
289
  return index.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 });
281
290
  }
282
291
  render() {
283
- var _a, _b, _c, _d, _e;
292
+ var _a, _b, _c, _d, _e, _f;
284
293
  return (index.h("div", { class: "popUpContainer" }, index.h("div", { class: `is-visible modal-window ${this.hideModalTexts ? '' : 'large-modal'} ${this.hideModalBoxShadow ? 'noBoxShadow' : ''}`, style: {
285
294
  width: (this.modalWidth - 2).toString() + 'px',
286
295
  height: this.modalHeight ? ((_a = (this.modalHeight - 2)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
287
296
  backgroundColor: ((_b = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _b === void 0 ? void 0 : _b.bgColor) ? (_c = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _c === void 0 ? void 0 : _c.bgColor : 'white',
288
- boxShadow: ((_d = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _d === void 0 ? void 0 : _d.boxShadow) ? '0px 3px 10px rgba(48, 48, 48, 0.1);' : 'none'
297
+ boxShadow: ((_d = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _d === void 0 ? void 0 : _d.boxShadow) ? (_e = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _e === void 0 ? void 0 : _e.boxShadow : '0px 3px 10px rgba(48, 48, 48, 0.1);'
289
298
  }, onClick: (event) => {
290
299
  event.stopPropagation();
291
300
  } }, index.h("div", { class: "modal-window__content" }, index.h("div", { class: `qrTitleContainer ${this.hideModalTexts ? 'hidenText' : ''}` }, index.h("p", { class: "qrTitle modalText", style: { color: this.modalTitleColor || '#1e1e20' } }, this.qrModalTitle), !this.hideBrandTitle && (index.h("p", { class: "qrBrand modalText" }, this.byBrandLabel, ' ', index.h("span", null, index.h("img", { src: gatIconCheck.logoGatacaSvg })))), this.result !== utils.RESULT_STATUS.SUCCESS && !this.hideQrModalDescription && index.h("p", { class: "qrDescription modalText" }, this.qrModalDescription)), index.h("div", { class: "qrSection", style: {
292
301
  width: this.modalWidth.toString() + 'px',
293
- height: this.modalWidth ? ((_e = this.modalWidth) === null || _e === void 0 ? void 0 : _e.toString()) + 'px' : ''
302
+ height: this.modalWidth ? ((_f = this.modalWidth) === null || _f === void 0 ? void 0 : _f.toString()) + 'px' : ''
294
303
  } }, this.renderQRSection())))));
295
304
  }
296
305
  };
package/dist/cjs/gataca-qrws.cjs.entry.js CHANGED
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-93d47a75.js');
6
- const gatIconCheck = require('./gat-icon-check-c88a30ed.js');
5
+ const index = require('./index-1332a8ce.js');
6
+ const gatIconCheck = require('./gat-icon-check-6b6780eb.js');
7
7
  const utils = require('./utils-b4e62bc0.js');
8
8
 
9
9
  const Success = (props) => {
@@ -15,6 +15,8 @@ const Success = (props) => {
15
15
  index.h("p", { class: "successMsg" }, successLoginLabel)));
16
16
  };
17
17
 
18
+ const gatIconRefreshSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIzIDRWMTBIMTciIHN0cm9rZT0iIzhCOEI4QiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIwLjQ4OTkgMTVDMTkuODM5OSAxNi44Mzk5IDE4LjYwOTQgMTguNDE4NyAxNi45ODQgMTkuNDk4NUMxNS4zNTg2IDIwLjU3ODMgMTMuNDI2MyAyMS4xMDA2IDExLjQ3ODMgMjAuOTg2NkM5LjUzMDI2IDIwLjg3MjYgNy42NzIwMyAyMC4xMjg2IDYuMTgzNjMgMTguODY2N0M0LjY5NTI0IDE3LjYwNDcgMy42NTczIDE1Ljg5MzIgMy4yMjYyNSAxMy45OTAxQzIuNzk1MTkgMTIuMDg2OSAyLjk5NDM2IDEwLjA5NTIgMy43OTM3NCA4LjMxNTA4QzQuNTkzMTMgNi41MzQ5NiA1Ljk0OTQyIDUuMDYyODggNy42NTgyMyA0LjEyMDY1QzkuMzY3MDUgMy4xNzg0MyAxMS4zMzU4IDIuODE3MTEgMTMuMjY3OCAzLjA5MTE2QzE1LjE5OTkgMy4zNjUyIDE2Ljk5MDUgNC4yNTk3NSAxOC4zNjk5IDUuNjQwMDFMMjIuOTk5OSAxMCIgc3Ryb2tlPSIjOEI4QjhCIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
19
+
18
20
  const RetryButton = (props) => {
19
21
  var _a;
20
22
  const { errorMessage, modalWidth, clickInsideBoxLabel, refreshQrLabel, scanQrLabel, waitingStartSessionLabel, display, renderRetryQR } = props;
@@ -23,7 +25,7 @@ const RetryButton = (props) => {
23
25
  height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : ''
24
26
  } },
25
27
  index.h("div", { id: "notify", onClick: () => display() },
26
- index.h("img", { src: gatIconCheck.gatIconRefreshSvg, height: 24, width: 24 }),
28
+ index.h("img", { src: gatIconRefreshSvg, height: 24, width: 24 }),
27
29
  index.h("p", { class: "notify-text" },
28
30
  clickInsideBoxLabel,
29
31
  " "),
package/dist/cjs/gataca-ssibuttonws.cjs.entry.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-93d47a75.js');
5
+ const index = require('./index-1332a8ce.js');
6
6
 
7
7
  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}";
8
8
 
package/dist/cjs/gatacaqr.cjs.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- const index = require('./index-93d47a75.js');
3
+ const index = require('./index-1332a8ce.js');
4
4
 
5
5
  /*
6
6
  Stencil Client Patch Browser v2.19.3 | MIT Licensed | https://stenciljs.com
package/dist/cjs/{index-93d47a75.js → index-1332a8ce.js} RENAMED
@@ -57,6 +57,11 @@ const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
57
57
  * Don't add values to these!!
58
58
  */
59
59
  const EMPTY_OBJ = {};
60
+ /**
61
+ * Namespaces
62
+ */
63
+ const SVG_NS = 'http://www.w3.org/2000/svg';
64
+ const HTML_NS = 'http://www.w3.org/1999/xhtml';
60
65
  const isDef = (v) => v != null;
61
66
  const isComplexType = (o) => {
62
67
  // https://jsperf.com/typeof-fn-object/5
@@ -485,8 +490,15 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
485
490
  elm = newVNode.$elm$ = doc.createTextNode(newVNode.$text$);
486
491
  }
487
492
  else {
493
+ if (!isSvgMode) {
494
+ isSvgMode = newVNode.$tag$ === 'svg';
495
+ }
488
496
  // create element
489
- elm = newVNode.$elm$ = (doc.createElement(newVNode.$tag$));
497
+ elm = newVNode.$elm$ = (doc.createElementNS(isSvgMode ? SVG_NS : HTML_NS, newVNode.$tag$)
498
+ );
499
+ if (isSvgMode && newVNode.$tag$ === 'foreignObject') {
500
+ isSvgMode = false;
501
+ }
490
502
  // add css classes, attrs, props, listeners, etc.
491
503
  {
492
504
  updateElement(null, newVNode, isSvgMode);
@@ -507,6 +519,16 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
507
519
  }
508
520
  }
509
521
  }
522
+ {
523
+ if (newVNode.$tag$ === 'svg') {
524
+ // Only reset the SVG context when we're exiting <svg> element
525
+ isSvgMode = false;
526
+ }
527
+ else if (elm.tagName === 'foreignObject') {
528
+ // Reenter SVG context when we're exiting <foreignObject> element
529
+ isSvgMode = true;
530
+ }
531
+ }
510
532
  }
511
533
  return elm;
512
534
  };
@@ -744,8 +766,14 @@ const patch = (oldVNode, newVNode) => {
744
766
  const elm = (newVNode.$elm$ = oldVNode.$elm$);
745
767
  const oldChildren = oldVNode.$children$;
746
768
  const newChildren = newVNode.$children$;
769
+ const tag = newVNode.$tag$;
747
770
  const text = newVNode.$text$;
748
771
  if (text === null) {
772
+ {
773
+ // test if we're rendering an svg element, or still rendering nodes inside of one
774
+ // only add this to the when the compiler sees we're using an svg somewhere
775
+ isSvgMode = tag === 'svg' ? true : tag === 'foreignObject' ? false : isSvgMode;
776
+ }
749
777
  {
750
778
  {
751
779
  // either this is the first render of an element OR it's an update
@@ -772,6 +800,9 @@ const patch = (oldVNode, newVNode) => {
772
800
  // no new child vnodes, but there are old child vnodes to remove
773
801
  removeVnodes(oldChildren, 0, oldChildren.length - 1);
774
802
  }
803
+ if (isSvgMode && tag === 'svg') {
804
+ isSvgMode = false;
805
+ }
775
806
  }
776
807
  else if (oldVNode.$text$ !== text) {
777
808
  // update the text content for the text only vnode
package/dist/cjs/loader.cjs.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-93d47a75.js');
5
+ const index = require('./index-1332a8ce.js');
6
6
 
7
7
  /*
8
8
  Stencil Client Patch Esm v2.19.3 | MIT Licensed | https://stenciljs.com
package/dist/collection/assets/icons/RefreshIcon.js ADDED
@@ -0,0 +1,6 @@
1
+ import { h } from '@stencil/core';
2
+ export const RefreshIcon = (props) => {
3
+ const { height = 24, width = 24, color } = props;
4
+ const strokeColor = color ? color : '#8B8B8B';
5
+ return (h("svg", { width: width, height: height, viewBox: `0 0 ${width} ${height}`, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M23 4V10H17", stroke: strokeColor, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M20.4899 15C19.8399 16.8399 18.6094 18.4187 16.984 19.4985C15.3586 20.5783 13.4263 21.1006 11.4783 20.9866C9.53026 20.8726 7.67203 20.1286 6.18363 18.8667C4.69524 17.6047 3.6573 15.8932 3.22625 13.9901C2.79519 12.0869 2.99436 10.0952 3.79374 8.31508C4.59313 6.53496 5.94942 5.06288 7.65823 4.12065C9.36705 3.17843 11.3358 2.81711 13.2678 3.09116C15.1999 3.3652 16.9905 4.25975 18.3699 5.64001L22.9999 10", stroke: strokeColor, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
6
+ };
package/dist/collection/components/gataca-qr/components/readQR/ReadQR.js CHANGED
@@ -3,18 +3,14 @@ import { AnimatedLoader } from './components/AnimatedLoader';
3
3
  export const ReadQR = (props) => {
4
4
  var _a;
5
5
  const { modalWidth, readQrMessages, renderQR, url, sizeQR, style } = props;
6
+ const bgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white' };
7
+ const color = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074' };
6
8
  return (h("div", { class: "blured", style: {
7
9
  width: (modalWidth - 48).toString() + 'px',
8
10
  height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
9
11
  backgroundColor: style === null || style === void 0 ? void 0 : style.bgColor,
10
12
  color: style === null || style === void 0 ? void 0 : style.color,
11
13
  border: (style === null || style === void 0 ? void 0 : style.color) ? `1px dashed ${style === null || style === void 0 ? void 0 : style.color}` : `1px dashed #a1a1a1`
12
- } }, h("div", { id: "notify", style: {
13
- backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white'
14
- } }, h(AnimatedLoader, null), h("p", { class: "notify-text", style: {
15
- color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074'
16
- } }, readQrMessages === null || readQrMessages === void 0 ? void 0 :
17
- readQrMessages.title, ' '), h("p", { class: "notify-text bold", style: {
18
- color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074'
19
- } }, readQrMessages === null || readQrMessages === void 0 ? void 0 : readQrMessages.description)), h("div", { id: "qrwait" }, renderQR(url, false, sizeQR))));
14
+ } }, h("div", { id: "notify", style: bgStyle }, h(AnimatedLoader, { color: style === null || style === void 0 ? void 0 : style.color }), h("p", { class: "notify-text", style: color }, readQrMessages === null || readQrMessages === void 0 ? void 0 :
15
+ readQrMessages.title, ' '), h("p", { class: "notify-text bold", style: color }, readQrMessages === null || readQrMessages === void 0 ? void 0 : readQrMessages.description)), h("div", { id: "qrwait" }, renderQR(url, false, sizeQR))));
20
16
  };
package/dist/collection/components/gataca-qr/components/readQR/components/AnimatedLoader.js CHANGED
@@ -1,4 +1,6 @@
1
1
  import { h } from '@stencil/core';
2
- export const AnimatedLoader = () => {
3
- return (h("div", { class: "containerLoader" }, h("div", { class: "loader" }, h("div", { class: "loader__item loader__item__1" }), h("div", { class: "loader__item loader__item__2" }), h("div", { class: "loader__item loader__item__3" }), h("div", { class: "loader__item loader__item__4" }), h("div", { class: "loader__item loader__item__5" }), h("div", { class: "loader__item loader__item__6" }), h("div", { class: "loader__item loader__item__7" }), h("div", { class: "loader__item loader__item__8" }))));
2
+ export const AnimatedLoader = (props) => {
3
+ const { color = '#4745B7' } = props;
4
+ const style = { '--loader-color': color };
5
+ return (h("div", { class: "containerLoader", style: style }, h("div", { class: "loader" }, h("div", { class: "loader__item loader__item__1" }), h("div", { class: "loader__item loader__item__2" }), h("div", { class: "loader__item loader__item__3" }), h("div", { class: "loader__item loader__item__4" }), h("div", { class: "loader__item loader__item__5" }), h("div", { class: "loader__item loader__item__6" }), h("div", { class: "loader__item loader__item__7" }), h("div", { class: "loader__item loader__item__8" }))));
4
6
  };
package/dist/collection/components/gataca-qr/components/retryButton/RetryButton.js CHANGED
@@ -1,14 +1,16 @@
1
1
  import { h } from '@stencil/core';
2
- import refreshIcon from '../../../../assets/icons/gat-icon-refresh.svg';
3
2
  import alertIcon from '../../../../assets/icons/gat-icon-alert.svg';
3
+ import { RefreshIcon } from '../../../../assets/icons/RefreshIcon';
4
4
  export const RetryButton = (props) => {
5
5
  var _a;
6
6
  const { errorMessage, modalWidth, clickInsideBoxLabel, refreshQrLabel, scanQrLabel, waitingStartSessionLabel, style, display, renderRetryQR } = props;
7
+ const bgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.bgColor) ? style === null || style === void 0 ? void 0 : style.bgColor : 'white' };
8
+ const alertBgStyle = { backgroundColor: (style === null || style === void 0 ? void 0 : style.alertBgColor) ? style === null || style === void 0 ? void 0 : style.alertBgColor : '#ffdedf' };
9
+ const alertBorderColor = { borderColor: (style === null || style === void 0 ? void 0 : style.alertBorderColor) ? style === null || style === void 0 ? void 0 : style.alertBorderColor : '#ee888c' };
10
+ const color = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#707074' };
7
11
  return (h("div", { class: "reload", style: {
8
12
  width: (modalWidth - 48).toString() + 'px',
9
13
  height: modalWidth ? ((_a = (modalWidth - 48)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
10
14
  border: (style === null || style === void 0 ? void 0 : style.color) ? `1px dashed ${style === null || style === void 0 ? void 0 : style.color}` : `1px dashed #a1a1a1`
11
- } }, h("div", { id: "notify", onClick: () => display() }, h("img", { src: refreshIcon, height: 24, width: 24 }), h("p", { class: "notify-text" }, clickInsideBoxLabel, " "), errorMessage ? h("p", { class: "notify-text bold" }, refreshQrLabel) : h("p", { class: "notify-text bold" }, scanQrLabel), errorMessage && (h("div", { class: "alert", style: {
12
- width: (modalWidth - 48).toString() + 'px'
13
- } }, h("img", { src: alertIcon, height: 24, width: 24 }), h("p", null, errorMessage)))), h("div", { id: "qrwait" }, renderRetryQR(waitingStartSessionLabel))));
15
+ } }, h("div", { id: "notify", onClick: () => display(), style: bgStyle }, h(RefreshIcon, { color: style === null || style === void 0 ? void 0 : style.color, height: 24, width: 24 }), h("p", { class: "notify-text", style: color }, clickInsideBoxLabel, ' '), errorMessage ? (h("p", { class: "notify-text bold", style: color }, refreshQrLabel)) : (h("p", { class: "notify-text bold", style: color }, scanQrLabel)), errorMessage && (h("div", { class: "alert", style: Object.assign(Object.assign({ width: (modalWidth - 48).toString() + 'px' }, alertBgStyle), { border: `1px solid ${alertBorderColor}` }) }, h("img", { src: alertIcon, height: 24, width: 24 }), h("p", { style: { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#1e1e20' } }, errorMessage)))), h("div", { id: "qrwait" }, renderRetryQR(waitingStartSessionLabel))));
14
16
  };
package/dist/collection/components/gataca-qr/components/success/Success.js CHANGED
@@ -1,8 +1,9 @@
1
1
  import successIcon from '../../../../assets/icons/gat-icon-check.svg';
2
2
  import { h } from '@stencil/core';
3
3
  export const Success = (props) => {
4
- const { modalHeight, successLoginLabel } = props;
4
+ const { modalHeight, successLoginLabel, style } = props;
5
+ const colorStyle = { color: (style === null || style === void 0 ? void 0 : style.color) ? style === null || style === void 0 ? void 0 : style.color : '#1e1e20' };
5
6
  return (h("div", { class: 'success', style: {
6
7
  height: modalHeight ? (modalHeight === null || modalHeight === void 0 ? void 0 : modalHeight.toString()) + 'px' : '300px'
7
- } }, h("img", { src: successIcon, height: 52, width: 52 }), h("p", { class: "successMsg" }, successLoginLabel)));
8
+ } }, h("img", { src: successIcon, height: 52, width: 52 }), h("p", { class: "successMsg", style: colorStyle }, successLoginLabel)));
8
9
  };
package/dist/collection/components/gataca-qr/gataca-qr.css CHANGED
@@ -235,7 +235,7 @@ img {
235
235
  padding: 20px;
236
236
  background: rgba(255, 255, 255, 0.95);
237
237
  }
238
- #notify > img {
238
+ #notify > svg {
239
239
  padding-bottom: 12px;
240
240
  }
241
241
 
@@ -294,14 +294,17 @@ img {
294
294
  position: absolute;
295
295
  width: 9.68px;
296
296
  height: 4px;
297
- background: transparent;
297
+ background-color: var(--loader-color, #4745B7);
298
298
  border-radius: 2px;
299
+ --to-opacity: 1;
300
+ opacity: var(--to-opacity);
299
301
  }
300
302
  .loader__item__1 {
301
303
  transform: translate(2.5846212025px, 5.4246212025px) rotate(45deg);
302
304
  -webkit-animation: translate(2.5846212025px, 5.4246212025px) rotate(45deg);
303
305
  -moz-animation: translate(2.5846212025px, 5.4246212025px) rotate(45deg);
304
306
  -o-animation: translate(2.5846212025px, 5.4246212025px) rotate(45deg);
307
+ --to-opacity: calc(1 - (0 / 8));
305
308
  animation: blink 0.8333333333s linear 0.1041666667s infinite;
306
309
  -webkit-animation: blink 0.8333333333s linear 0.1041666667s infinite;
307
310
  -moz-animation: blink 0.8333333333s linear 0.1041666667s infinite;
@@ -312,6 +315,7 @@ img {
312
315
  -webkit-animation: translate(-4.84px, 8.5px) rotate(90deg);
313
316
  -moz-animation: translate(-4.84px, 8.5px) rotate(90deg);
314
317
  -o-animation: translate(-4.84px, 8.5px) rotate(90deg);
318
+ --to-opacity: calc(1 - (1 / 8));
315
319
  animation: blink 0.8333333333s linear 0.2083333333s infinite;
316
320
  -webkit-animation: blink 0.8333333333s linear 0.2083333333s infinite;
317
321
  -moz-animation: blink 0.8333333333s linear 0.2083333333s infinite;
@@ -322,6 +326,7 @@ img {
322
326
  -webkit-animation: translate(-12.2646212025px, 5.4246212025px) rotate(135deg);
323
327
  -moz-animation: translate(-12.2646212025px, 5.4246212025px) rotate(135deg);
324
328
  -o-animation: translate(-12.2646212025px, 5.4246212025px) rotate(135deg);
329
+ --to-opacity: calc(1 - (2 / 8));
325
330
  animation: blink 0.8333333333s linear 0.3125s infinite;
326
331
  -webkit-animation: blink 0.8333333333s linear 0.3125s infinite;
327
332
  -moz-animation: blink 0.8333333333s linear 0.3125s infinite;
@@ -332,6 +337,7 @@ img {
332
337
  -webkit-animation: translate(-15.3399999992px, -1.9999999999px) rotate(180deg);
333
338
  -moz-animation: translate(-15.3399999992px, -1.9999999999px) rotate(180deg);
334
339
  -o-animation: translate(-15.3399999992px, -1.9999999999px) rotate(180deg);
340
+ --to-opacity: calc(1 - (3 / 8));
335
341
  animation: blink 0.8333333333s linear 0.4166666667s infinite;
336
342
  -webkit-animation: blink 0.8333333333s linear 0.4166666667s infinite;
337
343
  -moz-animation: blink 0.8333333333s linear 0.4166666667s infinite;
@@ -342,6 +348,7 @@ img {
342
348
  -webkit-animation: translate(-12.2646210959px, -9.4246211842px) rotate(225deg);
343
349
  -moz-animation: translate(-12.2646210959px, -9.4246211842px) rotate(225deg);
344
350
  -o-animation: translate(-12.2646210959px, -9.4246211842px) rotate(225deg);
351
+ --to-opacity: calc(1 - (4 / 8));
345
352
  animation: blink 0.8333333333s linear 0.5208333333s infinite;
346
353
  -webkit-animation: blink 0.8333333333s linear 0.5208333333s infinite;
347
354
  -moz-animation: blink 0.8333333333s linear 0.5208333333s infinite;
@@ -352,6 +359,7 @@ img {
352
359
  -webkit-animation: translate(-4.8399941857px, -12.499998805px) rotate(270deg);
353
360
  -moz-animation: translate(-4.8399941857px, -12.499998805px) rotate(270deg);
354
361
  -o-animation: translate(-4.8399941857px, -12.499998805px) rotate(270deg);
362
+ --to-opacity: calc(1 - (5 / 8));
355
363
  animation: blink 0.8333333333s linear 0.625s infinite;
356
364
  -webkit-animation: blink 0.8333333333s linear 0.625s infinite;
357
365
  -moz-animation: blink 0.8333333333s linear 0.625s infinite;
@@ -362,6 +370,7 @@ img {
362
370
  -webkit-animation: translate(2.5847915061px, -9.4245803212px) rotate(315deg);
363
371
  -moz-animation: translate(2.5847915061px, -9.4245803212px) rotate(315deg);
364
372
  -o-animation: translate(2.5847915061px, -9.4245803212px) rotate(315deg);
373
+ --to-opacity: calc(1 - (6 / 8));
365
374
  animation: blink 0.8333333333s linear 0.7291666667s infinite;
366
375
  -webkit-animation: blink 0.8333333333s linear 0.7291666667s infinite;
367
376
  -moz-animation: blink 0.8333333333s linear 0.7291666667s infinite;
@@ -372,6 +381,7 @@ img {
372
381
  -webkit-animation: translate(5.6631628524px, -1.99913122px) rotate(360deg);
373
382
  -moz-animation: translate(5.6631628524px, -1.99913122px) rotate(360deg);
374
383
  -o-animation: translate(5.6631628524px, -1.99913122px) rotate(360deg);
384
+ --to-opacity: calc(1 - (7 / 8));
375
385
  animation: blink 0.8333333333s linear 0.8333333333s infinite;
376
386
  -webkit-animation: blink 0.8333333333s linear 0.8333333333s infinite;
377
387
  -moz-animation: blink 0.8333333333s linear 0.8333333333s infinite;
@@ -383,10 +393,10 @@ img {
383
393
 
384
394
  @keyframes blink {
385
395
  0% {
386
- background: #4745B7;
396
+ opacity: 1;
387
397
  }
388
398
  100% {
389
- background: #CCCBF8;
399
+ opacity: var(--to-opacity);
390
400
  }
391
401
  }
392
402
  @keyframes rotate {
package/dist/collection/components/gataca-qr/gataca-qr.js CHANGED
@@ -125,7 +125,7 @@ export class GatacaQR {
125
125
  renderQRSection() {
126
126
  switch (this.result) {
127
127
  case RESULT_STATUS.NOT_STARTED:
128
- return this.renderRetryButton();
128
+ return this.renderQR(this.getLink(), true);
129
129
  case RESULT_STATUS.ONGOING:
130
130
  return this.renderQR(this.getLink(), true);
131
131
  case RESULT_STATUS.EXPIRED:
@@ -142,13 +142,13 @@ export class GatacaQR {
142
142
  }
143
143
  }
144
144
  renderSuccess() {
145
- return h(Success, { modalHeight: this === null || this === void 0 ? void 0 : this.modalHeight, successLoginLabel: this === null || this === void 0 ? void 0 : this.successLoginLabel });
145
+ return h(Success, { modalHeight: this === null || this === void 0 ? void 0 : this.modalHeight, successLoginLabel: this === null || this === void 0 ? void 0 : this.successLoginLabel, style: this === null || this === void 0 ? void 0 : this.qrStyle });
146
146
  }
147
147
  renderRetryButton(errorMessage) {
148
- return (h(RetryButton, { errorMessage: errorMessage, modalWidth: this === null || this === void 0 ? void 0 : this.modalWidth, clickInsideBoxLabel: this === null || this === void 0 ? void 0 : this.clickInsideBoxLabel, refreshQrLabel: this === null || this === void 0 ? void 0 : this.refreshQrLabel, scanQrLabel: this === null || this === void 0 ? void 0 : this.scanQrLabel, waitingStartSessionLabel: this === null || this === void 0 ? void 0 : this.waitingStartSessionLabel, display: this.display.bind(this), renderRetryQR: this.renderRetryQR.bind(this) }));
148
+ return (h(RetryButton, { errorMessage: errorMessage, modalWidth: this === null || this === void 0 ? void 0 : this.modalWidth, clickInsideBoxLabel: this === null || this === void 0 ? void 0 : this.clickInsideBoxLabel, refreshQrLabel: this === null || this === void 0 ? void 0 : this.refreshQrLabel, scanQrLabel: this === null || this === void 0 ? void 0 : this.scanQrLabel, waitingStartSessionLabel: this === null || this === void 0 ? void 0 : this.waitingStartSessionLabel, display: this.display.bind(this), renderRetryQR: this.renderRetryQR.bind(this), style: this === null || this === void 0 ? void 0 : this.qrStyle }));
149
149
  }
150
150
  renderReadQR(readQrMessages) {
151
- 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) });
151
+ 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), style: this.qrStyle }));
152
152
  }
153
153
  renderQR(value, useLogo, sizeQR) {
154
154
  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 });
@@ -157,17 +157,17 @@ export class GatacaQR {
157
157
  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 });
158
158
  }
159
159
  render() {
160
- var _a, _b, _c, _d, _e;
160
+ var _a, _b, _c, _d, _e, _f;
161
161
  return (h("div", { class: "popUpContainer" }, h("div", { class: `is-visible modal-window ${this.hideModalTexts ? '' : 'large-modal'} ${this.hideModalBoxShadow ? 'noBoxShadow' : ''}`, style: {
162
162
  width: (this.modalWidth - 2).toString() + 'px',
163
163
  height: this.modalHeight ? ((_a = (this.modalHeight - 2)) === null || _a === void 0 ? void 0 : _a.toString()) + 'px' : '',
164
164
  backgroundColor: ((_b = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _b === void 0 ? void 0 : _b.bgColor) ? (_c = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _c === void 0 ? void 0 : _c.bgColor : 'white',
165
- boxShadow: ((_d = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _d === void 0 ? void 0 : _d.boxShadow) ? '0px 3px 10px rgba(48, 48, 48, 0.1);' : 'none'
165
+ boxShadow: ((_d = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _d === void 0 ? void 0 : _d.boxShadow) ? (_e = this === null || this === void 0 ? void 0 : this.qrStyle) === null || _e === void 0 ? void 0 : _e.boxShadow : '0px 3px 10px rgba(48, 48, 48, 0.1);'
166
166
  }, onClick: (event) => {
167
167
  event.stopPropagation();
168
168
  } }, h("div", { class: "modal-window__content" }, h("div", { class: `qrTitleContainer ${this.hideModalTexts ? 'hidenText' : ''}` }, h("p", { class: "qrTitle modalText", style: { color: this.modalTitleColor || '#1e1e20' } }, this.qrModalTitle), !this.hideBrandTitle && (h("p", { class: "qrBrand modalText" }, this.byBrandLabel, ' ', h("span", null, h("img", { src: logoGataca })))), this.result !== RESULT_STATUS.SUCCESS && !this.hideQrModalDescription && h("p", { class: "qrDescription modalText" }, this.qrModalDescription)), h("div", { class: "qrSection", style: {
169
169
  width: this.modalWidth.toString() + 'px',
170
- height: this.modalWidth ? ((_e = this.modalWidth) === null || _e === void 0 ? void 0 : _e.toString()) + 'px' : ''
170
+ height: this.modalWidth ? ((_f = this.modalWidth) === null || _f === void 0 ? void 0 : _f.toString()) + 'px' : ''
171
171
  } }, this.renderQRSection())))));
172
172
  }
173
173
  static get is() { return "gataca-qr"; }
@@ -883,7 +883,7 @@ export class GatacaQR {
883
883
  "mutable": false,
884
884
  "complexType": {
885
885
  "original": "qrStyle",
886
- "resolved": "{ color: string; bgColor: string; boxShadow?: boolean; }",
886
+ "resolved": "{ color: string; bgColor: string; alertBgColor?: string; alertBorderColor?: string; boxShadow?: string; }",
887
887
  "references": {
888
888
  "qrStyle": {
889
889
  "location": "local"