@everymatrix/bonus-elevate-shop-item - npm Package Compare versions

Comparing version 1.44.0 to 1.45.0

dist/bonus-elevate-shop-item/bonus-elevate-shop-item.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as s}from"./p-3d8363a3.js";(()=>{const s=import.meta.url,t={};return""!==s&&(t.resourcesUrl=new URL(".",s).href),e(t)})().then((e=>s([["p-9546c5ba",[[1,"bonus-elevate-shop-item",{endpoint:[513],language:[513],itemId:[1537,"item-id"],elevateGift:[1040],session:[513],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],showSliderDots:[516,"show-slider-dots"],showSliderArrows:[516,"show-slider-arrows"],isGiftNotFound:[32],redeemErrorMsg:[32],isRedeeming:[32]}],[0,"bonus-elevate-shop-assets-slider",{showSliderDots:[516,"show-slider-dots"],showSliderArrows:[516,"show-slider-arrows"],itemsPerPage:[514,"items-per-page"],sliderItems:[16],activeIndex:[32]}],[4,"general-styling-wrapper",{clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],translationUrl:[1,"translation-url"],targetTranslations:[16]}]]]],e)));
+import{p as e,b as t}from"./p-ec5f179f.js";export{s as setNonce}from"./p-ec5f179f.js";import{g as i}from"./p-e1255160.js";(()=>{const s=import.meta.url,t={};return""!==s&&(t.resourcesUrl=new URL(".",s).href),e(t)})().then((async e=>(await i(),t([["p-961d6b9a",[[1,"bonus-elevate-shop-item",{endpoint:[513],language:[513],itemId:[1537,"item-id"],elevateGift:[1040],session:[513],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],showSliderDots:[516,"show-slider-dots"],showSliderArrows:[516,"show-slider-arrows"],isGiftNotFound:[32],redeemErrorMsg:[32],isRedeeming:[32]}],[0,"bonus-elevate-shop-assets-slider",{showSliderDots:[516,"show-slider-dots"],showSliderArrows:[516,"show-slider-arrows"],itemsPerPage:[514,"items-per-page"],sliderItems:[16],activeIndex:[32]}],[4,"general-styling-wrapper",{clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],translationUrl:[1,"translation-url"],targetTranslations:[16]}]]]],e))));

dist/cjs/bonus-elevate-shop-assets-slider_3.cjs.entry.js

@@ -5,137 +5,128 @@ 'use strict';
 
-const index = require('./index-355d8ffb.js');
+const index = require('./index-1035f878.js');
 
 const BonusElevateShopAssetsSlider = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.itemsPerPage = 1;
-    this.sliderItems = [];
-    /**
-     * Slider variables
-     */
-    this.activeIndex = 0;
-    this.xDown = null;
-    this.yDown = null;
-    this.orientationChangeHandler = () => {
-      setTimeout(() => {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.xDown = null;
+        this.yDown = null;
+        this.orientationChangeHandler = () => {
+            setTimeout(() => {
+                this.recalculateItemsPerPage();
+            }, 10);
+        };
+        this.resizeHandler = () => {
+            this.recalculateItemsPerPage();
+        };
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.itemsPerPage = 1;
+        this.sliderItems = [];
+        this.activeIndex = 0;
+    }
+    setActive(index) {
+        var _a;
+        const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
+        if (index >= 0) {
+            if (index >= maxLength - 1) {
+                this.activeIndex = maxLength - 1;
+            }
+            else {
+                this.activeIndex = index;
+            }
+        }
+        else {
+            this.activeIndex = 0;
+        }
+    }
+    move(direction) {
+        this.setActive(this.activeIndex + direction);
+    }
+    goTo(index) {
+        let diff = this.activeIndex - index;
+        if (diff > 0) {
+            for (let i = 0; i < diff; i++) {
+                this.move(-1);
+            }
+        }
+        else {
+            for (let i = 0; i > diff; i--) {
+                this.move(1);
+            }
+        }
+    }
+    handleTouchStart(evt) {
+        const firstTouch = this.getTouches(evt)[0];
+        this.xDown = firstTouch.clientX;
+        this.yDown = firstTouch.clientY;
+    }
+    getTouches(evt) {
+        return evt.touches || evt.originalEvent.touches;
+    }
+    handleTouchMove(evt) {
+        if (!this.xDown || !this.yDown)
+            return;
+        let xUp = evt.touches[0].clientX;
+        let yUp = evt.touches[0].clientY;
+        let xDiff = this.xDown - xUp;
+        let yDiff = this.yDown - yUp;
+        if (Math.abs(xDiff) > Math.abs(yDiff)) {
+            if (xDiff > 0) {
+                this.move(1);
+            }
+            else {
+                this.move(-1);
+            }
+        }
+        this.xDown = null;
+        this.yDown = null;
+    }
+    ;
+    recalculateItemsPerPage() {
+        if (!this.sliderItemsElement)
+            return;
+        this.itemElementWidth = this.sliderItemsElement.clientWidth;
+        this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
+    }
+    ;
+    renderDots() {
+        var _a;
+        const dots = [];
+        for (let index$1 = 0; index$1 < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index$1++) {
+            dots.push(index.h("li", { class: index$1 == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index$1); this.setActive(index$1); } }));
+        }
+        return dots;
+    }
+    componentDidRender() {
+        this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
+        this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
         this.recalculateItemsPerPage();
-      }, 10);
-    };
-    this.resizeHandler = () => {
-      this.recalculateItemsPerPage();
-    };
-  }
-  setActive(index) {
-    var _a;
-    const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
-    if (index >= 0) {
-      if (index >= maxLength - 1) {
-        this.activeIndex = maxLength - 1;
-      }
-      else {
-        this.activeIndex = index;
-      }
     }
-    else {
-      this.activeIndex = 0;
+    componentDidUpdate() {
+        this.recalculateItemsPerPage();
     }
-  }
-  move(direction) {
-    this.setActive(this.activeIndex + direction);
-  }
-  goTo(index) {
-    let diff = this.activeIndex - index;
-    if (diff > 0) {
-      for (let i = 0; i < diff; i++) {
-        this.move(-1);
-      }
+    connectedCallback() {
+        window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
     }
-    else {
-      for (let i = 0; i > diff; i--) {
-        this.move(1);
-      }
+    disconnectedCallback() {
+        this.el.removeEventListener('touchstart', this.handleTouchStart);
+        this.el.removeEventListener('touchmove', this.handleTouchMove);
+        window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
+        window.removeEventListener('resize', this.resizeHandler);
     }
-  }
-  handleTouchStart(evt) {
-    const firstTouch = this.getTouches(evt)[0];
-    this.xDown = firstTouch.clientX;
-    this.yDown = firstTouch.clientY;
-  }
-  getTouches(evt) {
-    return evt.touches || evt.originalEvent.touches;
-  }
-  handleTouchMove(evt) {
-    if (!this.xDown || !this.yDown)
-      return;
-    let xUp = evt.touches[0].clientX;
-    let yUp = evt.touches[0].clientY;
-    let xDiff = this.xDown - xUp;
-    let yDiff = this.yDown - yUp;
-    if (Math.abs(xDiff) > Math.abs(yDiff)) {
-      if (xDiff > 0) {
-        this.move(1);
-      }
-      else {
-        this.move(-1);
-      }
+    render() {
+        var _a;
+        const styles = {
+            transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
+        };
+        const itemStyle = {
+            width: `${this.itemElementWidth / this.itemsPerPage}px`
+        };
+        return index.h("div", { key: '210d648ae90dd04e350c0cddb2047061f5989bd8', class: "SliderWrapper" }, index.h("div", { key: '240a214bc772890145b8317bfda32f6099150726', class: 'MainContent ' }, this.showSliderArrows &&
+            index.h("div", { key: 'e8e144fbc2906ee0c5e77cc00c33fb1e89ced29f', class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) }, index.h("svg", { key: '068a669fa96d11532199f2f2eb44e3a4c3f31e10', fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '2789bb8d91ce4ec7f0fd7c3c6b9f3c7b7e682088', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))), index.h("div", { key: '034ef81e4d9a8dea56fd42791e8a08940dfa4af6', class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el }, index.h("div", { key: 'f412b5f0978348e4d9e0af682d151a1880f6e86d', class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => index.h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))), this.showSliderArrows &&
+            index.h("div", { key: '0f8549f8a5bcf2f1cfcde601930610fe5cc98427', class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
+                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) }, index.h("svg", { key: '5758a9a73af5f7fa4618ae1b4bb30d838b509d9f', fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '720c5f0f496e8817fc9017ec4e8706cb9644e9ef', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))), this.showSliderDots && this.sliderItems.length > 1 &&
+            index.h("div", { key: '9c1b9c57b1871d7463569ea9566b28e925870d59', class: "DotsWrapper" }, index.h("ul", { key: '548d1d0f2c46170e07aa7ed4019dc3469e2e3950', class: "Dots" }, this.renderDots())));
     }
-    this.xDown = null;
-    this.yDown = null;
-  }
-  ;
-  recalculateItemsPerPage() {
-    if (!this.sliderItemsElement)
-      return;
-    this.itemElementWidth = this.sliderItemsElement.clientWidth;
-    this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
-  }
-  ;
-  renderDots() {
-    var _a;
-    const dots = [];
-    for (let index$1 = 0; index$1 < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index$1++) {
-      dots.push(index.h("li", { class: index$1 == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index$1); this.setActive(index$1); } }));
-    }
-    return dots;
-  }
-  componentDidRender() {
-    this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
-    this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
-    this.recalculateItemsPerPage();
-  }
-  componentDidUpdate() {
-    this.recalculateItemsPerPage();
-  }
-  connectedCallback() {
-    window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
-  }
-  disconnectedCallback() {
-    this.el.removeEventListener('touchstart', this.handleTouchStart);
-    this.el.removeEventListener('touchmove', this.handleTouchMove);
-    window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
-    window.removeEventListener('resize', this.resizeHandler);
-  }
-  render() {
-    var _a;
-    const styles = {
-      transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
-    };
-    const itemStyle = {
-      width: `${this.itemElementWidth / this.itemsPerPage}px`
-    };
-    return index.h("div", { class: "SliderWrapper" }, index.h("div", { class: 'MainContent ' }, this.showSliderArrows &&
-      index.h("div", { class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) }, index.h("svg", { fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))), index.h("div", { class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el }, index.h("div", { class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => index.h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))), this.showSliderArrows &&
-      index.h("div", { class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
-                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) }, index.h("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))), this.showSliderDots && this.sliderItems.length > 1 &&
-      index.h("div", { class: "DotsWrapper" }, index.h("ul", { class: "Dots" }, this.renderDots())));
-  }
-  get el() { return index.getElement(this); }
+    get el() { return index.getElement(this); }
 };
@@ -146,61 +137,61 @@
 const TRANSLATIONS = {
-  en: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  ro: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  fr: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  ar: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  hu: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  }
+    en: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    ro: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    fr: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    ar: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    hu: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    }
 };
 const translate = (key, customLang) => {
-  const lang = customLang;
-  return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+    const lang = customLang;
+    return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
 };
 const getTranslations = (url) => {
-  // fetch url, get the data, replace the TRANSLATIONS content
-  return new Promise((resolve) => {
-    fetch(url)
-      .then((res) => res.json())
-      .then((data) => {
-      Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-          TRANSLATIONS[item][key] = data[item][key];
-        }
-      });
-      resolve(true);
+    // fetch url, get the data, replace the TRANSLATIONS content
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((item) => {
+                for (let key in data[item]) {
+                    TRANSLATIONS[item][key] = data[item][key];
+                }
+            });
+            resolve(true);
+        });
     });
-  });
 };
@@ -215,242 +206,222 @@
 const getDevice = () => {
-  let userAgent = window.navigator.userAgent;
-  if (userAgent.toLowerCase().match(/android/i)) {
-    return 'Android';
-  }
-  if (userAgent.toLowerCase().match(/iphone/i)) {
-    return 'iPhone';
-  }
-  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
-    return 'iPad';
-  }
-  return 'PC';
-};
-const getDevicePlatform = () => {
-  const device = getDevice();
-  if (device) {
-    if (device === 'PC') {
-      return 'dk';
+    let userAgent = window.navigator.userAgent;
+    if (userAgent.toLowerCase().match(/android/i)) {
+        return 'Android';
     }
-    else if (device === 'iPad' || device === 'iPhone') {
-      return 'ios';
+    if (userAgent.toLowerCase().match(/iphone/i)) {
+        return 'iPhone';
     }
-    else {
-      return 'mtWeb';
+    if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+        return 'iPad';
     }
-  }
+    return 'PC';
 };
+const getDevicePlatform = () => {
+    const device = getDevice();
+    if (device) {
+        if (device === 'PC') {
+            return 'dk';
+        }
+        else if (device === 'iPad' || device === 'iPhone') {
+            return 'ios';
+        }
+        else {
+            return 'mtWeb';
+        }
+    }
+};
 
-const bonusElevateShopItemCss = ":host{display:block}.ElevateDetails{display:flex;flex-direction:row;flex-wrap:wrap;padding:10px;width:calc(100% - 20px);}.ElevateDetails .RedeemError{display:none}.ElevateDetails .Error{color:var(--emfe-w-color-error, #FD2839)}.ElevateDetails .Row{flex-direction:row;display:flex}.ElevateDetails .Col{flex-direction:column;display:flex}.ElevateDetails .Details{padding:20px}.ElevateDetails .ThumbnailRow{display:flex;flex-direction:column;justify-content:space-between;min-width:268px;max-width:398px}.ElevateDetails .ThumbnailRow .BackButton{width:20px;height:20px;padding:5px;background:white;box-shadow:0px 4px 40px 0px rgba(138, 149, 158, 0.2);margin:10px 0 10px;cursor:pointer;animation-timing-function:ease-out;animation-duration:300ms;transition-property:all;border:1px solid #e4e6e8;border-radius:5px;text-align:center}.ElevateDetails .ThumbnailRow .BackButton:hover{background:#e3dede}.ElevateDetails .ThumbnailRow .Thumbnails{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .ShopItemDetail{flex-grow:1;min-width:300px}.ElevateDetails .GiftPoints .Points{font-size:21px}.ElevateDetails .GiftPoints .PointsLabel{font-size:12px;color:var(--emfe-w-color-gray-300, #4e5a37);font-weight:400;line-height:29px;letter-spacing:0.04em;text-align:left}.ElevateDetails .RedeemButton:hover{font-weight:800;border:2px solid var(--emfe-w-color-gray-300, #e5e7d5)}.ElevateDetails .RedeemButton.Disabled:hover{font-weight:normal;border:2px solid transparent}.ElevateDetails .RedeemButton{margin-top:50px;color:#f1f1f1;font-size:20px;padding:16px 25px 16px 25px;border-radius:18px;text-align:center;cursor:pointer;background:linear-gradient(0deg, #26CC37, #26CC37), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%);border:2px solid;border-image-source:linear-gradient(283.85deg, rgba(190, 40, 40, 0.5) 0%, rgba(56, 64, 179, 0) 33.47%);box-shadow:0px 4px 4px 0px rgba(0, 0, 0, 0.25)}.ElevateDetails .RedeemButton.DkButton{width:80px;padding:8px;font-size:16px;border-radius:5px}.ElevateDetails .RedeemButton.Disabled{background:linear-gradient(0deg, #b8c4b9, #9eb0a0), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%)}.ElevateDetails .SliderWrapper{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .SliderWrapper .MainContent{display:flex;flex-direction:row;justify-content:space-around}.ElevateDetails .SliderWrapper .MainContent .LeftArrow,.ElevateDetails .SliderWrapper .MainContent .RightArrow{width:20px}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper{overflow:hidden;display:inline-flex;width:calc(100% - 40px);flex-direction:column}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper .Items{display:inline-flex;transition:transform 0.4s ease-in-out;transform:translateX(0px);margin:auto}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img2{width:50%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img3{width:30%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img,.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img1{max-width:100%;background:#efefef;border:1px solid #efefef;border-radius:18px;border:1px;margin:10px 0 10px}.ElevateDetails .SliderWrapper .DotsWrapper{width:100%;margin:0 auto;height:30px}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots{display:flex;justify-content:center;padding:0}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li{height:10px;width:10px;background:#ccc;border-radius:50%;margin-left:3px;margin-right:3px;list-style:none;cursor:pointer}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li:hover{background:#bbb}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.active{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.default{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background-color:#FFF}.ElevateDetails .SliderNavButton{border:0px;width:25px;display:flex;align-items:center;justify-content:center;cursor:pointer}.ElevateDetails .SliderNavButton.HiddenArrow{visibility:hidden}.ElevateDetails .SliderNavButton svg{width:20px;stroke:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .DisabledArrow svg{opacity:0.2;stroke:var(--emfe-w-color-secondary, #FD2839);pointer-events:none}";
+const bonusElevateShopItemCss = ":host{display:block}.ElevateDetails{display:flex;flex-direction:row;flex-wrap:wrap;padding:10px;width:calc(100% - 20px);}.ElevateDetails .RedeemError{display:none}.ElevateDetails .Error{color:var(--emfe-w-color-error, #FD2839)}.ElevateDetails .Row{flex-direction:row;display:flex}.ElevateDetails .Col{flex-direction:column;display:flex}.ElevateDetails .Details{padding:20px}.ElevateDetails .ThumbnailRow{display:flex;flex-direction:column;justify-content:space-between;min-width:268px;max-width:398px}.ElevateDetails .ThumbnailRow .BackButton{width:20px;height:20px;padding:5px;background:white;box-shadow:0px 4px 40px 0px rgba(138, 149, 158, 0.2);margin:10px 0 10px;cursor:pointer;animation-timing-function:ease-out;animation-duration:300ms;transition-property:all;border:1px solid #e4e6e8;border-radius:5px;text-align:center}.ElevateDetails .ThumbnailRow .BackButton:hover{background:rgb(227, 222, 222)}.ElevateDetails .ThumbnailRow .Thumbnails{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .ShopItemDetail{flex-grow:1;min-width:300px}.ElevateDetails .GiftPoints .Points{font-size:21px}.ElevateDetails .GiftPoints .PointsLabel{font-size:12px;color:var(--emfe-w-color-gray-300, rgb(78, 90, 55));font-weight:400;line-height:29px;letter-spacing:0.04em;text-align:left}.ElevateDetails .RedeemButton:hover{font-weight:800;border:2px solid var(--emfe-w-color-gray-300, rgb(229, 231, 213))}.ElevateDetails .RedeemButton.Disabled:hover{font-weight:normal;border:2px solid transparent}.ElevateDetails .RedeemButton{margin-top:50px;color:#f1f1f1;font-size:20px;padding:16px 25px 16px 25px;border-radius:18px;text-align:center;cursor:pointer;background:linear-gradient(0deg, #26CC37, #26CC37), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%);border:2px solid;border-image-source:linear-gradient(283.85deg, rgba(190, 40, 40, 0.5) 0%, rgba(56, 64, 179, 0) 33.47%);box-shadow:0px 4px 4px 0px rgba(0, 0, 0, 0.25)}.ElevateDetails .RedeemButton.DkButton{width:80px;padding:8px;font-size:16px;border-radius:5px}.ElevateDetails .RedeemButton.Disabled{background:linear-gradient(0deg, #b8c4b9, #9eb0a0), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%)}.ElevateDetails .SliderWrapper{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .SliderWrapper .MainContent{display:flex;flex-direction:row;justify-content:space-around}.ElevateDetails .SliderWrapper .MainContent .LeftArrow,.ElevateDetails .SliderWrapper .MainContent .RightArrow{width:20px}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper{overflow:hidden;display:inline-flex;width:calc(100% - 40px);flex-direction:column}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper .Items{display:inline-flex;transition:transform 0.4s ease-in-out;transform:translateX(0px);margin:auto}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img2{width:50%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img3{width:30%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img,.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img1{max-width:100%;background:rgb(239, 239, 239);border:1px solid rgb(239, 239, 239);border-radius:18px;border:1px;margin:10px 0 10px}.ElevateDetails .SliderWrapper .DotsWrapper{width:100%;margin:0 auto;height:30px}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots{display:flex;justify-content:center;padding:0}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li{height:10px;width:10px;background:#ccc;border-radius:50%;margin-left:3px;margin-right:3px;list-style:none;cursor:pointer}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li:hover{background:#bbb}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.active{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.default{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background-color:#FFF}.ElevateDetails .SliderNavButton{border:0px;width:25px;display:flex;align-items:center;justify-content:center;cursor:pointer}.ElevateDetails .SliderNavButton.HiddenArrow{visibility:hidden}.ElevateDetails .SliderNavButton svg{width:20px;stroke:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .DisabledArrow svg{opacity:0.2;stroke:var(--emfe-w-color-secondary, #FD2839);pointer-events:none}";
+const BonusElevateShopItemStyle0 = bonusElevateShopItemCss;
 
 const BonusElevateShopItem = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.redeemGiftButton = index.createEvent(this, "redeemGiftButton", 7);
-    /**
-     * Currently selected language.
-     */
-    this.language = 'en';
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.isGiftNotFound = false;
-    this.redeemErrorMsg = '';
-    this.isRedeeming = false;
-    this.bindedHandler = this.handleMessage.bind(this);
-    this.deviceType = getDevicePlatform();
-  }
-  redeemGiftConfirm() {
-    window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
-  }
-  handleMessage(message) {
-    if (message.data && message.data.type === "bee-redeem-confirmed" &&
-      message.data.id == this.elevateGift.id) {
-      this.redeemGift();
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.redeemGiftButton = index.createEvent(this, "redeemGiftButton", 7);
+        this.bindedHandler = this.handleMessage.bind(this);
+        this.deviceType = getDevicePlatform();
+        this.endpoint = undefined;
+        this.language = 'en';
+        this.itemId = undefined;
+        this.elevateGift = undefined;
+        this.session = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.isGiftNotFound = false;
+        this.redeemErrorMsg = '';
+        this.isRedeeming = false;
     }
-  }
-  onBackClicked() {
-    window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
-  }
-  redeemGift() {
-    if (this.elevateGift.available.toLowerCase() === 'false') {
-      return;
+    redeemGiftConfirm() {
+        window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
     }
-    let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
-    let claimGiftOptions = {
-      method: 'PUT',
-      headers: {
-        'x-SessionId': this.session,
-        'Content-Type': 'application/json-patch+json',
-      },
-      body: JSON.stringify({ giftId: this.elevateGift.id }),
-    };
-    this.redeemErrorMsg = '';
-    this.isRedeeming = true;
-    fetch(url.toString(), claimGiftOptions)
-      .then((res) => res.json())
-      .then((res) => {
-      if (res.success) {
-        this.redeemGiftButton.emit();
-        window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
-      }
-      else {
-        let translatedError = translate(`error${res.errorCode}`, this.language);
-        this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
-        window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
-      }
-    })
-      .catch((err) => {
-      window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
-    }).finally(() => {
-      this.isRedeeming = false;
-    });
-  }
-  async loadElevateGift() {
-    let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
-    let options = {
-      headers: {
-        'Content-Type': 'application/json',
-        'x-SessionId': this.session,
-      },
-      method: 'GET',
-    };
-    await new Promise((resolve) => {
-      fetch(url.href, options)
-        .then((res) => res.json())
-        .then((data) => {
-        let filteredGifts = data.data;
-        if (filteredGifts && filteredGifts.length == 1) {
-          this.elevateGift = filteredGifts[0];
-          this.isGiftNotFound = false;
+    handleMessage(message) {
+        if (message.data && message.data.type === "bee-redeem-confirmed" &&
+            message.data.id == this.elevateGift.id) {
+            this.redeemGift();
         }
+    }
+    onBackClicked() {
+        window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
+    }
+    redeemGift() {
+        if (this.elevateGift.available.toLowerCase() === 'false') {
+            return;
+        }
+        let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
+        let claimGiftOptions = {
+            method: 'PUT',
+            headers: {
+                'x-SessionId': this.session,
+                'Content-Type': 'application/json-patch+json',
+            },
+            body: JSON.stringify({ giftId: this.elevateGift.id }),
+        };
+        this.redeemErrorMsg = '';
+        this.isRedeeming = true;
+        fetch(url.toString(), claimGiftOptions)
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.success) {
+                this.redeemGiftButton.emit();
+                window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
+            }
+            else {
+                let translatedError = translate(`error${res.errorCode}`, this.language);
+                this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
+                window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
+            }
+        })
+            .catch((err) => {
+            window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
+        }).finally(() => {
+            this.isRedeeming = false;
+        });
+    }
+    async loadElevateGift() {
+        let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
+        let options = {
+            headers: {
+                'Content-Type': 'application/json',
+                'x-SessionId': this.session,
+            },
+            method: 'GET',
+        };
+        await new Promise((resolve) => {
+            fetch(url.href, options)
+                .then((res) => res.json())
+                .then((data) => {
+                let filteredGifts = data.data;
+                if (filteredGifts && filteredGifts.length == 1) {
+                    this.elevateGift = filteredGifts[0];
+                    this.isGiftNotFound = false;
+                }
+                else {
+                    this.isGiftNotFound = true;
+                }
+                resolve(true);
+            });
+        });
+    }
+    disconnectedCallback() {
+        window.removeEventListener('message', this.bindedHandler, false);
+    }
+    componentDidLoad() {
+        window.addEventListener('message', this.bindedHandler, false);
+    }
+    async componentWillLoad() {
+        if (this.translationUrl.length > 2) {
+            await getTranslations(this.translationUrl);
+        }
+        if (this.elevateGift) {
+            this.isGiftNotFound = false;
+        }
         else {
-          this.isGiftNotFound = true;
+            await this.loadElevateGift();
         }
-        resolve(true);
-      });
-    });
-  }
-  disconnectedCallback() {
-    window.removeEventListener('message', this.bindedHandler, false);
-  }
-  componentDidLoad() {
-    window.addEventListener('message', this.bindedHandler, false);
-  }
-  async componentWillLoad() {
-    if (this.translationUrl.length > 2) {
-      await getTranslations(this.translationUrl);
     }
-    if (this.elevateGift) {
-      this.isGiftNotFound = false;
+    render() {
+        return (index.h(index.Host, { key: '6f28f64d3413dd82bc81fc6fd975baa992d06289' }, index.h("general-styling-wrapper", { key: '88dedbfb25562fbe95a69748649ed9c14a2c42f6', clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), index.h("div", { key: '9f2a66f9d48882220ab5d3850f343e995ffe9a6b', class: 'ElevateDetails' }, this.isGiftNotFound && (index.h(index.Fragment, { key: '91f4079bf7af7e4d61b1681a9848c72c9a2249d5' }, index.h("div", { key: 'e0427680e0d7e94e51644f12a2430a6a42e3d340', class: "Row ThumbnailRow" }, index.h("div", { key: '4fd78968b2fdf281b7c22596351b366058cfcec3', class: "BackButton", onClick: () => {
+                this.onBackClicked();
+            } }, '<')), index.h("div", { key: 'eeb8cbc40429cf1ebf7a5f0de3d5b8226a40437b', class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && index.h(index.Fragment, { key: '45380d051b279d9c7fcd580f06252911763073e0' }, index.h("div", { key: 'c440d72501fb91601106fbf74a866887bc02ee43', class: "ThumbnailRow" }, index.h("div", { key: '005f436acbc51372d013e1931d54b71738f2e0fc', class: 'Row' }, index.h("div", { key: 'a9ace30abf1c50d639c31bb047d7b7d7cb6b27b8', class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), index.h("bonus-elevate-shop-assets-slider", { key: '8c4121e66a3fae912e72fc10c6a81354a7b36e9f', class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), index.h("div", { key: 'c6a207dfe14402e4d1890e7b787bf4b5a2247160', class: 'Col Details' }, index.h("h3", { key: 'c190b88ab4d1e13885593b9d6b9c62b161bdff23', class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), index.h("div", { key: 'befddb7b8dff3bb73377da4bfb30ce003dcccb7b', class: "GiftPoints" }, index.h("span", { key: '4e879d150709e670b2c7c90f0034c75c4ba30386', class: "Points" }, this.elevateGift.points, " "), index.h("span", { key: 'a7d28d964b41126a76f9988d0f4fc05653787066', class: " PointsLabel" }, translate('coins', this.language))))), index.h("div", { key: '14d2374d40825ac91b275fda81ca22d40f21c0be', class: 'ShopItemDetail Details' }, index.h("div", { key: '197bb9c0089173f8c4f180e115068f6204a6f7ea', class: "GiftPresentation" }, index.h("p", { key: '30be8dbec63f8f4d2bc3687d7e992d73c534a20f' }, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), index.h("div", { key: '7e0a9e4d03f338137649c9477a44c7036aea1609', class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
+                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), index.h("span", { key: '89b70f02565437ed28b175c65d0767354b6c9d6b', class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
     }
-    else {
-      await this.loadElevateGift();
-    }
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("general-styling-wrapper", { clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), index.h("div", { class: 'ElevateDetails' }, this.isGiftNotFound && (index.h(index.Fragment, null, index.h("div", { class: "Row ThumbnailRow" }, index.h("div", { class: "BackButton", onClick: () => {
-        this.onBackClicked();
-      } }, '<')), index.h("div", { class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && index.h(index.Fragment, null, index.h("div", { class: "ThumbnailRow" }, index.h("div", { class: 'Row' }, index.h("div", { class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), index.h("bonus-elevate-shop-assets-slider", { class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), index.h("div", { class: 'Col Details' }, index.h("h3", { class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), index.h("div", { class: "GiftPoints" }, index.h("span", { class: "Points" }, this.elevateGift.points, " "), index.h("span", { class: " PointsLabel" }, translate('coins', this.language))))), index.h("div", { class: 'ShopItemDetail Details' }, index.h("div", { class: "GiftPresentation" }, index.h("p", null, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), index.h("div", { class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
-                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), index.h("span", { class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
-  }
 };
-BonusElevateShopItem.style = bonusElevateShopItemCss;
+BonusElevateShopItem.style = BonusElevateShopItemStyle0;
 
 const mergeTranslations = (url, target) => {
-  return new Promise((resolve) => {
-    fetch(url)
-      .then((res) => res.json())
-      .then((data) => {
-      Object.keys(data).forEach((item) => {
-        target[item] = target[item] ? target[item] : {};
-        for (let key in data[item]) {
-          target[item][key] = data[item][key];
-        }
-      });
-      resolve(true);
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((item) => {
+                target[item] = target[item] ? target[item] : {};
+                for (let key in data[item]) {
+                    target[item][key] = data[item][key];
+                }
+            });
+            resolve(true);
+        });
     });
-  });
 };
 
 const generalStylingWrapperCss = ":host{display:block}";
+const GeneralStylingWrapperStyle0 = generalStylingWrapperCss;
 
 const GeneralStylingWrapper = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    this.stylingAppends = false;
-    this.setClientStyling = () => {
-      let sheet = document.createElement('style');
-      sheet.innerHTML = this.clientStyling;
-      this.el.prepend(sheet);
-    };
-    this.setClientStylingURL = () => {
-      let url = new URL(this.clientStylingUrl);
-      let cssFile = document.createElement('style');
-      fetch(url.href)
-        .then((res) => res.text())
-        .then((data) => {
-        cssFile.innerHTML = data;
-        setTimeout(() => {
-          this.el.prepend(cssFile);
-        }, 1);
-      })
-        .catch((err) => {
-        console.log('error ', err);
-      });
-    };
-  }
-  componentDidRender() {
-    // start custom styling area
-    if (!this.stylingAppends) {
-      if (this.clientStyling)
-        this.setClientStyling();
-      if (this.clientStylingUrl)
-        this.setClientStylingURL();
-      this.stylingAppends = true;
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.stylingAppends = false;
+        this.setClientStyling = () => {
+            let sheet = document.createElement('style');
+            sheet.innerHTML = this.clientStyling;
+            this.el.prepend(sheet);
+        };
+        this.setClientStylingURL = () => {
+            let url = new URL(this.clientStylingUrl);
+            let cssFile = document.createElement('style');
+            fetch(url.href)
+                .then((res) => res.text())
+                .then((data) => {
+                cssFile.innerHTML = data;
+                setTimeout(() => {
+                    this.el.prepend(cssFile);
+                }, 1);
+            })
+                .catch((err) => {
+                console.log('error ', err);
+            });
+        };
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.targetTranslations = undefined;
     }
-    // end custom styling area
-  }
-  async componentWillLoad() {
-    const promises = [];
-    if (this.translationUrl) {
-      const translationPromise = mergeTranslations(this.translationUrl, this.targetTranslations);
-      promises.push(translationPromise);
+    componentDidRender() {
+        // start custom styling area
+        if (!this.stylingAppends) {
+            if (this.clientStyling)
+                this.setClientStyling();
+            if (this.clientStylingUrl)
+                this.setClientStylingURL();
+            this.stylingAppends = true;
+        }
+        // end custom styling area
     }
-    return await Promise.all(promises);
-  }
-  render() {
-    return (index.h("div", { class: "StyleShell" }, index.h("slot", { name: "mainContent" })));
-  }
-  get el() { return index.getElement(this); }
+    async componentWillLoad() {
+        const promises = [];
+        if (this.translationUrl) {
+            const translationPromise = mergeTranslations(this.translationUrl, this.targetTranslations);
+            promises.push(translationPromise);
+        }
+        return await Promise.all(promises);
+    }
+    render() {
+        return (index.h("div", { key: '4d3414408c7662f88331dbe655966237f74d6958', class: "StyleShell" }, index.h("slot", { key: '1d004644d84602c4314bdf5dfc26b55b160f57df', name: "mainContent" })));
+    }
+    get el() { return index.getElement(this); }
 };
-GeneralStylingWrapper.style = generalStylingWrapperCss;
+GeneralStylingWrapper.style = GeneralStylingWrapperStyle0;
 
@@ -457,0 +428,0 @@ exports.bonus_elevate_shop_assets_slider = BonusElevateShopAssetsSlider;

dist/cjs/bonus-elevate-shop-item.cjs.js

 'use strict';
 
-const index = require('./index-355d8ffb.js');
+Object.defineProperty(exports, '__esModule', { value: true });
 
+const index = require('./index-1035f878.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
 /*
- Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com
  */
-const patchBrowser = () => {
-    const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('bonus-elevate-shop-item.cjs.js', document.baseURI).href));
-    const opts = {};
-    if (importMeta !== '') {
-        opts.resourcesUrl = new URL('.', importMeta).href;
-    }
-    return index.promiseResolve(opts);
+var patchBrowser = () => {
+  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('bonus-elevate-shop-item.cjs.js', document.baseURI).href));
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return index.promiseResolve(opts);
 };
 
-patchBrowser().then(options => {
+patchBrowser().then(async (options) => {
+  await appGlobals.globalScripts();
   return index.bootstrapLazy([["bonus-elevate-shop-assets-slider_3.cjs",[[1,"bonus-elevate-shop-item",{"endpoint":[513],"language":[513],"itemId":[1537,"item-id"],"elevateGift":[1040],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"isGiftNotFound":[32],"redeemErrorMsg":[32],"isRedeeming":[32]}],[0,"bonus-elevate-shop-assets-slider",{"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"itemsPerPage":[514,"items-per-page"],"sliderItems":[16],"activeIndex":[32]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}]]]], options);
 });
+
+exports.setNonce = index.setNonce;

dist/cjs/loader.cjs.js

@@ -5,18 +5,12 @@ 'use strict';
 
-const index = require('./index-355d8ffb.js');
+const index = require('./index-1035f878.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
 
-/*
- Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
- */
-const patchEsm = () => {
-    return index.promiseResolve();
-};
-
-const defineCustomElements = (win, options) => {
-  if (typeof window === 'undefined') return Promise.resolve();
-  return patchEsm().then(() => {
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await appGlobals.globalScripts();
   return index.bootstrapLazy([["bonus-elevate-shop-assets-slider_3.cjs",[[1,"bonus-elevate-shop-item",{"endpoint":[513],"language":[513],"itemId":[1537,"item-id"],"elevateGift":[1040],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"isGiftNotFound":[32],"redeemErrorMsg":[32],"isRedeeming":[32]}],[0,"bonus-elevate-shop-assets-slider",{"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"itemsPerPage":[514,"items-per-page"],"sliderItems":[16],"activeIndex":[32]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}]]]], options);
-  });
 };
 
+exports.setNonce = index.setNonce;
 exports.defineCustomElements = defineCustomElements;

dist/collection/collection-manifest.json

 {
   "entries": [
-    "./components/bonus-elevate-shop-item/bonus-elevate-shop-assets-slider.js",
-    "./components/bonus-elevate-shop-item/bonus-elevate-shop-item.js"
+    "components/bonus-elevate-shop-item/bonus-elevate-shop-item.js",
+    "components/bonus-elevate-shop-item/bonus-elevate-shop-assets-slider.js"
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.15.2",
-    "typescriptVersion": "4.5.4"
+    "version": "4.20.0",
+    "typescriptVersion": "5.5.3"
   },
@@ -11,0 +11,0 @@ "collections": [

dist/collection/components/bonus-elevate-shop-item/bonus-elevate-shop-assets-slider.js

@@ -1,225 +0,210 @@
-import { Component, Element, h, Prop, State } from '@stencil/core';
+import { h } from "@stencil/core";
 export class BonusElevateShopAssetsSlider {
-  constructor() {
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.itemsPerPage = 1;
-    this.sliderItems = [];
-    /**
-     * Slider variables
-     */
-    this.activeIndex = 0;
-    this.xDown = null;
-    this.yDown = null;
-    this.orientationChangeHandler = () => {
-      setTimeout(() => {
-        this.recalculateItemsPerPage();
-      }, 10);
-    };
-    this.resizeHandler = () => {
-      this.recalculateItemsPerPage();
-    };
-  }
-  setActive(index) {
-    var _a;
-    const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
-    if (index >= 0) {
-      if (index >= maxLength - 1) {
-        this.activeIndex = maxLength - 1;
-      }
-      else {
-        this.activeIndex = index;
-      }
+    constructor() {
+        this.xDown = null;
+        this.yDown = null;
+        this.orientationChangeHandler = () => {
+            setTimeout(() => {
+                this.recalculateItemsPerPage();
+            }, 10);
+        };
+        this.resizeHandler = () => {
+            this.recalculateItemsPerPage();
+        };
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.itemsPerPage = 1;
+        this.sliderItems = [];
+        this.activeIndex = 0;
     }
-    else {
-      this.activeIndex = 0;
+    setActive(index) {
+        var _a;
+        const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
+        if (index >= 0) {
+            if (index >= maxLength - 1) {
+                this.activeIndex = maxLength - 1;
+            }
+            else {
+                this.activeIndex = index;
+            }
+        }
+        else {
+            this.activeIndex = 0;
+        }
     }
-  }
-  move(direction) {
-    this.setActive(this.activeIndex + direction);
-  }
-  goTo(index) {
-    let diff = this.activeIndex - index;
-    if (diff > 0) {
-      for (let i = 0; i < diff; i++) {
-        this.move(-1);
-      }
+    move(direction) {
+        this.setActive(this.activeIndex + direction);
     }
-    else {
-      for (let i = 0; i > diff; i--) {
-        this.move(1);
-      }
+    goTo(index) {
+        let diff = this.activeIndex - index;
+        if (diff > 0) {
+            for (let i = 0; i < diff; i++) {
+                this.move(-1);
+            }
+        }
+        else {
+            for (let i = 0; i > diff; i--) {
+                this.move(1);
+            }
+        }
     }
-  }
-  handleTouchStart(evt) {
-    const firstTouch = this.getTouches(evt)[0];
-    this.xDown = firstTouch.clientX;
-    this.yDown = firstTouch.clientY;
-  }
-  getTouches(evt) {
-    return evt.touches || evt.originalEvent.touches;
-  }
-  handleTouchMove(evt) {
-    if (!this.xDown || !this.yDown)
-      return;
-    let xUp = evt.touches[0].clientX;
-    let yUp = evt.touches[0].clientY;
-    let xDiff = this.xDown - xUp;
-    let yDiff = this.yDown - yUp;
-    if (Math.abs(xDiff) > Math.abs(yDiff)) {
-      if (xDiff > 0) {
-        this.move(1);
-      }
-      else {
-        this.move(-1);
-      }
+    handleTouchStart(evt) {
+        const firstTouch = this.getTouches(evt)[0];
+        this.xDown = firstTouch.clientX;
+        this.yDown = firstTouch.clientY;
     }
-    this.xDown = null;
-    this.yDown = null;
-  }
-  ;
-  recalculateItemsPerPage() {
-    if (!this.sliderItemsElement)
-      return;
-    this.itemElementWidth = this.sliderItemsElement.clientWidth;
-    this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
-  }
-  ;
-  renderDots() {
-    var _a;
-    const dots = [];
-    for (let index = 0; index < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index++) {
-      dots.push(h("li", { class: index == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index); this.setActive(index); } }));
+    getTouches(evt) {
+        return evt.touches || evt.originalEvent.touches;
     }
-    return dots;
-  }
-  componentDidRender() {
-    this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
-    this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
-    this.recalculateItemsPerPage();
-  }
-  componentDidUpdate() {
-    this.recalculateItemsPerPage();
-  }
-  connectedCallback() {
-    window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
-  }
-  disconnectedCallback() {
-    this.el.removeEventListener('touchstart', this.handleTouchStart);
-    this.el.removeEventListener('touchmove', this.handleTouchMove);
-    window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
-    window.removeEventListener('resize', this.resizeHandler);
-  }
-  render() {
-    var _a;
-    const styles = {
-      transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
-    };
-    const itemStyle = {
-      width: `${this.itemElementWidth / this.itemsPerPage}px`
-    };
-    return h("div", { class: "SliderWrapper" },
-      h("div", { class: 'MainContent ' },
-        this.showSliderArrows &&
-          h("div", { class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) },
-            h("svg", { fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
-              h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))),
-        h("div", { class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el },
-          h("div", { class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))),
-        this.showSliderArrows &&
-          h("div", { class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
-                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) },
-            h("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
-              h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))),
-      this.showSliderDots && this.sliderItems.length > 1 &&
-        h("div", { class: "DotsWrapper" },
-          h("ul", { class: "Dots" }, this.renderDots())));
-  }
-  static get is() { return "bonus-elevate-shop-assets-slider"; }
-  static get properties() { return {
-    "showSliderDots": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider dots"
-      },
-      "attribute": "show-slider-dots",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "showSliderArrows": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider navigate arrows"
-      },
-      "attribute": "show-slider-arrows",
-      "reflect": true,
-      "defaultValue": "true"
-    },
-    "itemsPerPage": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "items-per-page",
-      "reflect": true,
-      "defaultValue": "1"
-    },
-    "sliderItems": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Array<any>",
-        "resolved": "any[]",
-        "references": {
-          "Array": {
-            "location": "global"
-          }
+    handleTouchMove(evt) {
+        if (!this.xDown || !this.yDown)
+            return;
+        let xUp = evt.touches[0].clientX;
+        let yUp = evt.touches[0].clientY;
+        let xDiff = this.xDown - xUp;
+        let yDiff = this.yDown - yUp;
+        if (Math.abs(xDiff) > Math.abs(yDiff)) {
+            if (xDiff > 0) {
+                this.move(1);
+            }
+            else {
+                this.move(-1);
+            }
         }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "defaultValue": "[]"
+        this.xDown = null;
+        this.yDown = null;
     }
-  }; }
-  static get states() { return {
-    "activeIndex": {}
-  }; }
-  static get elementRef() { return "el"; }
+    ;
+    recalculateItemsPerPage() {
+        if (!this.sliderItemsElement)
+            return;
+        this.itemElementWidth = this.sliderItemsElement.clientWidth;
+        this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
+    }
+    ;
+    renderDots() {
+        var _a;
+        const dots = [];
+        for (let index = 0; index < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index++) {
+            dots.push(h("li", { class: index == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index); this.setActive(index); } }));
+        }
+        return dots;
+    }
+    componentDidRender() {
+        this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
+        this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
+        this.recalculateItemsPerPage();
+    }
+    componentDidUpdate() {
+        this.recalculateItemsPerPage();
+    }
+    connectedCallback() {
+        window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
+    }
+    disconnectedCallback() {
+        this.el.removeEventListener('touchstart', this.handleTouchStart);
+        this.el.removeEventListener('touchmove', this.handleTouchMove);
+        window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
+        window.removeEventListener('resize', this.resizeHandler);
+    }
+    render() {
+        var _a;
+        const styles = {
+            transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
+        };
+        const itemStyle = {
+            width: `${this.itemElementWidth / this.itemsPerPage}px`
+        };
+        return h("div", { key: '210d648ae90dd04e350c0cddb2047061f5989bd8', class: "SliderWrapper" }, h("div", { key: '240a214bc772890145b8317bfda32f6099150726', class: 'MainContent ' }, this.showSliderArrows &&
+            h("div", { key: 'e8e144fbc2906ee0c5e77cc00c33fb1e89ced29f', class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) }, h("svg", { key: '068a669fa96d11532199f2f2eb44e3a4c3f31e10', fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2789bb8d91ce4ec7f0fd7c3c6b9f3c7b7e682088', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))), h("div", { key: '034ef81e4d9a8dea56fd42791e8a08940dfa4af6', class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el }, h("div", { key: 'f412b5f0978348e4d9e0af682d151a1880f6e86d', class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))), this.showSliderArrows &&
+            h("div", { key: '0f8549f8a5bcf2f1cfcde601930610fe5cc98427', class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
+                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) }, h("svg", { key: '5758a9a73af5f7fa4618ae1b4bb30d838b509d9f', fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '720c5f0f496e8817fc9017ec4e8706cb9644e9ef', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))), this.showSliderDots && this.sliderItems.length > 1 &&
+            h("div", { key: '9c1b9c57b1871d7463569ea9566b28e925870d59', class: "DotsWrapper" }, h("ul", { key: '548d1d0f2c46170e07aa7ed4019dc3469e2e3950', class: "Dots" }, this.renderDots())));
+    }
+    static get is() { return "bonus-elevate-shop-assets-slider"; }
+    static get properties() {
+        return {
+            "showSliderDots": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider dots"
+                },
+                "attribute": "show-slider-dots",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "showSliderArrows": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider navigate arrows"
+                },
+                "attribute": "show-slider-arrows",
+                "reflect": true,
+                "defaultValue": "true"
+            },
+            "itemsPerPage": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "items-per-page",
+                "reflect": true,
+                "defaultValue": "1"
+            },
+            "sliderItems": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Array<any>",
+                    "resolved": "any[]",
+                    "references": {
+                        "Array": {
+                            "location": "global",
+                            "id": "global::Array"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "defaultValue": "[]"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "activeIndex": {}
+        };
+    }
+    static get elementRef() { return "el"; }
 }

dist/collection/components/bonus-elevate-shop-item/bonus-elevate-shop-item.js

@@ -1,373 +0,343 @@
-import { Component, Event, Fragment, h, Host, Prop, State } from '@stencil/core';
-import '@everymatrix/general-styling-wrapper';
-import { getTranslations, translate } from '../../utils/locale.utils';
-import { getDevicePlatform } from '../../utils/utils';
+import { Fragment, h, Host } from "@stencil/core";
+import "../../../../../general-styling-wrapper/dist/types/index";
+import { getTranslations, translate } from "../../utils/locale.utils";
+import { getDevicePlatform } from "../../utils/utils";
 export class BonusElevateShopItem {
-  constructor() {
-    /**
-     * Currently selected language.
-     */
-    this.language = 'en';
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.isGiftNotFound = false;
-    this.redeemErrorMsg = '';
-    this.isRedeeming = false;
-    this.bindedHandler = this.handleMessage.bind(this);
-    this.deviceType = getDevicePlatform();
-  }
-  redeemGiftConfirm() {
-    window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
-  }
-  handleMessage(message) {
-    if (message.data && message.data.type === "bee-redeem-confirmed" &&
-      message.data.id == this.elevateGift.id) {
-      this.redeemGift();
+    constructor() {
+        this.bindedHandler = this.handleMessage.bind(this);
+        this.deviceType = getDevicePlatform();
+        this.endpoint = undefined;
+        this.language = 'en';
+        this.itemId = undefined;
+        this.elevateGift = undefined;
+        this.session = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.isGiftNotFound = false;
+        this.redeemErrorMsg = '';
+        this.isRedeeming = false;
     }
-  }
-  onBackClicked() {
-    window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
-  }
-  redeemGift() {
-    if (this.elevateGift.available.toLowerCase() === 'false') {
-      return;
+    redeemGiftConfirm() {
+        window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
     }
-    let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
-    let claimGiftOptions = {
-      method: 'PUT',
-      headers: {
-        'x-SessionId': this.session,
-        'Content-Type': 'application/json-patch+json',
-      },
-      body: JSON.stringify({ giftId: this.elevateGift.id }),
-    };
-    this.redeemErrorMsg = '';
-    this.isRedeeming = true;
-    fetch(url.toString(), claimGiftOptions)
-      .then((res) => res.json())
-      .then((res) => {
-      if (res.success) {
-        this.redeemGiftButton.emit();
-        window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
-      }
-      else {
-        let translatedError = translate(`error${res.errorCode}`, this.language);
-        this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
-        window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
-      }
-    })
-      .catch((err) => {
-      window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
-    }).finally(() => {
-      this.isRedeeming = false;
-    });
-  }
-  async loadElevateGift() {
-    let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
-    let options = {
-      headers: {
-        'Content-Type': 'application/json',
-        'x-SessionId': this.session,
-      },
-      method: 'GET',
-    };
-    await new Promise((resolve) => {
-      fetch(url.href, options)
-        .then((res) => res.json())
-        .then((data) => {
-        let filteredGifts = data.data;
-        if (filteredGifts && filteredGifts.length == 1) {
-          this.elevateGift = filteredGifts[0];
-          this.isGiftNotFound = false;
+    handleMessage(message) {
+        if (message.data && message.data.type === "bee-redeem-confirmed" &&
+            message.data.id == this.elevateGift.id) {
+            this.redeemGift();
         }
-        else {
-          this.isGiftNotFound = true;
+    }
+    onBackClicked() {
+        window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
+    }
+    redeemGift() {
+        if (this.elevateGift.available.toLowerCase() === 'false') {
+            return;
         }
-        resolve(true);
-      });
-    });
-  }
-  disconnectedCallback() {
-    window.removeEventListener('message', this.bindedHandler, false);
-  }
-  componentDidLoad() {
-    window.addEventListener('message', this.bindedHandler, false);
-  }
-  async componentWillLoad() {
-    if (this.translationUrl.length > 2) {
-      await getTranslations(this.translationUrl);
+        let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
+        let claimGiftOptions = {
+            method: 'PUT',
+            headers: {
+                'x-SessionId': this.session,
+                'Content-Type': 'application/json-patch+json',
+            },
+            body: JSON.stringify({ giftId: this.elevateGift.id }),
+        };
+        this.redeemErrorMsg = '';
+        this.isRedeeming = true;
+        fetch(url.toString(), claimGiftOptions)
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.success) {
+                this.redeemGiftButton.emit();
+                window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
+            }
+            else {
+                let translatedError = translate(`error${res.errorCode}`, this.language);
+                this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
+                window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
+            }
+        })
+            .catch((err) => {
+            window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
+        }).finally(() => {
+            this.isRedeeming = false;
+        });
     }
-    if (this.elevateGift) {
-      this.isGiftNotFound = false;
+    async loadElevateGift() {
+        let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
+        let options = {
+            headers: {
+                'Content-Type': 'application/json',
+                'x-SessionId': this.session,
+            },
+            method: 'GET',
+        };
+        await new Promise((resolve) => {
+            fetch(url.href, options)
+                .then((res) => res.json())
+                .then((data) => {
+                let filteredGifts = data.data;
+                if (filteredGifts && filteredGifts.length == 1) {
+                    this.elevateGift = filteredGifts[0];
+                    this.isGiftNotFound = false;
+                }
+                else {
+                    this.isGiftNotFound = true;
+                }
+                resolve(true);
+            });
+        });
     }
-    else {
-      await this.loadElevateGift();
+    disconnectedCallback() {
+        window.removeEventListener('message', this.bindedHandler, false);
     }
-  }
-  render() {
-    return (h(Host, null,
-      h("general-styling-wrapper", { clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }),
-      h("div", { class: 'ElevateDetails' },
-        this.isGiftNotFound && (h(Fragment, null,
-          h("div", { class: "Row ThumbnailRow" },
-            h("div", { class: "BackButton", onClick: () => {
-                this.onBackClicked();
-              } }, '<')),
-          h("div", { class: "Thumnails GiftNotFound" },
-            translate('noDataFound', this.language),
-            "."))),
-        this.elevateGift && h(Fragment, null,
-          h("div", { class: "ThumbnailRow" },
-            h("div", { class: 'Row' },
-              h("div", { class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'),
-              h("bonus-elevate-shop-assets-slider", { class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })),
-            h("div", { class: 'Col Details' },
-              h("h3", { class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName),
-              h("div", { class: "GiftPoints" },
-                h("span", { class: "Points" },
-                  this.elevateGift.points,
-                  " "),
-                h("span", { class: " PointsLabel" }, translate('coins', this.language))))),
-          h("div", { class: 'ShopItemDetail Details' },
-            h("div", { class: "GiftPresentation" },
-              h("p", null, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))),
-            h("div", { class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
-                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)),
-            h("span", { class: 'RedeemError Error' },
-              " ",
-              this.redeemErrorMsg,
-              " "))))));
-  }
-  static get is() { return "bonus-elevate-shop-item"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["bonus-elevate-shop-item.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["bonus-elevate-shop-item.css"]
-  }; }
-  static get properties() { return {
-    "endpoint": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "NorWAy endpoint"
-      },
-      "attribute": "endpoint",
-      "reflect": true
-    },
-    "language": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Currently selected language."
-      },
-      "attribute": "language",
-      "reflect": true,
-      "defaultValue": "'en'"
-    },
-    "itemId": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Elevate gift id"
-      },
-      "attribute": "item-id",
-      "reflect": true
-    },
-    "elevateGift": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "BonusElevateShopItemInfo",
-        "resolved": "BonusElevateShopItemInfo",
-        "references": {
-          "BonusElevateShopItemInfo": {
-            "location": "import",
-            "path": "../../models/bonus-elevate-shop-item"
-          }
+    componentDidLoad() {
+        window.addEventListener('message', this.bindedHandler, false);
+    }
+    async componentWillLoad() {
+        if (this.translationUrl.length > 2) {
+            await getTranslations(this.translationUrl);
         }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Elevate gift id"
-      }
-    },
-    "session": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "session"
-      },
-      "attribute": "session",
-      "reflect": true
-    },
-    "clientStyling": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via inline styles"
-      },
-      "attribute": "client-styling",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "clientStylingUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via url"
-      },
-      "attribute": "client-styling-url",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "translationUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Translation via url"
-      },
-      "attribute": "translation-url",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "showSliderDots": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider dots"
-      },
-      "attribute": "show-slider-dots",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "showSliderArrows": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider navigate arrows"
-      },
-      "attribute": "show-slider-arrows",
-      "reflect": true,
-      "defaultValue": "true"
+        if (this.elevateGift) {
+            this.isGiftNotFound = false;
+        }
+        else {
+            await this.loadElevateGift();
+        }
     }
-  }; }
-  static get states() { return {
-    "isGiftNotFound": {},
-    "redeemErrorMsg": {},
-    "isRedeeming": {}
-  }; }
-  static get events() { return [{
-      "method": "redeemGiftButton",
-      "name": "redeemGiftButton",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "Object",
-        "resolved": "Object",
-        "references": {
-          "Object": {
-            "location": "global"
-          }
-        }
-      }
-    }]; }
+    render() {
+        return (h(Host, { key: '6f28f64d3413dd82bc81fc6fd975baa992d06289' }, h("general-styling-wrapper", { key: '88dedbfb25562fbe95a69748649ed9c14a2c42f6', clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), h("div", { key: '9f2a66f9d48882220ab5d3850f343e995ffe9a6b', class: 'ElevateDetails' }, this.isGiftNotFound && (h(Fragment, { key: '91f4079bf7af7e4d61b1681a9848c72c9a2249d5' }, h("div", { key: 'e0427680e0d7e94e51644f12a2430a6a42e3d340', class: "Row ThumbnailRow" }, h("div", { key: '4fd78968b2fdf281b7c22596351b366058cfcec3', class: "BackButton", onClick: () => {
+                this.onBackClicked();
+            } }, '<')), h("div", { key: 'eeb8cbc40429cf1ebf7a5f0de3d5b8226a40437b', class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && h(Fragment, { key: '45380d051b279d9c7fcd580f06252911763073e0' }, h("div", { key: 'c440d72501fb91601106fbf74a866887bc02ee43', class: "ThumbnailRow" }, h("div", { key: '005f436acbc51372d013e1931d54b71738f2e0fc', class: 'Row' }, h("div", { key: 'a9ace30abf1c50d639c31bb047d7b7d7cb6b27b8', class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), h("bonus-elevate-shop-assets-slider", { key: '8c4121e66a3fae912e72fc10c6a81354a7b36e9f', class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), h("div", { key: 'c6a207dfe14402e4d1890e7b787bf4b5a2247160', class: 'Col Details' }, h("h3", { key: 'c190b88ab4d1e13885593b9d6b9c62b161bdff23', class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), h("div", { key: 'befddb7b8dff3bb73377da4bfb30ce003dcccb7b', class: "GiftPoints" }, h("span", { key: '4e879d150709e670b2c7c90f0034c75c4ba30386', class: "Points" }, this.elevateGift.points, " "), h("span", { key: 'a7d28d964b41126a76f9988d0f4fc05653787066', class: " PointsLabel" }, translate('coins', this.language))))), h("div", { key: '14d2374d40825ac91b275fda81ca22d40f21c0be', class: 'ShopItemDetail Details' }, h("div", { key: '197bb9c0089173f8c4f180e115068f6204a6f7ea', class: "GiftPresentation" }, h("p", { key: '30be8dbec63f8f4d2bc3687d7e992d73c534a20f' }, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), h("div", { key: '7e0a9e4d03f338137649c9477a44c7036aea1609', class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
+                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), h("span", { key: '89b70f02565437ed28b175c65d0767354b6c9d6b', class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
+    }
+    static get is() { return "bonus-elevate-shop-item"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["bonus-elevate-shop-item.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["bonus-elevate-shop-item.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "endpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "NorWAy endpoint"
+                },
+                "attribute": "endpoint",
+                "reflect": true
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Currently selected language."
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "'en'"
+            },
+            "itemId": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Elevate gift id"
+                },
+                "attribute": "item-id",
+                "reflect": true
+            },
+            "elevateGift": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "BonusElevateShopItemInfo",
+                    "resolved": "BonusElevateShopItemInfo",
+                    "references": {
+                        "BonusElevateShopItemInfo": {
+                            "location": "import",
+                            "path": "../../models/bonus-elevate-shop-item",
+                            "id": "../../../../packages/stencil/bonus-elevate-shop-item/src/models/bonus-elevate-shop-item.ts::BonusElevateShopItemInfo"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Elevate gift id"
+                }
+            },
+            "session": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "session"
+                },
+                "attribute": "session",
+                "reflect": true
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via inline styles"
+                },
+                "attribute": "client-styling",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via url"
+                },
+                "attribute": "client-styling-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "translationUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Translation via url"
+                },
+                "attribute": "translation-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "showSliderDots": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider dots"
+                },
+                "attribute": "show-slider-dots",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "showSliderArrows": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider navigate arrows"
+                },
+                "attribute": "show-slider-arrows",
+                "reflect": true,
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isGiftNotFound": {},
+            "redeemErrorMsg": {},
+            "isRedeeming": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "redeemGiftButton",
+                "name": "redeemGiftButton",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "Object",
+                    "resolved": "Object",
+                    "references": {
+                        "Object": {
+                            "location": "global",
+                            "id": "global::Object"
+                        }
+                    }
+                }
+            }];
+    }
 }

dist/collection/utils/locale.utils.js

 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hu'];
 const TRANSLATIONS = {
-  en: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  ro: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  fr: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  ar: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  hu: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  }
+    en: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    ro: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    fr: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    ar: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    hu: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    }
 };
 export const translate = (key, customLang) => {
-  const lang = customLang;
-  return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+    const lang = customLang;
+    return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
 };
 export const getTranslations = (url) => {
-  // fetch url, get the data, replace the TRANSLATIONS content
-  return new Promise((resolve) => {
-    fetch(url)
-      .then((res) => res.json())
-      .then((data) => {
-      Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-          TRANSLATIONS[item][key] = data[item][key];
-        }
-      });
-      resolve(true);
+    // fetch url, get the data, replace the TRANSLATIONS content
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((item) => {
+                for (let key in data[item]) {
+                    TRANSLATIONS[item][key] = data[item][key];
+                }
+            });
+            resolve(true);
+        });
     });
-  });
 };

dist/collection/utils/utils.js

@@ -8,33 +8,33 @@ /**
 export const isMobile = (userAgent) => {
-  return !!(userAgent.toLowerCase().match(/android/i) ||
-    userAgent.toLowerCase().match(/blackberry|bb/i) ||
-    userAgent.toLowerCase().match(/iphone|ipad|ipod/i) ||
-    userAgent.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i));
+    return !!(userAgent.toLowerCase().match(/android/i) ||
+        userAgent.toLowerCase().match(/blackberry|bb/i) ||
+        userAgent.toLowerCase().match(/iphone|ipad|ipod/i) ||
+        userAgent.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i));
 };
 export const getDevice = () => {
-  let userAgent = window.navigator.userAgent;
-  if (userAgent.toLowerCase().match(/android/i)) {
-    return 'Android';
-  }
-  if (userAgent.toLowerCase().match(/iphone/i)) {
-    return 'iPhone';
-  }
-  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
-    return 'iPad';
-  }
-  return 'PC';
-};
-export const getDevicePlatform = () => {
-  const device = getDevice();
-  if (device) {
-    if (device === 'PC') {
-      return 'dk';
+    let userAgent = window.navigator.userAgent;
+    if (userAgent.toLowerCase().match(/android/i)) {
+        return 'Android';
     }
-    else if (device === 'iPad' || device === 'iPhone') {
-      return 'ios';
+    if (userAgent.toLowerCase().match(/iphone/i)) {
+        return 'iPhone';
     }
-    else {
-      return 'mtWeb';
+    if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+        return 'iPad';
     }
-  }
+    return 'PC';
 };
+export const getDevicePlatform = () => {
+    const device = getDevice();
+    if (device) {
+        if (device === 'PC') {
+            return 'dk';
+        }
+        else if (device === 'iPad' || device === 'iPhone') {
+            return 'ios';
+        }
+        else {
+            return 'mtWeb';
+        }
+    }
+};

dist/esm/bonus-elevate-shop-assets-slider_3.entry.js

@@ -1,136 +0,127 @@
-import { r as registerInstance, h, g as getElement, c as createEvent, F as Fragment, H as Host } from './index-4927ce96.js';
+import { r as registerInstance, h, g as getElement, c as createEvent, F as Fragment, H as Host } from './index-fa394550.js';
 
 const BonusElevateShopAssetsSlider = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.itemsPerPage = 1;
-    this.sliderItems = [];
-    /**
-     * Slider variables
-     */
-    this.activeIndex = 0;
-    this.xDown = null;
-    this.yDown = null;
-    this.orientationChangeHandler = () => {
-      setTimeout(() => {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.xDown = null;
+        this.yDown = null;
+        this.orientationChangeHandler = () => {
+            setTimeout(() => {
+                this.recalculateItemsPerPage();
+            }, 10);
+        };
+        this.resizeHandler = () => {
+            this.recalculateItemsPerPage();
+        };
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.itemsPerPage = 1;
+        this.sliderItems = [];
+        this.activeIndex = 0;
+    }
+    setActive(index) {
+        var _a;
+        const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
+        if (index >= 0) {
+            if (index >= maxLength - 1) {
+                this.activeIndex = maxLength - 1;
+            }
+            else {
+                this.activeIndex = index;
+            }
+        }
+        else {
+            this.activeIndex = 0;
+        }
+    }
+    move(direction) {
+        this.setActive(this.activeIndex + direction);
+    }
+    goTo(index) {
+        let diff = this.activeIndex - index;
+        if (diff > 0) {
+            for (let i = 0; i < diff; i++) {
+                this.move(-1);
+            }
+        }
+        else {
+            for (let i = 0; i > diff; i--) {
+                this.move(1);
+            }
+        }
+    }
+    handleTouchStart(evt) {
+        const firstTouch = this.getTouches(evt)[0];
+        this.xDown = firstTouch.clientX;
+        this.yDown = firstTouch.clientY;
+    }
+    getTouches(evt) {
+        return evt.touches || evt.originalEvent.touches;
+    }
+    handleTouchMove(evt) {
+        if (!this.xDown || !this.yDown)
+            return;
+        let xUp = evt.touches[0].clientX;
+        let yUp = evt.touches[0].clientY;
+        let xDiff = this.xDown - xUp;
+        let yDiff = this.yDown - yUp;
+        if (Math.abs(xDiff) > Math.abs(yDiff)) {
+            if (xDiff > 0) {
+                this.move(1);
+            }
+            else {
+                this.move(-1);
+            }
+        }
+        this.xDown = null;
+        this.yDown = null;
+    }
+    ;
+    recalculateItemsPerPage() {
+        if (!this.sliderItemsElement)
+            return;
+        this.itemElementWidth = this.sliderItemsElement.clientWidth;
+        this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
+    }
+    ;
+    renderDots() {
+        var _a;
+        const dots = [];
+        for (let index = 0; index < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index++) {
+            dots.push(h("li", { class: index == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index); this.setActive(index); } }));
+        }
+        return dots;
+    }
+    componentDidRender() {
+        this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
+        this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
         this.recalculateItemsPerPage();
-      }, 10);
-    };
-    this.resizeHandler = () => {
-      this.recalculateItemsPerPage();
-    };
-  }
-  setActive(index) {
-    var _a;
-    const maxLength = (_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length;
-    if (index >= 0) {
-      if (index >= maxLength - 1) {
-        this.activeIndex = maxLength - 1;
-      }
-      else {
-        this.activeIndex = index;
-      }
     }
-    else {
-      this.activeIndex = 0;
+    componentDidUpdate() {
+        this.recalculateItemsPerPage();
     }
-  }
-  move(direction) {
-    this.setActive(this.activeIndex + direction);
-  }
-  goTo(index) {
-    let diff = this.activeIndex - index;
-    if (diff > 0) {
-      for (let i = 0; i < diff; i++) {
-        this.move(-1);
-      }
+    connectedCallback() {
+        window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
     }
-    else {
-      for (let i = 0; i > diff; i--) {
-        this.move(1);
-      }
+    disconnectedCallback() {
+        this.el.removeEventListener('touchstart', this.handleTouchStart);
+        this.el.removeEventListener('touchmove', this.handleTouchMove);
+        window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
+        window.removeEventListener('resize', this.resizeHandler);
     }
-  }
-  handleTouchStart(evt) {
-    const firstTouch = this.getTouches(evt)[0];
-    this.xDown = firstTouch.clientX;
-    this.yDown = firstTouch.clientY;
-  }
-  getTouches(evt) {
-    return evt.touches || evt.originalEvent.touches;
-  }
-  handleTouchMove(evt) {
-    if (!this.xDown || !this.yDown)
-      return;
-    let xUp = evt.touches[0].clientX;
-    let yUp = evt.touches[0].clientY;
-    let xDiff = this.xDown - xUp;
-    let yDiff = this.yDown - yUp;
-    if (Math.abs(xDiff) > Math.abs(yDiff)) {
-      if (xDiff > 0) {
-        this.move(1);
-      }
-      else {
-        this.move(-1);
-      }
+    render() {
+        var _a;
+        const styles = {
+            transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
+        };
+        const itemStyle = {
+            width: `${this.itemElementWidth / this.itemsPerPage}px`
+        };
+        return h("div", { key: '210d648ae90dd04e350c0cddb2047061f5989bd8', class: "SliderWrapper" }, h("div", { key: '240a214bc772890145b8317bfda32f6099150726', class: 'MainContent ' }, this.showSliderArrows &&
+            h("div", { key: 'e8e144fbc2906ee0c5e77cc00c33fb1e89ced29f', class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) }, h("svg", { key: '068a669fa96d11532199f2f2eb44e3a4c3f31e10', fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2789bb8d91ce4ec7f0fd7c3c6b9f3c7b7e682088', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))), h("div", { key: '034ef81e4d9a8dea56fd42791e8a08940dfa4af6', class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el }, h("div", { key: 'f412b5f0978348e4d9e0af682d151a1880f6e86d', class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))), this.showSliderArrows &&
+            h("div", { key: '0f8549f8a5bcf2f1cfcde601930610fe5cc98427', class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
+                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) }, h("svg", { key: '5758a9a73af5f7fa4618ae1b4bb30d838b509d9f', fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '720c5f0f496e8817fc9017ec4e8706cb9644e9ef', "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))), this.showSliderDots && this.sliderItems.length > 1 &&
+            h("div", { key: '9c1b9c57b1871d7463569ea9566b28e925870d59', class: "DotsWrapper" }, h("ul", { key: '548d1d0f2c46170e07aa7ed4019dc3469e2e3950', class: "Dots" }, this.renderDots())));
     }
-    this.xDown = null;
-    this.yDown = null;
-  }
-  ;
-  recalculateItemsPerPage() {
-    if (!this.sliderItemsElement)
-      return;
-    this.itemElementWidth = this.sliderItemsElement.clientWidth;
-    this.sliderItemsElementWidth = (this.sliderItems.length - 1) * this.itemElementWidth;
-  }
-  ;
-  renderDots() {
-    var _a;
-    const dots = [];
-    for (let index = 0; index < ((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) / this.itemsPerPage; index++) {
-      dots.push(h("li", { class: index == this.activeIndex ? 'active' : 'default', onClick: () => { this.goTo(index); this.setActive(index); } }));
-    }
-    return dots;
-  }
-  componentDidRender() {
-    this.el.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
-    this.el.addEventListener('touchmove', this.handleTouchMove.bind(this), { passive: true });
-    this.recalculateItemsPerPage();
-  }
-  componentDidUpdate() {
-    this.recalculateItemsPerPage();
-  }
-  connectedCallback() {
-    window.screen.orientation.addEventListener('change', this.orientationChangeHandler);
-  }
-  disconnectedCallback() {
-    this.el.removeEventListener('touchstart', this.handleTouchStart);
-    this.el.removeEventListener('touchmove', this.handleTouchMove);
-    window.screen.orientation.removeEventListener('change', this.orientationChangeHandler);
-    window.removeEventListener('resize', this.resizeHandler);
-  }
-  render() {
-    var _a;
-    const styles = {
-      transform: `translate(${(this.sliderItemsElementWidth / (((_a = this.sliderItems) === null || _a === void 0 ? void 0 : _a.length) - 1) * this.activeIndex) * -1}px, 0px)`
-    };
-    const itemStyle = {
-      width: `${this.itemElementWidth / this.itemsPerPage}px`
-    };
-    return h("div", { class: "SliderWrapper" }, h("div", { class: 'MainContent ' }, this.showSliderArrows &&
-      h("div", { class: `SliderNavButton LeftArrow ${this.activeIndex === 0 ? 'DisabledArrow ' : ''} ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}`, onClick: () => this.move(-1) }, h("svg", { fill: "none", stroke: "var(--emfe-w-color-secondary, #FD2839)", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))), h("div", { class: 'ItemsWrapper', ref: (el) => this.sliderItemsElement = el }, h("div", { class: 'Items AssetsItems', style: styles }, this.sliderItems.map((assetUrl) => h("img", { class: `img${this.itemsPerPage}`, alt: 'Gift Thumbnails', style: itemStyle, src: assetUrl })))), this.showSliderArrows &&
-      h("div", { class: `SliderNavButton RightArrow  ${this.sliderItems.length === 1 ? 'HiddenArrow ' : ''}
-                      ${(this.activeIndex === (this.sliderItems.length - 1) || this.itemsPerPage == this.sliderItems.length) ? 'DisabledArrow' : ''}`, onClick: () => this.move(1) }, h("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))), this.showSliderDots && this.sliderItems.length > 1 &&
-      h("div", { class: "DotsWrapper" }, h("ul", { class: "Dots" }, this.renderDots())));
-  }
-  get el() { return getElement(this); }
+    get el() { return getElement(this); }
 };
@@ -141,61 +132,61 @@
 const TRANSLATIONS = {
-  en: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  ro: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem'
-  },
-  fr: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  ar: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  },
-  hu: {
-    coins: 'Coins',
-    noGiftPresentation: 'No description',
-    redeem: 'Redeem',
-    noDataFound: 'No data found',
-    error4003: 'Invalid Session',
-    redeemFailed: 'Failed to redeem',
-  }
+    en: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    ro: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem'
+    },
+    fr: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    ar: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    },
+    hu: {
+        coins: 'Coins',
+        noGiftPresentation: 'No description',
+        redeem: 'Redeem',
+        noDataFound: 'No data found',
+        error4003: 'Invalid Session',
+        redeemFailed: 'Failed to redeem',
+    }
 };
 const translate = (key, customLang) => {
-  const lang = customLang;
-  return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+    const lang = customLang;
+    return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
 };
 const getTranslations = (url) => {
-  // fetch url, get the data, replace the TRANSLATIONS content
-  return new Promise((resolve) => {
-    fetch(url)
-      .then((res) => res.json())
-      .then((data) => {
-      Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-          TRANSLATIONS[item][key] = data[item][key];
-        }
-      });
-      resolve(true);
+    // fetch url, get the data, replace the TRANSLATIONS content
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((item) => {
+                for (let key in data[item]) {
+                    TRANSLATIONS[item][key] = data[item][key];
+                }
+            });
+            resolve(true);
+        });
     });
-  });
 };
@@ -210,243 +201,223 @@
 const getDevice = () => {
-  let userAgent = window.navigator.userAgent;
-  if (userAgent.toLowerCase().match(/android/i)) {
-    return 'Android';
-  }
-  if (userAgent.toLowerCase().match(/iphone/i)) {
-    return 'iPhone';
-  }
-  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
-    return 'iPad';
-  }
-  return 'PC';
-};
-const getDevicePlatform = () => {
-  const device = getDevice();
-  if (device) {
-    if (device === 'PC') {
-      return 'dk';
+    let userAgent = window.navigator.userAgent;
+    if (userAgent.toLowerCase().match(/android/i)) {
+        return 'Android';
     }
-    else if (device === 'iPad' || device === 'iPhone') {
-      return 'ios';
+    if (userAgent.toLowerCase().match(/iphone/i)) {
+        return 'iPhone';
     }
-    else {
-      return 'mtWeb';
+    if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+        return 'iPad';
     }
-  }
+    return 'PC';
 };
+const getDevicePlatform = () => {
+    const device = getDevice();
+    if (device) {
+        if (device === 'PC') {
+            return 'dk';
+        }
+        else if (device === 'iPad' || device === 'iPhone') {
+            return 'ios';
+        }
+        else {
+            return 'mtWeb';
+        }
+    }
+};
 
-const bonusElevateShopItemCss = ":host{display:block}.ElevateDetails{display:flex;flex-direction:row;flex-wrap:wrap;padding:10px;width:calc(100% - 20px);}.ElevateDetails .RedeemError{display:none}.ElevateDetails .Error{color:var(--emfe-w-color-error, #FD2839)}.ElevateDetails .Row{flex-direction:row;display:flex}.ElevateDetails .Col{flex-direction:column;display:flex}.ElevateDetails .Details{padding:20px}.ElevateDetails .ThumbnailRow{display:flex;flex-direction:column;justify-content:space-between;min-width:268px;max-width:398px}.ElevateDetails .ThumbnailRow .BackButton{width:20px;height:20px;padding:5px;background:white;box-shadow:0px 4px 40px 0px rgba(138, 149, 158, 0.2);margin:10px 0 10px;cursor:pointer;animation-timing-function:ease-out;animation-duration:300ms;transition-property:all;border:1px solid #e4e6e8;border-radius:5px;text-align:center}.ElevateDetails .ThumbnailRow .BackButton:hover{background:#e3dede}.ElevateDetails .ThumbnailRow .Thumbnails{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .ShopItemDetail{flex-grow:1;min-width:300px}.ElevateDetails .GiftPoints .Points{font-size:21px}.ElevateDetails .GiftPoints .PointsLabel{font-size:12px;color:var(--emfe-w-color-gray-300, #4e5a37);font-weight:400;line-height:29px;letter-spacing:0.04em;text-align:left}.ElevateDetails .RedeemButton:hover{font-weight:800;border:2px solid var(--emfe-w-color-gray-300, #e5e7d5)}.ElevateDetails .RedeemButton.Disabled:hover{font-weight:normal;border:2px solid transparent}.ElevateDetails .RedeemButton{margin-top:50px;color:#f1f1f1;font-size:20px;padding:16px 25px 16px 25px;border-radius:18px;text-align:center;cursor:pointer;background:linear-gradient(0deg, #26CC37, #26CC37), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%);border:2px solid;border-image-source:linear-gradient(283.85deg, rgba(190, 40, 40, 0.5) 0%, rgba(56, 64, 179, 0) 33.47%);box-shadow:0px 4px 4px 0px rgba(0, 0, 0, 0.25)}.ElevateDetails .RedeemButton.DkButton{width:80px;padding:8px;font-size:16px;border-radius:5px}.ElevateDetails .RedeemButton.Disabled{background:linear-gradient(0deg, #b8c4b9, #9eb0a0), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%)}.ElevateDetails .SliderWrapper{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .SliderWrapper .MainContent{display:flex;flex-direction:row;justify-content:space-around}.ElevateDetails .SliderWrapper .MainContent .LeftArrow,.ElevateDetails .SliderWrapper .MainContent .RightArrow{width:20px}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper{overflow:hidden;display:inline-flex;width:calc(100% - 40px);flex-direction:column}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper .Items{display:inline-flex;transition:transform 0.4s ease-in-out;transform:translateX(0px);margin:auto}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img2{width:50%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img3{width:30%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img,.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img1{max-width:100%;background:#efefef;border:1px solid #efefef;border-radius:18px;border:1px;margin:10px 0 10px}.ElevateDetails .SliderWrapper .DotsWrapper{width:100%;margin:0 auto;height:30px}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots{display:flex;justify-content:center;padding:0}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li{height:10px;width:10px;background:#ccc;border-radius:50%;margin-left:3px;margin-right:3px;list-style:none;cursor:pointer}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li:hover{background:#bbb}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.active{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.default{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background-color:#FFF}.ElevateDetails .SliderNavButton{border:0px;width:25px;display:flex;align-items:center;justify-content:center;cursor:pointer}.ElevateDetails .SliderNavButton.HiddenArrow{visibility:hidden}.ElevateDetails .SliderNavButton svg{width:20px;stroke:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .DisabledArrow svg{opacity:0.2;stroke:var(--emfe-w-color-secondary, #FD2839);pointer-events:none}";
+const bonusElevateShopItemCss = ":host{display:block}.ElevateDetails{display:flex;flex-direction:row;flex-wrap:wrap;padding:10px;width:calc(100% - 20px);}.ElevateDetails .RedeemError{display:none}.ElevateDetails .Error{color:var(--emfe-w-color-error, #FD2839)}.ElevateDetails .Row{flex-direction:row;display:flex}.ElevateDetails .Col{flex-direction:column;display:flex}.ElevateDetails .Details{padding:20px}.ElevateDetails .ThumbnailRow{display:flex;flex-direction:column;justify-content:space-between;min-width:268px;max-width:398px}.ElevateDetails .ThumbnailRow .BackButton{width:20px;height:20px;padding:5px;background:white;box-shadow:0px 4px 40px 0px rgba(138, 149, 158, 0.2);margin:10px 0 10px;cursor:pointer;animation-timing-function:ease-out;animation-duration:300ms;transition-property:all;border:1px solid #e4e6e8;border-radius:5px;text-align:center}.ElevateDetails .ThumbnailRow .BackButton:hover{background:rgb(227, 222, 222)}.ElevateDetails .ThumbnailRow .Thumbnails{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .ShopItemDetail{flex-grow:1;min-width:300px}.ElevateDetails .GiftPoints .Points{font-size:21px}.ElevateDetails .GiftPoints .PointsLabel{font-size:12px;color:var(--emfe-w-color-gray-300, rgb(78, 90, 55));font-weight:400;line-height:29px;letter-spacing:0.04em;text-align:left}.ElevateDetails .RedeemButton:hover{font-weight:800;border:2px solid var(--emfe-w-color-gray-300, rgb(229, 231, 213))}.ElevateDetails .RedeemButton.Disabled:hover{font-weight:normal;border:2px solid transparent}.ElevateDetails .RedeemButton{margin-top:50px;color:#f1f1f1;font-size:20px;padding:16px 25px 16px 25px;border-radius:18px;text-align:center;cursor:pointer;background:linear-gradient(0deg, #26CC37, #26CC37), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%);border:2px solid;border-image-source:linear-gradient(283.85deg, rgba(190, 40, 40, 0.5) 0%, rgba(56, 64, 179, 0) 33.47%);box-shadow:0px 4px 4px 0px rgba(0, 0, 0, 0.25)}.ElevateDetails .RedeemButton.DkButton{width:80px;padding:8px;font-size:16px;border-radius:5px}.ElevateDetails .RedeemButton.Disabled{background:linear-gradient(0deg, #b8c4b9, #9eb0a0), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%)}.ElevateDetails .SliderWrapper{display:flex;flex-direction:column;position:relative;width:calc(100% - 40px)}.ElevateDetails .SliderWrapper .MainContent{display:flex;flex-direction:row;justify-content:space-around}.ElevateDetails .SliderWrapper .MainContent .LeftArrow,.ElevateDetails .SliderWrapper .MainContent .RightArrow{width:20px}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper{overflow:hidden;display:inline-flex;width:calc(100% - 40px);flex-direction:column}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper .Items{display:inline-flex;transition:transform 0.4s ease-in-out;transform:translateX(0px);margin:auto}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img2{width:50%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img3{width:30%}.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img,.ElevateDetails .SliderWrapper .MainContent .ItemsWrapper img.img1{max-width:100%;background:rgb(239, 239, 239);border:1px solid rgb(239, 239, 239);border-radius:18px;border:1px;margin:10px 0 10px}.ElevateDetails .SliderWrapper .DotsWrapper{width:100%;margin:0 auto;height:30px}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots{display:flex;justify-content:center;padding:0}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li{height:10px;width:10px;background:#ccc;border-radius:50%;margin-left:3px;margin-right:3px;list-style:none;cursor:pointer}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li:hover{background:#bbb}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.active{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .SliderWrapper .DotsWrapper ul.Dots li.default{border:solid 1px var(--emfe-w-color-secondary, #FD2839);background-color:#FFF}.ElevateDetails .SliderNavButton{border:0px;width:25px;display:flex;align-items:center;justify-content:center;cursor:pointer}.ElevateDetails .SliderNavButton.HiddenArrow{visibility:hidden}.ElevateDetails .SliderNavButton svg{width:20px;stroke:var(--emfe-w-color-secondary, #FD2839)}.ElevateDetails .DisabledArrow svg{opacity:0.2;stroke:var(--emfe-w-color-secondary, #FD2839);pointer-events:none}";
+const BonusElevateShopItemStyle0 = bonusElevateShopItemCss;
 
 const BonusElevateShopItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.redeemGiftButton = createEvent(this, "redeemGiftButton", 7);
-    /**
-     * Currently selected language.
-     */
-    this.language = 'en';
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.isGiftNotFound = false;
-    this.redeemErrorMsg = '';
-    this.isRedeeming = false;
-    this.bindedHandler = this.handleMessage.bind(this);
-    this.deviceType = getDevicePlatform();
-  }
-  redeemGiftConfirm() {
-    window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
-  }
-  handleMessage(message) {
-    if (message.data && message.data.type === "bee-redeem-confirmed" &&
-      message.data.id == this.elevateGift.id) {
-      this.redeemGift();
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.redeemGiftButton = createEvent(this, "redeemGiftButton", 7);
+        this.bindedHandler = this.handleMessage.bind(this);
+        this.deviceType = getDevicePlatform();
+        this.endpoint = undefined;
+        this.language = 'en';
+        this.itemId = undefined;
+        this.elevateGift = undefined;
+        this.session = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.isGiftNotFound = false;
+        this.redeemErrorMsg = '';
+        this.isRedeeming = false;
     }
-  }
-  onBackClicked() {
-    window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
-  }
-  redeemGift() {
-    if (this.elevateGift.available.toLowerCase() === 'false') {
-      return;
+    redeemGiftConfirm() {
+        window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
     }
-    let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
-    let claimGiftOptions = {
-      method: 'PUT',
-      headers: {
-        'x-SessionId': this.session,
-        'Content-Type': 'application/json-patch+json',
-      },
-      body: JSON.stringify({ giftId: this.elevateGift.id }),
-    };
-    this.redeemErrorMsg = '';
-    this.isRedeeming = true;
-    fetch(url.toString(), claimGiftOptions)
-      .then((res) => res.json())
-      .then((res) => {
-      if (res.success) {
-        this.redeemGiftButton.emit();
-        window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
-      }
-      else {
-        let translatedError = translate(`error${res.errorCode}`, this.language);
-        this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
-        window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
-      }
-    })
-      .catch((err) => {
-      window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
-    }).finally(() => {
-      this.isRedeeming = false;
-    });
-  }
-  async loadElevateGift() {
-    let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
-    let options = {
-      headers: {
-        'Content-Type': 'application/json',
-        'x-SessionId': this.session,
-      },
-      method: 'GET',
-    };
-    await new Promise((resolve) => {
-      fetch(url.href, options)
-        .then((res) => res.json())
-        .then((data) => {
-        let filteredGifts = data.data;
-        if (filteredGifts && filteredGifts.length == 1) {
-          this.elevateGift = filteredGifts[0];
-          this.isGiftNotFound = false;
+    handleMessage(message) {
+        if (message.data && message.data.type === "bee-redeem-confirmed" &&
+            message.data.id == this.elevateGift.id) {
+            this.redeemGift();
         }
+    }
+    onBackClicked() {
+        window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
+    }
+    redeemGift() {
+        if (this.elevateGift.available.toLowerCase() === 'false') {
+            return;
+        }
+        let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
+        let claimGiftOptions = {
+            method: 'PUT',
+            headers: {
+                'x-SessionId': this.session,
+                'Content-Type': 'application/json-patch+json',
+            },
+            body: JSON.stringify({ giftId: this.elevateGift.id }),
+        };
+        this.redeemErrorMsg = '';
+        this.isRedeeming = true;
+        fetch(url.toString(), claimGiftOptions)
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.success) {
+                this.redeemGiftButton.emit();
+                window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
+            }
+            else {
+                let translatedError = translate(`error${res.errorCode}`, this.language);
+                this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
+                window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
+            }
+        })
+            .catch((err) => {
+            window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
+        }).finally(() => {
+            this.isRedeeming = false;
+        });
+    }
+    async loadElevateGift() {
+        let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
+        let options = {
+            headers: {
+                'Content-Type': 'application/json',
+                'x-SessionId': this.session,
+            },
+            method: 'GET',
+        };
+        await new Promise((resolve) => {
+            fetch(url.href, options)
+                .then((res) => res.json())
+                .then((data) => {
+                let filteredGifts = data.data;
+                if (filteredGifts && filteredGifts.length == 1) {
+                    this.elevateGift = filteredGifts[0];
+                    this.isGiftNotFound = false;
+                }
+                else {
+                    this.isGiftNotFound = true;
+                }
+                resolve(true);
+            });
+        });
+    }
+    disconnectedCallback() {
+        window.removeEventListener('message', this.bindedHandler, false);
+    }
+    componentDidLoad() {
+        window.addEventListener('message', this.bindedHandler, false);
+    }
+    async componentWillLoad() {
+        if (this.translationUrl.length > 2) {
+            await getTranslations(this.translationUrl);
+        }
+        if (this.elevateGift) {
+            this.isGiftNotFound = false;
+        }
         else {
-          this.isGiftNotFound = true;
+            await this.loadElevateGift();
         }
-        resolve(true);
-      });
-    });
-  }
-  disconnectedCallback() {
-    window.removeEventListener('message', this.bindedHandler, false);
-  }
-  componentDidLoad() {
-    window.addEventListener('message', this.bindedHandler, false);
-  }
-  async componentWillLoad() {
-    if (this.translationUrl.length > 2) {
-      await getTranslations(this.translationUrl);
     }
-    if (this.elevateGift) {
-      this.isGiftNotFound = false;
+    render() {
+        return (h(Host, { key: '6f28f64d3413dd82bc81fc6fd975baa992d06289' }, h("general-styling-wrapper", { key: '88dedbfb25562fbe95a69748649ed9c14a2c42f6', clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), h("div", { key: '9f2a66f9d48882220ab5d3850f343e995ffe9a6b', class: 'ElevateDetails' }, this.isGiftNotFound && (h(Fragment, { key: '91f4079bf7af7e4d61b1681a9848c72c9a2249d5' }, h("div", { key: 'e0427680e0d7e94e51644f12a2430a6a42e3d340', class: "Row ThumbnailRow" }, h("div", { key: '4fd78968b2fdf281b7c22596351b366058cfcec3', class: "BackButton", onClick: () => {
+                this.onBackClicked();
+            } }, '<')), h("div", { key: 'eeb8cbc40429cf1ebf7a5f0de3d5b8226a40437b', class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && h(Fragment, { key: '45380d051b279d9c7fcd580f06252911763073e0' }, h("div", { key: 'c440d72501fb91601106fbf74a866887bc02ee43', class: "ThumbnailRow" }, h("div", { key: '005f436acbc51372d013e1931d54b71738f2e0fc', class: 'Row' }, h("div", { key: 'a9ace30abf1c50d639c31bb047d7b7d7cb6b27b8', class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), h("bonus-elevate-shop-assets-slider", { key: '8c4121e66a3fae912e72fc10c6a81354a7b36e9f', class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), h("div", { key: 'c6a207dfe14402e4d1890e7b787bf4b5a2247160', class: 'Col Details' }, h("h3", { key: 'c190b88ab4d1e13885593b9d6b9c62b161bdff23', class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), h("div", { key: 'befddb7b8dff3bb73377da4bfb30ce003dcccb7b', class: "GiftPoints" }, h("span", { key: '4e879d150709e670b2c7c90f0034c75c4ba30386', class: "Points" }, this.elevateGift.points, " "), h("span", { key: 'a7d28d964b41126a76f9988d0f4fc05653787066', class: " PointsLabel" }, translate('coins', this.language))))), h("div", { key: '14d2374d40825ac91b275fda81ca22d40f21c0be', class: 'ShopItemDetail Details' }, h("div", { key: '197bb9c0089173f8c4f180e115068f6204a6f7ea', class: "GiftPresentation" }, h("p", { key: '30be8dbec63f8f4d2bc3687d7e992d73c534a20f' }, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), h("div", { key: '7e0a9e4d03f338137649c9477a44c7036aea1609', class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
+                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), h("span", { key: '89b70f02565437ed28b175c65d0767354b6c9d6b', class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
     }
-    else {
-      await this.loadElevateGift();
-    }
-  }
-  render() {
-    return (h(Host, null, h("general-styling-wrapper", { clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), h("div", { class: 'ElevateDetails' }, this.isGiftNotFound && (h(Fragment, null, h("div", { class: "Row ThumbnailRow" }, h("div", { class: "BackButton", onClick: () => {
-        this.onBackClicked();
-      } }, '<')), h("div", { class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && h(Fragment, null, h("div", { class: "ThumbnailRow" }, h("div", { class: 'Row' }, h("div", { class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), h("bonus-elevate-shop-assets-slider", { class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), h("div", { class: 'Col Details' }, h("h3", { class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), h("div", { class: "GiftPoints" }, h("span", { class: "Points" }, this.elevateGift.points, " "), h("span", { class: " PointsLabel" }, translate('coins', this.language))))), h("div", { class: 'ShopItemDetail Details' }, h("div", { class: "GiftPresentation" }, h("p", null, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), h("div", { class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
-                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), h("span", { class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
-  }
 };
-BonusElevateShopItem.style = bonusElevateShopItemCss;
+BonusElevateShopItem.style = BonusElevateShopItemStyle0;
 
 const mergeTranslations = (url, target) => {
-  return new Promise((resolve) => {
-    fetch(url)
-      .then((res) => res.json())
-      .then((data) => {
-      Object.keys(data).forEach((item) => {
-        target[item] = target[item] ? target[item] : {};
-        for (let key in data[item]) {
-          target[item][key] = data[item][key];
-        }
-      });
-      resolve(true);
+    return new Promise((resolve) => {
+        fetch(url)
+            .then((res) => res.json())
+            .then((data) => {
+            Object.keys(data).forEach((item) => {
+                target[item] = target[item] ? target[item] : {};
+                for (let key in data[item]) {
+                    target[item][key] = data[item][key];
+                }
+            });
+            resolve(true);
+        });
     });
-  });
 };
 
 const generalStylingWrapperCss = ":host{display:block}";
+const GeneralStylingWrapperStyle0 = generalStylingWrapperCss;
 
 const GeneralStylingWrapper = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    this.stylingAppends = false;
-    this.setClientStyling = () => {
-      let sheet = document.createElement('style');
-      sheet.innerHTML = this.clientStyling;
-      this.el.prepend(sheet);
-    };
-    this.setClientStylingURL = () => {
-      let url = new URL(this.clientStylingUrl);
-      let cssFile = document.createElement('style');
-      fetch(url.href)
-        .then((res) => res.text())
-        .then((data) => {
-        cssFile.innerHTML = data;
-        setTimeout(() => {
-          this.el.prepend(cssFile);
-        }, 1);
-      })
-        .catch((err) => {
-        console.log('error ', err);
-      });
-    };
-  }
-  componentDidRender() {
-    // start custom styling area
-    if (!this.stylingAppends) {
-      if (this.clientStyling)
-        this.setClientStyling();
-      if (this.clientStylingUrl)
-        this.setClientStylingURL();
-      this.stylingAppends = true;
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.stylingAppends = false;
+        this.setClientStyling = () => {
+            let sheet = document.createElement('style');
+            sheet.innerHTML = this.clientStyling;
+            this.el.prepend(sheet);
+        };
+        this.setClientStylingURL = () => {
+            let url = new URL(this.clientStylingUrl);
+            let cssFile = document.createElement('style');
+            fetch(url.href)
+                .then((res) => res.text())
+                .then((data) => {
+                cssFile.innerHTML = data;
+                setTimeout(() => {
+                    this.el.prepend(cssFile);
+                }, 1);
+            })
+                .catch((err) => {
+                console.log('error ', err);
+            });
+        };
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.targetTranslations = undefined;
     }
-    // end custom styling area
-  }
-  async componentWillLoad() {
-    const promises = [];
-    if (this.translationUrl) {
-      const translationPromise = mergeTranslations(this.translationUrl, this.targetTranslations);
-      promises.push(translationPromise);
+    componentDidRender() {
+        // start custom styling area
+        if (!this.stylingAppends) {
+            if (this.clientStyling)
+                this.setClientStyling();
+            if (this.clientStylingUrl)
+                this.setClientStylingURL();
+            this.stylingAppends = true;
+        }
+        // end custom styling area
     }
-    return await Promise.all(promises);
-  }
-  render() {
-    return (h("div", { class: "StyleShell" }, h("slot", { name: "mainContent" })));
-  }
-  get el() { return getElement(this); }
+    async componentWillLoad() {
+        const promises = [];
+        if (this.translationUrl) {
+            const translationPromise = mergeTranslations(this.translationUrl, this.targetTranslations);
+            promises.push(translationPromise);
+        }
+        return await Promise.all(promises);
+    }
+    render() {
+        return (h("div", { key: '4d3414408c7662f88331dbe655966237f74d6958', class: "StyleShell" }, h("slot", { key: '1d004644d84602c4314bdf5dfc26b55b160f57df', name: "mainContent" })));
+    }
+    get el() { return getElement(this); }
 };
-GeneralStylingWrapper.style = generalStylingWrapperCss;
+GeneralStylingWrapper.style = GeneralStylingWrapperStyle0;
 
 export { BonusElevateShopAssetsSlider as bonus_elevate_shop_assets_slider, BonusElevateShopItem as bonus_elevate_shop_item, GeneralStylingWrapper as general_styling_wrapper };

dist/esm/bonus-elevate-shop-item.js

@@ -1,17 +0,20 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-4927ce96.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-fa394550.js';
+export { s as setNonce } from './index-fa394550.js';
+import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
- Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com
  */
-const patchBrowser = () => {
-    const importMeta = import.meta.url;
-    const opts = {};
-    if (importMeta !== '') {
-        opts.resourcesUrl = new URL('.', importMeta).href;
-    }
-    return promiseResolve(opts);
+var patchBrowser = () => {
+  const importMeta = import.meta.url;
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return promiseResolve(opts);
 };
 
-patchBrowser().then(options => {
+patchBrowser().then(async (options) => {
+  await globalScripts();
   return bootstrapLazy([["bonus-elevate-shop-assets-slider_3",[[1,"bonus-elevate-shop-item",{"endpoint":[513],"language":[513],"itemId":[1537,"item-id"],"elevateGift":[1040],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"isGiftNotFound":[32],"redeemErrorMsg":[32],"isRedeeming":[32]}],[0,"bonus-elevate-shop-assets-slider",{"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"itemsPerPage":[514,"items-per-page"],"sliderItems":[16],"activeIndex":[32]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}]]]], options);
 });

dist/esm/loader.js

@@ -1,17 +0,11 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-4927ce96.js';
+import { b as bootstrapLazy } from './index-fa394550.js';
+export { s as setNonce } from './index-fa394550.js';
+import { g as globalScripts } from './app-globals-0f993ce5.js';
 
-/*
- Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
- */
-const patchEsm = () => {
-    return promiseResolve();
-};
-
-const defineCustomElements = (win, options) => {
-  if (typeof window === 'undefined') return Promise.resolve();
-  return patchEsm().then(() => {
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await globalScripts();
   return bootstrapLazy([["bonus-elevate-shop-assets-slider_3",[[1,"bonus-elevate-shop-item",{"endpoint":[513],"language":[513],"itemId":[1537,"item-id"],"elevateGift":[1040],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"isGiftNotFound":[32],"redeemErrorMsg":[32],"isRedeeming":[32]}],[0,"bonus-elevate-shop-assets-slider",{"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"itemsPerPage":[514,"items-per-page"],"sliderItems":[16],"activeIndex":[32]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}]]]], options);
-  });
 };
 
 export { defineCustomElements };

dist/stencil.config.js

@@ -1,24 +0,17 @@
-import { sass } from '@stencil/sass';
-const local = process.argv && process.argv[2] && process.argv[2].indexOf('--dev') > -1;
+import { sass } from "@stencil/sass";
 export const config = {
-  namespace: 'bonus-elevate-shop-item',
-  taskQueue: 'async',
-  plugins: [sass()],
-  sourceMap: local,
-  outputTargets: [
-    {
-      type: 'dist',
-      esmLoaderPath: '../loader',
+    namespace: 'bonus-elevate-shop-item',
+    taskQueue: 'async',
+    sourceMap: false,
+    minifyJs: true,
+    extras: {
+        experimentalImportInjection: true
     },
-    {
-      type: 'dist-custom-elements',
-    },
-    {
-      type: 'docs-readme',
-    },
-    {
-      type: 'www',
-      serviceWorker: null, // disable service workers
-    },
-  ],
+    plugins: [sass()],
+    outputTargets: [
+        {
+            type: 'dist',
+            esmLoaderPath: '../loader'
+        }
+    ]
 };

dist/types/components.d.ts

@@ -9,2 +9,3 @@ /* eslint-disable */
 import { BonusElevateShopItemInfo } from "./models/bonus-elevate-shop-item";
+export { BonusElevateShopItemInfo } from "./models/bonus-elevate-shop-item";
 export namespace Components {
@@ -66,2 +67,6 @@ interface BonusElevateShopAssetsSlider {
 }
+export interface BonusElevateShopItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBonusElevateShopItemElement;
+}
 declare global {
@@ -74,3 +79,14 @@ interface HTMLBonusElevateShopAssetsSliderElement extends Components.BonusElevateShopAssetsSlider, HTMLStencilElement {
     };
+    interface HTMLBonusElevateShopItemElementEventMap {
+        "redeemGiftButton": Object;
+    }
     interface HTMLBonusElevateShopItemElement extends Components.BonusElevateShopItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBonusElevateShopItemElementEventMap>(type: K, listener: (this: HTMLBonusElevateShopItemElement, ev: BonusElevateShopItemCustomEvent<HTMLBonusElevateShopItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBonusElevateShopItemElementEventMap>(type: K, listener: (this: HTMLBonusElevateShopItemElement, ev: BonusElevateShopItemCustomEvent<HTMLBonusElevateShopItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
@@ -124,3 +140,3 @@ var HTMLBonusElevateShopItemElement: {
         "language"?: string;
-        "onRedeemGiftButton"?: (event: CustomEvent<Object>) => void;
+        "onRedeemGiftButton"?: (event: BonusElevateShopItemCustomEvent<Object>) => void;
         /**
@@ -127,0 +143,0 @@ * session

dist/types/components/bonus-elevate-shop-item/bonus-elevate-shop-assets-slider.d.ts

 export declare class BonusElevateShopAssetsSlider {
-  /**
-   * Show slider dots
-   */
-  showSliderDots: boolean;
-  /**
-   * Show slider navigate arrows
-   */
-  showSliderArrows: boolean;
-  itemsPerPage: number;
-  sliderItems: Array<any>;
-  el: HTMLElement;
-  /**
-   * Slider variables
-   */
-  activeIndex: number;
-  sliderItemsElement: HTMLElement;
-  itemElementWidth: number;
-  sliderItemsElementWidth: number;
-  xDown: any;
-  yDown: any;
-  setActive(index: number): void;
-  orientationChangeHandler: () => void;
-  resizeHandler: () => void;
-  move(direction: number): void;
-  goTo(index: number): void;
-  handleTouchStart(evt: any): void;
-  getTouches(evt: any): any;
-  handleTouchMove(evt: any): void;
-  recalculateItemsPerPage(): void;
-  renderDots(): Array<HTMLElement>;
-  componentDidRender(): void;
-  componentDidUpdate(): void;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  render(): any;
+    /**
+     * Show slider dots
+     */
+    showSliderDots: boolean;
+    /**
+     * Show slider navigate arrows
+     */
+    showSliderArrows: boolean;
+    itemsPerPage: number;
+    sliderItems: Array<any>;
+    el: HTMLElement;
+    /**
+     * Slider variables
+     */
+    activeIndex: number;
+    sliderItemsElement: HTMLElement;
+    itemElementWidth: number;
+    sliderItemsElementWidth: number;
+    xDown: any;
+    yDown: any;
+    setActive(index: number): void;
+    orientationChangeHandler: () => void;
+    resizeHandler: () => void;
+    move(direction: number): void;
+    goTo(index: number): void;
+    handleTouchStart(evt: any): void;
+    getTouches(evt: any): any;
+    handleTouchMove(evt: any): void;
+    recalculateItemsPerPage(): void;
+    renderDots(): Array<HTMLElement>;
+    componentDidRender(): void;
+    componentDidUpdate(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): any;
 }

dist/types/components/bonus-elevate-shop-item/bonus-elevate-shop-item.d.ts

 import { EventEmitter } from '../../stencil-public-runtime';
-import '@everymatrix/general-styling-wrapper';
+import "../../../../../../dist/packages/stencil/general-styling-wrapper/dist/types/index";
 import { BonusElevateShopItemInfo } from '../../models/bonus-elevate-shop-item';
 export declare class BonusElevateShopItem {
-  /**
-   * NorWAy endpoint
-   */
-  endpoint: string;
-  /**
-   * Currently selected language.
-   */
-  language: string;
-  /**
-   * Elevate gift id
-   */
-  itemId: string;
-  /**
-   * Elevate gift id
-   */
-  elevateGift: BonusElevateShopItemInfo;
-  /**
-   * session
-   */
-  session: string;
-  /**
-   * Client custom styling via inline styles
-   */
-  clientStyling: string;
-  /**
-   * Client custom styling via url
-   */
-  clientStylingUrl: string;
-  /**
-   * Translation via url
-   */
-  translationUrl: string;
-  /**
-   * Show slider dots
-   */
-  showSliderDots: boolean;
-  /**
-   * Show slider navigate arrows
-   */
-  showSliderArrows: boolean;
-  isGiftNotFound: boolean;
-  redeemErrorMsg: string;
-  isRedeeming: boolean;
-  redeemGiftButton: EventEmitter<Object>;
-  private bindedHandler;
-  deviceType: string;
-  redeemGiftConfirm(): void;
-  private handleMessage;
-  onBackClicked(): void;
-  redeemGift(): void;
-  loadElevateGift(): Promise<void>;
-  disconnectedCallback(): void;
-  componentDidLoad(): void;
-  componentWillLoad(): Promise<void>;
-  render(): any;
+    /**
+     * NorWAy endpoint
+     */
+    endpoint: string;
+    /**
+     * Currently selected language.
+     */
+    language: string;
+    /**
+     * Elevate gift id
+     */
+    itemId: string;
+    /**
+     * Elevate gift id
+     */
+    elevateGift: BonusElevateShopItemInfo;
+    /**
+     * session
+     */
+    session: string;
+    /**
+     * Client custom styling via inline styles
+     */
+    clientStyling: string;
+    /**
+     * Client custom styling via url
+     */
+    clientStylingUrl: string;
+    /**
+     * Translation via url
+     */
+    translationUrl: string;
+    /**
+     * Show slider dots
+     */
+    showSliderDots: boolean;
+    /**
+     * Show slider navigate arrows
+     */
+    showSliderArrows: boolean;
+    isGiftNotFound: boolean;
+    redeemErrorMsg: string;
+    isRedeeming: boolean;
+    redeemGiftButton: EventEmitter<Object>;
+    private bindedHandler;
+    deviceType: string;
+    redeemGiftConfirm(): void;
+    private handleMessage;
+    onBackClicked(): void;
+    redeemGift(): void;
+    loadElevateGift(): Promise<void>;
+    disconnectedCallback(): void;
+    componentDidLoad(): void;
+    componentWillLoad(): Promise<void>;
+    render(): any;
 }

dist/types/models/bonus-elevate-shop-item.d.ts

 export interface ElevateShopItemPresentation {
-  assets?: Array<string>;
-  description?: string;
-  displayName?: string;
+    assets?: Array<string>;
+    description?: string;
+    displayName?: string;
 }
 export interface BonusElevateShopItemInfo {
-  id: string;
-  available: string;
-  type: string;
-  bonusCode: string;
-  points: number;
-  monetaryValue: number;
-  excludeEarnedTypes: Array<string>;
-  displayName?: string;
-  presentation: ElevateShopItemPresentation;
+    id: string;
+    available: string;
+    type: string;
+    bonusCode: string;
+    points: number;
+    monetaryValue: number;
+    excludeEarnedTypes: Array<string>;
+    displayName?: string;
+    presentation: ElevateShopItemPresentation;
 }

dist/types/stencil-public-runtime.d.ts

@@ -7,2 +7,12 @@ declare type CustomMethodDecorator<T> = (target: Object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
     /**
+     * When set to `true` this component will be form-associated. See
+     * https://stenciljs.com/docs/next/form-associated documentation on how to
+     * build form-associated Stencil components that integrate into forms like
+     * native browser elements such as `<input>` and `<textarea>`.
+     *
+     * The {@link AttachInternals} decorator allows for access to the
+     * `ElementInternals` object to modify the associated form.
+     */
+    formAssociated?: boolean;
+    /**
      * Tag name of the web component. Ideally, the tag name must be globally unique,
@@ -66,3 +76,3 @@ * so it's recommended to choose an unique prefix for all your components within the same collection.
      * Stencil uses different heuristics to determine the default name of the attribute,
-     * but using this property, you can override the default behaviour.
+     * but using this property, you can override the default behavior.
      */
@@ -112,2 +122,5 @@ attribute?: string | null;
 }
+export interface AttachInternalsDecorator {
+    (): PropertyDecorator;
+}
 export interface ListenDecorator {
@@ -134,3 +147,3 @@ (eventName: string, opts?: ListenOptions): CustomMethodDecorator<any>;
      *
-     * Using the `passive` option can be used to change the default behaviour.
+     * Using the `passive` option can be used to change the default behavior.
      * Please see https://developers.google.com/web/updates/2016/06/passive-event-listeners for further information.
@@ -140,3 +153,3 @@ */
 }
-export declare type ListenTargetOptions = 'body' | 'document' | 'window';
+export type ListenTargetOptions = 'body' | 'document' | 'window';
 export interface StateDecorator {
@@ -184,2 +197,8 @@ (): PropertyDecorator;
 /**
+ * If the `formAssociated` option is set in options passed to the
+ * `@Component()` decorator then this decorator may be used to get access to the
+ * `ElementInternals` instance associated with the component.
+ */
+export declare const AttachInternals: AttachInternalsDecorator;
+/**
  * The `Listen()` decorator is for listening DOM events, including the ones
@@ -223,4 +242,4 @@ * dispatched from `@Events()`.
 export declare const Watch: WatchDecorator;
-export declare type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
-export declare type ErrorHandler = (err: any, element?: HTMLElement) => void;
+export type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
+export type ErrorHandler = (err: any, element?: HTMLElement) => void;
 /**
@@ -231,3 +250,5 @@ * `setMode()` is used for libraries which provide multiple "modes" for styles.
 /**
- * getMode
+ * `getMode()` is used for libraries which provide multiple "modes" for styles.
+ * @param ref a reference to the node to get styles for
+ * @returns the current mode or undefined, if not found
  */
@@ -245,2 +266,5 @@ export declare function getMode<T = string | undefined>(ref: any): T;
  * if the path needs to be customized.
+ * @param path the path to use in calculating the asset path. this value will be
+ * used in conjunction with the base asset path
+ * @returns the base path
  */
@@ -258,9 +282,22 @@ export declare function getAssetPath(path: string): string;
  * But do note that this configuration depends on how your script is bundled, or lack of
- * bunding, and where your assets can be loaded from. Additionally custom bundling
+ * bundling, and where your assets can be loaded from. Additionally custom bundling
  * will have to ensure the static assets are copied to its build directory.
+ * @param path the asset path to set
+ * @returns the set path
  */
 export declare function setAssetPath(path: string): string;
 /**
- * getElement
+ * Used to specify a nonce value that corresponds with an application's
+ * [Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a `meta` tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) and will result in the same behavior.
+ * @param nonce The value to be used for the nonce attribute.
  */
+export declare function setNonce(nonce: string): void;
+/**
+ * Retrieve a Stencil element for a given reference
+ * @param ref the ref to get the Stencil element for
+ * @returns a reference to the element
+ */
 export declare function getElement(ref: any): HTMLStencilElement;
@@ -270,3 +307,5 @@ /**
  *
- * Notice `forceUpdate()` is not syncronous and might perform the DOM render in the next frame.
+ * Notice `forceUpdate()` is not synchronous and might perform the DOM render in the next frame.
+ *
+ * @param ref the node/element to force the re-render of
  */
@@ -276,2 +315,3 @@ export declare function forceUpdate(ref: any): void;
  * getRenderingRef
+ * @returns the rendering ref
  */
@@ -287,2 +327,4 @@ export declare function getRenderingRef(): any;
  * For further information: https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing
+ *
+ * @param task the DOM-write to schedule
  */
@@ -295,2 +337,4 @@ export declare function writeTask(task: RafCallback): void;
  * For further information: https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing
+ *
+ * @param task the DOM-read to schedule
  */
@@ -424,3 +468,3 @@ export declare function readTask(task: RafCallback): void;
  */
-interface HostAttributes {
+export interface HostAttributes {
     class?: string | {
@@ -435,4 +479,40 @@ [className: string]: boolean;
 }
+/**
+ * Utilities for working with functional Stencil components. An object
+ * conforming to this interface is passed by the Stencil runtime as the third
+ * argument to a functional component, allowing component authors to work with
+ * features like children.
+ *
+ * The children of a functional component will be passed as the second
+ * argument, so a functional component which uses these utils to transform its
+ * children might look like the following:
+ *
+ * ```ts
+ * export const AddClass: FunctionalComponent = (_, children, utils) => (
+ *  utils.map(children, child => ({
+ *    ...child,
+ *    vattrs: {
+ *      ...child.vattrs,
+ *      class: `${child.vattrs.class} add-class`
+ *    }
+ *  }))
+ * );
+ * ```
+ *
+ * For more see the Stencil documentation, here:
+ * https://stenciljs.com/docs/functional-components
+ */
 export interface FunctionalUtilities {
+    /**
+     * Utility for reading the children of a functional component at runtime.
+     * Since the Stencil runtime uses a different interface for children it is
+     * not recommended to read the children directly, and is preferable to use
+     * this utility to, for instance, perform a side effect for each child.
+     */
     forEach: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => void) => void;
+    /**
+     * Utility for transforming the children of a functional component. Given an
+     * array of children and a callback this will return a list of the results of
+     * passing each child to the supplied callback.
+     */
     map: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => ChildNode) => VNode[];
@@ -443,2 +523,10 @@ }
 }
+/**
+ * A Child VDOM node
+ *
+ * This has most of the same properties as {@link VNode} but friendlier names
+ * (i.e. `vtag` instead of `$tag$`, `vchildren` instead of `$children$`) in
+ * order to provide a friendlier public interface for users of the
+ * {@link FunctionalUtilities}).
+ */
 export interface ChildNode {
@@ -490,2 +578,5 @@ vtag?: string | number | Function;
 export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
+/**
+ * A virtual DOM node
+ */
 export interface VNode {
@@ -698,2 +789,3 @@ $flags$: number;
         media?: string;
+        ping?: string;
         rel?: string;
@@ -725,3 +817,2 @@ target?: string;
     interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
-        autoFocus?: boolean;
         disabled?: boolean;
@@ -742,2 +833,5 @@ form?: string;
         value?: string | string[] | number;
+        popoverTargetAction?: string;
+        popoverTargetElement?: Element | null;
+        popoverTarget?: string;
     }
@@ -764,2 +858,3 @@ interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
     interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
+        onCancel?: (event: Event) => void;
         onClose?: (event: Event) => void;
@@ -824,2 +919,4 @@ open?: boolean;
         alt?: string;
+        crossOrigin?: string;
+        crossorigin?: string;
         decoding?: 'async' | 'auto' | 'sync';
@@ -846,8 +943,6 @@ importance?: 'low' | 'auto' | 'high';
         alt?: string;
-        autoCapitalize?: any;
-        autocapitalize?: any;
+        autoCapitalize?: string;
+        autocapitalize?: string;
         autoComplete?: string;
         autocomplete?: string;
-        autoFocus?: boolean;
-        autofocus?: boolean | string;
         capture?: string;
@@ -884,2 +979,4 @@ checked?: boolean;
         name?: string;
+        onSelect?: (event: Event) => void;
+        onselect?: (event: Event) => void;
         pattern?: string;
@@ -903,6 +1000,7 @@ placeholder?: string;
         width?: number | string;
+        popoverTargetAction?: string;
+        popoverTargetElement?: Element | null;
+        popoverTarget?: string;
     }
     interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
-        autoFocus?: boolean;
-        autofocus?: boolean | string;
         challenge?: string;
@@ -920,3 +1018,2 @@ disabled?: boolean;
         htmlFor?: string;
-        htmlfor?: string;
     }
@@ -1032,3 +1129,2 @@ interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
         htmlFor?: string;
-        htmlfor?: string;
         name?: string;
@@ -1058,3 +1154,2 @@ }
     interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
-        autoFocus?: boolean;
         disabled?: boolean;
@@ -1070,2 +1165,3 @@ form?: string;
     interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
+        height?: number;
         media?: string;
@@ -1076,2 +1172,3 @@ sizes?: string;
         type?: string;
+        width?: number;
     }
@@ -1092,4 +1189,4 @@ interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
     interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
-        autoFocus?: boolean;
-        autofocus?: boolean | string;
+        autoComplete?: string;
+        autocomplete?: string;
         cols?: number;
@@ -1103,2 +1200,4 @@ disabled?: boolean;
         name?: string;
+        onSelect?: (event: Event) => void;
+        onselect?: (event: Event) => void;
         placeholder?: string;
@@ -1146,2 +1245,4 @@ readOnly?: boolean;
         accessKey?: string;
+        autoFocus?: boolean;
+        autofocus?: boolean | string;
         class?: string | {
@@ -1158,2 +1259,3 @@ [className: string]: boolean;
         id?: string;
+        inert?: boolean;
         lang?: string;
@@ -1167,2 +1269,3 @@ spellcheck?: 'true' | 'false' | any;
         title?: string;
+        popover?: string | null;
         inputMode?: string;
@@ -1184,4 +1287,4 @@ inputmode?: string;
         vocab?: string;
-        autoCapitalize?: any;
-        autocapitalize?: any;
+        autoCapitalize?: string;
+        autocapitalize?: string;
         autoCorrect?: string;
@@ -1254,3 +1357,3 @@ autocorrect?: string;
         'color-interpolation'?: number | string;
-        'color-interpolation-filters'?: 'auto' | 's-rGB' | 'linear-rGB' | 'inherit';
+        'color-interpolation-filters'?: 'auto' | 'sRGB' | 'linearRGB';
         'color-profile'?: number | string;
@@ -1478,8 +1581,8 @@ 'color-rendering'?: number | string;
         onPasteCapture?: (event: ClipboardEvent) => void;
-        onCompositionEnd?: (event: CompositionEvent) => void;
-        onCompositionEndCapture?: (event: CompositionEvent) => void;
-        onCompositionStart?: (event: CompositionEvent) => void;
-        onCompositionStartCapture?: (event: CompositionEvent) => void;
-        onCompositionUpdate?: (event: CompositionEvent) => void;
-        onCompositionUpdateCapture?: (event: CompositionEvent) => void;
+        onCompositionend?: (event: CompositionEvent) => void;
+        onCompositionendCapture?: (event: CompositionEvent) => void;
+        onCompositionstart?: (event: CompositionEvent) => void;
+        onCompositionstartCapture?: (event: CompositionEvent) => void;
+        onCompositionupdate?: (event: CompositionEvent) => void;
+        onCompositionupdateCapture?: (event: CompositionEvent) => void;
         onFocus?: (event: FocusEvent) => void;
@@ -1495,4 +1598,4 @@ onFocusCapture?: (event: FocusEvent) => void;
         onChangeCapture?: (event: Event) => void;
-        onInput?: (event: Event) => void;
-        onInputCapture?: (event: Event) => void;
+        onInput?: (event: InputEvent) => void;
+        onInputCapture?: (event: InputEvent) => void;
         onReset?: (event: Event) => void;
@@ -1587,4 +1690,10 @@ onResetCapture?: (event: Event) => void;
         onAnimationIterationCapture?: (event: AnimationEvent) => void;
+        onTransitionCancel?: (event: TransitionEvent) => void;
+        onTransitionCancelCapture?: (event: TransitionEvent) => void;
         onTransitionEnd?: (event: TransitionEvent) => void;
         onTransitionEndCapture?: (event: TransitionEvent) => void;
+        onTransitionRun?: (event: TransitionEvent) => void;
+        onTransitionRunCapture?: (event: TransitionEvent) => void;
+        onTransitionStart?: (event: TransitionEvent) => void;
+        onTransitionStartCapture?: (event: TransitionEvent) => void;
     }
@@ -1591,0 +1700,0 @@ }

loader/cdn.js

@@ -1,3 +0,1 @@
-
-module.exports = require('../dist/cjs/loader.cjs.js');
-module.exports.applyPolyfills = function() { return Promise.resolve() };
+module.exports = require('../dist/cjs/loader.cjs.js');

loader/index.cjs.js

@@ -1,3 +0,1 @@
-
-module.exports = require('../dist/cjs/loader.cjs.js');
-module.exports.applyPolyfills = function() { return Promise.resolve() };
+module.exports = require('../dist/cjs/loader.cjs.js');

loader/index.d.ts

@@ -11,3 +11,15 @@ export * from '../dist/types/components';
 }
-export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): Promise<void>;
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+/**
+ * @deprecated
+ */
 export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

loader/index.es2017.js

@@ -1,3 +0,1 @@
-
-export * from '../dist/esm/polyfills/index.js';
-export * from '../dist/esm/loader.js';
+export * from '../dist/esm/loader.js';

loader/index.js

@@ -1,4 +0,2 @@
-
 (function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
-export * from '../dist/esm/polyfills/index.js';
-export * from '../dist/esm/loader.js';
+export * from '../dist/esm/loader.js';

loader/package.json

 {
   "name": "bonus-elevate-shop-item-loader",
+  "private": true,
   "typings": "./index.d.ts",
@@ -4,0 +5,0 @@ "module": "./index.js",

package.json

 {
   "name": "@everymatrix/bonus-elevate-shop-item",
-  "version": "1.44.0",
+  "version": "1.45.0",
   "main": "./dist/index.cjs.js",
@@ -11,3 +11,10 @@ "module": "./dist/index.js",
   "collection:main": "./dist/collection/index.js",
-  "unpkg": "./dist/bonus-elevate-shop-item/bonus-elevate-shop-item.js",
+  "unpkg": "./dist/bonus-elevate-shop-item/bonus-elevate-shop-item.esm.js",
+  "exports": {
+    ".": {
+      "import": "./dist/esm/bonus-elevate-shop-item.js",
+      "require": "./dist/cjs/bonus-elevate-shop-item.cjs"
+    },
+    "./dist/cjs/bonus-elevate-shop-item.cjs.js": "./dist/cjs/bonus-elevate-shop-item.cjs.js"
+  },
   "files": [
@@ -17,8 +24,8 @@ "dist/",
   ],
-  "dependencies": {
-    "@everymatrix/general-styling-wrapper": "^1.32.4"
-  },
   "publishConfig": {
     "access": "public"
+  },
+  "dependencies": {
+    "@everymatrix/general-styling-wrapper": "1.0.72"
   }
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

19

decreased by-24%

Worsened metrics

Total package byte prevSize

305788

decreased by-33.58%

Number of package files

48

decreased by-14.29%

Lines of code

7060

decreased by-14.2%

Dependency changes

• + Added@everymatrix/general-styling-wrapper@1.0.72(transitive)

• - Removed@everymatrix/general-styling-wrapper@1.50.1(transitive)

• Updated@everymatrix/general-styling-wrapper@1.0.72