@gataca/qr 2.0.2 → 2.0.4

package/dist/collection/components/gataca-autoqr/gataca-autoqr.js

@@ -0,0 +1,323 @@
+import { h, } from "@stencil/core";
+const DEFAULT_REPOSITORY = "https://studio.gataca.io/api/v1/qrconfigs";
+const fixFunctions = (data) => {
+  var _a, _b, _c, _d, _e, _f;
+  data.errorCallback = deserializeFunction((_a = data.errorCallback) === null || _a === void 0 ? void 0 : _a.toString());
+  data.successCallback = deserializeFunction((_b = data.successCallback) === null || _b === void 0 ? void 0 : _b.toString());
+  data.wsOnMessage = deserializeFunction((_c = data.wsOnMessage) === null || _c === void 0 ? void 0 : _c.toString());
+  data.wsOnOpen = deserializeFunction((_d = data.wsOnOpen) === null || _d === void 0 ? void 0 : _d.toString());
+  data.checkStatus = deserializeFunction((_e = data.checkStatus) === null || _e === void 0 ? void 0 : _e.toString());
+  data.createSession = deserializeFunction((_f = data.createSession) === null || _f === void 0 ? void 0 : _f.toString());
+  return data;
+};
+const deserializeFunction = (data) => {
+  if (data) {
+    return new Function("return " + data)();
+  }
+  return undefined;
+};
+export class GatacaAutoQR {
+  constructor() {
+    this.configId = undefined;
+    this.configRepository = DEFAULT_REPOSITORY;
+    this.successCallback = undefined;
+    this.errorCallback = undefined;
+    this.checkStatus = undefined;
+    this.createSession = undefined;
+    this.wsOnOpen = undefined;
+    this.wsOnMessage = undefined;
+    this.config = undefined;
+    this.loading = undefined;
+    this.loading = true;
+    fetch(this.configRepository + "/" + this.configId, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+      },
+    })
+      .then((response) => {
+      response
+        .json()
+        .then((data) => {
+        data = fixFunctions(data);
+        this.config = data;
+        this.loading = false;
+      })
+        .catch((err) => {
+        console.log("Cannot retrieve selected config", err);
+        this.loading = false;
+      });
+    })
+      .catch((err) => {
+      console.log("Cannot retrieve selected config", err);
+      this.loading = false;
+    });
+  }
+  /**
+   * Retrieve manually the session data on a successful login
+   */
+  async getSessionData() {
+    return this.qr.getSessionData();
+  }
+  selectQR() {
+    if (this.config.useButton) {
+      if (this.config.useWs) {
+        this.qr = (h("gataca-ssibuttonws", { buttonText: this.config.buttonText, wsOnMessage: this.wsOnMessage || this.config.wsOnMessage, wsOnOpen: this.wsOnOpen || this.config.wsOnOpen, successCallback: this.successCallback || this.config.successCallback, errorCallback: this.errorCallback || this.config.errorCallback, qrRole: this.config.qrRole, callbackServer: this.config.callbackServer, sessionTimeout: this.config.sessionTimeout, socketEndpoint: this.config.socketEndpoint, autostart: true, autorefresh: this.config.autorefresh, v2: this.config.v2, qrModalTitle: this.config.qrModalTitle, qrModalDescription: this.config.qrModalDescription, hideBrandTitle: this.config.hideBrandTitle, dynamicLink: this.config.dynamicLink }));
+      }
+      else {
+        this.qr = (h("gataca-ssibutton", { buttonText: this.config.buttonText, checkStatus: this.checkStatus || this.config.checkStatus, createSession: this.createSession || this.config.createSession, successCallback: this.successCallback || this.config.successCallback, errorCallback: this.errorCallback || this.config.errorCallback, qrRole: this.config.qrRole, callbackServer: this.config.callbackServer, sessionTimeout: this.config.sessionTimeout, pollingFrequency: this.config.pollingFrequency, autorefresh: this.config.autorefresh, v2: this.config.v2, qrModalTitle: this.config.qrModalTitle, qrModalDescription: this.config.qrModalDescription, hideBrandTitle: this.config.hideBrandTitle, dynamicLink: this.config.dynamicLink }));
+      }
+    }
+    else {
+      if (this.config.useWs) {
+        this.qr = (h("gataca-qrws", { wsOnMessage: this.wsOnMessage || this.config.wsOnMessage, wsOnOpen: this.wsOnOpen || this.config.wsOnOpen, successCallback: this.successCallback || this.config.successCallback, errorCallback: this.errorCallback || this.config.errorCallback, qrRole: this.config.qrRole, callbackServer: this.config.callbackServer, sessionTimeout: this.config.sessionTimeout, socketEndpoint: this.config.socketEndpoint, autostart: this.config.autostart, autorefresh: this.config.autorefresh, v2: this.config.v2, qrModalTitle: this.config.qrModalTitle, qrModalDescription: this.config.qrModalDescription, hideBrandTitle: this.config.hideBrandTitle, dynamicLink: this.config.dynamicLink }));
+      }
+      else {
+        this.qr = (h("gataca-qr", { checkStatus: this.checkStatus || this.config.checkStatus, createSession: this.createSession || this.config.createSession, successCallback: this.successCallback || this.config.successCallback, errorCallback: this.errorCallback || this.config.errorCallback, qrRole: this.config.qrRole, callbackServer: this.config.callbackServer, sessionTimeout: this.config.sessionTimeout, pollingFrequency: this.config.pollingFrequency, autostart: this.config.autostart, autorefresh: this.config.autorefresh, v2: this.config.v2, qrModalTitle: this.config.qrModalTitle, qrModalDescription: this.config.qrModalDescription, hideBrandTitle: this.config.hideBrandTitle, dynamicLink: this.config.dynamicLink }));
+      }
+    }
+  }
+  render() {
+    if (this.loading) {
+      //TODO: Improve loading message
+      return h("div", null, "Loading...");
+    }
+    if (this.config) {
+      this.selectQR();
+      return this.qr;
+    }
+    //TODO: Improve error message
+    return h("div", null, "Error loading your config...");
+  }
+  static get is() { return "gataca-autoqr"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["gataca-autoqr.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["gataca-autoqr.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "configId": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "***Mandatory***\nID of the QR configuration to display"
+        },
+        "attribute": "config-id",
+        "reflect": false
+      },
+      "configRepository": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "___Optional___\nConfigURL Repository to download the config from"
+        },
+        "attribute": "config-repository",
+        "reflect": false,
+        "defaultValue": "DEFAULT_REPOSITORY"
+      },
+      "successCallback": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(data?: any) => void",
+          "resolved": "(data?: any) => void",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "***Mandatory***\nCallback fired upon session correctly verified\nIf not set, session validation wouldn't trigger any action\nThe session data and a possible token will be sent as parameters to the callback"
+        },
+        "defaultValue": "undefined"
+      },
+      "errorCallback": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(error?: Error) => void",
+          "resolved": "(error?: Error) => void",
+          "references": {
+            "Error": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "___Just for polling flavour___\n***Mandatory***\nCallback fired upon session expired or invalid\nIf not set, session error would not be handled\nAn error containing information will be passed as parameter"
+        },
+        "defaultValue": "undefined"
+      },
+      "checkStatus": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(\n    id?: string\n  ) => Promise<{ result: RESULT_STATUS; data?: any }>",
+          "resolved": "(id?: string) => Promise<{ result: RESULT_STATUS; data?: any; }>",
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "RESULT_STATUS": {
+              "location": "import",
+              "path": "../../utils"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "___Just for polling flavour___\n***Mandatory***\nCheck status function to query the current status of the session\nThe function must query a client endpoint to check the status. That endpoint must return an error if the session has expired."
+        },
+        "defaultValue": "undefined"
+      },
+      "createSession": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "() => Promise<{\n    sessionId: string;\n    authenticationRequest?: string;\n  }>",
+          "resolved": "() => Promise<{ sessionId: string; authenticationRequest?: string; }>",
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "***Mandatory***\nCreate session function to generate a new Session\nUsing V1, it can provide just a session Id\nUsing V2, it must provide also the authentication request. The session Id is the id of the presentation definition"
+        },
+        "defaultValue": "undefined"
+      },
+      "wsOnOpen": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(socket: WebSocket) => void",
+          "resolved": "(socket: WebSocket) => void",
+          "references": {
+            "WebSocket": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "___Just for WS flavour___\n[Optional]\nFunction to send a message to the server upon socket creation"
+        }
+      },
+      "wsOnMessage": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(socket: WebSocket, msg: MessageEvent) => void",
+          "resolved": "(socket: WebSocket, msg: MessageEvent<any>) => void",
+          "references": {
+            "WebSocket": {
+              "location": "global"
+            },
+            "MessageEvent": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "___Just for WS flavour___\n**RECOMMENDED**\nCallback to invoke an a message has been received on the socket. It provides the socket itself and the message as parameters.\nIf not used, the messages provided by the server on the Socket connection must conform to the WSReponse interface\nIf used, an Event named **sessionMsg** must be triggered with a WSReponse as data"
+        }
+      }
+    };
+  }
+  static get states() {
+    return {
+      "config": {},
+      "loading": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "gatacaLoginCompleted",
+        "name": "gatacaLoginCompleted",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "GatacaLoginCompleted event, triggered with session data upon login success"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "gatacaLoginFailed",
+        "name": "gatacaLoginFailed",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "GatacaLoginFailed event, triggered with error upon login failure"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "getSessionData": {
+        "complexType": {
+          "signature": "() => Promise<any>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<any>"
+        },
+        "docs": {
+          "text": "Retrieve manually the session data on a successful login",
+          "tags": []
+        }
+      }
+    };
+  }
+}

package/dist/collection/components/gataca-qr/gataca-qr.css

@@ -0,0 +1,261 @@
+@import url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@100;300;400;500;600;700&display=swap");
+/* http://meyerweb.com/eric/tools/css/reset/ 
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+@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;
+}
+
+/* HTML5 display-role reset for older browsers */
+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;
+}
+
+/*
+QR COMPONENT  
+*/
+.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 .modal-window {
+  position: relative;
+  border-radius: 6px;
+  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;
+  width: 300px;
+  padding: 1px;
+  background-color: white;
+  min-height: 350px;
+  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 p {
+  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;
+  color: #1e1e20;
+}
+.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-weight: 400;
+  font-size: 14px;
+  line-height: 16.5px;
+  padding-top: 12px;
+  padding-bottom: 5px;
+  color: #A1A1A1;
+}
+.popUpContainer .modal-window .bold {
+  font-weight: 600;
+}
+.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 .reload {
+  height: 252px;
+  width: 252px;
+  border: 1px dashed #A1A1A1;
+  border-radius: 12px;
+  position: relative;
+  margin: 24px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.popUpContainer #qrwait {
+  display: flex;
+  justify-content: center;
+}
+.popUpContainer #qrwait,
+.popUpContainer #notify {
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  border-radius: 20px;
+}
+.popUpContainer #notify {
+  z-index: 10;
+  background-color: gray;
+  position: absolute;
+  justify-self: center;
+  justify-items: center;
+  justify-content: center;
+  align-items: center;
+  align-content: center;
+  align-self: center;
+  display: flex;
+  flex-direction: column;
+  padding: 24px;
+  box-sizing: border-box;
+  /* Auto layout */
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 20px;
+  background: rgba(255, 255, 255, 0.9);
+  /* Grey Colors/Grey 400 */
+}
+.popUpContainer .notify-text {
+  font-family: "Work Sans";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 16px;
+  text-align: center;
+  font-feature-settings: "salt" on;
+  color: #8B8B8B;
+  flex: none;
+  order: 1;
+  align-self: stretch;
+  flex-grow: 0;
+}
+.popUpContainer .alert {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: start;
+  width: 252px;
+  position: absolute;
+  bottom: 0;
+  background: #FFE5E5;
+  border-radius: 12px;
+}
+.popUpContainer .alert img {
+  margin: 12px;
+}
+.popUpContainer .alert p {
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 16px;
+  color: black;
+}
+.popUpContainer .success {
+  display: flex;
+  height: 300px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: 0px;
+}
+.popUpContainer .success .successMsg {
+  line-height: 23.5px;
+  color: var(--neutral-1000, #1E1E20);
+  text-align: center;
+  /* Heading/6 */
+  font-family: "Ubuntu", "Work Sans", "Helvetica Neue", sans-serif;
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 24px;
+  /* 120% */
+}
+.popUpContainer .is-visible {
+  opacity: 1;
+  visibility: visible;
+}
+
+.is-transparent {
+  opacity: 0;
+}