@everymatrix/bonus-powerups-ingame-games 0.0.1

package/dist/cjs/index.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const bonusPowerupsIngameGames = require('./bonus-powerups-ingame-games-7de80a10.js');
+require('./index-e3184c85.js');
+
+
+
+exports.BonusPowerupsIngameGames = bonusPowerupsIngameGames.BonusPowerupsIngameGames;

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-e3184c85.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([["bonus-powerups-ingame-games_3.cjs",[[1,"bonus-powerups-ingame-games",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"powerupId":[513,"powerup-id"],"isLoadingGames":[32],"powerUpGames":[32],"powerUp":[32],"limit":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/assets/Arrow Curve Left.svg

@@ -0,0 +1,11 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_4119_5439)">
+<path d="M11.1533 12.8332C11.8242 11.9932 12.25 10.9315 12.25 9.759C12.25 6.959 9.7475 4.6665 6.69667 4.6665H1.75" stroke="white" stroke-width="0.952264" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.25 1.16699L1.75 4.66699L5.25 8.16699" stroke="white" stroke-width="0.952264" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_4119_5439">
+<rect width="14" height="14" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/assets/double-right.svg

@@ -0,0 +1,4 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.33398 2.3335L7.00065 7.00016L2.33398 11.6668" stroke="white" stroke-width="0.952264" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7 2.3335L11.6667 7.00016L7 11.6668" stroke="white" stroke-width="0.952264" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/collection/assets/gotoPage.svg

@@ -0,0 +1,3 @@
+<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.87935 2.15646e-07L4 4.54064e-07C4.27614 4.54064e-07 4.5 0.223858 4.5 0.5C4.5 0.776143 4.27614 1 4 1H2.9C2.47171 1 2.18056 1.00039 1.95552 1.01878C1.73631 1.03669 1.62421 1.06915 1.54601 1.10899C1.35785 1.20487 1.20487 1.35785 1.10899 1.54601C1.06915 1.62421 1.03669 1.73631 1.01878 1.95552C1.00039 2.18056 1 2.47171 1 2.9V7.1C1 7.52829 1.00039 7.81944 1.01878 8.04448C1.03669 8.26369 1.06915 8.37579 1.10899 8.45399C1.20487 8.64215 1.35785 8.79513 1.54601 8.89101C1.62421 8.93085 1.73631 8.96331 1.95552 8.98122C2.18056 8.99961 2.47171 9 2.9 9H7.1C7.52829 9 7.81944 8.99961 8.04448 8.98122C8.26369 8.96331 8.37579 8.93085 8.45399 8.89101C8.64215 8.79513 8.79513 8.64215 8.89101 8.45399C8.93085 8.37579 8.96331 8.26369 8.98122 8.04448C8.99961 7.81944 9 7.52829 9 7.1V6C9 5.72386 9.22386 5.5 9.5 5.5C9.77614 5.5 10 5.72386 10 6V7.12066C10 7.52314 10 7.85532 9.9779 8.12591C9.95494 8.40696 9.90566 8.66531 9.78201 8.90798C9.59027 9.28431 9.28431 9.59027 8.90798 9.78201C8.66531 9.90566 8.40696 9.95494 8.12591 9.9779C7.85532 10 7.52314 10 7.12066 10H2.87934C2.47686 10 2.14468 10 1.87409 9.9779C1.59304 9.95494 1.33469 9.90566 1.09202 9.78201C0.715696 9.59027 0.409734 9.28431 0.217988 8.90798C0.094342 8.66531 0.0450599 8.40696 0.0220973 8.12591C-1.14068e-05 7.85532 -6.16205e-06 7.52314 2.15646e-07 7.12065V2.87935C-6.16205e-06 2.47687 -1.14068e-05 2.14469 0.0220973 1.87409C0.0450599 1.59304 0.094342 1.33469 0.217987 1.09202C0.409734 0.715695 0.715695 0.409734 1.09202 0.217987C1.33469 0.094342 1.59304 0.0450599 1.87409 0.0220973C2.14469 -1.14068e-05 2.47687 -6.16205e-06 2.87935 2.15646e-07ZM5.99999 0.500005C5.99999 0.223863 6.22385 5.22244e-06 6.49999 5.22244e-06H9.49999C9.77613 5.22244e-06 9.99999 0.223863 9.99999 0.500005L9.99999 3.5C9.99999 3.77615 9.77613 4 9.49999 4.00001C9.22385 4.00001 8.99999 3.77615 8.99999 3.50001L8.99999 1.70711L5.35355 5.35355C5.15829 5.54882 4.84171 5.54882 4.64645 5.35355C4.45119 5.15829 4.45118 4.84171 4.64645 4.64645L8.29288 1.00001H6.49999C6.22385 1.00001 5.99999 0.776148 5.99999 0.500005Z" fill="#00B541"/>
+</svg>

package/dist/collection/assets/return.svg

@@ -0,0 +1,15 @@
+<svg width="14" height="14" viewBox="0 0 14 14"
+     fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#clip0_4119_5439)">
+    <path d="M11.1533 12.8332C11.8242 11.9932 12.25 10.9315 12.25 9.759C12.25 6.959 9.7475 4.6665 6.69667 4.6665H1.75"
+          stroke="currentColor" stroke-width="0.952264" stroke-miterlimit="10" stroke-linecap="round"
+          stroke-linejoin="round" />
+    <path d="M5.25 1.16699L1.75 4.66699L5.25 8.16699" stroke="currentColor" stroke-width="0.952264" stroke-miterlimit="10"
+          stroke-linecap="round" stroke-linejoin="round" />
+  </g>
+  <defs>
+    <clipPath id="clip0_4119_5439">
+      <rect width="14" height="14" fill="white" />
+    </clipPath>
+  </defs>
+</svg>

package/dist/collection/collection-manifest.json

@@ -0,0 +1,25 @@
+{
+  "entries": [
+    "components/bonus-powerups-ingame-games/bonus-powerups-ingame-games.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.19.2",
+    "typescriptVersion": "5.4.5"
+  },
+  "collections": [
+    {
+      "name": "@everymatrix/ui-image",
+      "tags": [
+        "ui-image"
+      ]
+    },
+    {
+      "name": "@everymatrix/ui-skeleton",
+      "tags": [
+        "ui-skeleton"
+      ]
+    }
+  ],
+  "bundles": []
+}

package/dist/collection/components/bonus-powerups-ingame-games/bonus-powerups-ingame-games.css

@@ -0,0 +1,279 @@
+:host {
+  display: block;
+  height: 100%;
+  --game-amount-line: 3;
+}
+
+.IngamePowerUpGamesContainer {
+  height: 100%;
+  display: flex;
+  padding: var(--emw--ingame-power-container-padding, 8px);
+  justify-content: flex-start;
+  flex-direction: column;
+}
+.IngamePowerUpGamesContainer .CircleLinearBorder {
+  background: rgba(9, 9, 9, 0.5019607843);
+  position: relative;
+  width: 26px;
+  height: 26px;
+  border-radius: 20px;
+  background: none;
+  overflow: hidden;
+  border: 1.5px solid transparent;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.IngamePowerUpGamesContainer .CircleLinearBorder svg {
+  border-radius: 20px;
+  padding: 4.5px;
+  background: var(--emw--ingame-color-powerup-bg, rgba(9, 9, 9, 0.8980392157));
+  z-index: 1;
+}
+.IngamePowerUpGamesContainer .CircleLinearBorder::before {
+  content: "";
+  position: absolute;
+  top: -1.5px;
+  left: -1.5px;
+  right: -1.5px;
+  bottom: -1.5px;
+  z-index: -1;
+  border-radius: 21.5px;
+  background: linear-gradient(0deg, var(--emw--ingame-color-white10, rgba(255, 255, 255, 0.0666666667)), var(--emw--ingame-color-white10, rgba(255, 255, 255, 0.0666666667))), linear-gradient(35.22deg, var(--emw--ingame-color-white10, rgba(255, 255, 255, 0)), var(--emw--ingame-color-white30, rgba(255, 255, 255, 0.5490196078)) 89.19%);
+}
+.IngamePowerUpGamesContainer .TopBar, .IngamePowerUpGamesContainer .Loading {
+  padding: 15px;
+}
+.IngamePowerUpGamesContainer .TopBar {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+}
+.IngamePowerUpGamesContainer .TopBar .ReturnIcon {
+  width: 26px;
+  height: 26px;
+  display: flex;
+  border-radius: 20px;
+  padding: 0;
+  backdrop-filter: blur(13.7647px);
+  justify-content: center;
+  align-items: center;
+}
+.IngamePowerUpGamesContainer .TopBar .ReturnIcon svg {
+  color: var(--emw--ingame-color-white60, #f0f0f0);
+}
+.IngamePowerUpGamesContainer .TopBar .Title {
+  font-weight: 600;
+  font-size: 0.9rem;
+  line-height: 100%;
+  text-align: center;
+  vertical-align: middle;
+  color: var(--emw--ingame-color-neutural-95, #EDEFF2);
+  display: flex;
+  flex-direction: row;
+}
+.IngamePowerUpGamesContainer .TopBar .Title .Name {
+  font-size: 1.1rem;
+}
+.IngamePowerUpGamesContainer .TopBar .Title .Label {
+  font-size: 1.1rem;
+  font-weight: bold;
+  color: var(--emw--ingame-color-neutural-95, #EDEFF2);
+}
+.IngamePowerUpGamesContainer .TopBar .TextContent {
+  font-weight: 400;
+  font-size: 0.9rem;
+  line-height: 1.1rem;
+  vertical-align: middle;
+  color: var(--emw--ingame-color-white70, rgba(255, 255, 255, 0.6980392157));
+}
+.IngamePowerUpGamesContainer .GamesWrapper {
+  height: calc(100% - 90px);
+  overflow: hidden;
+  width: 100%;
+  margin-bottom: 10px;
+  scrollbar-width: thin;
+  scrollbar-color: var(--emw--color-background, hsl(254, 8.53%, 54.93%)) transparent;
+}
+.IngamePowerUpGamesContainer .Games {
+  overflow: auto;
+  scrollbar-width: thin;
+  scrollbar-color: var(--emw--color-background, hsl(254, 8.53%, 54.93%)) transparent;
+}
+.IngamePowerUpGamesContainer .GamesList {
+  display: flex;
+  height: 100%;
+  justify-content: center;
+  flex: 1;
+  overflow-y: auto;
+  scrollbar-width: thin;
+  scrollbar-color: var(--emw--background-gray-color, gray) transparent;
+}
+.IngamePowerUpGamesContainer .GamesList::-webkit-scrollbar-track {
+  background-color: transparent;
+  border-radius: 5px;
+}
+.IngamePowerUpGamesContainer .GamesList .Games {
+  padding: 15px;
+  display: flex;
+  align-items: flex-start;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+  gap: calc(30px / (var(--game-amount-line, 3) - 1));
+}
+.IngamePowerUpGamesContainer .GamesList .Games .Game {
+  width: calc((100% - 30px) / var(--game-amount-line, 3));
+  cursor: pointer;
+  position: relative;
+}
+.IngamePowerUpGamesContainer .GamesList .Games .Game:hover .mask-filter {
+  opacity: 1;
+}
+.IngamePowerUpGamesContainer .GamesList .Games .Game:hover img {
+  opacity: 0.4;
+  filter: blur(1.5px);
+}
+.IngamePowerUpGamesContainer .GamesList .Games .Game:hover .GameMask {
+  mix-blend-mode: screen;
+  background-color: var(--emw--color-powup-green, #24B24E);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  width: 100%;
+  opacity: 1;
+  left: 0;
+  height: 100%;
+  top: 0;
+  border-radius: 8px;
+}
+.IngamePowerUpGamesContainer .GamesList .Games .Game:hover .GameMask .GameStartBtn {
+  opacity: 1;
+}
+.IngamePowerUpGamesContainer .GameMask {
+  display: none;
+  transition: display;
+  transition-duration: 0.2s;
+  opacity: 0;
+  position: absolute;
+  width: 70%;
+  height: 100%;
+}
+.IngamePowerUpGamesContainer .GameMask .GameStartBtn {
+  width: 80px;
+  height: 22px;
+  border-radius: 8px;
+  opacity: 1;
+  padding: 4px 5px;
+  background: linear-gradient(180deg, var(--emw--color-powup-green, #24B24E) 0%, var(--emw--color-powup-light-green, #18CE51) 100%);
+  border: 1px solid var(--emw--ingame-color-white, #FFFFFF);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  cursor: pointer;
+}
+.IngamePowerUpGamesContainer .GameMask .GameStartBtn .PlayIcon {
+  background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.5 1C3.01472 1 1 3.01472 1 5.5C1 7.98528 3.01472 10 5.5 10C7.98528 10 10 7.98528 10 5.5C10 3.01472 7.98528 1 5.5 1ZM0 5.5C0 2.46243 2.46243 0 5.5 0C8.53757 0 11 2.46243 11 5.5C11 8.53757 8.53757 11 5.5 11C2.46243 11 0 8.53757 0 5.5ZM5.12255 3.21652C5.12728 3.21956 5.13199 3.22259 5.13668 3.22561L7.49698 4.74294C7.50129 4.74571 7.50562 4.74849 7.50998 4.75129C7.58551 4.79982 7.66805 4.85285 7.73381 4.90413C7.80355 4.95852 7.91363 5.05446 7.97854 5.20809C8.0574 5.39471 8.0574 5.60529 7.97854 5.79191C7.91363 5.94554 7.80355 6.04148 7.73381 6.09587C7.66805 6.14715 7.58551 6.20018 7.50998 6.24871C7.50562 6.25151 7.50129 6.25429 7.49698 6.25706L5.13668 7.77439C5.13199 7.77741 5.12727 7.78045 5.12255 7.78348C5.03469 7.84 4.9423 7.89941 4.86094 7.94176C4.77909 7.98436 4.63056 8.05332 4.44657 8.04018C4.22957 8.02468 4.02999 7.91572 3.89961 7.74157C3.78907 7.59391 3.76675 7.43167 3.75832 7.33979C3.74995 7.24844 3.74997 7.1386 3.75 7.03414C3.75 7.02852 3.75 7.02292 3.75 7.01733V3.98267C3.75 3.97708 3.75 3.97148 3.75 3.96586C3.74997 3.8614 3.74995 3.75156 3.75832 3.66021C3.76675 3.56833 3.78907 3.40609 3.89961 3.25843C4.02999 3.08428 4.22957 2.97532 4.44657 2.95982C4.63056 2.94668 4.77909 3.01564 4.86094 3.05824C4.94231 3.10059 5.03469 3.16001 5.12255 3.21652ZM4.75 4.16583V6.83417L6.82537 5.5L4.75 4.16583Z" fill="white"/> <path d="M4.75 6.83417V4.16583L6.82537 5.5L4.75 6.83417Z" fill="white"/></svg>');
+  height: 16px;
+  width: 16px;
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+
+.Games .Container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  justify-content: center;
+  height: calc(100% - 120px);
+  overflow: auto;
+}
+.Games .Container .Game {
+  width: 105px;
+}
+
+@keyframes smart-animate1 {
+  0% {
+    opacity: 0.15;
+    transform: translateX(0px);
+  }
+  35% {
+    opacity: 1;
+    transform: translateX(36px);
+  }
+  75% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  100% {
+    opacity: 0.15;
+    transform: translateX(0px);
+  }
+}
+@keyframes smart-animate2 {
+  0% {
+    opacity: 1;
+  }
+  35% {
+    opacity: 0.15;
+  }
+  75% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes smart-animate3 {
+  0% {
+    opacity: 0.5;
+    transform: translateX(0px);
+  }
+  35% {
+    opacity: 0.15;
+    transform: translateX(-36px);
+  }
+  75% {
+    opacity: 0.15;
+    transform: translateX(0px);
+  }
+  100% {
+    opacity: 0.5;
+    transform: translateX(0px);
+  }
+}
+.smart-loader {
+  margin: 50px auto;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  width: 100px;
+  gap: 10px;
+}
+.smart-loader .smart-item {
+  width: 3px;
+  height: 20px;
+  opacity: 0.15;
+  animation-delay: 200ms;
+  animation-duration: 1000ms;
+  animation-timing-function: ease-out;
+  animation-fill-mode: forwards;
+  padding: 1px;
+  margin: 5px 0;
+  background: var(--emw--ingame-color-powerup-brightgreen, #00FA5A);
+  border-radius: 4px;
+  animation-iteration-count: infinite;
+  animation-direction: normal;
+}
+.smart-loader .smart-item:nth-child(1) {
+  animation-name: smart-animate1;
+}
+.smart-loader .smart-item:nth-child(2) {
+  animation-name: smart-animate2;
+  height: 36px;
+}
+.smart-loader .smart-item:nth-child(3) {
+  animation-name: smart-animate3;
+}