@everymatrix/casino-play-random-game 1.77.5 → 1.77.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/casino-play-random-game/casino-play-random-game_3.entry.js +1 -1
  2. package/dist/cjs/casino-play-random-game_3.cjs.entry.js +6 -35
  3. package/dist/esm/casino-play-random-game_3.entry.js +6 -35
  4. package/package.json +1 -1
package/dist/casino-play-random-game/casino-play-random-game_3.entry.js CHANGED
@@ -1 +1 @@
1
- import{r as n,c as e,h as t,g as i,H as a}from"./index-27b314b8.js";const o={en:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},ro:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},fr:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},hr:{error:"Greška",randomGameLoading:"Učitavanje ...",playRandomGame:"Igraj nasumičnu igru",playNowRandomGame:"Igraj sada",spinRandomGame:"Zavrti"},hu:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},tr:{error:"Hata",randomGameLoading:"Yükleniyor...",playRandomGame:"Rastgele Bir Oyun Oyna",playNowRandomGame:"Şimdi Oyna",spinRandomGame:"DEĞİŞTİR"}},r=n=>new Promise((e=>{fetch(n).then((n=>n.json())).then((n=>{Object.keys(n).forEach((e=>{o[e]||(o[e]={});for(let t in n[e])o[e][t]=n[e][t]})),e(!0)}))})),s=(n,e)=>o[void 0!==e&&e in o?e:"en"][n];function l(n,e){if(n){const t=document.createElement("style");t.innerHTML=e,n.appendChild(t)}}function h(n,e){const t=new URL(e);fetch(t.href).then((n=>n.text())).then((e=>{const t=document.createElement("style");t.innerHTML=e,n&&n.appendChild(t)})).catch((n=>{console.error("There was an error while trying to load client styling from URL",n)}))}const d=class{constructor(t){n(this,t),this.dataLoaded=e(this,"data-loaded",7),this.animation=null,this.selectedGameIndex=null,this.selectedGameEl=null,this.iconVisibility=null,this.shuffle=n=>{let e,t=n.length;for(;0!==t;)e=Math.floor(Math.random()*t),t--,[n[t],n[e]]=[n[e],n[t]];return n},this.endpoint=void 0,this.datasource=void 0,this.language="en",this.specificCategory="",this.iconVisible="",this.iconVisibleOnAnim="",this.launchByGameCard="",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.hasErrors=!1,this.isLoading=!0,this.gamesToShow=void 0,this.selectedGame=null,this.animationDone=!1,this.animationStarted=!1,this.imageLoadingType="lazy",this.detectDistance="200px"}watchEndpoint(n,e){n&&n!=e&&this.endpoint&&this.fetchGameList()}handleNewTranslations(){this.isLoading=!0,r(this.translationUrl).then((()=>{this.isLoading=!1}))}handleIsIconVisible(){this.iconVisibility="true"===this.iconVisible}handleClientStylingChange(n,e){n!=e&&l(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(n,e){n!=e&&this.clientStylingUrl&&h(this.stylingContainer,this.clientStylingUrl)}connectedCallback(){this.handleIsIconVisible()}componentWillLoad(){if(this.translationUrl.length>2&&r(this.translationUrl),this.endpoint&&this.language&&this.datasource)return this.fetchGameList()}componentDidLoad(){"IntersectionObserver"in window&&(this.io=new IntersectionObserver((n=>{n.forEach((n=>{var e;n.isIntersecting&&(this.imageLoadingType="eager",null===(e=this.io)||void 0===e||e.unobserve(n.target))}))}),{root:null,rootMargin:this.detectDistance}),this.io.observe(this.host)),null!=window.emMessageBus?function(n,e){if(window.emMessageBus){const t=document.createElement("style");window.emMessageBus.subscribe(e,(e=>{t.innerHTML=e,n&&n.appendChild(t)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&l(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&h(this.stylingContainer,this.clientStylingUrl))}disconnectedCallback(){var n;null===(n=this.io)||void 0===n||n.disconnect(),this.stylingSubscription&&this.stylingSubscription.unsubscribe()}fetchGameList(){let n=new URL(`${this.endpoint}/v1/casino/games`);return n.searchParams.append("platform",(()=>{let n=window.navigator.userAgent;return n.toLowerCase().match(/android/i)?"Android":n.toLowerCase().match(/iphone/i)?"iPhone":n.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})()),n.searchParams.append("datasource",this.datasource),n.searchParams.append("fields","gId,id,href,thumbnail,name,vendor,launchUrl,subVendor"),n.searchParams.append("expand","vendor"),n.searchParams.append("pagination","offset=0,limit=423"),n.searchParams.append("language",this.language),this.specificCategory&&n.searchParams.append("filter",`categories(id=${this.specificCategory})`),new Promise(((e,t)=>{this.isLoading=!0,fetch(n.href).then((n=>n.json())).then((n=>{this.gamesToShow=this.setUpGames(null==n?void 0:n.items),e(!0)})).catch((n=>{console.error(n),this.hasErrors=!0,t(n)})).finally((()=>{this.isLoading=!1,this.dataLoaded.emit({target:this.host})}))}))}setUpGames(n){const e=this.shuffle(n).slice(0,40);return e.concat(e)}selectRandomGame(){const n=this.gamesToShow.length/2;this.selectedGameIndex=Math.floor(Math.random()*(n-3)),this.selectedGameIndex+=n,this.selectedGameEl=this.gameContainer.children[this.selectedGameIndex]}playRandomGame(){this.animateGames(),"function"==typeof gtag&&gtag("event","PlayRandomGame",{context:"CasinoPlayRandomGame"})}respin(){this.animateGames(),"function"==typeof gtag&&gtag("event","RespinRandomGame",{context:"CasinoPlayRandomGame"})}animateGames(){this.iconVisibility="true"===this.iconVisibleOnAnim,this.animationStarted=!0,this.animationDone=!1,this.animation&&this.animation.cancel(),this.selectedGameEl&&(this.selectedGameEl.classList.remove("TheRandomGame"),this.selectedGame=null,this.selectedGameIndex=null),this.selectRandomGame();const n=window.getComputedStyle(this.gameContainer).getPropertyValue("gap"),e=parseInt(n,10),t=this.selectedGameEl.offsetWidth;this.animation=this.gameContainer.animate([{transform:"translateX(0px)",scale:1},{scale:.75},{transform:`translateX(-${(t+e)*this.selectedGameIndex+t/2-this.gameContainer.offsetWidth/2}px)`,scale:1}],{duration:3e3,easing:"cubic-bezier(0.5, 0, 0.5, 1.2)",fill:"forwards"}),this.animation.onfinish=()=>{this.animationDone=!0,this.selectedGameEl.classList.add("TheRandomGame"),this.selectedGame=this.gamesToShow[this.selectedGameIndex]}}playGame(){this.selectedGame&&(window.postMessage({type:"PlayRandomGame",gameId:this.selectedGame.id,launchUrl:this.selectedGame.launchUrl,gameName:this.selectedGame.name,subVendor:this.selectedGame.subVendor},window.location.href),"function"==typeof gtag&&gtag("event","OpenRandomGame",{context:"CasinoPlayRandomGame"}))}showGameInfo(){window.postMessage({type:"InfoRandomGame",gameId:this.selectedGame.id,launchUrl:this.selectedGame.launchUrl,gameName:this.selectedGame.name,subVendor:this.selectedGame.subVendor},window.location.href),"function"==typeof gtag&&gtag("event","OpenRandomGameInfo",{context:"CasinoPlayRandomGame"})}renderGameDetails(){return t("div",{class:"RandomButtonsWrapper"},t("div",{class:"RandomGameDetails"},t("span",{class:"RandomGameTitle"},this.selectedGame.name),t("span",{class:"RandomGameInfo",onClick:()=>this.showGameInfo()},"i")),t("div",{class:"RandomButtons"},t("button",{class:"RandomButton On",onClick:()=>this.respin()},s("spinRandomGame",this.language)),!this.launchByGameCard&&t("button",{class:"RandomButton On",onClick:()=>this.playGame()},s("playNowRandomGame",this.language))))}renderSkeleton(){const n=Array.from({length:5},((n,e)=>t("div",{class:"RandomGameCard",key:e},t("ui-skeleton",{structure:"rectangle",width:"300px",height:"420px",borderRadius:"10px",animation:!0}))));return t("div",{class:"RandomGameWrapper"},t("div",{class:"GameContainerGradient"}),t("div",{class:"GamesContainer"},n))}render(){return t("div",{key:"29fe3535d63177e6d1f30a757bf17b70d89ce386",ref:n=>this.stylingContainer=n},this.hasErrors?t("div",{class:"RandomGameError"},t("div",{class:"Title"},s("error",this.language))):this.isLoading?this.renderSkeleton():t("div",{class:"RandomGameWrapper"},t("div",{class:"GameContainerGradient"}),t("div",{class:"GamesContainer",ref:n=>this.gameContainer=n},this.gamesToShow&&this.gamesToShow.map(((n,e)=>t("div",{class:"RandomGameCard",key:e,onClick:"true"===this.launchByGameCard?()=>this.playGame():void 0},t("div",{class:"RandomGameVendor"},n.vendor.name),t("ui-image",{class:"RandomGameImage",src:n.thumbnail,alt:n.name,title:n.name,loading:this.imageLoadingType}),this.selectedGame&&this.selectedGameIndex===e&&this.renderGameDetails())))),t("div",{class:"ButtonWrapper "+(this.animationDone?"HideAnimation":"")},t("div",{class:"ButtonContainer"},this.iconVisibility&&t("div",{class:"ButtonIcon "+(this.animationStarted?"Flip":"")},t("div",{class:"QustionMark"},"?"),t("div",{class:"HexagonMarkShadow"}),t("div",{class:"HexagonMark"})),!this.animationStarted&&t("div",{class:"RandomButton "+(this.animationStarted?"HideAnimation":""),onClick:()=>this.playRandomGame()},s("playRandomGame",this.language))))))}get host(){return i(this)}static get watchers(){return{endpoint:["watchEndpoint"],datasource:["watchEndpoint"],language:["watchEndpoint"],translationUrl:["handleNewTranslations"],iconVisible:["handleIsIconVisible"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}}};d.style=":host {\n display: block;\n font-family: inherit;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n:host * {\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.RandomGameWrapper {\n width: 100%;\n height: var(--emw--size-4x-medium, 700px);\n background: transparent;\n position: relative;\n overflow: hidden;\n}\n\n.GameContainerGradient {\n position: absolute;\n top: 10%;\n left: -5px;\n width: 100vw;\n height: 80%;\n background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.5) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.5) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);\n pointer-events: none;\n z-index: 1;\n filter: blur(10px);\n}\n\n.GamesContainer {\n display: flex;\n height: var(--emw--size-4x-medium, 600px);\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n align-content: flex-start;\n gap: var(--emw--spacing-large, 20px);\n}\n\n.RandomGameCard {\n position: relative;\n width: var(--emw--size-3x-medium, 300px);\n height: var(--emw--size-4x-medium, 420px);\n border-radius: var(--emw--border-radius-large, 10px);\n top: 8%;\n filter: blur(5px);\n}\n.RandomGameCard .RandomGameVendor {\n position: absolute;\n font-size: var(--emw--font-size-x-small, 12px);\n bottom: var(--emw--spacing-small-minus, 10px);\n left: var(--emw--spacing-small-minus, 10px);\n color: var(--emw--color-typography, #FFFFFF);\n}\n\n.TheRandomGame {\n animation-name: ZoomFadeIn;\n animation-duration: 0.5s;\n animation-fill-mode: forwards;\n -webkit-animation-name: ZoomFadeIn;\n -webkit-animation-duration: 0.5s;\n -webkit-animation-fill-mode: forwards;\n opacity: 1;\n cursor: pointer;\n filter: blur(0);\n}\n\n.RandomGameImage {\n width: inherit;\n height: inherit;\n object-fit: cover;\n border-radius: var(--emw--border-radius-large, 10px);\n}\n\n.RandomGameDetails {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n color: var(--emw--color-typography, #FFFFFF);\n font-size: var(--emw--font-size-small, 14px);\n width: 100%;\n}\n.RandomGameDetails .RandomGameTitle {\n line-height: 18px;\n margin: 5px 0;\n}\n.RandomGameDetails .RandomGameInfo {\n border-radius: 50%;\n width: var(--emw--spacing-medium, 16px);\n height: var(--emw--spacing-medium, 16px);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-normal, 400);\n border: solid 1px var(--emw--color-typography, #FFFFFF);\n text-align: center;\n margin: var(--emw--spacing-2x-small, 4px) 0;\n line-height: 14px;\n cursor: pointer;\n}\n.RandomGameDetails .RandomGamePlay {\n background: var(--emw--color-primary, #4bd004);\n color: var(--emw--color-typography, #FFFFFF);\n border: none;\n border-radius: var(--emw--border-radius-medium, 5px);\n width: 200px;\n height: 40px;\n font-size: var(--emw--font-size-small, 14px);\n cursor: pointer;\n}\n\n.ButtonWrapper {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 20;\n}\n\n.ButtonContainer {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 10px;\n width: 100%;\n position: relative;\n}\n\n.ButtonIcon {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: var(--emw--spacing-2x-small, 5px);\n}\n\n.QustionMark {\n position: absolute;\n font-family: sans-serif;\n font-size: 120px;\n font-weight: 900;\n color: color-mix(in srgb, var(--emw--color-primary, #22B04E) 80%, black 10%);\n text-shadow: 0px 12px 0px color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 50%);\n left: 50%;\n top: -20%;\n transform: translateX(-50%);\n z-index: 10;\n}\n\n.HexagonMarkShadow {\n width: 100px;\n height: 115px;\n display: flex;\n justify-content: center;\n align-items: center;\n background: color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 70%);\n clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);\n}\n\n.HexagonMark {\n position: absolute;\n width: var(--emw--size-medium, 90px);\n height: 105px;\n background: linear-gradient(to bottom, color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 20%) 0%, var(--emw--categories-color-secondary, var(--emw--color-secondary, #eeac4a)) 100%);\n clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);\n}\n\n.RandomButtons {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n gap: var(--emw--spacing-2x-small, 5px);\n width: 100%;\n position: relative;\n z-index: 10;\n}\n\n.RandomButton {\n font-size: var(--emw--font-size-large, 12px);\n text-transform: uppercase;\n width: max-content;\n border-radius: var(--emw--button-border-radius, 10px);\n padding: var(--emw--spacing-large, 20px) var(--emw--spacing-2x-large, 40px);\n border: solid 3px var(--emw--button-border-color, #063B17);\n color: var(--emw--button-text-color, #FFFFFF);\n opacity: 1;\n animation: ButtonEffect 3s linear infinite;\n background-image: linear-gradient(to right, var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E), black 30%), var(--emw--color-primary, #22B04E));\n background-size: 300% 100%;\n cursor: pointer;\n position: relative;\n z-index: 10;\n}\n.RandomButton:hover {\n opacity: 0.8;\n}\n\n.HideAnimation {\n filter: blur(5px);\n animation: AnimateButton 0.2s forwards;\n}\n\n.Flip {\n animation-name: Flip, Blur;\n animation-duration: 0.75s, 3s;\n animation-iteration-count: infinite, 1;\n -webkit-animation-name: Flip, Blur;\n -webkit-animation-duration: 0.75s, 3s;\n -webkit-animation-iteration-count: infinite, 1;\n}\n\n@keyframes ButtonEffect {\n 0% {\n background-position: 0% 50%;\n }\n 33% {\n background-position: 100% 50%;\n }\n 66% {\n background-position: 200% 50%;\n }\n 100% {\n background-position: 300% 50%;\n }\n}\n@keyframes ZoomFadeIn {\n 0% {\n transform: scale(0.2) translateY(0);\n filter: blur(5px);\n opacity: 0.3;\n }\n 50% {\n transform: scale(1.1) translateY(-30px);\n filter: blur(2px);\n opacity: 0.7;\n }\n 100% {\n transform: scale(1) translateY(-30px);\n filter: blur(0px);\n opacity: 1;\n }\n}\n@keyframes AnimateButton {\n 0% {\n opacity: 0.7;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 0;\n display: none;\n }\n}\n@keyframes Flip {\n 0% {\n transform: rotateY(0deg);\n }\n 50% {\n transform: rotateY(180deg);\n }\n 100% {\n transform: rotateY(360deg);\n }\n}\n@keyframes Blur {\n 0% {\n filter: blur(0);\n }\n 50% {\n filter: blur(1px);\n }\n 100% {\n filter: blur(3px);\n }\n}\n@media screen and (max-width: 480px) {\n .RandomButtons .RandomButton {\n font-size: var(--emw--font-size-medium, 12px);\n }\n}\n@container (max-width: 475px) {\n .GamesContainer {\n height: inherit;\n gap: var(--emw--spacing-2x-small, 5px);\n }\n .RandomGameWrapper {\n width: 100%;\n height: 300px;\n overflow: hidden;\n background: transparent;\n position: relative;\n }\n .GameContainerGradient {\n position: absolute;\n top: 10%;\n left: -5px;\n width: 100vw;\n height: 80%;\n background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.2) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.2) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);\n pointer-events: none;\n z-index: 1;\n filter: blur(5px);\n }\n .RandomGameCard {\n width: 100px;\n height: 150px;\n top: 0%;\n border-radius: var(--emw--border-radius-medium, 4px);\n filter: blur(5px);\n }\n .RandomGameImage {\n width: 102px;\n height: inherit;\n top: 0%;\n }\n .RandomGameDetails {\n font-size: 14px;\n width: 100%;\n }\n .RandomGameDetails .RandomGameTitle {\n margin: 5px 0;\n line-height: 18px;\n width: 75%;\n }\n .RandomGameDetails .RandomGameInfo {\n border-radius: 50%;\n width: 16px;\n height: 16px;\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n }\n .RandomGameDetails .RandomGamePlay {\n background: var(--emw--color-primary, #52d004);\n color: var(--emw--color-typography, #FFFFFF);\n border: none;\n border-radius: 5px;\n width: 200px;\n height: 40px;\n font-size: 14px;\n cursor: pointer;\n }\n .RandomGameCard .RandomGameVendor {\n font-size: var(--emw--font-size-x-small, 12px);\n bottom: 5px;\n right: 5px;\n }\n .RandomButtons {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 5px;\n width: 100%;\n }\n .RandomButton {\n font-size: var(--emw--font-size-x-small, 12px);\n padding: 10px 15px;\n border: solid 1px var(--emw--button-border-color, #063B17);\n }\n .QustionMark {\n font-size: 100px;\n font-weight: 700;\n }\n .HexagonMarkShadow {\n width: 80px;\n height: 95px;\n }\n .HexagonMark {\n width: 70px;\n height: 85px;\n }\n}";const m=class{constructor(e){n(this,e),this.hasStarted=!1,this.src=void 0,this.width=void 0,this.height=void 0,this.alt=void 0,this.styles=void 0,this.detectDistance="200px",this.loading="lazy",this.imgLoaded=!1}onSrcChange(){"eager"!==this.loading&&(this.imgLoaded=!1,this.hasStarted=!1,"undefined"!=typeof window&&"IntersectionObserver"in window||this.beginLoad())}onLoadingChange(n,e){n!==e&&(this.cleanupObserver(),this.detachImgHandlers(),"eager"===n?(this.imgEl&&this.src&&(this.imgEl.src=this.src),this.hasStarted=!0):(this.imgLoaded=!1,this.hasStarted=!1,this.setupObserver()))}componentDidLoad(){"eager"!==this.loading&&this.setupObserver()}disconnectedCallback(){this.cleanupObserver(),this.detachImgHandlers()}canUseIO(){return"undefined"!=typeof window&&"IntersectionObserver"in window}setupObserver(){"eager"!==this.loading&&(this.canUseIO()?(this.io=new IntersectionObserver((n=>{var e;for(const t of n)if(t.isIntersecting){this.beginLoad(),null===(e=this.io)||void 0===e||e.unobserve(t.target),this.cleanupObserver();break}}),{root:null,rootMargin:this.detectDistance,threshold:0}),this.io.observe(this.el)):this.beginLoad())}cleanupObserver(){var n;null===(n=this.io)||void 0===n||n.disconnect(),this.io=void 0}wireOnceHandlers(){this.imgEl&&(this.detachImgHandlers(),this._onLoad=()=>{var n;this.currentSrc&&(null===(n=this.imgEl)||void 0===n?void 0:n.currentSrc)&&!this.imgEl.currentSrc.includes(this.currentSrc)||(this.imgLoaded=!0)},this._onError=()=>{console.error("Load image failed:",this.src)},this.imgEl.addEventListener("load",this._onLoad,{once:!0}),this.imgEl.addEventListener("error",this._onError,{once:!0}))}detachImgHandlers(){this.imgEl&&(this._onLoad&&this.imgEl.removeEventListener("load",this._onLoad),this._onError&&this.imgEl.removeEventListener("error",this._onError),this._onLoad=void 0,this._onError=void 0)}beginLoad(){this.hasStarted||this.imgEl&&this.src&&(this.hasStarted=!0,this.wireOnceHandlers(),this.imgEl.complete&&this.imgEl.naturalWidth>0?this.imgLoaded=!0:(this.currentSrc=this.src,this.imgEl.src=this.src,this.imgEl.complete&&this.imgEl.naturalWidth>0&&(this.imgLoaded=!0)))}get showSkeleton(){return"eager"!==this.loading&&!this.imgLoaded}renderEager(){return t(a,{class:"HostContainer"},t("img",{src:this.src,decoding:"async",style:this.styles,class:"UiContainer Visible",alt:this.alt,width:this.width,height:this.height,loading:"eager"}))}renderLazy(){return t(a,{class:"HostContainer","aria-busy":this.imgLoaded?"false":"true"},this.showSkeleton&&t("ui-skeleton",{class:"UiContainer",structure:"image",width:"100%",height:"100%"}),t("img",{ref:n=>this.imgEl=n,src:void 0,decoding:"async",style:this.styles,class:"UiContainer "+(this.imgLoaded?"Visible":"Hidden"),alt:this.alt,width:this.width,height:this.height,loading:"lazy"}))}render(){return"eager"===this.loading?this.renderEager():this.renderLazy()}get el(){return i(this)}static get watchers(){return{src:["onSrcChange"],loading:["onLoadingChange"]}}};m.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 c=class{constructor(e){n(this,e),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(n,e){e!==n&&this.handleStructure(n)}handleStylingProps(n){switch(typeof n){case"number":return 0===n?0:`${n}px`;case"undefined":default:return"unset";case"string":return["auto","unset","none","inherit","initial"].includes(n)||n.endsWith("px")||n.endsWith("%")?n:"unset"}}handleStructure(n){switch(n){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(((n,e)=>t("div",{key:e,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 n="";switch(this.structure){case"logo":n=`\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":n=`\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":n=`\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":n=`\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":n=`\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":n=`\n :host {\n --emw-skeleton-circle-size: ${this.stylingValue.size};\n }\n `;break;default:n=""}return t(a,{key:"e6b885bfd985ce7663d990756fe9101e25eb97f0"},t("style",{key:"06ae24c7bb74f4dacfc12ae58085333f9dc89da5"},n),this.handleStructure(this.structure))}static get watchers(){return{structure:["handleStructureChange"]}}};c.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{d as casino_play_random_game,m as ui_image,c as ui_skeleton}
1
+ import{r as n,c as e,h as t,g as i,H as a}from"./index-27b314b8.js";const o={en:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},ro:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},fr:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},hr:{error:"Greška",randomGameLoading:"Učitavanje ...",playRandomGame:"Igraj nasumičnu igru",playNowRandomGame:"Igraj sada",spinRandomGame:"Zavrti"},hu:{error:"Error",randomGameLoading:"Loading ...",playRandomGame:"Play a random game",playNowRandomGame:"Play now",spinRandomGame:"Spin"},tr:{error:"Hata",randomGameLoading:"Yükleniyor...",playRandomGame:"Rastgele Bir Oyun Oyna",playNowRandomGame:"Şimdi Oyna",spinRandomGame:"DEĞİŞTİR"}},r=n=>new Promise((e=>{fetch(n).then((n=>n.json())).then((n=>{Object.keys(n).forEach((e=>{o[e]||(o[e]={});for(let t in n[e])o[e][t]=n[e][t]})),e(!0)}))})),s=(n,e)=>o[void 0!==e&&e in o?e:"en"][n];function l(n,e){if(n){const t=document.createElement("style");t.innerHTML=e,n.appendChild(t)}}function h(n,e){const t=new URL(e);fetch(t.href).then((n=>n.text())).then((e=>{const t=document.createElement("style");t.innerHTML=e,n&&n.appendChild(t)})).catch((n=>{console.error("There was an error while trying to load client styling from URL",n)}))}const d=class{constructor(t){n(this,t),this.dataLoaded=e(this,"data-loaded",7),this.animation=null,this.selectedGameIndex=null,this.selectedGameEl=null,this.iconVisibility=null,this.shuffle=n=>{let e,t=n.length;for(;0!==t;)e=Math.floor(Math.random()*t),t--,[n[t],n[e]]=[n[e],n[t]];return n},this.endpoint=void 0,this.datasource=void 0,this.language="en",this.specificCategory="",this.iconVisible="",this.iconVisibleOnAnim="",this.launchByGameCard="",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.hasErrors=!1,this.isLoading=!0,this.gamesToShow=void 0,this.selectedGame=null,this.animationDone=!1,this.animationStarted=!1,this.imageLoadingType="lazy",this.detectDistance="200px"}watchEndpoint(n,e){n&&n!=e&&this.endpoint&&this.fetchGameList()}handleNewTranslations(){this.isLoading=!0,r(this.translationUrl).then((()=>{this.isLoading=!1}))}handleIsIconVisible(){this.iconVisibility="true"===this.iconVisible}handleClientStylingChange(n,e){n!=e&&l(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(n,e){n!=e&&this.clientStylingUrl&&h(this.stylingContainer,this.clientStylingUrl)}connectedCallback(){this.handleIsIconVisible()}componentWillLoad(){if(this.translationUrl.length>2&&r(this.translationUrl),this.endpoint&&this.language&&this.datasource)return this.fetchGameList()}componentDidLoad(){"IntersectionObserver"in window&&(this.io=new IntersectionObserver((n=>{n.forEach((n=>{var e;n.isIntersecting&&(this.imageLoadingType="eager",null===(e=this.io)||void 0===e||e.unobserve(n.target))}))}),{root:null,rootMargin:this.detectDistance}),this.io.observe(this.host)),null!=window.emMessageBus?function(n,e){if(window.emMessageBus){const t=document.createElement("style");window.emMessageBus.subscribe(e,(e=>{t.innerHTML=e,n&&n.appendChild(t)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&l(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&h(this.stylingContainer,this.clientStylingUrl))}disconnectedCallback(){var n;null===(n=this.io)||void 0===n||n.disconnect(),this.stylingSubscription&&this.stylingSubscription.unsubscribe()}fetchGameList(){let n=new URL(`${this.endpoint}/v1/casino/games`);return n.searchParams.append("platform",(()=>{let n=window.navigator.userAgent;return n.toLowerCase().match(/android/i)?"Android":n.toLowerCase().match(/iphone/i)?"iPhone":n.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})()),n.searchParams.append("datasource",this.datasource),n.searchParams.append("fields","gId,id,href,thumbnail,name,vendor,launchUrl,subVendor"),n.searchParams.append("expand","vendor"),n.searchParams.append("pagination","offset=0,limit=423"),n.searchParams.append("language",this.language),this.specificCategory&&n.searchParams.append("filter",`categories(id=${this.specificCategory})`),new Promise(((e,t)=>{this.isLoading=!0,fetch(n.href).then((n=>n.json())).then((n=>{this.gamesToShow=this.setUpGames(null==n?void 0:n.items),e(!0)})).catch((n=>{console.error(n),this.hasErrors=!0,t(n)})).finally((()=>{this.isLoading=!1,this.dataLoaded.emit({target:this.host})}))}))}setUpGames(n){const e=this.shuffle(n).slice(0,40);return e.concat(e)}selectRandomGame(){const n=this.gamesToShow.length/2;this.selectedGameIndex=Math.floor(Math.random()*(n-3)),this.selectedGameIndex+=n,this.selectedGameEl=this.gameContainer.children[this.selectedGameIndex]}playRandomGame(){this.animateGames(),"function"==typeof gtag&&gtag("event","PlayRandomGame",{context:"CasinoPlayRandomGame"})}respin(){this.animateGames(),"function"==typeof gtag&&gtag("event","RespinRandomGame",{context:"CasinoPlayRandomGame"})}animateGames(){this.iconVisibility="true"===this.iconVisibleOnAnim,this.animationStarted=!0,this.animationDone=!1,this.animation&&this.animation.cancel(),this.selectedGameEl&&(this.selectedGameEl.classList.remove("TheRandomGame"),this.selectedGame=null,this.selectedGameIndex=null),this.selectRandomGame();const n=window.getComputedStyle(this.gameContainer).getPropertyValue("gap"),e=parseInt(n,10),t=this.selectedGameEl.offsetWidth;this.animation=this.gameContainer.animate([{transform:"translateX(0px)",scale:1},{scale:.75},{transform:`translateX(-${(t+e)*this.selectedGameIndex+t/2-this.gameContainer.offsetWidth/2}px)`,scale:1}],{duration:3e3,easing:"cubic-bezier(0.5, 0, 0.5, 1.2)",fill:"forwards"}),this.animation.onfinish=()=>{this.animationDone=!0,this.selectedGameEl.classList.add("TheRandomGame"),this.selectedGame=this.gamesToShow[this.selectedGameIndex]}}playGame(){this.selectedGame&&(window.postMessage({type:"PlayRandomGame",gameId:this.selectedGame.id,launchUrl:this.selectedGame.launchUrl,gameName:this.selectedGame.name,subVendor:this.selectedGame.subVendor},window.location.href),"function"==typeof gtag&&gtag("event","OpenRandomGame",{context:"CasinoPlayRandomGame"}))}showGameInfo(){window.postMessage({type:"InfoRandomGame",gameId:this.selectedGame.id,launchUrl:this.selectedGame.launchUrl,gameName:this.selectedGame.name,subVendor:this.selectedGame.subVendor},window.location.href),"function"==typeof gtag&&gtag("event","OpenRandomGameInfo",{context:"CasinoPlayRandomGame"})}renderGameDetails(){return t("div",{class:"RandomButtonsWrapper"},t("div",{class:"RandomGameDetails"},t("span",{class:"RandomGameTitle"},this.selectedGame.name),t("span",{class:"RandomGameInfo",onClick:()=>this.showGameInfo()},"i")),t("div",{class:"RandomButtons"},t("button",{class:"RandomButton On",onClick:()=>this.respin()},s("spinRandomGame",this.language)),!this.launchByGameCard&&t("button",{class:"RandomButton On",onClick:()=>this.playGame()},s("playNowRandomGame",this.language))))}renderSkeleton(){const n=Array.from({length:5},((n,e)=>t("div",{class:"RandomGameCard",key:e},t("ui-skeleton",{structure:"rectangle",width:"300px",height:"420px",borderRadius:"10px",animation:!0}))));return t("div",{class:"RandomGameWrapper"},t("div",{class:"GameContainerGradient"}),t("div",{class:"GamesContainer"},n))}render(){return t("div",{key:"29fe3535d63177e6d1f30a757bf17b70d89ce386",ref:n=>this.stylingContainer=n},this.hasErrors?t("div",{class:"RandomGameError"},t("div",{class:"Title"},s("error",this.language))):this.isLoading?this.renderSkeleton():t("div",{class:"RandomGameWrapper"},t("div",{class:"GameContainerGradient"}),t("div",{class:"GamesContainer",ref:n=>this.gameContainer=n},this.gamesToShow&&this.gamesToShow.map(((n,e)=>t("div",{class:"RandomGameCard",key:e,onClick:"true"===this.launchByGameCard?()=>this.playGame():void 0},t("div",{class:"RandomGameVendor"},n.vendor.name),t("ui-image",{class:"RandomGameImage",src:n.thumbnail,alt:n.name,title:n.name,loading:this.imageLoadingType}),this.selectedGame&&this.selectedGameIndex===e&&this.renderGameDetails())))),t("div",{class:"ButtonWrapper "+(this.animationDone?"HideAnimation":"")},t("div",{class:"ButtonContainer"},this.iconVisibility&&t("div",{class:"ButtonIcon "+(this.animationStarted?"Flip":"")},t("div",{class:"QustionMark"},"?"),t("div",{class:"HexagonMarkShadow"}),t("div",{class:"HexagonMark"})),!this.animationStarted&&t("div",{class:"RandomButton "+(this.animationStarted?"HideAnimation":""),onClick:()=>this.playRandomGame()},s("playRandomGame",this.language))))))}get host(){return i(this)}static get watchers(){return{endpoint:["watchEndpoint"],datasource:["watchEndpoint"],language:["watchEndpoint"],translationUrl:["handleNewTranslations"],iconVisible:["handleIsIconVisible"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}}};d.style=":host {\n display: block;\n font-family: inherit;\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n:host * {\n -webkit-transform: translate3d(0, 0, 0);\n transform: translate3d(0, 0, 0);\n}\n\n.RandomGameWrapper {\n width: 100%;\n height: var(--emw--size-4x-medium, 700px);\n background: transparent;\n position: relative;\n overflow: hidden;\n}\n\n.GameContainerGradient {\n position: absolute;\n top: 10%;\n left: -5px;\n width: 100vw;\n height: 80%;\n background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.5) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.5) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);\n pointer-events: none;\n z-index: 1;\n filter: blur(10px);\n}\n\n.GamesContainer {\n display: flex;\n height: var(--emw--size-4x-medium, 600px);\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n align-content: flex-start;\n gap: var(--emw--spacing-large, 20px);\n}\n\n.RandomGameCard {\n position: relative;\n width: var(--emw--size-3x-medium, 300px);\n height: var(--emw--size-4x-medium, 420px);\n border-radius: var(--emw--border-radius-large, 10px);\n top: 8%;\n filter: blur(5px);\n}\n.RandomGameCard .RandomGameVendor {\n position: absolute;\n font-size: var(--emw--font-size-x-small, 12px);\n bottom: var(--emw--spacing-small-minus, 10px);\n left: var(--emw--spacing-small-minus, 10px);\n color: var(--emw--color-typography, #FFFFFF);\n}\n\n.TheRandomGame {\n animation-name: ZoomFadeIn;\n animation-duration: 0.5s;\n animation-fill-mode: forwards;\n -webkit-animation-name: ZoomFadeIn;\n -webkit-animation-duration: 0.5s;\n -webkit-animation-fill-mode: forwards;\n opacity: 1;\n cursor: pointer;\n filter: blur(0);\n}\n\n.RandomGameImage {\n width: inherit;\n height: inherit;\n object-fit: cover;\n border-radius: var(--emw--border-radius-large, 10px);\n}\n\n.RandomGameDetails {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n color: var(--emw--color-typography, #FFFFFF);\n font-size: var(--emw--font-size-small, 14px);\n width: 100%;\n}\n.RandomGameDetails .RandomGameTitle {\n line-height: 18px;\n margin: 5px 0;\n}\n.RandomGameDetails .RandomGameInfo {\n border-radius: 50%;\n width: var(--emw--spacing-medium, 16px);\n height: var(--emw--spacing-medium, 16px);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-normal, 400);\n border: solid 1px var(--emw--color-typography, #FFFFFF);\n text-align: center;\n margin: var(--emw--spacing-2x-small, 4px) 0;\n line-height: 14px;\n cursor: pointer;\n}\n.RandomGameDetails .RandomGamePlay {\n background: var(--emw--color-primary, #4bd004);\n color: var(--emw--color-typography, #FFFFFF);\n border: none;\n border-radius: var(--emw--border-radius-medium, 5px);\n width: 200px;\n height: 40px;\n font-size: var(--emw--font-size-small, 14px);\n cursor: pointer;\n}\n\n.ButtonWrapper {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 20;\n}\n\n.ButtonContainer {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 10px;\n width: 100%;\n position: relative;\n}\n\n.ButtonIcon {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: var(--emw--spacing-2x-small, 5px);\n}\n\n.QustionMark {\n position: absolute;\n font-family: sans-serif;\n font-size: 120px;\n font-weight: 900;\n color: color-mix(in srgb, var(--emw--color-primary, #22B04E) 80%, black 10%);\n text-shadow: 0px 12px 0px color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 50%);\n left: 50%;\n top: -20%;\n transform: translateX(-50%);\n z-index: 10;\n}\n\n.HexagonMarkShadow {\n width: 100px;\n height: 115px;\n display: flex;\n justify-content: center;\n align-items: center;\n background: color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 70%);\n clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);\n}\n\n.HexagonMark {\n position: absolute;\n width: var(--emw--size-medium, 90px);\n height: 105px;\n background: linear-gradient(to bottom, color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 20%) 0%, var(--emw--categories-color-secondary, var(--emw--color-secondary, #eeac4a)) 100%);\n clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);\n}\n\n.RandomButtons {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n gap: var(--emw--spacing-2x-small, 5px);\n width: 100%;\n position: relative;\n z-index: 10;\n}\n\n.RandomButton {\n font-size: var(--emw--font-size-large, 12px);\n text-transform: uppercase;\n width: max-content;\n border-radius: var(--emw--button-border-radius, 10px);\n padding: var(--emw--spacing-large, 20px) var(--emw--spacing-2x-large, 40px);\n border: solid 3px var(--emw--button-border-color, #063B17);\n color: var(--emw--button-text-color, #FFFFFF);\n opacity: 1;\n animation: ButtonEffect 3s linear infinite;\n background-image: linear-gradient(to right, var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E), black 30%), var(--emw--color-primary, #22B04E));\n background-size: 300% 100%;\n cursor: pointer;\n position: relative;\n z-index: 10;\n}\n.RandomButton:hover {\n opacity: 0.8;\n}\n\n.HideAnimation {\n filter: blur(5px);\n animation: AnimateButton 0.2s forwards;\n}\n\n.Flip {\n animation-name: Flip, Blur;\n animation-duration: 0.75s, 3s;\n animation-iteration-count: infinite, 1;\n -webkit-animation-name: Flip, Blur;\n -webkit-animation-duration: 0.75s, 3s;\n -webkit-animation-iteration-count: infinite, 1;\n}\n\n@keyframes ButtonEffect {\n 0% {\n background-position: 0% 50%;\n }\n 33% {\n background-position: 100% 50%;\n }\n 66% {\n background-position: 200% 50%;\n }\n 100% {\n background-position: 300% 50%;\n }\n}\n@keyframes ZoomFadeIn {\n 0% {\n transform: scale(0.2) translateY(0);\n filter: blur(5px);\n opacity: 0.3;\n }\n 50% {\n transform: scale(1.1) translateY(-30px);\n filter: blur(2px);\n opacity: 0.7;\n }\n 100% {\n transform: scale(1) translateY(-30px);\n filter: blur(0px);\n opacity: 1;\n }\n}\n@keyframes AnimateButton {\n 0% {\n opacity: 0.7;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 0;\n display: none;\n }\n}\n@keyframes Flip {\n 0% {\n transform: rotateY(0deg);\n }\n 50% {\n transform: rotateY(180deg);\n }\n 100% {\n transform: rotateY(360deg);\n }\n}\n@keyframes Blur {\n 0% {\n filter: blur(0);\n }\n 50% {\n filter: blur(1px);\n }\n 100% {\n filter: blur(3px);\n }\n}\n@media screen and (max-width: 480px) {\n .RandomButtons .RandomButton {\n font-size: var(--emw--font-size-medium, 12px);\n }\n}\n@container (max-width: 475px) {\n .GamesContainer {\n height: inherit;\n gap: var(--emw--spacing-2x-small, 5px);\n }\n .RandomGameWrapper {\n width: 100%;\n height: 300px;\n overflow: hidden;\n background: transparent;\n position: relative;\n }\n .GameContainerGradient {\n position: absolute;\n top: 10%;\n left: -5px;\n width: 100vw;\n height: 80%;\n background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.2) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.2) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);\n pointer-events: none;\n z-index: 1;\n filter: blur(5px);\n }\n .RandomGameCard {\n width: 100px;\n height: 150px;\n top: 0%;\n border-radius: var(--emw--border-radius-medium, 4px);\n filter: blur(5px);\n }\n .RandomGameImage {\n width: 102px;\n height: inherit;\n top: 0%;\n }\n .RandomGameDetails {\n font-size: 14px;\n width: 100%;\n }\n .RandomGameDetails .RandomGameTitle {\n margin: 5px 0;\n line-height: 18px;\n width: 75%;\n }\n .RandomGameDetails .RandomGameInfo {\n border-radius: 50%;\n width: 16px;\n height: 16px;\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n }\n .RandomGameDetails .RandomGamePlay {\n background: var(--emw--color-primary, #52d004);\n color: var(--emw--color-typography, #FFFFFF);\n border: none;\n border-radius: 5px;\n width: 200px;\n height: 40px;\n font-size: 14px;\n cursor: pointer;\n }\n .RandomGameCard .RandomGameVendor {\n font-size: var(--emw--font-size-x-small, 12px);\n bottom: 5px;\n right: 5px;\n }\n .RandomButtons {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 5px;\n width: 100%;\n }\n .RandomButton {\n font-size: var(--emw--font-size-x-small, 12px);\n padding: 10px 15px;\n border: solid 1px var(--emw--button-border-color, #063B17);\n }\n .QustionMark {\n font-size: 100px;\n font-weight: 700;\n }\n .HexagonMarkShadow {\n width: 80px;\n height: 95px;\n }\n .HexagonMark {\n width: 70px;\n height: 85px;\n }\n}";const m=class{constructor(e){n(this,e),this.hasStarted=!1,this._onLoad=()=>{this.imgLoaded=!0},this.src=void 0,this.width=void 0,this.height=void 0,this.alt=void 0,this.styles=void 0,this.detectDistance="200px",this.loading="lazy",this.imgLoaded=!1}onSrcChange(){"eager"!==this.loading&&(this.imgLoaded=!1,this.hasStarted=!1,"undefined"!=typeof window&&"IntersectionObserver"in window||this.beginLoad())}onLoadingChange(n,e){n!==e&&(this.cleanupObserver(),"eager"===n?(this.imgEl&&this.src&&(this.imgEl.src=this.src),this.hasStarted=!0):(this.imgLoaded=!1,this.hasStarted=!1,this.setupObserver()))}componentDidLoad(){"eager"!==this.loading&&this.setupObserver()}disconnectedCallback(){this.cleanupObserver(),this.imgEl&&(this.imgEl.src="")}canUseIO(){return"undefined"!=typeof window&&"IntersectionObserver"in window}setupObserver(){"eager"!==this.loading&&(this.canUseIO()?(this.io=new IntersectionObserver((n=>{var e;for(const t of n)if(t.isIntersecting){this.beginLoad(),null===(e=this.io)||void 0===e||e.unobserve(t.target),this.cleanupObserver();break}}),{root:null,rootMargin:this.detectDistance,threshold:0}),this.io.observe(this.el)):this.beginLoad())}cleanupObserver(){var n;null===(n=this.io)||void 0===n||n.disconnect(),this.io=void 0}beginLoad(){this.hasStarted||this.imgEl&&this.src&&(this.hasStarted=!0,this.imgEl.src=this.src,this.imgEl.complete&&this.imgEl.naturalWidth>0&&(this.imgLoaded=!0))}get showSkeleton(){return"eager"!==this.loading&&!this.imgLoaded}renderEager(){return t(a,{class:"HostContainer"},t("img",{src:this.src,decoding:"async",style:this.styles,class:"UiContainer Visible",alt:this.alt,width:this.width,height:this.height,loading:"eager"}))}renderLazy(){return t(a,{class:"HostContainer","aria-busy":this.imgLoaded?"false":"true"},this.showSkeleton&&t("ui-skeleton",{class:"UiContainer",structure:"image",width:"100%",height:"100%"}),t("img",{ref:n=>this.imgEl=n,src:void 0,decoding:"async",style:this.styles,onLoad:this._onLoad,class:"UiContainer "+(this.imgLoaded?"Visible":"Hidden"),alt:this.alt,width:this.width,height:this.height,loading:"lazy"}))}render(){return"eager"===this.loading?this.renderEager():this.renderLazy()}get el(){return i(this)}static get watchers(){return{src:["onSrcChange"],loading:["onLoadingChange"]}}};m.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 c=class{constructor(e){n(this,e),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(n,e){e!==n&&this.handleStructure(n)}handleStylingProps(n){switch(typeof n){case"number":return 0===n?0:`${n}px`;case"undefined":default:return"unset";case"string":return["auto","unset","none","inherit","initial"].includes(n)||n.endsWith("px")||n.endsWith("%")?n:"unset"}}handleStructure(n){switch(n){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(((n,e)=>t("div",{key:e,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 n="";switch(this.structure){case"logo":n=`\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":n=`\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":n=`\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":n=`\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":n=`\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":n=`\n :host {\n --emw-skeleton-circle-size: ${this.stylingValue.size};\n }\n `;break;default:n=""}return t(a,{key:"e6b885bfd985ce7663d990756fe9101e25eb97f0"},t("style",{key:"06ae24c7bb74f4dacfc12ae58085333f9dc89da5"},n),this.handleStructure(this.structure))}static get watchers(){return{structure:["handleStructureChange"]}}};c.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{d as casino_play_random_game,m as ui_image,c as ui_skeleton}
package/dist/cjs/casino-play-random-game_3.cjs.entry.js CHANGED
@@ -404,6 +404,9 @@ const UiImage = class {
404
404
  constructor(hostRef) {
405
405
  index.registerInstance(this, hostRef);
406
406
  this.hasStarted = false;
407
+ this._onLoad = () => {
408
+ this.imgLoaded = true;
409
+ };
407
410
  this.src = undefined;
408
411
  this.width = undefined;
409
412
  this.height = undefined;
@@ -426,7 +429,6 @@ const UiImage = class {
426
429
  if (newVal === oldVal)
427
430
  return;
428
431
  this.cleanupObserver();
429
- this.detachImgHandlers();
430
432
  if (newVal === 'eager') {
431
433
  if (this.imgEl && this.src) {
432
434
  this.imgEl.src = this.src;
@@ -446,7 +448,8 @@ const UiImage = class {
446
448
  }
447
449
  disconnectedCallback() {
448
450
  this.cleanupObserver();
449
- this.detachImgHandlers();
451
+ if (this.imgEl)
452
+ this.imgEl.src = '';
450
453
  }
451
454
  canUseIO() {
452
455
  return typeof window !== 'undefined' && 'IntersectionObserver' in window;
@@ -476,32 +479,6 @@ const UiImage = class {
476
479
  (_a = this.io) === null || _a === void 0 ? void 0 : _a.disconnect();
477
480
  this.io = undefined;
478
481
  }
479
- wireOnceHandlers() {
480
- if (!this.imgEl)
481
- return;
482
- this.detachImgHandlers();
483
- this._onLoad = () => {
484
- var _a;
485
- if (this.currentSrc && ((_a = this.imgEl) === null || _a === void 0 ? void 0 : _a.currentSrc) && !this.imgEl.currentSrc.includes(this.currentSrc))
486
- return;
487
- this.imgLoaded = true;
488
- };
489
- this._onError = () => {
490
- console.error('Load image failed:', this.src);
491
- };
492
- this.imgEl.addEventListener('load', this._onLoad, { once: true });
493
- this.imgEl.addEventListener('error', this._onError, { once: true });
494
- }
495
- detachImgHandlers() {
496
- if (!this.imgEl)
497
- return;
498
- if (this._onLoad)
499
- this.imgEl.removeEventListener('load', this._onLoad);
500
- if (this._onError)
501
- this.imgEl.removeEventListener('error', this._onError);
502
- this._onLoad = undefined;
503
- this._onError = undefined;
504
- }
505
482
  beginLoad() {
506
483
  if (this.hasStarted)
507
484
  return;
@@ -510,12 +487,6 @@ const UiImage = class {
510
487
  if (!this.src)
511
488
  return;
512
489
  this.hasStarted = true;
513
- this.wireOnceHandlers();
514
- if (this.imgEl.complete && this.imgEl.naturalWidth > 0) {
515
- this.imgLoaded = true;
516
- return;
517
- }
518
- this.currentSrc = this.src;
519
490
  this.imgEl.src = this.src;
520
491
  if (this.imgEl.complete && this.imgEl.naturalWidth > 0) {
521
492
  this.imgLoaded = true;
@@ -528,7 +499,7 @@ const UiImage = class {
528
499
  return (index.h(index.Host, { class: "HostContainer" }, index.h("img", { src: this.src, decoding: "async", style: this.styles, class: "UiContainer Visible", alt: this.alt, width: this.width, height: this.height, loading: "eager" })));
529
500
  }
530
501
  renderLazy() {
531
- return (index.h(index.Host, { class: "HostContainer", "aria-busy": !this.imgLoaded ? 'true' : 'false' }, this.showSkeleton && (index.h("ui-skeleton", { class: "UiContainer", structure: "image", width: "100%", height: "100%" })), index.h("img", { ref: (el) => (this.imgEl = el), src: undefined, decoding: "async", style: this.styles, class: `UiContainer ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" })));
502
+ return (index.h(index.Host, { class: "HostContainer", "aria-busy": !this.imgLoaded ? 'true' : 'false' }, this.showSkeleton && (index.h("ui-skeleton", { class: "UiContainer", structure: "image", width: "100%", height: "100%" })), index.h("img", { ref: (el) => (this.imgEl = el), src: undefined, decoding: "async", style: this.styles, onLoad: this._onLoad, class: `UiContainer ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" })));
532
503
  }
533
504
  render() {
534
505
  return this.loading === 'eager' ? this.renderEager() : this.renderLazy();
package/dist/esm/casino-play-random-game_3.entry.js CHANGED
@@ -400,6 +400,9 @@ const UiImage = class {
400
400
  constructor(hostRef) {
401
401
  registerInstance(this, hostRef);
402
402
  this.hasStarted = false;
403
+ this._onLoad = () => {
404
+ this.imgLoaded = true;
405
+ };
403
406
  this.src = undefined;
404
407
  this.width = undefined;
405
408
  this.height = undefined;
@@ -422,7 +425,6 @@ const UiImage = class {
422
425
  if (newVal === oldVal)
423
426
  return;
424
427
  this.cleanupObserver();
425
- this.detachImgHandlers();
426
428
  if (newVal === 'eager') {
427
429
  if (this.imgEl && this.src) {
428
430
  this.imgEl.src = this.src;
@@ -442,7 +444,8 @@ const UiImage = class {
442
444
  }
443
445
  disconnectedCallback() {
444
446
  this.cleanupObserver();
445
- this.detachImgHandlers();
447
+ if (this.imgEl)
448
+ this.imgEl.src = '';
446
449
  }
447
450
  canUseIO() {
448
451
  return typeof window !== 'undefined' && 'IntersectionObserver' in window;
@@ -472,32 +475,6 @@ const UiImage = class {
472
475
  (_a = this.io) === null || _a === void 0 ? void 0 : _a.disconnect();
473
476
  this.io = undefined;
474
477
  }
475
- wireOnceHandlers() {
476
- if (!this.imgEl)
477
- return;
478
- this.detachImgHandlers();
479
- this._onLoad = () => {
480
- var _a;
481
- if (this.currentSrc && ((_a = this.imgEl) === null || _a === void 0 ? void 0 : _a.currentSrc) && !this.imgEl.currentSrc.includes(this.currentSrc))
482
- return;
483
- this.imgLoaded = true;
484
- };
485
- this._onError = () => {
486
- console.error('Load image failed:', this.src);
487
- };
488
- this.imgEl.addEventListener('load', this._onLoad, { once: true });
489
- this.imgEl.addEventListener('error', this._onError, { once: true });
490
- }
491
- detachImgHandlers() {
492
- if (!this.imgEl)
493
- return;
494
- if (this._onLoad)
495
- this.imgEl.removeEventListener('load', this._onLoad);
496
- if (this._onError)
497
- this.imgEl.removeEventListener('error', this._onError);
498
- this._onLoad = undefined;
499
- this._onError = undefined;
500
- }
501
478
  beginLoad() {
502
479
  if (this.hasStarted)
503
480
  return;
@@ -506,12 +483,6 @@ const UiImage = class {
506
483
  if (!this.src)
507
484
  return;
508
485
  this.hasStarted = true;
509
- this.wireOnceHandlers();
510
- if (this.imgEl.complete && this.imgEl.naturalWidth > 0) {
511
- this.imgLoaded = true;
512
- return;
513
- }
514
- this.currentSrc = this.src;
515
486
  this.imgEl.src = this.src;
516
487
  if (this.imgEl.complete && this.imgEl.naturalWidth > 0) {
517
488
  this.imgLoaded = true;
@@ -524,7 +495,7 @@ const UiImage = class {
524
495
  return (h(Host, { class: "HostContainer" }, h("img", { src: this.src, decoding: "async", style: this.styles, class: "UiContainer Visible", alt: this.alt, width: this.width, height: this.height, loading: "eager" })));
525
496
  }
526
497
  renderLazy() {
527
- return (h(Host, { class: "HostContainer", "aria-busy": !this.imgLoaded ? 'true' : 'false' }, this.showSkeleton && (h("ui-skeleton", { class: "UiContainer", structure: "image", width: "100%", height: "100%" })), h("img", { ref: (el) => (this.imgEl = el), src: undefined, decoding: "async", style: this.styles, class: `UiContainer ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" })));
498
+ return (h(Host, { class: "HostContainer", "aria-busy": !this.imgLoaded ? 'true' : 'false' }, this.showSkeleton && (h("ui-skeleton", { class: "UiContainer", structure: "image", width: "100%", height: "100%" })), h("img", { ref: (el) => (this.imgEl = el), src: undefined, decoding: "async", style: this.styles, onLoad: this._onLoad, class: `UiContainer ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" })));
528
499
  }
529
500
  render() {
530
501
  return this.loading === 'eager' ? this.renderEager() : this.renderLazy();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everymatrix/casino-play-random-game",
3
- "version": "1.77.5",
3
+ "version": "1.77.7",
4
4
  "main": "./dist/index.cjs.js",
5
5
  "module": "./dist/index.js",
6
6
  "es2015": "./dist/esm/index.mjs",