@everymatrix/lottery-game-page 1.87.25 → 1.87.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/cjs/general-multi-select_16.cjs.entry.js +94 -35
  2. package/dist/esm/general-multi-select_16.entry.js +94 -35
  3. package/dist/lottery-game-page/general-multi-select_16.entry.js +241 -241
  4. package/package.json +1 -1
package/dist/cjs/general-multi-select_16.cjs.entry.js CHANGED
@@ -4,6 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-61a8722c.js');
6
6
 
7
+ const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
8
+
7
9
  /**
8
10
  * @name setClientStyling
9
11
  * @description Method used to create and append to the passed element of the widget a style element with the content received
@@ -49,18 +51,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
49
51
  * @param {HTMLElement} stylingContainer The highest element of the widget
50
52
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
51
53
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
54
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
52
55
  */
53
- function setStreamStyling(stylingContainer, domain, subscription) {
54
- if (window.emMessageBus) {
55
- const sheet = document.createElement('style');
56
+ function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
57
+ if (!window.emMessageBus) return;
56
58
 
57
- window.emMessageBus.subscribe(domain, (data) => {
58
- sheet.innerHTML = data;
59
- if (stylingContainer) {
60
- stylingContainer.appendChild(sheet);
61
- }
62
- });
59
+ const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
60
+
61
+ if (!supportAdoptStyle || !useAdoptedStyleSheets) {
62
+ subscription = getStyleTagSubscription(stylingContainer, domain);
63
+
64
+ return subscription;
63
65
  }
66
+
67
+ if (!window[StyleCacheKey]) {
68
+ window[StyleCacheKey] = {};
69
+ }
70
+ subscription = getAdoptStyleSubscription(stylingContainer, domain);
71
+
72
+ const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
73
+ const wrappedUnsubscribe = () => {
74
+ if (window[StyleCacheKey][domain]) {
75
+ const cachedObject = window[StyleCacheKey][domain];
76
+ cachedObject.refCount > 1
77
+ ? (cachedObject.refCount = cachedObject.refCount - 1)
78
+ : delete window[StyleCacheKey][domain];
79
+ }
80
+
81
+ originalUnsubscribe();
82
+ };
83
+ subscription.unsubscribe = wrappedUnsubscribe;
84
+
85
+ return subscription;
86
+ }
87
+
88
+ function getStyleTagSubscription(stylingContainer, domain) {
89
+ const sheet = document.createElement('style');
90
+
91
+ return window.emMessageBus.subscribe(domain, (data) => {
92
+ if (stylingContainer) {
93
+ sheet.innerHTML = data;
94
+ stylingContainer.appendChild(sheet);
95
+ }
96
+ });
97
+ }
98
+
99
+ function getAdoptStyleSubscription(stylingContainer, domain) {
100
+ return window.emMessageBus.subscribe(domain, (data) => {
101
+ if (!stylingContainer) return;
102
+
103
+ const shadowRoot = stylingContainer.getRootNode();
104
+ const cacheStyleObject = window[StyleCacheKey];
105
+ let cachedStyle = cacheStyleObject[domain]?.sheet;
106
+
107
+ if (!cachedStyle) {
108
+ cachedStyle = new CSSStyleSheet();
109
+ cachedStyle.replaceSync(data);
110
+ cacheStyleObject[domain] = {
111
+ sheet: cachedStyle,
112
+ refCount: 1
113
+ };
114
+ } else {
115
+ cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
116
+ }
117
+
118
+ const currentSheets = shadowRoot.adoptedStyleSheets || [];
119
+ if (!currentSheets.includes(cachedStyle)) {
120
+ shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
121
+ }
122
+ });
64
123
  }
65
124
 
66
125
  const generalMultiSelectCss = ".multi-select-container{position:relative;font-family:\"Inter\", sans-serif;margin-top:4px;width:100%}.flex-row{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;padding:8px 12px;padding-right:4px;border-radius:4px;background:var(--emw-selector-color-background, #e8ebef);cursor:pointer}.control{flex:1;display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden}.control:focus-within{border-color:var(--emw--color-primary, #fed275);box-shadow:0 0 0 2px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15))}.chip{display:inline-flex;align-items:center;background:var(--emw--color-gray-50, #f5f5f5);color:var(--emw--color-dialog-typography, #000);border-radius:4px;padding:2px 8px;margin-right:6px;font-size:0.875rem;line-height:1.2;justify-content:space-between;flex:0 1 auto;min-width:0}.chip-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-chip{background:var(--emw--color-gray-100, #e6e6e6);color:var(--emw--color-gray-300, #333);width:20px;text-align:center;display:block}.remove-btn{background:none;border:none;font-size:1rem;margin-left:6px;cursor:pointer;color:var(--emw--color-gray-150, #6f6f6f)}.remove-btn:hover{color:var(--emw--color-error, red)}.placeholder{color:var(--emw--color-gray-150, #6f6f6f);font-size:0.875rem;padding:3px 8px;line-height:1.2}.arrow{margin-left:auto;font-size:0.8rem;width:20px;color:var(--emw--color-gray-150, #6f6f6f)}.dropdown{position:absolute;top:calc(100% + 4px);left:0;width:100%;max-height:240px;overflow-y:auto;border:1px solid var(--emw--color-gray-100, #e6e6e6);border-radius:6px;background:var(--emw--color-dialog-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:10}.dropdown-item{padding:10px 14px;cursor:pointer;font-size:0.875rem;line-height:1.4;transition:background 0.2s}.dropdown-item:hover{background:var(--emw--color-background-tertiary, #ccc);color:var(--emw--color-typography, #000)}.dropdown-item.selected{background:var(--emw--color-background-secondary, #f5f5f5);color:var(--emw--color-typography, #000);font-weight:500}.overflow-popover{position:absolute;top:var(--overflow-top, 0px);left:var(--overflow-left, 0px);max-width:200px;padding:12px;display:flex;flex-wrap:wrap;gap:6px;border:1px solid var(--emw--color-gray-100, #d0d5dd);border-radius:6px;background:var(--emw--color-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:20}";
@@ -149,13 +208,13 @@ const GeneralMultiSelect = class {
149
208
  }
150
209
  handleMbSourceChange(newValue, oldValue) {
151
210
  if (newValue != oldValue) {
152
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
211
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
153
212
  }
154
213
  }
155
214
  componentDidLoad() {
156
215
  if (this.stylingContainer) {
157
216
  if (this.mbSource)
158
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
217
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
159
218
  if (this.clientStyling)
160
219
  setClientStyling(this.stylingContainer, this.clientStyling);
161
220
  if (this.clientStylingUrl)
@@ -276,13 +335,13 @@ const HelperAccordion = class {
276
335
  }
277
336
  handleMbSourceChange(newValue, oldValue) {
278
337
  if (newValue != oldValue) {
279
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
338
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
280
339
  }
281
340
  }
282
341
  componentDidLoad() {
283
342
  if (this.stylingContainer) {
284
343
  if (this.mbSource)
285
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
344
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
286
345
  if (this.clientStyling)
287
346
  setClientStyling(this.stylingContainer, this.clientStyling);
288
347
  if (this.clientStylingUrl)
@@ -9594,7 +9653,7 @@ const HelperTab = class {
9594
9653
  componentDidLoad() {
9595
9654
  if (this.stylingContainer) {
9596
9655
  if (window.emMessageBus != undefined) {
9597
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9656
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9598
9657
  }
9599
9658
  else {
9600
9659
  if (this.clientStyling)
@@ -9680,7 +9739,7 @@ const HelperTabs = class {
9680
9739
  componentDidLoad() {
9681
9740
  if (this.stylingContainer) {
9682
9741
  if (window.emMessageBus != undefined) {
9683
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9742
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9684
9743
  }
9685
9744
  else {
9686
9745
  if (this.clientStyling)
@@ -9740,13 +9799,13 @@ const LotteryBullet = class {
9740
9799
  }
9741
9800
  handleMbSourceChange(newValue, oldValue) {
9742
9801
  if (newValue != oldValue) {
9743
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9802
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9744
9803
  }
9745
9804
  }
9746
9805
  componentDidLoad() {
9747
9806
  if (this.stylingContainer) {
9748
9807
  if (this.mbSource)
9749
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9808
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9750
9809
  if (this.clientStyling)
9751
9810
  setClientStyling(this.stylingContainer, this.clientStyling);
9752
9811
  if (this.clientStylingUrl)
@@ -9943,7 +10002,7 @@ const LotteryDrawResults = class {
9943
10002
  }
9944
10003
  handleMbSourceChange(newValue, oldValue) {
9945
10004
  if (newValue != oldValue) {
9946
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10005
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9947
10006
  }
9948
10007
  }
9949
10008
  componentWillLoad() {
@@ -9983,7 +10042,7 @@ const LotteryDrawResults = class {
9983
10042
  componentDidLoad() {
9984
10043
  if (this.stylingContainer) {
9985
10044
  if (this.mbSource)
9986
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10045
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9987
10046
  if (this.clientStyling)
9988
10047
  setClientStyling(this.stylingContainer, this.clientStyling);
9989
10048
  if (this.clientStylingUrl)
@@ -10213,7 +10272,7 @@ const LotteryDrawResultsHistory = class {
10213
10272
  }
10214
10273
  handleMbSourceChange(newValue, oldValue) {
10215
10274
  if (newValue != oldValue) {
10216
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10275
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10217
10276
  }
10218
10277
  }
10219
10278
  connectedCallback() {
@@ -10227,7 +10286,7 @@ const LotteryDrawResultsHistory = class {
10227
10286
  componentDidLoad() {
10228
10287
  if (this.stylingContainer) {
10229
10288
  if (this.mbSource)
10230
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10289
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10231
10290
  if (this.clientStyling)
10232
10291
  setClientStyling(this.stylingContainer, this.clientStyling);
10233
10292
  if (this.clientStylingUrl)
@@ -10278,13 +10337,13 @@ const LotteryGameDetails = class {
10278
10337
  }
10279
10338
  handleMbSourceChange(newValue, oldValue) {
10280
10339
  if (newValue != oldValue) {
10281
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10340
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10282
10341
  }
10283
10342
  }
10284
10343
  componentDidLoad() {
10285
10344
  if (this.stylingContainer) {
10286
10345
  if (this.mbSource)
10287
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10346
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10288
10347
  if (this.clientStyling)
10289
10348
  setClientStyling(this.stylingContainer, this.clientStyling);
10290
10349
  if (this.clientStylingUrl)
@@ -10519,7 +10578,7 @@ const LotteryGamePage = class {
10519
10578
  }
10520
10579
  handleMbSourceChange(newValue, oldValue) {
10521
10580
  if (newValue != oldValue) {
10522
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10581
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10523
10582
  }
10524
10583
  }
10525
10584
  handleNewTranslations() {
@@ -10557,7 +10616,7 @@ const LotteryGamePage = class {
10557
10616
  componentDidLoad() {
10558
10617
  if (this.stylingContainer) {
10559
10618
  if (this.mbSource)
10560
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10619
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10561
10620
  if (this.clientStyling)
10562
10621
  setClientStyling(this.stylingContainer, this.clientStyling);
10563
10622
  if (this.clientStylingUrl)
@@ -11024,13 +11083,13 @@ const LotteryGrid = class {
11024
11083
  }
11025
11084
  handleMbSourceChange(newValue, oldValue) {
11026
11085
  if (newValue != oldValue) {
11027
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11086
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11028
11087
  }
11029
11088
  }
11030
11089
  componentDidLoad() {
11031
11090
  if (this.stylingContainer) {
11032
11091
  if (this.mbSource)
11033
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11092
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11034
11093
  if (this.clientStyling)
11035
11094
  setClientStyling(this.stylingContainer, this.clientStyling);
11036
11095
  if (this.clientStylingUrl)
@@ -11379,7 +11438,7 @@ const LotteryPagination = class {
11379
11438
  }
11380
11439
  handleMbSourceChange(newValue, oldValue) {
11381
11440
  if (newValue != oldValue) {
11382
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11441
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11383
11442
  }
11384
11443
  }
11385
11444
  componentWillLoad() {
@@ -11426,7 +11485,7 @@ const LotteryPagination = class {
11426
11485
  componentDidLoad() {
11427
11486
  if (this.stylingContainer) {
11428
11487
  if (this.mbSource)
11429
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11488
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11430
11489
  if (this.clientStyling)
11431
11490
  setClientStyling(this.stylingContainer, this.clientStyling);
11432
11491
  if (this.clientStylingUrl)
@@ -11671,13 +11730,13 @@ const LotterySubscription = class {
11671
11730
  }
11672
11731
  handleMbSourceChange(newValue, oldValue) {
11673
11732
  if (newValue != oldValue) {
11674
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11733
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11675
11734
  }
11676
11735
  }
11677
11736
  componentDidLoad() {
11678
11737
  if (this.stylingContainer) {
11679
11738
  if (this.mbSource)
11680
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11739
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11681
11740
  if (this.clientStyling)
11682
11741
  setClientStyling(this.stylingContainer, this.clientStyling);
11683
11742
  if (this.clientStylingUrl)
@@ -11971,7 +12030,7 @@ const LotteryTicket = class {
11971
12030
  }
11972
12031
  handleMbSourceChange(newValue, oldValue) {
11973
12032
  if (newValue != oldValue) {
11974
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12033
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11975
12034
  }
11976
12035
  }
11977
12036
  checkForClickOutside(ev) {
@@ -12058,7 +12117,7 @@ const LotteryTicket = class {
12058
12117
  componentDidLoad() {
12059
12118
  if (this.stylingContainer) {
12060
12119
  if (this.mbSource)
12061
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12120
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12062
12121
  if (this.clientStyling)
12063
12122
  setClientStyling(this.stylingContainer, this.clientStyling);
12064
12123
  if (this.clientStylingUrl)
@@ -12279,13 +12338,13 @@ const LotteryTicketController = class {
12279
12338
  }
12280
12339
  handleMbSourceChange(newValue, oldValue) {
12281
12340
  if (newValue != oldValue) {
12282
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12341
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12283
12342
  }
12284
12343
  }
12285
12344
  componentDidLoad() {
12286
12345
  if (this.stylingContainer) {
12287
12346
  if (this.mbSource)
12288
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12347
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12289
12348
  if (this.clientStyling)
12290
12349
  setClientStyling(this.stylingContainer, this.clientStyling);
12291
12350
  if (this.clientStylingUrl)
package/dist/esm/general-multi-select_16.entry.js CHANGED
@@ -1,5 +1,7 @@
1
1
  import { r as registerInstance, c as createEvent, g as getAssetPath, h, a as getElement } from './index-4dbc736a.js';
2
2
 
3
+ const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
4
+
3
5
  /**
4
6
  * @name setClientStyling
5
7
  * @description Method used to create and append to the passed element of the widget a style element with the content received
@@ -45,18 +47,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
45
47
  * @param {HTMLElement} stylingContainer The highest element of the widget
46
48
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
47
49
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
50
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
48
51
  */
49
- function setStreamStyling(stylingContainer, domain, subscription) {
50
- if (window.emMessageBus) {
51
- const sheet = document.createElement('style');
52
+ function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
53
+ if (!window.emMessageBus) return;
52
54
 
53
- window.emMessageBus.subscribe(domain, (data) => {
54
- sheet.innerHTML = data;
55
- if (stylingContainer) {
56
- stylingContainer.appendChild(sheet);
57
- }
58
- });
55
+ const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
56
+
57
+ if (!supportAdoptStyle || !useAdoptedStyleSheets) {
58
+ subscription = getStyleTagSubscription(stylingContainer, domain);
59
+
60
+ return subscription;
59
61
  }
62
+
63
+ if (!window[StyleCacheKey]) {
64
+ window[StyleCacheKey] = {};
65
+ }
66
+ subscription = getAdoptStyleSubscription(stylingContainer, domain);
67
+
68
+ const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
69
+ const wrappedUnsubscribe = () => {
70
+ if (window[StyleCacheKey][domain]) {
71
+ const cachedObject = window[StyleCacheKey][domain];
72
+ cachedObject.refCount > 1
73
+ ? (cachedObject.refCount = cachedObject.refCount - 1)
74
+ : delete window[StyleCacheKey][domain];
75
+ }
76
+
77
+ originalUnsubscribe();
78
+ };
79
+ subscription.unsubscribe = wrappedUnsubscribe;
80
+
81
+ return subscription;
82
+ }
83
+
84
+ function getStyleTagSubscription(stylingContainer, domain) {
85
+ const sheet = document.createElement('style');
86
+
87
+ return window.emMessageBus.subscribe(domain, (data) => {
88
+ if (stylingContainer) {
89
+ sheet.innerHTML = data;
90
+ stylingContainer.appendChild(sheet);
91
+ }
92
+ });
93
+ }
94
+
95
+ function getAdoptStyleSubscription(stylingContainer, domain) {
96
+ return window.emMessageBus.subscribe(domain, (data) => {
97
+ if (!stylingContainer) return;
98
+
99
+ const shadowRoot = stylingContainer.getRootNode();
100
+ const cacheStyleObject = window[StyleCacheKey];
101
+ let cachedStyle = cacheStyleObject[domain]?.sheet;
102
+
103
+ if (!cachedStyle) {
104
+ cachedStyle = new CSSStyleSheet();
105
+ cachedStyle.replaceSync(data);
106
+ cacheStyleObject[domain] = {
107
+ sheet: cachedStyle,
108
+ refCount: 1
109
+ };
110
+ } else {
111
+ cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
112
+ }
113
+
114
+ const currentSheets = shadowRoot.adoptedStyleSheets || [];
115
+ if (!currentSheets.includes(cachedStyle)) {
116
+ shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
117
+ }
118
+ });
60
119
  }
61
120
 
62
121
  const generalMultiSelectCss = ".multi-select-container{position:relative;font-family:\"Inter\", sans-serif;margin-top:4px;width:100%}.flex-row{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;padding:8px 12px;padding-right:4px;border-radius:4px;background:var(--emw-selector-color-background, #e8ebef);cursor:pointer}.control{flex:1;display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden}.control:focus-within{border-color:var(--emw--color-primary, #fed275);box-shadow:0 0 0 2px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15))}.chip{display:inline-flex;align-items:center;background:var(--emw--color-gray-50, #f5f5f5);color:var(--emw--color-dialog-typography, #000);border-radius:4px;padding:2px 8px;margin-right:6px;font-size:0.875rem;line-height:1.2;justify-content:space-between;flex:0 1 auto;min-width:0}.chip-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-chip{background:var(--emw--color-gray-100, #e6e6e6);color:var(--emw--color-gray-300, #333);width:20px;text-align:center;display:block}.remove-btn{background:none;border:none;font-size:1rem;margin-left:6px;cursor:pointer;color:var(--emw--color-gray-150, #6f6f6f)}.remove-btn:hover{color:var(--emw--color-error, red)}.placeholder{color:var(--emw--color-gray-150, #6f6f6f);font-size:0.875rem;padding:3px 8px;line-height:1.2}.arrow{margin-left:auto;font-size:0.8rem;width:20px;color:var(--emw--color-gray-150, #6f6f6f)}.dropdown{position:absolute;top:calc(100% + 4px);left:0;width:100%;max-height:240px;overflow-y:auto;border:1px solid var(--emw--color-gray-100, #e6e6e6);border-radius:6px;background:var(--emw--color-dialog-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:10}.dropdown-item{padding:10px 14px;cursor:pointer;font-size:0.875rem;line-height:1.4;transition:background 0.2s}.dropdown-item:hover{background:var(--emw--color-background-tertiary, #ccc);color:var(--emw--color-typography, #000)}.dropdown-item.selected{background:var(--emw--color-background-secondary, #f5f5f5);color:var(--emw--color-typography, #000);font-weight:500}.overflow-popover{position:absolute;top:var(--overflow-top, 0px);left:var(--overflow-left, 0px);max-width:200px;padding:12px;display:flex;flex-wrap:wrap;gap:6px;border:1px solid var(--emw--color-gray-100, #d0d5dd);border-radius:6px;background:var(--emw--color-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:20}";
@@ -145,13 +204,13 @@ const GeneralMultiSelect = class {
145
204
  }
146
205
  handleMbSourceChange(newValue, oldValue) {
147
206
  if (newValue != oldValue) {
148
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
207
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
149
208
  }
150
209
  }
151
210
  componentDidLoad() {
152
211
  if (this.stylingContainer) {
153
212
  if (this.mbSource)
154
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
213
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
155
214
  if (this.clientStyling)
156
215
  setClientStyling(this.stylingContainer, this.clientStyling);
157
216
  if (this.clientStylingUrl)
@@ -272,13 +331,13 @@ const HelperAccordion = class {
272
331
  }
273
332
  handleMbSourceChange(newValue, oldValue) {
274
333
  if (newValue != oldValue) {
275
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
334
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
276
335
  }
277
336
  }
278
337
  componentDidLoad() {
279
338
  if (this.stylingContainer) {
280
339
  if (this.mbSource)
281
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
340
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
282
341
  if (this.clientStyling)
283
342
  setClientStyling(this.stylingContainer, this.clientStyling);
284
343
  if (this.clientStylingUrl)
@@ -9590,7 +9649,7 @@ const HelperTab = class {
9590
9649
  componentDidLoad() {
9591
9650
  if (this.stylingContainer) {
9592
9651
  if (window.emMessageBus != undefined) {
9593
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9652
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9594
9653
  }
9595
9654
  else {
9596
9655
  if (this.clientStyling)
@@ -9676,7 +9735,7 @@ const HelperTabs = class {
9676
9735
  componentDidLoad() {
9677
9736
  if (this.stylingContainer) {
9678
9737
  if (window.emMessageBus != undefined) {
9679
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9738
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9680
9739
  }
9681
9740
  else {
9682
9741
  if (this.clientStyling)
@@ -9736,13 +9795,13 @@ const LotteryBullet = class {
9736
9795
  }
9737
9796
  handleMbSourceChange(newValue, oldValue) {
9738
9797
  if (newValue != oldValue) {
9739
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9798
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9740
9799
  }
9741
9800
  }
9742
9801
  componentDidLoad() {
9743
9802
  if (this.stylingContainer) {
9744
9803
  if (this.mbSource)
9745
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9804
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9746
9805
  if (this.clientStyling)
9747
9806
  setClientStyling(this.stylingContainer, this.clientStyling);
9748
9807
  if (this.clientStylingUrl)
@@ -9939,7 +9998,7 @@ const LotteryDrawResults = class {
9939
9998
  }
9940
9999
  handleMbSourceChange(newValue, oldValue) {
9941
10000
  if (newValue != oldValue) {
9942
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10001
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9943
10002
  }
9944
10003
  }
9945
10004
  componentWillLoad() {
@@ -9979,7 +10038,7 @@ const LotteryDrawResults = class {
9979
10038
  componentDidLoad() {
9980
10039
  if (this.stylingContainer) {
9981
10040
  if (this.mbSource)
9982
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10041
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
9983
10042
  if (this.clientStyling)
9984
10043
  setClientStyling(this.stylingContainer, this.clientStyling);
9985
10044
  if (this.clientStylingUrl)
@@ -10209,7 +10268,7 @@ const LotteryDrawResultsHistory = class {
10209
10268
  }
10210
10269
  handleMbSourceChange(newValue, oldValue) {
10211
10270
  if (newValue != oldValue) {
10212
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10271
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10213
10272
  }
10214
10273
  }
10215
10274
  connectedCallback() {
@@ -10223,7 +10282,7 @@ const LotteryDrawResultsHistory = class {
10223
10282
  componentDidLoad() {
10224
10283
  if (this.stylingContainer) {
10225
10284
  if (this.mbSource)
10226
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10285
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10227
10286
  if (this.clientStyling)
10228
10287
  setClientStyling(this.stylingContainer, this.clientStyling);
10229
10288
  if (this.clientStylingUrl)
@@ -10274,13 +10333,13 @@ const LotteryGameDetails = class {
10274
10333
  }
10275
10334
  handleMbSourceChange(newValue, oldValue) {
10276
10335
  if (newValue != oldValue) {
10277
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10336
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10278
10337
  }
10279
10338
  }
10280
10339
  componentDidLoad() {
10281
10340
  if (this.stylingContainer) {
10282
10341
  if (this.mbSource)
10283
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10342
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10284
10343
  if (this.clientStyling)
10285
10344
  setClientStyling(this.stylingContainer, this.clientStyling);
10286
10345
  if (this.clientStylingUrl)
@@ -10515,7 +10574,7 @@ const LotteryGamePage = class {
10515
10574
  }
10516
10575
  handleMbSourceChange(newValue, oldValue) {
10517
10576
  if (newValue != oldValue) {
10518
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10577
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10519
10578
  }
10520
10579
  }
10521
10580
  handleNewTranslations() {
@@ -10553,7 +10612,7 @@ const LotteryGamePage = class {
10553
10612
  componentDidLoad() {
10554
10613
  if (this.stylingContainer) {
10555
10614
  if (this.mbSource)
10556
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10615
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
10557
10616
  if (this.clientStyling)
10558
10617
  setClientStyling(this.stylingContainer, this.clientStyling);
10559
10618
  if (this.clientStylingUrl)
@@ -11020,13 +11079,13 @@ const LotteryGrid = class {
11020
11079
  }
11021
11080
  handleMbSourceChange(newValue, oldValue) {
11022
11081
  if (newValue != oldValue) {
11023
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11082
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11024
11083
  }
11025
11084
  }
11026
11085
  componentDidLoad() {
11027
11086
  if (this.stylingContainer) {
11028
11087
  if (this.mbSource)
11029
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11088
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11030
11089
  if (this.clientStyling)
11031
11090
  setClientStyling(this.stylingContainer, this.clientStyling);
11032
11091
  if (this.clientStylingUrl)
@@ -11375,7 +11434,7 @@ const LotteryPagination = class {
11375
11434
  }
11376
11435
  handleMbSourceChange(newValue, oldValue) {
11377
11436
  if (newValue != oldValue) {
11378
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11437
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11379
11438
  }
11380
11439
  }
11381
11440
  componentWillLoad() {
@@ -11422,7 +11481,7 @@ const LotteryPagination = class {
11422
11481
  componentDidLoad() {
11423
11482
  if (this.stylingContainer) {
11424
11483
  if (this.mbSource)
11425
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11484
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11426
11485
  if (this.clientStyling)
11427
11486
  setClientStyling(this.stylingContainer, this.clientStyling);
11428
11487
  if (this.clientStylingUrl)
@@ -11667,13 +11726,13 @@ const LotterySubscription = class {
11667
11726
  }
11668
11727
  handleMbSourceChange(newValue, oldValue) {
11669
11728
  if (newValue != oldValue) {
11670
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11729
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11671
11730
  }
11672
11731
  }
11673
11732
  componentDidLoad() {
11674
11733
  if (this.stylingContainer) {
11675
11734
  if (this.mbSource)
11676
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11735
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11677
11736
  if (this.clientStyling)
11678
11737
  setClientStyling(this.stylingContainer, this.clientStyling);
11679
11738
  if (this.clientStylingUrl)
@@ -11967,7 +12026,7 @@ const LotteryTicket = class {
11967
12026
  }
11968
12027
  handleMbSourceChange(newValue, oldValue) {
11969
12028
  if (newValue != oldValue) {
11970
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12029
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
11971
12030
  }
11972
12031
  }
11973
12032
  checkForClickOutside(ev) {
@@ -12054,7 +12113,7 @@ const LotteryTicket = class {
12054
12113
  componentDidLoad() {
12055
12114
  if (this.stylingContainer) {
12056
12115
  if (this.mbSource)
12057
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12116
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12058
12117
  if (this.clientStyling)
12059
12118
  setClientStyling(this.stylingContainer, this.clientStyling);
12060
12119
  if (this.clientStylingUrl)
@@ -12275,13 +12334,13 @@ const LotteryTicketController = class {
12275
12334
  }
12276
12335
  handleMbSourceChange(newValue, oldValue) {
12277
12336
  if (newValue != oldValue) {
12278
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12337
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12279
12338
  }
12280
12339
  }
12281
12340
  componentDidLoad() {
12282
12341
  if (this.stylingContainer) {
12283
12342
  if (this.mbSource)
12284
- setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12343
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
12285
12344
  if (this.clientStyling)
12286
12345
  setClientStyling(this.stylingContainer, this.clientStyling);
12287
12346
  if (this.clientStylingUrl)