@everymatrix/casino-challenges-overlay 0.8.2 → 0.8.4

package/dist/collection/components/casino-challenges-overlay/casino-challenges-overlay.js

@@ -9,6 +9,24 @@ import "../../../../../casino-challenges-overlay-modal/dist/types/index";
 export class CasinoChallengesOverlay {
     constructor() {
         this.activeTabIndex = 0;
+        this.updateChallengesArray = (challengeId, isEnabled, isExpired) => {
+            this.challenges = this.challenges.map((challenge) => {
+                if (challenge.ChallengeId !== challengeId) {
+                    return challenge;
+                }
+                if (isEnabled === true) {
+                    return Object.assign(Object.assign({}, challenge), { Status: EChallengeProgressStatus.InProgress });
+                }
+                return Object.assign(Object.assign({}, challenge), { Status: isExpired ? EChallengeProgressStatus.Expired : EChallengeProgressStatus.Forfeited });
+            });
+        };
+        this.closeModal = () => {
+            this.showModal = false;
+            this.modalOrderNumber = 1;
+            this.modalErrored = false;
+            this.modalReward = '';
+            this.modalAddition = false;
+        };
         this.goToDetailsPage = () => {
             window.postMessage({
                 type: 'GoToDetailsPage',
@@ -34,14 +52,10 @@ export class CasinoChallengesOverlay {
         this.completedLevelId = '';
         this.prevUpdateEvent = undefined;
         this.showModal = false;
-        this.modalTitle = '';
-        this.modalSubTitle = '';
-        this.modalBtnText = '';
-        this.modalShowIcon = true;
+        this.modalErrored = false;
         this.modalReward = '';
-        this.modalAddition = '';
-        this.modalAdditionLink = '';
-        this.modalAdditionText = '';
+        this.modalAddition = false;
+        this.modalOrderNumber = 1;
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -61,13 +75,19 @@ export class CasinoChallengesOverlay {
     handleChallengesChange(newValue) {
         if (Array.isArray(newValue)) {
             let maxPercentage = 0;
-            const filteredChallenges = (newValue === null || newValue === void 0 ? void 0 : newValue.filter((x) => x.Status === EChallengeProgressStatus.InProgress || x.Status === EChallengeProgressStatus.PendingLevelReward)) || [];
+            const now = Date.now();
+            const filteredChallenges = (newValue !== null && newValue !== void 0 ? newValue : []).filter((x) => {
+                const expirationTime = new Date(x.ExpirationTime).getTime();
+                return (expirationTime > now &&
+                    [EChallengeProgressStatus.InProgress, EChallengeProgressStatus.PendingLevelReward].includes(x.Status));
+            });
             for (const challenge of filteredChallenges) {
                 for (const level of challenge.LevelProgresses) {
                     if (level.ProgressStatus === EChallengeProgressLevelStatus.InProgress) {
                         if (level.ProgressPercentage >= maxPercentage) {
                             maxPercentage = level.ProgressPercentage;
                             this.activeChallenge = challenge.ChallengeId;
+                            this.isGrayed = false;
                         }
                     }
                 }
@@ -77,7 +97,7 @@ export class CasinoChallengesOverlay {
         }
     }
     handleEvent(e) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         const { type, data } = e === null || e === void 0 ? void 0 : e.data;
         switch (type) {
             case 'UpdateChallengeProgress': {
@@ -126,27 +146,17 @@ export class CasinoChallengesOverlay {
             case 'ShowChallengeRewardModal': {
                 this.showModal = true;
                 if (data === null || data === void 0 ? void 0 : data.HasError) {
-                    this.modalTitle = translate('errorTitle', this.language);
-                    this.modalSubTitle = translate('errorSubTitle', this.language);
-                    this.modalBtnText = translate('errorBtnText', this.language);
-                    this.modalShowIcon = false;
+                    this.modalErrored = true;
                 }
                 else {
-                    const completedLevel = (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.flatMap((x) => x.LevelProgresses || [])) === null || _c === void 0 ? void 0 : _c.find((level) => level.LevelId === (data === null || data === void 0 ? void 0 : data.LevelId));
+                    this.modalErrored = false;
+                    const completedLevel = (_d = (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.find(({ Id }) => Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId))) === null || _c === void 0 ? void 0 : _c.LevelProgresses.find(({ LevelId }) => LevelId === (data === null || data === void 0 ? void 0 : data.LevelId))) !== null && _d !== void 0 ? _d : null;
                     if (!completedLevel) {
                         return this.closeModal();
                     }
-                    this.modalSubTitle =
-                        translate('level', this.language) +
-                            ` ${(completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.OrderNumber) + 1} ` +
-                            translate('completed', this.language);
-                    this.modalReward =
-                        completedLevel.Rewards.map((reward) => reward.RewardDescription).join(' + ') ||
-                            completedLevel.CustomRewardMessage;
-                    if (completedLevel.Rewards.some((x) => x.Type === EChallengeRewardType.Custom)) {
-                        this.modalAddition = translate('physicalReward', this.language);
-                        this.modalAdditionText = translate('linkText', this.language);
-                    }
+                    this.modalOrderNumber = (completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.OrderNumber) + 1;
+                    this.modalReward = completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.CustomRewardMessage;
+                    this.modalAddition = (_e = completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.Rewards) === null || _e === void 0 ? void 0 : _e.some((x) => x.Type === EChallengeRewardType.Custom);
                 }
                 break;
             }
@@ -154,7 +164,7 @@ export class CasinoChallengesOverlay {
                 this.handleStatusEvent(data);
             }
             case 'ChangeChallengeProgressStatus': {
-                this.challenges = (_d = this.challenges) === null || _d === void 0 ? void 0 : _d.map((x) => x.Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId) ? Object.assign(Object.assign({}, x), { Status: data === null || data === void 0 ? void 0 : data.ChallengeProgressStatus }) : x);
+                this.challenges = (_f = this.challenges) === null || _f === void 0 ? void 0 : _f.map((x) => x.Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId) ? Object.assign(Object.assign({}, x), { Status: data === null || data === void 0 ? void 0 : data.ChallengeProgressStatus }) : x);
             }
         }
     }
@@ -176,37 +186,26 @@ export class CasinoChallengesOverlay {
         }
         return false;
     }
-    handleStatusEvent(data) {
-        const newChallenges = [...this.challenges];
-        newChallenges.forEach(({ ChallengeId }, i) => {
-            if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === ChallengeId) {
-                if ((data === null || data === void 0 ? void 0 : data.IsEnabled) === true) {
-                    newChallenges[i] = Object.assign(Object.assign({}, newChallenges[i]), { Status: EChallengeProgressStatus.InProgress });
-                    this.challenges = newChallenges;
-                    return;
-                }
-                else {
-                    newChallenges[i] = Object.assign(Object.assign({}, newChallenges[i]), { Status: EChallengeProgressStatus.Forfeited });
-                }
-            }
-        });
+    handleStatusEvent(data, isExpired) {
         if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === this.activeChallenge) {
             this.isNotification = true;
             if (this.inProgressCount === 1) {
                 setTimeout(() => {
-                    this.isGrayed = true;
+                    if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === this.activeChallenge) {
+                        this.isGrayed = true;
+                    }
                     this.isNotification = false;
                 }, 10000);
             }
             else if (this.inProgressCount > 1) {
                 setTimeout(() => {
-                    this.challenges = newChallenges;
+                    this.updateChallengesArray(data === null || data === void 0 ? void 0 : data.ChallengeId, data === null || data === void 0 ? void 0 : data.IsEnabled, isExpired);
                     this.isNotification = false;
                 }, 10000);
             }
         }
         else {
-            this.challenges = newChallenges;
+            this.updateChallengesArray(data === null || data === void 0 ? void 0 : data.ChallengeId, data === null || data === void 0 ? void 0 : data.IsEnabled, isExpired);
         }
     }
     componentWillLoad() {
@@ -235,7 +234,7 @@ export class CasinoChallengesOverlay {
                 this.challenges.map((item) => {
                     const expirationTime = new Date(item.ExpirationTime).getTime();
                     if (item.Status !== EChallengeProgressStatus.Expired && expirationTime <= now) {
-                        this.handleStatusEvent({ ChallengeId: item.ChallengeId });
+                        this.handleStatusEvent({ ChallengeId: item.ChallengeId }, true);
                     }
                     return item;
                 });
@@ -324,16 +323,6 @@ export class CasinoChallengesOverlay {
             return h("img", { class: "icon", src: icon });
         return h("div", { class: "gradient-text" }, this.inProgressCount);
     }
-    closeModal() {
-        this.showModal = false;
-        this.modalTitle = '';
-        this.modalSubTitle = '';
-        this.modalBtnText = '';
-        this.modalShowIcon = true;
-        this.modalReward = '';
-        this.modalAddition = '';
-        this.modalAdditionText = '';
-    }
     /**
      * Called to initialize widget
      * @param config
@@ -347,12 +336,12 @@ export class CasinoChallengesOverlay {
         }
         const currProgress = this.completedLevelId ? 100 : this.progress;
         const dot = this.getCapsuleDotPosition(currProgress);
-        return (h("div", { class: "container", onClick: this.goToDetailsPage }, h("div", { class: `circle ${this.isGrayed ? 'grayed' : ''}`, style: {
+        return (h("div", { ref: (el) => (this.stylingContainer = el) }, h("div", { class: "container", onClick: this.goToDetailsPage }, h("div", { class: `circle ${this.isGrayed ? 'grayed' : ''}`, style: {
                 '--progress': `${currProgress}%`
             } }, h("img", { class: "circle__img", src: bgIcon }), h("div", { class: "circle__content" }, h("span", null, Math.floor(currProgress), "%")), dot && (h("div", { class: "dot", style: {
                 left: `${dot.x}px`,
                 top: `${dot.y}px`
-            } }))), !this.isGrayed && h("div", { class: `badge ${this.isNew ? 'new' : ''}` }, this.renderBadgeContent()), h("casino-challenges-overlay-modal", { isOpen: this.showModal, handleClick: () => this.closeModal(), header: this.modalTitle, subtitle: this.modalSubTitle, actionText: this.modalBtnText, showIcon: this.modalShowIcon, reward: this.modalReward, addition: this.modalAddition, additionLinkText: this.modalAdditionText, additionLinkUrl: this.modalAdditionText })));
+            } }))), !this.isGrayed && h("div", { class: `badge ${this.isNew ? 'new' : ''}` }, this.renderBadgeContent())), h("casino-challenges-overlay-modal", { isOpen: this.showModal, handleClick: this.closeModal, reward: this.modalReward, addition: this.modalAddition, errored: this.modalErrored, orderNumber: this.modalOrderNumber })));
     }
     static get is() { return "casino-challenges-overlay"; }
     static get encapsulation() { return "shadow"; }
@@ -490,14 +479,10 @@ export class CasinoChallengesOverlay {
             "completedLevelId": {},
             "prevUpdateEvent": {},
             "showModal": {},
-            "modalTitle": {},
-            "modalSubTitle": {},
-            "modalBtnText": {},
-            "modalShowIcon": {},
+            "modalErrored": {},
             "modalReward": {},
             "modalAddition": {},
-            "modalAdditionLink": {},
-            "modalAdditionText": {}
+            "modalOrderNumber": {}
         };
     }
     static get methods() {

package/dist/esm/{casino-challenges-overlay-31a3a3c8.js → casino-challenges-overlay-1cfb642b.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-2a6b741f.js';
+import { r as registerInstance, h } from './index-4cb6ae8e.js';
 
 /**
  * @name setClientStyling
@@ -156,6 +156,24 @@ const CasinoChallengesOverlay = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.activeTabIndex = 0;
+        this.updateChallengesArray = (challengeId, isEnabled, isExpired) => {
+            this.challenges = this.challenges.map((challenge) => {
+                if (challenge.ChallengeId !== challengeId) {
+                    return challenge;
+                }
+                if (isEnabled === true) {
+                    return Object.assign(Object.assign({}, challenge), { Status: EChallengeProgressStatus.InProgress });
+                }
+                return Object.assign(Object.assign({}, challenge), { Status: isExpired ? EChallengeProgressStatus.Expired : EChallengeProgressStatus.Forfeited });
+            });
+        };
+        this.closeModal = () => {
+            this.showModal = false;
+            this.modalOrderNumber = 1;
+            this.modalErrored = false;
+            this.modalReward = '';
+            this.modalAddition = false;
+        };
         this.goToDetailsPage = () => {
             window.postMessage({
                 type: 'GoToDetailsPage',
@@ -181,14 +199,10 @@ const CasinoChallengesOverlay = class {
         this.completedLevelId = '';
         this.prevUpdateEvent = undefined;
         this.showModal = false;
-        this.modalTitle = '';
-        this.modalSubTitle = '';
-        this.modalBtnText = '';
-        this.modalShowIcon = true;
+        this.modalErrored = false;
         this.modalReward = '';
-        this.modalAddition = '';
-        this.modalAdditionLink = '';
-        this.modalAdditionText = '';
+        this.modalAddition = false;
+        this.modalOrderNumber = 1;
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -208,13 +222,19 @@ const CasinoChallengesOverlay = class {
     handleChallengesChange(newValue) {
         if (Array.isArray(newValue)) {
             let maxPercentage = 0;
-            const filteredChallenges = (newValue === null || newValue === void 0 ? void 0 : newValue.filter((x) => x.Status === EChallengeProgressStatus.InProgress || x.Status === EChallengeProgressStatus.PendingLevelReward)) || [];
+            const now = Date.now();
+            const filteredChallenges = (newValue !== null && newValue !== void 0 ? newValue : []).filter((x) => {
+                const expirationTime = new Date(x.ExpirationTime).getTime();
+                return (expirationTime > now &&
+                    [EChallengeProgressStatus.InProgress, EChallengeProgressStatus.PendingLevelReward].includes(x.Status));
+            });
             for (const challenge of filteredChallenges) {
                 for (const level of challenge.LevelProgresses) {
                     if (level.ProgressStatus === EChallengeProgressLevelStatus.InProgress) {
                         if (level.ProgressPercentage >= maxPercentage) {
                             maxPercentage = level.ProgressPercentage;
                             this.activeChallenge = challenge.ChallengeId;
+                            this.isGrayed = false;
                         }
                     }
                 }
@@ -224,7 +244,7 @@ const CasinoChallengesOverlay = class {
         }
     }
     handleEvent(e) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         const { type, data } = e === null || e === void 0 ? void 0 : e.data;
         switch (type) {
             case 'UpdateChallengeProgress': {
@@ -273,27 +293,17 @@ const CasinoChallengesOverlay = class {
             case 'ShowChallengeRewardModal': {
                 this.showModal = true;
                 if (data === null || data === void 0 ? void 0 : data.HasError) {
-                    this.modalTitle = translate('errorTitle', this.language);
-                    this.modalSubTitle = translate('errorSubTitle', this.language);
-                    this.modalBtnText = translate('errorBtnText', this.language);
-                    this.modalShowIcon = false;
+                    this.modalErrored = true;
                 }
                 else {
-                    const completedLevel = (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.flatMap((x) => x.LevelProgresses || [])) === null || _c === void 0 ? void 0 : _c.find((level) => level.LevelId === (data === null || data === void 0 ? void 0 : data.LevelId));
+                    this.modalErrored = false;
+                    const completedLevel = (_d = (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.find(({ Id }) => Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId))) === null || _c === void 0 ? void 0 : _c.LevelProgresses.find(({ LevelId }) => LevelId === (data === null || data === void 0 ? void 0 : data.LevelId))) !== null && _d !== void 0 ? _d : null;
                     if (!completedLevel) {
                         return this.closeModal();
                     }
-                    this.modalSubTitle =
-                        translate('level', this.language) +
-                            ` ${(completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.OrderNumber) + 1} ` +
-                            translate('completed', this.language);
-                    this.modalReward =
-                        completedLevel.Rewards.map((reward) => reward.RewardDescription).join(' + ') ||
-                            completedLevel.CustomRewardMessage;
-                    if (completedLevel.Rewards.some((x) => x.Type === EChallengeRewardType.Custom)) {
-                        this.modalAddition = translate('physicalReward', this.language);
-                        this.modalAdditionText = translate('linkText', this.language);
-                    }
+                    this.modalOrderNumber = (completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.OrderNumber) + 1;
+                    this.modalReward = completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.CustomRewardMessage;
+                    this.modalAddition = (_e = completedLevel === null || completedLevel === void 0 ? void 0 : completedLevel.Rewards) === null || _e === void 0 ? void 0 : _e.some((x) => x.Type === EChallengeRewardType.Custom);
                 }
                 break;
             }
@@ -301,7 +311,7 @@ const CasinoChallengesOverlay = class {
                 this.handleStatusEvent(data);
             }
             case 'ChangeChallengeProgressStatus': {
-                this.challenges = (_d = this.challenges) === null || _d === void 0 ? void 0 : _d.map((x) => x.Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId) ? Object.assign(Object.assign({}, x), { Status: data === null || data === void 0 ? void 0 : data.ChallengeProgressStatus }) : x);
+                this.challenges = (_f = this.challenges) === null || _f === void 0 ? void 0 : _f.map((x) => x.Id === (data === null || data === void 0 ? void 0 : data.ChallengeProgressId) ? Object.assign(Object.assign({}, x), { Status: data === null || data === void 0 ? void 0 : data.ChallengeProgressStatus }) : x);
             }
         }
     }
@@ -323,37 +333,26 @@ const CasinoChallengesOverlay = class {
         }
         return false;
     }
-    handleStatusEvent(data) {
-        const newChallenges = [...this.challenges];
-        newChallenges.forEach(({ ChallengeId }, i) => {
-            if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === ChallengeId) {
-                if ((data === null || data === void 0 ? void 0 : data.IsEnabled) === true) {
-                    newChallenges[i] = Object.assign(Object.assign({}, newChallenges[i]), { Status: EChallengeProgressStatus.InProgress });
-                    this.challenges = newChallenges;
-                    return;
-                }
-                else {
-                    newChallenges[i] = Object.assign(Object.assign({}, newChallenges[i]), { Status: EChallengeProgressStatus.Forfeited });
-                }
-            }
-        });
+    handleStatusEvent(data, isExpired) {
         if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === this.activeChallenge) {
             this.isNotification = true;
             if (this.inProgressCount === 1) {
                 setTimeout(() => {
-                    this.isGrayed = true;
+                    if ((data === null || data === void 0 ? void 0 : data.ChallengeId) === this.activeChallenge) {
+                        this.isGrayed = true;
+                    }
                     this.isNotification = false;
                 }, 10000);
             }
             else if (this.inProgressCount > 1) {
                 setTimeout(() => {
-                    this.challenges = newChallenges;
+                    this.updateChallengesArray(data === null || data === void 0 ? void 0 : data.ChallengeId, data === null || data === void 0 ? void 0 : data.IsEnabled, isExpired);
                     this.isNotification = false;
                 }, 10000);
             }
         }
         else {
-            this.challenges = newChallenges;
+            this.updateChallengesArray(data === null || data === void 0 ? void 0 : data.ChallengeId, data === null || data === void 0 ? void 0 : data.IsEnabled, isExpired);
         }
     }
     componentWillLoad() {
@@ -382,7 +381,7 @@ const CasinoChallengesOverlay = class {
                 this.challenges.map((item) => {
                     const expirationTime = new Date(item.ExpirationTime).getTime();
                     if (item.Status !== EChallengeProgressStatus.Expired && expirationTime <= now) {
-                        this.handleStatusEvent({ ChallengeId: item.ChallengeId });
+                        this.handleStatusEvent({ ChallengeId: item.ChallengeId }, true);
                     }
                     return item;
                 });
@@ -471,16 +470,6 @@ const CasinoChallengesOverlay = class {
             return h("img", { class: "icon", src: icon });
         return h("div", { class: "gradient-text" }, this.inProgressCount);
     }
-    closeModal() {
-        this.showModal = false;
-        this.modalTitle = '';
-        this.modalSubTitle = '';
-        this.modalBtnText = '';
-        this.modalShowIcon = true;
-        this.modalReward = '';
-        this.modalAddition = '';
-        this.modalAdditionText = '';
-    }
     /**
      * Called to initialize widget
      * @param config
@@ -494,12 +483,12 @@ const CasinoChallengesOverlay = class {
         }
         const currProgress = this.completedLevelId ? 100 : this.progress;
         const dot = this.getCapsuleDotPosition(currProgress);
-        return (h("div", { class: "container", onClick: this.goToDetailsPage }, h("div", { class: `circle ${this.isGrayed ? 'grayed' : ''}`, style: {
+        return (h("div", { ref: (el) => (this.stylingContainer = el) }, h("div", { class: "container", onClick: this.goToDetailsPage }, h("div", { class: `circle ${this.isGrayed ? 'grayed' : ''}`, style: {
                 '--progress': `${currProgress}%`
             } }, h("img", { class: "circle__img", src: bgIconSvg }), h("div", { class: "circle__content" }, h("span", null, Math.floor(currProgress), "%")), dot && (h("div", { class: "dot", style: {
                 left: `${dot.x}px`,
                 top: `${dot.y}px`
-            } }))), !this.isGrayed && h("div", { class: `badge ${this.isNew ? 'new' : ''}` }, this.renderBadgeContent()), h("casino-challenges-overlay-modal", { isOpen: this.showModal, handleClick: () => this.closeModal(), header: this.modalTitle, subtitle: this.modalSubTitle, actionText: this.modalBtnText, showIcon: this.modalShowIcon, reward: this.modalReward, addition: this.modalAddition, additionLinkText: this.modalAdditionText, additionLinkUrl: this.modalAdditionText })));
+            } }))), !this.isGrayed && h("div", { class: `badge ${this.isNew ? 'new' : ''}` }, this.renderBadgeContent())), h("casino-challenges-overlay-modal", { isOpen: this.showModal, handleClick: this.closeModal, reward: this.modalReward, addition: this.modalAddition, errored: this.modalErrored, orderNumber: this.modalOrderNumber })));
     }
     static get watchers() { return {
         "clientStyling": ["handleClientStylingChange"],

package/dist/esm/casino-challenges-overlay.js

@@ -1,5 +1,5 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-2a6b741f.js';
-export { s as setNonce } from './index-2a6b741f.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-4cb6ae8e.js';
+export { s as setNonce } from './index-4cb6ae8e.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["casino-challenges-overlay_2",[[1,"casino-challenges-overlay",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenges":[16],"progress":[32],"isGrayed":[32],"isNew":[32],"isGift":[32],"isNotification":[32],"inProgressCount":[32],"activeChallenge":[32],"completedLevelId":[32],"prevUpdateEvent":[32],"showModal":[32],"modalTitle":[32],"modalSubTitle":[32],"modalBtnText":[32],"modalShowIcon":[32],"modalReward":[32],"modalAddition":[32],"modalAdditionLink":[32],"modalAdditionText":[32],"init":[64]},[[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[1],"isOpen":[4,"is-open"],"showIcon":[4,"show-icon"],"showButton":[4,"show-button"],"header":[1],"subtitle":[1],"reward":[1],"addition":[1],"additionLinkUrl":[1,"addition-link-url"],"additionLinkText":[1,"addition-link-text"],"actionText":[1,"action-text"],"translationUrl":[513,"translation-url"],"handleClick":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
+  return bootstrapLazy([["casino-challenges-overlay_2",[[1,"casino-challenges-overlay",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenges":[16],"progress":[32],"isGrayed":[32],"isNew":[32],"isGift":[32],"isNotification":[32],"inProgressCount":[32],"activeChallenge":[32],"completedLevelId":[32],"prevUpdateEvent":[32],"showModal":[32],"modalErrored":[32],"modalReward":[32],"modalAddition":[32],"modalOrderNumber":[32],"init":[64]},[[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"reward":[513],"addition":[516],"handleClick":[16],"errored":[516],"orderNumber":[514,"order-number"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
 });

package/dist/esm/casino-challenges-overlay_2.entry.js

@@ -1,6 +1,6 @@
-import { s as setClientStyling, a as setClientStylingURL, b as setStreamStyling } from './casino-challenges-overlay-31a3a3c8.js';
-export { C as casino_challenges_overlay } from './casino-challenges-overlay-31a3a3c8.js';
-import { r as registerInstance, h } from './index-2a6b741f.js';
+import { s as setClientStyling, a as setClientStylingURL, b as setStreamStyling } from './casino-challenges-overlay-1cfb642b.js';
+export { C as casino_challenges_overlay } from './casino-challenges-overlay-1cfb642b.js';
+import { r as registerInstance, h } from './index-4cb6ae8e.js';
 
 const giftboxSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMyIgdmlld0JveD0iMCAwIDIyIDIzIiBmaWxsPSJub25lIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcuNDY0MjkgMi41QzcuMjE0NDIgMi41IDYuOTcxMDYgMi42MDA5IDYuNzg4NzggMi43ODY0OUM2LjYwNTkgMi45NzI3IDYuNTAwMDEgMy4yMjkwMyA2LjUwMDAxIDMuNUM2LjUwMDAxIDMuNzcwOTcgNi42MDU5IDQuMDI3MyA2Ljc4ODc4IDQuMjEzNTFDNi45NzEwNiA0LjM5OTEgNy4yMTQ0MiA0LjUgNy40NjQyOSA0LjVIOS42MzQyNUM5LjU2MTg3IDQuMzI4NjUgOS40Nzg1NyA0LjE1MTE2IDkuMzgzNTYgMy45NzUyN0M4Ljg5NzY5IDMuMDc1ODEgOC4yNzM5OCAyLjUgNy40NjQyOSAyLjVaTTEwIDYuNVY5LjVMMi42MDAwMSA5LjVDMi4zMDM0OCA5LjUgMi4xNDEyMiA5LjQ5OTIyIDIuMDI0NjQgOS40ODk3QzIuMDIgOS40ODkzMiAyLjAxNTYgOS40ODg5MyAyLjAxMTQ1IDkuNDg4NTVDMi4wMTEwNyA5LjQ4NDQgMi4wMTA2OSA5LjQ4MDAxIDIuMDEwMzEgOS40NzUzN0MyLjAwMDc4IDkuMzU4NzggMi4wMDAwMSA5LjE5NjUzIDIuMDAwMDEgOC45VjcuMUMyLjAwMDAxIDYuODAzNDcgMi4wMDA3OCA2LjY0MTIyIDIuMDEwMzEgNi41MjQ2M0MyLjAxMDY5IDYuNTE5OTkgMi4wMTEwNyA2LjUxNTYgMi4wMTE0NSA2LjUxMTQ1QzIuMDE1NiA2LjUxMTA3IDIuMDIgNi41MTA2OCAyLjAyNDY0IDYuNTEwM0MyLjE0MTIyIDYuNTAwNzggMi4zMDM0OCA2LjUgMi42MDAwMSA2LjVIMTBaTTQuNjY5NTMgNC41QzQuNTU4MjIgNC4xODEzMyA0LjUwMDAxIDMuODQzMzkgNC41MDAwMSAzLjVDNC41MDAwMSAyLjcxMDExIDQuODA4MDIgMS45NDkwMiA1LjM2MTg4IDEuMzg1MDhDNS45MTYzNSAwLjgyMDUzMSA2LjY3MjI0IDAuNSA3LjQ2NDI5IDAuNUM5LjI1OSAwLjUgMTAuMzcyNSAxLjcxODQ1IDExIDIuNzcyMjNDMTEuNjI3NSAxLjcxODQ1IDEyLjc0MSAwLjUgMTQuNTM1NyAwLjVDMTUuMzI3OCAwLjUgMTYuMDgzNyAwLjgyMDUzMSAxNi42MzgxIDEuMzg1MDhDMTcuMTkyIDEuOTQ5MDIgMTcuNSAyLjcxMDExIDE3LjUgMy41QzE3LjUgMy44NDMzOSAxNy40NDE4IDQuMTgxMzMgMTcuMzMwNSA0LjVMMTkuNDMxOSA0LjVDMTkuNjg0MyA0LjQ5OTk3IDE5LjkzMDEgNC40OTk5NCAyMC4xMzgyIDQuNTE2OTVDMjAuMzY2OCA0LjUzNTYyIDIwLjYzNjYgNC41Nzk2OSAyMC45MDggNC43MTc5OUMyMS4yODQzIDQuOTA5NzMgMjEuNTkwMyA1LjIxNTcgMjEuNzgyIDUuNTkyMDJDMjEuOTIwMyA1Ljg2MzQ0IDIxLjk2NDQgNi4xMzMxOCAyMS45ODMxIDYuMzYxNzdDMjIuMDAwMSA2LjU2OTkyIDIyIDYuODE1NzEgMjIgNy4wNjgwOFY4LjkzMTkyQzIyIDkuMTg0MjkgMjIuMDAwMSA5LjQzMDA4IDIxLjk4MzEgOS42MzgyM0MyMS45NjQ0IDkuODY2ODIgMjEuOTIwMyAxMC4xMzY2IDIxLjc4MiAxMC40MDhDMjEuNTkwMyAxMC43ODQzIDIxLjI4NDMgMTEuMDkwMyAyMC45MDggMTEuMjgyQzIwLjYzNjYgMTEuNDIwMyAyMC4zNjY4IDExLjQ2NDQgMjAuMTM4MiAxMS40ODMxQzIwLjA5MzggMTEuNDg2NyAyMC4wNDc2IDExLjQ4OTUgMjAgMTEuNDkxOFYxOC4zMzg2QzIwIDE4Ljg2NTcgMjAgMTkuMzIwNSAxOS45Njk0IDE5LjY5NUMxOS45MzcxIDIwLjA5MDQgMTkuODY1OCAyMC40ODM2IDE5LjY3MyAyMC44NjJDMTkuMzg1NCAyMS40MjY1IDE4LjkyNjUgMjEuODg1NCAxOC4zNjIgMjIuMTczQzE3Ljk4MzYgMjIuMzY1OCAxNy41OTA0IDIyLjQzNzEgMTcuMTk1IDIyLjQ2OTRDMTYuODIwNSAyMi41IDE2LjM2NTcgMjIuNSAxNS44Mzg2IDIyLjVIMTEuMDAxNEgxMUwxMC45OTg2IDIyLjVINi4xNjE0NEM1LjYzNDMgMjIuNSA1LjE3OTU0IDIyLjUgNC44MDQ5OCAyMi40Njk0QzQuNDA5NjMgMjIuNDM3MSA0LjAxNjQxIDIyLjM2NTggMy42MzgwMyAyMi4xNzNDMy4wNzM1NSAyMS44ODU0IDIuNjE0NiAyMS40MjY1IDIuMzI2OTkgMjAuODYyQzIuMTM0MTkgMjAuNDgzNiAyLjA2Mjg4IDIwLjA5MDQgMi4wMzA1NyAxOS42OTVDMS45OTk5NyAxOS4zMjA1IDEuOTk5OTkgMTguODY1NyAyIDE4LjMzODVMMi4wMDAwMSAxMS40OTE4QzEuOTUyNDEgMTEuNDg5NSAxLjkwNjI0IDExLjQ4NjcgMS44NjE3OCAxMS40ODMxQzEuNjMzMTggMTEuNDY0NCAxLjM2MzQ1IDExLjQyMDMgMS4wOTIwMiAxMS4yODJDMC43MTU3MDEgMTEuMDkwMyAwLjQwOTczOSAxMC43ODQzIDAuMjE3OTkyIDEwLjQwOEMwLjA3OTY5NDcgMTAuMTM2NiAwLjAzNTYyNzEgOS44NjY4MiAwLjAxNjk1MDQgOS42MzgyM0MtNS42ODYxZS0wNSA5LjQzMDA3IC0yLjc0MTYxZS0wNSA5LjE4NDI4IDIuNTA1NDRlLTA2IDguOTMxOUw1LjI0NzI2ZS0wNiA3LjFDNS4yNDcyNmUtMDYgNy4wODkzNiAzLjkzNTk1ZS0wNiA3LjA3ODcyIDIuNjI0NjVlLTA2IDcuMDY4MUMtMi43Mjk2OWUtMDUgNi44MTU3MiAtNS42NzQxOGUtMDUgNi41Njk5MyAwLjAxNjk1MDUgNi4zNjE3N0MwLjAzNTYyNzQgNi4xMzMxOCAwLjA3OTY5NSA1Ljg2MzQ0IDAuMjE3OTkyIDUuNTkyMDJDMC40MDk3MzkgNS4yMTU2OSAwLjcxNTcgNC45MDk3MyAxLjA5MjAyIDQuNzE3OTlDMS4zNjM0NSA0LjU3OTY5IDEuNjMzMTggNC41MzU2MiAxLjg2MTc4IDQuNTE2OTVDMi4wNjk5MyA0LjQ5OTk0IDIuMzE1NzMgNC40OTk5NyAyLjU2ODExIDQuNUMyLjU3ODczIDQuNSAyLjU4OTM2IDQuNSAyLjYwMDAxIDQuNUg0LjY2OTUzWk00LjAwMDAxIDExLjVWMTguM0M0LjAwMDAxIDE4Ljg3NjYgNC4wMDA3OCAxOS4yNDg4IDQuMDIzOTMgMTkuNTMyMkM0LjA0NjEzIDE5LjgwMzggNC4wODM4MSAxOS45MDQ1IDQuMTA5IDE5Ljk1NEM0LjIwNDg3IDIwLjE0MjEgNC4zNTc4NSAyMC4yOTUxIDQuNTQ2MDEgMjAuMzkxQzQuNTk1NDYgMjAuNDE2MiA0LjY5NjE4IDIwLjQ1MzkgNC45Njc4NCAyMC40NzYxQzUuMjUxMTggMjAuNDk5MiA1LjYyMzQ1IDIwLjUgNi4yMDAwMSAyMC41SDEwVjExLjVINC4wMDAwMVpNMTIgMTEuNVYyMC41SDE1LjhDMTYuMzc2NiAyMC41IDE2Ljc0ODggMjAuNDk5MiAxNy4wMzIyIDIwLjQ3NjFDMTcuMzAzOCAyMC40NTM5IDE3LjQwNDYgMjAuNDE2MiAxNy40NTQgMjAuMzkxQzE3LjY0MjIgMjAuMjk1MSAxNy43OTUxIDIwLjE0MjIgMTcuODkxIDE5Ljk1NEMxNy45MTYyIDE5LjkwNDUgMTcuOTUzOSAxOS44MDM4IDE3Ljk3NjEgMTkuNTMyMkMxNy45OTkyIDE5LjI0ODggMTggMTguODc2NiAxOCAxOC4zVjExLjVIMTJaTTE5LjQgOS41QzE5LjY5NjUgOS41IDE5Ljg1ODggOS40OTkyMiAxOS45NzU0IDkuNDg5N0MxOS45OCA5LjQ4OTMyIDE5Ljk4NDQgOS40ODg5MyAxOS45ODg2IDkuNDg4NTRDMTkuOTg4OSA5LjQ4NDQgMTkuOTg5MyA5LjQ4MDAxIDE5Ljk4OTcgOS40NzUzN0MxOS45OTkyIDkuMzU4NzggMjAgOS4xOTY1MyAyMCA4LjlWNy4xQzIwIDYuODAzNDcgMTkuOTk5MiA2LjY0MTIyIDE5Ljk4OTcgNi41MjQ2M0MxOS45ODkzIDYuNTE5OTkgMTkuOTg4OSA2LjUxNTYgMTkuOTg4NSA2LjUxMTQ1QzE5Ljk4NDQgNi41MTEwNyAxOS45OCA2LjUxMDY4IDE5Ljk3NTQgNi41MTAzQzE5Ljg1ODggNi41MDA3OCAxOS42OTY1IDYuNSAxOS40IDYuNUgxMlY5LjVIMTkuNFpNMTQuNTM1NyA0LjVDMTQuNzg1NiA0LjUgMTUuMDI4OSA0LjM5OTEgMTUuMjExMiA0LjIxMzUxQzE1LjM5NDEgNC4wMjczIDE1LjUgMy43NzA5NyAxNS41IDMuNUMxNS41IDMuMjI5MDMgMTUuMzk0MSAyLjk3MjcgMTUuMjExMiAyLjc4NjQ5QzE1LjAyODkgMi42MDA5IDE0Ljc4NTYgMi41IDE0LjUzNTcgMi41QzEzLjcyNiAyLjUgMTMuMTAyMyAzLjA3NTgxIDEyLjYxNjUgMy45NzUyN0MxMi41MjE0IDQuMTUxMTYgMTIuNDM4MSA0LjMyODY1IDEyLjM2NTggNC41SDE0LjUzNTdaIiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfMjA1MV80MzkpIi8+CiAgPGRlZnM+CiAgICA8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMjA1MV80MzkiIHgxPSIwIiB5MT0iMTEuNSIgeDI9IjIyIiB5Mj0iMTEuNSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgogICAgICA8c3RvcCBzdG9wLWNvbG9yPSIjMUU2NTRGIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzFDOEQ1NiIvPgogICAgPC9saW5lYXJHcmFkaWVudD4KICA8L2RlZnM+Cjwvc3ZnPgo=';
 
@@ -9,6 +9,14 @@ const TRANSLATIONS = {
     en: {
         congrats: 'Congratulations!',
         continue: 'Continue',
+        errorBtnText: 'Ok',
+        errorTitle: 'Reward failed',
+        errorSubTitle: 'Sorry — we couldn’t grant the reward. Please try again.',
+        level: 'Level',
+        completed: 'has been completed!',
+        youWon: 'You have won',
+        physicalReward: 'for physical rewards please contact ',
+        linkText: 'Customer Support'
     }
 };
 const translate = (key, customLang) => {
@@ -41,7 +49,7 @@ const resolveTranslationUrl = async (translationUrl) => {
     }
 };
 
-const casinoChallengesOverlayModalCss = ":host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer;touch-action:manipulation}button:focus{outline:none}.ModalOverlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0);justify-content:center;align-items:center;z-index:1}.ModalOverlay.Open{display:flex}.ModalContent{display:flex;flex-direction:column;align-items:center;position:relative;background:linear-gradient(90deg, var(--emw--color-background, #003E5C) 0.05%, var(--emw--color-background-secondary, #113B21) 87.69%);padding:26px;border-radius:26px;border:2px solid var(--emw--color-primary-variant, #1E654F);width:450px;max-width:90%;text-align:center;max-height:90dvh;min-height:100px}.InnerContainer{border-radius:20px;background:#F9F8F8;padding:25px;width:100%}.ImageWrapper{margin-bottom:6px}.ModalHeader{color:var(--emw--color-typography, #212529);text-align:center;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);margin:0 0 10px;font-size:16px;font-style:normal;font-weight:700;line-height:normal;text-transform:uppercase;letter-spacing:1px}.ModalSubtitle{color:var(--emw--color-gray-300, #212529);text-align:center;font-family:\"Roboto\", sans-serif;font-size:14px;font-style:normal;font-weight:400;margin-bottom:10px}.ModalReward{background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);font-size:14px;font-style:normal;font-weight:700;margin-bottom:10px}.ModalAddition{color:var(--emw--color-gray-100, #727672);text-align:center;font-family:var(--emw--button-typography, \"Roboto\", sans-serif);font-size:12px;font-style:normal;font-weight:400;margin-bottom:10px}.ModalAddition a{background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:12px;font-style:normal;font-weight:700;line-height:15px;text-decoration:none;margin-left:8px}.ModalAction{border-radius:var(--emw--button-border-radius, 99px);border:2px solid var(--emw--button-border-color, #083B17);background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);padding:9px 20px;margin-top:20px;text-transform:uppercase;color:var(--emw--button-text-color, #FFF);text-align:center;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);font-size:12px;font-style:normal;font-weight:700;letter-spacing:1px;line-height:1}";
+const casinoChallengesOverlayModalCss = ":host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer;touch-action:manipulation}button:focus{outline:none}.ModalOverlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0);justify-content:center;align-items:center;z-index:1}.ModalOverlay.Open{display:flex}.ModalContent{display:flex;flex-direction:column;align-items:center;position:relative;background:linear-gradient(90deg, var(--emw--color-background, #003E5C) 0.05%, var(--emw--color-background-secondary, #113B21) 87.69%);padding:26px;border-radius:26px;border:2px solid var(--emw--color-primary-variant, #1E654F);width:450px;max-width:90%;text-align:center;max-height:90dvh;min-height:100px;font-family:\"Roboto\", sans-serif}.InnerContainer{border-radius:20px;background:#F9F8F8;padding:25px;width:100%}.ImageWrapper{margin-bottom:6px}.ModalHeader{color:var(--emw--color-typography, #212529);text-align:center;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);font-size:16px;font-style:normal;font-weight:700;line-height:normal;text-transform:uppercase;letter-spacing:1px}.ModalSubtitle{color:var(--emw--color-gray-300, #212529);text-align:center;font-size:var(--emw--font-size-small, 14px);font-style:normal;font-weight:400;margin:16px 0 10px;line-height:22px}.ErrorMessage{font-size:var(--emw--font-size-medium, 16px);line-height:24px;margin:10px 0 10px}.ModalReward{background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);font-size:14px;font-style:normal;font-weight:700;margin-bottom:10px}.ModalAddition{color:var(--emw--color-gray-100, #727672);text-align:center;font-family:var(--emw--button-typography, \"Roboto\", sans-serif);font-size:var(--emw--font-size-x-small, 12px);font-style:normal;font-weight:400;height:39px;align-content:center}.ModalAddition span{background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:12px;font-style:normal;font-weight:700;line-height:15px;text-decoration:none;margin-left:8px;position:relative}.ModalAddition span::after{content:\"\";position:absolute;left:0;bottom:0;height:1px;width:100%;background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%)}.ModalAction{border-radius:var(--emw--button-border-radius, 99px);border:2px solid var(--emw--button-border-color, #083B17);background:linear-gradient(90deg, var(--emw--color-primary, #24AA4D) 0%, var(--emw--color-background-secondary, #113F21) 100%);padding:9px 20px;margin-top:10px;text-transform:uppercase;color:var(--emw--button-text-color, #FFF);text-align:center;font-family:var(--emw--button-typography, \"PF BeauSans Pro\", sans-serif);font-size:12px;font-style:normal;font-weight:700;letter-spacing:1px;line-height:1}";
 const CasinoChallengesOverlayModalStyle0 = casinoChallengesOverlayModalCss;
 
 const CasinoChallengesOverlayModal = class {
@@ -50,19 +58,14 @@ const CasinoChallengesOverlayModal = class {
         this.mbSource = undefined;
         this.clientStyling = undefined;
         this.clientStylingUrl = undefined;
+        this.translationUrl = '';
         this.language = 'en';
         this.isOpen = false;
-        this.showIcon = true;
-        this.showButton = true;
-        this.header = '';
-        this.subtitle = '';
         this.reward = '';
-        this.addition = '';
-        this.additionLinkUrl = '';
-        this.additionLinkText = '';
-        this.actionText = '';
-        this.translationUrl = '';
+        this.addition = false;
         this.handleClick = () => { };
+        this.errored = false;
+        this.orderNumber = 0;
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -98,13 +101,7 @@ const CasinoChallengesOverlayModal = class {
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
     }
     render() {
-        return (h("div", { key: '2824c43ba2f3d5f9d1f4aca77dcdebce527edcb8', ref: (el) => (this.stylingContainer = el), class: `ModalOverlay ${this.isOpen && 'Open'}` }, h("div", { key: '479ba71d1d2c081b3d3cc93f52bd1848e299279b', class: "ModalWinAnimation" }), h("div", { key: 'c0e45b25e7a66438bca3f24dc8e9fd93e1da8b8f', class: "ModalContent GradientBorder" }, h("div", { key: '5d258e3480b8aeec879a15f5d063a8a4295575e0', class: 'InnerContainer' }, this.showIcon &&
-            h("div", { key: '7cfdec9f66854d92adf8dc7f023d7d17fd53ab25', class: "ImageWrapper" }, h("img", { key: '32e1a43bbfbca465b229fe3fd2a47be5ffae14e1', src: giftboxSvg, alt: "gift-box-icon" })), h("h1", { key: '0236d690962bf8e6ec0722061198eebe22993963', class: "ModalHeader", innerHTML: this.header || translate('congrats', this.language) }), this.subtitle &&
-            h("div", { key: 'd76af009535ecf94808bdddc1d39cb5e6eb2ec8f', class: "ModalSubtitle", innerHTML: this.subtitle }), this.reward &&
-            h("div", { key: 'cf41803c33862996e57469dedd8e29c9ce1b03b4', class: "ModalReward", innerHTML: this.reward }), this.addition &&
-            h("div", { key: 'd6907547a7158d7d4e25b8445ce7da061999fb49', class: "ModalAddition" }, h("div", { key: '6d95e449a0988f8a62546ecc411f57253c34d5d7', innerHTML: this.addition }), this.additionLinkUrl && this.additionLinkText &&
-                h("a", { key: '19df109759ff7b92587e8f6a4cd9ec181d2ee694', href: this.additionLinkText }, this.additionLinkText)), this.showButton &&
-            h("button", { key: '290969fe58fff0df3b7f59231151c0a8e5d39cc4', class: "ModalAction", onClick: this.handleClick, innerHTML: this.actionText ? this.actionText : translate("continue", this.language) })))));
+        return (h("div", { key: '6c704266619b5ad109ec6289d65fd6a26f827951', ref: (el) => (this.stylingContainer = el), class: `ModalOverlay ${this.isOpen && 'Open'}` }, h("div", { key: '65b800fd71f65afa246804ff35116bc0f2a6ff6b', class: "ModalWinAnimation" }), h("div", { key: '51df6e0c7d487762f0da0c874805c1e34a520fc2', class: "ModalContent GradientBorder" }, h("div", { key: 'ac9b44635eb8cb1fda4d1a4549c42c5e7055fc18', class: "InnerContainer" }, !this.errored && (h("div", { key: '7b5e93f30b1cb40af1d8f621f13d1e18bb1a06b6', class: "ImageWrapper" }, h("img", { key: '4e7867d129678e327ffc12d1da93b31bef4bc3b8', src: giftboxSvg, alt: "gift-box-icon" }))), h("h1", { key: '05782d9c5b5f905bd726dfbd8a32b51b7993e6c8', class: "ModalHeader" }, translate(this.errored ? 'errorTitle' : 'congrats', this.language)), this.errored ? (h("div", { class: "ErrorMessage" }, translate('errorSubTitle', this.language))) : (h("div", { class: "ModalSubtitle" }, `${translate('level', this.language)} ${this.orderNumber} ${translate('completed', this.language)}`, h("div", null, translate('youWon', this.language)), h("div", { class: "ModalReward" }, this.reward))), this.addition && (h("div", { key: '0776cef4171e90f027069d2fc2032204698ae47d', class: "ModalAddition" }, h("div", { key: '0ffaceb4bb8df0647f77a1c9ddcf2db9c61aa53b' }, translate('physicalReward', this.language)), h("span", { key: '08aec1fec4c84a97a6543ea9e5424c3ce3af40f8' }, translate('linkText', this.language)))), h("button", { key: '5103a3a04995091612a9126a6052f65d96b5bb5f', class: "ModalAction", onClick: this.handleClick }, this.errored ? translate('errorBtnText', this.language) : translate('continue', this.language))))));
     }
     static get watchers() { return {
         "clientStyling": ["handleClientStylingChange"],

package/dist/esm/{index-2a6b741f.js → index-4cb6ae8e.js}

@@ -1,5 +1,5 @@
 const NAMESPACE = 'casino-challenges-overlay';
-const BUILD = /* casino-challenges-overlay */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: false, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: false, propNumber: false, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: true };
+const BUILD = /* casino-challenges-overlay */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: false, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: false, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: true };
 
 /*
  Stencil Client Platform v4.19.2 | MIT Licensed | https://stenciljs.com
@@ -295,6 +295,9 @@ var parsePropertyValue = (propValue, propType) => {
     if (propType & 4 /* Boolean */) {
       return propValue === "false" ? false : propValue === "" || !!propValue;
     }
+    if (propType & 2 /* Number */) {
+      return parseFloat(propValue);
+    }
     if (propType & 1 /* String */) {
       return String(propValue);
     }

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { C as CasinoChallengesOverlay } from './casino-challenges-overlay-31a3a3c8.js';
-import './index-2a6b741f.js';
+export { C as CasinoChallengesOverlay } from './casino-challenges-overlay-1cfb642b.js';
+import './index-4cb6ae8e.js';

package/dist/esm/loader.js

@@ -1,11 +1,11 @@
-import { b as bootstrapLazy } from './index-2a6b741f.js';
-export { s as setNonce } from './index-2a6b741f.js';
+import { b as bootstrapLazy } from './index-4cb6ae8e.js';
+export { s as setNonce } from './index-4cb6ae8e.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["casino-challenges-overlay_2",[[1,"casino-challenges-overlay",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenges":[16],"progress":[32],"isGrayed":[32],"isNew":[32],"isGift":[32],"isNotification":[32],"inProgressCount":[32],"activeChallenge":[32],"completedLevelId":[32],"prevUpdateEvent":[32],"showModal":[32],"modalTitle":[32],"modalSubTitle":[32],"modalBtnText":[32],"modalShowIcon":[32],"modalReward":[32],"modalAddition":[32],"modalAdditionLink":[32],"modalAdditionText":[32],"init":[64]},[[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[1],"isOpen":[4,"is-open"],"showIcon":[4,"show-icon"],"showButton":[4,"show-button"],"header":[1],"subtitle":[1],"reward":[1],"addition":[1],"additionLinkUrl":[1,"addition-link-url"],"additionLinkText":[1,"addition-link-text"],"actionText":[1,"action-text"],"translationUrl":[513,"translation-url"],"handleClick":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
+  return bootstrapLazy([["casino-challenges-overlay_2",[[1,"casino-challenges-overlay",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenges":[16],"progress":[32],"isGrayed":[32],"isNew":[32],"isGift":[32],"isNotification":[32],"inProgressCount":[32],"activeChallenge":[32],"completedLevelId":[32],"prevUpdateEvent":[32],"showModal":[32],"modalErrored":[32],"modalReward":[32],"modalAddition":[32],"modalOrderNumber":[32],"init":[64]},[[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"reward":[513],"addition":[516],"handleClick":[16],"errored":[516],"orderNumber":[514,"order-number"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
 };
 
 export { defineCustomElements };