@everymatrix/casino-challenges-claim-code 0.10.25 → 0.10.27

package/dist/casino-challenges-claim-code/casino-challenges-claim-code-3171841e.js

@@ -0,0 +1 @@
+import{r as e,c as t,h as n}from"./index-05d7637d.js";const o="__WIDGET_GLOBAL_STYLE_CACHE__";function i(e,t){if(e){const n=document.createElement("style");n.innerHTML=t,e.appendChild(n)}}function r(e,t){if(!e||!t)return;const n=new URL(t);fetch(n.href).then((e=>e.text())).then((t=>{const n=document.createElement("style");n.innerHTML=t,e&&e.appendChild(n)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}function s(e,t,n,i=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!i)return n=function(e,t){const n=document.createElement("style");return window.emMessageBus.subscribe(t,(t=>{e&&(n.innerHTML=t,e.appendChild(n))}))}(e,t),n;window[o]||(window[o]={}),n=function(e,t){return window.emMessageBus.subscribe(t,(n=>{if(!e)return;const i=e.getRootNode(),r=window[o];let s=r[t]?.sheet;s?r[t].refCount=r[t].refCount+1:(s=new CSSStyleSheet,s.replaceSync(n),r[t]={sheet:s,refCount:1});const a=i.adoptedStyleSheets||[];a.includes(s)||(i.adoptedStyleSheets=[...a,s])}))}(e,t);const r=n.unsubscribe.bind(n);return n.unsubscribe=()=>{if(window[o][t]){const e=window[o][t];e.refCount>1?e.refCount=e.refCount-1:delete window[o][t]}r()},n}const a={en:{title:"Enter the secret code to unlock hidden quests and rewards.",btnText:"Apply code",successMessage:"The code was successfully applied.",inputLabel:"3–30 characters, no spaces",lengthMinError:"Code must be at least 3 characters",lengthMaxError:"Too long — max 30 characters",formatError:"Invalid code format. Please use only Latin letters (case-sensitive), numbers, and special characters.",genericError:"Something went wrong, please retry"},ro:{},fr:{},ar:{},hr:{}},c=(e,t)=>a[void 0!==t&&t in a?t:"en"][e],h=class{constructor(n){e(this,n),this.openNotification=t(this,"openNotification",7),this.asciiPrintableRegex=/^[\x21-\x7E]+$/,this.handleSubmit=async()=>{if(this.endpoint&&this.session&&this.domain){const e=await this.applyCode();e.Success?this.openNotification.emit({message:c("successMessage",this.language)}):(this.hasError=!0,this.openNotification.emit({message:e.ErrorMessage,errored:!0,showTabLink:3002===e.ErrorCode||3023===e.ErrorCode||3003===e.ErrorCode}))}},this.applyCode=async()=>(this.loading=!0,fetch(`${this.endpoint}/challenge/GrantChallengeByCode`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({DomainId:this.domain,PlayerSessionId:this.session,ActivationCode:this.code})}).then((e=>e.json())).finally((()=>this.loading=!1))),this.handleInput=e=>{this.code=e.target.value,this.debounceTime&&clearTimeout(this.debounceTime),this.debounceTime=setTimeout((()=>{this.hasError=!this.validate(this.code)}),200)},this.mbSource=void 0,this.clientStyling=void 0,this.clientStylingUrl=void 0,this.translationUrl="",this.language="en",this.endpoint="",this.domain="",this.session="",this.loading=!1,this.hasError=!1,this.code="",this.notificationMessage=""}handleClientStylingChange(e,t){e!=t&&i(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(e,t){e!=t&&r(this.stylingContainer,this.clientStylingUrl)}handleMbSourceChange(e,t){e!=t&&s(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription)}componentWillLoad(){this.translationUrl&&(async e=>{if(e)try{const n=await fetch(e);if(!n.ok)throw new Error(`HTTP error! status: ${n.status}`);const o=await n.json();t=o,Object.keys(t).forEach((e=>{for(let n in t[e])a[e][n]=t[e][n]}))}catch(e){console.error("Failed to fetch or parse translations from URL:",e)}var t})(this.translationUrl)}componentDidLoad(){this.stylingContainer&&(this.mbSource&&s(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription),this.clientStyling&&i(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}validate(e){return e.length>=3&&e.length<=30&&this.asciiPrintableRegex.test(e)}render(){return n("div",{key:"241aeeb9f0f0984bbf0367a7c925e0b84ef15fa0",ref:e=>this.stylingContainer=e},n("div",{key:"f20ec43253905cb0e9a356f65d1e51e695f784cf",class:"container"},n("p",{key:"a4c3b0ca894db101c192f7c62ff141ec51eaede1",class:"container__title"},c("title",this.language)),n("input",{key:"c99bdd43659c9d2fc06702fe041eab8458bb0ee5",class:"code-input "+(this.hasError?"errored":""),type:"text",placeholder:"e.g. SPRING24",onInput:this.handleInput}),n("p",{key:"c2aacc2d4a23c7d222f895dce3a3a47b8f03f587",class:"code-input__text"},c("inputLabel",this.language)),n("button",{key:"51e79d07278368567026d31b0c70e8c9f0eb4840",class:"container__button",onClick:this.handleSubmit,disabled:this.loading||!this.code||this.hasError},c("btnText",this.language))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],mbSource:["handleMbSourceChange"]}}};h.style=".container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 80px 0;\n  text-align: center;\n}\n.container__title {\n  font-size: var(--emw--font-size-medium-plus, 18px);\n  font-weight: var(--emw--font-weight-medium, 500);\n  line-height: 22px;\n  color: var(--emw--color-white, white);\n  margin: 0 0 32px;\n}\n.container__button {\n  margin-top: 45px;\n  padding: 14px 20px;\n  background: transparent;\n  text-transform: uppercase;\n  border-radius: var(--emw--button-border-radius, 99px);\n  border: 2px solid var(--emw--button-border-color, #083B17);\n  font-size: var(--emw--font-size-x-small, 12px);\n  font-weight: var(--emw--font-weight-bold, 700);\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: var(--emw--button-background-color, #18CE51);\n  cursor: pointer;\n}\n.container__button:hover {\n  color: var(--emw--color-gray-300, #083B17);\n  border-color: transparent;\n  box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.container__button:disabled, .container__button:disabled:hover {\n  color: var(--emw--color-gray-50, #E2E2E2);\n  border: 2px solid var(--emw--button-border-color, #083B17);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n@container challenges-container (max-width: 576px) {\n  .container__button {\n    width: 100%;\n    position: absolute;\n    bottom: 50px;\n  }\n}\n\n.code-input {\n  border: 1px solid var(--emw--button-border-color, #083B17);\n  background: var(--emw--color-background-secondary, rgba(221, 255, 207, 0.1019607843));\n  border-radius: 6px;\n  padding: 12px 0;\n  line-height: 24px;\n  color: var(--emw--color-white, #FFFFFF);\n  text-align: center;\n  font-size: var(--emw--font-size-medium, 16px);\n  min-width: 340px;\n}\n.code-input:focus {\n  outline: 1px solid var(--emw--border-success-color, #00B74F);\n}\n.code-input:focus.errored {\n  outline-color: var(--emw--color-error, #D6421E);\n}\n.code-input.errored {\n  border-color: var(--emw--color-error, #D6421E);\n}\n.code-input__text {\n  margin: 8px 0 0;\n  line-height: 22px;\n  font-size: var(--emw--font-size-x-small, 12px);\n  font-weight: var(--emw--font-weight-medium, 500);\n  color: var(--emw--color-gray-150, #C8D6CE);\n}\n.code-input__text.errored {\n  color: var(--emw--color-error, #D6421E);\n}\n@container challenges-container (max-width: 576px) {\n  .code-input {\n    min-width: 100%;\n  }\n}";export{h as C}

package/dist/casino-challenges-claim-code/casino-challenges-claim-code.entry.js

@@ -1 +1 @@
-export{C as casino_challenges_claim_code}from"./casino-challenges-claim-code-b1eeb8bc.js";import"./index-05d7637d.js";
+export{C as casino_challenges_claim_code}from"./casino-challenges-claim-code-3171841e.js";import"./index-05d7637d.js";

package/dist/casino-challenges-claim-code/index.esm.js

@@ -1 +1 @@
-export{C as CasinoChallengesClaimCode}from"./casino-challenges-claim-code-b1eeb8bc.js";import"./index-05d7637d.js";
+export{C as CasinoChallengesClaimCode}from"./casino-challenges-claim-code-3171841e.js";import"./index-05d7637d.js";

package/dist/cjs/{casino-challenges-claim-code-b7ee2d2d.js → casino-challenges-claim-code-a2ea5795.js}

@@ -2,6 +2,8 @@
 
 const index = require('./index-718e2d1c.js');
 
+const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
+
 /**
  * @name setClientStyling
  * @description Method used to create and append to the passed element of the widget a style element with the content received
@@ -47,18 +49,75 @@ function setClientStylingURL(stylingContainer, clientStylingUrl) {
  * @param {HTMLElement} stylingContainer The highest element of the widget
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
  */
-function setStreamStyling(stylingContainer, domain, subscription) {
-  if (window.emMessageBus) {
-    const sheet = document.createElement('style');
+function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
 
-    window.emMessageBus.subscribe(domain, (data) => {
-      sheet.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(sheet);
-      }
-    });
+  const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
+
+  if (!supportAdoptStyle || !useAdoptedStyleSheets) {
+    subscription = getStyleTagSubscription(stylingContainer, domain);
+
+    return subscription;
+  }
+
+  if (!window[StyleCacheKey]) {
+    window[StyleCacheKey] = {};
   }
+  subscription = getAdoptStyleSubscription(stylingContainer, domain);
+
+  const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
+  const wrappedUnsubscribe = () => {
+    if (window[StyleCacheKey][domain]) {
+      const cachedObject = window[StyleCacheKey][domain];
+      cachedObject.refCount > 1
+        ? (cachedObject.refCount = cachedObject.refCount - 1)
+        : delete window[StyleCacheKey][domain];
+    }
+
+    originalUnsubscribe();
+  };
+  subscription.unsubscribe = wrappedUnsubscribe;
+
+  return subscription;
+}
+
+function getStyleTagSubscription(stylingContainer, domain) {
+  const sheet = document.createElement('style');
+
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (stylingContainer) {
+      sheet.innerHTML = data;
+      stylingContainer.appendChild(sheet);
+    }
+  });
+}
+
+function getAdoptStyleSubscription(stylingContainer, domain) {
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (!stylingContainer) return;
+
+    const shadowRoot = stylingContainer.getRootNode();
+    const cacheStyleObject = window[StyleCacheKey];
+    let cachedStyle = cacheStyleObject[domain]?.sheet;
+
+    if (!cachedStyle) {
+      cachedStyle = new CSSStyleSheet();
+      cachedStyle.replaceSync(data);
+      cacheStyleObject[domain] = {
+        sheet: cachedStyle,
+        refCount: 1
+      };
+    } else {
+      cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
+    }
+
+    const currentSheets = shadowRoot.adoptedStyleSheets || [];
+    if (!currentSheets.includes(cachedStyle)) {
+      shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
+    }
+  });
 }
 
 const DEFAULT_LANGUAGE = 'en';
@@ -178,7 +237,7 @@ const CasinoChallengesClaimCode = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -189,7 +248,7 @@ const CasinoChallengesClaimCode = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)

package/dist/cjs/casino-challenges-claim-code.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const casinoChallengesClaimCode = require('./casino-challenges-claim-code-b7ee2d2d.js');
+const casinoChallengesClaimCode = require('./casino-challenges-claim-code-a2ea5795.js');
 require('./index-718e2d1c.js');
 
 

package/dist/cjs/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const casinoChallengesClaimCode = require('./casino-challenges-claim-code-b7ee2d2d.js');
+const casinoChallengesClaimCode = require('./casino-challenges-claim-code-a2ea5795.js');
 require('./index-718e2d1c.js');
 
 

package/dist/esm/{casino-challenges-claim-code-b1eeb8bc.js → casino-challenges-claim-code-3171841e.js}

@@ -1,5 +1,7 @@
 import { r as registerInstance, c as createEvent, h } from './index-05d7637d.js';
 
+const StyleCacheKey = '__WIDGET_GLOBAL_STYLE_CACHE__';
+
 /**
  * @name setClientStyling
  * @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) {
  * @param {HTMLElement} stylingContainer The highest element of the widget
  * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
  * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
+ * @param {boolean} useAdoptedStyleSheets A flag to gradually enable testing of adoptedStyleSheets
  */
-function setStreamStyling(stylingContainer, domain, subscription) {
-  if (window.emMessageBus) {
-    const sheet = document.createElement('style');
+function setStreamStyling(stylingContainer, domain, subscription, useAdoptedStyleSheets = false) {
+  if (!window.emMessageBus) return;
 
-    window.emMessageBus.subscribe(domain, (data) => {
-      sheet.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(sheet);
-      }
-    });
+  const supportAdoptStyle = 'adoptedStyleSheets' in Document.prototype;
+
+  if (!supportAdoptStyle || !useAdoptedStyleSheets) {
+    subscription = getStyleTagSubscription(stylingContainer, domain);
+
+    return subscription;
+  }
+
+  if (!window[StyleCacheKey]) {
+    window[StyleCacheKey] = {};
   }
+  subscription = getAdoptStyleSubscription(stylingContainer, domain);
+
+  const originalUnsubscribe = subscription.unsubscribe.bind(subscription);
+  const wrappedUnsubscribe = () => {
+    if (window[StyleCacheKey][domain]) {
+      const cachedObject = window[StyleCacheKey][domain];
+      cachedObject.refCount > 1
+        ? (cachedObject.refCount = cachedObject.refCount - 1)
+        : delete window[StyleCacheKey][domain];
+    }
+
+    originalUnsubscribe();
+  };
+  subscription.unsubscribe = wrappedUnsubscribe;
+
+  return subscription;
+}
+
+function getStyleTagSubscription(stylingContainer, domain) {
+  const sheet = document.createElement('style');
+
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (stylingContainer) {
+      sheet.innerHTML = data;
+      stylingContainer.appendChild(sheet);
+    }
+  });
+}
+
+function getAdoptStyleSubscription(stylingContainer, domain) {
+  return window.emMessageBus.subscribe(domain, (data) => {
+    if (!stylingContainer) return;
+
+    const shadowRoot = stylingContainer.getRootNode();
+    const cacheStyleObject = window[StyleCacheKey];
+    let cachedStyle = cacheStyleObject[domain]?.sheet;
+
+    if (!cachedStyle) {
+      cachedStyle = new CSSStyleSheet();
+      cachedStyle.replaceSync(data);
+      cacheStyleObject[domain] = {
+        sheet: cachedStyle,
+        refCount: 1
+      };
+    } else {
+      cacheStyleObject[domain].refCount = cacheStyleObject[domain].refCount + 1;
+    }
+
+    const currentSheets = shadowRoot.adoptedStyleSheets || [];
+    if (!currentSheets.includes(cachedStyle)) {
+      shadowRoot.adoptedStyleSheets = [...currentSheets, cachedStyle];
+    }
+  });
 }
 
 const DEFAULT_LANGUAGE = 'en';
@@ -176,7 +235,7 @@ const CasinoChallengesClaimCode = class {
     }
     handleMbSourceChange(newValue, oldValue) {
         if (newValue != oldValue) {
-            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
     componentWillLoad() {
@@ -187,7 +246,7 @@ const CasinoChallengesClaimCode = class {
     componentDidLoad() {
         if (this.stylingContainer) {
             if (this.mbSource)
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
             if (this.clientStyling)
                 setClientStyling(this.stylingContainer, this.clientStyling);
             if (this.clientStylingUrl)

package/dist/esm/casino-challenges-claim-code.entry.js

@@ -1,2 +1,2 @@
-export { C as casino_challenges_claim_code } from './casino-challenges-claim-code-b1eeb8bc.js';
+export { C as casino_challenges_claim_code } from './casino-challenges-claim-code-3171841e.js';
 import './index-05d7637d.js';

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { C as CasinoChallengesClaimCode } from './casino-challenges-claim-code-b1eeb8bc.js';
+export { C as CasinoChallengesClaimCode } from './casino-challenges-claim-code-3171841e.js';
 import './index-05d7637d.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/casino-challenges-claim-code",
-  "version": "0.10.25",
+  "version": "0.10.27",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/casino-challenges-claim-code/casino-challenges-claim-code-b1eeb8bc.js

@@ -1 +0,0 @@
-import{r as e,c as t,h as n}from"./index-05d7637d.js";function o(e,t){if(e){const n=document.createElement("style");n.innerHTML=t,e.appendChild(n)}}function i(e,t){if(!e||!t)return;const n=new URL(t);fetch(n.href).then((e=>e.text())).then((t=>{const n=document.createElement("style");n.innerHTML=t,e&&e.appendChild(n)})).catch((e=>{console.error("There was an error while trying to load client styling from URL",e)}))}function r(e,t){if(window.emMessageBus){const n=document.createElement("style");window.emMessageBus.subscribe(t,(t=>{n.innerHTML=t,e&&e.appendChild(n)}))}}const s={en:{title:"Enter the secret code to unlock hidden quests and rewards.",btnText:"Apply code",successMessage:"The code was successfully applied.",inputLabel:"3–30 characters, no spaces",lengthMinError:"Code must be at least 3 characters",lengthMaxError:"Too long — max 30 characters",formatError:"Invalid code format. Please use only Latin letters (case-sensitive), numbers, and special characters.",genericError:"Something went wrong, please retry"},ro:{},fr:{},ar:{},hr:{}},a=(e,t)=>s[void 0!==t&&t in s?t:"en"][e],c=class{constructor(n){e(this,n),this.openNotification=t(this,"openNotification",7),this.asciiPrintableRegex=/^[\x21-\x7E]+$/,this.handleSubmit=async()=>{if(this.endpoint&&this.session&&this.domain){const e=await this.applyCode();e.Success?this.openNotification.emit({message:a("successMessage",this.language)}):(this.hasError=!0,this.openNotification.emit({message:e.ErrorMessage,errored:!0,showTabLink:3002===e.ErrorCode||3023===e.ErrorCode||3003===e.ErrorCode}))}},this.applyCode=async()=>(this.loading=!0,fetch(`${this.endpoint}/challenge/GrantChallengeByCode`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({DomainId:this.domain,PlayerSessionId:this.session,ActivationCode:this.code})}).then((e=>e.json())).finally((()=>this.loading=!1))),this.handleInput=e=>{this.code=e.target.value,this.debounceTime&&clearTimeout(this.debounceTime),this.debounceTime=setTimeout((()=>{this.hasError=!this.validate(this.code)}),200)},this.mbSource=void 0,this.clientStyling=void 0,this.clientStylingUrl=void 0,this.translationUrl="",this.language="en",this.endpoint="",this.domain="",this.session="",this.loading=!1,this.hasError=!1,this.code="",this.notificationMessage=""}handleClientStylingChange(e,t){e!=t&&o(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(e,t){e!=t&&i(this.stylingContainer,this.clientStylingUrl)}handleMbSourceChange(e,t){e!=t&&r(this.stylingContainer,`${this.mbSource}.Style`)}componentWillLoad(){this.translationUrl&&(async e=>{if(e)try{const n=await fetch(e);if(!n.ok)throw new Error(`HTTP error! status: ${n.status}`);const o=await n.json();t=o,Object.keys(t).forEach((e=>{for(let n in t[e])s[e][n]=t[e][n]}))}catch(e){console.error("Failed to fetch or parse translations from URL:",e)}var t})(this.translationUrl)}componentDidLoad(){this.stylingContainer&&(this.mbSource&&r(this.stylingContainer,`${this.mbSource}.Style`),this.clientStyling&&o(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&i(this.stylingContainer,this.clientStylingUrl))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}validate(e){return e.length>=3&&e.length<=30&&this.asciiPrintableRegex.test(e)}render(){return n("div",{key:"241aeeb9f0f0984bbf0367a7c925e0b84ef15fa0",ref:e=>this.stylingContainer=e},n("div",{key:"f20ec43253905cb0e9a356f65d1e51e695f784cf",class:"container"},n("p",{key:"a4c3b0ca894db101c192f7c62ff141ec51eaede1",class:"container__title"},a("title",this.language)),n("input",{key:"c99bdd43659c9d2fc06702fe041eab8458bb0ee5",class:"code-input "+(this.hasError?"errored":""),type:"text",placeholder:"e.g. SPRING24",onInput:this.handleInput}),n("p",{key:"c2aacc2d4a23c7d222f895dce3a3a47b8f03f587",class:"code-input__text"},a("inputLabel",this.language)),n("button",{key:"51e79d07278368567026d31b0c70e8c9f0eb4840",class:"container__button",onClick:this.handleSubmit,disabled:this.loading||!this.code||this.hasError},a("btnText",this.language))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],mbSource:["handleMbSourceChange"]}}};c.style=".container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 80px 0;\n  text-align: center;\n}\n.container__title {\n  font-size: var(--emw--font-size-medium-plus, 18px);\n  font-weight: var(--emw--font-weight-medium, 500);\n  line-height: 22px;\n  color: var(--emw--color-white, white);\n  margin: 0 0 32px;\n}\n.container__button {\n  margin-top: 45px;\n  padding: 14px 20px;\n  background: transparent;\n  text-transform: uppercase;\n  border-radius: var(--emw--button-border-radius, 99px);\n  border: 2px solid var(--emw--button-border-color, #083B17);\n  font-size: var(--emw--font-size-x-small, 12px);\n  font-weight: var(--emw--font-weight-bold, 700);\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: var(--emw--button-background-color, #18CE51);\n  cursor: pointer;\n}\n.container__button:hover {\n  color: var(--emw--color-gray-300, #083B17);\n  border-color: transparent;\n  box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.container__button:disabled, .container__button:disabled:hover {\n  color: var(--emw--color-gray-50, #E2E2E2);\n  border: 2px solid var(--emw--button-border-color, #083B17);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n@container challenges-container (max-width: 576px) {\n  .container__button {\n    width: 100%;\n    position: absolute;\n    bottom: 50px;\n  }\n}\n\n.code-input {\n  border: 1px solid var(--emw--button-border-color, #083B17);\n  background: var(--emw--color-background-secondary, rgba(221, 255, 207, 0.1019607843));\n  border-radius: 6px;\n  padding: 12px 0;\n  line-height: 24px;\n  color: var(--emw--color-white, #FFFFFF);\n  text-align: center;\n  font-size: var(--emw--font-size-medium, 16px);\n  min-width: 340px;\n}\n.code-input:focus {\n  outline: 1px solid var(--emw--border-success-color, #00B74F);\n}\n.code-input:focus.errored {\n  outline-color: var(--emw--color-error, #D6421E);\n}\n.code-input.errored {\n  border-color: var(--emw--color-error, #D6421E);\n}\n.code-input__text {\n  margin: 8px 0 0;\n  line-height: 22px;\n  font-size: var(--emw--font-size-x-small, 12px);\n  font-weight: var(--emw--font-weight-medium, 500);\n  color: var(--emw--color-gray-150, #C8D6CE);\n}\n.code-input__text.errored {\n  color: var(--emw--color-error, #D6421E);\n}\n@container challenges-container (max-width: 576px) {\n  .code-input {\n    min-width: 100%;\n  }\n}";export{c as C}