@everymatrix/casino-challenges-overlay 0.22.10 → 0.22.13

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6300a889.js');
+const index = require('./index-98384ab0.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 /*
@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["casino-challenge-details-events_23.cjs",[[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],"extendedIngameWidget":[516,"extended-ingame-widget"],"enabledWidgetTabs":[32],"progress":[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],"modalLevelsCount":[32],"modalIsFreeSpinsGranted":[32],"modalBonusProgramGames":[32],"showDrawer":[32],"init":[64]},[[1,"touchmove","handleTouchMove"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-drawer",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"handleClose":[16],"challenges":[16],"initialProgressId":[513,"initial-progress-id"],"enabledWidgetTabs":[16],"activeChallenge":[32],"activeProgressId":[32],"activeTabIndex":[32],"error":[32],"hasError":[32],"swipped":[32],"detailsSubPageInfo":[32],"progress":[32],"loading":[32],"notification":[32],"optOutModaIsOpen":[32],"isOptedOut":[32],"prevUpdateEvent":[32],"challengeGames":[32],"activeChallenges":[32],"pendingChallenges":[32],"promoChallenges":[32],"playerHistory":[32],"hasMorePlayerHistory":[32],"emptyState":[32]},[[0,"openOptOutModal","onOpenOptOut"],[0,"closeOptOutModal","onCloseOptOut"],[0,"confirmOptOut","onConfirmOptOut"],[0,"challengeExpired","onChallengeExpired"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"isOpen":["handleIsOpenChange"],"activeChallenge":["onActiveChallengeChanged"]}],[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"],"isFreeSpinsGranted":[516,"is-free-spins-granted"],"levelsCount":[514,"levels-count"],"bonusProgramGames":[16],"currentIndex":[32],"isMobile":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"bonusProgramGames":["handleBonusProgramGameChange"]}],[1,"casino-challenges-overlay-drawer-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenge":[16],"isMobile":[516,"is-mobile"],"isUnique":[516,"is-unique"],"swipped":[516],"progress":[514],"activeChallengesTabIndex":[513,"active-challenges-tab-index"],"detailsSubPageInfo":[16],"isOptedOut":[516,"is-opted-out"],"challengeGames":[16],"swipping":[32],"actionLoading":[32],"error":[32],"isChallengePaused":[32],"timeLeft":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"progress":["onSwipeChange"],"challenge":["onChallengeChange"]}],[0,"casino-challenge-opt-out-modal",{"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[1,"casino-challenges-overlay-drawer-history",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"loading":[516],"hasMore":[516,"has-more"],"historyItems":[16],"openItems":[32],"pageSize":[32],"pageNumber":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"historyItems":["handlePlayerHistoryChange"]}],[1,"casino-challenges-overlay-slider",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"challenges":[16],"initialProgressId":[1,"initial-progress-id"],"activeTabIndex":[1,"active-tab-index"],"currentIndex":[32],"slideWidth":[32],"slideHeight":[32],"isOneSlide":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"currentIndex":["onCurrentIndexChange"],"challenges":["onChallengesChange"],"initialProgressId":["onInitialProgressIdChange"]}],[0,"casino-challenge-overlay-background",{"empty":[4]}],[1,"casino-challenges-claim-code",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"domain":[513],"isMobile":[516,"is-mobile"],"loading":[32],"hasError":[32],"code":[32],"notificationMessage":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-empty-state",{"header":[1],"description":[1],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-loader",{"fullSize":[4,"full-size"],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-tabs",{"language":[513],"isMobile":[516,"is-mobile"],"activeTabIndex":[514,"active-tab-index"],"activeTabHasNotification":[516,"active-tab-has-notification"],"pendingTabHasNotification":[516,"pending-tab-has-notification"],"enabledWidgetTabs":[16]}],[4,"swipe-up",{"isMobile":[516,"is-mobile"],"isOneSlider":[516,"is-one-slider"],"progress":[32]},null,{"isOneSlider":["onIsOneSliderChange"],"progress":["onSwipeChange"]}],[0,"casino-challenge-details-levels",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isChallengePaused":[4,"is-challenge-paused"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-details-events",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[0,"casino-challenge-details-games",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"games":[16],"handleGameClick":[16]}],[0,"casino-challenge-details-progress-bar",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"]}],[0,"casino-challenge-details-rules",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-drawer-history-item",{"language":[513],"index":[514],"historyItem":[16],"itemRef":[16],"isOpen":[4,"is-open"],"isMobile":[4,"is-mobile"],"toggle":[16]}],[1,"casino-challenges-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"isOpen":[516,"is-open"],"showWinAnimation":[516,"show-win-animation"],"showBackdrop":[516,"show-backdrop"],"showCloseButton":[516,"show-close-button"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-overlay-card",{"challenge":[16],"index":[2],"arrLength":[2,"arr-length"],"currentIndex":[2,"current-index"],"language":[1],"isOptedOut":[4,"is-opted-out"],"slideWidth":[2,"slide-width"],"slideHeight":[2,"slide-height"],"timeLeft":[32]}],[4,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32]}],[0,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}]]]], options);
+  return index.bootstrapLazy([["casino-challenge-details-events_23.cjs",[[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],"extendedIngameWidget":[516,"extended-ingame-widget"],"enabledWidgetTabs":[32],"progress":[32],"displayedProgress":[32],"capsuleSize":[32],"showCompletedIcon":[32],"isPlayingLevelComplete":[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],"modalLevelsCount":[32],"modalIsFreeSpinsGranted":[32],"modalBonusProgramGames":[32],"showDrawer":[32],"init":[64]},[[1,"touchmove","handleTouchMove"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-drawer",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"handleClose":[16],"challenges":[16],"initialProgressId":[513,"initial-progress-id"],"enabledWidgetTabs":[16],"activeChallenge":[32],"activeProgressId":[32],"activeTabIndex":[32],"error":[32],"hasError":[32],"swipped":[32],"detailsSubPageInfo":[32],"progress":[32],"loading":[32],"notification":[32],"optOutModaIsOpen":[32],"isOptedOut":[32],"prevUpdateEvent":[32],"challengeGames":[32],"activeChallenges":[32],"pendingChallenges":[32],"promoChallenges":[32],"playerHistory":[32],"hasMorePlayerHistory":[32],"emptyState":[32]},[[0,"openOptOutModal","onOpenOptOut"],[0,"closeOptOutModal","onCloseOptOut"],[0,"confirmOptOut","onConfirmOptOut"],[0,"challengeExpired","onChallengeExpired"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"isOpen":["handleIsOpenChange"],"activeChallenge":["onActiveChallengeChanged"]}],[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"],"isFreeSpinsGranted":[516,"is-free-spins-granted"],"levelsCount":[514,"levels-count"],"bonusProgramGames":[16],"currentIndex":[32],"isMobile":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"bonusProgramGames":["handleBonusProgramGameChange"]}],[1,"casino-challenges-overlay-drawer-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenge":[16],"isMobile":[516,"is-mobile"],"isUnique":[516,"is-unique"],"swipped":[516],"progress":[514],"activeChallengesTabIndex":[513,"active-challenges-tab-index"],"detailsSubPageInfo":[16],"isOptedOut":[516,"is-opted-out"],"challengeGames":[16],"swipping":[32],"actionLoading":[32],"error":[32],"isChallengePaused":[32],"timeLeft":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"progress":["onSwipeChange"],"challenge":["onChallengeChange"]}],[0,"casino-challenge-opt-out-modal",{"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[1,"casino-challenges-overlay-drawer-history",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"loading":[516],"hasMore":[516,"has-more"],"historyItems":[16],"openItems":[32],"pageSize":[32],"pageNumber":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"historyItems":["handlePlayerHistoryChange"]}],[1,"casino-challenges-overlay-slider",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"challenges":[16],"initialProgressId":[1,"initial-progress-id"],"activeTabIndex":[1,"active-tab-index"],"currentIndex":[32],"slideWidth":[32],"slideHeight":[32],"isOneSlide":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"currentIndex":["onCurrentIndexChange"],"challenges":["onChallengesChange"],"initialProgressId":["onInitialProgressIdChange"]}],[0,"casino-challenge-overlay-background",{"empty":[4]}],[1,"casino-challenges-claim-code",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"domain":[513],"isMobile":[516,"is-mobile"],"loading":[32],"hasError":[32],"code":[32],"notificationMessage":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-empty-state",{"header":[1],"description":[1],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-loader",{"fullSize":[4,"full-size"],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-tabs",{"language":[513],"isMobile":[516,"is-mobile"],"activeTabIndex":[514,"active-tab-index"],"activeTabHasNotification":[516,"active-tab-has-notification"],"pendingTabHasNotification":[516,"pending-tab-has-notification"],"enabledWidgetTabs":[16]}],[4,"swipe-up",{"isMobile":[516,"is-mobile"],"isOneSlider":[516,"is-one-slider"],"progress":[32]},null,{"isOneSlider":["onIsOneSliderChange"],"progress":["onSwipeChange"]}],[0,"casino-challenge-details-levels",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isChallengePaused":[4,"is-challenge-paused"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-details-events",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[0,"casino-challenge-details-games",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"games":[16],"handleGameClick":[16]}],[0,"casino-challenge-details-progress-bar",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"]}],[0,"casino-challenge-details-rules",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-drawer-history-item",{"language":[513],"index":[514],"historyItem":[16],"itemRef":[16],"isOpen":[4,"is-open"],"isMobile":[4,"is-mobile"],"toggle":[16]}],[1,"casino-challenges-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"isOpen":[516,"is-open"],"showWinAnimation":[516,"show-win-animation"],"showBackdrop":[516,"show-backdrop"],"showCloseButton":[516,"show-close-button"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-overlay-card",{"challenge":[16],"index":[2],"arrLength":[2,"arr-length"],"currentIndex":[2,"current-index"],"language":[1],"isOptedOut":[4,"is-opted-out"],"slideWidth":[2,"slide-width"],"slideHeight":[2,"slide-height"],"timeLeft":[32]}],[4,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32]}],[0,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/{index-6300a889.js → index-98384ab0.js}

@@ -21,7 +21,7 @@ function _interopNamespace(e) {
 }
 
 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: true, 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: true, 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: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, 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: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, 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: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, 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
@@ -1072,6 +1072,9 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
       maybePromise = safeCall(instance, "componentWillLoad");
     }
   }
+  {
+    maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender"));
+  }
   endSchedule();
   return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
 };

package/dist/cjs/index.cjs.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const casinoChallengesOverlay = require('./casino-challenges-overlay-7ce3e62a.js');
-require('./index-6300a889.js');
+const casinoChallengesOverlay = require('./casino-challenges-overlay-e699eea9.js');
+require('./index-98384ab0.js');
 
 
 

package/dist/cjs/loader.cjs.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6300a889.js');
+const index = require('./index-98384ab0.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["casino-challenge-details-events_23.cjs",[[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],"extendedIngameWidget":[516,"extended-ingame-widget"],"enabledWidgetTabs":[32],"progress":[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],"modalLevelsCount":[32],"modalIsFreeSpinsGranted":[32],"modalBonusProgramGames":[32],"showDrawer":[32],"init":[64]},[[1,"touchmove","handleTouchMove"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-drawer",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"handleClose":[16],"challenges":[16],"initialProgressId":[513,"initial-progress-id"],"enabledWidgetTabs":[16],"activeChallenge":[32],"activeProgressId":[32],"activeTabIndex":[32],"error":[32],"hasError":[32],"swipped":[32],"detailsSubPageInfo":[32],"progress":[32],"loading":[32],"notification":[32],"optOutModaIsOpen":[32],"isOptedOut":[32],"prevUpdateEvent":[32],"challengeGames":[32],"activeChallenges":[32],"pendingChallenges":[32],"promoChallenges":[32],"playerHistory":[32],"hasMorePlayerHistory":[32],"emptyState":[32]},[[0,"openOptOutModal","onOpenOptOut"],[0,"closeOptOutModal","onCloseOptOut"],[0,"confirmOptOut","onConfirmOptOut"],[0,"challengeExpired","onChallengeExpired"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"isOpen":["handleIsOpenChange"],"activeChallenge":["onActiveChallengeChanged"]}],[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"],"isFreeSpinsGranted":[516,"is-free-spins-granted"],"levelsCount":[514,"levels-count"],"bonusProgramGames":[16],"currentIndex":[32],"isMobile":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"bonusProgramGames":["handleBonusProgramGameChange"]}],[1,"casino-challenges-overlay-drawer-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenge":[16],"isMobile":[516,"is-mobile"],"isUnique":[516,"is-unique"],"swipped":[516],"progress":[514],"activeChallengesTabIndex":[513,"active-challenges-tab-index"],"detailsSubPageInfo":[16],"isOptedOut":[516,"is-opted-out"],"challengeGames":[16],"swipping":[32],"actionLoading":[32],"error":[32],"isChallengePaused":[32],"timeLeft":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"progress":["onSwipeChange"],"challenge":["onChallengeChange"]}],[0,"casino-challenge-opt-out-modal",{"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[1,"casino-challenges-overlay-drawer-history",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"loading":[516],"hasMore":[516,"has-more"],"historyItems":[16],"openItems":[32],"pageSize":[32],"pageNumber":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"historyItems":["handlePlayerHistoryChange"]}],[1,"casino-challenges-overlay-slider",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"challenges":[16],"initialProgressId":[1,"initial-progress-id"],"activeTabIndex":[1,"active-tab-index"],"currentIndex":[32],"slideWidth":[32],"slideHeight":[32],"isOneSlide":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"currentIndex":["onCurrentIndexChange"],"challenges":["onChallengesChange"],"initialProgressId":["onInitialProgressIdChange"]}],[0,"casino-challenge-overlay-background",{"empty":[4]}],[1,"casino-challenges-claim-code",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"domain":[513],"isMobile":[516,"is-mobile"],"loading":[32],"hasError":[32],"code":[32],"notificationMessage":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-empty-state",{"header":[1],"description":[1],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-loader",{"fullSize":[4,"full-size"],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-tabs",{"language":[513],"isMobile":[516,"is-mobile"],"activeTabIndex":[514,"active-tab-index"],"activeTabHasNotification":[516,"active-tab-has-notification"],"pendingTabHasNotification":[516,"pending-tab-has-notification"],"enabledWidgetTabs":[16]}],[4,"swipe-up",{"isMobile":[516,"is-mobile"],"isOneSlider":[516,"is-one-slider"],"progress":[32]},null,{"isOneSlider":["onIsOneSliderChange"],"progress":["onSwipeChange"]}],[0,"casino-challenge-details-levels",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isChallengePaused":[4,"is-challenge-paused"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-details-events",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[0,"casino-challenge-details-games",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"games":[16],"handleGameClick":[16]}],[0,"casino-challenge-details-progress-bar",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"]}],[0,"casino-challenge-details-rules",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-drawer-history-item",{"language":[513],"index":[514],"historyItem":[16],"itemRef":[16],"isOpen":[4,"is-open"],"isMobile":[4,"is-mobile"],"toggle":[16]}],[1,"casino-challenges-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"isOpen":[516,"is-open"],"showWinAnimation":[516,"show-win-animation"],"showBackdrop":[516,"show-backdrop"],"showCloseButton":[516,"show-close-button"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-overlay-card",{"challenge":[16],"index":[2],"arrLength":[2,"arr-length"],"currentIndex":[2,"current-index"],"language":[1],"isOptedOut":[4,"is-opted-out"],"slideWidth":[2,"slide-width"],"slideHeight":[2,"slide-height"],"timeLeft":[32]}],[4,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32]}],[0,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}]]]], options);
+  return index.bootstrapLazy([["casino-challenge-details-events_23.cjs",[[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],"extendedIngameWidget":[516,"extended-ingame-widget"],"enabledWidgetTabs":[32],"progress":[32],"displayedProgress":[32],"capsuleSize":[32],"showCompletedIcon":[32],"isPlayingLevelComplete":[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],"modalLevelsCount":[32],"modalIsFreeSpinsGranted":[32],"modalBonusProgramGames":[32],"showDrawer":[32],"init":[64]},[[1,"touchmove","handleTouchMove"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenges":["handleChallengesChange"]}],[1,"casino-challenges-overlay-drawer",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isOpen":[516,"is-open"],"handleClose":[16],"challenges":[16],"initialProgressId":[513,"initial-progress-id"],"enabledWidgetTabs":[16],"activeChallenge":[32],"activeProgressId":[32],"activeTabIndex":[32],"error":[32],"hasError":[32],"swipped":[32],"detailsSubPageInfo":[32],"progress":[32],"loading":[32],"notification":[32],"optOutModaIsOpen":[32],"isOptedOut":[32],"prevUpdateEvent":[32],"challengeGames":[32],"activeChallenges":[32],"pendingChallenges":[32],"promoChallenges":[32],"playerHistory":[32],"hasMorePlayerHistory":[32],"emptyState":[32]},[[0,"openOptOutModal","onOpenOptOut"],[0,"closeOptOutModal","onCloseOptOut"],[0,"confirmOptOut","onConfirmOptOut"],[0,"challengeExpired","onChallengeExpired"],[8,"message","handleEvent"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"isOpen":["handleIsOpenChange"],"activeChallenge":["onActiveChallengeChanged"]}],[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"],"isFreeSpinsGranted":[516,"is-free-spins-granted"],"levelsCount":[514,"levels-count"],"bonusProgramGames":[16],"currentIndex":[32],"isMobile":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"bonusProgramGames":["handleBonusProgramGameChange"]}],[1,"casino-challenges-overlay-drawer-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"challenge":[16],"isMobile":[516,"is-mobile"],"isUnique":[516,"is-unique"],"swipped":[516],"progress":[514],"activeChallengesTabIndex":[513,"active-challenges-tab-index"],"detailsSubPageInfo":[16],"isOptedOut":[516,"is-opted-out"],"challengeGames":[16],"swipping":[32],"actionLoading":[32],"error":[32],"isChallengePaused":[32],"timeLeft":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"progress":["onSwipeChange"],"challenge":["onChallengeChange"]}],[0,"casino-challenge-opt-out-modal",{"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[1,"casino-challenges-overlay-drawer-history",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"loading":[516],"hasMore":[516,"has-more"],"historyItems":[16],"openItems":[32],"pageSize":[32],"pageNumber":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"historyItems":["handlePlayerHistoryChange"]}],[1,"casino-challenges-overlay-slider",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isMobile":[516,"is-mobile"],"challenges":[16],"initialProgressId":[1,"initial-progress-id"],"activeTabIndex":[1,"active-tab-index"],"currentIndex":[32],"slideWidth":[32],"slideHeight":[32],"isOneSlide":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"currentIndex":["onCurrentIndexChange"],"challenges":["onChallengesChange"],"initialProgressId":["onInitialProgressIdChange"]}],[0,"casino-challenge-overlay-background",{"empty":[4]}],[1,"casino-challenges-claim-code",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"domain":[513],"isMobile":[516,"is-mobile"],"loading":[32],"hasError":[32],"code":[32],"notificationMessage":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-empty-state",{"header":[1],"description":[1],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-loader",{"fullSize":[4,"full-size"],"isMobile":[516,"is-mobile"]}],[0,"casino-challenges-overlay-tabs",{"language":[513],"isMobile":[516,"is-mobile"],"activeTabIndex":[514,"active-tab-index"],"activeTabHasNotification":[516,"active-tab-has-notification"],"pendingTabHasNotification":[516,"pending-tab-has-notification"],"enabledWidgetTabs":[16]}],[4,"swipe-up",{"isMobile":[516,"is-mobile"],"isOneSlider":[516,"is-one-slider"],"progress":[32]},null,{"isOneSlider":["onIsOneSliderChange"],"progress":["onSwipeChange"]}],[0,"casino-challenge-details-levels",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isChallengePaused":[4,"is-challenge-paused"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-details-events",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"open":[4]}],[0,"casino-challenge-details-games",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"games":[16],"handleGameClick":[16]}],[0,"casino-challenge-details-progress-bar",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"]}],[0,"casino-challenge-details-rules",{"challenge":[16],"language":[1],"isMobile":[4,"is-mobile"],"isOptedOut":[4,"is-opted-out"],"open":[4]}],[0,"casino-challenge-drawer-history-item",{"language":[513],"index":[514],"historyItem":[16],"itemRef":[16],"isOpen":[4,"is-open"],"isMobile":[4,"is-mobile"],"toggle":[16]}],[1,"casino-challenges-modal",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"isOpen":[516,"is-open"],"showWinAnimation":[516,"show-win-animation"],"showBackdrop":[516,"show-backdrop"],"showCloseButton":[516,"show-close-button"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"casino-challenges-overlay-card",{"challenge":[16],"index":[2],"arrLength":[2,"arr-length"],"currentIndex":[2,"current-index"],"language":[1],"isOptedOut":[4,"is-opted-out"],"slideWidth":[2,"slide-width"],"slideHeight":[2,"slide-height"],"timeLeft":[32]}],[4,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32]}],[0,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/assets/completed.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg"><path d="M1743.858 267.012 710.747 1300.124 176.005 765.382 0 941.387l710.747 710.871 1209.24-1209.116z" fill-rule="evenodd"/></svg>

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

@@ -7,6 +7,56 @@
   pointer-events: auto;
 }
 
+.effects-layer {
+  position: absolute;
+  inset: 0;
+  overflow: visible;
+  pointer-events: none;
+  z-index: 310;
+}
+.effects-layer .floating-gain {
+  position: absolute;
+  top: -9px;
+  left: 0;
+  white-space: nowrap;
+  pointer-events: none;
+  font-family: var(--emw--font-family-secondary, "Cherry Bomb One"), sans-serif;
+  font-size: var(--emw--font-size-2x-small, 10px);
+  background: var(--emw--color-badge-color, linear-gradient(103deg, #ff9400 16.9%, #fef746 95.33%, #ffe24a 95.96%));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  color: transparent;
+  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.7));
+}
+.effects-layer .mini-coin {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 6px;
+  height: 6px;
+  margin: -3px 0 0 -3px;
+  border-radius: 50%;
+  pointer-events: none;
+  background: var(--emw--color-mini-coin, radial-gradient(circle at 35% 30%, #fff7b0 0 18%, #ffd23a 40%, #e38a00 75%, #9a5a00 100%));
+  box-shadow: var(--emw--mini-coin-box-shadow, 0 0 3px rgba(255, 200, 40, 0.9));
+}
+.effects-layer .confetti {
+  position: absolute;
+  top: 0;
+  left: 0;
+  border-radius: 1px;
+  pointer-events: none;
+}
+
+@keyframes completed-icon-pop-in {
+  from {
+    transform: scale(0.2) rotate(-12deg);
+  }
+  to {
+    transform: scale(1) rotate(0);
+  }
+}
 .circle {
   display: inline-block;
   box-sizing: border-box;
@@ -14,7 +64,7 @@
   position: relative;
   background: conic-gradient(from 270deg at 50% 50%, transparent 0deg var(--progress), var(--emw--border-color, #a4d3b4) var(--progress) 360deg), var(--emw--color-active-progress, linear-gradient(103deg, #ff9400 16.9%, #fef746 95.33%, #ffe24a 95.96%)) no-repeat center/100% 100%;
   box-shadow: var(--emw--button-box-shadow, 0 4px 4px 0 rgba(0, 0, 0, 0.3019607843));
-  width: 55px;
+  width: 64px;
   height: 32px;
   padding: 4px 6px;
   isolation: isolate;
@@ -45,6 +95,20 @@
   mask: var(--join-icon-mask) no-repeat center/contain;
   filter: var(--emw--join-icon-box-shadow, drop-shadow(0 3px 4px rgba(0, 0, 0, 0.4)));
 }
+.circle__content .completed-icon {
+  width: 16px;
+  height: 16px;
+  background: var(--emw--color-join-icon, linear-gradient(101deg, #ff9400 12.92%, #ffe24a 72.12%, #fef746 99.3%));
+  -webkit-mask: var(--completed-icon-mask) no-repeat center/contain;
+  mask: var(--completed-icon-mask) no-repeat center/contain;
+  filter: var(--emw--join-icon-box-shadow, drop-shadow(0 3px 4px rgba(0, 0, 0, 0.4)));
+  animation: completed-icon-pop-in 500ms cubic-bezier(0.2, 1.7, 0.4, 1);
+}
+@media (prefers-reduced-motion: reduce) {
+  .circle__content .completed-icon {
+    animation: none;
+  }
+}
 .circle__img {
   position: absolute;
   left: 0;
@@ -131,7 +195,7 @@
   align-content: center;
   box-sizing: border-box;
   top: -5px;
-  left: 44px;
+  left: calc(100% - 11px);
   font-size: var(--emw--font-size-2x-small, 10px);
   line-height: 10px;
   font-weight: var(--emw--font-weight-normal, 400);

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

@@ -2,14 +2,30 @@ import { h } from "@stencil/core";
 import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
 import bgIcon from "../../assets/bg-icon.svg";
 import bellIcon from "../../assets/bell.svg";
+import completedIcon from "../../assets/completed.svg";
 import giftIcon from "../../assets/gift.svg";
 import joinIcon from "../../assets/join.svg";
 import { resolveTranslationUrl, translate } from "../../utils/locale.utils";
+import { ProgressAnimation } from "../../utils/progress-animation";
+import { COIN_CENTER, formatProgress, prefersReducedMotion } from "../../utils/progress-animation-helpers";
 import { EChallengeProgressLevelStatus, EChallengeProgressStatus, EChallengeRewardType, EChallengesTabs, EFeatureFlags } from "../../utils/types";
 import "../../../../../casino-challenges-overlay-modal/dist/types/index";
 import "../../../../../casino-challenges-overlay-drawer/dist/types/index";
+// Must match .circle (min-width, height) and the .circle::after inset in the stylesheet
+const CAPSULE_MIN_WIDTH = 55;
+const CAPSULE_HEIGHT = 32;
+const PROGRESS_BORDER_WIDTH = 3;
 export class CasinoChallengesOverlay {
     constructor() {
+        this.progressTarget = 100;
+        this.hadActiveProgress = false;
+        /** Set by the update that completed a level; the next render starts the level complete animation */
+        this.hasPendingLevelComplete = false;
+        this.progressAnimation = new ProgressAnimation({
+            getDisplayedProgress: () => this.displayedProgress,
+            setDisplayedProgress: (progress) => (this.displayedProgress = progress),
+            setCompletedIconVisible: (isVisible) => (this.showCompletedIcon = isVisible)
+        });
         this.updateChallengesArray = (challengeId, isEnabled, isExpired) => {
             this.challenges = this.challenges.map((challenge) => {
                 if (challenge.ChallengeId !== challengeId) {
@@ -66,6 +82,10 @@ export class CasinoChallengesOverlay {
         this.extendedIngameWidget = false;
         this.enabledWidgetTabs = undefined;
         this.progress = 0;
+        this.displayedProgress = 100;
+        this.capsuleSize = { width: CAPSULE_MIN_WIDTH, height: CAPSULE_HEIGHT };
+        this.showCompletedIcon = false;
+        this.isPlayingLevelComplete = false;
         this.isNew = false;
         this.isGift = false;
         this.isNotification = false;
@@ -147,6 +167,7 @@ export class CasinoChallengesOverlay {
                             return level;
                         if (newLevelData.ProgressPercentage === 100 && level.ProgressPercentage !== 100) {
                             this.completedLevelId = level.LevelId;
+                            this.hasPendingLevelComplete = true;
                         }
                         delete newLevelData.Rewards;
                         delete newLevelData.OrderNumber;
@@ -280,6 +301,16 @@ export class CasinoChallengesOverlay {
             if (this.clientStylingUrl)
                 setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
         }
+        this.observeCapsuleSize();
+        this.progressAnimation.attach({
+            capsule: this.circleElement,
+            coin: this.coinElement,
+            effectsLayer: this.effectsLayerElement
+        });
+    }
+    componentWillRender() {
+        // Evaluated once per batched render, so transient states set mid-handler are never animated
+        this.syncDisplayedProgress();
     }
     connectedCallback() {
         if (this.intervalId)
@@ -297,84 +328,140 @@ export class CasinoChallengesOverlay {
                 });
             }
         }, 1000);
+        // Re-attached after a disconnect; on the first connect the element isn't rendered yet
+        if (this.circleElement)
+            this.observeCapsuleSize();
     }
     disconnectedCallback() {
+        var _a;
         if (this.intervalId)
             clearInterval(this.intervalId);
         if (this.statusTimeoutId)
             clearTimeout(this.statusTimeoutId);
+        this.isPlayingLevelComplete = false;
+        this.progressAnimation.jumpToProgress(this.progressTarget);
+        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
     }
-    getCapsuleDotPosition(progress, width = 55, height = 32, borderWidth = 3) {
-        if (progress <= 0 || progress >= 100)
-            return null;
-        const r = (height - borderWidth) / 2;
-        const straight = width - 2 * r;
-        const arcLength = Math.PI * r;
+    observeCapsuleSize() {
+        var _a;
+        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        if (!this.circleElement || typeof ResizeObserver === 'undefined')
+            return;
+        this.resizeObserver = new ResizeObserver(([entry]) => {
+            var _a, _b, _c;
+            // borderBoxSize keeps fractional widths (offsetWidth rounds) and ignores ancestor transforms
+            const borderBox = (_a = entry.borderBoxSize) === null || _a === void 0 ? void 0 : _a[0];
+            const width = (_b = borderBox === null || borderBox === void 0 ? void 0 : borderBox.inlineSize) !== null && _b !== void 0 ? _b : this.circleElement.offsetWidth;
+            const height = (_c = borderBox === null || borderBox === void 0 ? void 0 : borderBox.blockSize) !== null && _c !== void 0 ? _c : this.circleElement.offsetHeight;
+            // Hidden (display: none) reports 0; keep the last real size
+            if (!width || !height)
+                return;
+            if (width === this.capsuleSize.width && height === this.capsuleSize.height)
+                return;
+            this.capsuleSize = { width, height };
+        });
+        this.resizeObserver.observe(this.circleElement);
+    }
+    getTargetProgress() {
+        if (this.inProgressCount <= 0)
+            return 100;
+        return this.completedLevelId ? 100 : this.progress;
+    }
+    syncDisplayedProgress() {
+        const target = this.getTargetProgress();
+        const hasActiveProgress = this.inProgressCount > 0;
+        const activeProgressToggled = hasActiveProgress !== this.hadActiveProgress;
+        this.hadActiveProgress = hasActiveProgress;
+        const previousTarget = this.progressTarget;
+        this.progressTarget = target;
+        if (this.hasPendingLevelComplete) {
+            this.hasPendingLevelComplete = false;
+            this.playLevelComplete(previousTarget);
+            return;
+        }
+        // Updates arriving during the jackpot (the next bet, another challenge) are only stored, so they
+        // don't cut it; the latest one is shown once it ends
+        if (this.isPlayingLevelComplete)
+            return;
+        if (target === previousTarget && !activeProgressToggled)
+            return;
+        // Only increases are animated: decreases (level reset, active challenge switch) and the
+        // full ring shown without active progress are applied instantly
+        if (activeProgressToggled || prefersReducedMotion() || target <= this.displayedProgress) {
+            this.progressAnimation.jumpToProgress(target);
+            return;
+        }
+        this.progressAnimation.animateProgress(previousTarget, target);
+    }
+    playLevelComplete(previousTarget) {
+        this.isPlayingLevelComplete = true;
+        this.progressAnimation.playLevelComplete(previousTarget, () => {
+            this.isPlayingLevelComplete = false;
+            // Shows the update held back during the jackpot; the join icon too, if no challenge is active any more
+            if (this.progressTarget !== this.displayedProgress)
+                this.progressAnimation.jumpToProgress(this.progressTarget);
+        });
+    }
+    /**
+     * Point at `progress`% of the ring's length, walked clockwise along the ring's centre line from the middle
+     * of the left edge, plus the matching conic-gradient angle so the fill edge passes exactly through the dot.
+     * Derived from the rendered capsule size, so it stays aligned when the capsule widens for longer labels.
+     */
+    getProgressBorderPoint(progress) {
+        const { width, height } = this.capsuleSize;
+        const r = (height - PROGRESS_BORDER_WIDTH) / 2;
+        const cy = height / 2;
+        const leftCx = height / 2;
+        const rightCx = Math.max(width - height / 2, leftCx);
+        const top = PROGRESS_BORDER_WIDTH / 2;
+        const bottom = height - PROGRESS_BORDER_WIDTH / 2;
+        const straight = rightCx - leftCx;
+        const quarterArc = (Math.PI * r) / 2;
         const segments = [
-            {
-                type: 'arc',
-                length: arcLength / 2,
-                startTheta: Math.PI,
-                endTheta: Math.PI + 1.6,
-                cx: r + borderWidth / 2,
-                cy: height / 2
-            },
-            {
-                type: 'line',
-                length: straight,
-                x0: r + borderWidth / 2,
-                y0: borderWidth / 2,
-                x1: width - r - borderWidth / 2,
-                y1: borderWidth / 2
-            },
-            {
-                type: 'arc',
-                length: arcLength,
-                startTheta: -Math.PI / 2,
-                endTheta: Math.PI / 2,
-                cx: width - r - borderWidth / 2,
-                cy: height / 2
-            },
-            {
-                type: 'line',
-                length: straight,
-                x0: width - r - borderWidth / 2,
-                y0: height - borderWidth / 2,
-                x1: r + borderWidth / 2,
-                y1: height - borderWidth / 2
-            },
-            {
-                type: 'arc',
-                length: arcLength / 2,
-                startTheta: Math.PI / 2,
-                endTheta: Math.PI,
-                cx: r + borderWidth / 2,
-                cy: height / 2
-            }
+            { type: 'arc', length: quarterArc, startTheta: Math.PI, endTheta: 1.5 * Math.PI, cx: leftCx },
+            { type: 'line', length: straight, x0: leftCx, y0: top, x1: rightCx, y1: top },
+            { type: 'arc', length: 2 * quarterArc, startTheta: -Math.PI / 2, endTheta: Math.PI / 2, cx: rightCx },
+            { type: 'line', length: straight, x0: rightCx, y0: bottom, x1: leftCx, y1: bottom },
+            { type: 'arc', length: quarterArc, startTheta: Math.PI / 2, endTheta: Math.PI, cx: leftCx }
         ];
         const perimeter = segments.reduce((sum, s) => sum + s.length, 0);
-        const L = (progress / 100) * perimeter;
+        const L = (Math.min(Math.max(progress, 0), 100) / 100) * perimeter;
         let traveled = 0;
-        let x = 0;
-        let y = 0;
+        let x = leftCx - r;
+        let y = cy;
         for (const seg of segments) {
             if (L <= traveled + seg.length) {
-                const t = (L - traveled) / seg.length;
+                const t = seg.length ? (L - traveled) / seg.length : 0;
                 if (seg.type === 'line') {
                     x = seg.x0 + t * (seg.x1 - seg.x0);
                     y = seg.y0 + t * (seg.y1 - seg.y0);
                 }
-                else if (seg.type === 'arc') {
+                else {
                     const theta = seg.startTheta + t * (seg.endTheta - seg.startTheta);
                     x = seg.cx + r * Math.cos(theta);
-                    y = seg.cy + r * Math.sin(theta);
+                    y = cy + r * Math.sin(theta);
                 }
                 break;
             }
             traveled += seg.length;
         }
-        return { x, y };
+        // The conic-gradient starts at 270deg (left) around the centre, so its angles are offset by 90deg from
+        // atan2's "clockwise from top"
+        let angle = progress >= 100 ? 360 : 0;
+        if (progress > 0 && progress < 100) {
+            angle = ((Math.atan2(x - width / 2, cy - y) * 180) / Math.PI + 90 + 360) % 360;
+        }
+        return { x, y, angle };
+    }
+    renderCapsuleContent(hasActiveProgress) {
+        if (this.showCompletedIcon) {
+            return h("span", { class: "completed-icon", style: { '--completed-icon-mask': `url(${completedIcon})` } });
+        }
+        if (hasActiveProgress || this.isPlayingLevelComplete) {
+            return h("span", null, formatProgress(this.displayedProgress), "%");
+        }
+        return h("span", { class: "join-icon", style: { '--join-icon-mask': `url(${joinIcon})` } });
     }
     renderBadgeContent() {
         if (this.isNew)
@@ -398,24 +485,23 @@ export class CasinoChallengesOverlay {
     }
     render() {
         var _a, _b, _c;
-        let currProgress = this.completedLevelId ? 100 : this.progress;
-        const dot = this.getCapsuleDotPosition(currProgress);
+        const progressPoint = this.getProgressBorderPoint(this.displayedProgress);
+        const showDot = this.displayedProgress > 0 && this.displayedProgress < 100;
         const hasActiveProgress = this.inProgressCount > 0;
         const activeProgressId = hasActiveProgress
             ? (_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id
             : (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.find(this.isActiveChallenge)) === null || _c === void 0 ? void 0 : _c.Id;
-        if (!hasActiveProgress) {
-            currProgress = 100;
-        }
-        return (h("div", { key: '5095b235d5089a4870c215160f1924961011b48d', ref: (el) => (this.stylingContainer = el) }, h("div", { key: '08ae3059ec6b0efcac1bfc6d55543301fa779f74', class: "container", onClick: this.handleClick }, h("div", { key: '1cacf660393bbc356906b54e765cade784c7b7ed', class: "circle", style: {
-                '--progress': `${currProgress}%`
-            } }, h("img", { key: 'ff57353e028d28cbd962787b903d6e1a524f40b0', class: "circle__img", src: bgIcon }), h("div", { key: 'eb10f9a37fafc101d4b4858262a07fbce4db6186', class: "circle__content" }, hasActiveProgress ? (h("span", null, Math.floor(currProgress), "%")) : (h("span", { class: "join-icon", style: { '--join-icon-mask': `url(${joinIcon})` } }))), dot && (h("div", { key: '5a65397c8eba680f6e41372d66dde3292c4ad38f', class: "dot", style: {
-                left: `${dot.x}px`,
-                top: `${dot.y}px`
-            } }))), hasActiveProgress && (h("div", { key: 'dc81658acbc33522503dad575f31f7be22c8b20a', class: {
+        return (h("div", { key: '174f49a7b806a895a532b0e1e53bf359f9abc3d4', ref: (el) => (this.stylingContainer = el) }, h("div", { key: '4237b797ad185055025f41d899920f40b53eabcc', class: "container", onClick: this.handleClick }, h("div", { key: 'e57760df4c6f158465683ebfa7e45ab2afd11da0', class: "circle", ref: (el) => (this.circleElement = el), style: {
+                '--progress': `${progressPoint.angle}deg`
+            } }, h("img", { key: '5423655e18a029c1493607d6d67211ffba795c59', class: "circle__img", ref: (el) => (this.coinElement = el), src: bgIcon,
+            // Turns the wobble and spin around the coin drawn in the image, not the image centre
+            style: { transformOrigin: `${COIN_CENTER.x}px ${COIN_CENTER.y}px` } }), h("div", { key: '0b65ba49f12e2cfb5196c7b24814f71c447701db', class: "circle__content" }, this.renderCapsuleContent(hasActiveProgress)), showDot && (h("div", { key: 'd08d38321d23c55aaba7f6a4f3990fc3fc318e50', class: "dot", style: {
+                left: `${progressPoint.x}px`,
+                top: `${progressPoint.y}px`
+            } }))), hasActiveProgress && (h("div", { key: '7ca2960301bfb5f59ce3afac2a260cf26e48ccc3', class: {
                 badge: true,
                 new: this.isNew
-            } }, this.renderBadgeContent()))), h("casino-challenges-overlay-modal", { key: '3cba3358fe3c9cef74c3c67bbb228aa24f29f4aa', isOpen: this.showModal, handleClick: this.closeModal, reward: this.modalReward, addition: this.modalAddition, isFreeSpinsGranted: this.modalIsFreeSpinsGranted, bonusProgramGames: this.modalBonusProgramGames, errored: this.modalErrored, orderNumber: this.modalOrderNumber, levelsCount: this.modalLevelsCount, translationUrl: this.translationUrl, language: this.language, mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl }), this.extendedIngameWidget && (h("casino-challenges-overlay-drawer", { key: '98f9cd5ec537c8332a15a83f3d56509d1e60dbb2', mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, isOpen: this.showDrawer, handleClose: this.closeDrawer, challenges: this.challenges, initialProgressId: activeProgressId, enabledWidgetTabs: this.enabledWidgetTabs }))));
+            } }, this.renderBadgeContent())), h("div", { key: 'f96408dcee5e1abea640a6c67c65a9dbb899f638', class: "effects-layer", ref: (el) => (this.effectsLayerElement = el) })), h("casino-challenges-overlay-modal", { key: 'a45405d907326da9b1b3ccd55085ed287ddfca4e', isOpen: this.showModal, handleClick: this.closeModal, reward: this.modalReward, addition: this.modalAddition, isFreeSpinsGranted: this.modalIsFreeSpinsGranted, bonusProgramGames: this.modalBonusProgramGames, errored: this.modalErrored, orderNumber: this.modalOrderNumber, levelsCount: this.modalLevelsCount, translationUrl: this.translationUrl, language: this.language, mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl }), this.extendedIngameWidget && (h("casino-challenges-overlay-drawer", { key: '43c2c0f90c5bf3b4c78aa2b66ce2e100eec05ead', mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, isOpen: this.showDrawer, handleClose: this.closeDrawer, challenges: this.challenges, initialProgressId: activeProgressId, enabledWidgetTabs: this.enabledWidgetTabs }))));
     }
     static get is() { return "casino-challenges-overlay"; }
     static get encapsulation() { return "shadow"; }
@@ -563,6 +649,10 @@ export class CasinoChallengesOverlay {
         return {
             "enabledWidgetTabs": {},
             "progress": {},
+            "displayedProgress": {},
+            "capsuleSize": {},
+            "showCompletedIcon": {},
+            "isPlayingLevelComplete": {},
             "isNew": {},
             "isGift": {},
             "isNotification": {},