@everymatrix/bonus-elevate-powerups-lobby 0.0.1

package/dist/cjs/index.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const bonusElevatePowerupsLobby = require('./bonus-elevate-powerups-lobby-a19b84c9.js');
+require('./index-d5c2977d.js');
+
+
+
+exports.BonusElevatePowerupsLobby = bonusElevatePowerupsLobby.BonusElevatePowerupsLobby;

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-d5c2977d.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["bonus-elevate-powerups_7.cjs",[[1,"bonus-elevate-powerups-lobby",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"pageSize":[514,"page-size"],"activeTab":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[1,"bonus-elevate-powerups",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"endpoint":[513],"session":[513],"pageSize":[514,"page-size"],"isLoading":[32],"powerups":[32],"offset":[32],"limit":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData","handleDataConfigChange"],"endpoint":["loadData","handleDataConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"bonus-elevate-powerups-history",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"endpoint":[513],"session":[513],"pageSize":[514,"page-size"],"translationUrl":[513,"translation-url"],"isLoading":[32],"powerups":[32],"offset":[32],"limit":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData"],"endpoint":["loadData"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"time-count",{"expireTime":[1,"expire-time"],"displayTime":[32]},null,{"expireTime":["startTimeChanged"]}],[0,"bonus-pagination-nav",{"total":[1538],"limit":[1538],"offset":[1538],"tableId":[1537,"table-id"],"language":[1537],"translationUrl":[513,"translation-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"displayPageNumbers":[1540,"display-page-numbers"],"displayRangeOfTotal":[1540,"display-range-of-total"],"navItemAccount":[1538,"nav-item-account"],"endPageIndex":[32],"pagesArray":[32],"currentPage":[32],"showAsEllipsisMid":[32]},[[8,"paginationReset","pageLimitChangedHandler"],[8,"pageLimitChanged","pageLimitChangedHandler"]]],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,44 @@
+{
+  "entries": [
+    "components/bonus-elevate-powerups-lobby/bonus-elevate-powerups-lobby.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.19.2",
+    "typescriptVersion": "5.4.5"
+  },
+  "collections": [
+    {
+      "name": "@everymatrix/bonus-elevate-powerups",
+      "tags": [
+        "bonus-elevate-powerups",
+        "time-count"
+      ]
+    },
+    {
+      "name": "@everymatrix/bonus-elevate-powerups-history",
+      "tags": [
+        "bonus-elevate-powerups-history"
+      ]
+    },
+    {
+      "name": "@everymatrix/bonus-pagination-nav",
+      "tags": [
+        "bonus-pagination-nav"
+      ]
+    },
+    {
+      "name": "@everymatrix/ui-image",
+      "tags": [
+        "ui-image"
+      ]
+    },
+    {
+      "name": "@everymatrix/ui-skeleton",
+      "tags": [
+        "ui-skeleton"
+      ]
+    }
+  ],
+  "bundles": []
+}

package/dist/collection/components/bonus-elevate-powerups-lobby/bonus-elevate-powerups-lobby.css

@@ -0,0 +1,48 @@
+:host {
+  display: block;
+}
+
+.PowerUpsLobby {
+  padding: 10px;
+}
+.PowerUpsLobby .Desc {
+  display: none !important;
+}
+.PowerUpsLobby .TabItem {
+  position: relative;
+  cursor: pointer;
+  padding: 10px 20px;
+  border-bottom: 2px solid transparent;
+}
+.PowerUpsLobby .TabItem::after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background-image: linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange1, #E0A84E) 100%);
+  transform: scaleX(0);
+}
+.PowerUpsLobby .TabItem.Active::after {
+  transform: scaleX(1);
+}
+.PowerUpsLobby .TabTitle {
+  display: flex;
+  flex-direction: row;
+  text-transform: uppercase;
+}
+.PowerUpsLobby .TabTitle .Tab {
+  flex: 1;
+  padding: 10px 20px;
+  text-align: center;
+  cursor: pointer;
+}
+.PowerUpsLobby .TabTitle .Active1 {
+  border-bottom: 2px solid;
+  border-image-source: linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange1, #E0A84E) 100%);
+  border-image-slice: 1;
+}
+.PowerUpsLobby .TabContent {
+  margin-top: 20px;
+}

package/dist/collection/components/bonus-elevate-powerups-lobby/bonus-elevate-powerups-lobby.js

@@ -0,0 +1,242 @@
+import { h } from "@stencil/core";
+import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
+import { getTranslations, translate } from "../../utils/locale.utils";
+import { MultiplierMode } from "../../../../../../../../libs/common/src/types/casino/powerups";
+import "../../../../../bonus-elevate-powerups/dist/types/index";
+import "../../../../../bonus-elevate-powerups-history/dist/types/index";
+export class BonusElevatePowerupsLobby {
+    constructor() {
+        this.tabsInfo = {
+            'available': { tabId: 'available', offset: 0, limit: this.pageSize },
+            'history': { tabId: 'history', offset: 0, limit: this.pageSize
+            }
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = undefined;
+        this.language = 'en';
+        this.endpoint = undefined;
+        this.session = undefined;
+        this.pageSize = 20;
+        this.activeTab = this.tabsInfo.available.tabId;
+    }
+    onTabClick(tab) {
+        this.activeTab = tab;
+    }
+    render() {
+        return h("div", { key: '28c29b3160d58b90e8d98f0375f2c51763872158', class: 'PowerUpsLobby', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'fa242490d51a5e38e2c600e57dadb9f2708e21f2', class: 'TabTitle' }, h("span", { key: '041edb872b4fa22a3822309918767e7f3de9aa3d', class: `Tab TabItem ${this.activeTab === 'available' ? 'Active' : ''}`, onClick: this.onTabClick.bind(this, 'available') }, translate('available', this.language)), h("span", { key: '8888c5d09305653b18e82d6ef3a1ae26aceca314', class: `Tab TabItem ${this.activeTab === 'history' ? 'Active' : ''}`, onClick: this.onTabClick.bind(this, 'history') }, translate('history', this.language))), h("div", { key: '82132c243f8cd3531c5ca0cb320c4723ffc0f0b4', class: 'Desc' }, " ", MultiplierMode.XP, " "), h("div", { key: '8b638cce7dfe2d0983c82874aef59b1e8ec474dc', class: 'TabContent' }, this.activeTab === 'available' &&
+            h("bonus-elevate-powerups", { key: '5e236af908d621ccb8af1ab61ab62fd8db7694a5', endpoint: this.endpoint, session: this.session, language: this.language, "mb-source": this.mbSource, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "page-size": this.pageSize }), this.activeTab === 'history' &&
+            h("bonus-elevate-powerups-history", { key: '7d58ac9a7374f67bea7bd43541dd37b0b2968019', endpoint: this.endpoint, session: this.session, language: this.language, "mb-source": this.mbSource, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "page-size": this.pageSize })));
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleNewTranslations() {
+        getTranslations(this.translationUrl);
+    }
+    async componentWillLoad() {
+        if (this.translationUrl) {
+            await getTranslations(this.translationUrl);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    static get is() { return "bonus-elevate-powerups-lobby"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["bonus-elevate-powerups-lobby.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["bonus-elevate-powerups-lobby.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "mbSource": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "mb-source",
+                "reflect": true
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "client-styling",
+                "reflect": true
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "client-styling-url",
+                "reflect": true
+            },
+            "translationUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "translation-url",
+                "reflect": true
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "'en'"
+            },
+            "endpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "endpoint",
+                "reflect": true
+            },
+            "session": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "session",
+                "reflect": true
+            },
+            "pageSize": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "page-size",
+                "reflect": true,
+                "defaultValue": "20"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "activeTab": {}
+        };
+    }
+    static get watchers() {
+        return [{
+                "propName": "clientStyling",
+                "methodName": "handleClientStylingChange"
+            }, {
+                "propName": "clientStylingUrl",
+                "methodName": "handleClientStylingUrlChange"
+            }, {
+                "propName": "mbSource",
+                "methodName": "handleMbSourceChange"
+            }, {
+                "propName": "translationUrl",
+                "methodName": "handleNewTranslations"
+            }];
+    }
+}

package/dist/collection/components/bonus-elevate-powerups-lobby/index.js

@@ -0,0 +1 @@
+export { BonusElevatePowerupsLobby } from './bonus-elevate-powerups-lobby';

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components/bonus-elevate-powerups-lobby';

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

@@ -0,0 +1,35 @@
+const DEFAULT_LANGUAGE = 'en';
+const TRANSLATIONS = {
+    en: {
+        history: 'History',
+        available: 'Available',
+    }
+};
+export const getTranslations = (url) => {
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((lang) => {
+                if (!TRANSLATIONS[lang]) {
+                    TRANSLATIONS[lang] = {};
+                }
+                for (let key in data[lang]) {
+                    TRANSLATIONS[lang][key] = data[lang][key];
+                }
+            });
+            resolve(true);
+        });
+    });
+};
+export const translate = (key, customLang, values) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
+    if (values !== undefined) {
+        for (const [key, value] of Object.entries(values.values)) {
+            const regex = new RegExp(`{${key}}`, 'g');
+            translation = translation.replace(regex, value);
+        }
+    }
+    return translation;
+};

package/dist/esm/app-globals-0f993ce5.js

@@ -0,0 +1,3 @@
+const globalScripts = () => {};
+
+export { globalScripts as g };

package/dist/esm/bonus-elevate-powerups-lobby-09c95672.js

@@ -0,0 +1,251 @@
+import { r as registerInstance, h } from './index-64ff3a3a.js';
+
+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
+ * @param {HTMLElement} stylingContainer The reference element of the widget
+ * @param {string} clientStyling The style content
+ */
+function setClientStyling(stylingContainer, clientStyling) {
+  if (stylingContainer) {
+    const sheet = document.createElement('style');
+    sheet.innerHTML = clientStyling;
+    stylingContainer.appendChild(sheet);
+  }
+}
+
+/**
+ * @name setClientStylingURL
+ * @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
+ * @param {HTMLElement} stylingContainer The reference element of the widget
+ * @param {string} clientStylingUrl The URL of the style content
+ */
+function setClientStylingURL(stylingContainer, clientStylingUrl) {
+  if (!stylingContainer || !clientStylingUrl) return;
+
+  const url = new URL(clientStylingUrl);
+
+  fetch(url.href)
+    .then((res) => res.text())
+    .then((data) => {
+      const cssFile = document.createElement('style');
+      cssFile.innerHTML = data;
+      if (stylingContainer) {
+        stylingContainer.appendChild(cssFile);
+      }
+    })
+    .catch((err) => {
+      console.error('There was an error while trying to load client styling from URL', err);
+    });
+}
+
+/**
+ * @name setStreamLibrary
+ * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
+ * @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, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
+
+  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] && 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 DEFAULT_LANGUAGE = 'en';
+const TRANSLATIONS = {
+    en: {
+        history: 'History',
+        available: 'Available',
+    }
+};
+const getTranslations = (url) => {
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((lang) => {
+                if (!TRANSLATIONS[lang]) {
+                    TRANSLATIONS[lang] = {};
+                }
+                for (let key in data[lang]) {
+                    TRANSLATIONS[lang][key] = data[lang][key];
+                }
+            });
+            resolve(true);
+        });
+    });
+};
+const translate = (key, customLang, values) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
+    if (values !== undefined) {
+        for (const [key, value] of Object.entries(values.values)) {
+            const regex = new RegExp(`{${key}}`, 'g');
+            translation = translation.replace(regex, value);
+        }
+    }
+    return translation;
+};
+
+var MultiplierMode;
+(function (MultiplierMode) {
+    MultiplierMode[MultiplierMode["COINS"] = 1] = "COINS";
+    MultiplierMode[MultiplierMode["XP"] = 2] = "XP";
+})(MultiplierMode || (MultiplierMode = {}));
+var BoostingPeriodMode;
+(function (BoostingPeriodMode) {
+    BoostingPeriodMode[BoostingPeriodMode["TIME_PERIOD"] = 1] = "TIME_PERIOD";
+    BoostingPeriodMode[BoostingPeriodMode["NUMBER_OF_ROUNDS"] = 2] = "NUMBER_OF_ROUNDS";
+})(BoostingPeriodMode || (BoostingPeriodMode = {}));
+var PowerUpStatus;
+(function (PowerUpStatus) {
+    PowerUpStatus[PowerUpStatus["ACTIVE"] = 0] = "ACTIVE";
+    PowerUpStatus[PowerUpStatus["ACTIVATED"] = 1] = "ACTIVATED";
+    PowerUpStatus[PowerUpStatus["EXPIRED"] = 2] = "EXPIRED";
+    PowerUpStatus[PowerUpStatus["CONSUMED"] = 3] = "CONSUMED";
+    PowerUpStatus[PowerUpStatus["DISABLED"] = 4] = "DISABLED";
+    PowerUpStatus[PowerUpStatus["ENABLED"] = 6] = "ENABLED";
+})(PowerUpStatus || (PowerUpStatus = {}));
+
+const bonusElevatePowerupsLobbyCss = ":host{display:block}.PowerUpsLobby{padding:10px}.PowerUpsLobby .Desc{display:none !important}.PowerUpsLobby .TabItem{position:relative;cursor:pointer;padding:10px 20px;border-bottom:2px solid transparent}.PowerUpsLobby .TabItem::after{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:2px;background-image:linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange1, #E0A84E) 100%);transform:scaleX(0)}.PowerUpsLobby .TabItem.Active::after{transform:scaleX(1)}.PowerUpsLobby .TabTitle{display:flex;flex-direction:row;text-transform:uppercase}.PowerUpsLobby .TabTitle .Tab{flex:1;padding:10px 20px;text-align:center;cursor:pointer}.PowerUpsLobby .TabTitle .Active1{border-bottom:2px solid;border-image-source:linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange1, #E0A84E) 100%);border-image-slice:1}.PowerUpsLobby .TabContent{margin-top:20px}";
+const BonusElevatePowerupsLobbyStyle0 = bonusElevatePowerupsLobbyCss;
+
+const BonusElevatePowerupsLobby = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.tabsInfo = {
+            'available': { tabId: 'available', offset: 0, limit: this.pageSize },
+            'history': { tabId: 'history', offset: 0, limit: this.pageSize
+            }
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = undefined;
+        this.language = 'en';
+        this.endpoint = undefined;
+        this.session = undefined;
+        this.pageSize = 20;
+        this.activeTab = this.tabsInfo.available.tabId;
+    }
+    onTabClick(tab) {
+        this.activeTab = tab;
+    }
+    render() {
+        return h("div", { key: '28c29b3160d58b90e8d98f0375f2c51763872158', class: 'PowerUpsLobby', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'fa242490d51a5e38e2c600e57dadb9f2708e21f2', class: 'TabTitle' }, h("span", { key: '041edb872b4fa22a3822309918767e7f3de9aa3d', class: `Tab TabItem ${this.activeTab === 'available' ? 'Active' : ''}`, onClick: this.onTabClick.bind(this, 'available') }, translate('available', this.language)), h("span", { key: '8888c5d09305653b18e82d6ef3a1ae26aceca314', class: `Tab TabItem ${this.activeTab === 'history' ? 'Active' : ''}`, onClick: this.onTabClick.bind(this, 'history') }, translate('history', this.language))), h("div", { key: '82132c243f8cd3531c5ca0cb320c4723ffc0f0b4', class: 'Desc' }, " ", MultiplierMode.XP, " "), h("div", { key: '8b638cce7dfe2d0983c82874aef59b1e8ec474dc', class: 'TabContent' }, this.activeTab === 'available' &&
+            h("bonus-elevate-powerups", { key: '5e236af908d621ccb8af1ab61ab62fd8db7694a5', endpoint: this.endpoint, session: this.session, language: this.language, "mb-source": this.mbSource, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "page-size": this.pageSize }), this.activeTab === 'history' &&
+            h("bonus-elevate-powerups-history", { key: '7d58ac9a7374f67bea7bd43541dd37b0b2968019', endpoint: this.endpoint, session: this.session, language: this.language, "mb-source": this.mbSource, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "page-size": this.pageSize })));
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleNewTranslations() {
+        getTranslations(this.translationUrl);
+    }
+    async componentWillLoad() {
+        if (this.translationUrl) {
+            await getTranslations(this.translationUrl);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "translationUrl": ["handleNewTranslations"]
+    }; }
+};
+BonusElevatePowerupsLobby.style = BonusElevatePowerupsLobbyStyle0;
+
+export { BonusElevatePowerupsLobby as B, MultiplierMode as M, PowerUpStatus as P, BoostingPeriodMode as a, setClientStylingURL as b, setStreamStyling as c, setClientStyling as s };