@everymatrix/lottery-bullet 1.87.25 → 1.87.27
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.
|
@@ -4,6 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-f5440596.js');
|
|
6
6
|
|
|
7
|
+
const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
|
|
8
|
+
|
|
7
9
|
/**
|
|
8
10
|
* @name setClientStyling
|
|
9
11
|
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
@@ -49,18 +51,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
|
49
51
|
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
50
52
|
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
51
53
|
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
54
|
+
* @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
|
|
52
55
|
*/
|
|
53
|
-
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
54
|
-
if (window.emMessageBus)
|
|
55
|
-
const sheet = document.createElement('style');
|
|
56
|
+
function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
|
|
57
|
+
if (!window.emMessageBus) return;
|
|
56
58
|
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
59
|
+
const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
|
|
60
|
+
|
|
61
|
+
if (!supportAdoptStyle || !useAdoptedStyleSheets) {
|
|
62
|
+
subscription = getStyleTagSubscription(stylingContainer, domain);
|
|
63
|
+
|
|
64
|
+
return subscription;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
if (!window[StyleCacheKey]) {
|
|
68
|
+
window[StyleCacheKey] = {};
|
|
63
69
|
}
|
|
70
|
+
subscription = getAdoptStyleSubscription(stylingContainer, domain);
|
|
71
|
+
|
|
72
|
+
const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
|
|
73
|
+
const wrappedUnsubscribe = () => {
|
|
74
|
+
if (window[StyleCacheKey][domain]) {
|
|
75
|
+
const cachedObject = window[StyleCacheKey][domain];
|
|
76
|
+
cachedObject.refCount > 1
|
|
77
|
+
? (cachedObject.refCount = cachedObject.refCount - 1)
|
|
78
|
+
: delete window[StyleCacheKey][domain];
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
originalUnsubscribe();
|
|
82
|
+
};
|
|
83
|
+
subscription.unsubscribe = wrappedUnsubscribe;
|
|
84
|
+
|
|
85
|
+
return subscription;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
function getStyleTagSubscription(stylingContainer, domain) {
|
|
89
|
+
const sheet = document.createElement('style');
|
|
90
|
+
|
|
91
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
92
|
+
if (stylingContainer) {
|
|
93
|
+
sheet.innerHTML = data;
|
|
94
|
+
stylingContainer.appendChild(sheet);
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
function getAdoptStyleSubscription(stylingContainer, domain) {
|
|
100
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
101
|
+
if (!stylingContainer) return;
|
|
102
|
+
|
|
103
|
+
const shadowRoot = stylingContainer.getRootNode();
|
|
104
|
+
const cacheStyleObject = window[StyleCacheKey];
|
|
105
|
+
let cachedStyle = cacheStyleObject[domain]?.sheet;
|
|
106
|
+
|
|
107
|
+
if (!cachedStyle) {
|
|
108
|
+
cachedStyle = new CSSStyleSheet();
|
|
109
|
+
cachedStyle.replaceSync(data);
|
|
110
|
+
cacheStyleObject[domain] = {
|
|
111
|
+
sheet: cachedStyle,
|
|
112
|
+
refCount: 1
|
|
113
|
+
};
|
|
114
|
+
} else {
|
|
115
|
+
cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
const currentSheets = shadowRoot.adoptedStyleSheets || [];
|
|
119
|
+
if (!currentSheets.includes(cachedStyle)) {
|
|
120
|
+
shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
|
|
121
|
+
}
|
|
122
|
+
});
|
|
64
123
|
}
|
|
65
124
|
|
|
66
125
|
const lotteryBulletCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}@-webkit-keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.22) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.2) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@-webkit-keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.Circle{-webkit-animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;cursor:pointer;color:var(--emw--color-typography, #000);display:block;height:30px;width:30px;margin:0;display:flex;align-items:center;justify-content:center;justify-content:center;align-items:center;border:solid 2px var(--emw--color-background, #fff);background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background, #fff) 100%);font-weight:bold;border-radius:50%;box-shadow:0 2px 4px 0 var(--emw--color-gray-300, #333);user-select:none;font-size:16px;line-height:16px;font-weight:600;position:relative}.Circle:hover{-webkit-animation:hover-rotate 0.4s linear both;animation:hover-rotate 0.4s linear both;background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background-secondary, #f5f5f5) 100%)}.Circle.Selected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-background, #fff);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-primary, #009993)}.Circle.Disabled{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:var(--emw--color-gray-250, #ccc);border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.DisabledSelected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.Bonus{background:var(--emw--color-tertiary, #ff6536)}";
|
|
@@ -99,13 +158,13 @@ const LotteryBullet = class {
|
|
|
99
158
|
}
|
|
100
159
|
handleMbSourceChange(newValue, oldValue) {
|
|
101
160
|
if (newValue != oldValue) {
|
|
102
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
161
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
103
162
|
}
|
|
104
163
|
}
|
|
105
164
|
componentDidLoad() {
|
|
106
165
|
if (this.stylingContainer) {
|
|
107
166
|
if (this.mbSource)
|
|
108
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
167
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
109
168
|
if (this.clientStyling)
|
|
110
169
|
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
111
170
|
if (this.clientStylingUrl)
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h } from './index-92cdc135.js';
|
|
2
2
|
|
|
3
|
+
const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
|
|
4
|
+
|
|
3
5
|
/**
|
|
4
6
|
* @name setClientStyling
|
|
5
7
|
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
@@ -45,18 +47,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
|
45
47
|
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
46
48
|
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
47
49
|
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
50
|
+
* @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
|
|
48
51
|
*/
|
|
49
|
-
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
50
|
-
if (window.emMessageBus)
|
|
51
|
-
const sheet = document.createElement('style');
|
|
52
|
+
function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
|
|
53
|
+
if (!window.emMessageBus) return;
|
|
52
54
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
55
|
+
const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
|
|
56
|
+
|
|
57
|
+
if (!supportAdoptStyle || !useAdoptedStyleSheets) {
|
|
58
|
+
subscription = getStyleTagSubscription(stylingContainer, domain);
|
|
59
|
+
|
|
60
|
+
return subscription;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
if (!window[StyleCacheKey]) {
|
|
64
|
+
window[StyleCacheKey] = {};
|
|
59
65
|
}
|
|
66
|
+
subscription = getAdoptStyleSubscription(stylingContainer, domain);
|
|
67
|
+
|
|
68
|
+
const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
|
|
69
|
+
const wrappedUnsubscribe = () => {
|
|
70
|
+
if (window[StyleCacheKey][domain]) {
|
|
71
|
+
const cachedObject = window[StyleCacheKey][domain];
|
|
72
|
+
cachedObject.refCount > 1
|
|
73
|
+
? (cachedObject.refCount = cachedObject.refCount - 1)
|
|
74
|
+
: delete window[StyleCacheKey][domain];
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
originalUnsubscribe();
|
|
78
|
+
};
|
|
79
|
+
subscription.unsubscribe = wrappedUnsubscribe;
|
|
80
|
+
|
|
81
|
+
return subscription;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
function getStyleTagSubscription(stylingContainer, domain) {
|
|
85
|
+
const sheet = document.createElement('style');
|
|
86
|
+
|
|
87
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
88
|
+
if (stylingContainer) {
|
|
89
|
+
sheet.innerHTML = data;
|
|
90
|
+
stylingContainer.appendChild(sheet);
|
|
91
|
+
}
|
|
92
|
+
});
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
function getAdoptStyleSubscription(stylingContainer, domain) {
|
|
96
|
+
return window.emMessageBus.subscribe(domain, (data) => {
|
|
97
|
+
if (!stylingContainer) return;
|
|
98
|
+
|
|
99
|
+
const shadowRoot = stylingContainer.getRootNode();
|
|
100
|
+
const cacheStyleObject = window[StyleCacheKey];
|
|
101
|
+
let cachedStyle = cacheStyleObject[domain]?.sheet;
|
|
102
|
+
|
|
103
|
+
if (!cachedStyle) {
|
|
104
|
+
cachedStyle = new CSSStyleSheet();
|
|
105
|
+
cachedStyle.replaceSync(data);
|
|
106
|
+
cacheStyleObject[domain] = {
|
|
107
|
+
sheet: cachedStyle,
|
|
108
|
+
refCount: 1
|
|
109
|
+
};
|
|
110
|
+
} else {
|
|
111
|
+
cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
const currentSheets = shadowRoot.adoptedStyleSheets || [];
|
|
115
|
+
if (!currentSheets.includes(cachedStyle)) {
|
|
116
|
+
shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
|
|
117
|
+
}
|
|
118
|
+
});
|
|
60
119
|
}
|
|
61
120
|
|
|
62
121
|
const lotteryBulletCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}@-webkit-keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.22) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.2) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@-webkit-keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.Circle{-webkit-animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;cursor:pointer;color:var(--emw--color-typography, #000);display:block;height:30px;width:30px;margin:0;display:flex;align-items:center;justify-content:center;justify-content:center;align-items:center;border:solid 2px var(--emw--color-background, #fff);background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background, #fff) 100%);font-weight:bold;border-radius:50%;box-shadow:0 2px 4px 0 var(--emw--color-gray-300, #333);user-select:none;font-size:16px;line-height:16px;font-weight:600;position:relative}.Circle:hover{-webkit-animation:hover-rotate 0.4s linear both;animation:hover-rotate 0.4s linear both;background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background-secondary, #f5f5f5) 100%)}.Circle.Selected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-background, #fff);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-primary, #009993)}.Circle.Disabled{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:var(--emw--color-gray-250, #ccc);border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.DisabledSelected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.Bonus{background:var(--emw--color-tertiary, #ff6536)}";
|
|
@@ -95,13 +154,13 @@ const LotteryBullet = class {
|
|
|
95
154
|
}
|
|
96
155
|
handleMbSourceChange(newValue, oldValue) {
|
|
97
156
|
if (newValue != oldValue) {
|
|
98
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
157
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
99
158
|
}
|
|
100
159
|
}
|
|
101
160
|
componentDidLoad() {
|
|
102
161
|
if (this.stylingContainer) {
|
|
103
162
|
if (this.mbSource)
|
|
104
|
-
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style
|
|
163
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
105
164
|
if (this.clientStyling)
|
|
106
165
|
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
107
166
|
if (this.clientStylingUrl)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as e,c as r,h as t}from"./index-92cdc135.js";function
|
|
1
|
+
import{r as e,c as r,h as t}from"./index-92cdc135.js";const a="__WIDGET_GLOBAL_STYLE_CACHE__";function o(e,r){if(e){const t=document.createElement("style");t.innerHTML=r,e.appendChild(t)}}function i(e,r){if(!e||!r)return;const t=new URL(r);fetch(t.href).then((e=>e.text())).then((r=>{const t=document.createElement("style");t.innerHTML=r,e&&e.appendChild(t)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}function s(e,r,t,o=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!o)return t=function(e,r){const t=document.createElement("style");return window.emMessageBus.subscribe(r,(r=>{e&&(t.innerHTML=r,e.appendChild(t))}))}(e,r),t;window[a]||(window[a]={}),t=function(e,r){return window.emMessageBus.subscribe(r,(t=>{if(!e)return;const o=e.getRootNode(),i=window[a];let s=i[r]?.sheet;s?i[r].refCount=i[r].refCount+1:(s=new CSSStyleSheet,s.replaceSync(t),i[r]={sheet:s,refCount:1});const c=o.adoptedStyleSheets||[];c.includes(s)||(o.adoptedStyleSheets=[...c,s])}))}(e,r);const i=t.unsubscribe.bind(t);return t.unsubscribe=()=>{if(window[a][r]){const e=window[a][r];e.refCount>1?e.refCount=e.refCount-1:delete window[a][r]}i()},t}const c=class{constructor(t){e(this,t),this.bulletEvent=r(this,"lotteryBulletSelection",7),this.select=()=>{this.selectable&&(this.isSelected=!this.isSelected,this.bulletEvent.emit({value:this.value,selected:this.isSelected}))},this.value="0",this.selectable=!0,this.isSelected=!1,this.isBonus=!1,this.clientStyling="",this.clientStylingUrl="",this.mbSource=void 0}handleClientStylingChange(e,r){e!=r&&o(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(e,r){e!=r&&i(this.stylingContainer,this.clientStylingUrl)}handleMbSourceChange(e,r){e!=r&&s(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription)}componentDidLoad(){this.stylingContainer&&(this.mbSource&&s(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription),this.clientStyling&&o(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&i(this.stylingContainer,this.clientStylingUrl))}render(){return t("div",{key:"2cfab600728d3aa72f9f87e4e07a968ea030e415",class:"Circle "+(this.selectable?"":"Disabled")+(this.isSelected?"Selected":"")+(this.isBonus?" Bonus":""),onClick:()=>this.select(),ref:e=>this.stylingContainer=e},this.value)}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],mbSource:["handleMbSourceChange"]}}};c.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}@-webkit-keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.22) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.2) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@-webkit-keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.Circle{-webkit-animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;cursor:pointer;color:var(--emw--color-typography, #000);display:block;height:30px;width:30px;margin:0;display:flex;align-items:center;justify-content:center;justify-content:center;align-items:center;border:solid 2px var(--emw--color-background, #fff);background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background, #fff) 100%);font-weight:bold;border-radius:50%;box-shadow:0 2px 4px 0 var(--emw--color-gray-300, #333);user-select:none;font-size:16px;line-height:16px;font-weight:600;position:relative}.Circle:hover{-webkit-animation:hover-rotate 0.4s linear both;animation:hover-rotate 0.4s linear both;background:radial-gradient(circle at top, var(--emw--color-background, #fff) 0%, var(--emw--color-background-secondary, #f5f5f5) 100%)}.Circle.Selected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-background, #fff);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-primary, #009993)}.Circle.Disabled{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:var(--emw--color-gray-250, #ccc);border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.DisabledSelected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:var(--emw--color-gray-50, #f5f5f5);background:-webkit-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:-moz-radial-gradient(top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));background:radial-gradient(circle at top, var(--emw--color-primary, #009993), var(--emw--color-primary-variant, #004d4a));border:solid 2px var(--emw--color-gray-100, #e6e6e6);cursor:default}.Circle.Bonus{background:var(--emw--color-tertiary, #ff6536)}';export{c as lottery_bullet}
|