@everymatrix/casino-engagement-suite-luckywheel 0.2.0 → 0.2.2

package/dist/collection/components/casino-engagement-suite-luckywheel/casino-engagement-suite-luckywheel.js

@@ -2,39 +2,10 @@ import { __rest } from "tslib";
 import { h } from "@stencil/core";
 import { SvgCalc } from "../../utils/class.svgcalc";
 import { Lang } from "../../utils/types";
-import { getOptions, isSafari, setProps } from "../../utils/utils";
+import { getOptions, setProps } from "../../utils/utils";
 import { Spinner } from "../../utils/class.spinner";
 export class CasinoEngagementSuiteLuckywheel {
     constructor() {
-        /**
-         * Client custom styling via string
-         */
-        this.clientStyling = '';
-        /**
-         * Client custom styling via url
-         */
-        this.clientStylingUrl = '';
-        /**
-         * Language of the widget
-         */
-        this.language = 'en';
-        /**
-         * User's device type
-         */
-        this.device = 'Mobile';
-        /**
-         * Wheel size
-         */
-        this.size = '440';
-        /**
-         * Content Direction
-         */
-        this.contentdirection = 'anticlockwise';
-        this.limitStylingAppends = false;
-        this.isPartitionsCustomableReady = false;
-        this.isSpinning = false;
-        this.radius = 0.85 * Number(this.size) / 2;
-        this.speed = 0;
         this.setClientStyling = () => {
             let sheet = document.createElement('style');
             sheet.innerHTML = this.clientStyling;
@@ -54,14 +25,14 @@ export class CasinoEngagementSuiteLuckywheel {
             });
         };
         this.renderImage = (node, index) => {
-            const image = this.options[index].image;
+            const image = this.options[index].Image;
             setProps(image, this.settings.getSvgImageProps(index));
             node.innerHTML = null;
             node.appendChild(image);
         };
         this.updateSpinable = () => {
-            if (!!this.luckywheel.current) {
-                if (Number(this.luckywheel.current.remainingTimes) > 0) {
+            if (!!this.luckywheel.Current) {
+                if (Number(this.luckywheel.Current.RemainingTimes) > 0) {
                     this.spinable = true;
                     return;
                 }
@@ -81,40 +52,43 @@ export class CasinoEngagementSuiteLuckywheel {
             this.spinner.launch();
             window.postMessage({
                 type: 'SpinLuckyWheel',
-                lotteryProgramID: this.luckywheel.program.id,
+                data: {
+                    lotteryProgramID: this.luckywheel.Program.Id,
+                }
             });
-            // todo: this code below simulates the server response, 
-            // delete after implementation with GLС
-            setTimeout(() => {
-                window.postMessage({
-                    type: 'SpinLuckyWheelRes',
-                    data: {
-                        item: { result: { wheelOfFortunePartitionIndex: 1 } },
-                        success: false
-                    }
-                });
-            }, 2500);
-        };
-        this.handleSpinClick = () => {
-            if (isSafari()) {
-                return;
-            }
-            this.eventSpin();
         };
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.language = 'en';
+        this.device = 'Mobile';
+        this.luckywheel = undefined;
+        this.size = '440';
+        this.contentdirection = 'anticlockwise';
+        this.limitStylingAppends = false;
+        this.isPartitionsCustomableReady = false;
+        this.isSpinning = false;
+        this.options = undefined;
+        this.radius = 0.85 * Number(this.size) / 2;
+        this.speed = 0;
+        this.settings = undefined;
+        this.svg = undefined;
+        this.spinContainer = undefined;
+        this.spinable = undefined;
+        this.spinner = undefined;
     }
     handleEvent(e) {
         const _a = e === null || e === void 0 ? void 0 : e.data, { type } = _a, rest = __rest(_a, ["type"]);
         switch (type) {
             case 'SpinLuckyWheelRes':
-                this.spinner.halt(this.settings.getDeg(rest.data.item.result.wheelOfFortunePartitionIndex), () => {
+                this.spinner.halt(this.settings.getDeg(rest.data.Result.WheelOfFortunePartitionIndex), () => {
                     this.isSpinning = false;
                     this.updateSpinable();
-                    const prizeText = this.luckywheel.program.wheelOfFortune.partitions[rest.data.item.result.wheelOfFortunePartitionIndex].prizeText;
+                    const prizeText = this.luckywheel.Program.WheelOfFortune.Partitions[rest.data.Result.WheelOfFortunePartitionIndex].PrizeText;
                     window.postMessage({
                         type: 'ShowLuckywheelRewardModal',
                         data: {
                             PrizeMessage: prizeText['en'] || prizeText['*'],
-                            HasError: rest.data.success,
+                            HasError: rest.success,
                         }
                     });
                 });
@@ -163,20 +137,20 @@ export class CasinoEngagementSuiteLuckywheel {
     render() {
         const sizeProps = { height: this.size, width: this.size };
         const foreignObjectAgentProps = { 'height': `${this.size}px`, 'width': `${this.size}px` };
-        return (h("div", { key: '8d964d9a81690d2a22240cb1355abb3c7cf6f665', class: `WheelContainer ${this.device}`, style: this.defineGeneralVariables() }, h("svg", { key: '92f44f4659874e1fedaffa32813c57d1c9c04440', width: this.size, height: this.size, ref: (el) => { this.svg = el; } }, h("foreignObject", Object.assign({ key: 'f042214f1516c688035f650a92ff1437c5d06a36' }, sizeProps, { class: "Bottom Customable" }), h("div", { key: '6c80c40dfdb80159d75af8f70a75604257039c53', style: foreignObjectAgentProps })), h("g", Object.assign({ key: '46c01589f440c19727c8364d5e1bdb3a90082cac', class: "PartitionsContainer" }, this.settings.getSpinnerProps()), h("g", { key: 'fd0e9a65b7ba25db742ff12bb26e389b8d72e4c7', class: "PartitionsBackgrounds" }, this.options.map((_el, index) => {
+        return (h("div", { key: '014cf34ad67ed718b064797ec5497f93cd8e8fc8', class: `WheelContainer ${this.device}`, style: this.defineGeneralVariables() }, h("svg", { key: 'b7eedc15f6290740b3cfa85b784dcb3ed6c59b9b', width: this.size, height: this.size, ref: (el) => { this.svg = el; } }, h("foreignObject", Object.assign({ key: 'ae62d34ee98360bd6da52cad54819813fb714555' }, sizeProps, { class: "Bottom Customable" }), h("div", { key: 'ec3ae09161a1a20956ebf9bb91340c3f77647770', style: foreignObjectAgentProps })), h("g", Object.assign({ key: 'ca9edc54e36206aaf04d8645efa9aeb8b2a7aa9a', class: "PartitionsContainer" }, this.settings.getSpinnerProps()), h("g", { key: '99ca797756be5a290f0951127904489ad6b21c9e', class: "PartitionsBackgrounds" }, this.options.map((_el, index) => {
             return (h("foreignObject", { "clip-path": `url(#clip${index})`, class: "PartitionBackground Customable", style: { '--index': index.toString() }, width: this.size, height: this.size }, h("div", { style: foreignObjectAgentProps })));
-        })), h("g", { key: '8c116aa611b92b87b98f23aa344025953a27e90d', class: "PartitionsBackgroundStrokes" }, this.options.map((_el, index) => {
+        })), h("g", { key: 'b197f9f51c2a8a1b2337ae180b987ad0896d42ae', class: "PartitionsBackgroundStrokes" }, this.options.map((_el, index) => {
             return (h("path", Object.assign({ class: "PartitionBackgroundStroke" }, this.settings.getPartitionDraw(index), { width: this.size, height: this.size })));
-        })), h("g", { key: '8907e6529e660e6452328aaa684995719b528ec6', class: "Partitions", style: { filter: this.speed > 0.3 ? `blur(${this.speed}px)` : '' } }, this.options.map((el, index) => {
+        })), h("g", { key: '00435c08f614ae78ab63d2f9fee0c81ff29730ac', class: "Partitions", style: { filter: this.speed > 0.3 ? `blur(${this.speed}px)` : '' } }, this.options.map((el, index) => {
             return ([
-                el.image && (h("g", { class: `PartitionImage PartitionImage${index}`, ref: (el) => this.renderImage(el, index) })),
-                el.name && (h("foreignObject", Object.assign({ class: "PartitionText" }, this.settings.getSvgTextPropsAdjustedByImage(index)), h("div", { class: "PartitionTextEntityContainer" }, h("p", { class: `PartitionTextEntity${this.settings.contentdirection === 'clockwise' ? '' : ' Anticlockwise'}`, innerHTML: el.name }))))
+                el.Image && (h("g", { class: `PartitionImage PartitionImage${index}`, ref: (el) => this.renderImage(el, index) })),
+                el.Name && (h("foreignObject", Object.assign({ class: "PartitionText" }, this.settings.getSvgTextPropsAdjustedByImage(index)), h("div", { class: "PartitionTextEntityContainer" }, h("p", { class: `PartitionTextEntity${this.settings.contentdirection === 'clockwise' ? '' : ' Anticlockwise'}`, innerHTML: el.Name }))))
             ]);
-        }))), h("g", { key: '62cf4e41e77374dd8f8c1af0833a4143e5d45403', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable1': true } }, this.options.map((_el, index) => {
+        }))), h("g", { key: 'a89ea859fd16d72ec6a38c780548a4aade0b26db', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable1': true } }, this.options.map((_el, index) => {
             return (h("foreignObject", Object.assign({ class: "Partition1 Customable", style: { '--index': index.toString() } }, sizeProps), h("div", { style: foreignObjectAgentProps })));
-        })), h("g", { key: '6b0538da5d4f52e4b543205fb64dedda084f81b2', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable2': true } }, this.options.map((_el, index) => {
+        })), h("g", { key: 'b77eaeb0043f72ab39c5bcec7b76543871057c28', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable2': true } }, this.options.map((_el, index) => {
             return (h("foreignObject", Object.assign({ class: "Partition2 Customable", style: { '--index': index.toString() } }, sizeProps), h("div", { style: foreignObjectAgentProps })));
-        })), h("foreignObject", Object.assign({ key: '907db579094a7a192999510ade3150fdadbb94b6', class: "Middle Customable" }, sizeProps), h("div", { key: 'fa66cb96da2f285015fb8afeea5db05313ed832c', style: foreignObjectAgentProps })), h("foreignObject", Object.assign({ key: '688c0d33ad480ea331847286335a88fd74dbbb26', class: "Top Customable" }, sizeProps), h("div", { key: '292f6ea3549322a605fc8c3c61a93addcba00890', style: foreignObjectAgentProps })), h("g", { key: '22368be98007a7fa820cee96c666c363f85cd32a', class: { 'spinning': this.isSpinning, 'Center': true }, onClick: this.handleSpinClick }, h("foreignObject", { key: 'efffd7edb9ed21d5bd93896a4bead8931d91ff1f', x: Number(this.size) / 2 - 100 / 2, y: Number(this.size) / 2 - 100 / 2, width: 100, height: 100 })), h("g", { key: '7d8b741cc21d6d07f5736336f147cef2bfdf90ca' }, this.options.map((_el, index) => {
+        })), h("foreignObject", Object.assign({ key: 'f5fbab79d3c2867c20d9aa05a026be3838fcd39b', class: "Middle Customable" }, sizeProps), h("div", { key: 'b6ad416c3ebfd53e2cbbec6de17b085424a15b0e', style: foreignObjectAgentProps })), h("foreignObject", Object.assign({ key: 'fafc4d94ce9fd81eb57cef4670d0a2bee763128a', class: "Top Customable" }, sizeProps), h("div", { key: 'e1fd86da7c3657863271643354bdf6bd8a325791', style: foreignObjectAgentProps })), h("g", { key: '383cf401f171986ec7799e98ca048b8aca8dea83', class: { 'spinning': this.isSpinning, 'Center': true }, onClick: this.eventSpin }, h("foreignObject", { key: '13f1eecbb754f80c6a649f4a57339ae84f4fb09e', x: Number(this.size) / 2 - 100 / 2, y: Number(this.size) / 2 - 100 / 2, width: 100, height: 100 })), h("g", { key: 'b739f94ed6f4d63eeb30ee2c905ad638fa79694a' }, this.options.map((_el, index) => {
             return (h("clipPath", { id: `clip${index}` }, h("path", Object.assign({}, this.settings.getPartitionDraw(index)))));
         })))));
     }
@@ -208,8 +182,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "Client custom styling via string"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "client-styling",
                 "reflect": true,
                 "defaultValue": "''"
@@ -228,8 +200,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "Client custom styling via url"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "client-styling-url",
                 "reflect": true,
                 "defaultValue": "''"
@@ -248,8 +218,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "Language of the widget"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "language",
                 "reflect": false,
                 "defaultValue": "'en'"
@@ -268,8 +236,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "User's device type"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "device",
                 "reflect": false,
                 "defaultValue": "'Mobile' as 'Mobile' | 'Tablet' | 'Desktop'"
@@ -293,9 +259,7 @@ export class CasinoEngagementSuiteLuckywheel {
                 "docs": {
                     "tags": [],
                     "text": "Active Luckywheel"
-                },
-                "getter": false,
-                "setter": false
+                }
             },
             "size": {
                 "type": "string",
@@ -311,8 +275,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "Wheel size"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "'440'"
@@ -331,8 +293,6 @@ export class CasinoEngagementSuiteLuckywheel {
                     "tags": [],
                     "text": "Content Direction"
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "contentdirection",
                 "reflect": false,
                 "defaultValue": "'anticlockwise'"

package/dist/collection/utils/utils.js

@@ -68,10 +68,10 @@ export const pointPlus = (point1, point2) => ({
     y: point1.y + point2.y
 });
 const optionCompliment = {
-    image: '',
-    name: 'Thank you',
-    prizeText: '',
-    prizeImage: ''
+    Image: '',
+    Name: 'Thank you',
+    PrizeText: '',
+    PrizeImage: ''
 };
 const getSumProbability = (partitions) => {
     let probabilityAll = 0;
@@ -85,8 +85,8 @@ const getOptionsFromPartitions = (partitions, lang) => {
         const option = {};
         Object.keys(_partition).map((_key) => {
             if (typeof _partition[_key] === 'object' &&
-                _partition[_key].hasOwnProperty('*')) {
-                const targetKey = _key === 'image1' ? 'image' : _key;
+                !!_partition[_key]) {
+                const targetKey = _key === 'Image1' ? 'Image' : _key;
                 option[targetKey] = _partition[_key][lang] || _partition[_key]['*'];
             }
         });
@@ -105,14 +105,14 @@ const preloadImage = async (src) => {
     };
 };
 export const getOptions = async (bonus, lang) => {
-    const { partitions } = bonus.program.wheelOfFortune;
+    const partitions = bonus.Program.WheelOfFortune.Partitions;
     let options = getOptionsFromPartitions(partitions, lang);
     if (isSafari()) {
         options = options.map(option => {
-            if (option.image) {
+            if (option.Image) {
                 const img = document.createElementNS('http://www.w3.org/2000/svg', 'image');
-                img.href.baseVal = option.image;
-                return Object.assign(Object.assign({}, option), { image: img });
+                img.href.baseVal = option.Image;
+                return Object.assign(Object.assign({}, option), { Image: img });
             }
             else {
                 return option;
@@ -120,7 +120,7 @@ export const getOptions = async (bonus, lang) => {
         });
     }
     else {
-        options = await Promise.all(options.map(async (o) => (Object.assign(Object.assign({}, o), (await preloadImage(o.image))))));
+        options = await Promise.all(options.map(async (o) => (Object.assign(Object.assign({}, o), (await preloadImage(o.Image))))));
     }
     return options;
 };

package/dist/esm/{casino-engagement-suite-luckywheel-cf7e798a.js → casino-engagement-suite-luckywheel-88d531c4.js}

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, g as getElement } from './index-8ce51859.js';
+import { r as registerInstance, h, g as getElement } from './index-48c42d04.js';
 
-/******************************************************************************
+/*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -25,12 +25,7 @@ function __rest(s, e) {
                 t[p[i]] = s[p[i]];
         }
     return t;
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
+}
 
 var PointerMode;
 (function (PointerMode) {
@@ -129,10 +124,10 @@ const pointPlus = (point1, point2) => ({
     y: point1.y + point2.y
 });
 const optionCompliment = {
-    image: '',
-    name: 'Thank you',
-    prizeText: '',
-    prizeImage: ''
+    Image: '',
+    Name: 'Thank you',
+    PrizeText: '',
+    PrizeImage: ''
 };
 const getSumProbability = (partitions) => {
     let probabilityAll = 0;
@@ -146,8 +141,8 @@ const getOptionsFromPartitions = (partitions, lang) => {
         const option = {};
         Object.keys(_partition).map((_key) => {
             if (typeof _partition[_key] === 'object' &&
-                _partition[_key].hasOwnProperty('*')) {
-                const targetKey = _key === 'image1' ? 'image' : _key;
+                !!_partition[_key]) {
+                const targetKey = _key === 'Image1' ? 'Image' : _key;
                 option[targetKey] = _partition[_key][lang] || _partition[_key]['*'];
             }
         });
@@ -166,14 +161,14 @@ const preloadImage = async (src) => {
     };
 };
 const getOptions = async (bonus, lang) => {
-    const { partitions } = bonus.program.wheelOfFortune;
+    const partitions = bonus.Program.WheelOfFortune.Partitions;
     let options = getOptionsFromPartitions(partitions, lang);
     if (isSafari()) {
         options = options.map(option => {
-            if (option.image) {
+            if (option.Image) {
                 const img = document.createElementNS('http://www.w3.org/2000/svg', 'image');
-                img.href.baseVal = option.image;
-                return Object.assign(Object.assign({}, option), { image: img });
+                img.href.baseVal = option.Image;
+                return Object.assign(Object.assign({}, option), { Image: img });
             }
             else {
                 return option;
@@ -181,7 +176,7 @@ const getOptions = async (bonus, lang) => {
         });
     }
     else {
-        options = await Promise.all(options.map(async (o) => (Object.assign(Object.assign({}, o), (await preloadImage(o.image))))));
+        options = await Promise.all(options.map(async (o) => (Object.assign(Object.assign({}, o), (await preloadImage(o.Image))))));
     }
     return options;
 };
@@ -556,35 +551,6 @@ const CasinoEngagementSuiteLuckywheelStyle0 = casinoEngagementSuiteLuckywheelCss
 const CasinoEngagementSuiteLuckywheel = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        /**
-         * Client custom styling via string
-         */
-        this.clientStyling = '';
-        /**
-         * Client custom styling via url
-         */
-        this.clientStylingUrl = '';
-        /**
-         * Language of the widget
-         */
-        this.language = 'en';
-        /**
-         * User's device type
-         */
-        this.device = 'Mobile';
-        /**
-         * Wheel size
-         */
-        this.size = '440';
-        /**
-         * Content Direction
-         */
-        this.contentdirection = 'anticlockwise';
-        this.limitStylingAppends = false;
-        this.isPartitionsCustomableReady = false;
-        this.isSpinning = false;
-        this.radius = 0.85 * Number(this.size) / 2;
-        this.speed = 0;
         this.setClientStyling = () => {
             let sheet = document.createElement('style');
             sheet.innerHTML = this.clientStyling;
@@ -604,14 +570,14 @@ const CasinoEngagementSuiteLuckywheel = class {
             });
         };
         this.renderImage = (node, index) => {
-            const image = this.options[index].image;
+            const image = this.options[index].Image;
             setProps(image, this.settings.getSvgImageProps(index));
             node.innerHTML = null;
             node.appendChild(image);
         };
         this.updateSpinable = () => {
-            if (!!this.luckywheel.current) {
-                if (Number(this.luckywheel.current.remainingTimes) > 0) {
+            if (!!this.luckywheel.Current) {
+                if (Number(this.luckywheel.Current.RemainingTimes) > 0) {
                     this.spinable = true;
                     return;
                 }
@@ -631,40 +597,43 @@ const CasinoEngagementSuiteLuckywheel = class {
             this.spinner.launch();
             window.postMessage({
                 type: 'SpinLuckyWheel',
-                lotteryProgramID: this.luckywheel.program.id,
+                data: {
+                    lotteryProgramID: this.luckywheel.Program.Id,
+                }
             });
-            // todo: this code below simulates the server response, 
-            // delete after implementation with GLС
-            setTimeout(() => {
-                window.postMessage({
-                    type: 'SpinLuckyWheelRes',
-                    data: {
-                        item: { result: { wheelOfFortunePartitionIndex: 1 } },
-                        success: false
-                    }
-                });
-            }, 2500);
-        };
-        this.handleSpinClick = () => {
-            if (isSafari()) {
-                return;
-            }
-            this.eventSpin();
         };
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.language = 'en';
+        this.device = 'Mobile';
+        this.luckywheel = undefined;
+        this.size = '440';
+        this.contentdirection = 'anticlockwise';
+        this.limitStylingAppends = false;
+        this.isPartitionsCustomableReady = false;
+        this.isSpinning = false;
+        this.options = undefined;
+        this.radius = 0.85 * Number(this.size) / 2;
+        this.speed = 0;
+        this.settings = undefined;
+        this.svg = undefined;
+        this.spinContainer = undefined;
+        this.spinable = undefined;
+        this.spinner = undefined;
     }
     handleEvent(e) {
         const _a = e === null || e === void 0 ? void 0 : e.data, { type } = _a, rest = __rest(_a, ["type"]);
         switch (type) {
             case 'SpinLuckyWheelRes':
-                this.spinner.halt(this.settings.getDeg(rest.data.item.result.wheelOfFortunePartitionIndex), () => {
+                this.spinner.halt(this.settings.getDeg(rest.data.Result.WheelOfFortunePartitionIndex), () => {
                     this.isSpinning = false;
                     this.updateSpinable();
-                    const prizeText = this.luckywheel.program.wheelOfFortune.partitions[rest.data.item.result.wheelOfFortunePartitionIndex].prizeText;
+                    const prizeText = this.luckywheel.Program.WheelOfFortune.Partitions[rest.data.Result.WheelOfFortunePartitionIndex].PrizeText;
                     window.postMessage({
                         type: 'ShowLuckywheelRewardModal',
                         data: {
                             PrizeMessage: prizeText['en'] || prizeText['*'],
-                            HasError: rest.data.success,
+                            HasError: rest.success,
                         }
                     });
                 });
@@ -713,20 +682,20 @@ const CasinoEngagementSuiteLuckywheel = class {
     render() {
         const sizeProps = { height: this.size, width: this.size };
         const foreignObjectAgentProps = { 'height': `${this.size}px`, 'width': `${this.size}px` };
-        return (h("div", { key: '8d964d9a81690d2a22240cb1355abb3c7cf6f665', class: `WheelContainer ${this.device}`, style: this.defineGeneralVariables() }, h("svg", { key: '92f44f4659874e1fedaffa32813c57d1c9c04440', width: this.size, height: this.size, ref: (el) => { this.svg = el; } }, h("foreignObject", Object.assign({ key: 'f042214f1516c688035f650a92ff1437c5d06a36' }, sizeProps, { class: "Bottom Customable" }), h("div", { key: '6c80c40dfdb80159d75af8f70a75604257039c53', style: foreignObjectAgentProps })), h("g", Object.assign({ key: '46c01589f440c19727c8364d5e1bdb3a90082cac', class: "PartitionsContainer" }, this.settings.getSpinnerProps()), h("g", { key: 'fd0e9a65b7ba25db742ff12bb26e389b8d72e4c7', class: "PartitionsBackgrounds" }, this.options.map((_el, index) => {
+        return (h("div", { key: '014cf34ad67ed718b064797ec5497f93cd8e8fc8', class: `WheelContainer ${this.device}`, style: this.defineGeneralVariables() }, h("svg", { key: 'b7eedc15f6290740b3cfa85b784dcb3ed6c59b9b', width: this.size, height: this.size, ref: (el) => { this.svg = el; } }, h("foreignObject", Object.assign({ key: 'ae62d34ee98360bd6da52cad54819813fb714555' }, sizeProps, { class: "Bottom Customable" }), h("div", { key: 'ec3ae09161a1a20956ebf9bb91340c3f77647770', style: foreignObjectAgentProps })), h("g", Object.assign({ key: 'ca9edc54e36206aaf04d8645efa9aeb8b2a7aa9a', class: "PartitionsContainer" }, this.settings.getSpinnerProps()), h("g", { key: '99ca797756be5a290f0951127904489ad6b21c9e', class: "PartitionsBackgrounds" }, this.options.map((_el, index) => {
             return (h("foreignObject", { "clip-path": `url(#clip${index})`, class: "PartitionBackground Customable", style: { '--index': index.toString() }, width: this.size, height: this.size }, h("div", { style: foreignObjectAgentProps })));
-        })), h("g", { key: '8c116aa611b92b87b98f23aa344025953a27e90d', class: "PartitionsBackgroundStrokes" }, this.options.map((_el, index) => {
+        })), h("g", { key: 'b197f9f51c2a8a1b2337ae180b987ad0896d42ae', class: "PartitionsBackgroundStrokes" }, this.options.map((_el, index) => {
             return (h("path", Object.assign({ class: "PartitionBackgroundStroke" }, this.settings.getPartitionDraw(index), { width: this.size, height: this.size })));
-        })), h("g", { key: '8907e6529e660e6452328aaa684995719b528ec6', class: "Partitions", style: { filter: this.speed > 0.3 ? `blur(${this.speed}px)` : '' } }, this.options.map((el, index) => {
+        })), h("g", { key: '00435c08f614ae78ab63d2f9fee0c81ff29730ac', class: "Partitions", style: { filter: this.speed > 0.3 ? `blur(${this.speed}px)` : '' } }, this.options.map((el, index) => {
             return ([
-                el.image && (h("g", { class: `PartitionImage PartitionImage${index}`, ref: (el) => this.renderImage(el, index) })),
-                el.name && (h("foreignObject", Object.assign({ class: "PartitionText" }, this.settings.getSvgTextPropsAdjustedByImage(index)), h("div", { class: "PartitionTextEntityContainer" }, h("p", { class: `PartitionTextEntity${this.settings.contentdirection === 'clockwise' ? '' : ' Anticlockwise'}`, innerHTML: el.name }))))
+                el.Image && (h("g", { class: `PartitionImage PartitionImage${index}`, ref: (el) => this.renderImage(el, index) })),
+                el.Name && (h("foreignObject", Object.assign({ class: "PartitionText" }, this.settings.getSvgTextPropsAdjustedByImage(index)), h("div", { class: "PartitionTextEntityContainer" }, h("p", { class: `PartitionTextEntity${this.settings.contentdirection === 'clockwise' ? '' : ' Anticlockwise'}`, innerHTML: el.Name }))))
             ]);
-        }))), h("g", { key: '62cf4e41e77374dd8f8c1af0833a4143e5d45403', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable1': true } }, this.options.map((_el, index) => {
+        }))), h("g", { key: 'a89ea859fd16d72ec6a38c780548a4aade0b26db', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable1': true } }, this.options.map((_el, index) => {
             return (h("foreignObject", Object.assign({ class: "Partition1 Customable", style: { '--index': index.toString() } }, sizeProps), h("div", { style: foreignObjectAgentProps })));
-        })), h("g", { key: '6b0538da5d4f52e4b543205fb64dedda084f81b2', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable2': true } }, this.options.map((_el, index) => {
+        })), h("g", { key: 'b77eaeb0043f72ab39c5bcec7b76543871057c28', class: { 'active': this.isPartitionsCustomableReady, 'PartitionsCustomable2': true } }, this.options.map((_el, index) => {
             return (h("foreignObject", Object.assign({ class: "Partition2 Customable", style: { '--index': index.toString() } }, sizeProps), h("div", { style: foreignObjectAgentProps })));
-        })), h("foreignObject", Object.assign({ key: '907db579094a7a192999510ade3150fdadbb94b6', class: "Middle Customable" }, sizeProps), h("div", { key: 'fa66cb96da2f285015fb8afeea5db05313ed832c', style: foreignObjectAgentProps })), h("foreignObject", Object.assign({ key: '688c0d33ad480ea331847286335a88fd74dbbb26', class: "Top Customable" }, sizeProps), h("div", { key: '292f6ea3549322a605fc8c3c61a93addcba00890', style: foreignObjectAgentProps })), h("g", { key: '22368be98007a7fa820cee96c666c363f85cd32a', class: { 'spinning': this.isSpinning, 'Center': true }, onClick: this.handleSpinClick }, h("foreignObject", { key: 'efffd7edb9ed21d5bd93896a4bead8931d91ff1f', x: Number(this.size) / 2 - 100 / 2, y: Number(this.size) / 2 - 100 / 2, width: 100, height: 100 })), h("g", { key: '7d8b741cc21d6d07f5736336f147cef2bfdf90ca' }, this.options.map((_el, index) => {
+        })), h("foreignObject", Object.assign({ key: 'f5fbab79d3c2867c20d9aa05a026be3838fcd39b', class: "Middle Customable" }, sizeProps), h("div", { key: 'b6ad416c3ebfd53e2cbbec6de17b085424a15b0e', style: foreignObjectAgentProps })), h("foreignObject", Object.assign({ key: 'fafc4d94ce9fd81eb57cef4670d0a2bee763128a', class: "Top Customable" }, sizeProps), h("div", { key: 'e1fd86da7c3657863271643354bdf6bd8a325791', style: foreignObjectAgentProps })), h("g", { key: '383cf401f171986ec7799e98ca048b8aca8dea83', class: { 'spinning': this.isSpinning, 'Center': true }, onClick: this.eventSpin }, h("foreignObject", { key: '13f1eecbb754f80c6a649f4a57339ae84f4fb09e', x: Number(this.size) / 2 - 100 / 2, y: Number(this.size) / 2 - 100 / 2, width: 100, height: 100 })), h("g", { key: 'b739f94ed6f4d63eeb30ee2c905ad638fa79694a' }, this.options.map((_el, index) => {
             return (h("clipPath", { id: `clip${index}` }, h("path", Object.assign({}, this.settings.getPartitionDraw(index)))));
         })))));
     }

package/dist/esm/casino-engagement-suite-luckywheel.entry.js

@@ -1,2 +1,2 @@
-export { C as casino_engagement_suite_luckywheel } from './casino-engagement-suite-luckywheel-cf7e798a.js';
-import './index-8ce51859.js';
+export { C as casino_engagement_suite_luckywheel } from './casino-engagement-suite-luckywheel-88d531c4.js';
+import './index-48c42d04.js';

package/dist/esm/casino-engagement-suite-luckywheel.js

@@ -1,9 +1,9 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-8ce51859.js';
-export { s as setNonce } from './index-8ce51859.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-48c42d04.js';
+export { s as setNonce } from './index-48c42d04.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
- Stencil Client Patch Browser v4.26.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.19.2 | MIT Licensed | https://stenciljs.com
  */
 var patchBrowser = () => {
   const importMeta = import.meta.url;