@everymatrix/casino-engagement-suite-challenges-details 1.35.0 → 1.36.0

package/dist/casino-engagement-suite-challenges-details/casino-engagement-suite-challenges-details.esm.js

@@ -1 +1 @@
-import{p as e,b as l}from"./p-764c820d.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((e=>l([["p-27926b27",[[1,"casino-engagement-suite-challenges-details",{clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],challenge:[16],language:[1],gameSlug:[1,"game-slug"],device:[1],limitStylingAppends:[32],timer:[32],showDetails:[32],isExpiredChallenge:[32]}]]]],e)));
+import{p as e,b as l}from"./p-8db66ba7.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((e=>l([["p-9159f1ae",[[1,"casino-engagement-suite-challenges-details",{clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],challenge:[16],language:[1],gameSlug:[1,"game-slug"],device:[1],limitStylingAppends:[32],timer:[32],showDetails:[32],isExpiredChallenge:[32]}],[1,"casino-engagement-suite-progress-bar",{value:[2],disabled:[4],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],limitStylingAppends:[32]}]]]],e)));

package/dist/casino-engagement-suite-challenges-details/p-8db66ba7.js

@@ -0,0 +1 @@
+let e,t,n=!1;const l="undefined"!=typeof window?window:{},s=l.document||{head:{}},o={t:0,l:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},c=e=>Promise.resolve(e),i=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replace}catch(e){}return!1})(),r=new WeakMap,a=e=>"sc-"+e.o,u={},f=e=>"object"==(e=typeof e)||"function"===e,d=(e,t,...n)=>{let l=null,s=!1,o=!1,c=[];const i=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?i(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!f(l))&&(l+=""),s&&o?c[c.length-1].i+=l:c.push(s?h(null,l):l),o=s)};if(i(n),t){const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}const r=h(e,null);return r.u=t,c.length>0&&(r.h=c),r},h=(e,t)=>({t:0,$:e,i:t,m:null,h:null,u:null}),$={},m=(e,t,n,s,c,i)=>{if(n!==s){let r=_(e,t),a=t.toLowerCase();if("class"===t){const t=e.classList,l=p(n),o=p(s);t.remove(...l.filter((e=>e&&!o.includes(e)))),t.add(...o.filter((e=>e&&!l.includes(e))))}else if("style"===t){for(const t in n)s&&null!=s[t]||(t.includes("-")?e.style.removeProperty(t):e.style[t]="");for(const t in s)n&&s[t]===n[t]||(t.includes("-")?e.style.setProperty(t,s[t]):e.style[t]=s[t])}else if(r||"o"!==t[0]||"n"!==t[1]){const l=f(s);if((r||l&&null!==s)&&!c)try{if(e.tagName.includes("-"))e[t]=s;else{let l=null==s?"":s;"list"===t?r=!1:null!=n&&e[t]==l||(e[t]=l)}}catch(e){}null==s||!1===s?!1===s&&""!==e.getAttribute(t)||e.removeAttribute(t):(!r||4&i||c)&&!l&&e.setAttribute(t,s=!0===s?"":s)}else t="-"===t[2]?t.slice(3):_(l,a)?a.slice(2):a[2]+t.slice(3),n&&o.rel(e,t,n,!1),s&&o.ael(e,t,s,!1)}},y=/\s/,p=e=>e?e.split(y):[],b=(e,t,n,l)=>{const s=11===t.m.nodeType&&t.m.host?t.m.host:t.m,o=e&&e.u||u,c=t.u||u;for(l in o)l in c||m(s,l,o[l],void 0,n,t.t);for(l in c)m(s,l,o[l],c[l],n,t.t)},w=(t,n,l)=>{let o,c,i=n.h[l],r=0;if(null!==i.i)o=i.m=s.createTextNode(i.i);else if(o=i.m=s.createElement(i.$),b(null,i,!1),null!=e&&o["s-si"]!==e&&o.classList.add(o["s-si"]=e),i.h)for(r=0;r<i.h.length;++r)c=w(t,i,r),c&&o.appendChild(c);return o},g=(e,n,l,s,o,c)=>{let i,r=e;for(r.shadowRoot&&r.tagName===t&&(r=r.shadowRoot);o<=c;++o)s[o]&&(i=w(null,l,o),i&&(s[o].m=i,r.insertBefore(i,n)))},S=(e,t,n,l)=>{for(;t<=n;++t)(l=e[t])&&l.m.remove()},j=(e,t)=>e.$===t.$,M=(e,t)=>{const n=t.m=e.m,l=e.h,s=t.h,o=t.i;null===o?("slot"===t.$||b(e,t,!1),null!==l&&null!==s?((e,t,n,l)=>{let s,o=0,c=0,i=t.length-1,r=t[0],a=t[i],u=l.length-1,f=l[0],d=l[u];for(;o<=i&&c<=u;)null==r?r=t[++o]:null==a?a=t[--i]:null==f?f=l[++c]:null==d?d=l[--u]:j(r,f)?(M(r,f),r=t[++o],f=l[++c]):j(a,d)?(M(a,d),a=t[--i],d=l[--u]):j(r,d)?(M(r,d),e.insertBefore(r.m,a.m.nextSibling),r=t[++o],d=l[--u]):j(a,f)?(M(a,f),e.insertBefore(a.m,r.m),a=t[--i],f=l[++c]):(s=w(t&&t[c],n,c),f=l[++c],s&&r.m.parentNode.insertBefore(s,r.m));o>i?g(e,null==l[u+1]?null:l[u+1].m,n,l,c,u):c>u&&S(t,o,i)})(n,l,t,s):null!==s?(null!==e.i&&(n.textContent=""),g(n,null,t,s,0,s.length-1)):null!==l&&S(l,0,l.length-1)):e.i!==o&&(n.data=o)},k=e=>D(e).p,v=(e,t,n)=>{const l=k(e);return{emit:e=>C(l,t,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:e})}},C=(e,t,n)=>{const l=o.ce(t,n);return e.dispatchEvent(l),l},O=(e,t)=>{t&&!e.g&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.g=t)))},P=(e,t)=>{if(e.t|=16,!(4&e.t))return O(e,e.S),ee((()=>x(e,t)));e.t|=512},x=(e,t)=>{const n=e.j;let l;return t&&(l=T(n,"componentWillLoad")),W(l,(()=>E(e,n,t)))},E=async(e,t,n)=>{const l=e.p,o=l["s-rc"];n&&(e=>{const t=e.M,n=e.p,l=t.t,o=((e,t)=>{let n=a(t),l=I.get(n);if(e=11===e.nodeType?e:s,l)if("string"==typeof l){let t,o=r.get(e=e.head||e);o||r.set(e,o=new Set),o.has(n)||(t=s.createElement("style"),t.innerHTML=l,e.insertBefore(t,e.querySelector("link")),o&&o.add(n))}else e.adoptedStyleSheets.includes(l)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);L(e,t),o&&(o.map((e=>e())),l["s-rc"]=void 0);{const t=l["s-p"],n=()=>N(e);0===t.length?n():(Promise.all(t).then(n),e.t|=4,t.length=0)}},L=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.p,o=n.M,c=n.k||h(null,null),i=(e=>e&&e.$===$)(l)?l:d(null,null,l);t=s.tagName,o.v&&(i.u=i.u||{},o.v.map((([e,t])=>i.u[t]=s[e]))),i.$=null,i.t|=4,n.k=i,i.m=c.m=s.shadowRoot||s,e=s["s-sc"],M(c,i)})(n,l)}catch(e){z(e,n.p)}return null},N=e=>{const t=e.p,n=e.S;T(e.j,"componentDidRender"),64&e.t||(e.t|=64,A(t),e.C(t),n||R()),e.g&&(e.g(),e.g=void 0),512&e.t&&Z((()=>P(e,!1))),e.t&=-517},R=()=>{A(s.documentElement),Z((()=>C(l,"appload",{detail:{namespace:"casino-engagement-suite-challenges-details"}})))},T=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){z(e)}},W=(e,t)=>e&&e.then?e.then(t):t(),A=e=>e.classList.add("hydrated"),F=(e,t,n)=>{if(t.O){e.watchers&&(t.P=e.watchers);const l=Object.entries(t.O),s=e.prototype;if(l.map((([e,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(s,e,{get(){return((e,t)=>D(this).L.get(t))(0,e)},set(n){((e,t,n,l)=>{const s=D(e),o=s.p,c=s.L.get(t),i=s.t,r=s.j;if(n=((e,t)=>null==e||f(e)?e:4&t?"false"!==e&&(""===e||!!e):2&t?parseFloat(e):1&t?e+"":e)(n,l.O[t][0]),(!(8&i)||void 0===c)&&n!==c&&(!Number.isNaN(c)||!Number.isNaN(n))&&(s.L.set(t,n),r)){if(l.P&&128&i){const e=l.P[t];e&&e.map((e=>{try{r[e](n,c,t)}catch(e){z(e,o)}}))}2==(18&i)&&P(s,!1)}})(this,e,n,t)},configurable:!0,enumerable:!0})})),1&n){const n=new Map;s.attributeChangedCallback=function(e,t,l){o.jmp((()=>{const t=n.get(e);if(this.hasOwnProperty(t))l=this[t],delete this[t];else if(s.hasOwnProperty(t)&&"number"==typeof this[t]&&this[t]==l)return;this[t]=(null!==l||"boolean"!=typeof this[t])&&l}))},e.observedAttributes=l.filter((([e,t])=>15&t[0])).map((([e,l])=>{const s=l[1]||e;return n.set(s,e),512&l[0]&&t.v.push([e,s]),s}))}}return e},U=(e,t={})=>{const n=[],c=t.exclude||[],r=l.customElements,u=s.head,f=u.querySelector("meta[charset]"),d=s.createElement("style"),h=[];let $,m=!0;Object.assign(o,t),o.l=new URL(t.resourcesUrl||"./",s.baseURI).href,e.map((e=>{e[1].map((t=>{const l={t:t[0],o:t[1],O:t[2],N:t[3]};l.O=t[2],l.v=[],l.P={};const s=l.o,u=class extends HTMLElement{constructor(e){super(e),V(e=this,l),1&l.t&&e.attachShadow({mode:"open"})}connectedCallback(){$&&(clearTimeout($),$=null),m?h.push(this):o.jmp((()=>(e=>{if(0==(1&o.t)){const t=D(e),n=t.M,l=()=>{};if(!(1&t.t)){t.t|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){O(t,t.S=n);break}}n.O&&Object.entries(n.O).map((([t,[n]])=>{if(31&n&&e.hasOwnProperty(t)){const n=e[t];delete e[t],e[t]=n}})),(async(e,t,n,l,s)=>{if(0==(32&t.t)){{if(t.t|=32,(s=G(n)).then){const e=()=>{};s=await s,e()}s.isProxied||(n.P=s.watchers,F(s,n,2),s.isProxied=!0);const e=()=>{};t.t|=8;try{new s(t)}catch(e){z(e)}t.t&=-9,t.t|=128,e()}if(s.style){let e=s.style;const t=a(n);if(!I.has(t)){const l=()=>{};((e,t,n)=>{let l=I.get(e);i&&n?(l=l||new CSSStyleSheet,l.replace(t)):l=t,I.set(e,l)})(t,e,!!(1&n.t)),l()}}}const o=t.S,c=()=>P(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,t,n)}l()}})(this)))}disconnectedCallback(){o.jmp((()=>(()=>{0==(1&o.t)&&T(D(this).j,"disconnectedCallback")})()))}componentOnReady(){return D(this).R}};l.T=e[0],c.includes(s)||r.get(s)||(n.push(s),r.define(s,F(u,l,1)))}))})),d.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",d.setAttribute("data-styles",""),u.insertBefore(d,f?f.nextSibling:u.firstChild),m=!1,h.length?h.map((e=>e.connectedCallback())):o.jmp((()=>$=setTimeout(R,30)))},q=new WeakMap,D=e=>q.get(e),H=(e,t)=>q.set(t.j=e,t),V=(e,t)=>{const n={t:0,p:e,M:t,L:new Map};return n.R=new Promise((e=>n.C=e)),e["s-p"]=[],e["s-rc"]=[],q.set(e,n)},_=(e,t)=>t in e,z=(e,t)=>(0,console.error)(e,t),B=new Map,G=e=>{const t=e.o.replace(/-/g,"_"),n=e.T,l=B.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(B.set(n,e),e[t])),z)},I=new Map,J=[],K=[],Q=(e,t)=>l=>{e.push(l),n||(n=!0,t&&4&o.t?Z(Y):o.raf(Y))},X=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){z(e)}e.length=0},Y=()=>{X(J),X(K),(n=J.length>0)&&o.raf(Y)},Z=e=>c().then(e),ee=Q(K,!0);export{U as b,v as c,k as g,d as h,c as p,H as r}

package/dist/casino-engagement-suite-challenges-details/p-9159f1ae.entry.js

@@ -0,0 +1 @@
+import{r as e,c as t,h as l,g as s}from"./p-8db66ba7.js";const a=["en"],n={en:{challenges:"Challenges",join:"Join",unjoin:"Unjoin",details:"Challenge Details",tc:"Terms & Conditions",level:"Level",place:"Place",bet:"bet",bets:"bets",win:"Win"}},i=(e,t)=>{const l=t;return n[void 0!==l&&a.includes(l)?l:"en"][e]};var o,r;!function(e){e[e.Closed=0]="Closed",e[e.InProgress=1]="InProgress",e[e.Fillup=2]="Fillup",e[e.Completed=3]="Completed"}(o||(o={})),function(e){e[e.Started=0]="Started",e[e.InProgress=1]="InProgress",e[e.PendingLevelReward=2]="PendingLevelReward",e[e.Completed=3]="Completed",e[e.Expired=4]="Expired"}(r||(r={}));const g=class{constructor(l){e(this,l),this.close=t(this,"close",7),this.back=t(this,"back",7),this.clientStyling="",this.clientStylingUrl="",this.language="en",this.gameSlug="",this.device="Mobile",this.limitStylingAppends=!1,this.timer="",this.showDetails=!1,this.isExpiredChallenge=!1,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.host.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),t=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{t.innerHTML=e,setTimeout((()=>{this.host.prepend(t)}),1)})).catch((e=>{console.log("Error ",e)}))},this.handleCloseClick=()=>{this.close.emit()},this.handleBackClick=()=>{this.back.emit()}}challengePropHandler(e){!this.interval&&e&&(this.updateTimer(),this.startCountdown()),this.interval&&!e&&clearInterval(this.interval)}componentWillLoad(){this.challengePropHandler(this.challenge)}componentDidRender(){!this.limitStylingAppends&&this.host&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}disconnectedCallback(){this.interval&&clearInterval(this.interval)}getActionsTemplate(){return l("header",{class:"ChallengeActions"},l("button",{class:"ChallengeIconButton",onClick:this.handleBackClick},l("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/back.svg",alt:"back"})),"Mobile"!==this.device&&l("div",{class:"ChallengePopupName"},i("challenges",this.language)),l("button",{class:"ChallengeIconButton",onClick:this.handleCloseClick},l("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/close.svg",alt:"close"})))}getChallengeHeader(){const e=this.challenge.Status===r.InProgress;return l("div",{class:"ChallengeDetailsHeader"},l("span",{class:"ChallengeName"},this.challenge.ChallengePresentation.PresentationName),l("button",{class:`ChallengeJoinButton ${e?"Joined":""}\n          ${this.isExpiredChallenge?"Disabled":""}`},i(e?"unjoin":"join",this.language)))}getChallengeCountdown(){return l("div",{class:"ChallengeCountdown "+(this.isExpiredChallenge?"Expired":"")},this.isExpiredChallenge?"Expired":this.timer)}getChallengeDetails(){const e=this.challenge.ChallengePresentation.Description,t=this.challenge.ChallengePresentation.Url,s=this.challenge.Games;return l("div",{class:"CollapseDetails "+(this.showDetails?"ShowDetails":"")},e&&l("span",{class:"ChallengeDescription"},e),t&&l("div",{class:"TC"},l("a",{href:t,target:"_blank"},i("tc",this.language))),(null==s?void 0:s.length)&&l("div",{class:"ChallengeGames"},s.map((e=>l("div",{class:"Game"},l("img",{src:e.GameIcon,alt:e.GameName,onClick:()=>this.onGameClick(e.GameSlug),class:e.GameSlug===this.gameSlug?"Disabled":""}))))))}onGameClick(e){window.postMessage({type:"GameClick",slug:e})}startCountdown(){this.interval=setInterval((()=>{this.updateTimer()}),1e3)}updateTimer(){const e=new Date(this.challenge.ExpirationTime).getTime()-(new Date).getTime();if(e<1)return clearInterval(this.interval),this.timer="",void(this.isExpiredChallenge=!0);const{days:t,hours:l,minutes:s,seconds:a}={days:String(Math.floor(e/864e5)).padStart(2,"0"),hours:String(Math.floor(e%864e5/36e5)).padStart(2,"0"),minutes:String(Math.floor(e%36e5/6e4)).padStart(2,"0"),seconds:String(Math.floor(e%6e4/1e3)).padStart(2,"0")};this.timer="00"===t?`${l}h:${s}m:${a}s`:`${t}d:${l}h:${s}m`}getLevelTarget(e){let t=`${i("place",this.language)} ${e.TargetTurnover}`;return 1===e.LevelTargetType?t+=` ${i("bet",this.language)}`:2===e.LevelTargetType&&(t+=` ${i("bets",this.language)} X ${e.TargetBetCount}`),l("span",{class:"ChallengeLevelTarget"},t)}getChallengeLevels(){const e=this.challenge.Status===r.Started&&this.challenge.LevelProgresses[0].ProgressPercentage>0,t=t=>"ChallengeLevelCard "+(1!==t.ProgressStatus||this.isExpiredChallenge||e?"":"InProgress");return l("div",{class:"ChallengeLevels"},this.challenge.LevelProgresses.map(((s,a)=>l("div",{class:t(s)},l("casino-engagement-suite-progress-bar",{class:this.device,value:s.ProgressPercentage,"hide-percent":0===s.ProgressPercentage||100===s.ProgressPercentage,disabled:this.isExpiredChallenge||e},l("span",{slot:"Title",class:"ChallengeLevelTitle"},l("span",null,"Level ",a+1,": "),this.getLevelTarget(s))),l("div",{class:"ChallengeRewardMessage"},l("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/reward.svg",alt:"win"}),l("span",null,i("win",this.language),": "),l("span",{class:"CustomRewardMessage"},s.CustomRewardMessage))))))}getToggleButton(){return l("div",{class:"ChallengeCollapseButton",onClick:()=>this.showDetails=!this.showDetails},l("span",{class:"Toggle "+(this.showDetails?"Closed":"Open")}),l("span",null,i("details",this.language)))}render(){return l("div",{class:`ChallengeDetailsPopup ${this.device}`},this.getActionsTemplate(),l("div",{class:"ChallengeDetails"},this.getChallengeHeader(),this.getChallengeCountdown(),this.getToggleButton(),this.getChallengeDetails(),this.getChallengeLevels()))}get host(){return s(this)}static get watchers(){return{challenge:["challengePropHandler"]}}};g.style='@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:"Montserrat", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:"";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:"Montserrat", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;font-size:var(--emw--font-size-x-small, 12px);line-height:12px;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url("https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url("https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF);text-underline-offset:3px}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeLevelTitle{margin-bottom:2px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;line-height:15px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:"";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeActions,.ChallengeDetailsPopup.Desktop .ChallengeActions{padding-top:16px}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeLevelTitle,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeLevelTitle{margin-bottom:4px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeRewardMessage{margin-top:12px;line-height:17px}';const h=class{constructor(t){e(this,t),this.value=0,this.disabled=!1,this.clientStyling="",this.clientStylingUrl="",this.limitStylingAppends=!1,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.host.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),t=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{t.innerHTML=e,setTimeout((()=>{this.host.prepend(t)}),1)})).catch((e=>{console.log("Error ",e)}))}}componentDidRender(){!this.limitStylingAppends&&this.host&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}getProgressBarClasses(){return{ProgressBar:!0,Completed:100===this.value,Disabled:this.disabled}}render(){return l("div",{class:this.getProgressBarClasses(),part:"ProgressBar"},l("div",{class:"ProgressBarInfo",part:"ProgressBarInfo"},l("slot",{name:"Title"},l("div",null)),l("slot",{name:"Percent"},l("div",{class:"ProgressBarPercent",part:"ProgressBarPercent"},this.value,"%"))),l("div",{class:"ProgressBarBackground",part:"ProgressBarBackground"},l("div",{class:"ProgressBarLine",part:"ProgressBarLine",style:{width:this.value+"%"}})))}get host(){return s(this)}};h.style=":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:14px;line-height:14px}.ProgressBarBackground{height:8px;background-color:var(--emw--color-background, #666178);border-radius:4px;position:relative}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);transition:width ease-out 0.3s}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:700;font-size:12px;line-height:12px}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ProgressBar.Disabled .ProgressBarPercent{color:var(--emw--color-background, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";export{g as casino_engagement_suite_challenges_details,h as casino_engagement_suite_progress_bar}

package/dist/cjs/casino-engagement-suite-challenges-details.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-ec28d374.js');
+const index = require('./index-7b0587ba.js');
 
 /*
  Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["casino-engagement-suite-challenges-details.cjs",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}]]]], options);
+  return index.bootstrapLazy([["casino-engagement-suite-challenges-details_2.cjs",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
 });

package/dist/cjs/{casino-engagement-suite-challenges-details.cjs.entry.js → casino-engagement-suite-challenges-details_2.cjs.entry.js}

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-ec28d374.js');
+const index = require('./index-7b0587ba.js');
 
 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['en'];
@@ -41,12 +41,13 @@ var ChallengeProgressStatus;
   ChallengeProgressStatus[ChallengeProgressStatus["Expired"] = 4] = "Expired";
 })(ChallengeProgressStatus || (ChallengeProgressStatus = {}));
 
-const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF)}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);line-height:15px;word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .CustomRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .CustomRewardMessage{line-height:17px}";
+const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;font-size:var(--emw--font-size-x-small, 12px);line-height:12px;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF);text-underline-offset:3px}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeLevelTitle{margin-bottom:2px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;line-height:15px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeActions,.ChallengeDetailsPopup.Desktop .ChallengeActions{padding-top:16px}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeLevelTitle,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeLevelTitle{margin-bottom:4px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeRewardMessage{margin-top:12px;line-height:17px}";
 
 const CasinoEngagementSuiteChallengesDetails = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.close = index.createEvent(this, "close", 7);
+    this.back = index.createEvent(this, "back", 7);
     /**
      * Client custom styling via string
      */
@@ -91,17 +92,22 @@ const CasinoEngagementSuiteChallengesDetails = class {
     };
     this.handleCloseClick = () => {
       this.close.emit();
-      clearInterval(this.interval);
-      this.isExpiredChallenge = false;
-      this.showDetails = false;
+    };
+    this.handleBackClick = () => {
+      this.back.emit();
     };
   }
-  challengePropHandler() {
-    this.updateTimer();
-    this.startCountdown();
+  challengePropHandler(value) {
+    if (!this.interval && value) {
+      this.updateTimer();
+      this.startCountdown();
+    }
+    if (this.interval && !value) {
+      clearInterval(this.interval);
+    }
   }
   componentWillLoad() {
-    this.challengePropHandler();
+    this.challengePropHandler(this.challenge);
   }
   componentDidRender() {
     if (!this.limitStylingAppends && this.host) {
@@ -112,8 +118,11 @@ const CasinoEngagementSuiteChallengesDetails = class {
       this.limitStylingAppends = true;
     }
   }
+  disconnectedCallback() {
+    this.interval && clearInterval(this.interval);
+  }
   getActionsTemplate() {
-    return (index.h("header", { class: "ChallengeActions" }, index.h("button", { class: "ChallengeIconButton" }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && index.h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), index.h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
+    return (index.h("header", { class: "ChallengeActions" }, index.h("button", { class: "ChallengeIconButton", onClick: this.handleBackClick }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && index.h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), index.h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
   }
   getChallengeHeader() {
     const presentationName = this.challenge.ChallengePresentation.PresentationName;
@@ -172,7 +181,12 @@ const CasinoEngagementSuiteChallengesDetails = class {
     return (index.h("span", { class: "ChallengeLevelTarget" }, levelTarget));
   }
   getChallengeLevels() {
-    return (index.h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index$1) => (index.h("div", { class: `ChallengeLevelCard ${level.ProgressStatus === 1 ? 'InProgress' : ''}` }, index.h("div", { class: "ChallengeLevelHeader" }, index.h("span", null, "Level ", index$1 + 1, ": "), this.getLevelTarget(level)), index.h("div", { class: "ChallengeRewardMessage" }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), index.h("span", null, translate('win', this.language), ": "), index.h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
+    const isChallengePaused = this.challenge.Status === ChallengeProgressStatus.Started
+      && this.challenge.LevelProgresses[0].ProgressPercentage > 0;
+    const getClass = (level) => {
+      return `ChallengeLevelCard ${(level.ProgressStatus === 1 && !this.isExpiredChallenge && !isChallengePaused) ? 'InProgress' : ''}`;
+    };
+    return (index.h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index$1) => (index.h("div", { class: getClass(level) }, index.h("casino-engagement-suite-progress-bar", { class: this.device, value: level.ProgressPercentage, "hide-percent": level.ProgressPercentage === 0 || level.ProgressPercentage === 100, disabled: this.isExpiredChallenge || isChallengePaused }, index.h("span", { slot: "Title", class: "ChallengeLevelTitle" }, index.h("span", null, "Level ", index$1 + 1, ": "), this.getLevelTarget(level))), index.h("div", { class: "ChallengeRewardMessage" }, index.h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), index.h("span", null, translate('win', this.language), ": "), index.h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
   }
   getToggleButton() {
     return (index.h("div", { class: "ChallengeCollapseButton", onClick: () => this.showDetails = !this.showDetails }, index.h("span", { class: `Toggle ${this.showDetails ? 'Closed' : 'Open'}` }), index.h("span", null, translate('details', this.language))));
@@ -187,4 +201,69 @@ const CasinoEngagementSuiteChallengesDetails = class {
 };
 CasinoEngagementSuiteChallengesDetails.style = casinoEngagementSuiteChallengesDetailsCss;
 
+const casinoEngagementSuiteProgressBarCss = ":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:14px;line-height:14px}.ProgressBarBackground{height:8px;background-color:var(--emw--color-background, #666178);border-radius:4px;position:relative}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);transition:width ease-out 0.3s}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:700;font-size:12px;line-height:12px}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ProgressBar.Disabled .ProgressBarPercent{color:var(--emw--color-background, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";
+
+const CasinoEngagementSuiteProgressBar = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    /**
+     * Value for the widget
+     */
+    this.value = 0;
+    /**
+     * Shows disabled styles
+     */
+    this.disabled = false;
+    /**
+     * Client custom styling via string
+     */
+    this.clientStyling = '';
+    /**
+     * Client custom styling via url
+     */
+    this.clientStylingUrl = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.host.prepend(sheet);
+    };
+    this.setClientStylingURL = () => {
+      let url = new URL(this.clientStylingUrl);
+      let cssFile = document.createElement('style');
+      fetch(url.href)
+        .then((res) => res.text())
+        .then((data) => {
+        cssFile.innerHTML = data;
+        setTimeout(() => { this.host.prepend(cssFile); }, 1);
+      })
+        .catch((err) => {
+        console.log('Error ', err);
+      });
+    };
+  }
+  componentDidRender() {
+    if (!this.limitStylingAppends && this.host) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      if (this.clientStylingUrl)
+        this.setClientStylingURL();
+      this.limitStylingAppends = true;
+    }
+  }
+  getProgressBarClasses() {
+    return {
+      ProgressBar: true,
+      Completed: this.value === 100,
+      Disabled: this.disabled
+    };
+  }
+  render() {
+    return index.h("div", { class: this.getProgressBarClasses(), part: "ProgressBar" }, index.h("div", { class: "ProgressBarInfo", part: "ProgressBarInfo" }, index.h("slot", { name: "Title" }, index.h("div", null)), index.h("slot", { name: "Percent" }, index.h("div", { class: "ProgressBarPercent", part: "ProgressBarPercent" }, this.value, "%"))), index.h("div", { class: "ProgressBarBackground", part: "ProgressBarBackground" }, index.h("div", { class: "ProgressBarLine", part: "ProgressBarLine", style: { width: this.value + '%' } })));
+  }
+  get host() { return index.getElement(this); }
+};
+CasinoEngagementSuiteProgressBar.style = casinoEngagementSuiteProgressBarCss;
+
 exports.casino_engagement_suite_challenges_details = CasinoEngagementSuiteChallengesDetails;
+exports.casino_engagement_suite_progress_bar = CasinoEngagementSuiteProgressBar;

package/dist/cjs/{index-ec28d374.js → index-7b0587ba.js}

@@ -234,6 +234,31 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
             classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
             classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
         }
+        else if (memberName === 'style') {
+            // update style attribute, css properties and values
+            {
+                for (const prop in oldValue) {
+                    if (!newValue || newValue[prop] == null) {
+                        if (prop.includes('-')) {
+                            elm.style.removeProperty(prop);
+                        }
+                        else {
+                            elm.style[prop] = '';
+                        }
+                    }
+                }
+            }
+            for (const prop in newValue) {
+                if (!oldValue || newValue[prop] !== oldValue[prop]) {
+                    if (prop.includes('-')) {
+                        elm.style.setProperty(prop, newValue[prop]);
+                    }
+                    else {
+                        elm.style[prop] = newValue[prop];
+                    }
+                }
+            }
+        }
         else if ((!isProp ) &&
             memberName[0] === 'o' &&
             memberName[1] === 'n') {
@@ -473,11 +498,14 @@ const patch = (oldVNode, newVNode) => {
     const elm = (newVNode.$elm$ = oldVNode.$elm$);
     const oldChildren = oldVNode.$children$;
     const newChildren = newVNode.$children$;
+    const tag = newVNode.$tag$;
     const text = newVNode.$text$;
     if (text === null) {
         // element node
         {
-            {
+            if (tag === 'slot')
+                ;
+            else {
                 // either this is the first render of an element OR it's an update
                 // AND we already know it's possible it could have changed
                 // this updates the element's css classes, attrs, props, listeners, etc.
@@ -738,6 +766,15 @@ const addHydratedFlag = (elm) => elm.classList.add('hydrated')
 const parsePropertyValue = (propValue, propType) => {
     // ensure this value is of the correct prop type
     if (propValue != null && !isComplexType(propValue)) {
+        if (propType & 4 /* Boolean */) {
+            // per the HTML spec, any string value means it is a boolean true value
+            // but we'll cheat here and say that the string "false" is the boolean false
+            return propValue === 'false' ? false : propValue === '' || !!propValue;
+        }
+        if (propType & 2 /* Number */) {
+            // force it to be a number
+            return parseFloat(propValue);
+        }
         if (propType & 1 /* String */) {
             // could have been passed as a number or boolean
             // but we still want it as a string
@@ -1009,7 +1046,11 @@ const connectedCallback = (elm) => {
 };
 const disconnectedCallback = (elm) => {
     if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
-        getHostRef(elm);
+        const hostRef = getHostRef(elm);
+        const instance = hostRef.$lazyInstance$ ;
+        {
+            safeCall(instance, 'disconnectedCallback');
+        }
     }
 };
 const bootstrapLazy = (lazyBundles, options = {}) => {

package/dist/cjs/loader.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-ec28d374.js');
+const index = require('./index-7b0587ba.js');
 
 /*
  Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["casino-engagement-suite-challenges-details.cjs",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}]]]], options);
+  return index.bootstrapLazy([["casino-engagement-suite-challenges-details_2.cjs",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
   });
 };
 

package/dist/collection/collection-manifest.json

@@ -7,6 +7,13 @@
     "version": "2.15.2",
     "typescriptVersion": "4.5.4"
   },
-  "collections": [],
+  "collections": [
+    {
+      "name": "@everymatrix/casino-engagement-suite-progress-bar",
+      "tags": [
+        "casino-engagement-suite-progress-bar"
+      ]
+    }
+  ],
   "bundles": []
 }

package/dist/collection/components/casino-engagement-suite-challenges-details/casino-engagement-suite-challenges-details.css

@@ -129,6 +129,8 @@ button:focus {
   display: flex;
   flex-direction: row;
   align-items: center;
+  font-size: var(--emw--font-size-x-small, 12px);
+  line-height: 12px;
   color: var(--emw--color-primary-variant, #666178);
   cursor: pointer;
 }
@@ -160,6 +162,7 @@ button:focus {
 }
 .CollapseDetails .TC a {
   color: var(--emw--color-secondary, #59D1FF);
+  text-underline-offset: 3px;
 }
 .CollapseDetails .ChallengeGames {
   width: 100%;
@@ -201,8 +204,12 @@ button:focus {
   padding: 16px;
   border-radius: 8px;
 }
+.ChallengeLevels .ChallengeLevelCard .ChallengeLevelTitle {
+  margin-bottom: 2px;
+}
 .ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage {
   margin-top: 10px;
+  line-height: 15px;
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -210,7 +217,6 @@ button:focus {
 }
 .ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage {
   font-weight: var(--emw--font-weight-semibold, 600);
-  line-height: 15px;
   word-break: break-all;
 }
 .ChallengeLevels .InProgress {
@@ -233,6 +239,10 @@ button:focus {
   mask-composite: exclude;
 }
 
+.ChallengeDetailsPopup.Tablet .ChallengeActions,
+.ChallengeDetailsPopup.Desktop .ChallengeActions {
+  padding-top: 16px;
+}
 .ChallengeDetailsPopup.Tablet .ChallengeIconButton,
 .ChallengeDetailsPopup.Desktop .ChallengeIconButton {
   width: 24px;
@@ -264,7 +274,12 @@ button:focus {
 .ChallengeDetailsPopup.Desktop .ChallengeCollapseButton {
   margin-bottom: 12px;
 }
-.ChallengeDetailsPopup.Tablet .ChallengeLevels .CustomRewardMessage,
-.ChallengeDetailsPopup.Desktop .ChallengeLevels .CustomRewardMessage {
+.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeLevelTitle,
+.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeLevelTitle {
+  margin-bottom: 4px;
+}
+.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeRewardMessage,
+.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeRewardMessage {
+  margin-top: 12px;
   line-height: 17px;
 }

package/dist/collection/components/casino-engagement-suite-challenges-details/casino-engagement-suite-challenges-details.js

@@ -1,6 +1,7 @@
 import { Component, h, Prop, State, Element, Event, Watch } from '@stencil/core';
 import { translate } from '../../utils/locale.utils';
 import { ChallengeProgressStatus } from '../../models/casino-challenges-details';
+import '@everymatrix/casino-engagement-suite-progress-bar';
 export class CasinoEngagementSuiteChallengesDetails {
   constructor() {
     /**
@@ -47,17 +48,22 @@ export class CasinoEngagementSuiteChallengesDetails {
     };
     this.handleCloseClick = () => {
       this.close.emit();
-      clearInterval(this.interval);
-      this.isExpiredChallenge = false;
-      this.showDetails = false;
+    };
+    this.handleBackClick = () => {
+      this.back.emit();
     };
   }
-  challengePropHandler() {
-    this.updateTimer();
-    this.startCountdown();
+  challengePropHandler(value) {
+    if (!this.interval && value) {
+      this.updateTimer();
+      this.startCountdown();
+    }
+    if (this.interval && !value) {
+      clearInterval(this.interval);
+    }
   }
   componentWillLoad() {
-    this.challengePropHandler();
+    this.challengePropHandler(this.challenge);
   }
   componentDidRender() {
     if (!this.limitStylingAppends && this.host) {
@@ -68,9 +74,12 @@ export class CasinoEngagementSuiteChallengesDetails {
       this.limitStylingAppends = true;
     }
   }
+  disconnectedCallback() {
+    this.interval && clearInterval(this.interval);
+  }
   getActionsTemplate() {
     return (h("header", { class: "ChallengeActions" },
-      h("button", { class: "ChallengeIconButton" },
+      h("button", { class: "ChallengeIconButton", onClick: this.handleBackClick },
         h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })),
       this.device !== 'Mobile' && h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)),
       h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick },
@@ -140,13 +149,19 @@ export class CasinoEngagementSuiteChallengesDetails {
     return (h("span", { class: "ChallengeLevelTarget" }, levelTarget));
   }
   getChallengeLevels() {
-    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: `ChallengeLevelCard ${level.ProgressStatus === 1 ? 'InProgress' : ''}` },
-      h("div", { class: "ChallengeLevelHeader" },
-        h("span", null,
-          "Level ",
-          index + 1,
-          ": "),
-        this.getLevelTarget(level)),
+    const isChallengePaused = this.challenge.Status === ChallengeProgressStatus.Started
+      && this.challenge.LevelProgresses[0].ProgressPercentage > 0;
+    const getClass = (level) => {
+      return `ChallengeLevelCard ${(level.ProgressStatus === 1 && !this.isExpiredChallenge && !isChallengePaused) ? 'InProgress' : ''}`;
+    };
+    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: getClass(level) },
+      h("casino-engagement-suite-progress-bar", { class: this.device, value: level.ProgressPercentage, "hide-percent": level.ProgressPercentage === 0 || level.ProgressPercentage === 100, disabled: this.isExpiredChallenge || isChallengePaused },
+        h("span", { slot: "Title", class: "ChallengeLevelTitle" },
+          h("span", null,
+            "Level ",
+            index + 1,
+            ": "),
+          this.getLevelTarget(level))),
       h("div", { class: "ChallengeRewardMessage" },
         h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }),
         h("span", null,
@@ -310,6 +325,21 @@ export class CasinoEngagementSuiteChallengesDetails {
         "resolved": "void",
         "references": {}
       }
+    }, {
+      "method": "back",
+      "name": "back",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "void",
+        "resolved": "void",
+        "references": {}
+      }
     }]; }
   static get elementRef() { return "host"; }
   static get watchers() { return [{

package/dist/components/casino-engagement-suite-challenges-details.js

@@ -1,4 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './casino-engagement-suite-progress-bar2.js';
 
 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['en'];
@@ -37,7 +38,7 @@ var ChallengeProgressStatus;
   ChallengeProgressStatus[ChallengeProgressStatus["Expired"] = 4] = "Expired";
 })(ChallengeProgressStatus || (ChallengeProgressStatus = {}));
 
-const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF)}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);line-height:15px;word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .CustomRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .CustomRewardMessage{line-height:17px}";
+const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;font-size:var(--emw--font-size-x-small, 12px);line-height:12px;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF);text-underline-offset:3px}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeLevelTitle{margin-bottom:2px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;line-height:15px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeActions,.ChallengeDetailsPopup.Desktop .ChallengeActions{padding-top:16px}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeLevelTitle,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeLevelTitle{margin-bottom:4px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeRewardMessage{margin-top:12px;line-height:17px}";
 
 const CasinoEngagementSuiteChallengesDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -45,6 +46,7 @@ const CasinoEngagementSuiteChallengesDetails$1 = /*@__PURE__*/ proxyCustomElemen
     this.__registerHost();
     this.__attachShadow();
     this.close = createEvent(this, "close", 7);
+    this.back = createEvent(this, "back", 7);
     /**
      * Client custom styling via string
      */
@@ -89,17 +91,22 @@ const CasinoEngagementSuiteChallengesDetails$1 = /*@__PURE__*/ proxyCustomElemen
     };
     this.handleCloseClick = () => {
       this.close.emit();
-      clearInterval(this.interval);
-      this.isExpiredChallenge = false;
-      this.showDetails = false;
+    };
+    this.handleBackClick = () => {
+      this.back.emit();
     };
   }
-  challengePropHandler() {
-    this.updateTimer();
-    this.startCountdown();
+  challengePropHandler(value) {
+    if (!this.interval && value) {
+      this.updateTimer();
+      this.startCountdown();
+    }
+    if (this.interval && !value) {
+      clearInterval(this.interval);
+    }
   }
   componentWillLoad() {
-    this.challengePropHandler();
+    this.challengePropHandler(this.challenge);
   }
   componentDidRender() {
     if (!this.limitStylingAppends && this.host) {
@@ -110,8 +117,11 @@ const CasinoEngagementSuiteChallengesDetails$1 = /*@__PURE__*/ proxyCustomElemen
       this.limitStylingAppends = true;
     }
   }
+  disconnectedCallback() {
+    this.interval && clearInterval(this.interval);
+  }
   getActionsTemplate() {
-    return (h("header", { class: "ChallengeActions" }, h("button", { class: "ChallengeIconButton" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
+    return (h("header", { class: "ChallengeActions" }, h("button", { class: "ChallengeIconButton", onClick: this.handleBackClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
   }
   getChallengeHeader() {
     const presentationName = this.challenge.ChallengePresentation.PresentationName;
@@ -170,7 +180,12 @@ const CasinoEngagementSuiteChallengesDetails$1 = /*@__PURE__*/ proxyCustomElemen
     return (h("span", { class: "ChallengeLevelTarget" }, levelTarget));
   }
   getChallengeLevels() {
-    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: `ChallengeLevelCard ${level.ProgressStatus === 1 ? 'InProgress' : ''}` }, h("div", { class: "ChallengeLevelHeader" }, h("span", null, "Level ", index + 1, ": "), this.getLevelTarget(level)), h("div", { class: "ChallengeRewardMessage" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), h("span", null, translate('win', this.language), ": "), h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
+    const isChallengePaused = this.challenge.Status === ChallengeProgressStatus.Started
+      && this.challenge.LevelProgresses[0].ProgressPercentage > 0;
+    const getClass = (level) => {
+      return `ChallengeLevelCard ${(level.ProgressStatus === 1 && !this.isExpiredChallenge && !isChallengePaused) ? 'InProgress' : ''}`;
+    };
+    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: getClass(level) }, h("casino-engagement-suite-progress-bar", { class: this.device, value: level.ProgressPercentage, "hide-percent": level.ProgressPercentage === 0 || level.ProgressPercentage === 100, disabled: this.isExpiredChallenge || isChallengePaused }, h("span", { slot: "Title", class: "ChallengeLevelTitle" }, h("span", null, "Level ", index + 1, ": "), this.getLevelTarget(level))), h("div", { class: "ChallengeRewardMessage" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), h("span", null, translate('win', this.language), ": "), h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
   }
   getToggleButton() {
     return (h("div", { class: "ChallengeCollapseButton", onClick: () => this.showDetails = !this.showDetails }, h("span", { class: `Toggle ${this.showDetails ? 'Closed' : 'Open'}` }), h("span", null, translate('details', this.language))));
@@ -199,13 +214,18 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["casino-engagement-suite-challenges-details"];
+  const components = ["casino-engagement-suite-challenges-details", "casino-engagement-suite-progress-bar"];
   components.forEach(tagName => { switch (tagName) {
     case "casino-engagement-suite-challenges-details":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, CasinoEngagementSuiteChallengesDetails$1);
       }
       break;
+    case "casino-engagement-suite-progress-bar":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
   } });
 }
 

package/dist/components/casino-engagement-suite-progress-bar.js

@@ -0,0 +1,6 @@
+import { C as CasinoEngagementSuiteProgressBar$1, d as defineCustomElement$1 } from './casino-engagement-suite-progress-bar2.js';
+
+const CasinoEngagementSuiteProgressBar = CasinoEngagementSuiteProgressBar$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { CasinoEngagementSuiteProgressBar, defineCustomElement };

package/dist/components/casino-engagement-suite-progress-bar2.js

@@ -0,0 +1,88 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const casinoEngagementSuiteProgressBarCss = ":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:14px;line-height:14px}.ProgressBarBackground{height:8px;background-color:var(--emw--color-background, #666178);border-radius:4px;position:relative}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);transition:width ease-out 0.3s}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:700;font-size:12px;line-height:12px}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ProgressBar.Disabled .ProgressBarPercent{color:var(--emw--color-background, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";
+
+const CasinoEngagementSuiteProgressBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Value for the widget
+     */
+    this.value = 0;
+    /**
+     * Shows disabled styles
+     */
+    this.disabled = false;
+    /**
+     * Client custom styling via string
+     */
+    this.clientStyling = '';
+    /**
+     * Client custom styling via url
+     */
+    this.clientStylingUrl = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.host.prepend(sheet);
+    };
+    this.setClientStylingURL = () => {
+      let url = new URL(this.clientStylingUrl);
+      let cssFile = document.createElement('style');
+      fetch(url.href)
+        .then((res) => res.text())
+        .then((data) => {
+        cssFile.innerHTML = data;
+        setTimeout(() => { this.host.prepend(cssFile); }, 1);
+      })
+        .catch((err) => {
+        console.log('Error ', err);
+      });
+    };
+  }
+  componentDidRender() {
+    if (!this.limitStylingAppends && this.host) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      if (this.clientStylingUrl)
+        this.setClientStylingURL();
+      this.limitStylingAppends = true;
+    }
+  }
+  getProgressBarClasses() {
+    return {
+      ProgressBar: true,
+      Completed: this.value === 100,
+      Disabled: this.disabled
+    };
+  }
+  render() {
+    return h("div", { class: this.getProgressBarClasses(), part: "ProgressBar" }, h("div", { class: "ProgressBarInfo", part: "ProgressBarInfo" }, h("slot", { name: "Title" }, h("div", null)), h("slot", { name: "Percent" }, h("div", { class: "ProgressBarPercent", part: "ProgressBarPercent" }, this.value, "%"))), h("div", { class: "ProgressBarBackground", part: "ProgressBarBackground" }, h("div", { class: "ProgressBarLine", part: "ProgressBarLine", style: { width: this.value + '%' } })));
+  }
+  get host() { return this; }
+  static get style() { return casinoEngagementSuiteProgressBarCss; }
+}, [1, "casino-engagement-suite-progress-bar", {
+    "value": [2],
+    "disabled": [4],
+    "clientStyling": [513, "client-styling"],
+    "clientStylingUrl": [513, "client-styling-url"],
+    "limitStylingAppends": [32]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["casino-engagement-suite-progress-bar"];
+  components.forEach(tagName => { switch (tagName) {
+    case "casino-engagement-suite-progress-bar":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, CasinoEngagementSuiteProgressBar);
+      }
+      break;
+  } });
+}
+
+export { CasinoEngagementSuiteProgressBar as C, defineCustomElement as d };

package/dist/esm/casino-engagement-suite-challenges-details.js

@@ -1,4 +1,4 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-13f457d0.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-5178deb5.js';
 
 /*
  Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
@@ -13,5 +13,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["casino-engagement-suite-challenges-details",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}]]]], options);
+  return bootstrapLazy([["casino-engagement-suite-challenges-details_2",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
 });

package/dist/esm/{casino-engagement-suite-challenges-details.entry.js → casino-engagement-suite-challenges-details_2.entry.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-13f457d0.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-5178deb5.js';
 
 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['en'];
@@ -37,12 +37,13 @@ var ChallengeProgressStatus;
   ChallengeProgressStatus[ChallengeProgressStatus["Expired"] = 4] = "Expired";
 })(ChallengeProgressStatus || (ChallengeProgressStatus = {}));
 
-const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF)}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);line-height:15px;word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .CustomRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .CustomRewardMessage{line-height:17px}";
+const casinoEngagementSuiteChallengesDetailsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap\"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:\"Montserrat\", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:\"\";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:\"Montserrat\", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;font-size:var(--emw--font-size-x-small, 12px);line-height:12px;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg\") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url(\"https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg\") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF);text-underline-offset:3px}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeLevelTitle{margin-bottom:2px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;line-height:15px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:\"\";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeActions,.ChallengeDetailsPopup.Desktop .ChallengeActions{padding-top:16px}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeLevelTitle,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeLevelTitle{margin-bottom:4px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .ChallengeRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .ChallengeRewardMessage{margin-top:12px;line-height:17px}";
 
 const CasinoEngagementSuiteChallengesDetails = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.close = createEvent(this, "close", 7);
+    this.back = createEvent(this, "back", 7);
     /**
      * Client custom styling via string
      */
@@ -87,17 +88,22 @@ const CasinoEngagementSuiteChallengesDetails = class {
     };
     this.handleCloseClick = () => {
       this.close.emit();
-      clearInterval(this.interval);
-      this.isExpiredChallenge = false;
-      this.showDetails = false;
+    };
+    this.handleBackClick = () => {
+      this.back.emit();
     };
   }
-  challengePropHandler() {
-    this.updateTimer();
-    this.startCountdown();
+  challengePropHandler(value) {
+    if (!this.interval && value) {
+      this.updateTimer();
+      this.startCountdown();
+    }
+    if (this.interval && !value) {
+      clearInterval(this.interval);
+    }
   }
   componentWillLoad() {
-    this.challengePropHandler();
+    this.challengePropHandler(this.challenge);
   }
   componentDidRender() {
     if (!this.limitStylingAppends && this.host) {
@@ -108,8 +114,11 @@ const CasinoEngagementSuiteChallengesDetails = class {
       this.limitStylingAppends = true;
     }
   }
+  disconnectedCallback() {
+    this.interval && clearInterval(this.interval);
+  }
   getActionsTemplate() {
-    return (h("header", { class: "ChallengeActions" }, h("button", { class: "ChallengeIconButton" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
+    return (h("header", { class: "ChallengeActions" }, h("button", { class: "ChallengeIconButton", onClick: this.handleBackClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/back.svg", alt: "back" })), this.device !== 'Mobile' && h("div", { class: "ChallengePopupName" }, translate('challenges', this.language)), h("button", { class: "ChallengeIconButton", onClick: this.handleCloseClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "close" }))));
   }
   getChallengeHeader() {
     const presentationName = this.challenge.ChallengePresentation.PresentationName;
@@ -168,7 +177,12 @@ const CasinoEngagementSuiteChallengesDetails = class {
     return (h("span", { class: "ChallengeLevelTarget" }, levelTarget));
   }
   getChallengeLevels() {
-    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: `ChallengeLevelCard ${level.ProgressStatus === 1 ? 'InProgress' : ''}` }, h("div", { class: "ChallengeLevelHeader" }, h("span", null, "Level ", index + 1, ": "), this.getLevelTarget(level)), h("div", { class: "ChallengeRewardMessage" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), h("span", null, translate('win', this.language), ": "), h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
+    const isChallengePaused = this.challenge.Status === ChallengeProgressStatus.Started
+      && this.challenge.LevelProgresses[0].ProgressPercentage > 0;
+    const getClass = (level) => {
+      return `ChallengeLevelCard ${(level.ProgressStatus === 1 && !this.isExpiredChallenge && !isChallengePaused) ? 'InProgress' : ''}`;
+    };
+    return (h("div", { class: "ChallengeLevels" }, this.challenge.LevelProgresses.map((level, index) => (h("div", { class: getClass(level) }, h("casino-engagement-suite-progress-bar", { class: this.device, value: level.ProgressPercentage, "hide-percent": level.ProgressPercentage === 0 || level.ProgressPercentage === 100, disabled: this.isExpiredChallenge || isChallengePaused }, h("span", { slot: "Title", class: "ChallengeLevelTitle" }, h("span", null, "Level ", index + 1, ": "), this.getLevelTarget(level))), h("div", { class: "ChallengeRewardMessage" }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/reward.svg", alt: "win" }), h("span", null, translate('win', this.language), ": "), h("span", { class: "CustomRewardMessage" }, level.CustomRewardMessage)))))));
   }
   getToggleButton() {
     return (h("div", { class: "ChallengeCollapseButton", onClick: () => this.showDetails = !this.showDetails }, h("span", { class: `Toggle ${this.showDetails ? 'Closed' : 'Open'}` }), h("span", null, translate('details', this.language))));
@@ -183,4 +197,68 @@ const CasinoEngagementSuiteChallengesDetails = class {
 };
 CasinoEngagementSuiteChallengesDetails.style = casinoEngagementSuiteChallengesDetailsCss;
 
-export { CasinoEngagementSuiteChallengesDetails as casino_engagement_suite_challenges_details };
+const casinoEngagementSuiteProgressBarCss = ":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:14px;line-height:14px}.ProgressBarBackground{height:8px;background-color:var(--emw--color-background, #666178);border-radius:4px;position:relative}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);transition:width ease-out 0.3s}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:700;font-size:12px;line-height:12px}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ProgressBar.Disabled .ProgressBarPercent{color:var(--emw--color-background, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";
+
+const CasinoEngagementSuiteProgressBar = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * Value for the widget
+     */
+    this.value = 0;
+    /**
+     * Shows disabled styles
+     */
+    this.disabled = false;
+    /**
+     * Client custom styling via string
+     */
+    this.clientStyling = '';
+    /**
+     * Client custom styling via url
+     */
+    this.clientStylingUrl = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.host.prepend(sheet);
+    };
+    this.setClientStylingURL = () => {
+      let url = new URL(this.clientStylingUrl);
+      let cssFile = document.createElement('style');
+      fetch(url.href)
+        .then((res) => res.text())
+        .then((data) => {
+        cssFile.innerHTML = data;
+        setTimeout(() => { this.host.prepend(cssFile); }, 1);
+      })
+        .catch((err) => {
+        console.log('Error ', err);
+      });
+    };
+  }
+  componentDidRender() {
+    if (!this.limitStylingAppends && this.host) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      if (this.clientStylingUrl)
+        this.setClientStylingURL();
+      this.limitStylingAppends = true;
+    }
+  }
+  getProgressBarClasses() {
+    return {
+      ProgressBar: true,
+      Completed: this.value === 100,
+      Disabled: this.disabled
+    };
+  }
+  render() {
+    return h("div", { class: this.getProgressBarClasses(), part: "ProgressBar" }, h("div", { class: "ProgressBarInfo", part: "ProgressBarInfo" }, h("slot", { name: "Title" }, h("div", null)), h("slot", { name: "Percent" }, h("div", { class: "ProgressBarPercent", part: "ProgressBarPercent" }, this.value, "%"))), h("div", { class: "ProgressBarBackground", part: "ProgressBarBackground" }, h("div", { class: "ProgressBarLine", part: "ProgressBarLine", style: { width: this.value + '%' } })));
+  }
+  get host() { return getElement(this); }
+};
+CasinoEngagementSuiteProgressBar.style = casinoEngagementSuiteProgressBarCss;
+
+export { CasinoEngagementSuiteChallengesDetails as casino_engagement_suite_challenges_details, CasinoEngagementSuiteProgressBar as casino_engagement_suite_progress_bar };

package/dist/esm/{index-13f457d0.js → index-5178deb5.js}

@@ -212,6 +212,31 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
             classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
             classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
         }
+        else if (memberName === 'style') {
+            // update style attribute, css properties and values
+            {
+                for (const prop in oldValue) {
+                    if (!newValue || newValue[prop] == null) {
+                        if (prop.includes('-')) {
+                            elm.style.removeProperty(prop);
+                        }
+                        else {
+                            elm.style[prop] = '';
+                        }
+                    }
+                }
+            }
+            for (const prop in newValue) {
+                if (!oldValue || newValue[prop] !== oldValue[prop]) {
+                    if (prop.includes('-')) {
+                        elm.style.setProperty(prop, newValue[prop]);
+                    }
+                    else {
+                        elm.style[prop] = newValue[prop];
+                    }
+                }
+            }
+        }
         else if ((!isProp ) &&
             memberName[0] === 'o' &&
             memberName[1] === 'n') {
@@ -451,11 +476,14 @@ const patch = (oldVNode, newVNode) => {
     const elm = (newVNode.$elm$ = oldVNode.$elm$);
     const oldChildren = oldVNode.$children$;
     const newChildren = newVNode.$children$;
+    const tag = newVNode.$tag$;
     const text = newVNode.$text$;
     if (text === null) {
         // element node
         {
-            {
+            if (tag === 'slot')
+                ;
+            else {
                 // either this is the first render of an element OR it's an update
                 // AND we already know it's possible it could have changed
                 // this updates the element's css classes, attrs, props, listeners, etc.
@@ -716,6 +744,15 @@ const addHydratedFlag = (elm) => elm.classList.add('hydrated')
 const parsePropertyValue = (propValue, propType) => {
     // ensure this value is of the correct prop type
     if (propValue != null && !isComplexType(propValue)) {
+        if (propType & 4 /* Boolean */) {
+            // per the HTML spec, any string value means it is a boolean true value
+            // but we'll cheat here and say that the string "false" is the boolean false
+            return propValue === 'false' ? false : propValue === '' || !!propValue;
+        }
+        if (propType & 2 /* Number */) {
+            // force it to be a number
+            return parseFloat(propValue);
+        }
         if (propType & 1 /* String */) {
             // could have been passed as a number or boolean
             // but we still want it as a string
@@ -987,7 +1024,11 @@ const connectedCallback = (elm) => {
 };
 const disconnectedCallback = (elm) => {
     if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
-        getHostRef(elm);
+        const hostRef = getHostRef(elm);
+        const instance = hostRef.$lazyInstance$ ;
+        {
+            safeCall(instance, 'disconnectedCallback');
+        }
     }
 };
 const bootstrapLazy = (lazyBundles, options = {}) => {

package/dist/esm/loader.js

@@ -1,4 +1,4 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-13f457d0.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-5178deb5.js';
 
 /*
  Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
@@ -10,7 +10,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["casino-engagement-suite-challenges-details",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}]]]], options);
+  return bootstrapLazy([["casino-engagement-suite-challenges-details_2",[[1,"casino-engagement-suite-challenges-details",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"challenge":[16],"language":[1],"gameSlug":[1,"game-slug"],"device":[1],"limitStylingAppends":[32],"timer":[32],"showDetails":[32],"isExpiredChallenge":[32]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
   });
 };
 

package/dist/types/components/casino-engagement-suite-challenges-details/casino-engagement-suite-challenges-details.d.ts

@@ -1,5 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { Challenge, LevelProgress } from '../../models/casino-challenges-details';
+import '@everymatrix/casino-engagement-suite-progress-bar';
 export declare class CasinoEngagementSuiteChallengesDetails {
   /**
    * Client custom styling via string
@@ -26,16 +27,18 @@ export declare class CasinoEngagementSuiteChallengesDetails {
    */
   device: "Mobile" | "Tablet" | "Desktop";
   close: EventEmitter<void>;
+  back: EventEmitter<void>;
   private limitStylingAppends;
   timer: string;
   showDetails: boolean;
   isExpiredChallenge: boolean;
   host: HTMLElement;
   challengeDetails: HTMLElement;
+  challengePropHandler(value: Challenge): void;
   interval: any;
-  challengePropHandler(): void;
   componentWillLoad(): void;
   componentDidRender(): void;
+  disconnectedCallback(): void;
   setClientStyling: () => void;
   setClientStylingURL: () => void;
   getActionsTemplate(): any;
@@ -43,6 +46,7 @@ export declare class CasinoEngagementSuiteChallengesDetails {
   getChallengeCountdown(): any;
   getChallengeDetails(): any;
   handleCloseClick: () => void;
+  handleBackClick: () => void;
   onGameClick(gameSlug: string): void;
   startCountdown(): void;
   updateTimer(): void;

package/dist/types/components.d.ts

@@ -71,6 +71,7 @@ declare namespace LocalJSX {
           * Language of the widget
          */
         "language"?: string;
+        "onBack"?: (event: CustomEvent<void>) => void;
         "onClose"?: (event: CustomEvent<void>) => void;
     }
     interface IntrinsicElements {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/casino-engagement-suite-challenges-details",
-  "version": "1.35.0",
+  "version": "1.36.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/casino-engagement-suite-challenges-details/p-27926b27.entry.js

@@ -1 +0,0 @@
-import{r as e,c as l,h as t,g as a}from"./p-764c820d.js";const n=["en"],s={en:{challenges:"Challenges",join:"Join",unjoin:"Unjoin",details:"Challenge Details",tc:"Terms & Conditions",level:"Level",place:"Place",bet:"bet",bets:"bets",win:"Win"}},i=(e,l)=>{const t=l;return s[void 0!==t&&n.includes(t)?t:"en"][e]};var o,r;!function(e){e[e.Closed=0]="Closed",e[e.InProgress=1]="InProgress",e[e.Fillup=2]="Fillup",e[e.Completed=3]="Completed"}(o||(o={})),function(e){e[e.Started=0]="Started",e[e.InProgress=1]="InProgress",e[e.PendingLevelReward=2]="PendingLevelReward",e[e.Completed=3]="Completed",e[e.Expired=4]="Expired"}(r||(r={}));const h=class{constructor(t){e(this,t),this.close=l(this,"close",7),this.clientStyling="",this.clientStylingUrl="",this.language="en",this.gameSlug="",this.device="Mobile",this.limitStylingAppends=!1,this.timer="",this.showDetails=!1,this.isExpiredChallenge=!1,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.host.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),l=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{l.innerHTML=e,setTimeout((()=>{this.host.prepend(l)}),1)})).catch((e=>{console.log("Error ",e)}))},this.handleCloseClick=()=>{this.close.emit(),clearInterval(this.interval),this.isExpiredChallenge=!1,this.showDetails=!1}}challengePropHandler(){this.updateTimer(),this.startCountdown()}componentWillLoad(){this.challengePropHandler()}componentDidRender(){!this.limitStylingAppends&&this.host&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}getActionsTemplate(){return t("header",{class:"ChallengeActions"},t("button",{class:"ChallengeIconButton"},t("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/back.svg",alt:"back"})),"Mobile"!==this.device&&t("div",{class:"ChallengePopupName"},i("challenges",this.language)),t("button",{class:"ChallengeIconButton",onClick:this.handleCloseClick},t("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/close.svg",alt:"close"})))}getChallengeHeader(){const e=this.challenge.Status===r.InProgress;return t("div",{class:"ChallengeDetailsHeader"},t("span",{class:"ChallengeName"},this.challenge.ChallengePresentation.PresentationName),t("button",{class:`ChallengeJoinButton ${e?"Joined":""}\n          ${this.isExpiredChallenge?"Disabled":""}`},i(e?"unjoin":"join",this.language)))}getChallengeCountdown(){return t("div",{class:"ChallengeCountdown "+(this.isExpiredChallenge?"Expired":"")},this.isExpiredChallenge?"Expired":this.timer)}getChallengeDetails(){const e=this.challenge.ChallengePresentation.Description,l=this.challenge.ChallengePresentation.Url,a=this.challenge.Games;return t("div",{class:"CollapseDetails "+(this.showDetails?"ShowDetails":"")},e&&t("span",{class:"ChallengeDescription"},e),l&&t("div",{class:"TC"},t("a",{href:l,target:"_blank"},i("tc",this.language))),(null==a?void 0:a.length)&&t("div",{class:"ChallengeGames"},a.map((e=>t("div",{class:"Game"},t("img",{src:e.GameIcon,alt:e.GameName,onClick:()=>this.onGameClick(e.GameSlug),class:e.GameSlug===this.gameSlug?"Disabled":""}))))))}onGameClick(e){window.postMessage({type:"GameClick",slug:e})}startCountdown(){this.interval=setInterval((()=>{this.updateTimer()}),1e3)}updateTimer(){const e=new Date(this.challenge.ExpirationTime).getTime()-(new Date).getTime();if(e<1)return clearInterval(this.interval),this.timer="",void(this.isExpiredChallenge=!0);const{days:l,hours:t,minutes:a,seconds:n}={days:String(Math.floor(e/864e5)).padStart(2,"0"),hours:String(Math.floor(e%864e5/36e5)).padStart(2,"0"),minutes:String(Math.floor(e%36e5/6e4)).padStart(2,"0"),seconds:String(Math.floor(e%6e4/1e3)).padStart(2,"0")};this.timer="00"===l?`${t}h:${a}m:${n}s`:`${l}d:${t}h:${a}m`}getLevelTarget(e){let l=`${i("place",this.language)} ${e.TargetTurnover}`;return 1===e.LevelTargetType?l+=` ${i("bet",this.language)}`:2===e.LevelTargetType&&(l+=` ${i("bets",this.language)} X ${e.TargetBetCount}`),t("span",{class:"ChallengeLevelTarget"},l)}getChallengeLevels(){return t("div",{class:"ChallengeLevels"},this.challenge.LevelProgresses.map(((e,l)=>t("div",{class:"ChallengeLevelCard "+(1===e.ProgressStatus?"InProgress":"")},t("div",{class:"ChallengeLevelHeader"},t("span",null,"Level ",l+1,": "),this.getLevelTarget(e)),t("div",{class:"ChallengeRewardMessage"},t("img",{src:"https://static.everymatrix.com/gic/img/engagement-suite/reward.svg",alt:"win"}),t("span",null,i("win",this.language),": "),t("span",{class:"CustomRewardMessage"},e.CustomRewardMessage))))))}getToggleButton(){return t("div",{class:"ChallengeCollapseButton",onClick:()=>this.showDetails=!this.showDetails},t("span",{class:"Toggle "+(this.showDetails?"Closed":"Open")}),t("span",null,i("details",this.language)))}render(){return t("div",{class:`ChallengeDetailsPopup ${this.device}`},this.getActionsTemplate(),t("div",{class:"ChallengeDetails"},this.getChallengeHeader(),this.getChallengeCountdown(),this.getToggleButton(),this.getChallengeDetails(),this.getChallengeLevels()))}get host(){return a(this)}static get watchers(){return{challenge:["challengePropHandler"]}}};h.style='@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;900&display=swap"); :host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer}button:focus{outline:none}.ChallengeDetailsPopup{display:flex;height:100%;background-color:var(--emw--color-background, #1E1638);border-radius:8px;overflow:hidden;flex-direction:column;position:relative}.ChallengeActions{display:flex;justify-content:space-between;align-items:center;padding:12px 8px 8px}.ChallengeActions .ChallengeIconButton{width:16px;height:16px;cursor:pointer}.ChallengeActions .ChallengePopupName{color:var(--emw--color-gray-100, #BBB9C3);font-size:16px;font-weight:500;line-height:16px}.ChallengeDetails{padding:0px 19px 10px;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.ChallengeDetails::-webkit-scrollbar{display:none}.ChallengeDetailsHeader{display:flex;justify-content:space-between;gap:12px}.ChallengeDetailsHeader .ChallengeName{font-family:"Montserrat", sans-serif;font-size:var(--emw--font-size-medium, 18px);font-weight:var(--emw--font-weight-bold, 700);line-height:22px;color:var(--emfe-w-color-white, #FFF);word-break:break-all}.ChallengeJoinButton.Joined::before{content:"";position:absolute;inset:0;border-radius:var(--emw--button-border-radius, 4px);padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeJoinButton{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:88px;height:32px;font-size:14px;font-weight:700;position:relative;font-family:"Montserrat", sans-serif}.ChallengeJoinButton.Joined{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ChallengeJoinButton.Joined::before{border-radius:99px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ChallengeCountdown{font-weight:var(--emw--font-weight-normal, 400);font-size:var(--emw--font-size-x-small, 12px);line-height:12px;margin:12px 0 24px;color:var(--emw--color-gray-150, #BBB9C3)}.ChallengeCountdown.Expired{font-weight:var(--emw--font-weight-normal, 700);color:var(--emfe-w-color-white, #FFF)}.ChallengeCollapseButton{margin-bottom:14px;display:flex;flex-direction:row;align-items:center;color:var(--emw--color-primary-variant, #666178);cursor:pointer}.ChallengeCollapseButton .Toggle{width:16px;height:16px;display:block;margin-right:4px}.ChallengeCollapseButton .Closed{background:url("https://static.everymatrix.com/gic/img/engagement-suite/eye-closed.svg") no-repeat center/contain}.ChallengeCollapseButton .Open{background:url("https://static.everymatrix.com/gic/img/engagement-suite/eye-open.svg") no-repeat center/contain}.CollapseDetails{display:none;font-size:var(--emw--font-size-small, 14px);line-height:17px;font-weight:var(--emw--font-weight-normal, 400)}.CollapseDetails .ChallengeDescription{color:var(--emfe-w-color-white, #FFF);margin-bottom:12px}.CollapseDetails .TC{margin:12px 0 16px}.CollapseDetails .TC a{color:var(--emw--color-secondary, #59D1FF)}.CollapseDetails .ChallengeGames{width:100%;overflow-y:auto;display:flex;gap:4px}.CollapseDetails .ChallengeGames::-webkit-scrollbar{height:2px;background:none}.CollapseDetails .ChallengeGames::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.CollapseDetails .ChallengeGames .Game img{width:96px;height:50px;border-radius:2px;cursor:pointer}.ShowDetails{display:block}.ChallengeLevels{display:flex;flex-direction:column;gap:16px;margin-top:24px;color:var(--emw--color-primary, #8F8B9C);font-size:var(--emw--font-size-small, 12px);font-weight:var(--emw--font-weight-normal, 400);line-height:12px}.ChallengeLevels .ChallengeLevelCard{border:1px solid var(--emw--button-border-color, #403956);padding:16px;border-radius:8px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage{margin-top:10px;display:flex;flex-direction:row;align-items:center;gap:4px}.ChallengeLevels .ChallengeLevelCard .ChallengeRewardMessage .CustomRewardMessage{font-weight:var(--emw--font-weight-semibold, 600);line-height:15px;word-break:break-all}.ChallengeLevels .InProgress{position:relative;border:none}.ChallengeLevels .InProgress .ChallengeLevelTarget,.ChallengeLevels .InProgress .CustomRewardMessage{color:var(--emfe-w-color-white, #FFF)}.ChallengeLevels .InProgress::before{content:"";position:absolute;inset:0;border-radius:8px;padding:1px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.ChallengeDetailsPopup.Tablet .ChallengeIconButton,.ChallengeDetailsPopup.Desktop .ChallengeIconButton{width:24px;height:24px}.ChallengeDetailsPopup.Tablet .ChallengeDetails,.ChallengeDetailsPopup.Desktop .ChallengeDetails{padding:20px 24px}.ChallengeDetailsPopup.Tablet .ChallengeName,.ChallengeDetailsPopup.Desktop .ChallengeName{line-height:27px;font-size:22px}.ChallengeDetailsPopup.Tablet .ChallengeJoinButton,.ChallengeDetailsPopup.Desktop .ChallengeJoinButton{min-width:100px;height:36px;font-size:16px}.ChallengeDetailsPopup.Tablet .ChallengeCountdown,.ChallengeDetailsPopup.Tablet .ChallengeLevels,.ChallengeDetailsPopup.Desktop .ChallengeCountdown,.ChallengeDetailsPopup.Desktop .ChallengeLevels{font-size:var(--emw--font-size-small, 14px);line-height:14px}.ChallengeDetailsPopup.Tablet .ChallengeCollapseButton,.ChallengeDetailsPopup.Desktop .ChallengeCollapseButton{margin-bottom:12px}.ChallengeDetailsPopup.Tablet .ChallengeLevels .CustomRewardMessage,.ChallengeDetailsPopup.Desktop .ChallengeLevels .CustomRewardMessage{line-height:17px}';export{h as casino_engagement_suite_challenges_details}

package/dist/casino-engagement-suite-challenges-details/p-764c820d.js

@@ -1 +0,0 @@
-let e,t,n=!1;const l="undefined"!=typeof window?window:{},s=l.document||{head:{}},o={t:0,l:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},c=e=>Promise.resolve(e),i=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replace}catch(e){}return!1})(),r=new WeakMap,u=e=>"sc-"+e.o,a={},f=e=>"object"==(e=typeof e)||"function"===e,d=(e,t,...n)=>{let l=null,s=!1,o=!1,c=[];const i=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?i(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!f(l))&&(l+=""),s&&o?c[c.length-1].i+=l:c.push(s?h(null,l):l),o=s)};if(i(n),t){const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}const r=h(e,null);return r.u=t,c.length>0&&(r.h=c),r},h=(e,t)=>({t:0,$:e,i:t,m:null,h:null,u:null}),$={},m=(e,t,n,s,c,i)=>{if(n!==s){let r=_(e,t),u=t.toLowerCase();if("class"===t){const t=e.classList,l=p(n),o=p(s);t.remove(...l.filter((e=>e&&!o.includes(e)))),t.add(...o.filter((e=>e&&!l.includes(e))))}else if(r||"o"!==t[0]||"n"!==t[1]){const l=f(s);if((r||l&&null!==s)&&!c)try{if(e.tagName.includes("-"))e[t]=s;else{let l=null==s?"":s;"list"===t?r=!1:null!=n&&e[t]==l||(e[t]=l)}}catch(e){}null==s||!1===s?!1===s&&""!==e.getAttribute(t)||e.removeAttribute(t):(!r||4&i||c)&&!l&&e.setAttribute(t,s=!0===s?"":s)}else t="-"===t[2]?t.slice(3):_(l,u)?u.slice(2):u[2]+t.slice(3),n&&o.rel(e,t,n,!1),s&&o.ael(e,t,s,!1)}},y=/\s/,p=e=>e?e.split(y):[],b=(e,t,n,l)=>{const s=11===t.m.nodeType&&t.m.host?t.m.host:t.m,o=e&&e.u||a,c=t.u||a;for(l in o)l in c||m(s,l,o[l],void 0,n,t.t);for(l in c)m(s,l,o[l],c[l],n,t.t)},w=(t,n,l)=>{let o,c,i=n.h[l],r=0;if(null!==i.i)o=i.m=s.createTextNode(i.i);else if(o=i.m=s.createElement(i.$),b(null,i,!1),null!=e&&o["s-si"]!==e&&o.classList.add(o["s-si"]=e),i.h)for(r=0;r<i.h.length;++r)c=w(t,i,r),c&&o.appendChild(c);return o},g=(e,n,l,s,o,c)=>{let i,r=e;for(r.shadowRoot&&r.tagName===t&&(r=r.shadowRoot);o<=c;++o)s[o]&&(i=w(null,l,o),i&&(s[o].m=i,r.insertBefore(i,n)))},S=(e,t,n,l)=>{for(;t<=n;++t)(l=e[t])&&l.m.remove()},j=(e,t)=>e.$===t.$,M=(e,t)=>{const n=t.m=e.m,l=e.h,s=t.h,o=t.i;null===o?(b(e,t,!1),null!==l&&null!==s?((e,t,n,l)=>{let s,o=0,c=0,i=t.length-1,r=t[0],u=t[i],a=l.length-1,f=l[0],d=l[a];for(;o<=i&&c<=a;)null==r?r=t[++o]:null==u?u=t[--i]:null==f?f=l[++c]:null==d?d=l[--a]:j(r,f)?(M(r,f),r=t[++o],f=l[++c]):j(u,d)?(M(u,d),u=t[--i],d=l[--a]):j(r,d)?(M(r,d),e.insertBefore(r.m,u.m.nextSibling),r=t[++o],d=l[--a]):j(u,f)?(M(u,f),e.insertBefore(u.m,r.m),u=t[--i],f=l[++c]):(s=w(t&&t[c],n,c),f=l[++c],s&&r.m.parentNode.insertBefore(s,r.m));o>i?g(e,null==l[a+1]?null:l[a+1].m,n,l,c,a):c>a&&S(t,o,i)})(n,l,t,s):null!==s?(null!==e.i&&(n.textContent=""),g(n,null,t,s,0,s.length-1)):null!==l&&S(l,0,l.length-1)):e.i!==o&&(n.data=o)},v=e=>F(e).p,k=(e,t,n)=>{const l=v(e);return{emit:e=>C(l,t,{bubbles:!!(4&n),composed:!!(2&n),cancelable:!!(1&n),detail:e})}},C=(e,t,n)=>{const l=o.ce(t,n);return e.dispatchEvent(l),l},O=(e,t)=>{t&&!e.g&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.g=t)))},P=(e,t)=>{if(e.t|=16,!(4&e.t))return O(e,e.S),ee((()=>x(e,t)));e.t|=512},x=(e,t)=>{const n=e.j;let l;return t&&(l=T(n,"componentWillLoad")),W(l,(()=>E(e,n,t)))},E=async(e,t,n)=>{const l=e.p,o=l["s-rc"];n&&(e=>{const t=e.M,n=e.p,l=t.t,o=((e,t)=>{let n=u(t),l=I.get(n);if(e=11===e.nodeType?e:s,l)if("string"==typeof l){let t,o=r.get(e=e.head||e);o||r.set(e,o=new Set),o.has(n)||(t=s.createElement("style"),t.innerHTML=l,e.insertBefore(t,e.querySelector("link")),o&&o.add(n))}else e.adoptedStyleSheets.includes(l)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);L(e,t),o&&(o.map((e=>e())),l["s-rc"]=void 0);{const t=l["s-p"],n=()=>N(e);0===t.length?n():(Promise.all(t).then(n),e.t|=4,t.length=0)}},L=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.p,o=n.M,c=n.v||h(null,null),i=(e=>e&&e.$===$)(l)?l:d(null,null,l);t=s.tagName,o.k&&(i.u=i.u||{},o.k.map((([e,t])=>i.u[t]=s[e]))),i.$=null,i.t|=4,n.v=i,i.m=c.m=s.shadowRoot||s,e=s["s-sc"],M(c,i)})(n,l)}catch(e){z(e,n.p)}return null},N=e=>{const t=e.p,n=e.S;T(e.j,"componentDidRender"),64&e.t||(e.t|=64,A(t),e.C(t),n||R()),e.g&&(e.g(),e.g=void 0),512&e.t&&Z((()=>P(e,!1))),e.t&=-517},R=()=>{A(s.documentElement),Z((()=>C(l,"appload",{detail:{namespace:"casino-engagement-suite-challenges-details"}})))},T=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){z(e)}},W=(e,t)=>e&&e.then?e.then(t):t(),A=e=>e.classList.add("hydrated"),U=(e,t,n)=>{if(t.O){e.watchers&&(t.P=e.watchers);const l=Object.entries(t.O),s=e.prototype;if(l.map((([e,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(s,e,{get(){return((e,t)=>F(this).L.get(t))(0,e)},set(n){((e,t,n,l)=>{const s=F(e),o=s.p,c=s.L.get(t),i=s.t,r=s.j;if(n=((e,t)=>null==e||f(e)?e:1&t?e+"":e)(n,l.O[t][0]),(!(8&i)||void 0===c)&&n!==c&&(!Number.isNaN(c)||!Number.isNaN(n))&&(s.L.set(t,n),r)){if(l.P&&128&i){const e=l.P[t];e&&e.map((e=>{try{r[e](n,c,t)}catch(e){z(e,o)}}))}2==(18&i)&&P(s,!1)}})(this,e,n,t)},configurable:!0,enumerable:!0})})),1&n){const n=new Map;s.attributeChangedCallback=function(e,t,l){o.jmp((()=>{const t=n.get(e);if(this.hasOwnProperty(t))l=this[t],delete this[t];else if(s.hasOwnProperty(t)&&"number"==typeof this[t]&&this[t]==l)return;this[t]=(null!==l||"boolean"!=typeof this[t])&&l}))},e.observedAttributes=l.filter((([e,t])=>15&t[0])).map((([e,l])=>{const s=l[1]||e;return n.set(s,e),512&l[0]&&t.k.push([e,s]),s}))}}return e},q=(e,t={})=>{const n=[],c=t.exclude||[],r=l.customElements,a=s.head,f=a.querySelector("meta[charset]"),d=s.createElement("style"),h=[];let $,m=!0;Object.assign(o,t),o.l=new URL(t.resourcesUrl||"./",s.baseURI).href,e.map((e=>{e[1].map((t=>{const l={t:t[0],o:t[1],O:t[2],N:t[3]};l.O=t[2],l.k=[],l.P={};const s=l.o,a=class extends HTMLElement{constructor(e){super(e),V(e=this,l),1&l.t&&e.attachShadow({mode:"open"})}connectedCallback(){$&&(clearTimeout($),$=null),m?h.push(this):o.jmp((()=>(e=>{if(0==(1&o.t)){const t=F(e),n=t.M,l=()=>{};if(!(1&t.t)){t.t|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){O(t,t.S=n);break}}n.O&&Object.entries(n.O).map((([t,[n]])=>{if(31&n&&e.hasOwnProperty(t)){const n=e[t];delete e[t],e[t]=n}})),(async(e,t,n,l,s)=>{if(0==(32&t.t)){{if(t.t|=32,(s=G(n)).then){const e=()=>{};s=await s,e()}s.isProxied||(n.P=s.watchers,U(s,n,2),s.isProxied=!0);const e=()=>{};t.t|=8;try{new s(t)}catch(e){z(e)}t.t&=-9,t.t|=128,e()}if(s.style){let e=s.style;const t=u(n);if(!I.has(t)){const l=()=>{};((e,t,n)=>{let l=I.get(e);i&&n?(l=l||new CSSStyleSheet,l.replace(t)):l=t,I.set(e,l)})(t,e,!!(1&n.t)),l()}}}const o=t.S,c=()=>P(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,t,n)}l()}})(this)))}disconnectedCallback(){o.jmp((()=>{}))}componentOnReady(){return F(this).R}};l.T=e[0],c.includes(s)||r.get(s)||(n.push(s),r.define(s,U(a,l,1)))}))})),d.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",d.setAttribute("data-styles",""),a.insertBefore(d,f?f.nextSibling:a.firstChild),m=!1,h.length?h.map((e=>e.connectedCallback())):o.jmp((()=>$=setTimeout(R,30)))},D=new WeakMap,F=e=>D.get(e),H=(e,t)=>D.set(t.j=e,t),V=(e,t)=>{const n={t:0,p:e,M:t,L:new Map};return n.R=new Promise((e=>n.C=e)),e["s-p"]=[],e["s-rc"]=[],D.set(e,n)},_=(e,t)=>t in e,z=(e,t)=>(0,console.error)(e,t),B=new Map,G=e=>{const t=e.o.replace(/-/g,"_"),n=e.T,l=B.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(B.set(n,e),e[t])),z)},I=new Map,J=[],K=[],Q=(e,t)=>l=>{e.push(l),n||(n=!0,t&&4&o.t?Z(Y):o.raf(Y))},X=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){z(e)}e.length=0},Y=()=>{X(J),X(K),(n=J.length>0)&&o.raf(Y)},Z=e=>c().then(e),ee=Q(K,!0);export{q as b,k as c,v as g,d as h,c as p,H as r}