@everymatrix/casino-challenges-overlay-drawer 0.0.1

package/dist/cjs/casino-challenges-overlay-drawer-ee68086b.js

@@ -0,0 +1,1002 @@
+'use strict';
+
+const index = require('./index-d2288c94.js');
+
+const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
+
+/**
+ * @name setClientStyling
+ * @description Method used to create and append to the passed element of the widget a style element with the content received
+ * @param {HTMLElement} stylingContainer The reference element of the widget
+ * @param {string} clientStyling The style content
+ */
+function setClientStyling(stylingContainer, clientStyling) {
+  if (stylingContainer) {
+    const sheet = document.createElement('style');
+    sheet.innerHTML = clientStyling;
+    stylingContainer.appendChild(sheet);
+  }
+}
+
+/**
+ * @name setClientStylingURL
+ * @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
+ * @param {HTMLElement} stylingContainer The reference element of the widget
+ * @param {string} clientStylingUrl The URL of the style content
+ */
+function setClientStylingURL(stylingContainer, clientStylingUrl) {
+  if (!stylingContainer || !clientStylingUrl) return;
+
+  const url = new URL(clientStylingUrl);
+
+  fetch(url.href)
+    .then((res) => res.text())
+    .then((data) => {
+      const cssFile = document.createElement('style');
+      cssFile.innerHTML = data;
+      if (stylingContainer) {
+        stylingContainer.appendChild(cssFile);
+      }
+    })
+    .catch((err) => {
+      console.error('There was an error while trying to load client styling from URL', err);
+    });
+}
+
+/**
+ * @name setStreamLibrary
+ * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
+ * @param {HTMLElement} stylingContainer The highest element of the widget
+ * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
+ * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
+ */
+function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
+
+  const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
+
+  if (!supportAdoptStyle || !useAdoptedStyleSheets) {
+    subscription = getStyleTagSubscription(stylingContainer, domain);
+
+    return subscription;
+  }
+
+  if (!window[StyleCacheKey]) {
+    window[StyleCacheKey] = {};
+  }
+  subscription = getAdoptStyleSubscription(stylingContainer, domain);
+
+  const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
+  const wrappedUnsubscribe = () => {
+    if (window[StyleCacheKey][domain]) {
+      const cachedObject = window[StyleCacheKey][domain];
+      cachedObject.refCount > 1
+        ? (cachedObject.refCount = cachedObject.refCount - 1)
+        : delete window[StyleCacheKey][domain];
+    }
+
+    originalUnsubscribe();
+  };
+  subscription.unsubscribe = wrappedUnsubscribe;
+
+  return subscription;
+}
+
+function getStyleTagSubscription(stylingContainer, domain) {
+  const sheet = document.createElement('style');
+
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (stylingContainer) {
+      sheet.innerHTML = data;
+      stylingContainer.appendChild(sheet);
+    }
+  });
+}
+
+function getAdoptStyleSubscription(stylingContainer, domain) {
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (!stylingContainer) return;
+
+    const shadowRoot = stylingContainer.getRootNode();
+    const cacheStyleObject = window[StyleCacheKey];
+    let cachedStyle = cacheStyleObject[domain] && cacheStyleObject[domain].sheet;
+
+    if (!cachedStyle) {
+      cachedStyle = new CSSStyleSheet();
+      cachedStyle.replaceSync(data);
+      cacheStyleObject[domain] = {
+        sheet: cachedStyle,
+        refCount: 1
+      };
+    } else {
+      cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
+    }
+
+    const currentSheets = shadowRoot.adoptedStyleSheets || [];
+    if (!currentSheets.includes(cachedStyle)) {
+      shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
+    }
+  });
+}
+
+const isMobile = () => {
+    let userAgent = window.navigator.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));
+};
+const hasUpdateDataChanged = (prev, next) => {
+    if (!prev)
+        return true;
+    if (prev.ProgressId !== next.ProgressId)
+        return true;
+    if (prev.Levels.length !== next.Levels.length)
+        return true;
+    for (let i = 0; i < next.Levels.length; i++) {
+        const a = prev.Levels[i];
+        const b = next.Levels[i];
+        if (a.LevelId !== b.LevelId ||
+            a.ProgressStatus !== b.ProgressStatus ||
+            a.ProgressPercentage !== b.ProgressPercentage) {
+            return true;
+        }
+    }
+    return false;
+};
+
+const DEFAULT_LANGUAGE = 'en';
+const TRANSLATIONS = {
+    en: {
+        title: 'Challenges',
+        promo: 'Promo',
+        active: 'Active',
+        pendingTab: 'Pending',
+        finishedTab: 'Finished',
+        levels: 'Levels',
+        level: 'Level',
+        seeAll: 'See All',
+        games: 'Games',
+        rules: 'Rules',
+        events: 'Events',
+        codeTab: 'Code',
+        endsIn: 'Ends In',
+        expired: 'Expired',
+        placeBetsOf: 'Place bets of',
+        place: 'Place',
+        bet: 'bet',
+        bets: 'bets',
+        minBet: 'min bet',
+        forfeited: 'Forfeited',
+        finished: 'Finished',
+        suspended: 'Suspended',
+        completed: 'Completed',
+        unavailable: 'Unavailable',
+        optIn: 'Opt In',
+        optOutLeavingText: 'Leaving the challenge will cancel your progress and disqualify from future participation',
+        optOutLeavingActionText: 'Opt out of Challenge',
+        optOutModalTitle: 'Opt out of challenge?',
+        optOudModalDescription: 'Current progress will be lost, but you will keep earned rewards. You will not be able to opt in for this challenge again.',
+        optOutModalConfirm: 'Opt Out',
+        optOutModalCancel: 'Cancel',
+        optOutSuccessMessage: 'You’ve opted out of the challenge.',
+        resume: 'Resume',
+        pause: 'Pause',
+        join: 'Join to Start',
+        deposit: 'Deposit',
+        launchGame: 'Launch Game',
+        launchDescription: 'Launch any game from the Games tab to unlock the Challenge',
+        depositAmountDescription: 'to unlock the Challenge',
+        noDepositAmountDescription: 'Deposit any amount to unlock the Challenge',
+        claimByButton: 'Claim',
+        claimDescription: 'Click Claim button to unlock the Challenge',
+        resumeDescription: 'Your progress is saved while Challenge is suspended',
+        optInDescription: 'You are ready to opt-in!',
+        pausedDescription: 'Your progress is saved while Challenge is paused',
+        congrats: 'Congratulations!',
+        forfeitNotification: 'Unfortunately, your progress has been forfeited, and you are no longer eligible to continue this challenge. Check out other available challenges!',
+        optedOutNotification: 'You’ve left this challenge. Your progress has been lost, and rejoining is no longer possible. Discover other available challenges.',
+        completedNofitication: "You've successfully completed this challenge! Explore the next one and keep playing to earn more rewards!",
+        expiredNotification: 'Unfortunately, this challenge has expired and is no longer available to complete. Try another one that’s still active!',
+        pendingDescription: "You can join this challenge once you've finished the previous progress in the Active tab",
+        terms: 'Terms & Conditions',
+        readFullTerms: 'Read full Terms & Conditions',
+        contribution: 'contribution',
+        endDate: 'End Date',
+        back: 'Back',
+        all: 'All Challenges',
+        sports: 'Sports',
+        casino: 'Casino',
+        contributionType: 'Contribution Type',
+        contributionRule: 'Contribution Rule',
+        isContributeToOne: 'Bets contribute only to the earliest started challenge (if there are multiple started challenges)',
+        isNotContributeToOne: 'Bets contribute to all started challenges',
+        bonusMoney: 'Bonus Money',
+        realMoney: 'Real Money',
+        mixedMoney: 'Real and Bonus Money contribution',
+        defaultRule: 'All events - ',
+        fundsUsed: 'Funds Used',
+        sportsbookRealMoney: 'Only Real Money bets can contribute',
+        sportsbookBonusMoney: 'Only Bonus bets can contribute',
+        sportsbookMixMoney: 'Both Real Money and Bonus bets can contribute',
+        eligibleMatchTypes: 'Eligible Match Types',
+        preLiveMatchType: 'Only Pre-Match bets can contribute',
+        liveMatchType: 'Only Live bets can contribute',
+        mixMatchType: 'Both Pre-Match and Live bets can contribute',
+        eligibleBetTypes: 'Eligible Bet Types',
+        single: 'Single',
+        multi: 'Multi/Combi',
+        betBuilder: 'Only Bet Builder Bets',
+        nonBetBuilder: 'Only Non-Bet Builder Bets',
+        mixBetBuilder: 'Bet Builder & Non-Bet Builder Bets',
+        system: 'System',
+        banker: 'Only Banker Bets',
+        nonBanker: 'Only Non-Banker Bets',
+        mixBanker: 'Banker & Non-Banker Bets',
+        oddsPerSection: 'Odds per Selection',
+        totalOdds: 'Total Odds',
+        totalLevels: 'Total Levels',
+        selections: 'Selections',
+        time: 'time',
+        times: 'times',
+        winStakeRatio: 'Win/Stake Ratio',
+        promoTabEmptyHeader: 'Nothing here - yet!',
+        promoTabEmptyDescription: 'No challenges at the moment. Try exploring events or keep playing to unlock new ones.',
+        activeTabEmptyHeader: 'No active challenges yet',
+        activeTabEmptyDescription: 'Check Promo tab to find available offers',
+        pendingTabEmptyHeader: 'No pending challenges yet',
+        pendingTabEmptyDescription: 'Check Promo tab to find available offers',
+        finishedTabEmptyHeader: 'No finished challenges yet',
+        finishedTabEmptyDescription: 'Check Promo tab to find available offers',
+        yourProgress: 'Your Progress',
+        claimCodeTitle: 'Enter the secret code to unlock hidden quests and rewards.',
+        claimCodeSuccessMessage: 'The code was successfully applied.',
+        claimCodeInputLabel: '3–30 characters, no spaces',
+        claimCodeBtnText: 'Apply Code',
+        claimCodeError: 'Invalid format. Use Latin letters, numbers, or symbols.',
+        claimCodeDescription: 'Enter code to unlock the challenge',
+        status: 'Status',
+        grantClaimByButtonSuccessMessage: 'Challenge has been triggered successfully and is now available on the Active tab'
+    },
+    da: {
+        title: ''
+    }
+};
+const translate = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS[lang !== undefined && lang in TRANSLATIONS ? lang : DEFAULT_LANGUAGE][key];
+};
+const getTranslations = (data) => {
+    Object.keys(data).forEach((item) => {
+        if (!TRANSLATIONS[item]) {
+            TRANSLATIONS[item] = {};
+        }
+        for (let key in data[item]) {
+            TRANSLATIONS[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
+    }
+};
+
+var EChallengeLevelTargetType;
+(function (EChallengeLevelTargetType) {
+    EChallengeLevelTargetType[EChallengeLevelTargetType["Accumulative"] = 0] = "Accumulative";
+    EChallengeLevelTargetType[EChallengeLevelTargetType["SingleBet"] = 1] = "SingleBet";
+    EChallengeLevelTargetType[EChallengeLevelTargetType["MultipleOneBetSize"] = 2] = "MultipleOneBetSize";
+    EChallengeLevelTargetType[EChallengeLevelTargetType["BetMultiplier"] = 3] = "BetMultiplier";
+})(EChallengeLevelTargetType || (EChallengeLevelTargetType = {}));
+var EChallengeRecurrenceType;
+(function (EChallengeRecurrenceType) {
+    EChallengeRecurrenceType[EChallengeRecurrenceType["Single"] = 0] = "Single";
+    EChallengeRecurrenceType[EChallengeRecurrenceType["Daily"] = 1] = "Daily";
+    EChallengeRecurrenceType[EChallengeRecurrenceType["Weekly"] = 2] = "Weekly";
+    EChallengeRecurrenceType[EChallengeRecurrenceType["Monthly"] = 3] = "Monthly";
+})(EChallengeRecurrenceType || (EChallengeRecurrenceType = {}));
+var EChallengeRewardType;
+(function (EChallengeRewardType) {
+    EChallengeRewardType[EChallengeRewardType["FreeSpins"] = 0] = "FreeSpins";
+    EChallengeRewardType[EChallengeRewardType["LuckyWheel"] = 1] = "LuckyWheel";
+    EChallengeRewardType[EChallengeRewardType["Leaderboard"] = 2] = "Leaderboard";
+    EChallengeRewardType[EChallengeRewardType["Challenge"] = 3] = "Challenge";
+    EChallengeRewardType[EChallengeRewardType["Custom"] = 4] = "Custom";
+})(EChallengeRewardType || (EChallengeRewardType = {}));
+var EChallengeProgressLevelStatus;
+(function (EChallengeProgressLevelStatus) {
+    EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Closed"] = 0] = "Closed";
+    EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["InProgress"] = 1] = "InProgress";
+    EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Fillup"] = 2] = "Fillup";
+    EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Completed"] = 3] = "Completed";
+})(EChallengeProgressLevelStatus || (EChallengeProgressLevelStatus = {}));
+var EChallengeProgressStatus;
+(function (EChallengeProgressStatus) {
+    EChallengeProgressStatus[EChallengeProgressStatus["Started"] = 0] = "Started";
+    EChallengeProgressStatus[EChallengeProgressStatus["InProgress"] = 1] = "InProgress";
+    EChallengeProgressStatus[EChallengeProgressStatus["PendingLevelReward"] = 2] = "PendingLevelReward";
+    EChallengeProgressStatus[EChallengeProgressStatus["Completed"] = 3] = "Completed";
+    EChallengeProgressStatus[EChallengeProgressStatus["Expired"] = 4] = "Expired";
+    EChallengeProgressStatus[EChallengeProgressStatus["Forfeited"] = 5] = "Forfeited";
+    EChallengeProgressStatus[EChallengeProgressStatus["Awaiting"] = 6] = "Awaiting";
+    EChallengeProgressStatus[EChallengeProgressStatus["Paused"] = 7] = "Paused";
+})(EChallengeProgressStatus || (EChallengeProgressStatus = {}));
+var EChallengeStatus;
+(function (EChallengeStatus) {
+    EChallengeStatus[EChallengeStatus["Draft"] = 0] = "Draft";
+    EChallengeStatus[EChallengeStatus["Enabled"] = 1] = "Enabled";
+    EChallengeStatus[EChallengeStatus["Paused"] = 2] = "Paused";
+    EChallengeStatus[EChallengeStatus["Closed"] = 3] = "Closed";
+    EChallengeStatus[EChallengeStatus["Deleted"] = 4] = "Deleted";
+})(EChallengeStatus || (EChallengeStatus = {}));
+var EChallengeTriggerType;
+(function (EChallengeTriggerType) {
+    EChallengeTriggerType[EChallengeTriggerType["GameLaunch"] = 0] = "GameLaunch";
+    EChallengeTriggerType[EChallengeTriggerType["Reward"] = 1] = "Reward";
+    EChallengeTriggerType[EChallengeTriggerType["Manual"] = 2] = "Manual";
+    EChallengeTriggerType[EChallengeTriggerType["Claim"] = 3] = "Claim";
+    EChallengeTriggerType[EChallengeTriggerType["Event"] = 4] = "Event";
+    EChallengeTriggerType[EChallengeTriggerType["Deposit"] = 5] = "Deposit";
+    EChallengeTriggerType[EChallengeTriggerType["ClaimByButton"] = 6] = "ClaimByButton";
+})(EChallengeTriggerType || (EChallengeTriggerType = {}));
+var EChallengeValidityType;
+(function (EChallengeValidityType) {
+    EChallengeValidityType[EChallengeValidityType["Period"] = 0] = "Period";
+    EChallengeValidityType[EChallengeValidityType["Date"] = 1] = "Date";
+})(EChallengeValidityType || (EChallengeValidityType = {}));
+var EContributedFrom;
+(function (EContributedFrom) {
+    EContributedFrom[EContributedFrom["Casino"] = 0] = "Casino";
+    EContributedFrom[EContributedFrom["Any"] = 1] = "Any";
+    EContributedFrom[EContributedFrom["Sportsbook"] = 2] = "Sportsbook";
+})(EContributedFrom || (EContributedFrom = {}));
+var EMatchType;
+(function (EMatchType) {
+    EMatchType[EMatchType["Any"] = 0] = "Any";
+    EMatchType[EMatchType["Live"] = 1] = "Live";
+    EMatchType[EMatchType["PreLive"] = 2] = "PreLive";
+})(EMatchType || (EMatchType = {}));
+var EBetType;
+(function (EBetType) {
+    EBetType[EBetType["Single"] = 0] = "Single";
+    EBetType[EBetType["Multiple"] = 1] = "Multiple";
+    EBetType[EBetType["System"] = 2] = "System";
+})(EBetType || (EBetType = {}));
+var EBanker;
+(function (EBanker) {
+    EBanker[EBanker["Any"] = 0] = "Any";
+    EBanker[EBanker["BankerOnly"] = 1] = "BankerOnly";
+    EBanker[EBanker["NotBankerOnly"] = 2] = "NotBankerOnly";
+})(EBanker || (EBanker = {}));
+var EBetBuilder;
+(function (EBetBuilder) {
+    EBetBuilder[EBetBuilder["Any"] = 0] = "Any";
+    EBetBuilder[EBetBuilder["BetBuilderOnly"] = 1] = "BetBuilderOnly";
+    EBetBuilder[EBetBuilder["NotBetBuilderOnly"] = 2] = "NotBetBuilderOnly";
+})(EBetBuilder || (EBetBuilder = {}));
+var EWalletTypes;
+(function (EWalletTypes) {
+    EWalletTypes[EWalletTypes["RealCash"] = 0] = "RealCash";
+    EWalletTypes[EWalletTypes["BonusMoney"] = 1] = "BonusMoney";
+    EWalletTypes[EWalletTypes["Mixed"] = 2] = "Mixed";
+})(EWalletTypes || (EWalletTypes = {}));
+exports.EChallengesTabs = void 0;
+(function (EChallengesTabs) {
+    EChallengesTabs[EChallengesTabs["Promo"] = 0] = "Promo";
+    EChallengesTabs[EChallengesTabs["Active"] = 1] = "Active";
+    EChallengesTabs[EChallengesTabs["Pending"] = 2] = "Pending";
+    EChallengesTabs[EChallengesTabs["Finished"] = 3] = "Finished";
+    EChallengesTabs[EChallengesTabs["Code"] = 4] = "Code";
+})(exports.EChallengesTabs || (exports.EChallengesTabs = {}));
+var EChallengeDetailsTabs;
+(function (EChallengeDetailsTabs) {
+    EChallengeDetailsTabs[EChallengeDetailsTabs["Levels"] = 0] = "Levels";
+    EChallengeDetailsTabs[EChallengeDetailsTabs["Games"] = 1] = "Games";
+    EChallengeDetailsTabs[EChallengeDetailsTabs["Events"] = 2] = "Events";
+    EChallengeDetailsTabs[EChallengeDetailsTabs["Rules"] = 3] = "Rules";
+})(EChallengeDetailsTabs || (EChallengeDetailsTabs = {}));
+const HistoryItemLevelStatusDictionary = ['Completed', 'Expired', 'Forfeited'];
+exports.EHistoryItemLevelStatus = void 0;
+(function (EHistoryItemLevelStatus) {
+    EHistoryItemLevelStatus[EHistoryItemLevelStatus["Completed"] = 0] = "Completed";
+    EHistoryItemLevelStatus[EHistoryItemLevelStatus["Expired"] = 1] = "Expired";
+    EHistoryItemLevelStatus[EHistoryItemLevelStatus["Forfeited"] = 2] = "Forfeited";
+})(exports.EHistoryItemLevelStatus || (exports.EHistoryItemLevelStatus = {}));
+exports.EPostMessageRequestType = void 0;
+(function (EPostMessageRequestType) {
+    EPostMessageRequestType["ChallengesHistory"] = "ChallengesHistoryRequest";
+    EPostMessageRequestType["ChallengePromoTab"] = "ChallengePromoTabRequest";
+    EPostMessageRequestType["ClaimChallengeByCode"] = "ClaimChallengeByCodeRequest";
+    EPostMessageRequestType["ChallengeJoin"] = "ChallengeJoinRequest";
+    EPostMessageRequestType["RedirectToDepositPage"] = "RedirectToDepositPage";
+    EPostMessageRequestType["ClaimChallengeByButton"] = "ClaimChallengeByButtonRequest";
+    EPostMessageRequestType["GetChallengeGames"] = "GetChallengeGamesRequest";
+    EPostMessageRequestType["ChallengeIsNew"] = "ChallengeIsNewRequest";
+    EPostMessageRequestType["ChallengeInGameRedirect"] = "ChallengeInGameRedirect";
+    EPostMessageRequestType["ForfeitChallenge"] = "ForfeitChallengeRequest";
+})(exports.EPostMessageRequestType || (exports.EPostMessageRequestType = {}));
+var EPostMessageResponseType;
+(function (EPostMessageResponseType) {
+    EPostMessageResponseType["ChallengesHistory"] = "ChallengesHistoryResponse";
+    EPostMessageResponseType["ChallengePromoTab"] = "ChallengePromoTabResponse";
+    EPostMessageResponseType["ClaimChallengeByCode"] = "ClaimChallengeByCodeResponse";
+    EPostMessageResponseType["ChallengeJoin"] = "ChallengeJoinResponse";
+    EPostMessageResponseType["ClaimChallengeByButton"] = "ClaimChallengeByButtonResponse";
+    EPostMessageResponseType["GetChallengeGames"] = "GetChallengeGamesResponse";
+    EPostMessageResponseType["ChallengeIsNew"] = "ChallengeIsNewResponse";
+    EPostMessageResponseType["ForfeitChallenge"] = "ForfeitChallengeResponse";
+    EPostMessageResponseType["ChangeChallengeProgressStatus"] = "ChangeChallengeProgressStatus";
+    EPostMessageResponseType["ChallengeChangeStatusNotification"] = "ChallengeChangeStatusNotification";
+    EPostMessageResponseType["ChallengeForfeitNotification"] = "ChallengeForfeitNotification";
+    EPostMessageResponseType["UpdateChallengeProgress"] = "UpdateChallengeProgress";
+    EPostMessageResponseType["NewChallengeProgressGranted"] = "NewChallengeProgressGranted";
+})(EPostMessageResponseType || (EPostMessageResponseType = {}));
+
+const crossSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuNSAxNy41TDE3LjUgMi41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjEuMDA0NTkiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yLjUgMi41TDE3LjUgMTcuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjAwNDU5IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
+
+const errorSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjMzMzMzIDEuMzMzMzNDNC4wMTk2MiAxLjMzMzMzIDEuMzMzMzMgNC4wMTk2MiAxLjMzMzMzIDcuMzMzMzNDMS4zMzMzMyAxMC42NDcgNC4wMTk2MiAxMy4zMzMzIDcuMzMzMzMgMTMuMzMzM0MxMC42NDcgMTMuMzMzMyAxMy4zMzMzIDEwLjY0NyAxMy4zMzMzIDcuMzMzMzNDMTMuMzMzMyA0LjAxOTYyIDEwLjY0NyAxLjMzMzMzIDcuMzMzMzMgMS4zMzMzM1pNMCA3LjMzMzMzQzAgMy4yODMyNSAzLjI4MzI1IDAgNy4zMzMzMyAwQzExLjM4MzQgMCAxNC42NjY3IDMuMjgzMjUgMTQuNjY2NyA3LjMzMzMzQzE0LjY2NjcgMTEuMzgzNCAxMS4zODM0IDE0LjY2NjcgNy4zMzMzMyAxNC42NjY3QzMuMjgzMjUgMTQuNjY2NyAwIDExLjM4MzQgMCA3LjMzMzMzWk03LjMzMzMzIDRDNy43MDE1MiA0IDggNC4yOTg0OCA4IDQuNjY2NjdWNy4zMzMzM0M4IDcuNzAxNTIgNy43MDE1MiA4IDcuMzMzMzMgOEM2Ljk2NTE0IDggNi42NjY2NyA3LjcwMTUyIDYuNjY2NjcgNy4zMzMzM1Y0LjY2NjY3QzYuNjY2NjcgNC4yOTg0OCA2Ljk2NTE0IDQgNy4zMzMzMyA0Wk02LjY2NjY3IDEwQzYuNjY2NjcgOS42MzE4MSA2Ljk2NTE0IDkuMzMzMzMgNy4zMzMzMyA5LjMzMzMzSDcuMzRDNy43MDgxOSA5LjMzMzMzIDguMDA2NjcgOS42MzE4MSA4LjAwNjY3IDEwQzguMDA2NjcgMTAuMzY4MiA3LjcwODE5IDEwLjY2NjcgNy4zNCAxMC42NjY3SDcuMzMzMzNDNi45NjUxNCAxMC42NjY3IDYuNjY2NjcgMTAuMzY4MiA2LjY2NjY3IDEwWiIgZmlsbD0iI0ZGNEQ0RiIvPgo8L3N2Zz4K';
+
+const checkSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjMzMzMzIDEuMzMzMzNDNC4wMTk2MiAxLjMzMzMzIDEuMzMzMzMgNC4wMTk2MiAxLjMzMzMzIDcuMzMzMzNDMS4zMzMzMyAxMC42NDcgNC4wMTk2MiAxMy4zMzMzIDcuMzMzMzMgMTMuMzMzM0MxMC42NDcgMTMuMzMzMyAxMy4zMzMzIDEwLjY0NyAxMy4zMzMzIDcuMzMzMzNDMTMuMzMzMyA0LjAxOTYyIDEwLjY0NyAxLjMzMzMzIDcuMzMzMzMgMS4zMzMzM1pNMCA3LjMzMzMzQzAgMy4yODMyNSAzLjI4MzI1IDAgNy4zMzMzMyAwQzExLjM4MzQgMCAxNC42NjY3IDMuMjgzMjUgMTQuNjY2NyA3LjMzMzMzQzE0LjY2NjcgMTEuMzgzNCAxMS4zODM0IDE0LjY2NjcgNy4zMzMzMyAxNC42NjY3QzMuMjgzMjUgMTQuNjY2NyAwIDExLjM4MzQgMCA3LjMzMzMzWk0xMC44MDQ3IDQuODYxOTNDMTEuMDY1MSA1LjEyMjI4IDExLjA2NTEgNS41NDQzOSAxMC44MDQ3IDUuODA0NzRMNi44MDQ3NCA5LjgwNDc0QzYuNTQ0MzkgMTAuMDY1MSA2LjEyMjI4IDEwLjA2NTEgNS44NjE5MyA5LjgwNDc0TDMuODYxOTMgNy44MDQ3NEMzLjYwMTU4IDcuNTQ0MzkgMy42MDE1OCA3LjEyMjI4IDMuODYxOTMgNi44NjE5M0M0LjEyMjI4IDYuNjAxNTggNC41NDQzOSA2LjYwMTU4IDQuODA0NzQgNi44NjE5M0w2LjMzMzMzIDguMzkwNTJMOS44NjE5MyA0Ljg2MTkzQzEwLjEyMjMgNC42MDE1OCAxMC41NDQ0IDQuNjAxNTggMTAuODA0NyA0Ljg2MTkzWiIgZmlsbD0iIzAwRkE1QSIvPgo8L3N2Zz4K';
+
+const casinoChallengesOverlayDrawerCss = "@import url(\"https://fonts.googleapis.com/css2?family=Teachers:ital,wght@0,400..800;1,400..800&display=swap\");\n.container {\n  z-index: 301;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  container-name: challenges-game-page;\n  container-type: size;\n}\n\n.mobile .challenges__drawer {\n  width: 100%;\n  height: 100%;\n  left: 0;\n  bottom: 0;\n  border-radius: 0;\n  backdrop-filter: blur(16px);\n  border: none;\n  max-width: none;\n  min-width: initial;\n}\n.mobile .challenges__drawer .content-spacer {\n  margin-bottom: 32px;\n}\n.mobile .challenges__drawer .content-spacer.one-slide {\n  margin-bottom: 38px;\n}\n.mobile .challenges__drawer__content {\n  padding: 16px 0 0;\n}\n.mobile .challenges__drawer__content .content-details {\n  height: calc(100% - 30px);\n}\n.mobile .challenges__drawer__title {\n  height: 26px;\n  font-size: var(--emw--font-size-large, 18px);\n}\n.mobile .challenges__drawer__close {\n  right: 16px;\n  width: 26px;\n  height: 26px;\n}\n.mobile .challenges__drawer__close img {\n  width: 14px;\n}\n.mobile .challenges__backdrop {\n  display: none;\n}\n.mobile .notification {\n  padding: 8px 16px;\n  gap: 8px;\n}\n.mobile .notification .row {\n  margin: 15px 0 14px 0;\n}\n.mobile .notification__icon {\n  width: 16px;\n  height: 16px;\n}\n.mobile .notification__message {\n  font-size: var(--emw--font-size-small, 14px);\n}\n\n.challenges__drawer {\n  z-index: 302;\n  position: fixed;\n  left: 62px;\n  bottom: 76px;\n  border: 1px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n  background: var(--emw--color-Overlay-Background, rgba(9, 9, 9, 0.8));\n  backdrop-filter: blur(11px);\n  box-sizing: border-box;\n  width: 35%;\n  min-width: 400px;\n  max-width: 600px;\n  height: calc(100% - 20px - 76px);\n  border-radius: 30px;\n  opacity: 1;\n  font-family: var(--emw--font-family-primary, \"Teachers\"), sans-serif;\n  container-name: challenges-drawer;\n  container-type: size;\n}\n.challenges__drawer__title {\n  height: 36px;\n  color: var(--emw--color-title, #edeff2);\n  text-align: center;\n  font-size: var(--emw--font-size-large-xl, 22px);\n  font-weight: var(--emw--font-weight-semibold, 600);\n  margin: 0;\n  position: relative;\n  z-index: 1;\n  align-content: center;\n}\n.challenges__drawer__close {\n  outline: none;\n  background: transparent;\n  border-radius: 20px;\n  border: 1.5px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n  background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n  backdrop-filter: blur(6.882352829px);\n  cursor: pointer;\n  width: 36px;\n  height: 36px;\n  min-width: 36px;\n  min-height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  top: 0;\n  right: 24px;\n}\n.challenges__drawer__content {\n  height: 100%;\n  position: relative;\n  z-index: 2;\n  padding: 24px 0 0;\n  box-sizing: border-box;\n}\n.challenges__drawer__content .content-header {\n  width: 100%;\n  flex-shrink: 0;\n}\n.challenges__drawer__content .content-details {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n}\n.challenges__drawer__content .content-sub-page {\n  display: flex;\n  height: 100%;\n}\n.challenges__drawer .content-spacer {\n  margin-bottom: 24px;\n}\n.challenges__drawer, .challenges__drawer * {\n  scrollbar-width: thin;\n  scrollbar-color: var(--emw--color-gray-250, rgba(255, 255, 255, 0.3)) transparent;\n}\n.challenges__drawer::-webkit-scrollbar, .challenges__drawer *::-webkit-scrollbar {\n  width: 3px;\n}\n.challenges__drawer::-webkit-scrollbar-track, .challenges__drawer *::-webkit-scrollbar-track {\n  background: transparent;\n}\n.challenges__drawer::-webkit-scrollbar-thumb, .challenges__drawer *::-webkit-scrollbar-thumb {\n  background: var(--emw--color-gray-250, rgba(255, 255, 255, 0.3));\n  opacity: 0.3;\n  border-radius: 999px;\n  transition: none;\n  width: 3px;\n}\n.challenges__drawer::-webkit-scrollbar-thumb:hover, .challenges__drawer *::-webkit-scrollbar-thumb:hover {\n  background: var(--emw--color-gray-250, rgba(255, 255, 255, 0.3));\n  opacity: 0.3;\n  width: 3px;\n}\n.challenges__drawer::-webkit-scrollbar-button, .challenges__drawer *::-webkit-scrollbar-button {\n  display: none;\n}\n.challenges__backdrop {\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-backdrop, rgba(0, 0, 0, 0.6));\n  z-index: 301;\n  opacity: 1;\n}\n\n.notification {\n  display: flex;\n  position: fixed;\n  z-index: 400;\n  align-items: center;\n  bottom: 76px;\n  right: 0;\n  padding: 24px;\n  gap: 12px;\n  max-width: 445px;\n  box-sizing: border-box;\n  border-radius: 20px 0 0 20px;\n  border-top: 1px solid var(--emw--status-badge-success-color, #d6fff0);\n  border-bottom: 1px solid var(--emw--status-badge-success-color, #d6fff0);\n  border-left: 1px solid var(--emw--status-badge-success-color, #d6fff0);\n  background: var(--emw--background-success-notification, linear-gradient(112deg, rgba(74, 255, 135, 0.2) 0%, rgba(74, 255, 135, 0) 100%));\n  backdrop-filter: blur(16px);\n  color: var(--emw--color-white, #ffffff);\n  font-family: var(--emw--font-family-primary, \"Teachers\"), sans-serif;\n}\n.notification.errored {\n  border-top: 1px solid var(--emw--status-badge-red-bg, #d63d1e);\n  border-bottom: 1px solid var(--emw--status-badge-red-bg, #d63d1e);\n  border-left: 1px solid var(--emw--status-badge-red-bg, #d63d1e);\n  background: var(--emw--background-error-notification, rgba(9, 9, 9, 0.4));\n}\n.notification .row {\n  display: flex;\n  align-items: flex-start;\n}\n.notification__icon {\n  width: 18px;\n  height: 18px;\n  margin-right: 12px;\n}\n.notification__message {\n  margin: 0;\n  font-size: var(--emw--font-size-medium, 16px);\n  font-weight: var(--emw--font-weight-medium, 500);\n}\n.notification__message .active-tab {\n  color: var(--emw--border-success-color, #00b74f);\n  text-decoration-line: underline;\n  cursor: pointer;\n}\n\ncasino-challenges-overlay-drawer-details {\n  flex: 1;\n}\n\n@container challenges-game-page (width <= 1430px) {\n  .challenges__drawer {\n    width: 40%;\n    left: 45px;\n  }\n}\n@container challenges-game-page (width <= 1250px) {\n  .challenges__drawer {\n    width: 45%;\n  }\n}\n@container challenges-game-page (width <= 1000px) {\n  .challenges__drawer {\n    width: 50%;\n    left: 25px;\n  }\n}\n@container challenges-game-page (width <= 800px) {\n  .challenges__drawer__content {\n    padding: 20px 0 0;\n  }\n}\n@container challenges-game-page (height <= 850px) {\n  .challenges__drawer {\n    bottom: 36px;\n    height: calc(100% - 20px - 36px);\n  }\n  .challenges__drawer .content-spacer {\n    margin-bottom: 18px;\n  }\n}\n@container challenges-drawer (height <= 760px) {\n  .challenges__drawer .content-spacer {\n    margin-bottom: 12px;\n  }\n}";
+const CasinoChallengesOverlayDrawerStyle0 = casinoChallengesOverlayDrawerCss;
+
+const CasinoChallengesOverlayDrawer = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        this.EMPTY_STATE_PAGE_DESCRIPTION_MAP = {
+            [exports.EChallengesTabs.Promo]: {
+                header: (_a = TRANSLATIONS[this.language]) === null || _a === void 0 ? void 0 : _a.promoTabEmptyHeader,
+                description: (_b = TRANSLATIONS[this.language]) === null || _b === void 0 ? void 0 : _b.promoTabEmptyDescription
+            },
+            [exports.EChallengesTabs.Active]: {
+                header: (_c = TRANSLATIONS[this.language]) === null || _c === void 0 ? void 0 : _c.activeTabEmptyHeader,
+                description: (_d = TRANSLATIONS[this.language]) === null || _d === void 0 ? void 0 : _d.activeTabEmptyDescription
+            },
+            [exports.EChallengesTabs.Pending]: {
+                header: (_e = TRANSLATIONS[this.language]) === null || _e === void 0 ? void 0 : _e.pendingTabEmptyHeader,
+                description: (_f = TRANSLATIONS[this.language]) === null || _f === void 0 ? void 0 : _f.pendingTabEmptyDescription
+            },
+            [exports.EChallengesTabs.Finished]: {
+                header: (_g = TRANSLATIONS[this.language]) === null || _g === void 0 ? void 0 : _g.finishedTabEmptyHeader,
+                description: (_h = TRANSLATIONS[this.language]) === null || _h === void 0 ? void 0 : _h.finishedTabEmptyDescription
+            }
+        };
+        this.onActiveChallengeChange = (e) => {
+            var _a, _b, _c;
+            if (!(e === null || e === void 0 ? void 0 : e.detail)) {
+                return;
+            }
+            this.removeOptedOutChallenge();
+            if (this.activeTabIndex === exports.EChallengesTabs.Active) {
+                this.updateActiveChallenge((_a = this.activeChallenges) === null || _a === void 0 ? void 0 : _a.find((challenge) => (challenge === null || challenge === void 0 ? void 0 : challenge.Id) === e.detail));
+            }
+            else if (this.activeTabIndex === exports.EChallengesTabs.Pending) {
+                this.updateActiveChallenge((_b = this.pendingChallenges) === null || _b === void 0 ? void 0 : _b.find((challenge) => (challenge === null || challenge === void 0 ? void 0 : challenge.Id) === e.detail));
+            }
+            else {
+                this.updateActiveChallenge((_c = this.promoChallenges) === null || _c === void 0 ? void 0 : _c.find((challenge) => (challenge === null || challenge === void 0 ? void 0 : challenge.Id) === e.detail));
+            }
+        };
+        this.onSeeMoreClick = (e) => {
+            this.detailsSubPageInfo = { open: e.detail.open, tab: e.detail.tab };
+        };
+        this.onLoadMorePlayerHistory = (e) => {
+            window.postMessage({
+                type: exports.EPostMessageRequestType.ChallengesHistory,
+                data: e.detail
+            });
+        };
+        this.isInactiveChallenge = (challenge) => [
+            EChallengeProgressStatus.Awaiting,
+            EChallengeProgressStatus.Forfeited,
+            EChallengeProgressStatus.Completed,
+            EChallengeProgressStatus.Expired
+        ].includes(challenge.Status) || challenge.ChallengeStatus === EChallengeStatus.Paused;
+        this.updateActiveChallenge = (challenge) => {
+            var _a;
+            this.activeChallenge = challenge;
+            this.activeProgressId = (_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id;
+        };
+        this.removeOptedOutChallenge = () => {
+            var _a;
+            if (this.isOptedOut) {
+                this.isOptedOut = false;
+                this.activeChallenges = (_a = this.activeChallenges) === null || _a === void 0 ? void 0 : _a.filter((activeChallenge) => { var _a; return (activeChallenge === null || activeChallenge === void 0 ? void 0 : activeChallenge.Id) !== ((_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id); });
+                this.activeChallenge = null;
+            }
+        };
+        this.handleTabClick = (event) => {
+            if (event.detail !== this.activeTabIndex) {
+                this.removeOptedOutChallenge();
+                this.activeTabIndex = event.detail;
+                if (this.activeTabIndex === exports.EChallengesTabs.Promo) {
+                    window.postMessage({
+                        type: exports.EPostMessageRequestType.ChallengePromoTab,
+                        data: {}
+                    });
+                }
+                if (this.activeTabIndex === exports.EChallengesTabs.Active) {
+                    this.updateActiveChallenge(this.activeChallenges[0]);
+                }
+                if (this.activeTabIndex === exports.EChallengesTabs.Pending) {
+                    this.updateActiveChallenge(this.pendingChallenges[0]);
+                }
+                if (this.activeTabIndex === exports.EChallengesTabs.Finished) {
+                    window.postMessage({
+                        type: exports.EPostMessageRequestType.ChallengesHistory,
+                        data: {
+                            PageSize: 20,
+                            PageNumber: 0
+                        }
+                    });
+                }
+                if (event.detail !== exports.EChallengesTabs.Code)
+                    this.emptyState = this.EMPTY_STATE_PAGE_DESCRIPTION_MAP[event.detail];
+            }
+        };
+        this.openNotification = (notification) => {
+            this.notification = notification;
+            setTimeout(() => (this.notification = null), 10000);
+        };
+        this.renderNotification = () => {
+            var _a, _b, _c;
+            return (index.h("div", { class: `notification ${((_a = this.notification) === null || _a === void 0 ? void 0 : _a.errored) ? 'errored' : ''}` }, index.h("div", { class: "row" }, index.h("img", { src: ((_b = this.notification) === null || _b === void 0 ? void 0 : _b.errored) ? errorSvg : checkSvg, class: "notification__icon", alt: "" }), index.h("p", { class: "notification__message" }, (_c = this.notification) === null || _c === void 0 ? void 0 : _c.message))));
+        };
+        this.renderHeader = (isMobile) => {
+            return (index.h("div", null, index.h("h1", { class: "challenges__drawer__title" }, index.h("span", null, translate('title', this.language)), index.h("button", { class: "challenges__drawer__close", onClick: this.onCloseClick }, index.h("img", { src: crossSvg, alt: "" }))), index.h("casino-challenges-overlay-tabs", { onTabClick: this.handleTabClick, activeTabIndex: this.activeTabIndex, activeTabHasNotification: false, pendingTabHasNotification: false, language: this.language, "is-mobile": isMobile })));
+        };
+        this.isEmptyState = () => {
+            if (!this.loading && this.activeTabIndex !== exports.EChallengesTabs.Code) {
+                if (this.activeTabIndex === exports.EChallengesTabs.Active && !this.activeChallenges.length) {
+                    return true;
+                }
+                else if (this.activeTabIndex === exports.EChallengesTabs.Pending && !this.pendingChallenges.length) {
+                    return true;
+                }
+                else if (this.activeTabIndex === exports.EChallengesTabs.Promo && !this.promoChallenges.length) {
+                    return true;
+                }
+                else if (this.activeTabIndex === exports.EChallengesTabs.Finished && !this.playerHistory.length) {
+                    return true;
+                }
+            }
+            return false;
+        };
+        this.renderEmptyState = (isMobile) => {
+            var _a, _b;
+            return (index.h("div", null, this.renderHeader(isMobile), index.h("casino-challenges-empty-state", { header: (_a = this.emptyState) === null || _a === void 0 ? void 0 : _a.header, description: (_b = this.emptyState) === null || _b === void 0 ? void 0 : _b.description, "is-mobile": isMobile })));
+        };
+        this.renderFinishedTab = (isMobile) => {
+            return (index.h("div", null, this.renderHeader(isMobile), index.h("casino-challenges-overlay-drawer-history", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, isMobile: isMobile, historyItems: this.playerHistory, hasMore: this.hasMorePlayerHistory, onLoadMore: this.onLoadMorePlayerHistory, loading: this.loading })));
+        };
+        this.renderCodeTab = (isMobile) => {
+            return (index.h("div", null, this.renderHeader(isMobile), index.h("casino-challenges-claim-code", { "is-mobile": isMobile })));
+        };
+        this.renderChallengeDetails = (isMobile, isUnique = false) => {
+            return (index.h("casino-challenges-overlay-drawer-details", { challenge: this.activeChallenge, swipped: this.swipped, progress: this.progress, "is-mobile": isMobile, "is-unique": isUnique, "is-opted-out": this.isOptedOut, "active-challenges-tab-index": this.activeTabIndex, onSeeMoreClick: this.onSeeMoreClick, detailsSubPageInfo: this.detailsSubPageInfo, challengeGames: this.challengeGames, onCloseClick: this.onCloseClick }));
+        };
+        this.renderChallengesTabs = (isMobile) => {
+            const challenges = this.activeTabIndex === exports.EChallengesTabs.Active
+                ? this.activeChallenges
+                : this.activeTabIndex === exports.EChallengesTabs.Pending
+                    ? this.pendingChallenges
+                    : this.promoChallenges;
+            const isUnique = challenges.length === 1;
+            return (index.h("swipe-up", { onSwippedUp: (e) => {
+                    this.swipped = e.detail.swipped;
+                    this.progress = e.detail.progress;
+                }, isMobile: isMobile, isOneSlider: isUnique }, index.h("div", { class: "content-header", slot: "header" }, this.renderHeader(isMobile), index.h("div", { class: { 'content-spacer': this.swipped || !isMobile, 'one-slide': isUnique && this.swipped } }, index.h("casino-challenges-overlay-slider", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, challenges: challenges, isMobile: isMobile, onActiveChallengeChange: this.onActiveChallengeChange, initialProgressId: this.activeProgressId, activeTabIndex: this.activeTabIndex }))), index.h("div", { class: "content-details", slot: "details" }, this.renderChallengeDetails(isMobile, isUnique))));
+        };
+        this.onCloseClick = () => {
+            var _a, _b;
+            this.pendingChallenges = (_a = this.pendingChallenges) === null || _a === void 0 ? void 0 : _a.filter((c) => c.Status === EChallengeProgressStatus.Awaiting);
+            this.activeChallenges = (_b = this.activeChallenges) === null || _b === void 0 ? void 0 : _b.filter((challenge) => !this.isInactiveChallenge(challenge));
+            this.detailsSubPageInfo = { open: false, tab: null };
+            this.loading = false;
+            this.isOptedOut = false;
+            this.handleClose();
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.language = 'en';
+        this.isOpen = false;
+        this.handleClose = () => { };
+        this.challenges = [];
+        this.initialProgressId = '';
+        this.activeChallenge = null;
+        this.activeProgressId = '';
+        this.activeTabIndex = exports.EChallengesTabs.Active;
+        this.error = '';
+        this.hasError = false;
+        this.swipped = false;
+        this.detailsSubPageInfo = undefined;
+        this.progress = 0;
+        this.loading = false;
+        this.notification = null;
+        this.optOutModaIsOpen = false;
+        this.isOptedOut = false;
+        this.prevUpdateEvent = undefined;
+        this.challengeGames = [];
+        this.activeChallenges = [];
+        this.pendingChallenges = [];
+        this.promoChallenges = [];
+        this.playerHistory = [];
+        this.hasMorePlayerHistory = false;
+        this.emptyState = {
+            header: (_j = TRANSLATIONS[this.language]) === null || _j === void 0 ? void 0 : _j.activeTabEmptyHeader,
+            description: (_k = TRANSLATIONS[this.language]) === null || _k === void 0 ? void 0 : _k.activeTabEmptyDescription
+        };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleIsOpenChange(newValue) {
+        var _a;
+        if (newValue) {
+            if (this.initialProgressId && this.challenges.length) {
+                this.activeTabIndex = exports.EChallengesTabs.Active;
+                this.activeProgressId = this.initialProgressId;
+                const currentChallenge = ((_a = this.activeChallenges) === null || _a === void 0 ? void 0 : _a.find((x) => x.Id === this.activeProgressId)) || this.activeChallenges[0];
+                this.updateActiveChallenge(currentChallenge || null);
+            }
+            else {
+                this.activeTabIndex = exports.EChallengesTabs.Promo;
+                window.postMessage({
+                    type: exports.EPostMessageRequestType.ChallengePromoTab,
+                    data: {}
+                });
+            }
+        }
+    }
+    onActiveChallengeChanged() {
+        this.challengeGames = [];
+    }
+    onOpenOptOut() {
+        this.optOutModaIsOpen = true;
+    }
+    onCloseOptOut() {
+        this.optOutModaIsOpen = false;
+    }
+    onConfirmOptOut() {
+        window.postMessage({
+            type: exports.EPostMessageRequestType.ForfeitChallenge,
+            data: {
+                ChallengeId: this.activeChallenge.ChallengeId
+            }
+        });
+    }
+    onChallengeExpired(event) {
+        if (!(event === null || event === void 0 ? void 0 : event.detail)) {
+            return;
+        }
+        switch (this.activeTabIndex) {
+            case exports.EChallengesTabs.Active:
+                this.activeChallenges = this.updateChallenge(this.activeChallenges, event.detail, {
+                    Status: EChallengeProgressStatus.Expired
+                });
+                break;
+            case exports.EChallengesTabs.Pending:
+                this.pendingChallenges = this.updateChallenge(this.pendingChallenges, event.detail, {
+                    Status: EChallengeProgressStatus.Expired
+                });
+                break;
+            case exports.EChallengesTabs.Promo:
+                this.promoChallenges = this.updateChallenge(this.promoChallenges, event.detail, {
+                    Status: EChallengeProgressStatus.Expired
+                });
+                break;
+        }
+    }
+    handleEvent(e) {
+        var _a, _b, _c, _d;
+        const { type, data, success, errorMessage } = e === null || e === void 0 ? void 0 : e.data;
+        console.log('\nReceived event: ', e === null || e === void 0 ? void 0 : e.data.type);
+        console.log(e); // left here temporarily for debugging in the developer environment
+        switch (type) {
+            case EPostMessageResponseType.ChallengePromoTab: {
+                if (success) {
+                    this.promoChallenges = data || [];
+                    this.updateActiveChallenge(this.promoChallenges[0]);
+                }
+                else {
+                    this.promoChallenges = [];
+                    this.updateActiveChallenge(null);
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ChallengesHistory: {
+                if (success) {
+                    if (this.playerHistory.length < ((_a = e === null || e === void 0 ? void 0 : e.data) === null || _a === void 0 ? void 0 : _a.totalItem)) {
+                        this.playerHistory = [...this.playerHistory, ...data];
+                    }
+                    else {
+                        this.playerHistory = data;
+                    }
+                    this.hasMorePlayerHistory = ((_b = e === null || e === void 0 ? void 0 : e.data) === null || _b === void 0 ? void 0 : _b.totalItem) > this.playerHistory.length;
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ClaimChallengeByCode: {
+                if (success) {
+                    this.openNotification({ message: translate('claimCodeSuccessMessage', this.language) });
+                    this.activeChallenges = [...this.activeChallenges, data];
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ChallengeJoin: {
+                if (success) {
+                    const isJoining = [EChallengeProgressStatus.Paused, EChallengeProgressStatus.Started].includes((_c = this.activeChallenge) === null || _c === void 0 ? void 0 : _c.Status);
+                    const id = isJoining ? data === null || data === void 0 ? void 0 : data.joinId : data === null || data === void 0 ? void 0 : data.unjoinId;
+                    const status = isJoining ? EChallengeProgressStatus.InProgress : EChallengeProgressStatus.Paused;
+                    this.activeChallenges = this.updateChallenge(this.activeChallenges, id, {
+                        Status: status
+                    });
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ChallengeIsNew: {
+                if (success) {
+                    this.updateChallengeByProgressId(data === null || data === void 0 ? void 0 : data.challengeProgressId, { IsNew: false });
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                break;
+            }
+            case EPostMessageResponseType.GetChallengeGames: {
+                if (success) {
+                    this.challengeGames = data;
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ClaimChallengeByButton: {
+                if (success) {
+                    const challenge = Array.isArray(data) ? data[0] : data;
+                    if (challenge) {
+                        challenge.IsNew = false;
+                        this.activeChallenges = [...this.activeChallenges, challenge];
+                        this.updateActiveChallenge(challenge);
+                        this.activeTabIndex = exports.EChallengesTabs.Active;
+                        this.openNotification({ message: translate('grantClaimByButtonSuccessMessage', this.language) });
+                    }
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            case EPostMessageResponseType.ForfeitChallenge: {
+                this.optOutModaIsOpen = false;
+                if (success) {
+                    this.openNotification({ message: translate('optOutSuccessMessage', this.language) });
+                    this.detailsSubPageInfo = { open: false, tab: null };
+                    this.isOptedOut = true;
+                }
+                else {
+                    this.openNotification({ message: errorMessage, errored: true });
+                }
+                this.loading = false;
+                break;
+            }
+            //
+            case EPostMessageResponseType.ChangeChallengeProgressStatus: {
+                this.updateChallengeByProgressId(data === null || data === void 0 ? void 0 : data.ChallengeProgressId, { Status: data === null || data === void 0 ? void 0 : data.ChallengeProgressStatus });
+                break;
+            }
+            case EPostMessageResponseType.ChallengeChangeStatusNotification: {
+                this.updateChallengeById(data === null || data === void 0 ? void 0 : data.ChallengeId, {
+                    ChallengeStatus: (data === null || data === void 0 ? void 0 : data.IsEnabled) ? EChallengeStatus.Enabled : EChallengeStatus.Paused
+                });
+                break;
+            }
+            case EPostMessageResponseType.ChallengeForfeitNotification: {
+                this.updateChallengeById(data === null || data === void 0 ? void 0 : data.ChallengeId, { Status: EChallengeProgressStatus.Forfeited });
+                break;
+            }
+            case EPostMessageResponseType.UpdateChallengeProgress: {
+                const newChallenge = data;
+                if (!hasUpdateDataChanged(this.prevUpdateEvent, newChallenge)) {
+                    return;
+                }
+                this.prevUpdateEvent = newChallenge;
+                this.activeChallenges = (_d = this.activeChallenges) === null || _d === void 0 ? void 0 : _d.map((challenge) => {
+                    if (challenge.Id !== (newChallenge === null || newChallenge === void 0 ? void 0 : newChallenge.ProgressId))
+                        return challenge;
+                    const updatedLevels = challenge.LevelProgresses.map((level) => {
+                        const newLevelData = newChallenge === null || newChallenge === void 0 ? void 0 : newChallenge.Levels.find((l) => l.LevelId === level.LevelId);
+                        if (!newLevelData)
+                            return level;
+                        return Object.assign(Object.assign({}, level), { ProgressStatus: newLevelData.ProgressStatus, ProgressPercentage: newLevelData.ProgressPercentage });
+                    });
+                    return Object.assign(Object.assign({}, challenge), { Status: newChallenge === null || newChallenge === void 0 ? void 0 : newChallenge.Status, LevelProgresses: updatedLevels });
+                });
+                break;
+            }
+            case EPostMessageResponseType.NewChallengeProgressGranted:
+                const isPending = (data === null || data === void 0 ? void 0 : data.Status) === EChallengeProgressStatus.Awaiting;
+                const challenges = isPending ? this.pendingChallenges : this.activeChallenges;
+                if (challenges === null || challenges === void 0 ? void 0 : challenges.some((x) => x.Id === (data === null || data === void 0 ? void 0 : data.Id)))
+                    break;
+                if (isPending) {
+                    this.pendingChallenges = [...challenges, data];
+                }
+                else {
+                    this.activeChallenges = [...challenges, data];
+                }
+                break;
+            // component loading state processing for requests
+            case exports.EPostMessageRequestType.ChallengeJoin:
+            case exports.EPostMessageRequestType.GetChallengeGames:
+            case exports.EPostMessageRequestType.ClaimChallengeByButton:
+            case exports.EPostMessageRequestType.RedirectToDepositPage:
+            case exports.EPostMessageRequestType.ChallengeInGameRedirect:
+            case exports.EPostMessageRequestType.ChallengesHistory:
+            case exports.EPostMessageRequestType.ChallengePromoTab:
+            case exports.EPostMessageRequestType.ClaimChallengeByCode:
+            case exports.EPostMessageRequestType.ForfeitChallenge:
+                this.loading = true;
+                break;
+        }
+    }
+    componentWillLoad() {
+        var _a;
+        if (this.translationUrl) {
+            resolveTranslationUrl(this.translationUrl);
+        }
+        if ((_a = this.challenges) === null || _a === void 0 ? void 0 : _a.length) {
+            const challenges = [...this.challenges];
+            this.pendingChallenges = challenges.filter((c) => c.Status === EChallengeProgressStatus.Awaiting);
+            this.activeChallenges = challenges.filter((challenge) => !this.isInactiveChallenge(challenge));
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    updateChallenge(challenges, progressId, updates) {
+        var _a;
+        if (((_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id) === progressId) {
+            this.activeChallenge = Object.assign(Object.assign({}, this.activeChallenge), updates);
+        }
+        return challenges.map((challenge) => (challenge.Id === progressId ? Object.assign(Object.assign({}, challenge), updates) : challenge));
+    }
+    updateChallengeList(list, challengeId, updates) {
+        let changed = false;
+        const updated = list.map((challenge) => {
+            if (challenge.ChallengeId === challengeId) {
+                changed = true;
+                return Object.assign(Object.assign({}, challenge), updates);
+            }
+            return challenge;
+        });
+        return changed ? updated : list;
+    }
+    updateChallengeById(challengeId, updates) {
+        var _a;
+        if (((_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.ChallengeId) === challengeId) {
+            this.activeChallenge = Object.assign(Object.assign({}, this.activeChallenge), updates);
+        }
+        this.activeChallenges = this.updateChallengeList(this.activeChallenges, challengeId, updates);
+        this.pendingChallenges = this.updateChallengeList(this.pendingChallenges, challengeId, updates);
+        this.promoChallenges = this.updateChallengeList(this.promoChallenges, challengeId, updates);
+    }
+    updateChallengeByProgressId(progressId, updates) {
+        var _a;
+        if (((_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id) === progressId) {
+            this.activeChallenge = Object.assign(Object.assign({}, this.activeChallenge), updates);
+        }
+        if (this.activeChallenges.find((x) => x.Id === progressId)) {
+            this.activeChallenges = this.activeChallenges.map((challenge) => challenge.Id === progressId ? Object.assign(Object.assign({}, challenge), updates) : challenge);
+        }
+        else if (this.pendingChallenges.find((x) => x.Id === progressId)) {
+            this.pendingChallenges = this.pendingChallenges.map((challenge) => challenge.Id === progressId ? Object.assign(Object.assign({}, challenge), updates) : challenge);
+        }
+        else {
+            this.promoChallenges = this.promoChallenges.map((challenge) => challenge.Id === progressId ? Object.assign(Object.assign({}, challenge), updates) : challenge);
+        }
+    }
+    renderContent(isMobile, showEmptyState) {
+        var _a;
+        if (showEmptyState) {
+            return this.renderEmptyState(isMobile);
+        }
+        if ((_a = this.detailsSubPageInfo) === null || _a === void 0 ? void 0 : _a.open) {
+            return (index.h("div", { class: "content-sub-page", slot: "details" }, this.renderChallengeDetails(isMobile)));
+        }
+        switch (this.activeTabIndex) {
+            case exports.EChallengesTabs.Promo:
+            case exports.EChallengesTabs.Active:
+            case exports.EChallengesTabs.Pending:
+                return this.renderChallengesTabs(isMobile);
+            case exports.EChallengesTabs.Code:
+                return this.renderCodeTab(isMobile);
+            case exports.EChallengesTabs.Finished:
+                return this.renderFinishedTab(isMobile);
+            default:
+                return;
+        }
+    }
+    render() {
+        if (!this.isOpen) {
+            return;
+        }
+        const isMobile$1 = isMobile() || window.innerWidth <= 768;
+        const showEmptyState = this.isEmptyState();
+        return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: {
+                container: true,
+                mobile: isMobile$1
+            } }, index.h("div", { class: "challenges__backdrop", onClick: this.onCloseClick }), index.h("div", { class: "challenges__drawer" }, index.h("casino-challenge-overlay-background", { empty: showEmptyState }), index.h("div", { class: "challenges__drawer__content" }, this.renderContent(isMobile$1, showEmptyState)), this.loading && index.h("casino-challenges-overlay-loader", { "full-size": true, "is-mobile": isMobile$1 }), index.h("casino-challenge-opt-out-modal", { open: this.optOutModaIsOpen, "is-mobile": isMobile$1, language: this.language })), this.notification && this.renderNotification()));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "isOpen": ["handleIsOpenChange"],
+        "activeChallenge": ["onActiveChallengeChanged"]
+    }; }
+};
+CasinoChallengesOverlayDrawer.style = CasinoChallengesOverlayDrawerStyle0;
+
+exports.CasinoChallengesOverlayDrawer = CasinoChallengesOverlayDrawer;
+exports.HistoryItemLevelStatusDictionary = HistoryItemLevelStatusDictionary;
+exports.resolveTranslationUrl = resolveTranslationUrl;
+exports.setClientStyling = setClientStyling;
+exports.setClientStylingURL = setClientStylingURL;
+exports.setStreamStyling = setStreamStyling;
+exports.translate = translate;