@everymatrix/casino-engagement-suite-modal-container 1.44.0 → 1.45.2
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-modal-container/casino-engagement-suite-modal-container.esm.js +1 -1
- package/dist/casino-engagement-suite-modal-container/p-ac43a734.js +2 -0
- package/dist/casino-engagement-suite-modal-container/p-e1255160.js +1 -0
- package/dist/casino-engagement-suite-modal-container/p-f56ae83a.entry.js +1 -0
- package/dist/cjs/app-globals-3a1e7e63.js +5 -0
- package/dist/cjs/casino-engagement-suite-modal-container.cjs.js +16 -10
- package/dist/cjs/casino-engagement-suite-modal_2.cjs.entry.js +173 -183
- package/dist/cjs/index-00ddb955.js +1279 -0
- package/dist/cjs/loader.cjs.js +6 -12
- package/dist/collection/collection-manifest.json +3 -3
- package/dist/collection/components/casino-engagement-suite-modal-container/casino-engagement-suite-modal-container.css +15 -15
- package/dist/collection/components/casino-engagement-suite-modal-container/casino-engagement-suite-modal-container.js +234 -259
- package/dist/collection/components/casino-engagement-suite-modal-container/index.js +1 -0
- package/dist/collection/utils/locale.utils.js +26 -26
- package/dist/collection/utils/utils.js +2 -2
- package/dist/esm/app-globals-0f993ce5.js +3 -0
- package/dist/esm/casino-engagement-suite-modal-container.js +13 -10
- package/dist/esm/casino-engagement-suite-modal_2.entry.js +173 -183
- package/dist/esm/index-896654aa.js +1251 -0
- package/dist/esm/loader.js +6 -12
- package/dist/stencil.config.dev.js +17 -0
- package/dist/stencil.config.js +14 -19
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/casino-engagement-suite-modal-container/.stencil/packages/stencil/casino-engagement-suite-modal-container/stencil.config.d.ts +2 -0
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/casino-engagement-suite-modal-container/.stencil/packages/stencil/casino-engagement-suite-modal-container/stencil.config.dev.d.ts +2 -0
- package/dist/types/components/casino-engagement-suite-modal-container/casino-engagement-suite-modal-container.d.ts +40 -40
- package/dist/types/components/casino-engagement-suite-modal-container/index.d.ts +1 -0
- package/dist/types/components.d.ts +16 -1
- package/dist/types/models/index.d.ts +8 -8
- package/dist/types/stencil-public-runtime.d.ts +142 -33
- package/loader/cdn.js +1 -3
- package/loader/index.cjs.js +1 -3
- package/loader/index.d.ts +13 -1
- package/loader/index.es2017.js +1 -3
- package/loader/index.js +1 -3
- package/loader/package.json +1 -0
- package/package.json +12 -2
- package/dist/casino-engagement-suite-modal-container/p-b206f149.entry.js +0 -1
- package/dist/casino-engagement-suite-modal-container/p-b944b831.js +0 -1
- package/dist/cjs/index-2394967b.js +0 -1253
- package/dist/components/casino-engagement-suite-modal-container.d.ts +0 -11
- package/dist/components/casino-engagement-suite-modal-container.js +0 -181
- package/dist/components/casino-engagement-suite-modal.js +0 -6
- package/dist/components/casino-engagement-suite-modal2.js +0 -91
- package/dist/components/index.d.ts +0 -26
- package/dist/components/index.js +0 -1
- package/dist/esm/index-89c6c4a4.js +0 -1226
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/casino-engagement-suite-modal-container/.stencil/packages/casino-engagement-suite-modal-container/stencil.config.d.ts +0 -2
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface CasinoEngagementSuiteModalContainer extends Components.CasinoEngagementSuiteModalContainer, HTMLElement {}
|
|
4
|
-
export const CasinoEngagementSuiteModalContainer: {
|
|
5
|
-
prototype: CasinoEngagementSuiteModalContainer;
|
|
6
|
-
new (): CasinoEngagementSuiteModalContainer;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,181 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
-
import { d as defineCustomElement$2 } from './casino-engagement-suite-modal2.js';
|
|
3
|
-
|
|
4
|
-
const DEFAULT_LANGUAGE = 'en';
|
|
5
|
-
const SUPPORTED_LANGUAGES = ['en'];
|
|
6
|
-
const TRANSLATIONS = {
|
|
7
|
-
en: {
|
|
8
|
-
joinHeader: 'Choose another mission?',
|
|
9
|
-
desc: 'Any progress on the current mission will be kept and you can rejoin the mission at any time.',
|
|
10
|
-
joinQuestion: 'Would you still like to join another mission?',
|
|
11
|
-
joinConfirm: 'Yes, join another mission',
|
|
12
|
-
joinReject: 'No, stay at this mission',
|
|
13
|
-
unJoinHeader: 'Quit Mission?',
|
|
14
|
-
unJoinQuestion: 'Would you still like to quit the mission?',
|
|
15
|
-
unJoinConfirm: 'Yes, I want to quit this mission',
|
|
16
|
-
unJoinReject: 'No, stay at this mission',
|
|
17
|
-
join: 'Unjoin',
|
|
18
|
-
unJoin: 'Unjoin',
|
|
19
|
-
continue: 'Continue',
|
|
20
|
-
okContinue: 'Ok, continue',
|
|
21
|
-
won: 'You won',
|
|
22
|
-
supportInfo: 'However, some rewards cannot be issued. Please, contact support.',
|
|
23
|
-
noReward: 'Reward cannot be issued',
|
|
24
|
-
contactSupport: 'Please contact support.',
|
|
25
|
-
noMissions: 'No Missions yet',
|
|
26
|
-
tryOtherGames: 'Try winning Missions as rewards or launching other booster games',
|
|
27
|
-
tooltip: 'Mission where your real money bets contribute towards the level progress to achieve the level reward',
|
|
28
|
-
jackpotWin: 'Total Jackpot Win!',
|
|
29
|
-
jackpotWinInfo: 'Please refresh game page or place any bet to update game balance'
|
|
30
|
-
}
|
|
31
|
-
};
|
|
32
|
-
const translate = (key, customLang) => {
|
|
33
|
-
const lang = customLang;
|
|
34
|
-
return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
function formatBalance(amount, currency) {
|
|
38
|
-
return `${currency} ${new Intl.NumberFormat('en', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
|
|
39
|
-
.format(amount)}`;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
const casinoEngagementSuiteModalContainerCss = ":host{display:block;font-family:inherit}.ModalFooterButton,.ModalFooterButtonOutlined{transition:all 0.5s ease-out;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:var(--emw--color-typography, #1E1638);border-radius:99px;min-width:160px;height:36px;font-size:var(--emw--font-size-small-plus, 16px);font-weight:var(--emw--font-weight-bold, 700);position:relative;font-family:\"Montserrat\", sans-serif;padding:0 12px;box-sizing:border-box;margin:auto;border:none;cursor:pointer}.ModalFooterButtonOutlined{background:linear-gradient(var(--emw--color-background, #1E1638) 0 0) padding-box, linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%) border-box;border:2px solid transparent}.GradientText{background-image:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);color:transparent;background-clip:text}.ManyActions{display:flex;width:100%;flex-direction:column;align-items:stretch}.ManyActions .ModalFooterButton,.ManyActions .ModalFooterButtonOutlined{width:280px}.ManyActions button:first-child{margin-bottom:16px}.Disabled{opacity:0.5;pointer-events:none;cursor:auto}.ModalReward{font-weight:var(--emw--font-weight-semibold, 600);color:var(--emw--color-typography, #FFFFFF);word-break:break-word}.JackpotWinText{margin:0;font-weight:var(--emw--font-weight-bold, 600);font-size:16px;line-height:20px;color:var(--emw--color-typography, #FFF)}.JackpotWinAmount{margin-top:8px;background: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;font-weight:900;font-size:16px;line-height:16px}.JackpotWinInfoText{padding:0 50px;margin-top:20px;font-size:var(--emw--font-size-small, 14px);line-height:16px;color:var(--emw--color-gray-100, #BBB9C3)}.SupportInfo{margin-top:20px}.ModalContainer.Mobile .ModalFooterButton,.ModalContainer.Mobile .ModalFooterButtonOutlined{font-size:var(--emw--font-size-small, 14px);min-width:140px;height:32px}.ModalContainer.Mobile .ManyActions .ModalFooterButton,.ModalContainer.Mobile .ManyActions .ModalFooterButtonOutlined{width:100%;height:32px}.ModalContainer.Mobile .ManyActions button:first-child{margin-bottom:8px}.ModalContainer.Mobile .JackpotWinText{font-size:14px;line-height:16px}.ModalContainer.Mobile .JackpotWinAmount{font-size:14px;line-height:14px}.ModalContainer.Mobile .JackpotWinInfoText{padding:0;margin-top:20px;font-size:var(--emw--font-size-small, 14px);line-height:16px;color:var(--emw--color-gray-100, #BBB9C3)}.LeftAlign,.LeftAlignQuestion{text-align:left;line-height:1.2}.LeftAlignQuestion{margin-top:20px}";
|
|
43
|
-
|
|
44
|
-
const CasinoEngagementSuiteModalContainer$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
45
|
-
constructor() {
|
|
46
|
-
super();
|
|
47
|
-
this.__registerHost();
|
|
48
|
-
this.__attachShadow();
|
|
49
|
-
this.closeModal = createEvent(this, "closeModal", 7);
|
|
50
|
-
/**
|
|
51
|
-
* Client custom styling via string
|
|
52
|
-
*/
|
|
53
|
-
this.clientStyling = '';
|
|
54
|
-
/**
|
|
55
|
-
* Client custom styling via url
|
|
56
|
-
*/
|
|
57
|
-
this.clientStylingUrl = '';
|
|
58
|
-
/**
|
|
59
|
-
* Language of the widget
|
|
60
|
-
*/
|
|
61
|
-
this.language = 'en';
|
|
62
|
-
this.device = 'Mobile';
|
|
63
|
-
this.limitStylingAppends = false;
|
|
64
|
-
this.openModals = [];
|
|
65
|
-
this.rewardMessage = '';
|
|
66
|
-
this.hasError = false;
|
|
67
|
-
this.confirmationData = null;
|
|
68
|
-
this.winAmount = { amount: 0, currency: '' };
|
|
69
|
-
this.handleCloseClick = (e) => {
|
|
70
|
-
const type = e.currentTarget.getAttribute('data-type');
|
|
71
|
-
this.closeModal.emit(type);
|
|
72
|
-
};
|
|
73
|
-
this.handleChallengeAttendance = () => {
|
|
74
|
-
window.postMessage({
|
|
75
|
-
type: 'ChallengeJoinRequest',
|
|
76
|
-
data: this.confirmationData,
|
|
77
|
-
});
|
|
78
|
-
};
|
|
79
|
-
this.setClientStyling = () => {
|
|
80
|
-
let sheet = document.createElement('style');
|
|
81
|
-
sheet.innerHTML = this.clientStyling;
|
|
82
|
-
this.host.prepend(sheet);
|
|
83
|
-
};
|
|
84
|
-
this.setClientStylingURL = () => {
|
|
85
|
-
let url = new URL(this.clientStylingUrl);
|
|
86
|
-
let cssFile = document.createElement('style');
|
|
87
|
-
fetch(url.href)
|
|
88
|
-
.then((res) => res.text())
|
|
89
|
-
.then((data) => {
|
|
90
|
-
cssFile.innerHTML = data;
|
|
91
|
-
setTimeout(() => { this.host.prepend(cssFile); }, 1);
|
|
92
|
-
})
|
|
93
|
-
.catch((err) => {
|
|
94
|
-
console.log('Error ', err);
|
|
95
|
-
});
|
|
96
|
-
};
|
|
97
|
-
this.isModalOpen = (type) => {
|
|
98
|
-
return Boolean(this.openModals.find(el => el === type));
|
|
99
|
-
};
|
|
100
|
-
}
|
|
101
|
-
openModalHandler(event) {
|
|
102
|
-
const { modalType, rewardMessage, hasError, confirmationData, winAmount } = event.detail;
|
|
103
|
-
if (winAmount) {
|
|
104
|
-
// If jackpot win modal is already opened
|
|
105
|
-
// add won amount to the previous amount
|
|
106
|
-
if (this.isModalOpen('JACKPOT_REWARD_MODAL')) {
|
|
107
|
-
this.winAmount = { amount: this.winAmount.amount + winAmount.amount, currency: winAmount.currency };
|
|
108
|
-
}
|
|
109
|
-
else {
|
|
110
|
-
this.winAmount = winAmount;
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
this.openModals = [...this.openModals, modalType];
|
|
114
|
-
this.rewardMessage = rewardMessage;
|
|
115
|
-
this.hasError = hasError;
|
|
116
|
-
if (confirmationData) {
|
|
117
|
-
this.confirmationData = confirmationData;
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
closeModalHandler(event) {
|
|
121
|
-
this.openModals = this.openModals.filter(el => el !== event.detail);
|
|
122
|
-
}
|
|
123
|
-
componentDidRender() {
|
|
124
|
-
if (!this.limitStylingAppends && this.host) {
|
|
125
|
-
if (this.clientStyling)
|
|
126
|
-
this.setClientStyling();
|
|
127
|
-
if (this.clientStylingUrl)
|
|
128
|
-
this.setClientStylingURL();
|
|
129
|
-
this.limitStylingAppends = true;
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
render() {
|
|
133
|
-
const { ProgressToActivate } = this.confirmationData || {};
|
|
134
|
-
return (h("div", { class: `ModalContainer ${this.device}` }, h("casino-engagement-suite-modal", { isOpen: this.isModalOpen("REWARD_MODAL"), header: "Congratulations!", contentIcon: "https://static.everymatrix.com/gic/img/engagement-suite/cup-reward.svg", modalType: "REWARD_MODAL", "show-animation": true, device: this.device }, h("div", { slot: "body" }, h("div", null, translate('won', this.language), " ", h("span", { class: 'ModalReward' }, this.rewardMessage)), this.hasError && (h("div", { class: "SupportInfo" }, translate('supportInfo', this.language)))), h("div", { slot: "footer" }, h("button", { class: 'ModalFooterButton', onClick: this.handleCloseClick, "data-type": 'REWARD_MODAL' }, translate('continue', this.language)))), h("casino-engagement-suite-modal", { isOpen: this.isModalOpen("JACKPOT_REWARD_MODAL"), header: "Congratulations!", contentIcon: "https://static.everymatrix.com/gic/img/engagement-suite/cup-reward.svg", "show-animation": true, modalType: "JACKPOT_REWARD_MODAL", device: this.device }, h("div", { slot: "body" }, h("div", { class: "JackpotWinText" }, translate('jackpotWin', this.language)), h("div", { class: "JackpotWinAmount" }, formatBalance(this.winAmount.amount, this.winAmount.currency))), h("div", { slot: "footer" }, h("button", { class: 'ModalFooterButton', onClick: this.handleCloseClick, "data-type": 'JACKPOT_REWARD_MODAL' }, translate('continue', this.language)), h("div", { class: "JackpotWinInfoText" }, translate('jackpotWinInfo', this.language)))), h("casino-engagement-suite-modal", { isOpen: this.isModalOpen("TARGET_MODAL"), header: ProgressToActivate ?
|
|
135
|
-
translate('joinHeader', this.language) :
|
|
136
|
-
translate('unJoinHeader', this.language), modalType: "TARGET_MODAL", device: this.device, isLoading: this.isJoiningToChallenge }, h("div", { slot: "body" }, h("div", { class: 'LeftAlign' }, translate('desc', this.language)), h("div", { class: 'LeftAlignQuestion' }, ProgressToActivate ?
|
|
137
|
-
translate('joinQuestion', this.language) :
|
|
138
|
-
translate('unJoinQuestion', this.language))), h("div", { slot: "footer", class: 'ManyActions' }, h("button", { class: `ModalFooterButton ${this.isJoiningToChallenge ? 'Disabled' : ''}`, onClick: this.handleChallengeAttendance }, ProgressToActivate ?
|
|
139
|
-
translate('joinConfirm', this.language) :
|
|
140
|
-
translate('unJoinConfirm', this.language)), h("button", { class: `ModalFooterButtonOutlined ${this.isJoiningToChallenge ? 'Disabled' : ''}`, onClick: this.handleCloseClick, "data-type": 'TARGET_MODAL' }, h("div", { class: 'GradientText' }, ProgressToActivate ?
|
|
141
|
-
translate('joinReject', this.language) :
|
|
142
|
-
translate('unJoinReject', this.language))))), h("casino-engagement-suite-modal", { isOpen: this.isModalOpen("SUPPORT_MODAL"), header: translate('noReward', this.language), contentIcon: "https://static.everymatrix.com/gic/img/engagement-suite/alert.svg", modalType: "SUPPORT_MODAL", device: this.device }, h("div", { slot: "body" }, h("span", null, translate('contactSupport', this.language))), h("div", { slot: "footer" }, h("button", { class: 'ModalFooterButton', onClick: this.handleCloseClick, "data-type": 'SUPPORT_MODAL' }, translate('okContinue', this.language))))));
|
|
143
|
-
}
|
|
144
|
-
get host() { return this; }
|
|
145
|
-
static get style() { return casinoEngagementSuiteModalContainerCss; }
|
|
146
|
-
}, [1, "casino-engagement-suite-modal-container", {
|
|
147
|
-
"clientStyling": [513, "client-styling"],
|
|
148
|
-
"clientStylingUrl": [513, "client-styling-url"],
|
|
149
|
-
"language": [1],
|
|
150
|
-
"isJoiningToChallenge": [1028, "is-joining-to-challenge"],
|
|
151
|
-
"device": [1],
|
|
152
|
-
"limitStylingAppends": [32],
|
|
153
|
-
"openModals": [32],
|
|
154
|
-
"rewardMessage": [32],
|
|
155
|
-
"hasError": [32],
|
|
156
|
-
"confirmationData": [32],
|
|
157
|
-
"winAmount": [32]
|
|
158
|
-
}, [[16, "openModal", "openModalHandler"], [16, "closeModal", "closeModalHandler"]]]);
|
|
159
|
-
function defineCustomElement$1() {
|
|
160
|
-
if (typeof customElements === "undefined") {
|
|
161
|
-
return;
|
|
162
|
-
}
|
|
163
|
-
const components = ["casino-engagement-suite-modal-container", "casino-engagement-suite-modal"];
|
|
164
|
-
components.forEach(tagName => { switch (tagName) {
|
|
165
|
-
case "casino-engagement-suite-modal-container":
|
|
166
|
-
if (!customElements.get(tagName)) {
|
|
167
|
-
customElements.define(tagName, CasinoEngagementSuiteModalContainer$1);
|
|
168
|
-
}
|
|
169
|
-
break;
|
|
170
|
-
case "casino-engagement-suite-modal":
|
|
171
|
-
if (!customElements.get(tagName)) {
|
|
172
|
-
defineCustomElement$2();
|
|
173
|
-
}
|
|
174
|
-
break;
|
|
175
|
-
} });
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
const CasinoEngagementSuiteModalContainer = CasinoEngagementSuiteModalContainer$1;
|
|
179
|
-
const defineCustomElement = defineCustomElement$1;
|
|
180
|
-
|
|
181
|
-
export { CasinoEngagementSuiteModalContainer, defineCustomElement };
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { C as CasinoEngagementSuiteModal$1, d as defineCustomElement$1 } from './casino-engagement-suite-modal2.js';
|
|
2
|
-
|
|
3
|
-
const CasinoEngagementSuiteModal = CasinoEngagementSuiteModal$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { CasinoEngagementSuiteModal, defineCustomElement };
|
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const casinoEngagementSuiteModalCss = ":host{display:block;font-family:inherit}*{box-sizing:border-box;margin:0;padding:0}button{border:none;background:none;cursor:pointer;touch-action:manipulation}button:focus{outline:none}.ModalOverlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.5);justify-content:center;align-items:center}.ModalOverlay.Open{display:flex}.IconCloseContainer{width:100%;display:flex;justify-content:end}.IconCloseButton img{width:24px;height:24px}.ModalBodyWrapper{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden}.ModalBodyWrapper::-webkit-scrollbar{width:3px;background:none}.ModalBodyWrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:var(--emw--color-background, #666178)}.ModalContent{display:flex;flex-direction:column;align-items:center;font-family:\"Montserrat\", sans-serif;position:relative;color:var(--emw--color-typography, #FFFFFF);background-color:var(--emw--color-background, #1E1638);padding:24px;border-radius:8px;width:450px;max-width:100%;text-align:center;max-height:90dvh}.GradientBorder::before{content:\"\";position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:9px;background:linear-gradient(143.2deg, #FF9401 -0.41%, #FFD32D 45.61%, #FF9401 82.77%);z-index:-1}.ModalHeader h1{font-weight:var(--emw--font-weight-semibold, 600);font-size:var(--emw--font-size-large, 24px);padding:0 16px;margin-bottom:16px}.ModalIcon{width:44px;height:44px;border-radius:50%;background-size:cover;margin:12px 0}.ModalBody{font-size:16px;font-family:\"Inter\", sans-serif;font-weight:var(--emw--font-weight-normal, 400);color:var(--emw--color-gray-100, #BBB9C3);padding:0 16px}.ModalFooter{margin-top:40px;margin-bottom:28px;padding:0 16px;width:100%}@keyframes rotate{100%{transform:rotate(1turn)}}.ModalOverlay .ModalWinAnimation{display:none}.ModalOverlay.ShowAnimation .ModalWinAnimation{display:block;position:absolute;width:100%;height:100%;inset:0;background:center/550px url(https://static.everymatrix.com/gic/img/engagement-suite/light.svg) no-repeat, center/550px url(https://static.everymatrix.com/gic/img/engagement-suite/win.svg) no-repeat;animation:6s rotate linear infinite}.ModalOverlay.Mobile .IconCloseButton img{width:16px;height:16px}.ModalOverlay.Mobile .ModalBody{font-size:14px}.ModalOverlay.Mobile .ModalContent{width:318px;padding:12px}.ModalOverlay.Mobile .ModalHeader h1{font-size:20px;padding:0 60px}.ModalOverlay.Mobile.ShowAnimation .ModalWinAnimation{background-size:400px}";
|
|
4
|
-
|
|
5
|
-
const CasinoEngagementSuiteModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
-
constructor() {
|
|
7
|
-
super();
|
|
8
|
-
this.__registerHost();
|
|
9
|
-
this.__attachShadow();
|
|
10
|
-
this.closeModal = createEvent(this, "closeModal", 7);
|
|
11
|
-
/**
|
|
12
|
-
* Client custom styling via string
|
|
13
|
-
*/
|
|
14
|
-
this.clientStyling = '';
|
|
15
|
-
/**
|
|
16
|
-
* Client custom styling via url
|
|
17
|
-
*/
|
|
18
|
-
this.clientStylingUrl = '';
|
|
19
|
-
this.device = 'Mobile';
|
|
20
|
-
/**
|
|
21
|
-
* Show win animation
|
|
22
|
-
*/
|
|
23
|
-
this.showAnimation = false;
|
|
24
|
-
this.limitStylingAppends = false;
|
|
25
|
-
this.handleCloseClick = () => {
|
|
26
|
-
if (this.isLoading)
|
|
27
|
-
return;
|
|
28
|
-
this.closeModal.emit(this.modalType);
|
|
29
|
-
};
|
|
30
|
-
this.setClientStyling = () => {
|
|
31
|
-
let sheet = document.createElement('style');
|
|
32
|
-
sheet.innerHTML = this.clientStyling;
|
|
33
|
-
this.host.prepend(sheet);
|
|
34
|
-
};
|
|
35
|
-
this.setClientStylingURL = () => {
|
|
36
|
-
let url = new URL(this.clientStylingUrl);
|
|
37
|
-
let cssFile = document.createElement('style');
|
|
38
|
-
fetch(url.href)
|
|
39
|
-
.then((res) => res.text())
|
|
40
|
-
.then((data) => {
|
|
41
|
-
cssFile.innerHTML = data;
|
|
42
|
-
setTimeout(() => { this.host.prepend(cssFile); }, 1);
|
|
43
|
-
})
|
|
44
|
-
.catch((err) => {
|
|
45
|
-
console.log('Error ', err);
|
|
46
|
-
});
|
|
47
|
-
};
|
|
48
|
-
}
|
|
49
|
-
componentDidRender() {
|
|
50
|
-
if (!this.limitStylingAppends && this.host) {
|
|
51
|
-
if (this.clientStyling)
|
|
52
|
-
this.setClientStyling();
|
|
53
|
-
if (this.clientStylingUrl)
|
|
54
|
-
this.setClientStylingURL();
|
|
55
|
-
this.limitStylingAppends = true;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
render() {
|
|
59
|
-
return (h("div", { class: `ModalOverlay ${this.isOpen && 'Open'} ${this.device} ${this.showAnimation && 'ShowAnimation'}` }, h("div", { class: "ModalWinAnimation" }), h("div", { class: "ModalContent GradientBorder" }, h("div", { class: 'IconCloseContainer' }, h("button", { class: "IconCloseButton", onClick: this.handleCloseClick }, h("img", { src: "https://static.everymatrix.com/gic/img/engagement-suite/close.svg", alt: "\u0421lose modal" }))), this.contentIcon ? (h("div", { class: "ModalIcon", style: {
|
|
60
|
-
background: `url(${this.contentIcon}) no-repeat center, linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%)`
|
|
61
|
-
} })) : null, h("div", { class: "ModalHeader" }, h("h1", null, this.header)), h("div", { class: "ModalBodyWrapper" }, h("div", { class: "ModalBody" }, h("slot", { name: "body" })), h("div", { class: "ModalFooter" }, h("slot", { name: "footer" }))))));
|
|
62
|
-
}
|
|
63
|
-
get host() { return this; }
|
|
64
|
-
static get style() { return casinoEngagementSuiteModalCss; }
|
|
65
|
-
}, [1, "casino-engagement-suite-modal", {
|
|
66
|
-
"clientStyling": [513, "client-styling"],
|
|
67
|
-
"clientStylingUrl": [513, "client-styling-url"],
|
|
68
|
-
"isOpen": [4, "is-open"],
|
|
69
|
-
"isLoading": [1028, "is-loading"],
|
|
70
|
-
"header": [1],
|
|
71
|
-
"contentIcon": [1, "content-icon"],
|
|
72
|
-
"modalType": [1, "modal-type"],
|
|
73
|
-
"device": [1],
|
|
74
|
-
"showAnimation": [4, "show-animation"],
|
|
75
|
-
"limitStylingAppends": [32]
|
|
76
|
-
}]);
|
|
77
|
-
function defineCustomElement() {
|
|
78
|
-
if (typeof customElements === "undefined") {
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
const components = ["casino-engagement-suite-modal"];
|
|
82
|
-
components.forEach(tagName => { switch (tagName) {
|
|
83
|
-
case "casino-engagement-suite-modal":
|
|
84
|
-
if (!customElements.get(tagName)) {
|
|
85
|
-
customElements.define(tagName, CasinoEngagementSuiteModal);
|
|
86
|
-
}
|
|
87
|
-
break;
|
|
88
|
-
} });
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
export { CasinoEngagementSuiteModal as C, defineCustomElement as d };
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
/* CasinoEngagementSuiteModalContainer custom elements */
|
|
2
|
-
|
|
3
|
-
import type { Components, JSX } from "../types/components";
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* Used to manually set the base path where assets can be found.
|
|
7
|
-
* If the script is used as "module", it's recommended to use "import.meta.url",
|
|
8
|
-
* such as "setAssetPath(import.meta.url)". Other options include
|
|
9
|
-
* "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
|
|
10
|
-
* dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
|
|
11
|
-
* But do note that this configuration depends on how your script is bundled, or lack of
|
|
12
|
-
* bundling, and where your assets can be loaded from. Additionally custom bundling
|
|
13
|
-
* will have to ensure the static assets are copied to its build directory.
|
|
14
|
-
*/
|
|
15
|
-
export declare const setAssetPath: (path: string) => void;
|
|
16
|
-
|
|
17
|
-
export interface SetPlatformOptions {
|
|
18
|
-
raf?: (c: FrameRequestCallback) => number;
|
|
19
|
-
ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
|
|
20
|
-
rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
|
|
21
|
-
}
|
|
22
|
-
export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
|
|
23
|
-
|
|
24
|
-
export type { Components, JSX };
|
|
25
|
-
|
|
26
|
-
export * from '../types';
|
package/dist/components/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
|