@everymatrix/casino-engagement-suite-tournament 1.69.0 → 1.69.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- import{r as e,h as t,g as s,c as i,H as n}from"./index-8b5c4b95.js";import{T as r,c as o,D as a,i as c,r as l,L as h,g as d,a as m,f as g}from"./casino-engagement-suite-tournament-ce10f79a.js";export{C as casino_engagement_suite_tournament}from"./casino-engagement-suite-tournament-ce10f79a.js";import"@everymatrix/ui-image";const k=class{constructor(t){e(this,t),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.value=0,this.disabled=!1,this.hidePercent=!1,this.indeterminate=!1,this.clientStyling="",this.clientStylingUrl="",this.limitStylingAppends=!1}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,HidePercent:this.hidePercent||this.indeterminate}}getProgressBarLineTemplate(){return t("div",this.indeterminate?{class:"ProgressBarLine Indeterminate",part:"ProgressBarLine Indeterminate"}:{class:"ProgressBarLine",part:"ProgressBarLine",style:{width:this.value+"%"}})}render(){return t("div",{key:"ecce3a26a92d2e090c1db84bdc1bdbeb505080ed",class:this.getProgressBarClasses(),part:"ProgressBar"},t("div",{key:"649fe1103d222200f2a1ad3b5967e37da1f1ab3d",class:"ProgressBarInfo",part:"ProgressBarInfo"},t("slot",{key:"49dc180eedd823f0027f75099813fb9d91bcd938",name:"Title"},t("div",{key:"e6e59da3fe7bbcb37e118e7fd23a8ff35587aca5"})),t("slot",{key:"3dc8e5fd1dbc8c268b9c76e393b751cb53605e7e",name:"Percent"},t("div",{key:"6a9e880f3ee3c4f26e8577c69be5db5f8e2d10ad",class:"ProgressBarPercent",part:"ProgressBarPercent"},this.value,"%"))),t("div",{key:"141106e77caad7b04bb199f911e87c0c6f0adc2d",class:"ProgressBarBackground",part:"ProgressBarBackground"},this.getProgressBarLineTemplate()))}get host(){return s(this)}};k.style=":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:var(--emw--font-size-small, 14px);line-height:14px}@keyframes indeterminate{0%{left:-200%;right:100%}60%{left:110%;right:-10%}to{left:110%;right:-10%}}.ProgressBarBackground{height:8px;background-color:var(--emw--color-gray-300, #666178);border-radius:var(--emw--border-radius-small, 4px);position:relative;overflow:hidden}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:var(--emw--border-radius-small, 4px);background:var(--emw--engagement-suite-gradient-button, linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%));transition:width ease-out 0.3s}.ProgressBarLine.Indeterminate{animation:indeterminate 1s linear infinite}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:var(--emw--font-weight-bold, 700);font-size:var(--emw--font-size-x-small, 12px);line-height:12px}.HidePercent .ProgressBarPercent{display:none}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:var(--emw--engagement-suite-gradient-button, 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-gray-300, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";const b=class{constructor(t){e(this,t),this.stylingAppends=!1,this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.el.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.el.prepend(t)}),1)})).catch((e=>{console.log("error ",e)}))},this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.targetTranslations=void 0}componentDidRender(){this.stylingAppends||(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.stylingAppends=!0)}async componentWillLoad(){const e=[];if(this.translationUrl){const i=(t=this.translationUrl,s=this.targetTranslations,new Promise((e=>{fetch(t).then((e=>e.json())).then((t=>{Object.keys(t).forEach((e=>{s[e]=s[e]||s.en,Object.keys(t[e]).forEach((i=>{s.en[i]&&(s[e][i]=s[e][i]||s.en[i],"object"==typeof t[e][i]?Object.keys(t[e][i]).forEach((n=>{s[e][i][n]=t[e][i][n]})):s[e][i]=t[e][i])}))})),e(!0)}))})));e.push(i)}var t,s;return await Promise.all(e)}render(){return t("div",{key:"4d3414408c7662f88331dbe655966237f74d6958",class:"StyleShell"},t("slot",{key:"1d004644d84602c4314bdf5dfc26b55b160f57df",name:"mainContent"}))}get el(){return s(this)}};b.style=":host{display:block}";const u=class{constructor(t){e(this,t),this.clickToTournamentDetail=i(this,"clickToTournamentDetail",7),this.tournament=void 0,this.isNew=void 0,this.tid=void 0,this.locale=r}goToDetail(){this.clickToTournamentDetail.emit(this.tournament)}onTournamentUpdateEvent(e){const{detail:t}=e;t.id===this.tournament.id&&(this.tournament=Object.assign({},t))}render(){const e=this.tournament;return t("div",{key:"e4c39f94b5574dc67c1f76d16f21b680db8dbf6c",class:o("LeaderboardsItem",e.isPlayerAcknowledged?" GradientRounded Hollow":"",e.isUnjoined?"Unjoined":""),onClick:this.goToDetail.bind(this)},t("div",{key:"ed40bbbadbe4a216981f0cc0891476c3788c456f",class:"LeaderboardsItemContainer"},t("tournament-item-title",{key:"655d965507d60b5a90a66b5cf1b20ff744ab7115",tournament:e}),t("tournament-timer",{key:"b6b597921994640725dd57e7991b38604702ba0d",tournament:e})),t("div",{key:"1cc278a8ab8faa750427f4dce15140117732d5a1",class:"LeaderboardLabels"},this.isNew&&t("div",{key:"b14172c01cc9b930a439113357e630edd0713eae",class:"LeaderboardLabel"},t("span",{key:"ab763183adf551c34a749ae39c1719160387a816"},"new"))))}},w=class{constructor(t){e(this,t),this.unjoinTournamentConfirmEvent=i(this,"unjoinTournamentConfirmEvent",7),this.joinTournamentEvent=i(this,"joinTournamentEvent",7),this.tournament=void 0,this.locale=r,this.isButtonDisabed=!1}onTournamentChanged(e){this.isButtonDisabed=!0===e.isActionJoinPending}onClickItemJoin(){this.isButtonDisabed||(this.isButtonDisabed=!this.tournament.isPlayerAcknowledged,this.tournament.isPlayerAcknowledged?this.unjoinTournamentConfirmEvent.emit({type:a.unjoin,tournament:this.tournament}):this.joinTournamentEvent.emit(this.tournament))}componentDidLoad(){this.isButtonDisabed=!0===this.tournament.isActionJoinPending}render(){return t("div",{key:"cf8c4dc0cba0ebd8e1da43a32af618d79972f669",class:"TitleContainer"},t("div",{key:"1707346e5ef14b1379d8a0691f11a425a16f1c13",class:"Title"},this.tournament.nameOrTitle),!c(this.tournament)&&t("div",{key:"78a0c86a56fa2b145bb5e7106df441fe6deb116e"},l({statedClasses:{isHollow:this.tournament.isPlayerAcknowledged,isPending:this.isButtonDisabed},onClick:e=>{e.stopPropagation(),this.onClickItemJoin()},innerHTML:this.tournament.isPlayerAcknowledged?this.locale.Unjoin:this.locale.Join})))}static get watchers(){return{tournament:["onTournamentChanged"]}}},f=class{constructor(t){e(this,t),this.tournament=void 0,this.isDetail=!1,this.timeHolder=void 0,this.timeClock=!0,this.lastTimeDiff=void 0,this.lastProgress=void 0}containerPageChangeHandler(e){this.timeClock=e.detail.page===h.list&&!this.isDetail||e.detail.page===h.item&&this.isDetail}componentWillLoad(){this.lastProgress=d(this.tournament.startTime,this.tournament.endTime),this.lastTimeDiff=m(new Date,this.tournament.endTime,this.lastProgress)}setTimeInterval(){this.timeHolder=setInterval((()=>{const e=d(this.tournament.startTime,this.tournament.endTime),t=m(new Date,this.tournament.endTime,e);!this.timeClock||c(this.tournament)||t==this.lastTimeDiff&&e==this.lastProgress||(this.lastProgress=e,this.lastTimeDiff=t)}),2e3)}connectedCallback(){this.setTimeInterval()}disconnectedCallback(){clearInterval(this.timeHolder)}render(){return t("section",{key:"11426165a8f384d97f2b0158f7435f80ac0965a2",class:"TimeContainer"},t("div",{key:"b86c8a42a73b358fcc855a853cb322d1d314471a",class:"Time"},"Running"===this.tournament.state?t("div",{class:"Running"},t("div",null,this.lastTimeDiff),t("div",null,l({statedClasses:{isHollow:!0,isPending:!!this.tournament.isActionJoinPending},innerHTML:`${this.lastProgress}%`}))):[t("div",{class:"NotRunning"},g(this.tournament.startTime)),t("div",null,g(this.tournament.endTime))]),t("casino-engagement-suite-progress-bar",{key:"7f98e88679f30d0a0737d94ee806b1d92800b6a3",indeterminate:!1,value:Number(this.lastProgress>=100?100:this.lastProgress),"hide-percent":!0}))}},v=class{constructor(t){e(this,t),this.src=void 0,this.width=void 0,this.height=void 0,this.alt=void 0,this.styles=void 0,this.detectDistance="200px",this.imgLoaded=!1,this.shouldLoad=!1}handleSrc(){if(!this.shouldLoad)return;const e=new Image;e.onload=()=>{this.image&&(this.image.src=this.src,this.imgLoaded=!0,e.onload=null)},e.src=this.src}componentDidLoad(){"IntersectionObserver"in window?(this.el.__uxComponent=this,window.EMUxObserver||(window.EMUxObserver=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){const t=e.target.__uxComponent;t&&(t.shouldLoad=!0,t.handleSrc()),window.EMUxObserver.unobserve(e.target)}}))}),{rootMargin:this.detectDistance})),window.EMUxObserver.observe(this.el)):(this.shouldLoad=!0,this.handleSrc())}render(){return t(n,{key:"f506ba73852f257ad80bf59ca177d2065a5f365e",class:"HostContainer"},!this.imgLoaded&&t("ui-skeleton",{key:"564ebfab701f827ddc2debccb7615926dbc9e876",class:"UiContainer",structure:"image",width:"100%",height:"100%"}),t("img",{key:"2188ca4494c10587f064acc5459ffc468948f497",ref:e=>this.image=e,src:this.shouldLoad?this.src:void 0,onLoad:()=>this.imgLoaded=!0,style:this.styles,class:"UiContainer "+(this.imgLoaded?"Visible":"Hidden"),alt:this.alt,width:this.width,height:this.height,loading:"lazy"}))}get el(){return s(this)}static get watchers(){return{src:["handleSrc"]}}};v.style=".HostContainer{display:block}.UiContainer{height:100%;width:100%;border-radius:inherit;object-fit:inherit}.UiContainer .Image{border-radius:inherit}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;border-radius:var(--emw--border-radius-medium, 10px);transition:opacity 0.5s ease-in-out}";const p=class{constructor(t){e(this,t),this.structure=void 0,this.width=void 0,this.height=void 0,this.borderRadius=void 0,this.marginBottom=void 0,this.marginTop=void 0,this.marginLeft=void 0,this.marginRight=void 0,this.animation=!0,this.rows=void 0,this.size=void 0,this.color=void 0,this.primaryColor=void 0,this.secondaryColor=void 0}handleStructureChange(e,t){t!==e&&this.handleStructure(e)}handleStructure(e){switch(e){case"logo":return this.renderLogo();case"image":return this.renderImage();case"title":return this.renderTitle();case"text":return this.renderText();case"rectangle":return this.renderRectangle();case"circle":return this.renderCircle();default:return null}}renderLogo(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Logo "+(this.animation?"Skeleton":"")}))}renderImage(){return t("div",{class:"Image "+(this.animation?"Skeleton":"")})}renderTitle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Title "+(this.animation?"Skeleton":"")}))}renderText(){return t("div",{class:"SkeletonContainer"},Array.from({length:this.rows>0?this.rows:1}).map(((e,s)=>t("div",{key:s,class:"Text "+(this.animation?"Skeleton":"")}))))}renderRectangle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Rectangle "+(this.animation?"Skeleton":"")}))}renderCircle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Circle "+(this.animation?"Skeleton":"")}))}render(){let e="";switch(this.structure){case"logo":e=`\n :host {\n --emw-skeleton-logo-width: ${this.width};\n --emw-skeleton-logo-height: ${this.height};\n --emw-skeleton-logo-border-radius: ${this.borderRadius}px;\n --emw-skeleton-logo-margin-bottom: ${this.marginBottom}px;\n --emw-skeleton-logo-margin-top: ${this.marginTop}px;\n --emw-skeleton-logo-margin-left: ${this.marginLeft}px;\n --emw-skeleton-logo-margin-right: ${this.marginRight}px;\n --emw-skeleton-logo-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;case"image":e=`\n :host {\n --emw-skeleton-image-width: ${this.width};\n --emw-skeleton-image-height: ${this.height};\n --emw-skeleton-image-border-radius: ${this.borderRadius}px;\n --emw-skeleton-image-margin-bottom: ${this.marginBottom}px;\n --emw-skeleton-image-margin-top: ${this.marginTop}px;\n --emw-skeleton-image-margin-left: ${this.marginLeft}px;\n --emw-skeleton-image-margin-right: ${this.marginRight}px;\n --emw-skeleton-image-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;case"title":e=`\n :host {\n --emw-skeleton-title-width: ${this.width};\n --emw-skeleton-title-height: ${this.height};\n --emw-skeleton-title-border-radius: ${this.borderRadius}px;\n --emw-skeleton-title-margin-bottom: ${this.marginBottom}px;\n --emw-skeleton-title-margin-top: ${this.marginTop}px;\n --emw-skeleton-title-margin-left: ${this.marginLeft}px;\n --emw-skeleton-title-margin-right: ${this.marginRight}px;\n --emw-skeleton-title-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;case"text":e=`\n :host {\n --emw-skeleton-text-width: ${this.width};\n --emw-skeleton-text-height: ${this.height};\n --emw-skeleton-text-border-radius: ${this.borderRadius}px;\n --emw-skeleton-text-margin-bottom: ${this.marginBottom}px;\n --emw-skeleton-text-margin-top: ${this.marginTop}px;\n --emw-skeleton-text-margin-left: ${this.marginLeft}px;\n --emw-skeleton-text-margin-right: ${this.marginRight}px;\n --emw-skeleton-text-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;case"rectangle":e=`\n :host {\n --emw-skeleton-rectangle-width: ${this.width};\n --emw-skeleton-rectangle-height: ${this.height};\n --emw-skeleton-rectangle-border-radius: ${this.borderRadius}px;\n --emw-skeleton-rectangle-margin-bottom: ${this.marginBottom}px;\n --emw-skeleton-rectangle-margin-top: ${this.marginTop}px;\n --emw-skeleton-rectangle-margin-left: ${this.marginLeft}px;\n --emw-skeleton-rectangle-margin-right: ${this.marginRight}px;\n --emw-skeleton-rectangle-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;case"circle":e=`\n :host {\n --emw-skeleton-circle-size: ${this.size};\n --emw-skeleton-circle-background: ${this.color};\n --emw-skeleton-primary-color: ${this.primaryColor};\n --emw-skeleton-secondary-color: ${this.secondaryColor};\n }\n `;break;default:e=""}return t(n,{key:"3bb792a149db7fe732d5cbfa092cdb4d6ca0689e"},t("style",{key:"a4607599b60659f385ae2660513e38b383739674"},e),this.handleStructure(this.structure))}static get watchers(){return{structure:["handleStructureChange"]}}};p.style=":host{display:block;--emw-skeleton-rectangle-background:#c2c2c2;--emw-skeleton-circle-background:#c2c2c2;--emw-skeleton-text-background:#c2c2c2;--emw-skeleton-title-background:#c2c2c2;--emw-skeleton-image-background:#c2c2c2;--emw-skeleton-logo-background:#c2c2c2;--emw-skeleton-primary-color:#e0e0e0;--emw-skeleton-secondary-color:#f0f0f0}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 2px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 5px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:var(--emw-skeleton-text-width-100, 300px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 5px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, inherit)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 5px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, var(--emw-skeleton-color-0, #c2c2c2))}100%{background-color:var(--emw-skeleton-secondary-color, var(--emw-skeleton-color-100, #f0f0f0))}}";export{k as casino_engagement_suite_progress_bar,b as general_styling_wrapper,u as tournament_item,w as tournament_item_title,f as tournament_timer,v as ui_image,p as ui_skeleton}
1
+ import{r as e,h as t,g as i,c as s,H as n}from"./index-8b5c4b95.js";import{T as r,c as a,D as o,i as h,r as l,L as c,g as d,a as g,f as m}from"./casino-engagement-suite-tournament-ce10f79a.js";export{C as casino_engagement_suite_tournament}from"./casino-engagement-suite-tournament-ce10f79a.js";import"@everymatrix/ui-image";const b=class{constructor(t){e(this,t),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.value=0,this.disabled=!1,this.hidePercent=!1,this.indeterminate=!1,this.clientStyling="",this.clientStylingUrl="",this.limitStylingAppends=!1}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,HidePercent:this.hidePercent||this.indeterminate}}getProgressBarLineTemplate(){return t("div",this.indeterminate?{class:"ProgressBarLine Indeterminate",part:"ProgressBarLine Indeterminate"}:{class:"ProgressBarLine",part:"ProgressBarLine",style:{width:this.value+"%"}})}render(){return t("div",{key:"ecce3a26a92d2e090c1db84bdc1bdbeb505080ed",class:this.getProgressBarClasses(),part:"ProgressBar"},t("div",{key:"649fe1103d222200f2a1ad3b5967e37da1f1ab3d",class:"ProgressBarInfo",part:"ProgressBarInfo"},t("slot",{key:"49dc180eedd823f0027f75099813fb9d91bcd938",name:"Title"},t("div",{key:"e6e59da3fe7bbcb37e118e7fd23a8ff35587aca5"})),t("slot",{key:"3dc8e5fd1dbc8c268b9c76e393b751cb53605e7e",name:"Percent"},t("div",{key:"6a9e880f3ee3c4f26e8577c69be5db5f8e2d10ad",class:"ProgressBarPercent",part:"ProgressBarPercent"},this.value,"%"))),t("div",{key:"141106e77caad7b04bb199f911e87c0c6f0adc2d",class:"ProgressBarBackground",part:"ProgressBarBackground"},this.getProgressBarLineTemplate()))}get host(){return i(this)}};function u(e,t){if(e){const i=document.createElement("style");i.innerHTML=t,e.appendChild(i)}}function k(e,t){const i=new URL(t);fetch(i.href).then((e=>e.text())).then((t=>{const i=document.createElement("style");i.innerHTML=t,e&&e.appendChild(i)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}b.style=":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:var(--emw--font-size-small, 14px);line-height:14px}@keyframes indeterminate{0%{left:-200%;right:100%}60%{left:110%;right:-10%}to{left:110%;right:-10%}}.ProgressBarBackground{height:8px;background-color:var(--emw--color-gray-300, #666178);border-radius:var(--emw--border-radius-small, 4px);position:relative;overflow:hidden}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:var(--emw--border-radius-small, 4px);background:var(--emw--engagement-suite-gradient-button, linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%));transition:width ease-out 0.3s}.ProgressBarLine.Indeterminate{animation:indeterminate 1s linear infinite}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:var(--emw--font-weight-bold, 700);font-size:var(--emw--font-size-x-small, 12px);line-height:12px}.HidePercent .ProgressBarPercent{display:none}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:var(--emw--engagement-suite-gradient-button, 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-gray-300, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";const w=class{constructor(t){e(this,t),this.stylingAppends=!1,this.clientStyling="",this.clientStylingUrl="",this.mbSource=void 0,this.translationUrl="",this.targetTranslations=void 0}componentDidLoad(){this.el&&(null!=window.emMessageBus?function(e,t){if(window.emMessageBus){const i=document.createElement("style");window.emMessageBus.subscribe(t,(t=>{i.innerHTML=t,e&&e.appendChild(i)}))}}(this.el,`${this.mbSource}.Style`):(this.clientStyling&&u(this.el,this.clientStyling),this.clientStylingUrl&&k(this.el,this.clientStylingUrl),this.stylingAppends=!0))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}handleClientStylingChange(e,t){e!=t&&u(this.el,this.clientStyling)}handleClientStylingUrlChange(e,t){e!=t&&this.clientStylingUrl&&k(this.el,this.clientStylingUrl)}componentDidRender(){this.stylingAppends||(this.clientStyling&&u(this.el,this.clientStyling),this.clientStylingUrl&&k(this.el,this.clientStylingUrl),this.stylingAppends=!0)}async componentWillLoad(){const e=[];if(this.translationUrl){const s=(t=this.translationUrl,i=this.targetTranslations,new Promise((e=>{fetch(t).then((e=>e.json())).then((t=>{Object.keys(t).forEach((e=>{i[e]=i[e]||i.en,Object.keys(t[e]).forEach((s=>{i.en[s]&&(i[e][s]=i[e][s]||i.en[s],"object"==typeof t[e][s]?Object.keys(t[e][s]).forEach((n=>{i[e][s][n]=t[e][s][n]})):i[e][s]=t[e][s])}))})),e(!0)})).catch((t=>{console.error("Failed to load translations:",t),e(!1)}))})));e.push(s)}var t,i;return await Promise.all(e)}render(){return t("div",{key:"09ad83748bbad518743c8671b986c541c52bf3f0",class:"StyleShell"},t("slot",{key:"3b28b776d3944410c717b002b70946d274a4e8e7",name:"mainContent"}))}get el(){return i(this)}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}}};w.style=":host{display:block}";const f=class{constructor(t){e(this,t),this.clickToTournamentDetail=s(this,"clickToTournamentDetail",7),this.tournament=void 0,this.isNew=void 0,this.tid=void 0,this.locale=r}goToDetail(){this.clickToTournamentDetail.emit(this.tournament)}onTournamentUpdateEvent(e){const{detail:t}=e;t.id===this.tournament.id&&(this.tournament=Object.assign({},t))}render(){const e=this.tournament;return t("div",{key:"e4c39f94b5574dc67c1f76d16f21b680db8dbf6c",class:a("LeaderboardsItem",e.isPlayerAcknowledged?" GradientRounded Hollow":"",e.isUnjoined?"Unjoined":""),onClick:this.goToDetail.bind(this)},t("div",{key:"ed40bbbadbe4a216981f0cc0891476c3788c456f",class:"LeaderboardsItemContainer"},t("tournament-item-title",{key:"655d965507d60b5a90a66b5cf1b20ff744ab7115",tournament:e}),t("tournament-timer",{key:"b6b597921994640725dd57e7991b38604702ba0d",tournament:e})),t("div",{key:"1cc278a8ab8faa750427f4dce15140117732d5a1",class:"LeaderboardLabels"},this.isNew&&t("div",{key:"b14172c01cc9b930a439113357e630edd0713eae",class:"LeaderboardLabel"},t("span",{key:"ab763183adf551c34a749ae39c1719160387a816"},"new"))))}},v=class{constructor(t){e(this,t),this.unjoinTournamentConfirmEvent=s(this,"unjoinTournamentConfirmEvent",7),this.joinTournamentEvent=s(this,"joinTournamentEvent",7),this.tournament=void 0,this.locale=r,this.isButtonDisabed=!1}onTournamentChanged(e){this.isButtonDisabed=!0===e.isActionJoinPending}onClickItemJoin(){this.isButtonDisabed||(this.isButtonDisabed=!this.tournament.isPlayerAcknowledged,this.tournament.isPlayerAcknowledged?this.unjoinTournamentConfirmEvent.emit({type:o.unjoin,tournament:this.tournament}):this.joinTournamentEvent.emit(this.tournament))}componentDidLoad(){this.isButtonDisabed=!0===this.tournament.isActionJoinPending}render(){return t("div",{key:"cf8c4dc0cba0ebd8e1da43a32af618d79972f669",class:"TitleContainer"},t("div",{key:"1707346e5ef14b1379d8a0691f11a425a16f1c13",class:"Title"},this.tournament.nameOrTitle),!h(this.tournament)&&t("div",{key:"78a0c86a56fa2b145bb5e7106df441fe6deb116e"},l({statedClasses:{isHollow:this.tournament.isPlayerAcknowledged,isPending:this.isButtonDisabed},onClick:e=>{e.stopPropagation(),this.onClickItemJoin()},innerHTML:this.tournament.isPlayerAcknowledged?this.locale.Unjoin:this.locale.Join})))}static get watchers(){return{tournament:["onTournamentChanged"]}}},p=class{constructor(t){e(this,t),this.tournament=void 0,this.isDetail=!1,this.timeHolder=void 0,this.timeClock=!0,this.lastTimeDiff=void 0,this.lastProgress=void 0}containerPageChangeHandler(e){this.timeClock=e.detail.page===c.list&&!this.isDetail||e.detail.page===c.item&&this.isDetail}componentWillLoad(){this.lastProgress=d(this.tournament.startTime,this.tournament.endTime),this.lastTimeDiff=g(new Date,this.tournament.endTime,this.lastProgress)}setTimeInterval(){this.timeHolder=setInterval((()=>{const e=d(this.tournament.startTime,this.tournament.endTime),t=g(new Date,this.tournament.endTime,e);!this.timeClock||h(this.tournament)||t==this.lastTimeDiff&&e==this.lastProgress||(this.lastProgress=e,this.lastTimeDiff=t)}),2e3)}connectedCallback(){this.setTimeInterval()}disconnectedCallback(){clearInterval(this.timeHolder)}render(){return t("section",{key:"11426165a8f384d97f2b0158f7435f80ac0965a2",class:"TimeContainer"},t("div",{key:"b86c8a42a73b358fcc855a853cb322d1d314471a",class:"Time"},"Running"===this.tournament.state?t("div",{class:"Running"},t("div",null,this.lastTimeDiff),t("div",null,l({statedClasses:{isHollow:!0,isPending:!!this.tournament.isActionJoinPending},innerHTML:`${this.lastProgress}%`}))):[t("div",{class:"NotRunning"},m(this.tournament.startTime)),t("div",null,m(this.tournament.endTime))]),t("casino-engagement-suite-progress-bar",{key:"7f98e88679f30d0a0737d94ee806b1d92800b6a3",indeterminate:!1,value:Number(this.lastProgress>=100?100:this.lastProgress),"hide-percent":!0}))}},y=class{constructor(t){e(this,t),this.src=void 0,this.width=void 0,this.height=void 0,this.alt=void 0,this.styles=void 0,this.detectDistance="200px",this.imgLoaded=!1,this.shouldLoad=!1}handleSrc(){if(!this.shouldLoad)return;const e=new Image;e.onload=()=>{this.image&&(this.image.src=this.src,this.imgLoaded=!0,e.onload=null)},e.src=this.src}componentDidLoad(){"IntersectionObserver"in window?(this.el.__uxComponent=this,window.EMUxObserver||(window.EMUxObserver=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){const t=e.target.__uxComponent;t&&(t.shouldLoad=!0,t.handleSrc()),window.EMUxObserver.unobserve(e.target)}}))}),{rootMargin:this.detectDistance})),window.EMUxObserver.observe(this.el)):(this.shouldLoad=!0,this.handleSrc())}render(){return t(n,{key:"f506ba73852f257ad80bf59ca177d2065a5f365e",class:"HostContainer"},!this.imgLoaded&&t("ui-skeleton",{key:"564ebfab701f827ddc2debccb7615926dbc9e876",class:"UiContainer",structure:"image",width:"100%",height:"100%"}),t("img",{key:"2188ca4494c10587f064acc5459ffc468948f497",ref:e=>this.image=e,src:this.shouldLoad?this.src:void 0,onLoad:()=>this.imgLoaded=!0,style:this.styles,class:"UiContainer "+(this.imgLoaded?"Visible":"Hidden"),alt:this.alt,width:this.width,height:this.height,loading:"lazy"}))}get el(){return i(this)}static get watchers(){return{src:["handleSrc"]}}};y.style=".HostContainer{display:block}.UiContainer{height:100%;width:100%;border-radius:inherit;object-fit:inherit}.UiContainer .Image{border-radius:inherit}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;border-radius:var(--emw--border-radius-medium, 10px);transition:opacity 0.5s ease-in-out}";const x=class{constructor(t){e(this,t),this.stylingValue={width:this.handleStylingProps(this.width),height:this.handleStylingProps(this.height),borderRadius:this.handleStylingProps(this.borderRadius),marginBottom:this.handleStylingProps(this.marginBottom),marginTop:this.handleStylingProps(this.marginTop),marginLeft:this.handleStylingProps(this.marginLeft),marginRight:this.handleStylingProps(this.marginRight),size:this.handleStylingProps(this.size)},this.structure=void 0,this.width="unset",this.height="unset",this.borderRadius="unset",this.marginBottom="unset",this.marginTop="unset",this.marginLeft="unset",this.marginRight="unset",this.animation=!0,this.rows=0,this.size="100%"}handleStructureChange(e,t){t!==e&&this.handleStructure(e)}handleStylingProps(e){switch(typeof e){case"number":return 0===e?0:`${e}px`;case"undefined":default:return"unset";case"string":return["auto","unset","none","inherit","initial"].includes(e)||e.endsWith("px")||e.endsWith("%")?e:"unset"}}handleStructure(e){switch(e){case"logo":return this.renderLogo();case"image":return this.renderImage();case"title":return this.renderTitle();case"text":return this.renderText();case"rectangle":return this.renderRectangle();case"circle":return this.renderCircle();default:return null}}renderLogo(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Logo "+(this.animation?"Skeleton":"")}))}renderImage(){return t("div",{class:"Image "+(this.animation?"Skeleton":"")})}renderTitle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Title "+(this.animation?"Skeleton":"")}))}renderText(){return t("div",{class:"SkeletonContainer"},Array.from({length:this.rows>0?this.rows:1}).map(((e,i)=>t("div",{key:i,class:"Text "+(this.animation?"Skeleton":"")}))))}renderRectangle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Rectangle "+(this.animation?"Skeleton":"")}))}renderCircle(){return t("div",{class:"SkeletonContainer"},t("div",{class:"Circle "+(this.animation?"Skeleton":"")}))}render(){let e="";switch(this.structure){case"logo":e=`\n :host {\n --emw-skeleton-logo-width: ${this.stylingValue.width};\n --emw-skeleton-logo-height: ${this.stylingValue.height};\n --emw-skeleton-logo-border-radius: ${this.stylingValue.borderRadius};\n --emw-skeleton-logo-margin-bottom: ${this.stylingValue.marginBottom};\n --emw-skeleton-logo-margin-top: ${this.stylingValue.marginTop};\n --emw-skeleton-logo-margin-left: ${this.stylingValue.marginLeft};\n --emw-skeleton-logo-margin-right: ${this.stylingValue.marginRight};\n }\n `;break;case"image":e=`\n :host {\n --emw-skeleton-image-width: ${this.stylingValue.width};\n --emw-skeleton-image-height: ${this.stylingValue.height};\n --emw-skeleton-image-border-radius: ${this.stylingValue.borderRadius};\n --emw-skeleton-image-margin-bottom: ${this.stylingValue.marginBottom};\n --emw-skeleton-image-margin-top: ${this.stylingValue.marginTop};\n --emw-skeleton-image-margin-left: ${this.stylingValue.marginLeft};\n --emw-skeleton-image-margin-right: ${this.stylingValue.marginRight};\n }\n `;break;case"title":e=`\n :host {\n --emw-skeleton-title-width: ${this.stylingValue.width};\n --emw-skeleton-title-height: ${this.stylingValue.height};\n --emw-skeleton-title-border-radius: ${this.stylingValue.borderRadius};\n --emw-skeleton-title-margin-bottom: ${this.stylingValue.marginBottom};\n --emw-skeleton-title-margin-top: ${this.stylingValue.marginTop};\n --emw-skeleton-title-margin-left: ${this.stylingValue.marginLeft};\n --emw-skeleton-title-margin-right: ${this.stylingValue.marginRight};\n }\n `;break;case"text":e=`\n :host {\n --emw-skeleton-text-width: ${this.stylingValue.width};\n --emw-skeleton-text-height: ${this.stylingValue.height};\n --emw-skeleton-text-border-radius: ${this.stylingValue.borderRadius};\n --emw-skeleton-text-margin-bottom: ${this.stylingValue.marginBottom};\n --emw-skeleton-text-margin-top: ${this.stylingValue.marginTop};\n --emw-skeleton-text-margin-left: ${this.stylingValue.marginLeft};\n --emw-skeleton-text-margin-right: ${this.stylingValue.marginRight};\n }\n `;break;case"rectangle":e=`\n :host {\n --emw-skeleton-rectangle-width: ${this.stylingValue.width};\n --emw-skeleton-rectangle-height: ${this.stylingValue.height};\n --emw-skeleton-rectangle-border-radius: ${this.stylingValue.borderRadius};\n --emw-skeleton-rectangle-margin-bottom: ${this.stylingValue.marginBottom};\n --emw-skeleton-rectangle-margin-top: ${this.stylingValue.marginTop};\n --emw-skeleton-rectangle-margin-left: ${this.stylingValue.marginLeft};\n --emw-skeleton-rectangle-margin-right: ${this.stylingValue.marginRight};\n }\n `;break;case"circle":e=`\n :host {\n --emw-skeleton-circle-size: ${this.stylingValue.size};\n }\n `;break;default:e=""}return t(n,{key:"e6b885bfd985ce7663d990756fe9101e25eb97f0"},t("style",{key:"06ae24c7bb74f4dacfc12ae58085333f9dc89da5"},e),this.handleStructure(this.structure))}static get watchers(){return{structure:["handleStructureChange"]}}};x.style=":host{display:block}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 10px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 10px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:calc(var(--emw-skeleton-text-width, 400px) - 100px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 10px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, unset)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 10px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, #e0e0e0)}100%{background-color:var(--emw-skeleton-secondary-color, #f0f0f0)}}";export{b as casino_engagement_suite_progress_bar,w as general_styling_wrapper,f as tournament_item,v as tournament_item_title,p as tournament_timer,y as ui_image,x as ui_skeleton}
@@ -1 +1 @@
1
- import{p as e,b as n}from"./index-8b5c4b95.js";export{s as setNonce}from"./index-8b5c4b95.js";import{g as t}from"./app-globals-0f993ce5.js";(()=>{const n=import.meta.url,t={};return""!==n&&(t.resourcesUrl=new URL(".",n).href),e(t)})().then((async e=>(await t(),n([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{language:[1],show:[4],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],device:[1],orientation:[1],leaderboardsInit:[16],tipsHideDelay:[514,"tips-hide-delay"],tab:[32],locale:[32],tournamentItem:[32],tournamentList:[32],leaderboards:[32],isDialogOpen:[32],isShowInfo:[32],page:[32],tournamentInDialog:[32],dialog:[32],newIdList:[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{newIdList:["checkNewIdList"],tournamentList:["syncBarState"],show:["showPropWatcher"]}],[0,"tournament-item",{tournament:[16],isNew:[4,"is-new"],tid:[1],locale:[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{src:[1],width:[1],height:[1],alt:[1],styles:[8],detectDistance:[1,"detect-distance"],imgLoaded:[32],shouldLoad:[32]},null,{src:["handleSrc"]}],[4,"general-styling-wrapper",{clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],translationUrl:[1,"translation-url"],targetTranslations:[16]}],[0,"tournament-timer",{tournament:[16],isDetail:[4,"is-detail"],timeHolder:[32],timeClock:[32],lastTimeDiff:[32],lastProgress:[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{tournament:[16],locale:[32],isButtonDisabed:[32]},null,{tournament:["onTournamentChanged"]}],[0,"ui-skeleton",{structure:[1],width:[1],height:[1],borderRadius:[2,"border-radius"],marginBottom:[2,"margin-bottom"],marginTop:[2,"margin-top"],marginLeft:[2,"margin-left"],marginRight:[2,"margin-right"],animation:[4],rows:[2],size:[1],color:[1],primaryColor:[1,"primary-color"],secondaryColor:[1,"secondary-color"]},null,{structure:["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{value:[2],disabled:[4],hidePercent:[4,"hide-percent"],indeterminate:[4],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],limitStylingAppends:[32]}]]]],e))));
1
+ import{p as n,b as e}from"./index-8b5c4b95.js";export{s as setNonce}from"./index-8b5c4b95.js";import{g as t}from"./app-globals-0f993ce5.js";(()=>{const e=import.meta.url,t={};return""!==e&&(t.resourcesUrl=new URL(".",e).href),n(t)})().then((async n=>(await t(),e([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{language:[1],show:[4],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],device:[1],orientation:[1],leaderboardsInit:[16],tipsHideDelay:[514,"tips-hide-delay"],tab:[32],locale:[32],tournamentItem:[32],tournamentList:[32],leaderboards:[32],isDialogOpen:[32],isShowInfo:[32],page:[32],tournamentInDialog:[32],dialog:[32],newIdList:[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{newIdList:["checkNewIdList"],tournamentList:["syncBarState"],show:["showPropWatcher"]}],[0,"tournament-item",{tournament:[16],isNew:[4,"is-new"],tid:[1],locale:[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{src:[1],width:[1],height:[1],alt:[1],styles:[8],detectDistance:[1,"detect-distance"],imgLoaded:[32],shouldLoad:[32]},null,{src:["handleSrc"]}],[4,"general-styling-wrapper",{clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],mbSource:[1,"mb-source"],translationUrl:[1,"translation-url"],targetTranslations:[16]},null,{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}],[0,"tournament-timer",{tournament:[16],isDetail:[4,"is-detail"],timeHolder:[32],timeClock:[32],lastTimeDiff:[32],lastProgress:[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{tournament:[16],locale:[32],isButtonDisabed:[32]},null,{tournament:["onTournamentChanged"]}],[0,"ui-skeleton",{structure:[1],width:[1],height:[1],borderRadius:[8,"border-radius"],marginBottom:[8,"margin-bottom"],marginTop:[8,"margin-top"],marginLeft:[8,"margin-left"],marginRight:[8,"margin-right"],animation:[4],rows:[2],size:[1]},null,{structure:["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{value:[2],disabled:[4],hidePercent:[4,"hide-percent"],indeterminate:[4],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],limitStylingAppends:[32]}]]]],n))));
@@ -95,10 +95,71 @@ const mergeTranslations = (url, target) => {
95
95
  });
96
96
  });
97
97
  resolve(true);
98
+ })
99
+ .catch(err => {
100
+ console.error("Failed to load translations:", err);
101
+ resolve(false);
98
102
  });
99
103
  });
100
104
  };
101
105
 
106
+ /**
107
+ * @name setClientStyling
108
+ * @description Method used to create and append to the passed element of the widget a style element with the content received
109
+ * @param {HTMLElement} stylingContainer The reference element of the widget
110
+ * @param {string} clientStyling The style content
111
+ */
112
+ function setClientStyling(stylingContainer, clientStyling) {
113
+ if (stylingContainer) {
114
+ const sheet = document.createElement('style');
115
+ sheet.innerHTML = clientStyling;
116
+ stylingContainer.appendChild(sheet);
117
+ }
118
+ }
119
+
120
+ /**
121
+ * @name setClientStylingURL
122
+ * @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
123
+ * @param {HTMLElement} stylingContainer The reference element of the widget
124
+ * @param {string} clientStylingUrl The URL of the style content
125
+ */
126
+ function setClientStylingURL(stylingContainer, clientStylingUrl) {
127
+ const url = new URL(clientStylingUrl);
128
+
129
+ fetch(url.href)
130
+ .then((res) => res.text())
131
+ .then((data) => {
132
+ const cssFile = document.createElement('style');
133
+ cssFile.innerHTML = data;
134
+ if (stylingContainer) {
135
+ stylingContainer.appendChild(cssFile);
136
+ }
137
+ })
138
+ .catch((err) => {
139
+ console.error('There was an error while trying to load client styling from URL', err);
140
+ });
141
+ }
142
+
143
+ /**
144
+ * @name setStreamLibrary
145
+ * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
146
+ * @param {HTMLElement} stylingContainer The highest element of the widget
147
+ * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
148
+ * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
149
+ */
150
+ function setStreamStyling(stylingContainer, domain, subscription) {
151
+ if (window.emMessageBus) {
152
+ const sheet = document.createElement('style');
153
+
154
+ window.emMessageBus.subscribe(domain, (data) => {
155
+ sheet.innerHTML = data;
156
+ if (stylingContainer) {
157
+ stylingContainer.appendChild(sheet);
158
+ }
159
+ });
160
+ }
161
+ }
162
+
102
163
  const generalStylingWrapperCss = ":host{display:block}";
103
164
  const GeneralStylingWrapperStyle0 = generalStylingWrapperCss;
104
165
 
@@ -106,38 +167,47 @@ const GeneralStylingWrapper = class {
106
167
  constructor(hostRef) {
107
168
  index.registerInstance(this, hostRef);
108
169
  this.stylingAppends = false;
109
- this.setClientStyling = () => {
110
- let sheet = document.createElement('style');
111
- sheet.innerHTML = this.clientStyling;
112
- this.el.prepend(sheet);
113
- };
114
- this.setClientStylingURL = () => {
115
- let url = new URL(this.clientStylingUrl);
116
- let cssFile = document.createElement('style');
117
- fetch(url.href)
118
- .then((res) => res.text())
119
- .then((data) => {
120
- cssFile.innerHTML = data;
121
- setTimeout(() => {
122
- this.el.prepend(cssFile);
123
- }, 1);
124
- })
125
- .catch((err) => {
126
- console.log('error ', err);
127
- });
128
- };
129
170
  this.clientStyling = '';
130
171
  this.clientStylingUrl = '';
172
+ this.mbSource = undefined;
131
173
  this.translationUrl = '';
132
174
  this.targetTranslations = undefined;
133
175
  }
176
+ componentDidLoad() {
177
+ if (this.el) {
178
+ if (window.emMessageBus != undefined) {
179
+ setStreamStyling(this.el, `${this.mbSource}.Style`);
180
+ }
181
+ else {
182
+ if (this.clientStyling)
183
+ setClientStyling(this.el, this.clientStyling);
184
+ if (this.clientStylingUrl)
185
+ setClientStylingURL(this.el, this.clientStylingUrl);
186
+ this.stylingAppends = true;
187
+ }
188
+ }
189
+ }
190
+ disconnectedCallback() {
191
+ this.stylingSubscription && this.stylingSubscription.unsubscribe();
192
+ }
193
+ handleClientStylingChange(newValue, oldValue) {
194
+ if (newValue != oldValue) {
195
+ setClientStyling(this.el, this.clientStyling);
196
+ }
197
+ }
198
+ handleClientStylingUrlChange(newValue, oldValue) {
199
+ if (newValue != oldValue) {
200
+ if (this.clientStylingUrl)
201
+ setClientStylingURL(this.el, this.clientStylingUrl);
202
+ }
203
+ }
134
204
  componentDidRender() {
135
205
  // start custom styling area
136
206
  if (!this.stylingAppends) {
137
207
  if (this.clientStyling)
138
- this.setClientStyling();
208
+ setClientStyling(this.el, this.clientStyling);
139
209
  if (this.clientStylingUrl)
140
- this.setClientStylingURL();
210
+ setClientStylingURL(this.el, this.clientStylingUrl);
141
211
  this.stylingAppends = true;
142
212
  }
143
213
  // end custom styling area
@@ -151,9 +221,13 @@ const GeneralStylingWrapper = class {
151
221
  return await Promise.all(promises);
152
222
  }
153
223
  render() {
154
- return (index.h("div", { key: '4d3414408c7662f88331dbe655966237f74d6958', class: "StyleShell" }, index.h("slot", { key: '1d004644d84602c4314bdf5dfc26b55b160f57df', name: "mainContent" })));
224
+ return (index.h("div", { key: '09ad83748bbad518743c8671b986c541c52bf3f0', class: "StyleShell" }, index.h("slot", { key: '3b28b776d3944410c717b002b70946d274a4e8e7', name: "mainContent" })));
155
225
  }
156
226
  get el() { return index.getElement(this); }
227
+ static get watchers() { return {
228
+ "clientStyling": ["handleClientStylingChange"],
229
+ "clientStylingUrl": ["handleClientStylingUrlChange"]
230
+ }; }
157
231
  };
158
232
  GeneralStylingWrapper.style = GeneralStylingWrapperStyle0;
159
233
 
@@ -338,32 +412,58 @@ const UiImage = class {
338
412
  };
339
413
  UiImage.style = UiImageStyle0;
340
414
 
341
- const uiSkeletonCss = ":host{display:block;--emw-skeleton-rectangle-background:#c2c2c2;--emw-skeleton-circle-background:#c2c2c2;--emw-skeleton-text-background:#c2c2c2;--emw-skeleton-title-background:#c2c2c2;--emw-skeleton-image-background:#c2c2c2;--emw-skeleton-logo-background:#c2c2c2;--emw-skeleton-primary-color:#e0e0e0;--emw-skeleton-secondary-color:#f0f0f0}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 2px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 5px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:var(--emw-skeleton-text-width-100, 300px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 5px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, inherit)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 5px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, var(--emw-skeleton-color-0, #c2c2c2))}100%{background-color:var(--emw-skeleton-secondary-color, var(--emw-skeleton-color-100, #f0f0f0))}}";
415
+ const uiSkeletonCss = ":host{display:block}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 10px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 10px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:calc(var(--emw-skeleton-text-width, 400px) - 100px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 10px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, unset)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 10px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, #e0e0e0)}100%{background-color:var(--emw-skeleton-secondary-color, #f0f0f0)}}";
342
416
  const UiSkeletonStyle0 = uiSkeletonCss;
343
417
 
344
418
  const UiSkeleton = class {
345
419
  constructor(hostRef) {
346
420
  index.registerInstance(this, hostRef);
421
+ this.stylingValue = {
422
+ width: this.handleStylingProps(this.width),
423
+ height: this.handleStylingProps(this.height),
424
+ borderRadius: this.handleStylingProps(this.borderRadius),
425
+ marginBottom: this.handleStylingProps(this.marginBottom),
426
+ marginTop: this.handleStylingProps(this.marginTop),
427
+ marginLeft: this.handleStylingProps(this.marginLeft),
428
+ marginRight: this.handleStylingProps(this.marginRight),
429
+ size: this.handleStylingProps(this.size)
430
+ };
347
431
  this.structure = undefined;
348
- this.width = undefined;
349
- this.height = undefined;
350
- this.borderRadius = undefined;
351
- this.marginBottom = undefined;
352
- this.marginTop = undefined;
353
- this.marginLeft = undefined;
354
- this.marginRight = undefined;
432
+ this.width = 'unset';
433
+ this.height = 'unset';
434
+ this.borderRadius = 'unset';
435
+ this.marginBottom = 'unset';
436
+ this.marginTop = 'unset';
437
+ this.marginLeft = 'unset';
438
+ this.marginRight = 'unset';
355
439
  this.animation = true;
356
- this.rows = undefined;
357
- this.size = undefined;
358
- this.color = undefined;
359
- this.primaryColor = undefined;
360
- this.secondaryColor = undefined;
440
+ this.rows = 0;
441
+ this.size = '100%';
361
442
  }
362
443
  handleStructureChange(newValue, oldValue) {
363
444
  if (oldValue !== newValue) {
364
445
  this.handleStructure(newValue);
365
446
  }
366
447
  }
448
+ handleStylingProps(value) {
449
+ switch (typeof value) {
450
+ case 'number':
451
+ return value === 0 ? 0 : `${value}px`;
452
+ case 'undefined':
453
+ return 'unset';
454
+ case 'string':
455
+ if (['auto', 'unset', 'none', 'inherit', 'initial'].includes(value) ||
456
+ value.endsWith('px') ||
457
+ value.endsWith('%')) {
458
+ return value;
459
+ }
460
+ else {
461
+ return 'unset';
462
+ }
463
+ default:
464
+ return 'unset';
465
+ }
466
+ }
367
467
  handleStructure(structure) {
368
468
  switch (structure) {
369
469
  case 'logo':
@@ -383,22 +483,22 @@ const UiSkeleton = class {
383
483
  }
384
484
  }
385
485
  renderLogo() {
386
- return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Logo " + (this.animation ? 'Skeleton' : '') })));
486
+ return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: 'Logo ' + (this.animation ? 'Skeleton' : '') })));
387
487
  }
388
488
  renderImage() {
389
- return (index.h("div", { class: "Image " + (this.animation ? 'Skeleton' : '') }));
489
+ return index.h("div", { class: 'Image ' + (this.animation ? 'Skeleton' : '') });
390
490
  }
391
491
  renderTitle() {
392
- return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Title " + (this.animation ? 'Skeleton' : '') })));
492
+ return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: 'Title ' + (this.animation ? 'Skeleton' : '') })));
393
493
  }
394
494
  renderText() {
395
- return (index.h("div", { class: "SkeletonContainer" }, Array.from({ length: this.rows > 0 ? this.rows : 1 }).map((_, index$1) => (index.h("div", { key: index$1, class: "Text " + (this.animation ? 'Skeleton' : '') })))));
495
+ return (index.h("div", { class: "SkeletonContainer" }, Array.from({ length: this.rows > 0 ? this.rows : 1 }).map((_, index$1) => (index.h("div", { key: index$1, class: 'Text ' + (this.animation ? 'Skeleton' : '') })))));
396
496
  }
397
497
  renderRectangle() {
398
- return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Rectangle " + (this.animation ? 'Skeleton' : '') })));
498
+ return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: 'Rectangle ' + (this.animation ? 'Skeleton' : '') })));
399
499
  }
400
500
  renderCircle() {
401
- return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Circle " + (this.animation ? 'Skeleton' : '') })));
501
+ return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: 'Circle ' + (this.animation ? 'Skeleton' : '') })));
402
502
  }
403
503
  render() {
404
504
  let styleBlock = '';
@@ -406,97 +506,79 @@ const UiSkeleton = class {
406
506
  case 'logo':
407
507
  styleBlock = `
408
508
  :host {
409
- --emw-skeleton-logo-width: ${this.width};
410
- --emw-skeleton-logo-height: ${this.height};
411
- --emw-skeleton-logo-border-radius: ${this.borderRadius}px;
412
- --emw-skeleton-logo-margin-bottom: ${this.marginBottom}px;
413
- --emw-skeleton-logo-margin-top: ${this.marginTop}px;
414
- --emw-skeleton-logo-margin-left: ${this.marginLeft}px;
415
- --emw-skeleton-logo-margin-right: ${this.marginRight}px;
416
- --emw-skeleton-logo-background: ${this.color};
417
- --emw-skeleton-primary-color: ${this.primaryColor};
418
- --emw-skeleton-secondary-color: ${this.secondaryColor};
509
+ --emw-skeleton-logo-width: ${this.stylingValue.width};
510
+ --emw-skeleton-logo-height: ${this.stylingValue.height};
511
+ --emw-skeleton-logo-border-radius: ${this.stylingValue.borderRadius};
512
+ --emw-skeleton-logo-margin-bottom: ${this.stylingValue.marginBottom};
513
+ --emw-skeleton-logo-margin-top: ${this.stylingValue.marginTop};
514
+ --emw-skeleton-logo-margin-left: ${this.stylingValue.marginLeft};
515
+ --emw-skeleton-logo-margin-right: ${this.stylingValue.marginRight};
419
516
  }
420
517
  `;
421
518
  break;
422
519
  case 'image':
423
520
  styleBlock = `
424
521
  :host {
425
- --emw-skeleton-image-width: ${this.width};
426
- --emw-skeleton-image-height: ${this.height};
427
- --emw-skeleton-image-border-radius: ${this.borderRadius}px;
428
- --emw-skeleton-image-margin-bottom: ${this.marginBottom}px;
429
- --emw-skeleton-image-margin-top: ${this.marginTop}px;
430
- --emw-skeleton-image-margin-left: ${this.marginLeft}px;
431
- --emw-skeleton-image-margin-right: ${this.marginRight}px;
432
- --emw-skeleton-image-background: ${this.color};
433
- --emw-skeleton-primary-color: ${this.primaryColor};
434
- --emw-skeleton-secondary-color: ${this.secondaryColor};
522
+ --emw-skeleton-image-width: ${this.stylingValue.width};
523
+ --emw-skeleton-image-height: ${this.stylingValue.height};
524
+ --emw-skeleton-image-border-radius: ${this.stylingValue.borderRadius};
525
+ --emw-skeleton-image-margin-bottom: ${this.stylingValue.marginBottom};
526
+ --emw-skeleton-image-margin-top: ${this.stylingValue.marginTop};
527
+ --emw-skeleton-image-margin-left: ${this.stylingValue.marginLeft};
528
+ --emw-skeleton-image-margin-right: ${this.stylingValue.marginRight};
435
529
  }
436
530
  `;
437
531
  break;
438
532
  case 'title':
439
533
  styleBlock = `
440
534
  :host {
441
- --emw-skeleton-title-width: ${this.width};
442
- --emw-skeleton-title-height: ${this.height};
443
- --emw-skeleton-title-border-radius: ${this.borderRadius}px;
444
- --emw-skeleton-title-margin-bottom: ${this.marginBottom}px;
445
- --emw-skeleton-title-margin-top: ${this.marginTop}px;
446
- --emw-skeleton-title-margin-left: ${this.marginLeft}px;
447
- --emw-skeleton-title-margin-right: ${this.marginRight}px;
448
- --emw-skeleton-title-background: ${this.color};
449
- --emw-skeleton-primary-color: ${this.primaryColor};
450
- --emw-skeleton-secondary-color: ${this.secondaryColor};
535
+ --emw-skeleton-title-width: ${this.stylingValue.width};
536
+ --emw-skeleton-title-height: ${this.stylingValue.height};
537
+ --emw-skeleton-title-border-radius: ${this.stylingValue.borderRadius};
538
+ --emw-skeleton-title-margin-bottom: ${this.stylingValue.marginBottom};
539
+ --emw-skeleton-title-margin-top: ${this.stylingValue.marginTop};
540
+ --emw-skeleton-title-margin-left: ${this.stylingValue.marginLeft};
541
+ --emw-skeleton-title-margin-right: ${this.stylingValue.marginRight};
451
542
  }
452
543
  `;
453
544
  break;
454
545
  case 'text':
455
546
  styleBlock = `
456
547
  :host {
457
- --emw-skeleton-text-width: ${this.width};
458
- --emw-skeleton-text-height: ${this.height};
459
- --emw-skeleton-text-border-radius: ${this.borderRadius}px;
460
- --emw-skeleton-text-margin-bottom: ${this.marginBottom}px;
461
- --emw-skeleton-text-margin-top: ${this.marginTop}px;
462
- --emw-skeleton-text-margin-left: ${this.marginLeft}px;
463
- --emw-skeleton-text-margin-right: ${this.marginRight}px;
464
- --emw-skeleton-text-background: ${this.color};
465
- --emw-skeleton-primary-color: ${this.primaryColor};
466
- --emw-skeleton-secondary-color: ${this.secondaryColor};
548
+ --emw-skeleton-text-width: ${this.stylingValue.width};
549
+ --emw-skeleton-text-height: ${this.stylingValue.height};
550
+ --emw-skeleton-text-border-radius: ${this.stylingValue.borderRadius};
551
+ --emw-skeleton-text-margin-bottom: ${this.stylingValue.marginBottom};
552
+ --emw-skeleton-text-margin-top: ${this.stylingValue.marginTop};
553
+ --emw-skeleton-text-margin-left: ${this.stylingValue.marginLeft};
554
+ --emw-skeleton-text-margin-right: ${this.stylingValue.marginRight};
467
555
  }
468
556
  `;
469
557
  break;
470
558
  case 'rectangle':
471
559
  styleBlock = `
472
560
  :host {
473
- --emw-skeleton-rectangle-width: ${this.width};
474
- --emw-skeleton-rectangle-height: ${this.height};
475
- --emw-skeleton-rectangle-border-radius: ${this.borderRadius}px;
476
- --emw-skeleton-rectangle-margin-bottom: ${this.marginBottom}px;
477
- --emw-skeleton-rectangle-margin-top: ${this.marginTop}px;
478
- --emw-skeleton-rectangle-margin-left: ${this.marginLeft}px;
479
- --emw-skeleton-rectangle-margin-right: ${this.marginRight}px;
480
- --emw-skeleton-rectangle-background: ${this.color};
481
- --emw-skeleton-primary-color: ${this.primaryColor};
482
- --emw-skeleton-secondary-color: ${this.secondaryColor};
561
+ --emw-skeleton-rectangle-width: ${this.stylingValue.width};
562
+ --emw-skeleton-rectangle-height: ${this.stylingValue.height};
563
+ --emw-skeleton-rectangle-border-radius: ${this.stylingValue.borderRadius};
564
+ --emw-skeleton-rectangle-margin-bottom: ${this.stylingValue.marginBottom};
565
+ --emw-skeleton-rectangle-margin-top: ${this.stylingValue.marginTop};
566
+ --emw-skeleton-rectangle-margin-left: ${this.stylingValue.marginLeft};
567
+ --emw-skeleton-rectangle-margin-right: ${this.stylingValue.marginRight};
483
568
  }
484
569
  `;
485
570
  break;
486
571
  case 'circle':
487
572
  styleBlock = `
488
573
  :host {
489
- --emw-skeleton-circle-size: ${this.size};
490
- --emw-skeleton-circle-background: ${this.color};
491
- --emw-skeleton-primary-color: ${this.primaryColor};
492
- --emw-skeleton-secondary-color: ${this.secondaryColor};
574
+ --emw-skeleton-circle-size: ${this.stylingValue.size};
493
575
  }
494
576
  `;
495
577
  break;
496
578
  default:
497
579
  styleBlock = '';
498
580
  }
499
- return (index.h(index.Host, { key: '3bb792a149db7fe732d5cbfa092cdb4d6ca0689e' }, index.h("style", { key: 'a4607599b60659f385ae2660513e38b383739674' }, styleBlock), this.handleStructure(this.structure)));
581
+ return (index.h(index.Host, { key: 'e6b885bfd985ce7663d990756fe9101e25eb97f0' }, index.h("style", { key: '06ae24c7bb74f4dacfc12ae58085333f9dc89da5' }, styleBlock), this.handleStructure(this.structure)));
500
582
  }
501
583
  static get watchers() { return {
502
584
  "structure": ["handleStructureChange"]
@@ -19,7 +19,7 @@ var patchBrowser = () => {
19
19
 
20
20
  patchBrowser().then(async (options) => {
21
21
  await appGlobals.globalScripts();
22
- return index.bootstrapLazy([["casino-engagement-suite-progress-bar_8.cjs",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
22
+ return index.bootstrapLazy([["casino-engagement-suite-progress-bar_8.cjs",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy([["casino-engagement-suite-progress-bar_8.cjs",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
11
+ return index.bootstrapLazy([["casino-engagement-suite-progress-bar_8.cjs",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
@@ -92,10 +92,71 @@ const mergeTranslations = (url, target) => {
92
92
  });
93
93
  });
94
94
  resolve(true);
95
+ })
96
+ .catch(err => {
97
+ console.error("Failed to load translations:", err);
98
+ resolve(false);
95
99
  });
96
100
  });
97
101
  };
98
102
 
103
+ /**
104
+ * @name setClientStyling
105
+ * @description Method used to create and append to the passed element of the widget a style element with the content received
106
+ * @param {HTMLElement} stylingContainer The reference element of the widget
107
+ * @param {string} clientStyling The style content
108
+ */
109
+ function setClientStyling(stylingContainer, clientStyling) {
110
+ if (stylingContainer) {
111
+ const sheet = document.createElement('style');
112
+ sheet.innerHTML = clientStyling;
113
+ stylingContainer.appendChild(sheet);
114
+ }
115
+ }
116
+
117
+ /**
118
+ * @name setClientStylingURL
119
+ * @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
120
+ * @param {HTMLElement} stylingContainer The reference element of the widget
121
+ * @param {string} clientStylingUrl The URL of the style content
122
+ */
123
+ function setClientStylingURL(stylingContainer, clientStylingUrl) {
124
+ const url = new URL(clientStylingUrl);
125
+
126
+ fetch(url.href)
127
+ .then((res) => res.text())
128
+ .then((data) => {
129
+ const cssFile = document.createElement('style');
130
+ cssFile.innerHTML = data;
131
+ if (stylingContainer) {
132
+ stylingContainer.appendChild(cssFile);
133
+ }
134
+ })
135
+ .catch((err) => {
136
+ console.error('There was an error while trying to load client styling from URL', err);
137
+ });
138
+ }
139
+
140
+ /**
141
+ * @name setStreamLibrary
142
+ * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
143
+ * @param {HTMLElement} stylingContainer The highest element of the widget
144
+ * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
145
+ * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
146
+ */
147
+ function setStreamStyling(stylingContainer, domain, subscription) {
148
+ if (window.emMessageBus) {
149
+ const sheet = document.createElement('style');
150
+
151
+ window.emMessageBus.subscribe(domain, (data) => {
152
+ sheet.innerHTML = data;
153
+ if (stylingContainer) {
154
+ stylingContainer.appendChild(sheet);
155
+ }
156
+ });
157
+ }
158
+ }
159
+
99
160
  const generalStylingWrapperCss = ":host{display:block}";
100
161
  const GeneralStylingWrapperStyle0 = generalStylingWrapperCss;
101
162
 
@@ -103,38 +164,47 @@ const GeneralStylingWrapper = class {
103
164
  constructor(hostRef) {
104
165
  registerInstance(this, hostRef);
105
166
  this.stylingAppends = false;
106
- this.setClientStyling = () => {
107
- let sheet = document.createElement('style');
108
- sheet.innerHTML = this.clientStyling;
109
- this.el.prepend(sheet);
110
- };
111
- this.setClientStylingURL = () => {
112
- let url = new URL(this.clientStylingUrl);
113
- let cssFile = document.createElement('style');
114
- fetch(url.href)
115
- .then((res) => res.text())
116
- .then((data) => {
117
- cssFile.innerHTML = data;
118
- setTimeout(() => {
119
- this.el.prepend(cssFile);
120
- }, 1);
121
- })
122
- .catch((err) => {
123
- console.log('error ', err);
124
- });
125
- };
126
167
  this.clientStyling = '';
127
168
  this.clientStylingUrl = '';
169
+ this.mbSource = undefined;
128
170
  this.translationUrl = '';
129
171
  this.targetTranslations = undefined;
130
172
  }
173
+ componentDidLoad() {
174
+ if (this.el) {
175
+ if (window.emMessageBus != undefined) {
176
+ setStreamStyling(this.el, `${this.mbSource}.Style`);
177
+ }
178
+ else {
179
+ if (this.clientStyling)
180
+ setClientStyling(this.el, this.clientStyling);
181
+ if (this.clientStylingUrl)
182
+ setClientStylingURL(this.el, this.clientStylingUrl);
183
+ this.stylingAppends = true;
184
+ }
185
+ }
186
+ }
187
+ disconnectedCallback() {
188
+ this.stylingSubscription && this.stylingSubscription.unsubscribe();
189
+ }
190
+ handleClientStylingChange(newValue, oldValue) {
191
+ if (newValue != oldValue) {
192
+ setClientStyling(this.el, this.clientStyling);
193
+ }
194
+ }
195
+ handleClientStylingUrlChange(newValue, oldValue) {
196
+ if (newValue != oldValue) {
197
+ if (this.clientStylingUrl)
198
+ setClientStylingURL(this.el, this.clientStylingUrl);
199
+ }
200
+ }
131
201
  componentDidRender() {
132
202
  // start custom styling area
133
203
  if (!this.stylingAppends) {
134
204
  if (this.clientStyling)
135
- this.setClientStyling();
205
+ setClientStyling(this.el, this.clientStyling);
136
206
  if (this.clientStylingUrl)
137
- this.setClientStylingURL();
207
+ setClientStylingURL(this.el, this.clientStylingUrl);
138
208
  this.stylingAppends = true;
139
209
  }
140
210
  // end custom styling area
@@ -148,9 +218,13 @@ const GeneralStylingWrapper = class {
148
218
  return await Promise.all(promises);
149
219
  }
150
220
  render() {
151
- return (h("div", { key: '4d3414408c7662f88331dbe655966237f74d6958', class: "StyleShell" }, h("slot", { key: '1d004644d84602c4314bdf5dfc26b55b160f57df', name: "mainContent" })));
221
+ return (h("div", { key: '09ad83748bbad518743c8671b986c541c52bf3f0', class: "StyleShell" }, h("slot", { key: '3b28b776d3944410c717b002b70946d274a4e8e7', name: "mainContent" })));
152
222
  }
153
223
  get el() { return getElement(this); }
224
+ static get watchers() { return {
225
+ "clientStyling": ["handleClientStylingChange"],
226
+ "clientStylingUrl": ["handleClientStylingUrlChange"]
227
+ }; }
154
228
  };
155
229
  GeneralStylingWrapper.style = GeneralStylingWrapperStyle0;
156
230
 
@@ -335,32 +409,58 @@ const UiImage = class {
335
409
  };
336
410
  UiImage.style = UiImageStyle0;
337
411
 
338
- const uiSkeletonCss = ":host{display:block;--emw-skeleton-rectangle-background:#c2c2c2;--emw-skeleton-circle-background:#c2c2c2;--emw-skeleton-text-background:#c2c2c2;--emw-skeleton-title-background:#c2c2c2;--emw-skeleton-image-background:#c2c2c2;--emw-skeleton-logo-background:#c2c2c2;--emw-skeleton-primary-color:#e0e0e0;--emw-skeleton-secondary-color:#f0f0f0}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 2px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 5px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:var(--emw-skeleton-text-width-100, 300px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 5px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, inherit)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 5px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, var(--emw-skeleton-color-0, #c2c2c2))}100%{background-color:var(--emw-skeleton-secondary-color, var(--emw-skeleton-color-100, #f0f0f0))}}";
412
+ const uiSkeletonCss = ":host{display:block}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 10px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 10px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:calc(var(--emw-skeleton-text-width, 400px) - 100px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 10px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, unset)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 10px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, #e0e0e0)}100%{background-color:var(--emw-skeleton-secondary-color, #f0f0f0)}}";
339
413
  const UiSkeletonStyle0 = uiSkeletonCss;
340
414
 
341
415
  const UiSkeleton = class {
342
416
  constructor(hostRef) {
343
417
  registerInstance(this, hostRef);
418
+ this.stylingValue = {
419
+ width: this.handleStylingProps(this.width),
420
+ height: this.handleStylingProps(this.height),
421
+ borderRadius: this.handleStylingProps(this.borderRadius),
422
+ marginBottom: this.handleStylingProps(this.marginBottom),
423
+ marginTop: this.handleStylingProps(this.marginTop),
424
+ marginLeft: this.handleStylingProps(this.marginLeft),
425
+ marginRight: this.handleStylingProps(this.marginRight),
426
+ size: this.handleStylingProps(this.size)
427
+ };
344
428
  this.structure = undefined;
345
- this.width = undefined;
346
- this.height = undefined;
347
- this.borderRadius = undefined;
348
- this.marginBottom = undefined;
349
- this.marginTop = undefined;
350
- this.marginLeft = undefined;
351
- this.marginRight = undefined;
429
+ this.width = 'unset';
430
+ this.height = 'unset';
431
+ this.borderRadius = 'unset';
432
+ this.marginBottom = 'unset';
433
+ this.marginTop = 'unset';
434
+ this.marginLeft = 'unset';
435
+ this.marginRight = 'unset';
352
436
  this.animation = true;
353
- this.rows = undefined;
354
- this.size = undefined;
355
- this.color = undefined;
356
- this.primaryColor = undefined;
357
- this.secondaryColor = undefined;
437
+ this.rows = 0;
438
+ this.size = '100%';
358
439
  }
359
440
  handleStructureChange(newValue, oldValue) {
360
441
  if (oldValue !== newValue) {
361
442
  this.handleStructure(newValue);
362
443
  }
363
444
  }
445
+ handleStylingProps(value) {
446
+ switch (typeof value) {
447
+ case 'number':
448
+ return value === 0 ? 0 : `${value}px`;
449
+ case 'undefined':
450
+ return 'unset';
451
+ case 'string':
452
+ if (['auto', 'unset', 'none', 'inherit', 'initial'].includes(value) ||
453
+ value.endsWith('px') ||
454
+ value.endsWith('%')) {
455
+ return value;
456
+ }
457
+ else {
458
+ return 'unset';
459
+ }
460
+ default:
461
+ return 'unset';
462
+ }
463
+ }
364
464
  handleStructure(structure) {
365
465
  switch (structure) {
366
466
  case 'logo':
@@ -380,22 +480,22 @@ const UiSkeleton = class {
380
480
  }
381
481
  }
382
482
  renderLogo() {
383
- return (h("div", { class: "SkeletonContainer" }, h("div", { class: "Logo " + (this.animation ? 'Skeleton' : '') })));
483
+ return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Logo ' + (this.animation ? 'Skeleton' : '') })));
384
484
  }
385
485
  renderImage() {
386
- return (h("div", { class: "Image " + (this.animation ? 'Skeleton' : '') }));
486
+ return h("div", { class: 'Image ' + (this.animation ? 'Skeleton' : '') });
387
487
  }
388
488
  renderTitle() {
389
- return (h("div", { class: "SkeletonContainer" }, h("div", { class: "Title " + (this.animation ? 'Skeleton' : '') })));
489
+ return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Title ' + (this.animation ? 'Skeleton' : '') })));
390
490
  }
391
491
  renderText() {
392
- return (h("div", { class: "SkeletonContainer" }, Array.from({ length: this.rows > 0 ? this.rows : 1 }).map((_, index) => (h("div", { key: index, class: "Text " + (this.animation ? 'Skeleton' : '') })))));
492
+ return (h("div", { class: "SkeletonContainer" }, Array.from({ length: this.rows > 0 ? this.rows : 1 }).map((_, index) => (h("div", { key: index, class: 'Text ' + (this.animation ? 'Skeleton' : '') })))));
393
493
  }
394
494
  renderRectangle() {
395
- return (h("div", { class: "SkeletonContainer" }, h("div", { class: "Rectangle " + (this.animation ? 'Skeleton' : '') })));
495
+ return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Rectangle ' + (this.animation ? 'Skeleton' : '') })));
396
496
  }
397
497
  renderCircle() {
398
- return (h("div", { class: "SkeletonContainer" }, h("div", { class: "Circle " + (this.animation ? 'Skeleton' : '') })));
498
+ return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Circle ' + (this.animation ? 'Skeleton' : '') })));
399
499
  }
400
500
  render() {
401
501
  let styleBlock = '';
@@ -403,97 +503,79 @@ const UiSkeleton = class {
403
503
  case 'logo':
404
504
  styleBlock = `
405
505
  :host {
406
- --emw-skeleton-logo-width: ${this.width};
407
- --emw-skeleton-logo-height: ${this.height};
408
- --emw-skeleton-logo-border-radius: ${this.borderRadius}px;
409
- --emw-skeleton-logo-margin-bottom: ${this.marginBottom}px;
410
- --emw-skeleton-logo-margin-top: ${this.marginTop}px;
411
- --emw-skeleton-logo-margin-left: ${this.marginLeft}px;
412
- --emw-skeleton-logo-margin-right: ${this.marginRight}px;
413
- --emw-skeleton-logo-background: ${this.color};
414
- --emw-skeleton-primary-color: ${this.primaryColor};
415
- --emw-skeleton-secondary-color: ${this.secondaryColor};
506
+ --emw-skeleton-logo-width: ${this.stylingValue.width};
507
+ --emw-skeleton-logo-height: ${this.stylingValue.height};
508
+ --emw-skeleton-logo-border-radius: ${this.stylingValue.borderRadius};
509
+ --emw-skeleton-logo-margin-bottom: ${this.stylingValue.marginBottom};
510
+ --emw-skeleton-logo-margin-top: ${this.stylingValue.marginTop};
511
+ --emw-skeleton-logo-margin-left: ${this.stylingValue.marginLeft};
512
+ --emw-skeleton-logo-margin-right: ${this.stylingValue.marginRight};
416
513
  }
417
514
  `;
418
515
  break;
419
516
  case 'image':
420
517
  styleBlock = `
421
518
  :host {
422
- --emw-skeleton-image-width: ${this.width};
423
- --emw-skeleton-image-height: ${this.height};
424
- --emw-skeleton-image-border-radius: ${this.borderRadius}px;
425
- --emw-skeleton-image-margin-bottom: ${this.marginBottom}px;
426
- --emw-skeleton-image-margin-top: ${this.marginTop}px;
427
- --emw-skeleton-image-margin-left: ${this.marginLeft}px;
428
- --emw-skeleton-image-margin-right: ${this.marginRight}px;
429
- --emw-skeleton-image-background: ${this.color};
430
- --emw-skeleton-primary-color: ${this.primaryColor};
431
- --emw-skeleton-secondary-color: ${this.secondaryColor};
519
+ --emw-skeleton-image-width: ${this.stylingValue.width};
520
+ --emw-skeleton-image-height: ${this.stylingValue.height};
521
+ --emw-skeleton-image-border-radius: ${this.stylingValue.borderRadius};
522
+ --emw-skeleton-image-margin-bottom: ${this.stylingValue.marginBottom};
523
+ --emw-skeleton-image-margin-top: ${this.stylingValue.marginTop};
524
+ --emw-skeleton-image-margin-left: ${this.stylingValue.marginLeft};
525
+ --emw-skeleton-image-margin-right: ${this.stylingValue.marginRight};
432
526
  }
433
527
  `;
434
528
  break;
435
529
  case 'title':
436
530
  styleBlock = `
437
531
  :host {
438
- --emw-skeleton-title-width: ${this.width};
439
- --emw-skeleton-title-height: ${this.height};
440
- --emw-skeleton-title-border-radius: ${this.borderRadius}px;
441
- --emw-skeleton-title-margin-bottom: ${this.marginBottom}px;
442
- --emw-skeleton-title-margin-top: ${this.marginTop}px;
443
- --emw-skeleton-title-margin-left: ${this.marginLeft}px;
444
- --emw-skeleton-title-margin-right: ${this.marginRight}px;
445
- --emw-skeleton-title-background: ${this.color};
446
- --emw-skeleton-primary-color: ${this.primaryColor};
447
- --emw-skeleton-secondary-color: ${this.secondaryColor};
532
+ --emw-skeleton-title-width: ${this.stylingValue.width};
533
+ --emw-skeleton-title-height: ${this.stylingValue.height};
534
+ --emw-skeleton-title-border-radius: ${this.stylingValue.borderRadius};
535
+ --emw-skeleton-title-margin-bottom: ${this.stylingValue.marginBottom};
536
+ --emw-skeleton-title-margin-top: ${this.stylingValue.marginTop};
537
+ --emw-skeleton-title-margin-left: ${this.stylingValue.marginLeft};
538
+ --emw-skeleton-title-margin-right: ${this.stylingValue.marginRight};
448
539
  }
449
540
  `;
450
541
  break;
451
542
  case 'text':
452
543
  styleBlock = `
453
544
  :host {
454
- --emw-skeleton-text-width: ${this.width};
455
- --emw-skeleton-text-height: ${this.height};
456
- --emw-skeleton-text-border-radius: ${this.borderRadius}px;
457
- --emw-skeleton-text-margin-bottom: ${this.marginBottom}px;
458
- --emw-skeleton-text-margin-top: ${this.marginTop}px;
459
- --emw-skeleton-text-margin-left: ${this.marginLeft}px;
460
- --emw-skeleton-text-margin-right: ${this.marginRight}px;
461
- --emw-skeleton-text-background: ${this.color};
462
- --emw-skeleton-primary-color: ${this.primaryColor};
463
- --emw-skeleton-secondary-color: ${this.secondaryColor};
545
+ --emw-skeleton-text-width: ${this.stylingValue.width};
546
+ --emw-skeleton-text-height: ${this.stylingValue.height};
547
+ --emw-skeleton-text-border-radius: ${this.stylingValue.borderRadius};
548
+ --emw-skeleton-text-margin-bottom: ${this.stylingValue.marginBottom};
549
+ --emw-skeleton-text-margin-top: ${this.stylingValue.marginTop};
550
+ --emw-skeleton-text-margin-left: ${this.stylingValue.marginLeft};
551
+ --emw-skeleton-text-margin-right: ${this.stylingValue.marginRight};
464
552
  }
465
553
  `;
466
554
  break;
467
555
  case 'rectangle':
468
556
  styleBlock = `
469
557
  :host {
470
- --emw-skeleton-rectangle-width: ${this.width};
471
- --emw-skeleton-rectangle-height: ${this.height};
472
- --emw-skeleton-rectangle-border-radius: ${this.borderRadius}px;
473
- --emw-skeleton-rectangle-margin-bottom: ${this.marginBottom}px;
474
- --emw-skeleton-rectangle-margin-top: ${this.marginTop}px;
475
- --emw-skeleton-rectangle-margin-left: ${this.marginLeft}px;
476
- --emw-skeleton-rectangle-margin-right: ${this.marginRight}px;
477
- --emw-skeleton-rectangle-background: ${this.color};
478
- --emw-skeleton-primary-color: ${this.primaryColor};
479
- --emw-skeleton-secondary-color: ${this.secondaryColor};
558
+ --emw-skeleton-rectangle-width: ${this.stylingValue.width};
559
+ --emw-skeleton-rectangle-height: ${this.stylingValue.height};
560
+ --emw-skeleton-rectangle-border-radius: ${this.stylingValue.borderRadius};
561
+ --emw-skeleton-rectangle-margin-bottom: ${this.stylingValue.marginBottom};
562
+ --emw-skeleton-rectangle-margin-top: ${this.stylingValue.marginTop};
563
+ --emw-skeleton-rectangle-margin-left: ${this.stylingValue.marginLeft};
564
+ --emw-skeleton-rectangle-margin-right: ${this.stylingValue.marginRight};
480
565
  }
481
566
  `;
482
567
  break;
483
568
  case 'circle':
484
569
  styleBlock = `
485
570
  :host {
486
- --emw-skeleton-circle-size: ${this.size};
487
- --emw-skeleton-circle-background: ${this.color};
488
- --emw-skeleton-primary-color: ${this.primaryColor};
489
- --emw-skeleton-secondary-color: ${this.secondaryColor};
571
+ --emw-skeleton-circle-size: ${this.stylingValue.size};
490
572
  }
491
573
  `;
492
574
  break;
493
575
  default:
494
576
  styleBlock = '';
495
577
  }
496
- return (h(Host, { key: '3bb792a149db7fe732d5cbfa092cdb4d6ca0689e' }, h("style", { key: 'a4607599b60659f385ae2660513e38b383739674' }, styleBlock), this.handleStructure(this.structure)));
578
+ return (h(Host, { key: 'e6b885bfd985ce7663d990756fe9101e25eb97f0' }, h("style", { key: '06ae24c7bb74f4dacfc12ae58085333f9dc89da5' }, styleBlock), this.handleStructure(this.structure)));
497
579
  }
498
580
  static get watchers() { return {
499
581
  "structure": ["handleStructureChange"]
@@ -16,5 +16,5 @@ var patchBrowser = () => {
16
16
 
17
17
  patchBrowser().then(async (options) => {
18
18
  await globalScripts();
19
- return bootstrapLazy([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
19
+ return bootstrapLazy([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
20
20
  });
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await globalScripts();
8
- return bootstrapLazy([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
8
+ return bootstrapLazy([["casino-engagement-suite-progress-bar_8",[[1,"casino-engagement-suite-tournament",{"language":[1],"show":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"device":[1],"orientation":[1],"leaderboardsInit":[16],"tipsHideDelay":[514,"tips-hide-delay"],"tab":[32],"locale":[32],"tournamentItem":[32],"tournamentList":[32],"leaderboards":[32],"isDialogOpen":[32],"isShowInfo":[32],"page":[32],"tournamentInDialog":[32],"dialog":[32],"newIdList":[32]},[[8,"message","handleEvent"],[16,"clickToTournamentDetail","handleClickToTournamentDetail"],[16,"joinTournamentEvent","handleJoinTournamentEvent"],[16,"unjoinTournamentConfirmEvent","handleUnjoinTournamentEvent"],[4,"click","handleClickOutside"]],{"newIdList":["checkNewIdList"],"tournamentList":["syncBarState"],"show":["showPropWatcher"]}],[0,"tournament-item",{"tournament":[16],"isNew":[4,"is-new"],"tid":[1],"locale":[32]},[[16,"pendingChangeEvent","onTournamentUpdateEvent"]]],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}],[0,"tournament-timer",{"tournament":[16],"isDetail":[4,"is-detail"],"timeHolder":[32],"timeClock":[32],"lastTimeDiff":[32],"lastProgress":[32]},[[16,"tournamentTimer","containerPageChangeHandler"]]],[0,"tournament-item-title",{"tournament":[16],"locale":[32],"isButtonDisabed":[32]},null,{"tournament":["onTournamentChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
9
9
  };
10
10
 
11
11
  export { defineCustomElements };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everymatrix/casino-engagement-suite-tournament",
3
- "version": "1.69.0",
3
+ "version": "1.69.3",
4
4
  "main": "./dist/index.cjs.js",
5
5
  "module": "./dist/index.js",
6
6
  "es2015": "./dist/esm/index.mjs",