@everymatrix/casino-challenge-details 0.3.12 → 0.3.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/casino-challenge-details/casino-challenge-details-00cd9c3e.js +1 -0
  2. package/dist/casino-challenge-details/casino-challenge-details.esm.js +1 -1
  3. package/dist/casino-challenge-details/casino-challenge-details_4.entry.js +1 -1
  4. package/dist/casino-challenge-details/index.esm.js +1 -1
  5. package/dist/cjs/{casino-challenge-details-53cea171.js → casino-challenge-details-7465690c.js} +123 -61
  6. package/dist/cjs/casino-challenge-details.cjs.js +1 -1
  7. package/dist/cjs/casino-challenge-details_4.cjs.entry.js +16 -13
  8. package/dist/cjs/index.cjs.js +1 -1
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/collection/components/casino-challenge-details/casino-challenge-details.css +1 -0
  11. package/dist/collection/components/casino-challenge-details/casino-challenge-details.js +108 -52
  12. package/dist/collection/components/components/casino-challenge-progress-bar.js +16 -13
  13. package/dist/collection/utils/locale.utils.js +5 -0
  14. package/dist/collection/utils/types.js +18 -10
  15. package/dist/esm/{casino-challenge-details-d1763400.js → casino-challenge-details-00cd9c3e.js} +124 -62
  16. package/dist/esm/casino-challenge-details.js +1 -1
  17. package/dist/esm/casino-challenge-details_4.entry.js +17 -14
  18. package/dist/esm/index.js +1 -1
  19. package/dist/esm/loader.js +1 -1
  20. package/dist/types/components/casino-challenge-details/casino-challenge-details.d.ts +5 -0
  21. package/dist/types/utils/types.d.ts +15 -6
  22. package/package.json +1 -1
  23. package/dist/casino-challenge-details/casino-challenge-details-d1763400.js +0 -1
package/dist/cjs/{casino-challenge-details-53cea171.js → casino-challenge-details-7465690c.js} RENAMED
@@ -76,6 +76,7 @@ const TRANSLATIONS = {
76
76
  finished: 'Finished',
77
77
  suspended: 'Suspended',
78
78
  completed: 'Completed',
79
+ unavailable: 'Unavailable',
79
80
  start: 'Start',
80
81
  resume: 'Resume',
81
82
  pause: 'Pause',
@@ -104,6 +105,7 @@ const TRANSLATIONS = {
104
105
  finished: 'Terminat',
105
106
  suspended: 'Suspendat',
106
107
  start: 'Start',
108
+ unavailable: 'Indisponibil',
107
109
  resume: 'Reia',
108
110
  pause: 'Pauză',
109
111
  join: 'Alătură-te pentru a începe',
@@ -131,6 +133,7 @@ const TRANSLATIONS = {
131
133
  finished: 'Terminé',
132
134
  suspended: 'Suspendu',
133
135
  start: 'Démarrer',
136
+ unavailable: 'Indisponible',
134
137
  resume: 'Reprendre',
135
138
  pause: 'Pause',
136
139
  join: 'Rejoindre pour commencer',
@@ -158,6 +161,7 @@ const TRANSLATIONS = {
158
161
  finished: 'منتهي',
159
162
  suspended: 'معلق',
160
163
  start: 'ابدأ',
164
+ unavailable: 'غير متاح',
161
165
  resume: 'استئناف',
162
166
  pause: 'إيقاف مؤقت',
163
167
  join: 'انضم للبدء',
@@ -185,6 +189,7 @@ const TRANSLATIONS = {
185
189
  finished: 'Završeno',
186
190
  suspended: 'Suspendirano',
187
191
  start: 'Počni',
192
+ unavailable: 'nedostupan',
188
193
  resume: 'Nastavi',
189
194
  pause: 'Pauza',
190
195
  join: 'Pridruži se za početak',
@@ -292,23 +297,31 @@ var EChallengeRewardType;
292
297
  EChallengeRewardType[EChallengeRewardType["Challenge"] = 3] = "Challenge";
293
298
  EChallengeRewardType[EChallengeRewardType["Custom"] = 4] = "Custom";
294
299
  })(EChallengeRewardType || (EChallengeRewardType = {}));
300
+ exports.EChallengeProgressLevelStatus = void 0;
301
+ (function (EChallengeProgressLevelStatus) {
302
+ EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Closed"] = 0] = "Closed";
303
+ EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["InProgress"] = 1] = "InProgress";
304
+ EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Fillup"] = 2] = "Fillup";
305
+ EChallengeProgressLevelStatus[EChallengeProgressLevelStatus["Completed"] = 3] = "Completed";
306
+ })(exports.EChallengeProgressLevelStatus || (exports.EChallengeProgressLevelStatus = {}));
295
307
  exports.EChallengeProgressStatus = void 0;
296
308
  (function (EChallengeProgressStatus) {
297
- EChallengeProgressStatus[EChallengeProgressStatus["Closed"] = 0] = "Closed";
309
+ EChallengeProgressStatus[EChallengeProgressStatus["Started"] = 0] = "Started";
298
310
  EChallengeProgressStatus[EChallengeProgressStatus["InProgress"] = 1] = "InProgress";
299
- EChallengeProgressStatus[EChallengeProgressStatus["Fillup"] = 2] = "Fillup";
311
+ EChallengeProgressStatus[EChallengeProgressStatus["PendingLevelReward"] = 2] = "PendingLevelReward";
300
312
  EChallengeProgressStatus[EChallengeProgressStatus["Completed"] = 3] = "Completed";
313
+ EChallengeProgressStatus[EChallengeProgressStatus["Expired"] = 4] = "Expired";
314
+ EChallengeProgressStatus[EChallengeProgressStatus["Forfeited"] = 5] = "Forfeited";
315
+ EChallengeProgressStatus[EChallengeProgressStatus["Awaiting"] = 6] = "Awaiting";
316
+ EChallengeProgressStatus[EChallengeProgressStatus["Paused"] = 7] = "Paused";
301
317
  })(exports.EChallengeProgressStatus || (exports.EChallengeProgressStatus = {}));
302
318
  exports.EChallengeStatus = void 0;
303
319
  (function (EChallengeStatus) {
304
- EChallengeStatus[EChallengeStatus["Started"] = 0] = "Started";
305
- EChallengeStatus[EChallengeStatus["InProgress"] = 1] = "InProgress";
306
- EChallengeStatus[EChallengeStatus["PendingLevelReward"] = 2] = "PendingLevelReward";
307
- EChallengeStatus[EChallengeStatus["Completed"] = 3] = "Completed";
308
- EChallengeStatus[EChallengeStatus["Expired"] = 4] = "Expired";
309
- EChallengeStatus[EChallengeStatus["Forfeited"] = 5] = "Forfeited";
310
- EChallengeStatus[EChallengeStatus["Awaiting"] = 6] = "Awaiting";
311
- EChallengeStatus[EChallengeStatus["Paused"] = 7] = "Paused";
320
+ EChallengeStatus[EChallengeStatus["Draft"] = 0] = "Draft";
321
+ EChallengeStatus[EChallengeStatus["Enabled"] = 1] = "Enabled";
322
+ EChallengeStatus[EChallengeStatus["Paused"] = 2] = "Paused";
323
+ EChallengeStatus[EChallengeStatus["Closed"] = 3] = "Closed";
324
+ EChallengeStatus[EChallengeStatus["Deleted"] = 4] = "Deleted";
312
325
  })(exports.EChallengeStatus || (exports.EChallengeStatus = {}));
313
326
  const ChallengeStatusDictionary = [
314
327
  'started',
@@ -332,7 +345,7 @@ var EChallengeValidityType;
332
345
  EChallengeValidityType[EChallengeValidityType["Date"] = 1] = "Date";
333
346
  })(EChallengeValidityType || (EChallengeValidityType = {}));
334
347
 
335
- const casinoChallengeDetailsCss = ".container {\n font-family: var(--emw--font-family-secondary, \"Montserrat\", sans-serif);\n background: var(--emw--color-background, #000);\n min-height: 100vh;\n padding-top: 16px;\n container-type: inline-size;\n container-name: challenges-details;\n min-width: 375px;\n width: 100%;\n margin: 0 auto;\n}\n\n.challenges-header {\n display: none;\n}\n\n.back-button {\n display: flex;\n align-items: center;\n padding: 14px 0 14px 10px;\n outline: none;\n background: var(--emw--color-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n border: none;\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n cursor: pointer;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.back-button__icon {\n margin: 0 4px;\n}\n.back-button__text {\n margin-left: 4px;\n}\n\n.details {\n min-width: 308px;\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n padding: 16px;\n min-width: 375px;\n width: 100%;\n}\n.details.grayed {\n opacity: 0.5;\n}\n.details__general-info {\n max-width: 344px;\n padding-bottom: 16px;\n}\n.details__general-info-image-container {\n position: relative;\n margin-bottom: 22px;\n}\n.details__general-info-image {\n display: block;\n width: 344px;\n height: 226px;\n border-radius: var(--emw--border-radius-medium, 16px);\n}\n.details__general-info-image.grayed {\n opacity: 0.5;\n}\n.details__general-info-timer-badge {\n position: absolute;\n background: var(--emw--color-white, #fff);\n top: 6px;\n right: 6px;\n border-radius: var(--emw--border-radius-large, 30px);\n padding: 2px 12px;\n line-height: 22px;\n font-weight: var(--emw--font-weight-medium, 500);\n font-size: var(--emw--font-size-x-small, 12px);\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\n backdrop-filter: blur(20px);\n}\n.details__general-info-timer-badge span {\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.expired {\n background: var(--emw--background-gray-color, rgba(250, 250, 250, 0.5019607843));\n border: 1px solid var(--emw--border-gray-color, #292c29);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.completed {\n background: var(--emw--background-success-color, #c9f0d7);\n border: 1px solid var(--emw--border-success-color, #00b74f);\n color: var(--emw--color-gray-300, #083b17);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.forfeited {\n background: var(--emw--background-errored-color, #ffe1df);\n border: 1px solid var(--emw--border-errored-color, #d6421e);\n color: var(--emw--errored-color, #850606);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.paused {\n background: var(--emw--background-warning-color, #f8e4ad);\n border: 1px solid var(--emw--border-warning-color, #ea9018);\n color: var(--emw--warning-color, #6d460a);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-title {\n margin: 0 0 4px;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-large, 20px);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-end-date_label {\n color: var(--emw--color-gray-150, #727672);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n margin: 0;\n}\n.details__general-info-end-date_value {\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-action-button,\n.details .footer-action-button {\n width: 100%;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n border-radius: var(--emw--button-border-radius, 99px);\n border: 2px solid var(--emw--button-border-color, #083b17);\n background: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n text-align: center;\n text-transform: uppercase;\n font-weight: var(--emw--font-weight-bold, 700);\n height: 51px;\n padding: 16px 32px;\n display: flex;\n justify-content: center;\n align-items: center;\n align-self: stretch;\n gap: 10px;\n}\n.details__general-info-action-button:hover,\n.details .footer-action-button:hover {\n border-color: var(--emw--color-secondary, #083b17);\n cursor: pointer;\n}\n.details__general-info-action-button.filled,\n.details .footer-action-button.filled {\n background-color: var(--emw--button-background-primary-color, #18ce51);\n color: var(--emw--color-white, #fff);\n border-color: var(--emw--color-gray-300, #083b17);\n}\n.details__general-info-action-button.filled:hover,\n.details .footer-action-button.filled:hover {\n border-color: transparent;\n box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.details__general-info-action-button.grayed,\n.details .footer-action-button.grayed {\n color: var(--emw--color-gray-50, #e2e2e2);\n background: var(--emw--color-black-150, #000000);\n border-color: var(--emw--button-disabled-border-color, #727672);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.details__general-info-action-button.grayed:hover,\n.details .footer-action-button.grayed:hover {\n color: var(--emw--color-white, #fff);\n}\n.details__general-info-action-button:disabled, .details__general-info-action-button:disabled:hover,\n.details .footer-action-button:disabled,\n.details .footer-action-button:disabled:hover {\n color: var(--emw--color-gray-50, #e2e2e2);\n cursor: not-allowed;\n border: 2px solid var(--emw--button-disabled-border-color, #727672);\n opacity: 0.7;\n}\n.details .footer-action-button {\n height: 44px;\n padding: 14px 20px;\n font-size: var(--emw--font-size-sm, 14px);\n}\n.details__general-info-action-button {\n display: none;\n margin-top: 32px;\n}\n.details__tabs-container {\n flex-grow: 1;\n max-width: 100%;\n}\n.details__tabs {\n position: relative;\n display: flex;\n justify-content: flex-start;\n border-bottom: 1px solid var(--emw--border-warning-color, #ea9018);\n}\n.details__tab {\n padding: 10px 20px;\n cursor: pointer;\n position: relative;\n font-weight: var(--emw--font-weight-medium, 500);\n color: var(--emw--color-gray-300, #555);\n display: flex;\n width: 33.3333333333%;\n padding: 12px 10px;\n justify-content: center;\n align-items: center;\n gap: 10px;\n}\n.details__tab.active {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n background: var(--emw--active-tab, linear-gradient(180deg, #ea9018 0%, #e0a84e 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.details__tab {\n color: var(--emw--color-gray-100, #727672);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n}\n.details__tab:nth-of-type(1).active ~ .active-tab-indicator {\n left: 0;\n width: 33.3333333333%;\n}\n.details__tab:nth-of-type(2).active ~ .active-tab-indicator {\n left: 33.3333333333%;\n width: 33.3333333333%;\n}\n.details__tab:nth-of-type(3).active ~ .active-tab-indicator {\n left: 66.6666666667%;\n width: 33.3333333333%;\n}\n.details .active-tab-indicator {\n position: absolute;\n bottom: -3px;\n height: 2px;\n background: var(--emw--active-tab-indicator, linear-gradient(180deg, rgba(234, 144, 24, 0.7) 0%, rgba(224, 168, 78, 0.7) 100%), #727672);\n transition: left 0.3s ease, width 0.3s ease;\n}\n.details .levels__tab {\n margin-top: 22px;\n display: flex;\n gap: 12px;\n flex-direction: column;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .level {\n display: flex;\n padding: 20px;\n flex-direction: column;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background-color: var(--emw--color-background, rgba(114, 118, 114, 0.2));\n}\n.details .level.grayed {\n background: rgba(114, 118, 114, 0.15);\n}\n.details .level.active {\n background: linear-gradient(90deg, rgba(30, 101, 79, 0.2) 0%, rgba(28, 141, 86, 0.2) 100%);\n border: 2px solid var(--Gradient-Blue, #003e5c);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.details .level.completed {\n background: linear-gradient(90deg, rgba(0, 62, 92, 0.3) 0.05%, rgba(17, 59, 33, 0.3) 87.69%);\n}\n.details .level__status {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n}\n.details .level__title {\n width: 100%;\n display: flex;\n justify-content: space-between;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n margin-bottom: 10px;\n}\n.details .level__title .completed, .details .level__title .in-progress {\n color: var(--emw--color-valid, #00b74f);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n text-align: right;\n line-height: 22px;\n}\n.details .level__title.grayed {\n color: var(--emw--disabled-color, #727672);\n}\n.details .level__progress {\n width: 100%;\n margin-bottom: 10px;\n}\n.details .level__icon {\n display: flex;\n margin: 5px 6px 5px 0;\n opacity: 1;\n}\n.details .level__icon img {\n display: block;\n width: 12px;\n height: 12px;\n}\n.details .level__icon img.grayed {\n opacity: 0.5;\n}\n.details .level__bonus, .details .level__target {\n display: flex;\n align-items: flex-start;\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n margin-bottom: 4px;\n}\n.details .level__value {\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.details .level__value.grayed {\n opacity: 0.5;\n}\n.details .games__tab {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n padding: 22px 0;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .games__tab .game {\n position: relative;\n width: 105px;\n height: 85px;\n}\n.details .games__tab .game img {\n width: 100%;\n height: 100%;\n border-radius: var(--emw--border-radius-medium, 16px);\n}\n.details .games__tab .game .contribution {\n position: absolute;\n top: 4px;\n right: 4px;\n color: var(--emw--color-white, #fff);\n border-radius: var(--emw--border-radius-small, 12px);\n border: 1px solid var(--Gradient-Blue, #003e5c);\n background: rgba(0, 0, 0, 0.5);\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\n backdrop-filter: blur(5px);\n padding: 0 8px;\n font-size: var(--emw--font-size-2x-small, 8px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 22px;\n text-align: center;\n}\n.details .rules__tab {\n display: flex;\n flex-direction: column;\n padding: 22px 0;\n gap: 8px;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .rules__tab .rule {\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: 500;\n line-height: 24px;\n}\n.details .rules__tab .link {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n background: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n padding: 14px 0;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.details__button {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n flex: 1 0 0;\n height: 42px;\n padding: 14px 20px;\n border-radius: var(--emw--button-border-radius, 99px);\n border: 2px solid var(--emw--button-border-color, #083b17);\n background-color: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n}\n\n.button__container {\n position: fixed;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n display: flex;\n width: calc(100% - 32px);\n padding: 16px 16px 22px 16px;\n justify-content: center;\n align-items: center;\n gap: 4px;\n border-top: 1px solid var(--emw--color-blue, #003e5c);\n background: var(--emw--color-background, #000);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n\n.lds-dual-ring {\n display: block;\n width: 80px;\n height: 80px;\n margin: 80px auto 0 auto;\n}\n\n.lds-dual-ring:after {\n content: \" \";\n display: block;\n width: 64px;\n height: 64px;\n margin: 8px;\n border-radius: 50%;\n border: 6px solid var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e));\n border-color: var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e)) transparent var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e));\n animation: lds-dual-ring 1.2s linear infinite;\n}\n\n@keyframes lds-dual-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.notification {\n display: flex;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background: rgba(188, 252, 177, 0.1);\n display: flex;\n padding: 16px;\n align-items: flex-start;\n gap: 10px;\n margin: 16px 16px 22px 16px;\n}\n.notification__icon {\n margin-top: 2px;\n}\n.notification__message, .notification__title {\n color: var(--emw--color-gray-50, #e2e2e2);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.notification__title {\n background: var(--emw--color-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.notification__column {\n display: flex;\n flex-direction: column;\n}\n\n@container challenges-details (min-width: 768px) {\n .button__container {\n display: none;\n }\n .details {\n gap: 36px;\n flex-wrap: nowrap;\n }\n .details__general-info-action-button {\n display: flex;\n }\n .details__general-info-image {\n width: 380px;\n min-height: 226px;\n height: auto;\n }\n .details__general-info {\n max-width: 380px;\n }\n .details__tabs__container {\n max-width: calc(100% - 380px);\n }\n .details .levels__tab {\n gap: 20px;\n height: 60vh;\n }\n .details .levels__tab .level__icon {\n width: 14px;\n height: 14px;\n margin: 4px 6px 4px 0px;\n }\n .details .levels__tab .level__icon img {\n width: 100%;\n height: 100%;\n }\n .details .levels__tab .level__title {\n font-size: var(--emw--font-size-medium, 16px);\n }\n .details .levels__tab .level__title .completed, .details .levels__tab .level__title .in-progress {\n font-size: var(--emw--font-size-sm, 14px);\n }\n .details .levels__tab .level__bonus, .details .levels__tab .level__target, .details .levels__tab .level__value {\n font-size: var(--emw--font-size-sm, 14px);\n }\n .details .games__tab, .details .rules__tab {\n height: 60vh;\n }\n .details .games__tab {\n gap: 20px;\n min-width: 340px;\n }\n .details .games__tab .game {\n width: 160px;\n height: 110px;\n }\n .details .games__tab .game .contribution {\n top: 8px;\n right: 8px;\n padding: 4px 10px;\n font-size: var(--emw--font-size-2x-small, 10px);\n line-height: 18px;\n }\n .challenges-header {\n margin: 0 0 32px;\n display: flex;\n justify-content: space-between;\n }\n .challenges-title {\n margin: 0;\n display: flex;\n gap: 10px;\n align-items: center;\n font-size: var(--emw--font-size-x-large, 24px);\n font-weight: var(--emw--font-weight-bold, 700);\n color: var(--emw--color-white, #ffffff);\n }\n .challenges-tabs {\n display: flex;\n gap: 12px;\n border-radius: 48px;\n padding: 6px;\n color: var(--emw--color-gray-150, #c8d6ce);\n background-color: var(--emw--color-background-secondary, #272727);\n }\n .challenges-tab {\n padding: 10px 16px;\n border-radius: 40px;\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n cursor: pointer;\n text-align: center;\n width: 95px;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n }\n .challenges-tab.active {\n color: var(--emw--color-white, #ffffff);\n background: linear-gradient(90deg, rgb(0, 62, 92) 0%, rgb(17, 59, 33) 100%);\n }\n .challenges-tab:last-child {\n width: inherit;\n padding: 10px 16px;\n }\n}";
348
+ const casinoChallengeDetailsCss = ".container {\n font-family: var(--emw--font-family-secondary, \"Montserrat\", sans-serif);\n background: var(--emw--color-background, #000);\n min-height: 100vh;\n padding-top: 16px;\n container-type: inline-size;\n container-name: challenges-details;\n min-width: 375px;\n width: 100%;\n margin: 0 auto;\n}\n\n.challenges-header {\n display: none;\n}\n\n.back-button {\n display: flex;\n align-items: center;\n padding: 14px 0 14px 10px;\n outline: none;\n background: var(--emw--color-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n border: none;\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n cursor: pointer;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.back-button__icon {\n margin: 0 4px;\n}\n.back-button__text {\n margin-left: 4px;\n}\n\n.details {\n min-width: 308px;\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n padding: 16px;\n min-width: 375px;\n width: 100%;\n}\n.details.grayed {\n opacity: 0.5;\n}\n.details__general-info {\n max-width: 344px;\n padding-bottom: 16px;\n}\n.details__general-info-image-container {\n position: relative;\n margin-bottom: 22px;\n}\n.details__general-info-image {\n display: block;\n width: 344px;\n height: 226px;\n border-radius: var(--emw--border-radius-medium, 16px);\n}\n.details__general-info-image.grayed {\n opacity: 0.5;\n}\n.details__general-info-timer-badge {\n position: absolute;\n background: var(--emw--color-white, #fff);\n top: 6px;\n right: 6px;\n border-radius: var(--emw--border-radius-large, 30px);\n padding: 2px 12px;\n line-height: 22px;\n font-weight: var(--emw--font-weight-medium, 500);\n font-size: var(--emw--font-size-x-small, 12px);\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\n backdrop-filter: blur(20px);\n}\n.details__general-info-timer-badge span {\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.expired {\n background: var(--emw--background-gray-color, rgba(250, 250, 250, 0.5019607843));\n border: 1px solid var(--emw--border-gray-color, #292c29);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.completed {\n background: var(--emw--background-success-color, #c9f0d7);\n border: 1px solid var(--emw--border-success-color, #00b74f);\n color: var(--emw--color-gray-300, #083b17);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.forfeited {\n background: var(--emw--background-errored-color, #ffe1df);\n border: 1px solid var(--emw--border-errored-color, #d6421e);\n color: var(--emw--errored-color, #850606);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-timer-badge.paused {\n background: var(--emw--background-warning-color, #f8e4ad);\n border: 1px solid var(--emw--border-warning-color, #ea9018);\n color: var(--emw--warning-color, #6d460a);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-title {\n margin: 0 0 4px;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-large, 20px);\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-end-date_label {\n color: var(--emw--color-gray-150, #727672);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n margin: 0;\n}\n.details__general-info-end-date_value {\n font-weight: var(--emw--font-weight-bold, 700);\n}\n.details__general-info-action-button,\n.details .footer-action-button {\n width: 100%;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n border-radius: var(--emw--button-border-radius, 99px);\n border: 2px solid var(--emw--button-border-color, #083b17);\n background: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n text-align: center;\n text-transform: uppercase;\n font-weight: var(--emw--font-weight-bold, 700);\n height: 51px;\n padding: 16px 32px;\n display: flex;\n justify-content: center;\n align-items: center;\n align-self: stretch;\n gap: 10px;\n}\n.details__general-info-action-button:hover,\n.details .footer-action-button:hover {\n border-color: var(--emw--color-secondary, #083b17);\n cursor: pointer;\n}\n.details__general-info-action-button.filled,\n.details .footer-action-button.filled {\n background-color: var(--emw--button-background-primary-color, #18ce51);\n color: var(--emw--color-white, #fff);\n border-color: var(--emw--color-gray-300, #083b17);\n}\n.details__general-info-action-button.filled:hover,\n.details .footer-action-button.filled:hover {\n border-color: transparent;\n box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.details__general-info-action-button.grayed,\n.details .footer-action-button.grayed {\n color: var(--emw--color-gray-50, #e2e2e2);\n background: var(--emw--color-black-150, #000000);\n border-color: var(--emw--button-disabled-border-color, #727672);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.details__general-info-action-button.grayed:hover,\n.details .footer-action-button.grayed:hover {\n color: var(--emw--color-white, #fff);\n}\n.details__general-info-action-button:disabled, .details__general-info-action-button:disabled:hover,\n.details .footer-action-button:disabled,\n.details .footer-action-button:disabled:hover {\n color: var(--emw--color-gray-50, #e2e2e2);\n cursor: not-allowed;\n border: 2px solid var(--emw--button-disabled-border-color, #727672);\n opacity: 0.7;\n}\n.details .footer-action-button {\n height: 44px;\n padding: 14px 20px;\n font-size: var(--emw--font-size-sm, 14px);\n}\n.details__general-info-action-button {\n display: none;\n margin-top: 32px;\n}\n.details__tabs-container {\n flex-grow: 1;\n max-width: 100%;\n}\n.details__tabs {\n position: relative;\n display: flex;\n justify-content: flex-start;\n border-bottom: 1px solid var(--emw--border-warning-color, #ea9018);\n}\n.details__tab {\n padding: 10px 20px;\n cursor: pointer;\n position: relative;\n font-weight: var(--emw--font-weight-medium, 500);\n color: var(--emw--color-gray-300, #555);\n display: flex;\n width: 33.3333333333%;\n padding: 12px 10px;\n justify-content: center;\n align-items: center;\n gap: 10px;\n}\n.details__tab.active {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n background: var(--emw--active-tab, linear-gradient(180deg, #ea9018 0%, #e0a84e 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.details__tab {\n color: var(--emw--color-gray-100, #727672);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n}\n.details__tab:nth-of-type(1).active ~ .active-tab-indicator {\n left: 0;\n width: 33.3333333333%;\n}\n.details__tab:nth-of-type(2).active ~ .active-tab-indicator {\n left: 33.3333333333%;\n width: 33.3333333333%;\n}\n.details__tab:nth-of-type(3).active ~ .active-tab-indicator {\n left: 66.6666666667%;\n width: 33.3333333333%;\n}\n.details .active-tab-indicator {\n position: absolute;\n bottom: -3px;\n height: 2px;\n background: var(--emw--active-tab-indicator, linear-gradient(180deg, rgba(234, 144, 24, 0.7) 0%, rgba(224, 168, 78, 0.7) 100%), #727672);\n transition: left 0.3s ease, width 0.3s ease;\n}\n.details .levels__tab {\n margin-top: 22px;\n display: flex;\n gap: 12px;\n flex-direction: column;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .level {\n display: flex;\n padding: 20px;\n flex-direction: column;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background-color: var(--emw--color-background, rgba(114, 118, 114, 0.2));\n}\n.details .level.grayed {\n background: rgba(114, 118, 114, 0.15);\n}\n.details .level.active {\n background: linear-gradient(90deg, rgba(30, 101, 79, 0.2) 0%, rgba(28, 141, 86, 0.2) 100%);\n border: 2px solid var(--Gradient-Blue, #003e5c);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.details .level.completed {\n background: linear-gradient(90deg, rgba(0, 62, 92, 0.3) 0.05%, rgba(17, 59, 33, 0.3) 87.69%);\n}\n.details .level__status {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n}\n.details .level__title {\n width: 100%;\n display: flex;\n justify-content: space-between;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n margin-bottom: 10px;\n}\n.details .level__title .completed, .details .level__title .in-progress {\n color: var(--emw--color-valid, #00b74f);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n text-align: right;\n line-height: 22px;\n}\n.details .level__title.grayed {\n color: var(--emw--disabled-color, #727672);\n}\n.details .level__progress {\n width: 100%;\n margin-bottom: 10px;\n}\n.details .level__icon {\n display: flex;\n margin: 5px 6px 5px 0;\n opacity: 1;\n}\n.details .level__icon img {\n display: block;\n width: 12px;\n height: 12px;\n}\n.details .level__icon img.grayed {\n opacity: 0.5;\n}\n.details .level__bonus, .details .level__target {\n display: flex;\n align-items: flex-start;\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n margin-bottom: 4px;\n}\n.details .level__value {\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.details .level__value.grayed {\n opacity: 0.5;\n}\n.details .games__tab {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n padding: 22px 0;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .games__tab .game {\n position: relative;\n width: 105px;\n height: 85px;\n cursor: pointer;\n}\n.details .games__tab .game img {\n width: 100%;\n height: 100%;\n border-radius: var(--emw--border-radius-medium, 16px);\n}\n.details .games__tab .game .contribution {\n position: absolute;\n top: 4px;\n right: 4px;\n color: var(--emw--color-white, #fff);\n border-radius: var(--emw--border-radius-small, 12px);\n border: 1px solid var(--Gradient-Blue, #003e5c);\n background: rgba(0, 0, 0, 0.5);\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\n backdrop-filter: blur(5px);\n padding: 0 8px;\n font-size: var(--emw--font-size-2x-small, 8px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 22px;\n text-align: center;\n}\n.details .rules__tab {\n display: flex;\n flex-direction: column;\n padding: 22px 0;\n gap: 8px;\n overflow-y: auto;\n height: 300px;\n padding-bottom: 80px;\n}\n.details .rules__tab .rule {\n color: var(--emw--color-gray-200, #c8d6ce);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: 500;\n line-height: 24px;\n}\n.details .rules__tab .link {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: 18px;\n background: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n padding: 14px 0;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.details__button {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n flex: 1 0 0;\n height: 42px;\n padding: 14px 20px;\n border-radius: var(--emw--button-border-radius, 99px);\n border: 2px solid var(--emw--button-border-color, #083b17);\n background-color: var(--emw--button-background-color, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n text-transform: uppercase;\n}\n\n.button__container {\n position: fixed;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n display: flex;\n width: calc(100% - 32px);\n padding: 16px 16px 22px 16px;\n justify-content: center;\n align-items: center;\n gap: 4px;\n border-top: 1px solid var(--emw--color-blue, #003e5c);\n background: var(--emw--color-background, #000);\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n\n.lds-dual-ring {\n display: block;\n width: 80px;\n height: 80px;\n margin: 80px auto 0 auto;\n}\n\n.lds-dual-ring:after {\n content: \" \";\n display: block;\n width: 64px;\n height: 64px;\n margin: 8px;\n border-radius: 50%;\n border: 6px solid var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e));\n border-color: var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e)) transparent var(--emw--casino-color-primary, var(--emw--color-primary, #22b04e));\n animation: lds-dual-ring 1.2s linear infinite;\n}\n\n@keyframes lds-dual-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.notification {\n display: flex;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background: rgba(188, 252, 177, 0.1);\n display: flex;\n padding: 16px;\n align-items: flex-start;\n gap: 10px;\n margin: 16px 16px 22px 16px;\n}\n.notification__icon {\n margin-top: 2px;\n}\n.notification__message, .notification__title {\n color: var(--emw--color-gray-50, #e2e2e2);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.notification__title {\n background: var(--emw--color-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.notification__column {\n display: flex;\n flex-direction: column;\n}\n\n@container challenges-details (min-width: 768px) {\n .button__container {\n display: none;\n }\n .details {\n gap: 36px;\n flex-wrap: nowrap;\n }\n .details__general-info-action-button {\n display: flex;\n }\n .details__general-info-image {\n width: 380px;\n min-height: 226px;\n height: auto;\n }\n .details__general-info {\n max-width: 380px;\n }\n .details__tabs__container {\n max-width: calc(100% - 380px);\n }\n .details .levels__tab {\n gap: 20px;\n height: 60vh;\n }\n .details .levels__tab .level__icon {\n width: 14px;\n height: 14px;\n margin: 4px 6px 4px 0px;\n }\n .details .levels__tab .level__icon img {\n width: 100%;\n height: 100%;\n }\n .details .levels__tab .level__title {\n font-size: var(--emw--font-size-medium, 16px);\n }\n .details .levels__tab .level__title .completed, .details .levels__tab .level__title .in-progress {\n font-size: var(--emw--font-size-sm, 14px);\n }\n .details .levels__tab .level__bonus, .details .levels__tab .level__target, .details .levels__tab .level__value {\n font-size: var(--emw--font-size-sm, 14px);\n }\n .details .games__tab, .details .rules__tab {\n height: 60vh;\n }\n .details .games__tab {\n gap: 20px;\n min-width: 340px;\n }\n .details .games__tab .game {\n width: 160px;\n height: 110px;\n }\n .details .games__tab .game .contribution {\n top: 8px;\n right: 8px;\n padding: 4px 10px;\n font-size: var(--emw--font-size-2x-small, 10px);\n line-height: 18px;\n }\n .challenges-header {\n margin: 0 0 32px;\n display: flex;\n justify-content: space-between;\n }\n .challenges-title {\n margin: 0;\n display: flex;\n gap: 10px;\n align-items: center;\n font-size: var(--emw--font-size-x-large, 24px);\n font-weight: var(--emw--font-weight-bold, 700);\n color: var(--emw--color-white, #ffffff);\n }\n .challenges-tabs {\n display: flex;\n gap: 12px;\n border-radius: 48px;\n padding: 6px;\n color: var(--emw--color-gray-150, #c8d6ce);\n background-color: var(--emw--color-background-secondary, #272727);\n }\n .challenges-tab {\n padding: 10px 16px;\n border-radius: 40px;\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-bold, 700);\n cursor: pointer;\n text-align: center;\n width: 95px;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n }\n .challenges-tab.active {\n color: var(--emw--color-white, #ffffff);\n background: linear-gradient(90deg, rgb(0, 62, 92) 0%, rgb(17, 59, 33) 100%);\n }\n .challenges-tab:last-child {\n width: inherit;\n padding: 10px 16px;\n }\n}";
336
349
  const CasinoChallengeDetailsStyle0 = casinoChallengeDetailsCss;
337
350
 
338
351
  const CasinoChallengeDetails = class {
@@ -344,6 +357,7 @@ const CasinoChallengeDetails = class {
344
357
  this.challengesTabs = ['Active', 'Pending', 'Finished', 'Code'];
345
358
  this.tabs = ['LEVELS', 'GAMES', 'RULES'];
346
359
  this.showNotification = 10;
360
+ this.abortController = new AbortController();
347
361
  this.checkIsMobile = () => {
348
362
  this.isMobile = window.innerWidth <= 768;
349
363
  };
@@ -368,14 +382,17 @@ const CasinoChallengeDetails = class {
368
382
  this.getBadgeContent = () => {
369
383
  var _a;
370
384
  if (this.challenge) {
385
+ if (this.isChallengePaused) {
386
+ return translate('unavailable', this.language);
387
+ }
371
388
  switch ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) {
372
- case exports.EChallengeStatus.Expired:
389
+ case exports.EChallengeProgressStatus.Expired:
373
390
  return translate('expired', this.language);
374
- case exports.EChallengeStatus.Forfeited:
391
+ case exports.EChallengeProgressStatus.Forfeited:
375
392
  return translate('forfeited', this.language);
376
- case exports.EChallengeStatus.Completed:
393
+ case exports.EChallengeProgressStatus.Completed:
377
394
  return translate('finished', this.language);
378
- case exports.EChallengeStatus.Paused:
395
+ case exports.EChallengeProgressStatus.Paused:
379
396
  return translate('suspended', this.language);
380
397
  default:
381
398
  return [translate('endsIn', this.language), ' - ', index.h("span", null, this.timeLeft || null)];
@@ -393,15 +410,15 @@ const CasinoChallengeDetails = class {
393
410
  return this.hasError;
394
411
  };
395
412
  this.joinUnjoinProgress = async () => {
396
- var _a, _b, _c, _d;
413
+ var _a, _b;
397
414
  if (!this.isUserAuthorized) {
398
415
  this.openLoginRegisterModal();
399
416
  }
400
- const join = ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) === exports.EChallengeStatus.Started || ((_b = this.challenge) === null || _b === void 0 ? void 0 : _b.Status) === exports.EChallengeStatus.Paused;
401
- const progress = (_d = (_c = this.challenge) === null || _c === void 0 ? void 0 : _c.LevelProgresses) === null || _d === void 0 ? void 0 : _d.find((x) => (x === null || x === void 0 ? void 0 : x.ProgressStatus) === exports.EChallengeProgressStatus.InProgress);
402
- if (!this.checkAttrs() && progress) {
417
+ const join = ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) === exports.EChallengeProgressStatus.Started ||
418
+ ((_b = this.challenge) === null || _b === void 0 ? void 0 : _b.Status) === exports.EChallengeProgressStatus.Paused;
419
+ if (!this.checkAttrs() && this.challengeId) {
403
420
  const url = `${this.endpoint}/challenge/ChangeProgressStatus`;
404
- const body = Object.assign(Object.assign({ DomainId: this.domain }, (this.userId && { InternalUserId: this.userId })), (join ? { ProgressToActivate: progress === null || progress === void 0 ? void 0 : progress.LevelId } : { ProgressToDeactivate: progress === null || progress === void 0 ? void 0 : progress.LevelId }));
421
+ const body = Object.assign(Object.assign({ DomainId: this.domain }, (this.userId && { InternalUserId: this.userId })), (join ? { ProgressToActivate: this.challenge.Id } : { ProgressToDeactivate: this.challenge.Id }));
405
422
  this.actionLoading = true;
406
423
  return fetch(url, {
407
424
  method: 'POST',
@@ -431,6 +448,9 @@ const CasinoChallengeDetails = class {
431
448
  this.getBackButtonText = () => {
432
449
  return (index.h("span", { class: "back-button__text" }, this.isMobile ? translate('all', this.language) : translate('back', this.language)));
433
450
  };
451
+ this.goBack = () => {
452
+ window.history.back();
453
+ };
434
454
  this.mbSource = undefined;
435
455
  this.clientStyling = undefined;
436
456
  this.endpoint = '';
@@ -453,6 +473,7 @@ const CasinoChallengeDetails = class {
453
473
  this.gamesAreLoading = false;
454
474
  this.challenge = undefined;
455
475
  this.loading = false;
476
+ this.isChallengePaused = false;
456
477
  }
457
478
  handleClientStylingChange(newValue, oldValue) {
458
479
  if (newValue != oldValue) {
@@ -469,10 +490,21 @@ const CasinoChallengeDetails = class {
469
490
  setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
470
491
  }
471
492
  }
493
+ handleCombinedChange() {
494
+ clearTimeout(this.debounceTimer);
495
+ this.debounceTimer = setTimeout(() => {
496
+ if (this.isUserAuthorized && this.session && this.challengeId) {
497
+ if (this.activeTabIndex === 0)
498
+ this.getChallenge();
499
+ else if (this.activeTabIndex === 1)
500
+ this.fetchGames();
501
+ }
502
+ }, 50);
503
+ }
472
504
  onEntityChange(newChallenge, previousChallenge) {
473
505
  var _a, _b, _c, _d;
474
- const newActiveProgressId = (_b = (_a = newChallenge === null || newChallenge === void 0 ? void 0 : newChallenge.LevelProgresses) === null || _a === void 0 ? void 0 : _a.find((level) => level.ProgressStatus === exports.EChallengeProgressStatus.InProgress)) === null || _b === void 0 ? void 0 : _b.LevelId;
475
- const prevActiveProgressId = (_d = (_c = previousChallenge === null || previousChallenge === void 0 ? void 0 : previousChallenge.LevelProgresses) === null || _c === void 0 ? void 0 : _c.find((level) => level.ProgressStatus === exports.EChallengeProgressStatus.InProgress)) === null || _d === void 0 ? void 0 : _d.LevelId;
506
+ const newActiveProgressId = (_b = (_a = newChallenge === null || newChallenge === void 0 ? void 0 : newChallenge.LevelProgresses) === null || _a === void 0 ? void 0 : _a.find((level) => level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress)) === null || _b === void 0 ? void 0 : _b.LevelId;
507
+ const prevActiveProgressId = (_d = (_c = previousChallenge === null || previousChallenge === void 0 ? void 0 : previousChallenge.LevelProgresses) === null || _c === void 0 ? void 0 : _c.find((level) => level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress)) === null || _d === void 0 ? void 0 : _d.LevelId;
476
508
  if (newActiveProgressId == prevActiveProgressId) {
477
509
  setTimeout(() => {
478
510
  this.scrollToActiveLevel();
@@ -499,19 +531,32 @@ const CasinoChallengeDetails = class {
499
531
  }
500
532
  async getChallenge() {
501
533
  if (!this.checkAttrs()) {
534
+ if (this.abortController) {
535
+ this.abortController.abort();
536
+ }
537
+ this.abortController = new AbortController();
538
+ const signal = this.abortController.signal;
502
539
  const url = `${this.endpoint}/challenge/GetChallengesInfo`;
503
- const body = Object.assign(Object.assign({ DomainId: this.domain, PlayerLanguage: this.language, PageNumber: 0, PageSize: 1 }, (this.isUserAuthorized ? { ChallengeProgressId: this.challengeId } : { ChallengeId: this.challengeId })), (this.session && { PlayerSession: this.session }));
540
+ const body = Object.assign({ DomainId: this.domain, PlayerLanguage: this.language, PageNumber: 0, PageSize: 20 }, (this.session && { PlayerSession: this.session }));
504
541
  this.loading = true;
505
542
  return fetch(url, {
506
543
  method: 'POST',
507
544
  headers: {
508
545
  'Content-Type': 'application/json'
509
546
  },
547
+ signal,
510
548
  body: JSON.stringify(body)
511
549
  })
512
550
  .then((res) => res.json())
513
551
  .then((res) => {
514
- this.challenge = res.Data[0];
552
+ var _a;
553
+ if (res.Success) {
554
+ const challenge = (_a = res === null || res === void 0 ? void 0 : res.Data) === null || _a === void 0 ? void 0 : _a.find((challenge) => (challenge === null || challenge === void 0 ? void 0 : challenge.ChallengeId) === this.challengeId);
555
+ if (challenge) {
556
+ this.challenge = challenge;
557
+ this.isChallengePaused = this.challenge.ChallengeStatus === exports.EChallengeStatus.Paused;
558
+ }
559
+ }
515
560
  })
516
561
  .finally(() => (this.loading = false));
517
562
  }
@@ -574,16 +619,14 @@ const CasinoChallengeDetails = class {
574
619
  if (this.isUserAuthorized) {
575
620
  let buttonText;
576
621
  switch ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) {
577
- case exports.EChallengeStatus.Started:
622
+ case exports.EChallengeProgressStatus.Started:
578
623
  buttonText = 'start';
579
624
  break;
580
- case exports.EChallengeStatus.Paused:
625
+ case exports.EChallengeProgressStatus.Paused:
581
626
  buttonText = 'resume';
582
627
  break;
583
- case exports.EChallengeStatus.InProgress:
584
- buttonText = 'resume';
585
- break;
586
- case exports.EChallengeStatus.PendingLevelReward:
628
+ case exports.EChallengeProgressStatus.InProgress:
629
+ case exports.EChallengeProgressStatus.PendingLevelReward:
587
630
  buttonText = 'pause';
588
631
  break;
589
632
  default:
@@ -601,15 +644,18 @@ const CasinoChallengeDetails = class {
601
644
  });
602
645
  }
603
646
  async fetchGames() {
604
- var _a;
605
647
  if (!this.checkAttrs()) {
648
+ if (this.abortController) {
649
+ this.abortController.abort();
650
+ }
651
+ this.abortController = new AbortController();
652
+ const signal = this.abortController.signal;
606
653
  const url = `${this.endpoint}/challenge/GetChallengeGames`;
607
- const body = {
608
- ChallengeId: (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.ChallengeId
609
- };
654
+ const body = Object.assign({ ChallengeId: this.challengeId }, (this.session && { PlayerSession: this.session }));
610
655
  this.gamesAreLoading = true;
611
656
  return fetch(url, {
612
657
  method: 'POST',
658
+ signal,
613
659
  headers: {
614
660
  'Content-Type': 'application/json'
615
661
  },
@@ -617,22 +663,30 @@ const CasinoChallengeDetails = class {
617
663
  })
618
664
  .then((res) => res.json())
619
665
  .then((res) => {
620
- this.games = res.ChallengeGames;
666
+ if (res.ChallengeGames)
667
+ this.games = res.ChallengeGames;
668
+ else
669
+ this.games = [];
621
670
  })
622
- .finally(() => (this.gamesAreLoading = false));
671
+ .catch(() => {
672
+ this.games = [];
673
+ })
674
+ .finally(() => {
675
+ this.gamesAreLoading = false;
676
+ });
623
677
  }
624
678
  }
625
679
  getLevelStatus(level, active) {
626
680
  if (this.isUserAuthorized) {
627
- if (level.ProgressStatus === exports.EChallengeProgressStatus.InProgress && !active)
681
+ if (level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress && !active)
628
682
  return (index.h("div", { class: "level__status" }, index.h("span", null, level.ProgressPercentage, "%"), index.h("img", { src: lockSvg, alt: "lock-icon", title: "lock-icon" })));
629
- else if (level.ProgressStatus === exports.EChallengeProgressStatus.Closed || !active)
683
+ else if (level.ProgressStatus === exports.EChallengeProgressLevelStatus.Closed || !active)
630
684
  return (index.h("div", { class: "level__status" }, index.h("img", { src: lockSvg, alt: "lock-icon", title: "lock-icon" })));
631
- else if (level.ProgressStatus === exports.EChallengeProgressStatus.Fillup)
685
+ else if (level.ProgressStatus === exports.EChallengeProgressLevelStatus.Fillup)
632
686
  return (index.h("div", { class: "level__status" }, index.h("img", { src: lockSvg, alt: "lock-icon", title: "lock-icon" })));
633
- else if (level.ProgressStatus === exports.EChallengeProgressStatus.Completed)
687
+ else if (level.ProgressStatus === exports.EChallengeProgressLevelStatus.Completed)
634
688
  return index.h("span", { class: "completed" }, translate('completed', this.language));
635
- else if (level.ProgressStatus === exports.EChallengeProgressStatus.InProgress)
689
+ else if (level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress)
636
690
  return index.h("span", { class: "level__status in-progress" }, level.ProgressPercentage, "%");
637
691
  }
638
692
  return null;
@@ -644,13 +698,17 @@ const CasinoChallengeDetails = class {
644
698
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
645
699
  return (index.h("div", { class: "details__general-info" }, index.h("div", { class: "details__general-info-image-container" }, index.h("img", { class: {
646
700
  'details__general-info-image': true,
647
- grayed: [exports.EChallengeStatus.Expired, exports.EChallengeStatus.Forfeited, exports.EChallengeStatus.Completed].includes((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status)
701
+ grayed: [
702
+ exports.EChallengeProgressStatus.Expired,
703
+ exports.EChallengeProgressStatus.Forfeited,
704
+ exports.EChallengeProgressStatus.Completed
705
+ ].includes((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status)
648
706
  }, src: (_c = (_b = this.challenge) === null || _b === void 0 ? void 0 : _b.ChallengePresentation) === null || _c === void 0 ? void 0 : _c.BannerUrl, alt: "banner-image", title: "banner-image" }), this.getCardBadge), index.h("div", { class: "details__general-info-content" }, index.h("h1", { class: "details__general-info-title" }, (_e = (_d = this.challenge) === null || _d === void 0 ? void 0 : _d.ChallengePresentation) === null || _e === void 0 ? void 0 : _e.PresentationName), index.h("h3", { class: "details__general-info-end-date_label" }, translate('endDate', this.language), " -", ' ', index.h("span", { class: "details__general-info-end-date_value" }, this.challenge ? formatDate((_f = this.challenge) === null || _f === void 0 ? void 0 : _f.ExpirationTime) : '-')), index.h("casino-challenge-progress-bar", { challenge: this.challenge, isUserAuthorized: this.isUserAuthorized, language: this.language }), index.h("button", { class: {
649
707
  'details__general-info-action-button': true,
650
- filled: ((_g = this.challenge) === null || _g === void 0 ? void 0 : _g.Status) === exports.EChallengeStatus.Started,
651
- grayed: ((_h = this.challenge) === null || _h === void 0 ? void 0 : _h.Status) === exports.EChallengeStatus.Paused ||
652
- ((_j = this.challenge) === null || _j === void 0 ? void 0 : _j.Status) === exports.EChallengeStatus.InProgress ||
653
- ((_k = this.challenge) === null || _k === void 0 ? void 0 : _k.Status) === exports.EChallengeStatus.PendingLevelReward
708
+ filled: ((_g = this.challenge) === null || _g === void 0 ? void 0 : _g.Status) === exports.EChallengeProgressStatus.Started,
709
+ grayed: ((_h = this.challenge) === null || _h === void 0 ? void 0 : _h.Status) === exports.EChallengeProgressStatus.Paused ||
710
+ ((_j = this.challenge) === null || _j === void 0 ? void 0 : _j.Status) === exports.EChallengeProgressStatus.InProgress ||
711
+ ((_k = this.challenge) === null || _k === void 0 ? void 0 : _k.Status) === exports.EChallengeProgressStatus.PendingLevelReward
654
712
  }, disabled: this.actionLoading, onClick: this.joinUnjoinProgress }, translate(this.actionButtonText, this.language)))));
655
713
  }
656
714
  get challengeTabs() {
@@ -664,23 +722,24 @@ const CasinoChallengeDetails = class {
664
722
  return (index.h("div", { class: "levels__tab", ref: (el) => (this.scrollContainerRef = el) }, (_b = (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.LevelProgresses) === null || _b === void 0 ? void 0 : _b.map((level, index$1) => {
665
723
  var _a;
666
724
  const activeChallenge = [0, 1, 2, 3].includes((_a = this === null || this === void 0 ? void 0 : this.challenge) === null || _a === void 0 ? void 0 : _a.Status);
667
- const isGrayed = (this.isUserAuthorized && level.ProgressStatus !== exports.EChallengeProgressStatus.InProgress) || !activeChallenge;
668
- const isActiveMatch = level.ProgressStatus === exports.EChallengeProgressStatus.InProgress;
725
+ const isGrayed = (this.isUserAuthorized && level.ProgressStatus !== exports.EChallengeProgressLevelStatus.InProgress) ||
726
+ !activeChallenge;
727
+ const isActiveMatch = level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress;
669
728
  return (index.h("div", { class: {
670
729
  level: true,
671
730
  active: this.isUserAuthorized &&
672
731
  activeChallenge &&
673
- level.ProgressStatus === exports.EChallengeProgressStatus.InProgress,
732
+ level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress,
674
733
  completed: this.isUserAuthorized &&
675
734
  activeChallenge &&
676
- level.ProgressStatus === exports.EChallengeProgressStatus.Completed,
735
+ level.ProgressStatus === exports.EChallengeProgressLevelStatus.Completed,
677
736
  grayed: this.isUserAuthorized &&
678
- (level.ProgressStatus === exports.EChallengeProgressStatus.Closed ||
679
- level.ProgressStatus === exports.EChallengeProgressStatus.Fillup)
737
+ (level.ProgressStatus === exports.EChallengeProgressLevelStatus.Closed ||
738
+ level.ProgressStatus === exports.EChallengeProgressLevelStatus.Fillup)
680
739
  }, ref: isActiveMatch ? (el) => (this.activeEntityRef = el) : undefined, key: level.LevelId }, index.h("div", { class: {
681
740
  level__title: true,
682
741
  grayed: isGrayed
683
- } }, index.h("span", null, "Level ", index$1 + 1), this.isUserAuthorized && this.getLevelStatus(level, activeChallenge)), this.isUserAuthorized && level.ProgressStatus === exports.EChallengeProgressStatus.InProgress && (index.h("div", { class: "level__progress" }, index.h("casino-challenge-level-progress-bar", { height: "8px", value: level.ProgressPercentage, active: activeChallenge }))), index.h("casino-challenge-expandable-paragraph", { "max-height": "56", active: level.ProgressStatus === exports.EChallengeProgressStatus.InProgress && activeChallenge }, index.h("div", { class: {
742
+ } }, index.h("span", null, "Level ", index$1 + 1), this.isUserAuthorized && this.getLevelStatus(level, activeChallenge)), this.isUserAuthorized && level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress && (index.h("div", { class: "level__progress" }, index.h("casino-challenge-level-progress-bar", { height: "8px", value: level.ProgressPercentage, active: activeChallenge }))), index.h("casino-challenge-expandable-paragraph", { "max-height": "56", active: level.ProgressStatus === exports.EChallengeProgressLevelStatus.InProgress && activeChallenge }, index.h("div", { class: {
684
743
  level__bonus: true,
685
744
  grayed: isGrayed
686
745
  } }, index.h("span", { class: "level__icon" }, index.h("img", { class: {
@@ -718,22 +777,22 @@ const CasinoChallengeDetails = class {
718
777
  }
719
778
  get gamesTab() {
720
779
  return (index.h("div", { class: "games__tab" }, this.gamesAreLoading ? (index.h("div", { class: "lds-dual-ring" })) : (this.games.map((game) => {
721
- return (index.h("div", { class: "game", onClick: () => this.handleGameClick(game) }, index.h("img", { src: game.GameIcon, alt: "game-icon", title: "game-icon" }), index.h("span", { class: "contribution" }, translate('contribution', this.language), " ", game.Contribution, "%")));
780
+ return (index.h("div", { class: "game", onClick: () => this.handleGameClick(game) }, index.h("img", { src: game.Thumbnail, alt: "game-icon", title: "game-icon" }), index.h("span", { class: "contribution" }, translate('contribution', this.language), " ", game.Contribution, "%")));
722
781
  }))));
723
782
  }
724
783
  get rulesTab() {
725
- var _a, _b, _c, _d;
726
- return (index.h("div", { class: "rules__tab" }, index.h("div", { class: "rule" }, (_b = (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.ChallengePresentation) === null || _b === void 0 ? void 0 : _b.Description), index.h("a", { class: "link", href: (_d = (_c = this.challenge) === null || _c === void 0 ? void 0 : _c.ChallengePresentation) === null || _d === void 0 ? void 0 : _d.Url, target: "_blank" }, translate('terms', this.language))));
784
+ var _a, _b, _c, _d, _e, _f, _g, _h;
785
+ return (index.h("div", { class: "rules__tab" }, ((_b = (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.ChallengePresentation) === null || _b === void 0 ? void 0 : _b.Description) && (index.h("div", { class: "rule" }, (_d = (_c = this.challenge) === null || _c === void 0 ? void 0 : _c.ChallengePresentation) === null || _d === void 0 ? void 0 : _d.Description)), ((_f = (_e = this.challenge) === null || _e === void 0 ? void 0 : _e.ChallengePresentation) === null || _f === void 0 ? void 0 : _f.Url) && (index.h("a", { class: "link", href: (_h = (_g = this.challenge) === null || _g === void 0 ? void 0 : _g.ChallengePresentation) === null || _h === void 0 ? void 0 : _h.Url, target: "_blank" }, translate('terms', this.language)))));
727
786
  }
728
787
  get footer() {
729
788
  var _a, _b, _c, _d;
730
789
  return (index.h("div", { class: "button__container" }, index.h("button", { class: {
731
790
  'footer-action-button': true,
732
- filled: ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) === exports.EChallengeStatus.Started || !this.isUserAuthorized,
791
+ filled: ((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) === exports.EChallengeProgressStatus.Started || !this.isUserAuthorized,
733
792
  grayed: this.isUserAuthorized &&
734
- (((_b = this.challenge) === null || _b === void 0 ? void 0 : _b.Status) === exports.EChallengeStatus.Paused ||
735
- ((_c = this.challenge) === null || _c === void 0 ? void 0 : _c.Status) === exports.EChallengeStatus.InProgress ||
736
- ((_d = this.challenge) === null || _d === void 0 ? void 0 : _d.Status) === exports.EChallengeStatus.PendingLevelReward)
793
+ (((_b = this.challenge) === null || _b === void 0 ? void 0 : _b.Status) === exports.EChallengeProgressStatus.Paused ||
794
+ ((_c = this.challenge) === null || _c === void 0 ? void 0 : _c.Status) === exports.EChallengeProgressStatus.InProgress ||
795
+ ((_d = this.challenge) === null || _d === void 0 ? void 0 : _d.Status) === exports.EChallengeProgressStatus.PendingLevelReward)
737
796
  }, onClick: this.joinUnjoinProgress, disabled: this.actionLoading }, translate(this.actionButtonText, this.language))));
738
797
  }
739
798
  get forfeitedNofitication() {
@@ -749,12 +808,15 @@ const CasinoChallengeDetails = class {
749
808
  return (((_a = this.challenge) === null || _a === void 0 ? void 0 : _a.Status) === 4 && (index.h("div", { class: "notification" }, index.h("img", { class: "notification__icon", src: infoCircleSvg }), index.h("span", { class: "notification__message" }, translate('expiredNotification', this.language)))));
750
809
  }
751
810
  render() {
752
- return (index.h("div", { key: '0d96a09f1ed0f090cf01b2b6077b803f64886422', ref: (el) => (this.stylingContainer = el), class: "container" }, this.pageHeader, this.loading ? (index.h("div", { class: "lds-dual-ring" })) : (index.h("div", null, index.h("button", { class: "back-button" }, index.h("img", { class: "back-button__icon", src: backArrowSvg }), this.getBackButtonText()), this.forfeitedNofitication, this.completedNotification, this.expiredNotification, index.h("div", { class: "details" }, this.cardGeneralInfo, index.h("div", { class: "details__tabs-container" }, this.challengeTabs, this.activeTabIndex === 0 && this.levelsTab, this.activeTabIndex === 1 && this.gamesTab, this.activeTabIndex === 2 && this.rulesTab), this.footer)))));
811
+ return (index.h("div", { key: 'db59c429bf40a1ad703f3f26763549ece9fe8723', ref: (el) => (this.stylingContainer = el), class: "container" }, this.pageHeader, this.loading ? (index.h("div", { class: "lds-dual-ring" })) : (index.h("div", null, index.h("button", { class: "back-button", onClick: this.goBack }, index.h("img", { class: "back-button__icon", src: backArrowSvg }), this.getBackButtonText()), this.forfeitedNofitication, this.completedNotification, this.expiredNotification, index.h("div", { class: "details" }, this.cardGeneralInfo, index.h("div", { class: "details__tabs-container" }, this.challengeTabs, this.activeTabIndex === 0 && this.levelsTab, this.activeTabIndex === 1 && this.gamesTab, this.activeTabIndex === 2 && this.rulesTab), this.footer)))));
753
812
  }
754
813
  static get watchers() { return {
755
814
  "clientStyling": ["handleClientStylingChange"],
756
815
  "clientStylingUrl": ["handleClientStylingUrlChange"],
757
816
  "mbSource": ["handleMbSourceChange"],
817
+ "challengeId": ["handleCombinedChange"],
818
+ "isUserAuthorized": ["handleCombinedChange"],
819
+ "session": ["handleCombinedChange"],
758
820
  "challenge": ["onEntityChange"]
759
821
  }; }
760
822
  };
package/dist/cjs/casino-challenge-details.cjs.js CHANGED
@@ -19,7 +19,7 @@ var patchBrowser = () => {
19
19
 
20
20
  patchBrowser().then(async (options) => {
21
21
  await appGlobals.globalScripts();
22
- return index.bootstrapLazy([["casino-challenge-details_4.cjs",[[1,"casino-challenge-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"endpoint":[513],"domain":[513],"session":[513],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isUserAuthorized":[516,"is-user-authorized"],"challengeId":[513,"challenge-id"],"activeChallengeTabIndex":[513,"active-challenge-tab-index"],"userId":[513,"user-id"],"timeLeft":[32],"activeTabIndex":[32],"actionLoading":[32],"isMobile":[32],"error":[32],"hasError":[32],"games":[32],"gamesAreLoading":[32],"challenge":[32],"loading":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenge":["onEntityChange"]}],[1,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32],"isSmallScreen":[32]}],[1,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}],[1,"casino-challenge-progress-bar",{"challenge":[16],"isUserAuthorized":[4,"is-user-authorized"],"language":[1]}]]]], options);
22
+ return index.bootstrapLazy([["casino-challenge-details_4.cjs",[[1,"casino-challenge-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"endpoint":[513],"domain":[513],"session":[513],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isUserAuthorized":[516,"is-user-authorized"],"challengeId":[513,"challenge-id"],"activeChallengeTabIndex":[513,"active-challenge-tab-index"],"userId":[513,"user-id"],"timeLeft":[32],"activeTabIndex":[32],"actionLoading":[32],"isMobile":[32],"error":[32],"hasError":[32],"games":[32],"gamesAreLoading":[32],"challenge":[32],"loading":[32],"isChallengePaused":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challengeId":["handleCombinedChange"],"isUserAuthorized":["handleCombinedChange"],"session":["handleCombinedChange"],"challenge":["onEntityChange"]}],[1,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32],"isSmallScreen":[32]}],[1,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}],[1,"casino-challenge-progress-bar",{"challenge":[16],"isUserAuthorized":[4,"is-user-authorized"],"language":[1]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
package/dist/cjs/casino-challenge-details_4.cjs.entry.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const casinoChallengeDetails = require('./casino-challenge-details-53cea171.js');
5
+ const casinoChallengeDetails = require('./casino-challenge-details-7465690c.js');
6
6
  const index = require('./index-2a30d71d.js');
7
7
 
8
8
  const activeChevronSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEyIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMC40MTA4MjYgMC45MTEwN0MwLjczNjI2MyAwLjU4NTYzMyAxLjI2MzkgMC41ODU2MzMgMS41ODkzNCAwLjkxMTA3TDYuMDAwMDggNS4zMjE4MUwxMC40MTA4IDAuOTExMDdDMTAuNzM2MyAwLjU4NTYzMyAxMS4yNjM5IDAuNTg1NjMzIDExLjU4OTMgMC45MTEwN0MxMS45MTQ4IDEuMjM2NTEgMTEuOTE0OCAxLjc2NDE0IDExLjU4OTMgMi4wODk1OEw2LjU4OTM0IDcuMDg5NThDNi4yNjM5IDcuNDE1MDIgNS43MzYyNiA3LjQxNTAyIDUuNDEwODMgNy4wODk1OEwwLjQxMDgyNiAyLjA4OTU4QzAuMDg1Mzg4OCAxLjc2NDE0IDAuMDg1Mzg4OCAxLjIzNjUxIDAuNDEwODI2IDAuOTExMDdaIiBmaWxsPSIjMDBCNzRGIi8+Cjwvc3ZnPgo=';
@@ -101,39 +101,42 @@ const CasinoChallengeProgressBar = class {
101
101
  }
102
102
  get challengeProgress() {
103
103
  var _a;
104
- const currLevel = (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.LevelProgresses.find((x) => x.ProgressStatus === casinoChallengeDetails.EChallengeProgressStatus.InProgress);
104
+ const currLevel = (_a = this.challenge) === null || _a === void 0 ? void 0 : _a.LevelProgresses.find((x) => x.ProgressStatus === casinoChallengeDetails.EChallengeProgressLevelStatus.InProgress);
105
105
  if (!this.isUserAuthorized || !currLevel)
106
106
  return null;
107
- const { Status, LevelProgresses } = this.challenge;
108
- if (Status === casinoChallengeDetails.EChallengeStatus.Expired || Status === casinoChallengeDetails.EChallengeStatus.Started) {
107
+ const { Status, LevelProgresses, ChallengeStatus } = this.challenge;
108
+ if (ChallengeStatus === casinoChallengeDetails.EChallengeStatus.Closed ||
109
+ ChallengeStatus === casinoChallengeDetails.EChallengeStatus.Deleted ||
110
+ Status === casinoChallengeDetails.EChallengeProgressStatus.Expired ||
111
+ Status === casinoChallengeDetails.EChallengeProgressStatus.Started) {
109
112
  return null;
110
113
  }
111
- const barValue = Status === casinoChallengeDetails.EChallengeStatus.Paused
114
+ const barValue = Status === casinoChallengeDetails.EChallengeProgressStatus.Paused
112
115
  ? casinoChallengeDetails.translate('suspended', this.language)
113
- : Status === casinoChallengeDetails.EChallengeStatus.Completed
116
+ : Status === casinoChallengeDetails.EChallengeProgressStatus.Completed
114
117
  ? casinoChallengeDetails.translate('finished', this.language)
115
118
  : `${currLevel.ProgressPercentage}%`;
116
119
  const isLastLevel = !LevelProgresses.some((x) => x.OrderNumber > currLevel.OrderNumber);
117
- const secondImgSrc = Status === casinoChallengeDetails.EChallengeStatus.Completed ? trophySvg : isLastLevel ? finishSvg : '';
120
+ const secondImgSrc = Status === casinoChallengeDetails.EChallengeProgressStatus.Completed ? trophySvg : isLastLevel ? finishSvg : '';
118
121
  return (index.h("div", { class: {
119
122
  progress: true,
120
- paused: Status === casinoChallengeDetails.EChallengeStatus.Paused,
121
- grayed: Status === casinoChallengeDetails.EChallengeStatus.Forfeited
123
+ paused: Status === casinoChallengeDetails.EChallengeProgressStatus.Paused,
124
+ grayed: Status === casinoChallengeDetails.EChallengeProgressStatus.Forfeited
122
125
  } }, index.h("div", { class: {
123
126
  progress__point: true,
124
127
  start: true,
125
- hidden: Status === casinoChallengeDetails.EChallengeStatus.Completed
128
+ hidden: Status === casinoChallengeDetails.EChallengeProgressStatus.Completed
126
129
  } }, currLevel.OrderNumber + 1), index.h("div", { class: {
127
130
  progress__bar: true,
128
- finished: Status === casinoChallengeDetails.EChallengeStatus.Completed
131
+ finished: Status === casinoChallengeDetails.EChallengeProgressStatus.Completed
129
132
  }, style: { width: `${currLevel.ProgressPercentage}%` } }, barValue), index.h("div", { class: {
130
133
  progress__point: true,
131
134
  end: true,
132
- finished: Status === casinoChallengeDetails.EChallengeStatus.Completed
135
+ finished: Status === casinoChallengeDetails.EChallengeProgressStatus.Completed
133
136
  } }, secondImgSrc ? index.h("img", { class: "progress__icon", src: secondImgSrc }) : currLevel.OrderNumber + 2)));
134
137
  }
135
138
  render() {
136
- return index.h(index.Host, { key: 'e75584687abe5ea34c8f1e3a66ca09fca73ba8ed' }, this.challengeProgress);
139
+ return index.h(index.Host, { key: '026daa3db1fe4e19e74dc4cc994e2fbb6f833356' }, this.challengeProgress);
137
140
  }
138
141
  };
139
142
  CasinoChallengeProgressBar.style = CasinoChallengeProgressBarStyle0;
package/dist/cjs/index.cjs.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const casinoChallengeDetails = require('./casino-challenge-details-53cea171.js');
5
+ const casinoChallengeDetails = require('./casino-challenge-details-7465690c.js');
6
6
  require('./index-2a30d71d.js');
7
7
 
8
8
 
package/dist/cjs/loader.cjs.js CHANGED
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy([["casino-challenge-details_4.cjs",[[1,"casino-challenge-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"endpoint":[513],"domain":[513],"session":[513],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isUserAuthorized":[516,"is-user-authorized"],"challengeId":[513,"challenge-id"],"activeChallengeTabIndex":[513,"active-challenge-tab-index"],"userId":[513,"user-id"],"timeLeft":[32],"activeTabIndex":[32],"actionLoading":[32],"isMobile":[32],"error":[32],"hasError":[32],"games":[32],"gamesAreLoading":[32],"challenge":[32],"loading":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challenge":["onEntityChange"]}],[1,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32],"isSmallScreen":[32]}],[1,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}],[1,"casino-challenge-progress-bar",{"challenge":[16],"isUserAuthorized":[4,"is-user-authorized"],"language":[1]}]]]], options);
11
+ return index.bootstrapLazy([["casino-challenge-details_4.cjs",[[1,"casino-challenge-details",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"endpoint":[513],"domain":[513],"session":[513],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"isUserAuthorized":[516,"is-user-authorized"],"challengeId":[513,"challenge-id"],"activeChallengeTabIndex":[513,"active-challenge-tab-index"],"userId":[513,"user-id"],"timeLeft":[32],"activeTabIndex":[32],"actionLoading":[32],"isMobile":[32],"error":[32],"hasError":[32],"games":[32],"gamesAreLoading":[32],"challenge":[32],"loading":[32],"isChallengePaused":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"challengeId":["handleCombinedChange"],"isUserAuthorized":["handleCombinedChange"],"session":["handleCombinedChange"],"challenge":["onEntityChange"]}],[1,"casino-challenge-expandable-paragraph",{"maxHeight":[2,"max-height"],"active":[4],"expanded":[32],"needsTruncation":[32],"isSmallScreen":[32]}],[1,"casino-challenge-level-progress-bar",{"height":[1],"active":[4],"value":[2]}],[1,"casino-challenge-progress-bar",{"challenge":[16],"isUserAuthorized":[4,"is-user-authorized"],"language":[1]}]]]], options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
package/dist/collection/components/casino-challenge-details/casino-challenge-details.css CHANGED
@@ -346,6 +346,7 @@
346
346
  position: relative;
347
347
  width: 105px;
348
348
  height: 85px;
349
+ cursor: pointer;
349
350
  }
350
351
  .details .games__tab .game img {
351
352
  width: 100%;