@everymatrix/temporary-consents 1.32.4 → 1.33.1

package/dist/components/index.d.ts

@@ -0,0 +1,26 @@
+/* TemporaryConsents custom elements */
+
+import type { Components, JSX } from "../types/components";
+
+/**
+ * Used to manually set the base path where assets can be found.
+ * If the script is used as "module", it's recommended to use "import.meta.url",
+ * such as "setAssetPath(import.meta.url)". Other options include
+ * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
+ * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
+ * But do note that this configuration depends on how your script is bundled, or lack of
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
+ * will have to ensure the static assets are copied to its build directory.
+ */
+export declare const setAssetPath: (path: string) => void;
+
+export interface SetPlatformOptions {
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
+
+export type { Components, JSX };
+
+export * from '../types';

package/dist/components/index.js

@@ -0,0 +1 @@
+export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';

package/dist/components/temporary-consents.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TemporaryConsents extends Components.TemporaryConsents, HTMLElement {}
+export const TemporaryConsents: {
+  prototype: TemporaryConsents;
+  new (): TemporaryConsents;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/temporary-consents.js

@@ -0,0 +1,225 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const DEFAULT_LANGUAGE = 'en';
+const SUPPORTED_LANGUAGES = ['en', 'hr'];
+let TRANSLATIONS = {
+  en: {
+    title: 'Participation conditions',
+    description: 'Important: Full verification is required in order to be able to use our entire offer. If verification is not completed, it is not possible to withdraw and the betting account will be locked in {daysUntilLockout} days.',
+    declineButton: 'Decline and log out',
+    acceptButton: 'Accept',
+    loading: 'Please wait, loading...'
+  },
+  hr: {
+    title: 'Uvjeti sudjelovanja',
+    description: 'Važno: Potrebna je potpuna verifikacija kako biste mogli koristiti našu cjelokupnu ponudu. Ako potvrda nije dovršena, nije moguće podići i račun za klađenje bit će zaključan za {daysUntilLockout} dana.',
+    declineButton: 'Odbijte i odjavite se',
+    acceptButton: 'Prihvatiti',
+    loading: 'Molimo pričekajte, učitavanje...'
+  },
+  'es-mx': {
+    'title': 'Condiciones de participación',
+    'description': 'Importante: Una verificación completa es requerida para poder utilizar nuestra oferta. Si no se verifica, no será posible hacer retiros y la cuenta para realizar apuestas será bloqueada.',
+    'declineButton': 'Declinar y salir',
+    'acceptButton': 'Aceptar',
+    'Loading': 'Espere por favor, Cargando...'
+  },
+  'pt-br': {
+    'title': 'Condições de participação',
+    'description': 'Importante: É necessária uma verificação completa para poder utilizar a nossa oferta. Se não for verificado, os saques não serão possíveis e a conta de apostas será bloqueada.',
+    'declineButton': 'Recusar e sair',
+    'acceptButton': 'Aceitar',
+    'Loading': 'Espere, por favor, Carregando...'
+  }
+};
+const getTranslations = (url) => {
+  return new Promise((resolve) => {
+    fetch(url)
+      .then((res) => res.json())
+      .then((data) => {
+      Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+          TRANSLATIONS[item][key] = data[item][key];
+        }
+      });
+      resolve(true);
+    });
+  });
+};
+const translate = (key, customLang, values) => {
+  const lang = customLang;
+  let translation = TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+  if (values !== undefined) {
+    for (const [key, value] of Object.entries(values.values)) {
+      const regex = new RegExp(`{${key}}`, 'g');
+      translation = translation.replace(regex, value);
+    }
+  }
+  return translation;
+};
+
+const temporaryConsentsCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0}:host{display:block}.TemporaryConsents{max-width:500px;display:flex;gap:35px;flex-direction:column;box-shadow:0px 1px 5px 1px rgba(0, 0, 0, 0.1);padding:20px;font-family:sans-serif}.TemporaryConsentsTitle{text-align:left;font-family:inherit;color:#000;font-weight:400;font-size:18px;display:block;border-bottom:1px solid #000;padding-bottom:10px}.TemporaryConsentsText{font-family:inherit;font-weight:300;font-size:16px}.TemporaryConsentsButtonsWrapper{display:flex;justify-content:space-evenly;gap:50px}.TemporaryConsentsButton{font-family:inherit;font-weight:300;font-size:14px;border:none;padding:10px;min-width:150px;border-radius:4px}.TemporaryConsentsButtonDecline{background-color:transparent;border:1px solid #000}.TemporaryConsentsButtonAccept{color:white;background-color:#000}";
+
+const TemporaryConsents$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+    * Client custom styling via inline styles
+    */
+    this.clientStyling = '';
+    /**
+     * Client custom styling via url
+     */
+    this.clientStylingUrl = '';
+    /**
+     * Translation via url
+     */
+    this.translationUrl = '';
+    this.stylingAppends = false;
+    this.isLoading = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
+    this.setClientStylingURL = () => {
+      let url = new URL(this.clientStylingUrl);
+      let cssFile = document.createElement('style');
+      fetch(url.href)
+        .then((res) => res.text())
+        .then((data) => {
+        cssFile.innerHTML = data;
+        setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
+      })
+        .catch((err) => {
+        console.log('error ', err);
+      });
+    };
+  }
+  componentWillLoad() {
+    const promises = [];
+    if (this.endpoint && this.userId) {
+      const consentsPromise = this.getConsents().then((consents) => {
+        this.temporaryAccountConsent = consents.consents.some((consent) => consent.tagCode == 'temporaryaccountconsent');
+      });
+      promises.push(consentsPromise);
+    }
+    if (this.translationUrl) {
+      const translationPromise = getTranslations(this.translationUrl);
+      promises.push(translationPromise);
+    }
+    return Promise.all(promises);
+  }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.stylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      if (this.clientStylingUrl)
+        this.setClientStylingURL();
+      this.stylingAppends = true;
+    }
+    // end custom styling area
+  }
+  getConsents() {
+    const url = new URL(`${this.endpoint}/v1/player/${this.userId}/legislation/consents`);
+    const headers = new Headers();
+    headers.append('X-SessionId', this.sessionId);
+    headers.append('Accept', 'application/json');
+    const options = {
+      method: 'GET',
+      headers
+    };
+    return new Promise((resolve, reject) => {
+      this.isLoading = true;
+      fetch(url.href, options)
+        .then((res) => res.json())
+        .then((consents) => {
+        resolve(consents);
+      }).catch((err) => {
+        console.error(err);
+        reject(err);
+      }).finally(() => {
+        this.isLoading = false;
+      });
+    });
+  }
+  setConsents() {
+    const url = new URL(`${this.endpoint}/v1/player/${this.userId}/legislation/consents`);
+    const headers = new Headers();
+    headers.append('X-SessionId', this.sessionId);
+    headers.append('Accept', 'application/json');
+    headers.append('Content-Type', 'application/json');
+    const body = {
+      consents: [{
+          tagCode: 'temporaryaccountconsent',
+          note: '',
+          status: 1
+        }]
+    };
+    const options = {
+      method: 'POST',
+      headers,
+      body: JSON.stringify(body)
+    };
+    return new Promise((resolve, reject) => {
+      this.isLoading = true;
+      fetch(url.href, options)
+        .then((res) => res.json())
+        .then((res) => {
+        resolve(res);
+      }).catch((err) => {
+        console.error(err);
+        reject(err);
+      }).finally(() => {
+        this.isLoading = false;
+      });
+    });
+  }
+  handleDecline() {
+    window.postMessage({ type: 'TemporaryConsentsDeclined' }, window.location.href);
+  }
+  handleAccept() {
+    this.setConsents();
+    window.postMessage({ type: 'TemporaryConsentsAccepted' }, window.location.href);
+  }
+  render() {
+    if (this.temporaryAccountConsent) {
+      if (this.isLoading) {
+        return h("p", null, translate('loading', this.lang));
+      }
+      return h("div", { class: 'TemporaryConsents', ref: el => this.stylingContainer = el }, h("h2", { class: 'TemporaryConsentsTitle' }, " ", translate('title', this.lang), " "), h("p", { class: 'TemporaryConsentsText' }, " ", translate('description', this.lang, { values: { daysUntilLockout: this.daysUntilLockout } }), " "), h("div", { class: 'TemporaryConsentsButtonsWrapper' }, h("button", { class: 'TemporaryConsentsButton TemporaryConsentsButtonDecline', onClick: () => this.handleDecline() }, translate('declineButton', this.lang)), h("button", { class: 'TemporaryConsentsButton TemporaryConsentsButtonAccept', onClick: this.handleAccept }, translate('acceptButton', this.lang))));
+    }
+  }
+  static get style() { return temporaryConsentsCss; }
+}, [1, "temporary-consents", {
+    "endpoint": [513],
+    "userId": [513, "user-id"],
+    "sessionId": [513, "session-id"],
+    "daysUntilLockout": [513, "days-until-lockout"],
+    "lang": [513],
+    "clientStyling": [513, "client-styling"],
+    "clientStylingUrl": [513, "client-styling-url"],
+    "translationUrl": [513, "translation-url"],
+    "stylingAppends": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["temporary-consents"];
+  components.forEach(tagName => { switch (tagName) {
+    case "temporary-consents":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TemporaryConsents$1);
+      }
+      break;
+  } });
+}
+
+const TemporaryConsents = TemporaryConsents$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { TemporaryConsents, defineCustomElement };