@everymatrix/casino-engagement-suite-bar 1.56.2 → 1.57.0
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.
- package/dist/casino-engagement-suite-bar/casino-engagement-suite-bar.esm.js +1 -1
- package/dist/casino-engagement-suite-bar/p-35253536.entry.js +15 -0
- package/dist/cjs/casino-engagement-suite-bar.cjs.entry.js +2 -2
- package/dist/collection/components/casino-engagement-suite-bar/casino-engagement-suite-bar.js +3 -4
- package/dist/collection/components/casino-engagement-suite-bar/casino-engagement-suite-bar.stories.js +78 -0
- package/dist/esm/casino-engagement-suite-bar.entry.js +2 -2
- package/dist/storybook/main.js +47 -0
- package/dist/storybook/preview.js +9 -0
- package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/casino-engagement-suite-bar/.stencil/libs/common/src/storybook/storybook-utils.d.ts +39 -0
- package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/casino-engagement-suite-bar/.stencil/packages/stencil/casino-engagement-suite-bar/storybook/main.d.ts +3 -0
- package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/casino-engagement-suite-bar/.stencil/packages/stencil/casino-engagement-suite-bar/storybook/preview.d.ts +70 -0
- package/dist/types/components/casino-engagement-suite-bar/casino-engagement-suite-bar.stories.d.ts +5 -0
- package/package.json +1 -1
- package/dist/casino-engagement-suite-bar/p-6880d661.entry.js +0 -15
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as i}from"./p-2ba163e5.js";export{s as setNonce}from"./p-2ba163e5.js";import{g as a}from"./p-e1255160.js";(()=>{const i=import.meta.url,a={};return""!==i&&(a.resourcesUrl=new URL(".",i).href),e(a)})().then((async e=>(await a(),i([["p-
|
|
1
|
+
import{p as e,b as i}from"./p-2ba163e5.js";export{s as setNonce}from"./p-2ba163e5.js";import{g as a}from"./p-e1255160.js";(()=>{const i=import.meta.url,a={};return""!==i&&(a.resourcesUrl=new URL(".",i).href),e(a)})().then((async e=>(await a(),i([["p-35253536",[[1,"casino-engagement-suite-bar",{activeWidget:[1537,"active-widget"],challengePercent:[1,"challenge-percent"],highlightChallenge:[4,"highlight-challenge"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],orientation:[1],device:[1],isChallengeLabel:[4,"is-challenge-label"],isForfeitedChallengeLabel:[4,"is-forfeited-challenge-label"],isSpinForfeitedLabel:[1028,"is-spin-forfeited-label"],language:[1],jackpots:[16],remainingFreeSpins:[1,"remaining-free-spins"],remainingLuckywheels:[1,"remaining-luckywheels"],leaderboards:[16],limitStylingAppends:[32],activeJackpot:[32],leaderboardState:[32]},[[8,"message","handleEvent"]]]]]],e))));
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import{r as e,h as a}from"./p-2ba163e5.js";
|
|
2
|
+
/*! *****************************************************************************
|
|
3
|
+
Copyright (c) Microsoft Corporation.
|
|
4
|
+
|
|
5
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
6
|
+
purpose with or without fee is hereby granted.
|
|
7
|
+
|
|
8
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
9
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
10
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
11
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
12
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
13
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
14
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
15
|
+
***************************************************************************** */const t={labels:[],rank:"-"},n=["en"],i={en:{new:"new",win:"win"}},r=(e,a)=>{const t=a;return i[void 0!==t&&n.includes(t)?t:"en"][e]},s=class{constructor(a){e(this,a),this.handleTileClick=e=>{const a=e.target.getAttribute("data-app");window.postMessage({type:`Bar${a}Click`}),this.activeWidget=a,"Jackpots"===a&&(this.activeJackpot=e.target.getAttribute("data-type"))},this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.engagementSuiteBar.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),a=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{a.innerHTML=e,setTimeout((()=>{this.engagementSuiteBar.prepend(a)}),1)})).catch((e=>{console.log("Error ",e)}))},this.activeWidget=void 0,this.challengePercent=void 0,this.highlightChallenge=!1,this.clientStyling="",this.clientStylingUrl="",this.orientation="Landscape",this.device="Mobile",this.isChallengeLabel=!1,this.isForfeitedChallengeLabel=!1,this.isSpinForfeitedLabel=!1,this.language="en",this.jackpots=[],this.remainingFreeSpins=void 0,this.remainingLuckywheels=void 0,this.leaderboards=void 0,this.limitStylingAppends=!1,this.activeJackpot="",this.leaderboardState=t}handleEvent(e){const a=null==e?void 0:e.data,{type:n}=a,i=function(e,a){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&a.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)a.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(t[n[i]]=e[n[i]])}return t}(a,["type"]);switch(n){case"UpdateLeaderboardState":Object.keys(t).map((e=>{i[e]&&(this.leaderboardState=Object.assign(Object.assign({},this.leaderboardState),{[e]:i[e]}))}));break;case"LeaderboardLiveEvent":["TournamentUpdate","PlayerLeaderBoardUpdate"].includes(i.messageType)&&!this.leaderboardState.labels.includes("new")&&(this.leaderboardState=Object.assign(Object.assign({},this.leaderboardState),{labels:[...this.leaderboardState.labels,"new"]}))}}componentDidRender(){!this.limitStylingAppends&&this.engagementSuiteBar&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}getChallengeTile(){return a("button",{class:"Tile Reward Challenges "+("Challenges"===this.activeWidget||this.highlightChallenge?"Active":""),"data-app":"Challenges",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.challengePercent),a("div",{class:"ChallengeLabel "+(this.isChallengeLabel&&!this.isForfeitedChallengeLabel?"ShowChallengeLabel":"")},a("span",null,r("new",this.language))),a("div",{class:"ForfeitLabel "+(this.isForfeitedChallengeLabel?"ShowForfeitChallengeLabel":"")}))}getFreeSpinsTile(){return a("button",{class:"Tile Reward FreeSpins "+("FreeSpins"===this.activeWidget?"Active":""),"data-app":"FreeSpins",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.remainingFreeSpins),a("div",{class:"ForfeitLabel "+(this.isSpinForfeitedLabel?"ShowForfeitLabel":"")},a("span",null)))}getLuckyWheelTile(){return a("button",{class:"Tile Reward Luckywheel "+("LuckyWheels"===this.activeWidget?"Active":""),"data-app":"LuckyWheels",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.remainingLuckywheels))}getJackpotClasses(e){return{Tile:!0,Jackpot:!0,Enabled:e.Enabled,Active:"Jackpots"===this.activeWidget&&this.activeJackpot===e.Type,[e.Type.charAt(0).toUpperCase()+e.Type.slice(1)]:!0}}getJackpotsTemplate(){return this.jackpots.map((e=>{const t=function(e,a,t=99999999){return e=Math.min(e,t),`${a} ${new Intl.NumberFormat("en",{minimumFractionDigits:2,maximumFractionDigits:2}).format(e)}`}(e.Balance,e.Currency);return a("div",{class:this.getJackpotClasses(e),"data-app":"Jackpots","data-type":e.Type,onClick:this.handleTileClick},a("div",{class:"JackpotType"},e.Type),a("span",{class:"JackpotBalance"},t))}))}getLeaderboardsTile(){return a("button",{class:"Tile Reward Leaderboard "+("Leaderboards"===this.activeWidget?"Active":""),"data-app":"Leaderboards",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.leaderboardState.rank),a("div",{class:"LeaderboardLabels"},this.leaderboardState.labels.map((e=>a("div",{class:"LeaderboardLabel"},a("span",null,r(e,this.language)))))))}displayTilesInOneRow(){return this.jackpots.length+[this.leaderboards,this.challengePercent,this.remainingFreeSpins].filter((e=>!!e)).length<4}getTilesTemplate(){return this.displayTilesInOneRow()?a("div",{class:"EngagementSuiteContainer"},!!this.jackpots.length&&this.getJackpotsTemplate(),this.leaderboards&&this.getLeaderboardsTile(),this.remainingLuckywheels&&this.getLuckyWheelTile(),this.challengePercent&&this.getChallengeTile(),this.remainingFreeSpins&&this.getFreeSpinsTile()):a("div",{class:"EngagementSuiteContainer"},a("div",{class:"Jackpots"},!!this.jackpots.length&&this.getJackpotsTemplate()),a("div",{class:"Rewards"},this.leaderboards&&this.getLeaderboardsTile(),this.remainingLuckywheels&&this.getLuckyWheelTile(),this.challengePercent&&this.getChallengeTile(),this.remainingFreeSpins&&this.getFreeSpinsTile()))}render(){return a("div",{key:"9fa80b96364085609f814668692eea4a3842815f",class:`CasinoEngagementSuiteBar ${this.orientation} ${this.device}`,ref:e=>this.engagementSuiteBar=e},this.getTilesTemplate())}};s.style=':host{display:block}*{box-sizing:border-box}button{touch-action:manipulation}.CasinoEngagementSuiteBar{height:100vh;background-color:var(--emw--color-background, #1E1638);color:var(--emw--color-typography, #FFF);display:flex;justify-content:center;position:relative;z-index:1}.CasinoEngagementSuiteBar .EngagementSuiteContainer{display:flex;align-items:center;gap:4px;scrollbar-gutter:stable;overflow-x:auto;padding:7px 9px 0;width:100%}.CasinoEngagementSuiteBar .EngagementSuiteContainer::-webkit-scrollbar{width:3px;background:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer::-webkit-scrollbar-thumb{border-radius:var(--emw--border-radius-small, 4px);background:var(--emw--color-gray-transparency-30, rgba(255, 255, 255, 0.3))}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{cursor:pointer;background-color:var(--emw--color-background-secondary, #251D3E);border-radius:var(--emw--border-radius-small, 4px);display:flex;flex-direction:row;align-items:center;justify-content:center;position:relative;font-weight:var(--emw--font-weight-semibold, 600);font-size:var(--emw--font-size-x-small, 12px);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-typography, #FFF)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile.Active::before{background:linear-gradient(143.2deg, #FF9401 -0.41%, #FFD32D 45.61%, #2D2545 82.77%)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile::before{content:"";position:absolute;inset:0;border-radius:var(--emw--border-radius-small, 4px);padding:1px;background:linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 100%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{display:flex;gap:4px;width:100%}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot{padding:14px 4px;flex-direction:column}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot .JackpotType{display:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot .JackpotBalance{font-weight:var(--emw--font-weight-semibold, 600);line-height:12px;font-size:var(--emw--font-size-x-small, 12px);color:var(--emw--color-typography, #fff)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Mega .JackpotBalance{background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Major .JackpotBalance{background:var(--emw--engagement-suite-gradient-silver, linear-gradient(180deg, #A19FA0 5.36%, #E1DBDB 28.86%, #FEFFFF 36.86%, #E1DBDB 44.36%, #5E5B5F 91.86%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Minor .JackpotBalance{background:var(--emw--engagement-suite-gradient-bronze, linear-gradient(180deg, #A0522C 5.36%, #FFAB8C 28.86%, #FFEEDF 36.86%, #FFAB8C 44.36%, #6A3A21 91.86%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled .JackpotBalance{font-weight:var(--emw--font-weight-extra-bold, 800)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Reward{justify-content:space-between;padding:8px;border:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer .RewardIcon{width:24px;height:24px;background-size:100%;background-position:center}.Tile.Leaderboard .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/leaderboard.svg")}.Tile.Leaderboard.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/leaderboard-pressed.svg")}.Tile.Challenges .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/challenge.svg")}.Tile.Challenges.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/challenge-pressed.svg")}.Tile.Luckywheel .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/luckywheel.svg")}.Tile.Luckywheel.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/luckywheel-pressed.svg")}.Tile.FreeSpins .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/freespins.svg")}.Tile.FreeSpins.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/freespins-pressed.svg")}.ChallengeLabel{min-width:23px;height:11px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:var(--emw--border-radius-x-small, 2px);display:none;position:absolute;top:-4px;right:4px;padding:0 2px;align-items:center;justify-content:center}.ChallengeLabel span{display:inline-block;text-transform:uppercase;font-size:7px;line-height:7px;font-weight:var(--emw--font-weight-bold, 700);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-background, #1E1638)}.ForfeitLabel{width:12px;height:12px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:50%;display:none;position:absolute;top:-6px;right:8px}.ShowChallengeLabel{display:inline-flex}.ShowForfeitLabel,.ShowForfeitChallengeLabel{display:inline-flex}.LeaderboardLabels{position:absolute;top:-4px;right:4px;display:flex;gap:4px}.LeaderboardLabel{min-width:23px;height:11px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:var(--emw--border-radius-x-small, 2px);display:inline-flex;padding:0 2px;align-items:center;justify-content:center}.LeaderboardLabel span{display:inline-block;text-transform:uppercase;font-size:7px;line-height:7px;font-weight:var(--emw--font-weight-bold, 700);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-background, #1E1638)}.Landscape.CasinoEngagementSuiteBar{width:152px;padding-top:10px;box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.2509803922), 8px 0 10px 0 rgba(0, 0, 0, 0.3019607843)}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer{flex-direction:column}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{width:120px}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{width:120px;height:40px}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{flex-direction:column}.Portrait.CasinoEngagementSuiteBar{border-radius:0 0 var(--emw--border-radius-medium, 4px) var(--emw--border-radius-medium, 4px);height:auto;padding:3px 10px 10px;box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.2509803922), 8px 0 10px 0 rgba(0, 0, 0, 0.3019607843)}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer{padding:7px 0 0;gap:8px;flex-wrap:wrap}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards,.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots{gap:8px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{flex:1 1 0px;height:32px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot{min-width:30%;padding:10px 4px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Reward{min-width:20%;padding:4px 8px}.CasinoEngagementSuiteBar.Desktop.Landscape{width:252px}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpots,.CasinoEngagementSuiteBar.Desktop.Landscape .Rewards,.CasinoEngagementSuiteBar.Desktop.Landscape .EngagementSuiteContainer{gap:12px}.CasinoEngagementSuiteBar.Desktop.Landscape .Reward{padding:8px 20px;height:64px;font-size:var(--emw--font-size-medium, 16px)}.CasinoEngagementSuiteBar.Desktop.Landscape .Reward .RewardIcon{width:48px;height:48px}.CasinoEngagementSuiteBar.Desktop.Landscape .Rewards,.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpots,.CasinoEngagementSuiteBar.Desktop.Landscape .Tile{width:212px}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot{padding-top:35px;min-height:133px;background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/jackpot-bg-stars.svg"), var(--emw--color-background-secondary, #251D3E)}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotType{display:block;font-weight:var(--emw--font-weight-extra-bold, 800);margin-bottom:12px;text-transform:uppercase}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotType,.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotBalance{font-size:var(--emw--size-large, 24px);line-height:24px}';export{s as casino_engagement_suite_bar}
|
|
@@ -100,7 +100,7 @@ const CasinoEngagementSuiteBar = class {
|
|
|
100
100
|
this.language = 'en';
|
|
101
101
|
this.jackpots = [];
|
|
102
102
|
this.remainingFreeSpins = undefined;
|
|
103
|
-
this.remainingLuckywheels =
|
|
103
|
+
this.remainingLuckywheels = undefined;
|
|
104
104
|
this.leaderboards = undefined;
|
|
105
105
|
this.limitStylingAppends = false;
|
|
106
106
|
this.activeJackpot = '';
|
|
@@ -174,7 +174,7 @@ const CasinoEngagementSuiteBar = class {
|
|
|
174
174
|
: index.h("div", { class: "EngagementSuiteContainer" }, index.h("div", { class: "Jackpots" }, !!this.jackpots.length && this.getJackpotsTemplate()), index.h("div", { class: "Rewards" }, this.leaderboards && this.getLeaderboardsTile(), this.remainingLuckywheels && this.getLuckyWheelTile(), this.challengePercent && this.getChallengeTile(), this.remainingFreeSpins && this.getFreeSpinsTile()));
|
|
175
175
|
}
|
|
176
176
|
render() {
|
|
177
|
-
return index.h("div", { key: '
|
|
177
|
+
return index.h("div", { key: '9fa80b96364085609f814668692eea4a3842815f', class: `CasinoEngagementSuiteBar ${this.orientation} ${this.device}`, ref: (el) => (this.engagementSuiteBar = el) }, this.getTilesTemplate());
|
|
178
178
|
}
|
|
179
179
|
};
|
|
180
180
|
CasinoEngagementSuiteBar.style = CasinoEngagementSuiteBarStyle0;
|
package/dist/collection/components/casino-engagement-suite-bar/casino-engagement-suite-bar.js
CHANGED
|
@@ -44,7 +44,7 @@ export class CasinoEngagementSuiteBar {
|
|
|
44
44
|
this.language = 'en';
|
|
45
45
|
this.jackpots = [];
|
|
46
46
|
this.remainingFreeSpins = undefined;
|
|
47
|
-
this.remainingLuckywheels =
|
|
47
|
+
this.remainingLuckywheels = undefined;
|
|
48
48
|
this.leaderboards = undefined;
|
|
49
49
|
this.limitStylingAppends = false;
|
|
50
50
|
this.activeJackpot = '';
|
|
@@ -119,7 +119,7 @@ export class CasinoEngagementSuiteBar {
|
|
|
119
119
|
: h("div", { class: "EngagementSuiteContainer" }, h("div", { class: "Jackpots" }, !!this.jackpots.length && this.getJackpotsTemplate()), h("div", { class: "Rewards" }, this.leaderboards && this.getLeaderboardsTile(), this.remainingLuckywheels && this.getLuckyWheelTile(), this.challengePercent && this.getChallengeTile(), this.remainingFreeSpins && this.getFreeSpinsTile()));
|
|
120
120
|
}
|
|
121
121
|
render() {
|
|
122
|
-
return h("div", { key: '
|
|
122
|
+
return h("div", { key: '9fa80b96364085609f814668692eea4a3842815f', class: `CasinoEngagementSuiteBar ${this.orientation} ${this.device}`, ref: (el) => (this.engagementSuiteBar = el) }, this.getTilesTemplate());
|
|
123
123
|
}
|
|
124
124
|
static get is() { return "casino-engagement-suite-bar"; }
|
|
125
125
|
static get encapsulation() { return "shadow"; }
|
|
@@ -385,8 +385,7 @@ export class CasinoEngagementSuiteBar {
|
|
|
385
385
|
"text": ""
|
|
386
386
|
},
|
|
387
387
|
"attribute": "remaining-luckywheels",
|
|
388
|
-
"reflect": false
|
|
389
|
-
"defaultValue": "'1'"
|
|
388
|
+
"reflect": false
|
|
390
389
|
},
|
|
391
390
|
"leaderboards": {
|
|
392
391
|
"type": "unknown",
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { html } from "lit";
|
|
2
|
+
import "@everymatrix/casino-engagement-suite-bar";
|
|
3
|
+
const meta = {
|
|
4
|
+
title: 'Casino/Components/casino-engagement-suite-bar',
|
|
5
|
+
component: 'casino-engagement-suite-bar',
|
|
6
|
+
args: {
|
|
7
|
+
activeWidget: "",
|
|
8
|
+
challengePercent: "",
|
|
9
|
+
highlightChallenge: "false",
|
|
10
|
+
clientStyling: "",
|
|
11
|
+
clientStylingUrl: "",
|
|
12
|
+
orientation: "Landscape' as 'Landscape' | 'Portrait",
|
|
13
|
+
device: "Mobile' as 'Mobile' | 'Tablet' | 'Desktop",
|
|
14
|
+
isChallengeLabel: "false",
|
|
15
|
+
isForfeitedChallengeLabel: "false",
|
|
16
|
+
isSpinForfeitedLabel: "false",
|
|
17
|
+
language: "en",
|
|
18
|
+
jackpots: "[] as Array<Jackpot>",
|
|
19
|
+
remainingFreeSpins: "",
|
|
20
|
+
remainingLuckywheels: "1",
|
|
21
|
+
leaderboards: "",
|
|
22
|
+
},
|
|
23
|
+
argTypes: {
|
|
24
|
+
activeWidget: { control: 'text', description: '' },
|
|
25
|
+
challengePercent: { control: 'text', description: '' },
|
|
26
|
+
highlightChallenge: { control: 'text', description: '' },
|
|
27
|
+
clientStyling: { control: 'text', description: '' },
|
|
28
|
+
clientStylingUrl: { control: 'text', description: '' },
|
|
29
|
+
orientation: { control: 'text', description: '' },
|
|
30
|
+
device: { control: 'text', description: '' },
|
|
31
|
+
isChallengeLabel: { control: 'text', description: '' },
|
|
32
|
+
isForfeitedChallengeLabel: { control: 'text', description: '' },
|
|
33
|
+
isSpinForfeitedLabel: { control: 'text', description: '' },
|
|
34
|
+
language: { control: 'text', description: '' },
|
|
35
|
+
jackpots: { control: 'text', description: '' },
|
|
36
|
+
remainingFreeSpins: { control: 'text', description: '' },
|
|
37
|
+
remainingLuckywheels: { control: 'text', description: '' },
|
|
38
|
+
leaderboards: { control: 'text', description: '' },
|
|
39
|
+
},
|
|
40
|
+
};
|
|
41
|
+
export default meta;
|
|
42
|
+
const Template = (args) => {
|
|
43
|
+
return html `<casino-engagement-suite-bar
|
|
44
|
+
activeWidget="${args.activeWidget}"
|
|
45
|
+
challengePercent="${args.challengePercent}"
|
|
46
|
+
highlightChallenge="${args.highlightChallenge}"
|
|
47
|
+
clientStyling="${args.clientStyling}"
|
|
48
|
+
clientStylingUrl="${args.clientStylingUrl}"
|
|
49
|
+
orientation="${args.orientation}"
|
|
50
|
+
device="${args.device}"
|
|
51
|
+
isChallengeLabel="${args.isChallengeLabel}"
|
|
52
|
+
isForfeitedChallengeLabel="${args.isForfeitedChallengeLabel}"
|
|
53
|
+
isSpinForfeitedLabel="${args.isSpinForfeitedLabel}"
|
|
54
|
+
language="${args.language}"
|
|
55
|
+
jackpots="${args.jackpots}"
|
|
56
|
+
remainingFreeSpins="${args.remainingFreeSpins}"
|
|
57
|
+
remainingLuckywheels="${args.remainingLuckywheels}"
|
|
58
|
+
leaderboards="${args.leaderboards}"
|
|
59
|
+
></casino-engagement-suite-bar>`;
|
|
60
|
+
};
|
|
61
|
+
export const Default = Template.bind({});
|
|
62
|
+
Default.args = {
|
|
63
|
+
activeWidget: "",
|
|
64
|
+
challengePercent: "",
|
|
65
|
+
highlightChallenge: "false",
|
|
66
|
+
clientStyling: "",
|
|
67
|
+
clientStylingUrl: "",
|
|
68
|
+
orientation: "Landscape' as 'Landscape' | 'Portrait",
|
|
69
|
+
device: "Mobile' as 'Mobile' | 'Tablet' | 'Desktop",
|
|
70
|
+
isChallengeLabel: "false",
|
|
71
|
+
isForfeitedChallengeLabel: "false",
|
|
72
|
+
isSpinForfeitedLabel: "false",
|
|
73
|
+
language: "en",
|
|
74
|
+
jackpots: "[] as Array<Jackpot>",
|
|
75
|
+
remainingFreeSpins: "",
|
|
76
|
+
remainingLuckywheels: "1",
|
|
77
|
+
leaderboards: "",
|
|
78
|
+
};
|
|
@@ -96,7 +96,7 @@ const CasinoEngagementSuiteBar = class {
|
|
|
96
96
|
this.language = 'en';
|
|
97
97
|
this.jackpots = [];
|
|
98
98
|
this.remainingFreeSpins = undefined;
|
|
99
|
-
this.remainingLuckywheels =
|
|
99
|
+
this.remainingLuckywheels = undefined;
|
|
100
100
|
this.leaderboards = undefined;
|
|
101
101
|
this.limitStylingAppends = false;
|
|
102
102
|
this.activeJackpot = '';
|
|
@@ -170,7 +170,7 @@ const CasinoEngagementSuiteBar = class {
|
|
|
170
170
|
: h("div", { class: "EngagementSuiteContainer" }, h("div", { class: "Jackpots" }, !!this.jackpots.length && this.getJackpotsTemplate()), h("div", { class: "Rewards" }, this.leaderboards && this.getLeaderboardsTile(), this.remainingLuckywheels && this.getLuckyWheelTile(), this.challengePercent && this.getChallengeTile(), this.remainingFreeSpins && this.getFreeSpinsTile()));
|
|
171
171
|
}
|
|
172
172
|
render() {
|
|
173
|
-
return h("div", { key: '
|
|
173
|
+
return h("div", { key: '9fa80b96364085609f814668692eea4a3842815f', class: `CasinoEngagementSuiteBar ${this.orientation} ${this.device}`, ref: (el) => (this.engagementSuiteBar = el) }, this.getTilesTemplate());
|
|
174
174
|
}
|
|
175
175
|
};
|
|
176
176
|
CasinoEngagementSuiteBar.style = CasinoEngagementSuiteBarStyle0;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import path from "path";
|
|
2
|
+
import { getStoryFiles, detectUsedPackages, parseTsConfig, exec, filterParsedPathsByUsedPackages } from "../../../../libs/common/src/storybook/storybook-utils";
|
|
3
|
+
const config = {
|
|
4
|
+
stories: ['../**/*.@(mdx|stories.@(js|ts|tsx))'],
|
|
5
|
+
addons: [
|
|
6
|
+
'@storybook/addon-essentials',
|
|
7
|
+
'@storybook/addon-interactions',
|
|
8
|
+
'storybook-dark-mode'
|
|
9
|
+
],
|
|
10
|
+
docs: {
|
|
11
|
+
defaultName: 'Documentation',
|
|
12
|
+
autodocs: 'tag'
|
|
13
|
+
},
|
|
14
|
+
framework: {
|
|
15
|
+
name: '@storybook/web-components-vite',
|
|
16
|
+
options: {}
|
|
17
|
+
},
|
|
18
|
+
// Async viteFinal to build dependent packages before finalizing configuration.
|
|
19
|
+
viteFinal: async (config) => {
|
|
20
|
+
const storyFiles = getStoryFiles(path.resolve(__dirname, '../'));
|
|
21
|
+
const usedPackages = detectUsedPackages(storyFiles);
|
|
22
|
+
const buildPromises = usedPackages.map(async (pkg) => {
|
|
23
|
+
try {
|
|
24
|
+
console.log(`Building package ${pkg}...`);
|
|
25
|
+
const { stdout, stderr } = await exec(`nx run ${pkg}:build`);
|
|
26
|
+
console.log(`Built package ${pkg}: ${stdout}`);
|
|
27
|
+
if (stderr) {
|
|
28
|
+
console.error(`Build warning/error for package ${pkg}: ${stderr}`);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
catch (error) {
|
|
32
|
+
console.error(`Error building package ${pkg}:`, error);
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
await Promise.all(buildPromises);
|
|
36
|
+
const parsedPaths = parseTsConfig() || {};
|
|
37
|
+
const filteredParsedPaths = filterParsedPathsByUsedPackages(parsedPaths, usedPackages);
|
|
38
|
+
return Object.assign(Object.assign({}, config), { resolve: {
|
|
39
|
+
alias: Object.assign({}, filteredParsedPaths)
|
|
40
|
+
}, define: {
|
|
41
|
+
process: {
|
|
42
|
+
env: {}
|
|
43
|
+
}
|
|
44
|
+
} });
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
export default config;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { themes } from "@storybook/theming";
|
|
2
|
+
export const parameters = {
|
|
3
|
+
darkMode: {
|
|
4
|
+
dark: Object.assign(Object.assign({}, themes.dark), { appBg: 'black' }),
|
|
5
|
+
light: Object.assign(Object.assign({}, themes.normal), { appBg: 'green' }),
|
|
6
|
+
current: 'light',
|
|
7
|
+
stylePreview: true
|
|
8
|
+
}
|
|
9
|
+
};
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/// <reference types="node" />
|
|
2
|
+
import { exec as execCallback } from 'child_process';
|
|
3
|
+
export declare const exec: typeof execCallback.__promisify__;
|
|
4
|
+
/**
|
|
5
|
+
* Recursively retrieves all story files (.stories.ts/.stories.tsx) in a directory.
|
|
6
|
+
* @param dir The directory to search.
|
|
7
|
+
* @returns Array of story file paths.
|
|
8
|
+
*/
|
|
9
|
+
export declare const getStoryFiles: (dir: string) => string[];
|
|
10
|
+
/**
|
|
11
|
+
* Detects which internal packages are used in the provided story files.
|
|
12
|
+
* It looks at every import that starts with the given package alias prefix,
|
|
13
|
+
* then extracts the package name (the segment immediately following the prefix).
|
|
14
|
+
*
|
|
15
|
+
* @param stories Array of story file paths.
|
|
16
|
+
* @returns Array of unique package names (e.g. ['foo', 'bar']).
|
|
17
|
+
*/
|
|
18
|
+
export declare const detectUsedPackages: (stories: string[]) => string[];
|
|
19
|
+
/**
|
|
20
|
+
* Extracts all import paths from a file using the TypeScript compiler API.
|
|
21
|
+
* @param filePath The file path to parse.
|
|
22
|
+
* @returns Array of import strings.
|
|
23
|
+
*/
|
|
24
|
+
export declare const extractImports: (filePath: string) => string[];
|
|
25
|
+
/**
|
|
26
|
+
* Parses the tsconfig paths and resolves them to absolute paths.
|
|
27
|
+
* @param tsconfigPath The path to the tsconfig file.
|
|
28
|
+
* @returns An object mapping alias keys to absolute paths.
|
|
29
|
+
*/
|
|
30
|
+
export declare const parseTsConfig: () => Record<string, string> | null;
|
|
31
|
+
/**
|
|
32
|
+
* Filters the parsed tsconfig alias mapping to only include keys that correspond
|
|
33
|
+
* to the used packages.
|
|
34
|
+
*
|
|
35
|
+
* @param parsedPaths The full alias mapping from tsconfig.
|
|
36
|
+
* @param usedPackages Array of package names that are used (e.g. ['foo', 'bar']).
|
|
37
|
+
* @returns Filtered alias mapping.
|
|
38
|
+
*/
|
|
39
|
+
export declare const filterParsedPathsByUsedPackages: (parsedPaths: Record<string, string>, usedPackages: string[]) => Record<string, string>;
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
export declare const parameters: {
|
|
2
|
+
darkMode: {
|
|
3
|
+
dark: {
|
|
4
|
+
appBg: string;
|
|
5
|
+
base: "light" | "dark";
|
|
6
|
+
colorPrimary: string;
|
|
7
|
+
colorSecondary: string;
|
|
8
|
+
appContentBg: string;
|
|
9
|
+
appPreviewBg: string;
|
|
10
|
+
appBorderColor: string;
|
|
11
|
+
appBorderRadius: number;
|
|
12
|
+
fontBase: string;
|
|
13
|
+
fontCode: string;
|
|
14
|
+
textColor: string;
|
|
15
|
+
textInverseColor: string;
|
|
16
|
+
textMutedColor: string;
|
|
17
|
+
barTextColor: string;
|
|
18
|
+
barHoverColor: string;
|
|
19
|
+
barSelectedColor: string;
|
|
20
|
+
barBg: string;
|
|
21
|
+
buttonBg: string;
|
|
22
|
+
buttonBorder: string;
|
|
23
|
+
booleanBg: string;
|
|
24
|
+
booleanSelectedBg: string;
|
|
25
|
+
inputBg: string;
|
|
26
|
+
inputBorder: string;
|
|
27
|
+
inputTextColor: string;
|
|
28
|
+
inputBorderRadius: number;
|
|
29
|
+
brandTitle?: string;
|
|
30
|
+
brandUrl?: string;
|
|
31
|
+
brandImage?: string;
|
|
32
|
+
brandTarget?: string;
|
|
33
|
+
gridCellSize?: number;
|
|
34
|
+
};
|
|
35
|
+
light: {
|
|
36
|
+
appBg: string;
|
|
37
|
+
base: "light" | "dark";
|
|
38
|
+
colorPrimary: string;
|
|
39
|
+
colorSecondary: string;
|
|
40
|
+
appContentBg: string;
|
|
41
|
+
appPreviewBg: string;
|
|
42
|
+
appBorderColor: string;
|
|
43
|
+
appBorderRadius: number;
|
|
44
|
+
fontBase: string;
|
|
45
|
+
fontCode: string;
|
|
46
|
+
textColor: string;
|
|
47
|
+
textInverseColor: string;
|
|
48
|
+
textMutedColor: string;
|
|
49
|
+
barTextColor: string;
|
|
50
|
+
barHoverColor: string;
|
|
51
|
+
barSelectedColor: string;
|
|
52
|
+
barBg: string;
|
|
53
|
+
buttonBg: string;
|
|
54
|
+
buttonBorder: string;
|
|
55
|
+
booleanBg: string;
|
|
56
|
+
booleanSelectedBg: string;
|
|
57
|
+
inputBg: string;
|
|
58
|
+
inputBorder: string;
|
|
59
|
+
inputTextColor: string;
|
|
60
|
+
inputBorderRadius: number;
|
|
61
|
+
brandTitle?: string;
|
|
62
|
+
brandUrl?: string;
|
|
63
|
+
brandImage?: string;
|
|
64
|
+
brandTarget?: string;
|
|
65
|
+
gridCellSize?: number;
|
|
66
|
+
};
|
|
67
|
+
current: string;
|
|
68
|
+
stylePreview: boolean;
|
|
69
|
+
};
|
|
70
|
+
};
|
package/package.json
CHANGED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a}from"./p-2ba163e5.js";
|
|
2
|
-
/*! *****************************************************************************
|
|
3
|
-
Copyright (c) Microsoft Corporation.
|
|
4
|
-
|
|
5
|
-
Permission to use, copy, modify, and/or distribute this software for any
|
|
6
|
-
purpose with or without fee is hereby granted.
|
|
7
|
-
|
|
8
|
-
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
9
|
-
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
10
|
-
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
11
|
-
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
12
|
-
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
13
|
-
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
14
|
-
PERFORMANCE OF THIS SOFTWARE.
|
|
15
|
-
***************************************************************************** */const t={labels:[],rank:"-"},n=["en"],i={en:{new:"new",win:"win"}},r=(e,a)=>{const t=a;return i[void 0!==t&&n.includes(t)?t:"en"][e]},s=class{constructor(a){e(this,a),this.handleTileClick=e=>{const a=e.target.getAttribute("data-app");window.postMessage({type:`Bar${a}Click`}),this.activeWidget=a,"Jackpots"===a&&(this.activeJackpot=e.target.getAttribute("data-type"))},this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.engagementSuiteBar.prepend(e)},this.setClientStylingURL=()=>{let e=new URL(this.clientStylingUrl),a=document.createElement("style");fetch(e.href).then((e=>e.text())).then((e=>{a.innerHTML=e,setTimeout((()=>{this.engagementSuiteBar.prepend(a)}),1)})).catch((e=>{console.log("Error ",e)}))},this.activeWidget=void 0,this.challengePercent=void 0,this.highlightChallenge=!1,this.clientStyling="",this.clientStylingUrl="",this.orientation="Landscape",this.device="Mobile",this.isChallengeLabel=!1,this.isForfeitedChallengeLabel=!1,this.isSpinForfeitedLabel=!1,this.language="en",this.jackpots=[],this.remainingFreeSpins=void 0,this.remainingLuckywheels="1",this.leaderboards=void 0,this.limitStylingAppends=!1,this.activeJackpot="",this.leaderboardState=t}handleEvent(e){const a=null==e?void 0:e.data,{type:n}=a,i=function(e,a){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&a.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)a.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(t[n[i]]=e[n[i]])}return t}(a,["type"]);switch(n){case"UpdateLeaderboardState":Object.keys(t).map((e=>{i[e]&&(this.leaderboardState=Object.assign(Object.assign({},this.leaderboardState),{[e]:i[e]}))}));break;case"LeaderboardLiveEvent":["TournamentUpdate","PlayerLeaderBoardUpdate"].includes(i.messageType)&&!this.leaderboardState.labels.includes("new")&&(this.leaderboardState=Object.assign(Object.assign({},this.leaderboardState),{labels:[...this.leaderboardState.labels,"new"]}))}}componentDidRender(){!this.limitStylingAppends&&this.engagementSuiteBar&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}getChallengeTile(){return a("button",{class:"Tile Reward Challenges "+("Challenges"===this.activeWidget||this.highlightChallenge?"Active":""),"data-app":"Challenges",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.challengePercent),a("div",{class:"ChallengeLabel "+(this.isChallengeLabel&&!this.isForfeitedChallengeLabel?"ShowChallengeLabel":"")},a("span",null,r("new",this.language))),a("div",{class:"ForfeitLabel "+(this.isForfeitedChallengeLabel?"ShowForfeitChallengeLabel":"")}))}getFreeSpinsTile(){return a("button",{class:"Tile Reward FreeSpins "+("FreeSpins"===this.activeWidget?"Active":""),"data-app":"FreeSpins",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.remainingFreeSpins),a("div",{class:"ForfeitLabel "+(this.isSpinForfeitedLabel?"ShowForfeitLabel":"")},a("span",null)))}getLuckyWheelTile(){return a("button",{class:"Tile Reward Luckywheel "+("LuckyWheels"===this.activeWidget?"Active":""),"data-app":"LuckyWheels",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.remainingLuckywheels))}getJackpotClasses(e){return{Tile:!0,Jackpot:!0,Enabled:e.Enabled,Active:"Jackpots"===this.activeWidget&&this.activeJackpot===e.Type,[e.Type.charAt(0).toUpperCase()+e.Type.slice(1)]:!0}}getJackpotsTemplate(){return this.jackpots.map((e=>{const t=function(e,a,t=99999999){return e=Math.min(e,t),`${a} ${new Intl.NumberFormat("en",{minimumFractionDigits:2,maximumFractionDigits:2}).format(e)}`}(e.Balance,e.Currency);return a("div",{class:this.getJackpotClasses(e),"data-app":"Jackpots","data-type":e.Type,onClick:this.handleTileClick},a("div",{class:"JackpotType"},e.Type),a("span",{class:"JackpotBalance"},t))}))}getLeaderboardsTile(){return a("button",{class:"Tile Reward Leaderboard "+("Leaderboards"===this.activeWidget?"Active":""),"data-app":"Leaderboards",onClick:this.handleTileClick},a("div",{class:"RewardIcon"}),a("span",null,this.leaderboardState.rank),a("div",{class:"LeaderboardLabels"},this.leaderboardState.labels.map((e=>a("div",{class:"LeaderboardLabel"},a("span",null,r(e,this.language)))))))}displayTilesInOneRow(){return this.jackpots.length+[this.leaderboards,this.challengePercent,this.remainingFreeSpins].filter((e=>!!e)).length<4}getTilesTemplate(){return this.displayTilesInOneRow()?a("div",{class:"EngagementSuiteContainer"},!!this.jackpots.length&&this.getJackpotsTemplate(),this.leaderboards&&this.getLeaderboardsTile(),this.remainingLuckywheels&&this.getLuckyWheelTile(),this.challengePercent&&this.getChallengeTile(),this.remainingFreeSpins&&this.getFreeSpinsTile()):a("div",{class:"EngagementSuiteContainer"},a("div",{class:"Jackpots"},!!this.jackpots.length&&this.getJackpotsTemplate()),a("div",{class:"Rewards"},this.leaderboards&&this.getLeaderboardsTile(),this.remainingLuckywheels&&this.getLuckyWheelTile(),this.challengePercent&&this.getChallengeTile(),this.remainingFreeSpins&&this.getFreeSpinsTile()))}render(){return a("div",{key:"d932ee7e636f06b0c50841a4737cb6572c1500aa",class:`CasinoEngagementSuiteBar ${this.orientation} ${this.device}`,ref:e=>this.engagementSuiteBar=e},this.getTilesTemplate())}};s.style=':host{display:block}*{box-sizing:border-box}button{touch-action:manipulation}.CasinoEngagementSuiteBar{height:100vh;background-color:var(--emw--color-background, #1E1638);color:var(--emw--color-typography, #FFF);display:flex;justify-content:center;position:relative;z-index:1}.CasinoEngagementSuiteBar .EngagementSuiteContainer{display:flex;align-items:center;gap:4px;scrollbar-gutter:stable;overflow-x:auto;padding:7px 9px 0;width:100%}.CasinoEngagementSuiteBar .EngagementSuiteContainer::-webkit-scrollbar{width:3px;background:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer::-webkit-scrollbar-thumb{border-radius:var(--emw--border-radius-small, 4px);background:var(--emw--color-gray-transparency-30, rgba(255, 255, 255, 0.3))}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{cursor:pointer;background-color:var(--emw--color-background-secondary, #251D3E);border-radius:var(--emw--border-radius-small, 4px);display:flex;flex-direction:row;align-items:center;justify-content:center;position:relative;font-weight:var(--emw--font-weight-semibold, 600);font-size:var(--emw--font-size-x-small, 12px);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-typography, #FFF)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile.Active::before{background:linear-gradient(143.2deg, #FF9401 -0.41%, #FFD32D 45.61%, #2D2545 82.77%)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile::before{content:"";position:absolute;inset:0;border-radius:var(--emw--border-radius-small, 4px);padding:1px;background:linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 100%);-webkit-mask:linear-gradient(#FFF 0 0) content-box, linear-gradient(#FFF 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{display:flex;gap:4px;width:100%}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot{padding:14px 4px;flex-direction:column}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot .JackpotType{display:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot .JackpotBalance{font-weight:var(--emw--font-weight-semibold, 600);line-height:12px;font-size:var(--emw--font-size-x-small, 12px);color:var(--emw--color-typography, #fff)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Mega .JackpotBalance{background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Major .JackpotBalance{background:var(--emw--engagement-suite-gradient-silver, linear-gradient(180deg, #A19FA0 5.36%, #E1DBDB 28.86%, #FEFFFF 36.86%, #E1DBDB 44.36%, #5E5B5F 91.86%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled.Minor .JackpotBalance{background:var(--emw--engagement-suite-gradient-bronze, linear-gradient(180deg, #A0522C 5.36%, #FFAB8C 28.86%, #FFEEDF 36.86%, #FFAB8C 44.36%, #6A3A21 91.86%));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot.Enabled .JackpotBalance{font-weight:var(--emw--font-weight-extra-bold, 800)}.CasinoEngagementSuiteBar .EngagementSuiteContainer .Reward{justify-content:space-between;padding:8px;border:none}.CasinoEngagementSuiteBar .EngagementSuiteContainer .RewardIcon{width:24px;height:24px;background-size:100%;background-position:center}.Tile.Leaderboard .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/leaderboard.svg")}.Tile.Leaderboard.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/leaderboard-pressed.svg")}.Tile.Challenges .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/challenge.svg")}.Tile.Challenges.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/challenge-pressed.svg")}.Tile.Luckywheel .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/luckywheel.svg")}.Tile.Luckywheel.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/luckywheel-pressed.svg")}.Tile.FreeSpins .RewardIcon{background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/freespins.svg")}.Tile.FreeSpins.Active .RewardIcon{background-image:url("https://static.everymatrix.com/gic/img/engagement-suite/bar/freespins-pressed.svg")}.ChallengeLabel{min-width:23px;height:11px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:var(--emw--border-radius-x-small, 2px);display:none;position:absolute;top:-4px;right:4px;padding:0 2px;align-items:center;justify-content:center}.ChallengeLabel span{display:inline-block;text-transform:uppercase;font-size:7px;line-height:7px;font-weight:var(--emw--font-weight-bold, 700);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-background, #1E1638)}.ForfeitLabel{width:12px;height:12px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:50%;display:none;position:absolute;top:-6px;right:8px}.ShowChallengeLabel{display:inline-flex}.ShowForfeitLabel,.ShowForfeitChallengeLabel{display:inline-flex}.LeaderboardLabels{position:absolute;top:-4px;right:4px;display:flex;gap:4px}.LeaderboardLabel{min-width:23px;height:11px;background:var(--emw--engagement-suite-gradient-golden, linear-gradient(180deg, #FFB801 15.86%, #FEF746 31.36%, #FBFFE0 36.86%, #FFFA60 47.86%, #FF9400 87.36%));border-radius:var(--emw--border-radius-x-small, 2px);display:inline-flex;padding:0 2px;align-items:center;justify-content:center}.LeaderboardLabel span{display:inline-block;text-transform:uppercase;font-size:7px;line-height:7px;font-weight:var(--emw--font-weight-bold, 700);font-family:var(--emw--font-family-secondary, "Montserrat", sans-serif);color:var(--emw--color-background, #1E1638)}.Landscape.CasinoEngagementSuiteBar{width:152px;padding-top:10px;box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.2509803922), 8px 0 10px 0 rgba(0, 0, 0, 0.3019607843)}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer{flex-direction:column}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{width:120px}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{width:120px;height:40px}.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots,.Landscape.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards{flex-direction:column}.Portrait.CasinoEngagementSuiteBar{border-radius:0 0 var(--emw--border-radius-medium, 4px) var(--emw--border-radius-medium, 4px);height:auto;padding:3px 10px 10px;box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.2509803922), 8px 0 10px 0 rgba(0, 0, 0, 0.3019607843)}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer{padding:7px 0 0;gap:8px;flex-wrap:wrap}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Rewards,.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpots{gap:8px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Tile{flex:1 1 0px;height:32px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Jackpot{min-width:30%;padding:10px 4px}.Portrait.CasinoEngagementSuiteBar .EngagementSuiteContainer .Reward{min-width:20%;padding:4px 8px}.CasinoEngagementSuiteBar.Desktop.Landscape{width:252px}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpots,.CasinoEngagementSuiteBar.Desktop.Landscape .Rewards,.CasinoEngagementSuiteBar.Desktop.Landscape .EngagementSuiteContainer{gap:12px}.CasinoEngagementSuiteBar.Desktop.Landscape .Reward{padding:8px 20px;height:64px;font-size:var(--emw--font-size-medium, 16px)}.CasinoEngagementSuiteBar.Desktop.Landscape .Reward .RewardIcon{width:48px;height:48px}.CasinoEngagementSuiteBar.Desktop.Landscape .Rewards,.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpots,.CasinoEngagementSuiteBar.Desktop.Landscape .Tile{width:212px}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot{padding-top:35px;min-height:133px;background:center/contain url("https://static.everymatrix.com/gic/img/engagement-suite/bar/jackpot-bg-stars.svg"), var(--emw--color-background-secondary, #251D3E)}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotType{display:block;font-weight:var(--emw--font-weight-extra-bold, 800);margin-bottom:12px;text-transform:uppercase}.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotType,.CasinoEngagementSuiteBar.Desktop.Landscape .Jackpot .JackpotBalance{font-size:var(--emw--size-large, 24px);line-height:24px}';export{s as casino_engagement_suite_bar}
|