@everymatrix/user-action-controller 1.54.11 → 1.55.0

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 (26) hide show
  1. package/dist/cjs/{index-eb2c9562.js → index-316ef19a.js} +79 -177
  2. package/dist/cjs/loader.cjs.js +2 -2
  3. package/dist/cjs/player-user-consents_2.cjs.entry.js +107 -117
  4. package/dist/cjs/user-action-controller.cjs.js +3 -3
  5. package/dist/collection/collection-manifest.json +1 -1
  6. package/dist/collection/components/user-action-controller/user-action-controller.js +49 -73
  7. package/dist/esm/{index-b5753d50.js → index-48848b35.js} +79 -177
  8. package/dist/esm/loader.js +3 -3
  9. package/dist/esm/player-user-consents_2.entry.js +107 -117
  10. package/dist/esm/user-action-controller.js +4 -4
  11. package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/user-action-controller/.stencil/packages/stencil/user-action-controller/stencil.config.d.ts +2 -0
  12. package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/user-action-controller/.stencil/packages/stencil/user-action-controller/stencil.config.dev.d.ts +2 -0
  13. package/dist/types/components/user-action-controller/user-action-controller.d.ts +4 -3
  14. package/dist/types/components.d.ts +2 -0
  15. package/dist/user-action-controller/p-5a10e23d.js +2 -0
  16. package/dist/user-action-controller/p-ef35142f.entry.js +1 -0
  17. package/dist/user-action-controller/user-action-controller.esm.js +1 -1
  18. package/package.json +1 -1
  19. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/user-action-controller/.stencil/packages/stencil/user-action-controller/stencil.config.d.ts +0 -2
  20. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/user-action-controller/.stencil/packages/stencil/user-action-controller/stencil.config.dev.d.ts +0 -2
  21. package/dist/user-action-controller/p-649aa648.entry.js +0 -1
  22. package/dist/user-action-controller/p-a70608c7.js +0 -2
  23. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/user-action-controller/.stencil/tools/plugins/index.d.ts +0 -0
  24. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/user-action-controller/.stencil/tools/plugins/stencil-clean-deps-plugin.d.ts +0 -0
  25. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/user-action-controller/.stencil/tools/plugins/vite-chunk-plugin.d.ts +0 -0
  26. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/user-action-controller/.stencil/tools/plugins/vite-clean-deps-plugin.d.ts +0 -0
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb2c9562.js');
5
+ const index = require('./index-316ef19a.js');
6
6
 
7
7
  const DEFAULT_LANGUAGE$1 = 'en';
8
8
  const TRANSLATIONS$1 = {
@@ -130,6 +130,63 @@ const translate$1 = (key, customLang, values) => {
130
130
  return translation;
131
131
  };
132
132
 
133
+ /**
134
+ * @name setClientStyling
135
+ * @description Method used to create and append to the passed element of the widget a style element with the content received
136
+ * @param {HTMLElement} stylingContainer The reference element of the widget
137
+ * @param {string} clientStyling The style content
138
+ */
139
+ function setClientStyling(stylingContainer, clientStyling) {
140
+ if (stylingContainer) {
141
+ const sheet = document.createElement('style');
142
+ sheet.innerHTML = clientStyling;
143
+ stylingContainer.appendChild(sheet);
144
+ }
145
+ }
146
+
147
+ /**
148
+ * @name setClientStylingURL
149
+ * @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
150
+ * @param {HTMLElement} stylingContainer The reference element of the widget
151
+ * @param {string} clientStylingUrl The URL of the style content
152
+ */
153
+ function setClientStylingURL(stylingContainer, clientStylingUrl) {
154
+ const url = new URL(clientStylingUrl);
155
+
156
+ fetch(url.href)
157
+ .then((res) => res.text())
158
+ .then((data) => {
159
+ const cssFile = document.createElement('style');
160
+ cssFile.innerHTML = data;
161
+ if (stylingContainer) {
162
+ stylingContainer.appendChild(cssFile);
163
+ }
164
+ })
165
+ .catch((err) => {
166
+ console.error('There was an error while trying to load client styling from URL', err);
167
+ });
168
+ }
169
+
170
+ /**
171
+ * @name setStreamLibrary
172
+ * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
173
+ * @param {HTMLElement} stylingContainer The highest element of the widget
174
+ * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
175
+ * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
176
+ */
177
+ function setStreamStyling(stylingContainer, domain, subscription) {
178
+ if (window.emMessageBus) {
179
+ const sheet = document.createElement('style');
180
+
181
+ window.emMessageBus.subscribe(domain, (data) => {
182
+ sheet.innerHTML = data;
183
+ if (stylingContainer) {
184
+ stylingContainer.appendChild(sheet);
185
+ }
186
+ });
187
+ }
188
+ }
189
+
133
190
  const playerUserConsentsCss = ":host{display:block}.ConsentTitle{margin-bottom:0.2rem;font-weight:600}.UserConsent:hover{cursor:pointer}.UserConsent{display:flex;align-items:baseline}.MandatoryItem{color:#f00;font-size:1.2rem}.ConsentLink{text-decoration:underline;color:var(--emw--color-primary);font-weight:bold}";
134
191
  const PlayerUserConsentsStyle0 = playerUserConsentsCss;
135
192
 
@@ -137,67 +194,19 @@ const PlayerUserConsents = class {
137
194
  constructor(hostRef) {
138
195
  index.registerInstance(this, hostRef);
139
196
  this.userLegislationConsent = index.createEvent(this, "userLegislationConsent", 7);
140
- /**
141
- * Language
142
- */
197
+ this.goToTermsAndConditions = () => window.postMessage({ type: 'GoToTermsAndConditions' });
198
+ this.goToPrivacyPolicy = () => window.postMessage({ type: 'GoToPrivacyPolicy' });
143
199
  this.lang = 'en';
144
- /**
145
- * 'true' when parent expects component to emit it's current value
146
- */
147
200
  this.queried = false;
148
- /**
149
- * the type of the consent, used to determine render details
150
- */
151
201
  this.consentType = '';
152
- /**
153
- * wether or not this consent is mandatory. Used for render details
154
- */
155
202
  this.mandatory = false;
156
- /**
157
- * Select GM version
158
- */
159
203
  this.gmVersion = '';
160
- /**
161
- * the title of the consent to be displayed
162
- */
163
204
  this.consentTitle = '';
164
- /**
165
- * Client custom styling via inline style
166
- */
167
205
  this.clientStyling = '';
168
- /**
169
- * Client custom styling via url
170
- */
171
206
  this.clientStylingUrl = '';
172
- /**
173
- * Translation url
174
- */
175
207
  this.translationUrl = '';
176
- /**
177
- * the text content to be rendered by the component. Determined at runtime
178
- */
208
+ this.mbSource = undefined;
179
209
  this.textContent = '';
180
- this.limitStylingAppends = false;
181
- this.goToTermsAndConditions = () => window.postMessage({ type: 'GoToTermsAndConditions' });
182
- this.goToPrivacyPolicy = () => window.postMessage({ type: 'GoToPrivacyPolicy' });
183
- this.setClientStyling = () => {
184
- let sheet = document.createElement('style');
185
- sheet.innerHTML = this.clientStyling;
186
- this.stylingContainer.prepend(sheet);
187
- };
188
- this.setClientStylingURL = () => {
189
- let url = new URL(this.clientStylingUrl);
190
- let cssFile = document.createElement('style');
191
- fetch(url.href)
192
- .then((res) => res.text())
193
- .then((data) => {
194
- cssFile.innerHTML = data;
195
- setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
196
- })
197
- .catch((err) => {
198
- console.log('error ', err);
199
- });
200
- };
201
210
  }
202
211
  handleNewTranslations() {
203
212
  getTranslations$1(this.translationUrl);
@@ -217,17 +226,22 @@ const PlayerUserConsents = class {
217
226
  value: this.checkboxInput.checked
218
227
  });
219
228
  }
220
- componentDidRender() {
221
- // start custom styling area
222
- if (!this.limitStylingAppends && this.stylingContainer) {
223
- if (this.clientStylingUrl) {
224
- this.setClientStylingURL();
229
+ componentDidLoad() {
230
+ if (this.stylingContainer) {
231
+ // @ts-ignore
232
+ if (window.emMessageBus != undefined) {
233
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
234
+ }
235
+ else {
236
+ if (this.clientStyling)
237
+ setClientStyling(this.stylingContainer, this.clientStyling);
238
+ if (this.clientStylingUrl)
239
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
225
240
  }
226
- if (this.clientStyling)
227
- this.setClientStyling();
228
- this.limitStylingAppends = true;
229
241
  }
230
- // end custom styling area
242
+ }
243
+ disconnectedCallback() {
244
+ this.stylingSubscription && this.stylingSubscription.unsubscribe();
231
245
  }
232
246
  determineTextContent() {
233
247
  if (this.gmVersion === 'gmcore') {
@@ -249,7 +263,7 @@ const PlayerUserConsents = class {
249
263
  if (this.queried) {
250
264
  this.userLegislationConsentHandler();
251
265
  }
252
- return (index.h("div", { key: '54601e536a075b95277641c2d123f21fb5b9a9e8', ref: el => this.stylingContainer = el }, index.h("p", { key: '8cceca5a2a2e69a4180e10848d0fea081fe7a78a', class: "ConsentTitle" }, this.consentTitle), index.h("label", { key: '80f41a7876f3831c1030cba896282290f33c14b3', class: "UserConsent", htmlFor: "userConsent" }, index.h("input", { key: '7db0bada1af6d9df763f63a4eb92e79615322801', ref: el => this.checkboxInput = el, id: "userConsent", type: "checkbox", onInput: () => this.userLegislationConsentHandler() }), this.determineTextContent(), this.mandatory && index.h("span", { key: 'ce67fcdf09cfefb48df87d043950fd4fba7fdb00', class: "MandatoryItem" }, "*"))));
266
+ return (index.h("div", { key: 'e3c4962028cea95e4391432bba0c6a4fa20d64cb', ref: el => this.stylingContainer = el }, index.h("p", { key: '606baf671f199a739b3738a73cd6e76748eb71c0', class: "ConsentTitle" }, this.consentTitle), index.h("label", { key: '7a581d02cbebf1ad6ec31b58e4b3b3583c0115bc', class: "UserConsent", htmlFor: "userConsent" }, index.h("input", { key: '70949461872d972a8d8a393dd36e6bbfbd3b82d0', ref: el => this.checkboxInput = el, id: "userConsent", type: "checkbox", onInput: () => this.userLegislationConsentHandler() }), this.determineTextContent(), this.mandatory && index.h("span", { key: 'e10c68ce2898d1b5801672b022ef9e1d0f185a17', class: "MandatoryItem" }, "*"))));
253
267
  }
254
268
  static get watchers() { return {
255
269
  "translationUrl": ["handleNewTranslations"],
@@ -384,29 +398,25 @@ const UserActionControllerStyle0 = userActionControllerCss;
384
398
  const UserActionController = class {
385
399
  constructor(hostRef) {
386
400
  index.registerInstance(this, hostRef);
387
- /**
388
- * Language
389
- */
401
+ //for now this variable is hardcoded bcs we have terms and conditions and privacy policy mandatory and we dont receive with these new functionality the mandatory actions
402
+ this.mandatoryActions = ['termsandconditions', 'privacypolicy'];
403
+ this.userActions = [];
404
+ this.consentTitles = {
405
+ termsandconditions: translate('termsAndConditionsTitle', this.lang),
406
+ sms: translate('smsTitle', this.lang),
407
+ emailmarketing: translate('emailMarketingTitle', this.lang),
408
+ privacypolicy: translate('privacyPolicyTitle', this.lang)
409
+ };
410
+ this.endpoint = undefined;
411
+ this.userSession = undefined;
412
+ this.userId = undefined;
390
413
  this.lang = 'en';
391
- /**
392
- * Select GM version
393
- */
414
+ this.includeSubmitButton = undefined;
394
415
  this.gmVersion = '';
395
- /**
396
- * Translation url
397
- */
398
416
  this.translationUrl = '';
399
- /**
400
- * Client custom styling via inline style
401
- */
402
417
  this.clientStyling = '';
403
- /**
404
- * Client custom styling via url
405
- */
406
418
  this.clientStylingUrl = '';
407
- /**
408
- * Which actions are required in order to activate the "Apply" button. Other actions are considered optional.
409
- */
419
+ this.mbSource = undefined;
410
420
  this.queryFired = false;
411
421
  this.readyActionsCount = 0;
412
422
  this.activeUserActions = [];
@@ -415,33 +425,7 @@ const UserActionController = class {
415
425
  this.limitStylingAppends = false;
416
426
  this.isLoading = true;
417
427
  this.mandatoryActionsChecked = 0;
418
- //for now this variable is hardcoded bcs we have terms and conditions and privacy policy mandatory and we dont receive with these new functionality the mandatory actions
419
- this.mandatoryActions = ['termsandconditions', 'privacypolicy'];
420
- this.userActions = [];
421
- this.consentTitles = {
422
- termsandconditions: translate('termsAndConditionsTitle', this.lang),
423
- sms: translate('smsTitle', this.lang),
424
- emailmarketing: translate('emailMarketingTitle', this.lang),
425
- privacypolicy: translate('privacyPolicyTitle', this.lang)
426
- };
427
- this.setClientStyling = () => {
428
- let sheet = document.createElement('style');
429
- sheet.innerHTML = this.clientStyling;
430
- this.stylingContainer.prepend(sheet);
431
- };
432
- this.setClientStylingURL = () => {
433
- let url = new URL(this.clientStylingUrl);
434
- let cssFile = document.createElement('style');
435
- fetch(url.href)
436
- .then((res) => res.text())
437
- .then((data) => {
438
- cssFile.innerHTML = data;
439
- setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
440
- })
441
- .catch((err) => {
442
- console.log('error ', err);
443
- });
444
- };
428
+ this.mandatoryItems = undefined;
445
429
  }
446
430
  handleNewTranslations() {
447
431
  getTranslations(this.translationUrl);
@@ -578,16 +562,22 @@ const UserActionController = class {
578
562
  await getTranslations(this.translationUrl);
579
563
  }
580
564
  }
581
- componentDidRender() {
582
- // start custom styling area
583
- if (!this.limitStylingAppends && this.stylingContainer) {
584
- if (this.clientStyling)
585
- this.setClientStyling();
586
- if (this.clientStylingUrl)
587
- this.setClientStylingURL();
588
- this.limitStylingAppends = true;
565
+ componentDidLoad() {
566
+ if (this.stylingContainer) {
567
+ // @ts-ignore
568
+ if (window.emMessageBus != undefined) {
569
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
570
+ }
571
+ else {
572
+ if (this.clientStyling)
573
+ setClientStyling(this.stylingContainer, this.clientStyling);
574
+ if (this.clientStylingUrl)
575
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
576
+ }
589
577
  }
590
- // end custom styling area
578
+ }
579
+ disconnectedCallback() {
580
+ this.stylingSubscription && this.stylingSubscription.unsubscribe();
591
581
  }
592
582
  calcMandatoryActions() {
593
583
  this.mandatoryItems = 0;
@@ -603,7 +593,7 @@ const UserActionController = class {
603
593
  this.userActionsValidated = this.mandatoryActionsChecked === this.mandatoryItems;
604
594
  return (index.h("div", { class: "QueryReferenceContainer", ref: el => this.stylingContainer = el }, this.isLoading ? (index.h("slot", { name: 'spinner' })
605
595
  &&
606
- index.h("svg", { class: "spinner", viewBox: "0 0 50 50" }, index.h("circle", { class: "path", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "5" }))) : (index.h("div", { class: "UserActionController" }, index.h("h2", { class: "UserConsentNotice" }, translate('userNoticeText', this.lang)), index.h("div", { class: "PlayerLegislationWrapper" }, this.activeUserActions.map(action => (index.h("slot", { name: action }, index.h("player-user-consents", { lang: this.lang, "gm-version": this.gmVersion, "translation-url": this.translationUrl, consentType: action, consentTitle: this.consentTitles[action], queried: this.queryFired, mandatory: this.mandatoryActions.includes(action), "client-styling-url": this.clientStylingUrl, "client-styling": this.clientStyling }))))), this.includeSubmitButton &&
596
+ index.h("svg", { class: "spinner", viewBox: "0 0 50 50" }, index.h("circle", { class: "path", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "5" }))) : (index.h("div", { class: "UserActionController" }, index.h("h2", { class: "UserConsentNotice" }, translate('userNoticeText', this.lang)), index.h("div", { class: "PlayerLegislationWrapper" }, this.activeUserActions.map(action => (index.h("slot", { name: action }, index.h("player-user-consents", { lang: this.lang, "gm-version": this.gmVersion, "translation-url": this.translationUrl, consentType: action, consentTitle: this.consentTitles[action], queried: this.queryFired, mandatory: this.mandatoryActions.includes(action), "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, "client-styling": this.clientStyling }))))), this.includeSubmitButton &&
607
597
  index.h("button", { class: "ConsentSubmitButton", disabled: !this.userActionsValidated, onClick: () => this.handleApplyClick() }, translate('submitButtonText', this.lang))))));
608
598
  }
609
599
  else {
@@ -2,11 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb2c9562.js');
5
+ const index = require('./index-316ef19a.js');
6
6
  const appGlobals = require('./app-globals-3a1e7e63.js');
7
7
 
8
8
  /*
9
- Stencil Client Patch Browser v4.26.0 | MIT Licensed | https://stenciljs.com
9
+ Stencil Client Patch Browser v4.22.3 | MIT Licensed | https://stenciljs.com
10
10
  */
11
11
  var patchBrowser = () => {
12
12
  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('user-action-controller.cjs.js', document.baseURI).href));
@@ -19,7 +19,7 @@ var patchBrowser = () => {
19
19
 
20
20
  patchBrowser().then(async (options) => {
21
21
  await appGlobals.globalScripts();
22
- return index.bootstrapLazy([["player-user-consents_2.cjs",[[1,"user-action-controller",{"endpoint":[513],"userSession":[513,"user-session"],"userId":[513,"user-id"],"lang":[1537],"includeSubmitButton":[516,"include-submit-button"],"gmVersion":[1,"gm-version"],"translationUrl":[513,"translation-url"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"queryFired":[32],"readyActionsCount":[32],"activeUserActions":[32],"userActionsValidated":[32],"receivedQueryResponses":[32],"limitStylingAppends":[32],"isLoading":[32],"mandatoryActionsChecked":[32],"mandatoryItems":[32]},[[0,"userLegislationConsent","userLegislationConsentHandler"]],{"translationUrl":["handleNewTranslations"],"receivedQueryResponses":["handleQueryResponse"]}],[1,"player-user-consents",{"lang":[1537],"queried":[516],"consentType":[513,"consent-type"],"mandatory":[516],"gmVersion":[1,"gm-version"],"consentTitle":[513,"consent-title"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"textContent":[32],"limitStylingAppends":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStylingUrl":["handleStylingUrlChange"]}]]]], options);
22
+ return index.bootstrapLazy([["player-user-consents_2.cjs",[[1,"user-action-controller",{"endpoint":[513],"userSession":[513,"user-session"],"userId":[513,"user-id"],"lang":[1537],"includeSubmitButton":[516,"include-submit-button"],"gmVersion":[1,"gm-version"],"translationUrl":[513,"translation-url"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"queryFired":[32],"readyActionsCount":[32],"activeUserActions":[32],"userActionsValidated":[32],"receivedQueryResponses":[32],"limitStylingAppends":[32],"isLoading":[32],"mandatoryActionsChecked":[32],"mandatoryItems":[32]},[[0,"userLegislationConsent","userLegislationConsentHandler"]],{"translationUrl":["handleNewTranslations"],"receivedQueryResponses":["handleQueryResponse"]}],[1,"player-user-consents",{"lang":[1537],"queried":[516],"consentType":[513,"consent-type"],"mandatory":[516],"gmVersion":[1,"gm-version"],"consentTitle":[513,"consent-title"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"mbSource":[513,"mb-source"],"textContent":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStylingUrl":["handleStylingUrlChange"]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
@@ -4,7 +4,7 @@
4
4
  ],
5
5
  "compiler": {
6
6
  "name": "@stencil/core",
7
- "version": "4.26.0",
7
+ "version": "4.22.3",
8
8
  "typescriptVersion": "5.5.4"
9
9
  },
10
10
  "collections": [
@@ -1,31 +1,28 @@
1
1
  import { h } from "@stencil/core";
2
2
  import { getTranslations, translate } from "../../utils/locale.utils";
3
+ import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
3
4
  import "../../../../../player-user-consents/dist/types/index";
4
5
  export class UserActionController {
5
6
  constructor() {
6
- /**
7
- * Language
8
- */
7
+ //for now this variable is hardcoded bcs we have terms and conditions and privacy policy mandatory and we dont receive with these new functionality the mandatory actions
8
+ this.mandatoryActions = ['termsandconditions', 'privacypolicy'];
9
+ this.userActions = [];
10
+ this.consentTitles = {
11
+ termsandconditions: translate('termsAndConditionsTitle', this.lang),
12
+ sms: translate('smsTitle', this.lang),
13
+ emailmarketing: translate('emailMarketingTitle', this.lang),
14
+ privacypolicy: translate('privacyPolicyTitle', this.lang)
15
+ };
16
+ this.endpoint = undefined;
17
+ this.userSession = undefined;
18
+ this.userId = undefined;
9
19
  this.lang = 'en';
10
- /**
11
- * Select GM version
12
- */
20
+ this.includeSubmitButton = undefined;
13
21
  this.gmVersion = '';
14
- /**
15
- * Translation url
16
- */
17
22
  this.translationUrl = '';
18
- /**
19
- * Client custom styling via inline style
20
- */
21
23
  this.clientStyling = '';
22
- /**
23
- * Client custom styling via url
24
- */
25
24
  this.clientStylingUrl = '';
26
- /**
27
- * Which actions are required in order to activate the "Apply" button. Other actions are considered optional.
28
- */
25
+ this.mbSource = undefined;
29
26
  this.queryFired = false;
30
27
  this.readyActionsCount = 0;
31
28
  this.activeUserActions = [];
@@ -34,33 +31,7 @@ export class UserActionController {
34
31
  this.limitStylingAppends = false;
35
32
  this.isLoading = true;
36
33
  this.mandatoryActionsChecked = 0;
37
- //for now this variable is hardcoded bcs we have terms and conditions and privacy policy mandatory and we dont receive with these new functionality the mandatory actions
38
- this.mandatoryActions = ['termsandconditions', 'privacypolicy'];
39
- this.userActions = [];
40
- this.consentTitles = {
41
- termsandconditions: translate('termsAndConditionsTitle', this.lang),
42
- sms: translate('smsTitle', this.lang),
43
- emailmarketing: translate('emailMarketingTitle', this.lang),
44
- privacypolicy: translate('privacyPolicyTitle', this.lang)
45
- };
46
- this.setClientStyling = () => {
47
- let sheet = document.createElement('style');
48
- sheet.innerHTML = this.clientStyling;
49
- this.stylingContainer.prepend(sheet);
50
- };
51
- this.setClientStylingURL = () => {
52
- let url = new URL(this.clientStylingUrl);
53
- let cssFile = document.createElement('style');
54
- fetch(url.href)
55
- .then((res) => res.text())
56
- .then((data) => {
57
- cssFile.innerHTML = data;
58
- setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
59
- })
60
- .catch((err) => {
61
- console.log('error ', err);
62
- });
63
- };
34
+ this.mandatoryItems = undefined;
64
35
  }
65
36
  handleNewTranslations() {
66
37
  getTranslations(this.translationUrl);
@@ -197,16 +168,22 @@ export class UserActionController {
197
168
  await getTranslations(this.translationUrl);
198
169
  }
199
170
  }
200
- componentDidRender() {
201
- // start custom styling area
202
- if (!this.limitStylingAppends && this.stylingContainer) {
203
- if (this.clientStyling)
204
- this.setClientStyling();
205
- if (this.clientStylingUrl)
206
- this.setClientStylingURL();
207
- this.limitStylingAppends = true;
171
+ componentDidLoad() {
172
+ if (this.stylingContainer) {
173
+ // @ts-ignore
174
+ if (window.emMessageBus != undefined) {
175
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
176
+ }
177
+ else {
178
+ if (this.clientStyling)
179
+ setClientStyling(this.stylingContainer, this.clientStyling);
180
+ if (this.clientStylingUrl)
181
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
182
+ }
208
183
  }
209
- // end custom styling area
184
+ }
185
+ disconnectedCallback() {
186
+ this.stylingSubscription && this.stylingSubscription.unsubscribe();
210
187
  }
211
188
  calcMandatoryActions() {
212
189
  this.mandatoryItems = 0;
@@ -222,7 +199,7 @@ export class UserActionController {
222
199
  this.userActionsValidated = this.mandatoryActionsChecked === this.mandatoryItems;
223
200
  return (h("div", { class: "QueryReferenceContainer", ref: el => this.stylingContainer = el }, this.isLoading ? (h("slot", { name: 'spinner' })
224
201
  &&
225
- 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" }, translate('userNoticeText', this.lang)), h("div", { class: "PlayerLegislationWrapper" }, this.activeUserActions.map(action => (h("slot", { name: action }, h("player-user-consents", { lang: this.lang, "gm-version": this.gmVersion, "translation-url": this.translationUrl, consentType: action, consentTitle: this.consentTitles[action], queried: this.queryFired, mandatory: this.mandatoryActions.includes(action), "client-styling-url": this.clientStylingUrl, "client-styling": this.clientStyling }))))), this.includeSubmitButton &&
202
+ 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" }, translate('userNoticeText', this.lang)), h("div", { class: "PlayerLegislationWrapper" }, this.activeUserActions.map(action => (h("slot", { name: action }, h("player-user-consents", { lang: this.lang, "gm-version": this.gmVersion, "translation-url": this.translationUrl, consentType: action, consentTitle: this.consentTitles[action], queried: this.queryFired, mandatory: this.mandatoryActions.includes(action), "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, "client-styling": this.clientStyling }))))), this.includeSubmitButton &&
226
203
  h("button", { class: "ConsentSubmitButton", disabled: !this.userActionsValidated, onClick: () => this.handleApplyClick() }, translate('submitButtonText', this.lang))))));
227
204
  }
228
205
  else {
@@ -257,8 +234,6 @@ export class UserActionController {
257
234
  "tags": [],
258
235
  "text": "the endpoint required for the update call"
259
236
  },
260
- "getter": false,
261
- "setter": false,
262
237
  "attribute": "endpoint",
263
238
  "reflect": true
264
239
  },
@@ -276,8 +251,6 @@ export class UserActionController {
276
251
  "tags": [],
277
252
  "text": "user session required for the update call"
278
253
  },
279
- "getter": false,
280
- "setter": false,
281
254
  "attribute": "user-session",
282
255
  "reflect": true
283
256
  },
@@ -295,8 +268,6 @@ export class UserActionController {
295
268
  "tags": [],
296
269
  "text": "user id required for the update call"
297
270
  },
298
- "getter": false,
299
- "setter": false,
300
271
  "attribute": "user-id",
301
272
  "reflect": true
302
273
  },
@@ -314,8 +285,6 @@ export class UserActionController {
314
285
  "tags": [],
315
286
  "text": "Language"
316
287
  },
317
- "getter": false,
318
- "setter": false,
319
288
  "attribute": "lang",
320
289
  "reflect": true,
321
290
  "defaultValue": "'en'"
@@ -334,8 +303,6 @@ export class UserActionController {
334
303
  "tags": [],
335
304
  "text": "whether or not to include the submit button (in case we want to compose a different )"
336
305
  },
337
- "getter": false,
338
- "setter": false,
339
306
  "attribute": "include-submit-button",
340
307
  "reflect": true
341
308
  },
@@ -353,8 +320,6 @@ export class UserActionController {
353
320
  "tags": [],
354
321
  "text": "Select GM version"
355
322
  },
356
- "getter": false,
357
- "setter": false,
358
323
  "attribute": "gm-version",
359
324
  "reflect": false,
360
325
  "defaultValue": "''"
@@ -373,8 +338,6 @@ export class UserActionController {
373
338
  "tags": [],
374
339
  "text": "Translation url"
375
340
  },
376
- "getter": false,
377
- "setter": false,
378
341
  "attribute": "translation-url",
379
342
  "reflect": true,
380
343
  "defaultValue": "''"
@@ -393,8 +356,6 @@ export class UserActionController {
393
356
  "tags": [],
394
357
  "text": "Client custom styling via inline style"
395
358
  },
396
- "getter": false,
397
- "setter": false,
398
359
  "attribute": "client-styling",
399
360
  "reflect": true,
400
361
  "defaultValue": "''"
@@ -413,11 +374,26 @@ export class UserActionController {
413
374
  "tags": [],
414
375
  "text": "Client custom styling via url"
415
376
  },
416
- "getter": false,
417
- "setter": false,
418
377
  "attribute": "client-styling-url",
419
378
  "reflect": true,
420
379
  "defaultValue": "''"
380
+ },
381
+ "mbSource": {
382
+ "type": "string",
383
+ "mutable": false,
384
+ "complexType": {
385
+ "original": "string",
386
+ "resolved": "string",
387
+ "references": {}
388
+ },
389
+ "required": false,
390
+ "optional": false,
391
+ "docs": {
392
+ "tags": [],
393
+ "text": ""
394
+ },
395
+ "attribute": "mb-source",
396
+ "reflect": true
421
397
  }
422
398
  };
423
399
  }