@everymatrix/lottery-tipping-ticket-controller 1.87.25 → 1.87.27

package/dist/cjs/general-tooltip_7.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-3e1fe885.js');
-const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-59ee8536.js');
+const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-38883843.js');
 
 /**
  * @name startOfDay
@@ -117,7 +117,7 @@ const GeneralTooltip = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -126,7 +126,7 @@ const GeneralTooltip = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -271,7 +271,7 @@ const LotteryButton = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     disconnectedCallback() {
@@ -280,7 +280,7 @@ const LotteryButton = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -373,13 +373,13 @@ const LotteryTippingBullet = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -465,13 +465,13 @@ const LotteryTippingBulletGroup = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -591,7 +591,7 @@ const LotteryTippingTicketBanner = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     async componentWillLoad() {
@@ -602,7 +602,7 @@ const LotteryTippingTicketBanner = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -906,7 +906,7 @@ const LotteryTippingTicketBet = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     disconnectedCallback() {
@@ -920,7 +920,7 @@ const LotteryTippingTicketBet = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 lotteryTippingTicketController.setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)

package/dist/cjs/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-59ee8536.js');
+const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-38883843.js');
 require('./index-3e1fe885.js');
 
 

package/dist/cjs/{lottery-tipping-ticket-controller-59ee8536.js → lottery-tipping-ticket-controller-38883843.js}

@@ -6662,6 +6662,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       <div on-click="_scrollForward" part="forward-button" aria-hidden="true"></div>
     `}static get is(){return "vaadin-tabs"}}v(vh);
 
+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
@@ -6707,18 +6709,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];
+    }
+  });
 }
 
 var PlayModeEnum;
@@ -9681,7 +9740,7 @@ const LotteryTippingTicketController = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -9692,7 +9751,7 @@ const LotteryTippingTicketController = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)

package/dist/esm/general-tooltip_7.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, g as getElement, c as createEvent } from './index-e3ec645c.js';
-import { r as requiredArgs, t as toDate, s as setClientStyling, a as setClientStylingURL, b as setStreamStyling, f as formatDate$1, c as resolveTranslationUrl$1, p as parseISO, d as format } from './lottery-tipping-ticket-controller-f0d23f7a.js';
-export { L as lottery_tipping_ticket_controller } from './lottery-tipping-ticket-controller-f0d23f7a.js';
+import { r as requiredArgs, t as toDate, s as setClientStyling, a as setClientStylingURL, b as setStreamStyling, f as formatDate$1, c as resolveTranslationUrl$1, p as parseISO, d as format } from './lottery-tipping-ticket-controller-7714da55.js';
+export { L as lottery_tipping_ticket_controller } from './lottery-tipping-ticket-controller-7714da55.js';
 
 /**
  * @name startOfDay
@@ -114,7 +114,7 @@ const GeneralTooltip = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -123,7 +123,7 @@ const GeneralTooltip = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -268,7 +268,7 @@ const LotteryButton = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     disconnectedCallback() {
@@ -277,7 +277,7 @@ const LotteryButton = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -370,13 +370,13 @@ const LotteryTippingBullet = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -462,13 +462,13 @@ const LotteryTippingBulletGroup = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -588,7 +588,7 @@ const LotteryTippingTicketBanner = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     async componentWillLoad() {
@@ -599,7 +599,7 @@ const LotteryTippingTicketBanner = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)
@@ -903,7 +903,7 @@ const LotteryTippingTicketBet = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     disconnectedCallback() {
@@ -917,7 +917,7 @@ const LotteryTippingTicketBet = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { L as LotteryTippingTicketController } from './lottery-tipping-ticket-controller-f0d23f7a.js';
+export { L as LotteryTippingTicketController } from './lottery-tipping-ticket-controller-7714da55.js';
 import './index-e3ec645c.js';

package/dist/esm/{lottery-tipping-ticket-controller-f0d23f7a.js → lottery-tipping-ticket-controller-7714da55.js}

@@ -6660,6 +6660,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       <div on-click="_scrollForward" part="forward-button" aria-hidden="true"></div>
     `}static get is(){return "vaadin-tabs"}}v(vh);
 
+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
@@ -6705,18 +6707,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];
+    }
+  });
 }
 
 var PlayModeEnum;
@@ -9679,7 +9738,7 @@ const LotteryTippingTicketController = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -9690,7 +9749,7 @@ const LotteryTippingTicketController = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)