@everymatrix/user-action-controller 1.31.2 → 1.32.4

package/dist/collection/components/user-action-controller/user-action-controller.js

@@ -1,440 +0,0 @@
-import { Component, h, Prop, Listen, State, Watch } from '@stencil/core';
-import { getTranslations, translate } from '../../utils/locale.utils';
-import '@everymatrix/player-user-consents';
-export class UserActionController {
-  constructor() {
-    /**
-    * Language
-    */
-    this.lang = 'en';
-    /**
-     * Select GM version
-     */
-    this.gmVersion = '';
-    /**
-    * Translation url
-    */
-    this.translationUrl = '';
-    /**
-     * Client custom styling via inline style
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Which actions are required in order to activate the "Apply" button. Other actions are considered optional.
-     */
-    this.queryFired = false;
-    this.readyActionsCount = 0;
-    this.activeUserActions = [];
-    this.userActionsValidated = true;
-    this.receivedQueryResponses = 0;
-    this.limitStylingAppends = false;
-    this.isLoading = true;
-    this.mandatoryActionsChecked = 0;
-    //for now this variable is hardcoded bcs we have only terms and conditions mandatory and we dont receive with these new functionality the mandatory actions
-    this.mandatoryActions = ['termsandconditions'];
-    this.userActions = [];
-    this.consentTitles = {
-      termsandconditions: translate('termsandconditions', this.lang),
-      sms: translate('sms', this.lang),
-      emailmarketing: translate('emailmarketing', this.lang)
-    };
-    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) => {
-        this.clientStyling = data;
-        cssFile.innerHTML = data;
-        setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
-      })
-        .catch((err) => {
-        console.log('error ', err);
-      });
-    };
-  }
-  handleNewTranslations() {
-    getTranslations(this.translationUrl);
-  }
-  handleQueryResponse() {
-    if (this.receivedQueryResponses === this.activeUserActions.length) {
-      this.updateUserConsents();
-    }
-  }
-  userLegislationConsentHandler(event) {
-    const actionType = event.detail.type;
-    const actionTypeChecked = event.detail.value;
-    if (this.mandatoryActions.includes(actionType) && this.queryFired === false) {
-      actionTypeChecked === true ? this.mandatoryActionsChecked++ : this.mandatoryActionsChecked--;
-    }
-    // Register final user choices only if we're ready to update
-    if (this.queryFired) {
-      this.userActions.push({ tagCode: actionType, status: actionTypeChecked ? 'Accepted' : 'Denied' });
-      this.receivedQueryResponses++;
-    }
-  }
-  determineUserActions() {
-    const url = new URL(`${this.endpoint}/v1/player/${this.userId}/consent`);
-    const headers = new Headers();
-    headers.append('X-SessionId', this.userSession);
-    let requestOptions;
-    requestOptions = {
-      method: 'GET',
-      headers
-    };
-    if (url && requestOptions) {
-      return fetch(url.href, requestOptions)
-        .then(res => res.json())
-        .then(data => {
-        const actionItems = data.items;
-        actionItems.forEach(element => {
-          if (element.status === 'Expired') {
-            this.activeUserActions.push(element.tagCode);
-          }
-        });
-        this.isLoading = false;
-      })
-        .catch(error => {
-        console.error('Error fetching data:', error);
-        this.isLoading = false;
-      });
-    }
-    else {
-      return Promise.reject('Unsupported endpoint');
-    }
-  }
-  updateUserConsents() {
-    let url;
-    let requestOptions;
-    url = (this.gmVersion === 'gmcore')
-      ? new URL(`${this.endpoint}/v1/player/${this.userId}/consent`)
-      : new URL(`${this.endpoint}/v1/player/${this.userId}/legislation/consents`);
-    const body = (this.gmVersion === 'gmcore')
-      ? {
-        items: this.userActions
-      }
-      : {
-        consents: [
-          {
-            tagCode: "termsandconditions",
-            note: "",
-            status: 1
-          }
-        ]
-      };
-    requestOptions = {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'Accept': 'application/json',
-        'X-SessionId': `${this.userSession}`,
-      },
-      body: JSON.stringify(body)
-    };
-    if (url && requestOptions) {
-      fetch(url.href, requestOptions)
-        .then(res => res.json())
-        .then(() => {
-        window.postMessage({
-          type: 'WidgetNotification',
-          data: {
-            type: 'success',
-            message: 'Consent update successful!'
-          }
-        }, window.location.href);
-      })
-        .catch((err) => {
-        window.postMessage({
-          type: 'WidgetNotification',
-          data: {
-            type: 'error',
-            message: 'Server might not be responding',
-            err
-          }
-        }, window.location.href);
-      })
-        .finally(() => {
-        window.postMessage({ type: 'UserActionsCompleted' }, window.location.href);
-      });
-    }
-  }
-  handleApplyClick() {
-    this.queryFired = true;
-  }
-  async componentWillLoad() {
-    if (this.gmVersion === 'gmcore') {
-      return this.determineUserActions();
-    }
-    else {
-      this.activeUserActions = ['termsandconditions'];
-      this.isLoading = false;
-    }
-    if (this.translationUrl.length > 2) {
-      await getTranslations(this.translationUrl);
-    }
-  }
-  componentDidRender() {
-    // start custom styling area
-    if (!this.limitStylingAppends && this.stylingContainer) {
-      if (this.clientStyling)
-        this.setClientStyling();
-      if (this.clientStylingUrl)
-        this.setClientStylingURL();
-      this.limitStylingAppends = true;
-    }
-    // end custom styling area
-  }
-  render() {
-    const isMandatoryPresent = this.mandatoryActions.every(action => this.activeUserActions.includes(action));
-    if (isMandatoryPresent) {
-      this.userActionsValidated = !(this.mandatoryActionsChecked === this.mandatoryActions.length);
-    }
-    else {
-      this.userActionsValidated = false;
-    }
-    return (h("div", { class: "QueryReferenceContainer", ref: el => this.stylingContainer = el }, this.isLoading ? (h("slot", { name: 'spinner' })
-      &&
-        h("svg", { class: "spinner", viewBox: "0 0 50 50" },
-          h("circle", { class: "path", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "5" }))) : (h("div", { class: "UserActionController" },
-      h("h2", { class: "UserConsentNotice" }, this.userNoticeText),
-      h("div", { class: "PlayerLegislationWrapper" }, this.activeUserActions.map(action => (h("slot", { name: action },
-        h("player-user-consents", { slot: action, consentType: action, consentTitle: this.consentTitles[action], queried: this.queryFired, mandatory: this.mandatoryActions.includes(action), "client-styling": this.clientStyling }))))),
-      this.includeSubmitButton &&
-        h("button", { class: "ConsentSubmitButton", disabled: this.userActionsValidated, onClick: () => this.handleApplyClick() }, this.submitButtonText)))));
-  }
-  static get is() { return "user-action-controller"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["user-action-controller.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["user-action-controller.css"]
-  }; }
-  static get properties() { return {
-    "endpoint": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "the endpoint required for the update call"
-      },
-      "attribute": "endpoint",
-      "reflect": true
-    },
-    "userSession": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "user session required for the update call"
-      },
-      "attribute": "user-session",
-      "reflect": true
-    },
-    "userId": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "user id required for the update call"
-      },
-      "attribute": "user-id",
-      "reflect": true
-    },
-    "lang": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Language"
-      },
-      "attribute": "lang",
-      "reflect": true,
-      "defaultValue": "'en'"
-    },
-    "includeSubmitButton": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "whether or not to include the submit button (in case we want to compose a different )"
-      },
-      "attribute": "include-submit-button",
-      "reflect": true
-    },
-    "submitButtonText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "the text of the button, if button is enabled"
-      },
-      "attribute": "submit-button-text",
-      "reflect": true
-    },
-    "userNoticeText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "the title of the action group"
-      },
-      "attribute": "user-notice-text",
-      "reflect": true
-    },
-    "gmVersion": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Select GM version"
-      },
-      "attribute": "gm-version",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "translationUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Translation url"
-      },
-      "attribute": "translation-url",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "clientStyling": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via inline style"
-      },
-      "attribute": "client-styling",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "clientStylingUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via url"
-      },
-      "attribute": "client-styling-url",
-      "reflect": true,
-      "defaultValue": "''"
-    }
-  }; }
-  static get states() { return {
-    "queryFired": {},
-    "readyActionsCount": {},
-    "activeUserActions": {},
-    "userActionsValidated": {},
-    "receivedQueryResponses": {},
-    "limitStylingAppends": {},
-    "isLoading": {},
-    "mandatoryActionsChecked": {}
-  }; }
-  static get watchers() { return [{
-      "propName": "translationUrl",
-      "methodName": "handleNewTranslations"
-    }, {
-      "propName": "receivedQueryResponses",
-      "methodName": "handleQueryResponse"
-    }]; }
-  static get listeners() { return [{
-      "name": "userLegislationConsent",
-      "method": "userLegislationConsentHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }]; }
-}

package/dist/collection/index.js

@@ -1 +0,0 @@
-export * from './components';

package/dist/collection/utils/locale.utils.js

@@ -1,60 +0,0 @@
-const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en', 'cz', 'de', 'hr'];
-const TRANSLATIONS = {
-  en: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-  ro: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-  hr: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-  fr: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-  cs: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-  de: {
-    termsandconditions: 'Terms and Conditions',
-    sms: 'SMS marketing',
-    emailmarketing: 'Email marketing'
-  },
-};
-export const getTranslations = (url) => {
-  // fetch url, get the data, replace the TRANSLATIONS content
-  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);
-    });
-  });
-};
-export 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;
-};

package/dist/collection/utils/utils.js

@@ -1,3 +0,0 @@
-export function format(first, middle, last) {
-  return ((first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : ''));
-}

package/dist/components/index.d.ts

@@ -1,26 +0,0 @@
-/* UserActionController 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

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

package/dist/components/player-user-consents.js

@@ -1,6 +0,0 @@
-import { P as PlayerUserConsents$1, d as defineCustomElement$1 } from './player-user-consents2.js';
-
-const PlayerUserConsents = PlayerUserConsents$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PlayerUserConsents, defineCustomElement };

package/dist/components/player-user-consents2.js

@@ -1,114 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-
-const playerUserConsentsCss = ":host{display:block}.ConsentTitle{margin-bottom:0.2rem;font-weight:600}.userConsent:hover{border-bottom:1px solid #000;cursor:pointer}.MandatoryItem{color:#f00;font-size:1.2rem}";
-
-const PlayerUserConsents = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.userLegislationConsent = createEvent(this, "userLegislationConsent", 7);
-    /**
-     * 'true' when parent expects component to emit it's current value
-     */
-    this.queried = false;
-    /**
-     * the type of the consent, used to determine render details
-     */
-    this.consentType = '';
-    /**
-     * wether or not this consent is mandatory. Used for render details
-     */
-    this.mandatory = false;
-    /**
-     * the title of the consent to be displayed
-     */
-    this.consentTitle = '';
-    /**
-     * link to the t&c page
-     */
-    this.tcLink = '#';
-    /**
-     * link to privacy policy page
-     */
-    this.privacyLink = '#';
-    /**
-     * Client custom styling via inline style
-     */
-    this.clientStyling = '';
-    /**
-     * the text content to be rendered by the component. Determined at runtime
-     */
-    this.textContent = '';
-    this.limitStylingAppends = false;
-    // Maybe switch this out with a localization source
-    this.stringVariants = {
-      termsandconditions1: "I accept the ",
-      termsandconditions2: ", I have read and understood the ",
-      termsandconditions3: " as published on this site and confirm that I am over 18 years old.",
-      tc: "Terms and Conditions",
-      privacy: "Privacy Policy",
-      sms: "I consent to receive marketing communication via SMS.",
-      emailmarketing: "I consent to receive marketing communication via Email."
-    };
-    this.setClientStyling = () => {
-      let sheet = document.createElement('style');
-      sheet.innerHTML = this.clientStyling;
-      this.stylingContainer.prepend(sheet);
-    };
-  }
-  determineTextContent() {
-    let result = this.consentType === 'termsandconditions' ?
-      h("span", null, this.stringVariants['termsandconditions1'], h("a", { href: this.tcLink }, this.stringVariants['tc']), this.stringVariants['termsandconditions2'], h("a", { href: this.privacyLink }, this.stringVariants['privacy']), this.stringVariants['termsandconditions3'])
-      : h("span", null, this.stringVariants[this.consentType]);
-    return result;
-  }
-  userLegislationConsentHandler() {
-    this.userLegislationConsent.emit({
-      type: this.consentType,
-      value: this.checkboxInput.checked
-    });
-  }
-  componentDidRender() {
-    // start custom styling area
-    if (!this.limitStylingAppends && this.stylingContainer) {
-      if (this.clientStyling)
-        this.setClientStyling();
-      this.limitStylingAppends = true;
-    }
-    // end custom styling area
-  }
-  render() {
-    if (this.queried) {
-      this.userLegislationConsentHandler();
-    }
-    this.textContent = this.determineTextContent();
-    return (h("div", { ref: el => this.stylingContainer = el }, h("p", { class: "ConsentTitle" }, this.consentTitle), h("label", { class: "userConsent", htmlFor: "userConsent" }, h("input", { ref: el => this.checkboxInput = el, id: "userConsent", type: "checkbox", onInput: () => this.userLegislationConsentHandler() }), this.textContent, this.mandatory && h("span", { class: "MandatoryItem" }, "*"))));
-  }
-  static get style() { return playerUserConsentsCss; }
-}, [1, "player-user-consents", {
-    "queried": [516],
-    "consentType": [513, "consent-type"],
-    "mandatory": [516],
-    "consentTitle": [513, "consent-title"],
-    "tcLink": [513, "tc-link"],
-    "privacyLink": [513, "privacy-link"],
-    "clientStyling": [1, "client-styling"],
-    "textContent": [32],
-    "limitStylingAppends": [32]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["player-user-consents"];
-  components.forEach(tagName => { switch (tagName) {
-    case "player-user-consents":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, PlayerUserConsents);
-      }
-      break;
-  } });
-}
-
-export { PlayerUserConsents as P, defineCustomElement as d };

package/dist/components/user-action-controller.d.ts

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