@everymatrix/promoting-banners 1.87.25 → 1.87.27

package/dist/cjs/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const promotingBanners = require('./promoting-banners-a0a2d6b3.js');
+const promotingBanners = require('./promoting-banners-5f045228.js');
 require('./index-cb64c2ca.js');
 
 

package/dist/cjs/{promoting-banners-a0a2d6b3.js → promoting-banners-5f045228.js}

@@ -79,6 +79,8 @@ const getTranslations = (url) => {
     });
 };
 
+const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
+
 /**
  * @name setClientStyling
  * @description Method used to create and append to the passed element of the widget a style element with the content received
@@ -124,18 +126,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
  * @param {HTMLElement} stylingContainer The highest element of the widget
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
  */
-function setStreamStyling(stylingContainer, domain, subscription) {
-  if (window.emMessageBus) {
-    const sheet = document.createElement('style');
+function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
 
-    window.emMessageBus.subscribe(domain, (data) => {
-      sheet.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(sheet);
-      }
-    });
+  const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
+
+  if (!supportAdoptStyle || !useAdoptedStyleSheets) {
+    subscription = getStyleTagSubscription(stylingContainer, domain);
+
+    return subscription;
+  }
+
+  if (!window[StyleCacheKey]) {
+    window[StyleCacheKey] = {};
   }
+  subscription = getAdoptStyleSubscription(stylingContainer, domain);
+
+  const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
+  const wrappedUnsubscribe = () => {
+    if (window[StyleCacheKey][domain]) {
+      const cachedObject = window[StyleCacheKey][domain];
+      cachedObject.refCount > 1
+        ? (cachedObject.refCount = cachedObject.refCount - 1)
+        : delete window[StyleCacheKey][domain];
+    }
+
+    originalUnsubscribe();
+  };
+  subscription.unsubscribe = wrappedUnsubscribe;
+
+  return subscription;
+}
+
+function getStyleTagSubscription(stylingContainer, domain) {
+  const sheet = document.createElement('style');
+
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (stylingContainer) {
+      sheet.innerHTML = data;
+      stylingContainer.appendChild(sheet);
+    }
+  });
+}
+
+function getAdoptStyleSubscription(stylingContainer, domain) {
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (!stylingContainer) return;
+
+    const shadowRoot = stylingContainer.getRootNode();
+    const cacheStyleObject = window[StyleCacheKey];
+    let cachedStyle = cacheStyleObject[domain]?.sheet;
+
+    if (!cachedStyle) {
+      cachedStyle = new CSSStyleSheet();
+      cachedStyle.replaceSync(data);
+      cacheStyleObject[domain] = {
+        sheet: cachedStyle,
+        refCount: 1
+      };
+    } else {
+      cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
+    }
+
+    const currentSheets = shadowRoot.adoptedStyleSheets || [];
+    if (!currentSheets.includes(cachedStyle)) {
+      shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
+    }
+  });
 }
 
 const promotingBannersCss = ".PromotingBannersIconContainer img{width:50px;height:50px;border-radius:var(--emw--border-radius-image, 50%);background-size:contain;margin:10px}.PromotingBannersSection{padding:10px;border-radius:var(--emw--border-radius-small, 5px);background-color:var(--emw--promo-color-background, var(--emw--color-background, #2f2f2f));background-repeat:no-repeat;background-position:center;color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff));font-family:var(--emw--font-family-primary, \"Montserrat\", sans-serif);overflow:hidden;position:relative}.PromotingBannersGrid{display:grid;grid-gap:30px;background-size:contain;background-repeat:no-repeat;padding:10px;width:100%;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));box-sizing:border-box}.PromotingBannersContent{color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff))}.PromotingBannersContent p{display:block;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.PromotingBannersHeader{display:flex;justify-content:center;flex-direction:column;align-items:center}.PromotingBannersHeader p{text-align:center}.PromotingBannersBox{min-width:200px;display:flex;justify-content:flex-start;overflow:hidden;flex-direction:row;gap:20px;text-decoration:none;color:inherit;background-size:cover;background-position:center;border-radius:var(--emw--border-radius-small, 5px)}.PromotingBannersSectionTitle,.PromotingBannersSectionSubtitle{margin:10px auto;background:transparent}.PromotingBannersTextContainer{margin:5px;overflow:hidden;position:relative;padding-bottom:30px}.PromotingBannersTitle{margin:5px auto}.PromotingBannersButton{cursor:pointer;color:inherit;text-decoration:none;position:absolute;bottom:5px;border:0;background:transparent}.ButtonDisabled{cursor:not-allowed}.PromotionalBannersTextContainer{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AboutUsError .ErrorInfo{color:var(--emw--promo-color-error, var(--emw--color-error, #ed0909))}.SkeletonGrid{display:grid}.Skeleton{animation:skeleton-loading 0.6s linear infinite alternate}@keyframes skeleton-loading{0%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.2) 0%, rgba(0, 61, 93, 0.2) 100%)}12%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.225) 0%, rgba(0, 61, 93, 0.225) 100%)}25%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.25) 0%, rgba(0, 61, 93, 0.25) 100%)}33%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.275) 0%, rgba(0, 61, 93, 0.275) 100%)}50%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.3) 0%, rgba(0, 61, 93, 0.3) 100%)}63%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.325) 0%, rgba(0, 61, 93, 0.325) 100%)}75%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.35) 0%, rgba(0, 61, 93, 0.35) 100%)}88%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.375) 0%, rgba(0, 61, 93, 0.375) 100%)}100%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.4) 0%, rgba(0, 61, 93, 0.4) 100%)}}.SkeletonItem{opacity:0.5;margin:0 15px;width:125px;height:150px;border-radius:var(--emw--border-radius-medium, 15px);margin:20px}";
@@ -181,7 +240,7 @@ const PromotingBanners = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (window.emMessageBus != undefined) {
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             }
             else {
                 if (this.clientStyling)

package/dist/cjs/promoting-banners.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const promotingBanners = require('./promoting-banners-a0a2d6b3.js');
+const promotingBanners = require('./promoting-banners-5f045228.js');
 require('./index-cb64c2ca.js');
 
 

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { P as PromotingBanners } from './promoting-banners-06f6cf10.js';
+export { P as PromotingBanners } from './promoting-banners-043c1e67.js';
 import './index-43b1379d.js';

package/dist/esm/{promoting-banners-06f6cf10.js → promoting-banners-043c1e67.js}

@@ -77,6 +77,8 @@ const getTranslations = (url) => {
     });
 };
 
+const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
+
 /**
  * @name setClientStyling
  * @description Method used to create and append to the passed element of the widget a style element with the content received
@@ -122,18 +124,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
  * @param {HTMLElement} stylingContainer The highest element of the widget
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
  */
-function setStreamStyling(stylingContainer, domain, subscription) {
-  if (window.emMessageBus) {
-    const sheet = document.createElement('style');
+function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
 
-    window.emMessageBus.subscribe(domain, (data) => {
-      sheet.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(sheet);
-      }
-    });
+  const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
+
+  if (!supportAdoptStyle || !useAdoptedStyleSheets) {
+    subscription = getStyleTagSubscription(stylingContainer, domain);
+
+    return subscription;
+  }
+
+  if (!window[StyleCacheKey]) {
+    window[StyleCacheKey] = {};
   }
+  subscription = getAdoptStyleSubscription(stylingContainer, domain);
+
+  const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
+  const wrappedUnsubscribe = () => {
+    if (window[StyleCacheKey][domain]) {
+      const cachedObject = window[StyleCacheKey][domain];
+      cachedObject.refCount > 1
+        ? (cachedObject.refCount = cachedObject.refCount - 1)
+        : delete window[StyleCacheKey][domain];
+    }
+
+    originalUnsubscribe();
+  };
+  subscription.unsubscribe = wrappedUnsubscribe;
+
+  return subscription;
+}
+
+function getStyleTagSubscription(stylingContainer, domain) {
+  const sheet = document.createElement('style');
+
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (stylingContainer) {
+      sheet.innerHTML = data;
+      stylingContainer.appendChild(sheet);
+    }
+  });
+}
+
+function getAdoptStyleSubscription(stylingContainer, domain) {
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (!stylingContainer) return;
+
+    const shadowRoot = stylingContainer.getRootNode();
+    const cacheStyleObject = window[StyleCacheKey];
+    let cachedStyle = cacheStyleObject[domain]?.sheet;
+
+    if (!cachedStyle) {
+      cachedStyle = new CSSStyleSheet();
+      cachedStyle.replaceSync(data);
+      cacheStyleObject[domain] = {
+        sheet: cachedStyle,
+        refCount: 1
+      };
+    } else {
+      cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
+    }
+
+    const currentSheets = shadowRoot.adoptedStyleSheets || [];
+    if (!currentSheets.includes(cachedStyle)) {
+      shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
+    }
+  });
 }
 
 const promotingBannersCss = ".PromotingBannersIconContainer img{width:50px;height:50px;border-radius:var(--emw--border-radius-image, 50%);background-size:contain;margin:10px}.PromotingBannersSection{padding:10px;border-radius:var(--emw--border-radius-small, 5px);background-color:var(--emw--promo-color-background, var(--emw--color-background, #2f2f2f));background-repeat:no-repeat;background-position:center;color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff));font-family:var(--emw--font-family-primary, \"Montserrat\", sans-serif);overflow:hidden;position:relative}.PromotingBannersGrid{display:grid;grid-gap:30px;background-size:contain;background-repeat:no-repeat;padding:10px;width:100%;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));box-sizing:border-box}.PromotingBannersContent{color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff))}.PromotingBannersContent p{display:block;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.PromotingBannersHeader{display:flex;justify-content:center;flex-direction:column;align-items:center}.PromotingBannersHeader p{text-align:center}.PromotingBannersBox{min-width:200px;display:flex;justify-content:flex-start;overflow:hidden;flex-direction:row;gap:20px;text-decoration:none;color:inherit;background-size:cover;background-position:center;border-radius:var(--emw--border-radius-small, 5px)}.PromotingBannersSectionTitle,.PromotingBannersSectionSubtitle{margin:10px auto;background:transparent}.PromotingBannersTextContainer{margin:5px;overflow:hidden;position:relative;padding-bottom:30px}.PromotingBannersTitle{margin:5px auto}.PromotingBannersButton{cursor:pointer;color:inherit;text-decoration:none;position:absolute;bottom:5px;border:0;background:transparent}.ButtonDisabled{cursor:not-allowed}.PromotionalBannersTextContainer{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AboutUsError .ErrorInfo{color:var(--emw--promo-color-error, var(--emw--color-error, #ed0909))}.SkeletonGrid{display:grid}.Skeleton{animation:skeleton-loading 0.6s linear infinite alternate}@keyframes skeleton-loading{0%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.2) 0%, rgba(0, 61, 93, 0.2) 100%)}12%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.225) 0%, rgba(0, 61, 93, 0.225) 100%)}25%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.25) 0%, rgba(0, 61, 93, 0.25) 100%)}33%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.275) 0%, rgba(0, 61, 93, 0.275) 100%)}50%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.3) 0%, rgba(0, 61, 93, 0.3) 100%)}63%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.325) 0%, rgba(0, 61, 93, 0.325) 100%)}75%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.35) 0%, rgba(0, 61, 93, 0.35) 100%)}88%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.375) 0%, rgba(0, 61, 93, 0.375) 100%)}100%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.4) 0%, rgba(0, 61, 93, 0.4) 100%)}}.SkeletonItem{opacity:0.5;margin:0 15px;width:125px;height:150px;border-radius:var(--emw--border-radius-medium, 15px);margin:20px}";
@@ -179,7 +238,7 @@ const PromotingBanners = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (window.emMessageBus != undefined) {
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             }
             else {
                 if (this.clientStyling)

package/dist/esm/promoting-banners.entry.js

@@ -1,2 +1,2 @@
-export { P as promoting_banners } from './promoting-banners-06f6cf10.js';
+export { P as promoting_banners } from './promoting-banners-043c1e67.js';
 import './index-43b1379d.js';

package/dist/promoting-banners/index.esm.js

@@ -1 +1 @@
-export{P as PromotingBanners}from"./promoting-banners-06f6cf10.js";import"./index-43b1379d.js";
+export{P as PromotingBanners}from"./promoting-banners-043c1e67.js";import"./index-43b1379d.js";

package/dist/promoting-banners/promoting-banners-043c1e67.js

@@ -0,0 +1 @@
+import{r as e,h as n}from"./index-43b1379d.js";const r=()=>{let e=window.navigator.userAgent;return e.toLowerCase().match(/android/i)?"Android":e.toLowerCase().match(/iphone/i)?"iPhone":e.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"},o={en:{error:"Error",noResults:"Loading, please wait ..."},hu:{error:"Error",noResults:"Loading, please wait ..."},ro:{error:"Eroare",noResults:"Loading, please wait ..."},fr:{error:"Error",noResults:"Loading, please wait ..."},ar:{error:"خطأ",noResults:"Loading, please wait ..."},hr:{error:"Greška",noResults:"Učitavanje, molimo pričekajte ..."}},i=e=>new Promise(((n,r)=>{fetch(e).then((e=>e.json())).then((e=>{Object.keys(e).forEach((n=>{for(let r in e[n])o[n][r]=e[n][r]})),n(o)})).catch((e=>{r(e)}))})),t="__WIDGET_GLOBAL_STYLE_CACHE__";function a(e,n){if(e){const r=document.createElement("style");r.innerHTML=n,e.appendChild(r)}}function s(e,n){if(!e||!n)return;const r=new URL(n);fetch(r.href).then((e=>e.text())).then((n=>{const r=document.createElement("style");r.innerHTML=n,e&&e.appendChild(r)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}const d=class{constructor(n){e(this,n),this.cmsEndpoint="",this.language="en",this.cmsEnv="",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.promotingBannersArray=[],this.hasErrors=!1,this.isLoading=!0,this.translationData=void 0}handleClientStylingChange(e,n){e!=n&&a(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(e,n){e!=n&&this.clientStylingUrl&&s(this.stylingContainer,this.clientStylingUrl)}handleNewTranslations(){this.isLoading=!0,i(this.translationUrl).then((()=>{this.isLoading=!1}))}connectedCallback(){this.cmsEndpoint&&this.language&&this.getPromotingBanners()}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(e,n,r,o=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!o)return function(e,n){const r=document.createElement("style");return window.emMessageBus.subscribe(n,(n=>{e&&(r.innerHTML=n,e.appendChild(r))}))}(e,n);window[t]||(window[t]={});const i=(r=function(e,n){return window.emMessageBus.subscribe(n,(r=>{if(!e)return;const o=e.getRootNode(),i=window[t];let a=i[n]?.sheet;a?i[n].refCount=i[n].refCount+1:(a=new CSSStyleSheet,a.replaceSync(r),i[n]={sheet:a,refCount:1});const s=o.adoptedStyleSheets||[];s.includes(a)||(o.adoptedStyleSheets=[...s,a])}))}(e,n)).unsubscribe.bind(r);r.unsubscribe=()=>{if(window[t][n]){const e=window[t][n];e.refCount>1?e.refCount=e.refCount-1:delete window[t][n]}i()}}(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription):(this.clientStyling&&a(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&s(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}getPromotingBanners(){const e=new URL(`${this.cmsEndpoint}/${this.language}/homepage`),n=new URLSearchParams;n.append("language",this.language),n.append("env",this.cmsEnv),n.append("device",(()=>{const e=r();if(e)return"PC"===e?"dk":"mtWeb"})()),e.search=n.toString();let o={method:"GET",headers:{"Content-Type":"application/json",Accept:"application/json"}};return new Promise(((n,r)=>{this.isLoading=!0,fetch(e.href,o).then((e=>e.json())).then((e=>{const{promotingBanners:r}=e;this.promotingBannersArray=r,n(r)})).catch((e=>{console.error("Error fetching data:",e),this.hasErrors=!0,r(e)})).finally((()=>{this.isLoading=!1}))}))}sendOpenLink(e,n,r){window.postMessage({type:"NavigateTo",path:e,target:r||null,externalLink:n||!1},window.location.href)}async componentWillLoad(){const e=[];if(this.translationUrl){const n=i(this.translationUrl).then((e=>{this.translationData=JSON.stringify(e)})).catch((e=>{console.log(e)}));e.push(n)}return Promise.all(e)}renderBannersGrid(e){var o,i,t;return n("a",{class:"PromotingBannersBox",href:null==e?void 0:e.url,target:e.targetType,style:{backgroundImage:`url(${null==e?void 0:e.backgroundImage})`}},n("div",{class:"PromotingBannersIconContainer"},n("img",{src:"Android"===r()||"iPhone"===r()?null===(o=e.icon)||void 0===o?void 0:o.mobile:"iPad"===r()?null===(i=e.image)||void 0===i?void 0:i.srcTablet:null===(t=e.icon)||void 0===t?void 0:t.desktop,alt:"Banner image"})),n("div",{class:"PromotingBannersTextContainer"},n("h3",{class:"PromotingBannersTitle"},null==e?void 0:e.title),n("div",{class:"PromotingBannersContent",innerHTML:null==e?void 0:e.description}),e.button&&n("button",{class:"PromotingBannersButton "+((null==e?void 0:e.button.text)?"":"ButtonDisabled"),innerHTML:null==e?void 0:e.button.text,onClick:this.sendOpenLink.bind(this,null==e?void 0:e.button.url,null==e?void 0:e.button.externalLink,null==e?void 0:e.button.target)})))}render(){var e,i,t,a,s;return n("div",{key:"3781ba5f4b63bbf1c9426c509e12c52a126b516a",class:"PromotingBannersSection",ref:e=>this.stylingContainer=e},this.hasErrors&&n("div",{key:"395769f146608f99dfd2b5f2547ffe0229bdf8b3",class:"AboutUsError"},n("div",{key:"01d2dccd1a1ba0f0cbfaf6ead8e98dabf1f94985",class:"ErrorInfo"},o[void 0!==(s=this.language)&&s in o?s:"en"].error)),this.isLoading&&n("div",{key:"6a832d41a9864e2d92f4025a897701bb4d6f922c",class:"SkeletonGrid"},new Array(4).fill(null).map((e=>n("div",{key:e,class:"Skeleton SkeletonItem"})))),!this.isLoading&&n("div",{key:"e0c315ec38923a7e0bc733afec2be84a1c8aa3e0",class:"PromotingBannersWrapper"},n("div",{key:"e7aadacb97a159e6ee44e5f56c6dd98f9e5dd39a",class:"PC"===r()?"PromotingBannersHeader":"PromotingBannersHeader PromotingBannersHeaderMobile"},(null===(e=this.promotingBannersArray)||void 0===e?void 0:e.title)&&n("h1",{key:"8f3d009d52498f2ee9c192a9981530728b878a8e",class:"PromotingBannersSectionTitle"},null===(i=this.promotingBannersArray)||void 0===i?void 0:i.title),(null===(t=this.promotingBannersArray)||void 0===t?void 0:t.description)&&n("h5",{key:"4baa09943e71f24ee66a90e85722eab17d37f54c",class:"PromotingBannersSectionSubtitle",style:{display:"PC"!==r()?"inline-block":"none"},innerHTML:null===(a=this.promotingBannersArray)||void 0===a?void 0:a.description})),n("div",{key:"fb10bb5f47c7f45f5f5ac7e3fcc7ddc11ded2516",class:"PromotingBannersGrid"},this.promotingBannersArray.map((e=>this.renderBannersGrid(e))))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"]}}};d.style='.PromotingBannersIconContainer img{width:50px;height:50px;border-radius:var(--emw--border-radius-image, 50%);background-size:contain;margin:10px}.PromotingBannersSection{padding:10px;border-radius:var(--emw--border-radius-small, 5px);background-color:var(--emw--promo-color-background, var(--emw--color-background, #2f2f2f));background-repeat:no-repeat;background-position:center;color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff));font-family:var(--emw--font-family-primary, "Montserrat", sans-serif);overflow:hidden;position:relative}.PromotingBannersGrid{display:grid;grid-gap:30px;background-size:contain;background-repeat:no-repeat;padding:10px;width:100%;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));box-sizing:border-box}.PromotingBannersContent{color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff))}.PromotingBannersContent p{display:block;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.PromotingBannersHeader{display:flex;justify-content:center;flex-direction:column;align-items:center}.PromotingBannersHeader p{text-align:center}.PromotingBannersBox{min-width:200px;display:flex;justify-content:flex-start;overflow:hidden;flex-direction:row;gap:20px;text-decoration:none;color:inherit;background-size:cover;background-position:center;border-radius:var(--emw--border-radius-small, 5px)}.PromotingBannersSectionTitle,.PromotingBannersSectionSubtitle{margin:10px auto;background:transparent}.PromotingBannersTextContainer{margin:5px;overflow:hidden;position:relative;padding-bottom:30px}.PromotingBannersTitle{margin:5px auto}.PromotingBannersButton{cursor:pointer;color:inherit;text-decoration:none;position:absolute;bottom:5px;border:0;background:transparent}.ButtonDisabled{cursor:not-allowed}.PromotionalBannersTextContainer{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AboutUsError .ErrorInfo{color:var(--emw--promo-color-error, var(--emw--color-error, #ed0909))}.SkeletonGrid{display:grid}.Skeleton{animation:skeleton-loading 0.6s linear infinite alternate}@keyframes skeleton-loading{0%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.2) 0%, rgba(0, 61, 93, 0.2) 100%)}12%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.225) 0%, rgba(0, 61, 93, 0.225) 100%)}25%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.25) 0%, rgba(0, 61, 93, 0.25) 100%)}33%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.275) 0%, rgba(0, 61, 93, 0.275) 100%)}50%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.3) 0%, rgba(0, 61, 93, 0.3) 100%)}63%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.325) 0%, rgba(0, 61, 93, 0.325) 100%)}75%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.35) 0%, rgba(0, 61, 93, 0.35) 100%)}88%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.375) 0%, rgba(0, 61, 93, 0.375) 100%)}100%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.4) 0%, rgba(0, 61, 93, 0.4) 100%)}}.SkeletonItem{opacity:0.5;margin:0 15px;width:125px;height:150px;border-radius:var(--emw--border-radius-medium, 15px);margin:20px}';export{d as P}

package/dist/promoting-banners/promoting-banners.entry.js

@@ -1 +1 @@
-export{P as promoting_banners}from"./promoting-banners-06f6cf10.js";import"./index-43b1379d.js";
+export{P as promoting_banners}from"./promoting-banners-043c1e67.js";import"./index-43b1379d.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/promoting-banners",
-  "version": "1.87.25",
+  "version": "1.87.27",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/promoting-banners/promoting-banners-06f6cf10.js

@@ -1 +0,0 @@
-import{r as e,h as n}from"./index-43b1379d.js";const r=()=>{let e=window.navigator.userAgent;return e.toLowerCase().match(/android/i)?"Android":e.toLowerCase().match(/iphone/i)?"iPhone":e.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"},o={en:{error:"Error",noResults:"Loading, please wait ..."},hu:{error:"Error",noResults:"Loading, please wait ..."},ro:{error:"Eroare",noResults:"Loading, please wait ..."},fr:{error:"Error",noResults:"Loading, please wait ..."},ar:{error:"خطأ",noResults:"Loading, please wait ..."},hr:{error:"Greška",noResults:"Učitavanje, molimo pričekajte ..."}},i=e=>new Promise(((n,r)=>{fetch(e).then((e=>e.json())).then((e=>{Object.keys(e).forEach((n=>{for(let r in e[n])o[n][r]=e[n][r]})),n(o)})).catch((e=>{r(e)}))}));function t(e,n){if(e){const r=document.createElement("style");r.innerHTML=n,e.appendChild(r)}}function a(e,n){if(!e||!n)return;const r=new URL(n);fetch(r.href).then((e=>e.text())).then((n=>{const r=document.createElement("style");r.innerHTML=n,e&&e.appendChild(r)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}const s=class{constructor(n){e(this,n),this.cmsEndpoint="",this.language="en",this.cmsEnv="",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.promotingBannersArray=[],this.hasErrors=!1,this.isLoading=!0,this.translationData=void 0}handleClientStylingChange(e,n){e!=n&&t(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(e,n){e!=n&&this.clientStylingUrl&&a(this.stylingContainer,this.clientStylingUrl)}handleNewTranslations(){this.isLoading=!0,i(this.translationUrl).then((()=>{this.isLoading=!1}))}connectedCallback(){this.cmsEndpoint&&this.language&&this.getPromotingBanners()}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(e,n){if(window.emMessageBus){const r=document.createElement("style");window.emMessageBus.subscribe(n,(n=>{r.innerHTML=n,e&&e.appendChild(r)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&t(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&a(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}getPromotingBanners(){const e=new URL(`${this.cmsEndpoint}/${this.language}/homepage`),n=new URLSearchParams;n.append("language",this.language),n.append("env",this.cmsEnv),n.append("device",(()=>{const e=r();if(e)return"PC"===e?"dk":"mtWeb"})()),e.search=n.toString();let o={method:"GET",headers:{"Content-Type":"application/json",Accept:"application/json"}};return new Promise(((n,r)=>{this.isLoading=!0,fetch(e.href,o).then((e=>e.json())).then((e=>{const{promotingBanners:r}=e;this.promotingBannersArray=r,n(r)})).catch((e=>{console.error("Error fetching data:",e),this.hasErrors=!0,r(e)})).finally((()=>{this.isLoading=!1}))}))}sendOpenLink(e,n,r){window.postMessage({type:"NavigateTo",path:e,target:r||null,externalLink:n||!1},window.location.href)}async componentWillLoad(){const e=[];if(this.translationUrl){const n=i(this.translationUrl).then((e=>{this.translationData=JSON.stringify(e)})).catch((e=>{console.log(e)}));e.push(n)}return Promise.all(e)}renderBannersGrid(e){var o,i,t;return n("a",{class:"PromotingBannersBox",href:null==e?void 0:e.url,target:e.targetType,style:{backgroundImage:`url(${null==e?void 0:e.backgroundImage})`}},n("div",{class:"PromotingBannersIconContainer"},n("img",{src:"Android"===r()||"iPhone"===r()?null===(o=e.icon)||void 0===o?void 0:o.mobile:"iPad"===r()?null===(i=e.image)||void 0===i?void 0:i.srcTablet:null===(t=e.icon)||void 0===t?void 0:t.desktop,alt:"Banner image"})),n("div",{class:"PromotingBannersTextContainer"},n("h3",{class:"PromotingBannersTitle"},null==e?void 0:e.title),n("div",{class:"PromotingBannersContent",innerHTML:null==e?void 0:e.description}),e.button&&n("button",{class:"PromotingBannersButton "+((null==e?void 0:e.button.text)?"":"ButtonDisabled"),innerHTML:null==e?void 0:e.button.text,onClick:this.sendOpenLink.bind(this,null==e?void 0:e.button.url,null==e?void 0:e.button.externalLink,null==e?void 0:e.button.target)})))}render(){var e,i,t,a,s;return n("div",{key:"3781ba5f4b63bbf1c9426c509e12c52a126b516a",class:"PromotingBannersSection",ref:e=>this.stylingContainer=e},this.hasErrors&&n("div",{key:"395769f146608f99dfd2b5f2547ffe0229bdf8b3",class:"AboutUsError"},n("div",{key:"01d2dccd1a1ba0f0cbfaf6ead8e98dabf1f94985",class:"ErrorInfo"},o[void 0!==(s=this.language)&&s in o?s:"en"].error)),this.isLoading&&n("div",{key:"6a832d41a9864e2d92f4025a897701bb4d6f922c",class:"SkeletonGrid"},new Array(4).fill(null).map((e=>n("div",{key:e,class:"Skeleton SkeletonItem"})))),!this.isLoading&&n("div",{key:"e0c315ec38923a7e0bc733afec2be84a1c8aa3e0",class:"PromotingBannersWrapper"},n("div",{key:"e7aadacb97a159e6ee44e5f56c6dd98f9e5dd39a",class:"PC"===r()?"PromotingBannersHeader":"PromotingBannersHeader PromotingBannersHeaderMobile"},(null===(e=this.promotingBannersArray)||void 0===e?void 0:e.title)&&n("h1",{key:"8f3d009d52498f2ee9c192a9981530728b878a8e",class:"PromotingBannersSectionTitle"},null===(i=this.promotingBannersArray)||void 0===i?void 0:i.title),(null===(t=this.promotingBannersArray)||void 0===t?void 0:t.description)&&n("h5",{key:"4baa09943e71f24ee66a90e85722eab17d37f54c",class:"PromotingBannersSectionSubtitle",style:{display:"PC"!==r()?"inline-block":"none"},innerHTML:null===(a=this.promotingBannersArray)||void 0===a?void 0:a.description})),n("div",{key:"fb10bb5f47c7f45f5f5ac7e3fcc7ddc11ded2516",class:"PromotingBannersGrid"},this.promotingBannersArray.map((e=>this.renderBannersGrid(e))))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"]}}};s.style='.PromotingBannersIconContainer img{width:50px;height:50px;border-radius:var(--emw--border-radius-image, 50%);background-size:contain;margin:10px}.PromotingBannersSection{padding:10px;border-radius:var(--emw--border-radius-small, 5px);background-color:var(--emw--promo-color-background, var(--emw--color-background, #2f2f2f));background-repeat:no-repeat;background-position:center;color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff));font-family:var(--emw--font-family-primary, "Montserrat", sans-serif);overflow:hidden;position:relative}.PromotingBannersGrid{display:grid;grid-gap:30px;background-size:contain;background-repeat:no-repeat;padding:10px;width:100%;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));box-sizing:border-box}.PromotingBannersContent{color:var(--emw--promo-color-primary, var(--emw--color-primary, #fff))}.PromotingBannersContent p{display:block;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis;word-break:break-all}.PromotingBannersHeader{display:flex;justify-content:center;flex-direction:column;align-items:center}.PromotingBannersHeader p{text-align:center}.PromotingBannersBox{min-width:200px;display:flex;justify-content:flex-start;overflow:hidden;flex-direction:row;gap:20px;text-decoration:none;color:inherit;background-size:cover;background-position:center;border-radius:var(--emw--border-radius-small, 5px)}.PromotingBannersSectionTitle,.PromotingBannersSectionSubtitle{margin:10px auto;background:transparent}.PromotingBannersTextContainer{margin:5px;overflow:hidden;position:relative;padding-bottom:30px}.PromotingBannersTitle{margin:5px auto}.PromotingBannersButton{cursor:pointer;color:inherit;text-decoration:none;position:absolute;bottom:5px;border:0;background:transparent}.ButtonDisabled{cursor:not-allowed}.PromotionalBannersTextContainer{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AboutUsError .ErrorInfo{color:var(--emw--promo-color-error, var(--emw--color-error, #ed0909))}.SkeletonGrid{display:grid}.Skeleton{animation:skeleton-loading 0.6s linear infinite alternate}@keyframes skeleton-loading{0%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.2) 0%, rgba(0, 61, 93, 0.2) 100%)}12%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.225) 0%, rgba(0, 61, 93, 0.225) 100%)}25%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.25) 0%, rgba(0, 61, 93, 0.25) 100%)}33%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.275) 0%, rgba(0, 61, 93, 0.275) 100%)}50%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.3) 0%, rgba(0, 61, 93, 0.3) 100%)}63%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.325) 0%, rgba(0, 61, 93, 0.325) 100%)}75%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.35) 0%, rgba(0, 61, 93, 0.35) 100%)}88%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.375) 0%, rgba(0, 61, 93, 0.375) 100%)}100%{background:linear-gradient(90deg, rgba(35, 178, 78, 0.4) 0%, rgba(0, 61, 93, 0.4) 100%)}}.SkeletonItem{opacity:0.5;margin:0 15px;width:125px;height:150px;border-radius:var(--emw--border-radius-medium, 15px);margin:20px}';export{s as P}