@everymatrix/casino-engagement-suite-luckywheel-list 0.1.0

package/dist/cjs/index.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const casinoEngagementSuiteLuckywheelList = require('./casino-engagement-suite-luckywheel-list-726f2e8f.js');
+require('./index-3815b8e0.js');
+
+
+
+exports.CasinoEngagementSuiteLuckyWheelList = casinoEngagementSuiteLuckywheelList.CasinoEngagementSuiteLuckyWheelList;

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-3815b8e0.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["casino-engagement-suite-luckywheel-list_2.cjs",[[1,"casino-engagement-suite-luckywheel-list",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[1],"device":[1],"luckywheels":[1040],"endpoint":[1],"session":[1],"translationUrl":[1,"translation-url"],"tooltip":[32],"timers":[32],"limitStylingAppends":[32],"activeTab":[32],"historyLoading":[32],"luckywheelHistory":[32],"openedHistoryIds":[32],"historyLoaded":[32],"isLoading":[32]},[[8,"message","handleEvent"]],{"luckywheels":["luckywheelsPropHandler"]}],[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,19 @@
+{
+  "entries": [
+    "components/casino-engagement-suite-luckywheel-list/casino-engagement-suite-luckywheel-list.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.22.3",
+    "typescriptVersion": "5.5.4"
+  },
+  "collections": [
+    {
+      "name": "@everymatrix/casino-engagement-suite-progress-bar",
+      "tags": [
+        "casino-engagement-suite-progress-bar"
+      ]
+    }
+  ],
+  "bundles": []
+}

package/dist/collection/components/casino-engagement-suite-luckywheel-list/casino-engagement-suite-luckywheel-list.css

@@ -0,0 +1,454 @@
+:host {
+  display: block;
+  font-family: inherit;
+}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+button {
+  border: none;
+  background: none;
+  cursor: pointer;
+}
+button:focus {
+  outline: none;
+}
+
+.EngagementSuiteIconButton {
+  width: 16px;
+  height: 16px;
+}
+.EngagementSuiteIconButton.Help {
+  background: center/100% url(https://static.everymatrix.com/gic/img/engagement-suite/help.svg) no-repeat;
+}
+.EngagementSuiteIconButton.Close {
+  background: center/100% url(https://static.everymatrix.com/gic/img/engagement-suite/close.svg) no-repeat;
+}
+.EngagementSuiteIconButton.ArrowDown {
+  background: center/100% url(https://static.everymatrix.com/gic/img/engagement-suite/arrow-down.svg) no-repeat;
+}
+
+.LuckyWheelsListPopup {
+  display: flex;
+  height: 100%;
+  background-color: var(--emw--color-background, #1e1638);
+  border-radius: var(--emw--border-radius-large, 8px);
+  overflow: hidden;
+  flex-direction: column;
+  position: relative;
+  padding-bottom: 20px;
+}
+
+.LuckyWheelsListPopupHeader {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 8px 8px;
+}
+
+.LuckyWheelsListPopupHeaderName {
+  color: var(--emw--color-secondary, #bbb9c3);
+  font-size: var(--emw--font-size-small, 14px);
+  font-weight: var(--emw--font-weight-medium, 500);
+  line-height: 14px;
+}
+
+.LuckyWheelsListWrapper {
+  overflow-y: auto;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+.LuckyWheelsListWrapper::-webkit-scrollbar {
+  display: none;
+}
+
+.LuckyWheelsList {
+  display: flex;
+  flex-direction: column;
+  row-gap: 12px;
+  padding: 8px 19px 0;
+}
+
+.LuckyWheelsRowWrapper {
+  display: flex;
+  justify-content: space-between;
+  min-width: 0;
+}
+
+.LuckyWheelsCard {
+  padding: 15px 15px 19px;
+  border: 1px solid var(--emw--button-border-color, #403956);
+  border-radius: var(--emw--border-radius-medium, 6px);
+  position: relative;
+  cursor: pointer;
+}
+.LuckyWheelsCard.Forfeited {
+  cursor: auto;
+  pointer-events: none;
+}
+
+.LuckyWheelsCardHeader {
+  display: flex;
+  justify-content: space-between;
+  gap: 24px;
+  margin-bottom: 12px;
+  flex: 1;
+  min-width: 0;
+  align-items: flex-end;
+}
+
+.LuckyWheelsName {
+  color: var(--emw--color-typography, #ffffff);
+  font-family: var(--emw--font-family-secondary, "Montserrat", sans-serif);
+  line-height: 22px;
+  font-weight: var(--emw--font-weight-bold, 700);
+  font-size: var(--emw--font-size-medium-plus, 18px);
+  word-break: break-word;
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.LuckyWheelsCounter {
+  display: flex;
+  color: var(--emw--color-secondary, #bbb9c3);
+  font-size: var(--emw--font-size-medium-plus, 18px);
+  align-items: flex-end;
+}
+
+.LuckyWheelsHighlightedCounter,
+.LuckyWheelsEmptyCounter {
+  font-size: var(--emw--font-size-medium-plus, 18px);
+  font-weight: var(--emw--font-weight-extra-bold, 800);
+  margin-right: 4px;
+}
+
+.LuckyWheelsHighlightedCounter {
+  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-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+.LuckyWheelsEmptyCounter {
+  color: var(--emw--color-gray-150, #8f8b9c);
+}
+
+.LuckyWheelsListEmpty {
+  padding: 20px 32px;
+}
+
+.LuckyWheelsListEmpty h2 {
+  margin: 0 0 16px 0;
+  text-align: center;
+  font-weight: var(--emw--font-weight-semibold, 600);
+  font-size: var(--emw--font-size-large, 20px);
+  line-height: 24px;
+  font-family: var(--emw--font-family-secondary, "Montserrat", sans-serif);
+  color: var(--emw--color-typography, #ffffff);
+}
+
+.LuckyWheelsListEmpty p {
+  font-size: var(--emw--font-size-small, 14px);
+  line-height: 17px;
+  color: var(--emw--color-secondary, #bbb9c3);
+}
+
+.LuckyWheelsCountdownWrapper {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+}
+
+.LuckyWheelsCountdown,
+.ForfeitedMessage {
+  color: var(--emw--color-secondary, #bbb9c3);
+  font-size: var(--emw--font-size-x-small, 12px);
+  line-height: 12px;
+}
+
+.ForfeitedMessage {
+  line-height: 1.2;
+}
+
+.LuckyWheelsBalCounter {
+  display: flex;
+  align-items: flex-end;
+  color: var(--emw--color-secondary, #bbb9c3);
+  font-size: var(--emw--font-size-x-small, 12px);
+}
+
+.LuckyWheelsRemainCounter {
+  color: var(--emw--color-typography, #ffffff);
+  font-weight: var(--emw--font-weight-bold, 700);
+  margin-right: 4px;
+}
+
+.LuckyWheelLabel {
+  min-width: 35px;
+  height: 18px;
+  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: -11px;
+  right: 11px;
+  padding: 0 2px;
+  align-items: center;
+  justify-content: center;
+}
+.LuckyWheelLabel span {
+  display: inline-block;
+  text-transform: uppercase;
+  font-size: var(--emw--font-size-2x-small, 10px);
+  line-height: 10px;
+  font-weight: var(--emw--font-weight-bold, 700);
+  font-family: var(--emw--font-family-secondary, "Montserrat", sans-serif);
+  color: var(--emw--color-background, #1e1638);
+}
+
+.ShowLuckyWheelLabel {
+  display: inline-flex;
+}
+
+.EngagementSuiteTooltipBackdrop {
+  padding: 48px 30px 0;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+.EngagementSuiteTooltipBackdrop .EngagementSuiteTooltip {
+  border: 1px solid var(--emw--button-border-color, #403956);
+  background-color: var(--emw--color-background, #1e1638);
+  border-radius: var(--emw--border-radius-large, 8px);
+  padding: 32px;
+  font-size: var(--emw--font-size-small, 14px);
+  line-height: 17px;
+  color: var(--emw--color-secondary, #bbb9c3);
+  position: relative;
+}
+.EngagementSuiteTooltipBackdrop .EngagementSuiteTooltip .EngagementSuiteIconButton {
+  top: 12px;
+  right: 12px;
+  position: absolute;
+}
+
+.LuckyWheelsEmptyNumber .LuckyWheelsName,
+.LuckyWheelsEmptyNumber .LuckyWheelsCountdown,
+.LuckyWheelsEmptyNumber .LuckyWheelsRemainCounter {
+  color: var(--emw--color-gray-150, #8f8b9c);
+}
+
+.LuckyWheelsListPopup.Tablet .LuckyWheelsListPopupHeader,
+.LuckyWheelsListPopup.Desktop .LuckyWheelsListPopupHeader {
+  padding-top: 16px;
+}
+.LuckyWheelsListPopup.Tablet .LuckyWheelsListPopupHeaderName,
+.LuckyWheelsListPopup.Desktop .LuckyWheelsListPopupHeaderName {
+  font-size: var(--emw--font-size-medium, 16px);
+  line-height: 16px;
+}
+.LuckyWheelsListPopup.Tablet .EngagementSuiteIconButton,
+.LuckyWheelsListPopup.Desktop .EngagementSuiteIconButton {
+  width: 24px;
+  height: 24px;
+}
+.LuckyWheelsListPopup.Tablet .LuckyWheelsList,
+.LuckyWheelsListPopup.Desktop .LuckyWheelsList {
+  padding: 20px 24px 0;
+  row-gap: 20px;
+}
+.LuckyWheelsListPopup.Tablet .LuckyWheelCardHeader,
+.LuckyWheelsListPopup.Desktop .LuckyWheelCardHeader {
+  margin-bottom: 16px;
+}
+.LuckyWheelsListPopup.Tablet .LuckyWheelsName,
+.LuckyWheelsListPopup.Desktop .LuckyWheelsName {
+  line-height: 27px;
+  font-size: var(--emw--font-size-large, 22px);
+}
+.LuckyWheelsListPopup.Tablet .LuckyWheelsCountdown,
+.LuckyWheelsListPopup.Desktop .LuckyWheelsCountdown {
+  font-size: var(--emw--font-size-small, 14px);
+  line-height: 14px;
+}
+.LuckyWheelsListPopup.Tablet .EngagementSuiteTooltipBackdrop,
+.LuckyWheelsListPopup.Desktop .EngagementSuiteTooltipBackdrop {
+  padding: 90px 75px 0;
+}
+.LuckyWheelsListPopup.Tablet .EngagementSuiteTooltip,
+.LuckyWheelsListPopup.Desktop .EngagementSuiteTooltip {
+  padding: 60px 65px;
+  font-size: var(--emw--font-size-medium, 16px);
+  line-height: 20px;
+}
+.LuckyWheelsListPopup.Tablet .EngagementSuiteTooltip .EngagementSuiteIconButton,
+.LuckyWheelsListPopup.Desktop .EngagementSuiteTooltip .EngagementSuiteIconButton {
+  top: 24px;
+  right: 24px;
+}
+.LuckyWheelsListPopup.Tablet .EngagementSuiteTabsWrapper .EngagementSuiteTabs .EngagementSuiteTab,
+.LuckyWheelsListPopup.Desktop .EngagementSuiteTabsWrapper .EngagementSuiteTabs .EngagementSuiteTab {
+  font-size: var(--emw--font-size-medium, 16px);
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryCols,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryCols {
+  font-size: var(--emw--font-size-medium, 16px);
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryCols .Rewards,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryCols .Rewards {
+  flex-basis: 140px;
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryCols .Issued,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryCols .Issued {
+  flex-basis: 100px;
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryListItem .HistoryListItemHeader,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryListItem .HistoryListItemHeader {
+  font-size: var(--emw--font-size-large, 22px);
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryListItem .HistoryInfo,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryListItem .HistoryInfo {
+  font-size: var(--emw--font-size-medium, 16px);
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryListItem .HistoryInfo .Rewards,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryListItem .HistoryInfo .Rewards {
+  flex-basis: 140px;
+}
+.LuckyWheelsListPopup.Tablet .HistoryWrapper .HistoryListItem .HistoryInfo .Issued,
+.LuckyWheelsListPopup.Desktop .HistoryWrapper .HistoryListItem .HistoryInfo .Issued {
+  flex-basis: 100px;
+}
+
+.EngagementSuiteTabsWrapper {
+  padding: 0 24px;
+  margin: 8px 0;
+}
+.EngagementSuiteTabsWrapper .EngagementSuiteTabs {
+  display: flex;
+  position: relative;
+  border-bottom: 2px solid var(--emw--color-secondary, #666178);
+}
+.EngagementSuiteTabsWrapper .EngagementSuiteTabs .EngagementSuiteTab {
+  padding: 9px 16px 7px;
+  font-weight: var(--emw--font-weight-medium, 500);
+  font-size: var(--emw--font-size-x-small, 12px);
+  line-height: 15px;
+  color: var(--emw--color-gray-300, #666178);
+  cursor: pointer;
+}
+.EngagementSuiteTabsWrapper .EngagementSuiteTabs .EngagementSuiteTab.Active {
+  color: var(--emw--color-typography, #fff);
+  border-bottom: 2px solid var(--emw--color-typography, #fff);
+  margin-bottom: -2px;
+}
+
+.HistoryWrapper {
+  padding: 0 24px;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: hidden;
+}
+.HistoryWrapper .HistoryEmptyMessage {
+  margin-top: 8px;
+  font-size: var(--emw--font-size-small, 14px);
+  color: var(--emw--color-secondary, #bbb9c3);
+  line-height: 30px;
+}
+.HistoryWrapper .HistoryCols {
+  padding: 12px 10px;
+  position: relative;
+  display: flex;
+  border-bottom: 1px solid var(--emw--color-secondary, #666178);
+  font-size: var(--emw--font-size-x-small, 12px);
+}
+.HistoryWrapper .HistoryCols .HistoryColName {
+  color: var(--emw--color-secondary, #bbb9c3);
+}
+.HistoryWrapper .HistoryCols .Rewards {
+  flex-basis: 80px;
+}
+.HistoryWrapper .HistoryCols .Issued {
+  flex-basis: 80px;
+}
+.HistoryWrapper .HistoryLoader {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  height: inherit;
+  font-size: var(--emw--font-size-medium, 16px);
+  color: var(--emw--color-gray-150, #8f8b9c);
+}
+.HistoryWrapper .HistoryLoader casino-engagement-suite-progress-bar {
+  margin-bottom: 8px;
+  width: 100px;
+}
+.HistoryWrapper .HistoryListItem {
+  margin-top: 8px;
+}
+.HistoryWrapper .HistoryListItem.Opened .EngagementSuiteIconButton.ArrowDown {
+  transform: rotate(180deg);
+}
+.HistoryWrapper .HistoryListItem.Opened .HistoryListItemBody {
+  padding-bottom: 8px;
+  grid-template-rows: 1fr;
+  border-bottom: 1px solid var(--emw--color-secondary, #666178);
+}
+.HistoryWrapper .HistoryListItem .HistoryListItemHeader {
+  padding: 16px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  color: var(--emw--color-typography, #ffffff);
+  font-size: var(--emw--font-size-medium, 14px);
+}
+.HistoryWrapper .HistoryListItem .EngagementSuiteIconButton.ArrowDown {
+  transition: transform 0.3s ease-out;
+  width: 24px;
+  height: 24px;
+}
+.HistoryWrapper .HistoryListItem .HistoryListItemBody {
+  position: relative;
+  display: grid;
+  grid-template-rows: 0fr;
+  transition: grid-template-rows 0.3s ease-out;
+}
+.HistoryWrapper .HistoryListItem .HistoryListItemBody > div {
+  overflow: hidden;
+}
+.HistoryWrapper .HistoryListItem .HistoryListItemCard {
+  padding: 12px 5px;
+}
+.HistoryWrapper .HistoryListItem .HistoryInfoRow {
+  display: flex;
+  gap: 10px;
+  flex-direction: column;
+}
+.HistoryWrapper .HistoryListItem .HistoryInfo {
+  display: flex;
+  padding: 10px;
+  font-size: var(--emw--font-size-x-small, 12px);
+  color: var(--emw--color-secondary, #bbb9c3);
+}
+.HistoryWrapper .HistoryListItem .HistoryInfo .HistoryCol {
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.HistoryWrapper .HistoryListItem .HistoryInfo .Rewards {
+  color: var(--emw--color-typography, #ffffff);
+  flex-basis: 80px;
+  font-weight: 600;
+}
+.HistoryWrapper .HistoryListItem .HistoryInfo .Issued {
+  flex-basis: 80px;
+}