@everymatrix/player-lugas-limit 1.63.2 → 1.64.0

package/dist/esm/player-lugas-limit.entry.js

@@ -135,57 +135,36 @@ function setStreamStyling(stylingContainer, domain, subscription) {
   }
 }
 
-const playerLugasLimitCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");\n:host {\n  font-family: \"Roboto\", sans-serif;\n}\n\n.ModalContainer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: var(--emw--font-size-small, 12px);\n  container-type: inline-size;\n}\n.ModalContainer hr {\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  margin: 10px 0px;\n}\n.ModalContainer p {\n  margin: 0;\n}\n.ModalContainer button {\n  width: 100%;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  padding: 10px 0;\n  cursor: pointer;\n  width: 100%;\n  border-radius: var(--emw--border-radius-small, 4px);\n}\n.ModalContainer button.PrimaryButton {\n  background: var(--emw--color-primary, #6BB816);\n  border: none;\n  font-weight: 500;\n}\n.ModalContainer button.PrimaryButton:not(:disabled) {\n  color: var(--emw--color-white, #FFF);\n}\n.ModalContainer .Container {\n  position: fixed;\n  top: 30vh;\n  width: 320px;\n  background: var(--emw--color-white, #fff);\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  transform: scale(1.1);\n  border-radius: 4px;\n  overflow: hidden;\n}\n.ModalContainer .ValidatorContainer {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n}\n.ModalContainer .Paragraphs:not(:last-child) {\n  margin-bottom: 20px;\n}\n.ModalContainer .ModalHeader {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: var(--emw--color-gray-50, #F7F8FA);\n  padding: 12px;\n}\n.ModalContainer .ModalHeader h2 {\n  font-weight: bold;\n  font-size: var(--emw--font-size-small, 12px);\n  margin: 0;\n}\n.ModalContainer .ModalBody {\n  background: var(--emw--color-white, #FFF);\n  padding: 12px;\n  container-type: inline-size;\n  border-radius: 4px;\n}\n.ModalContainer .ModalBody .ErrorContainer {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-red-100, #E10014);\n  border-bottom: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  margin: -12px;\n  padding: 12px;\n  margin-bottom: 12px;\n  font-weight: bold;\n  position: relative;\n  background: linear-gradient(180deg, var(--emw--color-gray-100, #E8E9EB) 0%, rgba(255, 255, 255, 0.47) 30%);\n}\n.ModalContainer .ModalBody .DismissError {\n  position: absolute;\n  right: 12px;\n  cursor: pointer;\n}\n.ModalContainer .ModalBody .ErrorParagraph {\n  display: flex;\n  align-items: center;\n}\n.ModalContainer .ModalBody .ErrorIcon {\n  background: linear-gradient(180deg, var(--emw--color-red-100, #E10014) 0%, var(--emw--color-red-150, #D60080) 100%);\n  text-align: center;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg {\n  width: 6px;\n  height: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg path {\n  fill: var(--emw--color-white, #FFF);\n}\n.ModalContainer .ModalBody .ChooseLimitLabel {\n  text-transform: uppercase;\n}\n.ModalContainer .ModalBody .LimitAmountWrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  position: relative;\n}\n.ModalContainer .ModalBody .PredefinedAmounts {\n  display: flex;\n  justify-content: space-between;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button {\n  background: none;\n  margin: -1px 0 0 -1px;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button.Active {\n  font-weight: bold;\n  background: var(--emw--color-gray-50, #F7F8FA);\n  color: var(--emw--color-gray-200, #323233);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.ModalContainer .ModalBody .CustomAmountInput {\n  width: 100%;\n  padding: 10px;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-bottom: 6px;\n  color: var(--emw--color-gray-200, #323233);\n  font-weight: bold;\n}\n.ModalContainer .ModalBody .CustomAmountInput.InvalidInput {\n  border: 1px solid var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .InvalidParagraph {\n  font-size: var(--emw--font-size-small, 12px);\n  color: var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .SetLimitBtn {\n  margin-top: 10px;\n}\n.ModalContainer .ModalFooter {\n  padding-top: 12px;\n  margin: 5px 0px;\n}\n.ModalContainer .Link {\n  color: inherit;\n  text-decoration: underline;\n  cursor: pointer;\n}\n.ModalContainer .PrivacyNote {\n  font-size: var(--emw--font-size-x-small, 10px);\n  font-style: italic;\n}\n.ModalContainer .ExistingLimit {\n  margin-bottom: 15px;\n}\n\ninput {\n  /* Firefox */\n  -moz-appearance: textfield;\n  /* Chrome, Safari, Edge, Opera */\n}\ninput::-webkit-outer-spin-button, input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n@container (max-width: 1300px) {\n  .ModalContainer .Container {\n    width: 50%;\n  }\n}\n@container (max-width: 800px) {\n  .ModalContainer .Container {\n    width: 70%;\n  }\n}\n.LoadingWrapper {\n  width: 100%;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.8);\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.spinner {\n  animation: rotate 2s linear infinite;\n  z-index: 2;\n  width: 30px;\n  height: 30px;\n}\n.spinner .path {\n  stroke: var(--emw--color-primary, #6BB816);\n  stroke-linecap: round;\n  animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes dash {\n  0% {\n    stroke-dasharray: 1, 150;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -124;\n  }\n}";
+const playerLugasLimitCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");\n:host {\n  font-family: \"Roboto\", sans-serif;\n}\n\n.ModalContainer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: var(--emw--font-size-small, 12px);\n  container-type: inline-size;\n}\n.ModalContainer hr {\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  margin: 10px 0px;\n}\n.ModalContainer p {\n  margin: 0;\n}\n.ModalContainer button {\n  width: 100%;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  padding: 10px 0;\n  cursor: pointer;\n  width: 100%;\n  border-radius: var(--emw--border-radius-small, 4px);\n}\n.ModalContainer button.PrimaryButton {\n  background: var(--emw--color-primary, #6BB816);\n  border: none;\n  font-weight: 500;\n}\n.ModalContainer button.PrimaryButton:not(:disabled) {\n  color: var(--emw--color-white, #FFF);\n}\n.ModalContainer button.PrimaryButton:disabled {\n  cursor: default;\n}\n.ModalContainer .Container {\n  position: fixed;\n  top: 30vh;\n  width: 320px;\n  background: var(--emw--color-white, #fff);\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  transform: scale(1.1);\n  border-radius: 4px;\n  overflow: hidden;\n}\n.ModalContainer .ValidatorContainer {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n}\n.ModalContainer .Paragraphs:not(:last-child) {\n  margin-bottom: 20px;\n}\n.ModalContainer .ModalHeader {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: var(--emw--color-gray-50, #F7F8FA);\n  padding: 12px;\n}\n.ModalContainer .ModalHeader h2 {\n  font-weight: bold;\n  font-size: var(--emw--font-size-small, 12px);\n  margin: 0;\n}\n.ModalContainer .ModalBody {\n  background: var(--emw--color-white, #FFF);\n  padding: 12px;\n  container-type: inline-size;\n  border-radius: 4px;\n}\n.ModalContainer .ModalBody .ErrorContainer {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-red-100, #E10014);\n  border-bottom: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  margin: -12px;\n  padding: 12px;\n  margin-bottom: 12px;\n  font-weight: bold;\n  position: relative;\n  background: linear-gradient(180deg, var(--emw--color-gray-100, #E8E9EB) 0%, rgba(255, 255, 255, 0.47) 30%);\n}\n.ModalContainer .ModalBody .DismissError {\n  position: absolute;\n  right: 12px;\n  cursor: pointer;\n}\n.ModalContainer .ModalBody .ErrorParagraph {\n  display: flex;\n  align-items: center;\n}\n.ModalContainer .ModalBody .ErrorIcon {\n  background: linear-gradient(180deg, var(--emw--color-red-100, #E10014) 0%, var(--emw--color-red-150, #D60080) 100%);\n  text-align: center;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg {\n  width: 6px;\n  height: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg path {\n  fill: var(--emw--color-white, #FFF);\n}\n.ModalContainer .ModalBody .ChooseLimitLabel {\n  text-transform: uppercase;\n}\n.ModalContainer .ModalBody .LimitAmountWrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  position: relative;\n}\n.ModalContainer .ModalBody .PredefinedAmounts {\n  display: flex;\n  justify-content: space-between;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button {\n  background: none;\n  margin: -1px 0 0 -1px;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button.Active {\n  font-weight: bold;\n  background: var(--emw--color-gray-50, #F7F8FA);\n  color: var(--emw--color-gray-200, #323233);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.ModalContainer .ModalBody .CustomAmountInput {\n  width: 100%;\n  padding: 10px;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-bottom: 6px;\n  color: var(--emw--color-gray-200, #323233);\n  font-weight: bold;\n}\n.ModalContainer .ModalBody .CustomAmountInput.InvalidInput {\n  border: 1px solid var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .InvalidParagraph {\n  font-size: var(--emw--font-size-small, 12px);\n  color: var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .SetLimitBtn {\n  margin-top: 10px;\n}\n.ModalContainer .ModalFooter {\n  padding-top: 12px;\n  margin: 5px 0px;\n}\n.ModalContainer .Link {\n  color: inherit;\n  text-decoration: underline;\n  cursor: pointer;\n}\n.ModalContainer .Link.Inactive {\n  cursor: default;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .PrivacyNote {\n  font-size: var(--emw--font-size-x-small, 10px);\n  font-style: italic;\n}\n.ModalContainer .ExistingLimit {\n  margin-bottom: 15px;\n}\n\ninput {\n  /* Firefox */\n  -moz-appearance: textfield;\n  /* Chrome, Safari, Edge, Opera */\n}\ninput::-webkit-outer-spin-button, input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n@container (max-width: 1300px) {\n  .ModalContainer .Container {\n    width: 50%;\n  }\n}\n@container (max-width: 800px) {\n  .ModalContainer .Container {\n    width: 70%;\n  }\n}\n.LoadingWrapper {\n  width: 100%;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.8);\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.spinner {\n  animation: rotate 2s linear infinite;\n  z-index: 2;\n  width: 30px;\n  height: 30px;\n}\n.spinner .path {\n  stroke: var(--emw--color-primary, #6BB816);\n  stroke-linecap: round;\n  animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes dash {\n  0% {\n    stroke-dasharray: 1, 150;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -124;\n  }\n}";
 const PlayerLugasLimitStyle0 = playerLugasLimitCss;
 
 const PlayerLugasLimit = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.closeLugasModal = createEvent(this, "closeLugasModal", 7);
+        /** Array of predefined limit amounts */
+        this.predefinedAmounts = [];
+        /** Displayed currency */
+        this.displayedCurrency = '';
         /**
-         * Fetches and applies client styling from a URL
-         */
-        this.setClientStyling = () => {
-            const sheet = document.createElement('style');
-            sheet.innerHTML = this.clientStyling;
-            this.stylingContainer.prepend(sheet);
-        };
-        /**
-         * Fetches and applies client styling from a URL
-         */
-        this.setClientStylingURL = () => {
-            const url = new URL(this.clientStylingUrl);
-            const cssFile = document.createElement('style');
-            fetch(url.href)
-                .then((res) => res.text())
-                .then((data) => {
-                cssFile.innerHTML = data;
-                setTimeout(() => {
-                    this.stylingContainer.prepend(cssFile);
-                }, 1);
-            })
-                .catch((err) => {
-                console.log('error ', err);
-            });
-        };
-        /**
-         * Posts the player's limit situation to the API.
+         * Submits the new monthly deposit limit set by the player
          * @param userAmount - User-defined amount
          * @param keepLimit - Whether to keep the current limit
          * @param initialNewLimit - Whether the limit is being set initially
          */
-        this.postPlayerSituation = (userAmount, keepLimit = false, initialNewLimit = false) => {
-            this.wasSubmitted = true;
-            this.errorMessage = '';
+        this.submitMonthlyDepositLimit = (amount, keepLimit = false, initialNewLimit = false) => {
+            if (keepLimit && !this.isUseExistingLimitOptionActive) {
+                return;
+            }
+            this.isSubmitted = true;
+            this.errorMessageOnSubmit = '';
             const url = new URL(`${this.endpoint}v2/player/${this.userId}/limit/lugas`);
-            const roleLimitAmount = initialNewLimit ? this.amount : 0;
-            const bodyDraft = {
+            const roleLimitAmount = initialNewLimit ? this.newAmount : 0;
+            const body = {
+                amount,
                 keepLimit,
                 roleLimitAmount
             };
-            if (userAmount) {
-                bodyDraft['amount'] = `${userAmount}`;
-            }
             const options = {
                 method: 'POST',
                 headers: {
@@ -194,7 +173,7 @@ const PlayerLugasLimit = class {
                     'Content-Type': 'application/json',
                     'Authorization': `Bearer ${this.session}`
                 },
-                body: JSON.stringify(bodyDraft)
+                body: JSON.stringify(body)
             };
             fetch(url.href, options)
                 .then(async (res) => {
@@ -203,10 +182,13 @@ const PlayerLugasLimit = class {
                     throw errorResponse; // Throw the error response to handle later
                 }
                 this.closeLugasModal.emit();
-                return res.json();
             })
                 .catch((err) => {
                 var _a;
+                this.errorMessageOnSubmit = translate('LugasNotSet', this.lang);
+                if (keepLimit) {
+                    this.isUseExistingLimitOptionActive = false;
+                }
                 // Check for specific error structure
                 if (err.errorCode === 3 && err.errorSourceName === "GmLegislation") {
                     console.error(err.error, (_a = err.thirdPartyResponse) === null || _a === void 0 ? void 0 : _a.message);
@@ -214,10 +196,8 @@ const PlayerLugasLimit = class {
                 else {
                     console.error("Unexpected Error:", err);
                 }
-                this.errorMessage = translate('LugasNotSet', this.lang);
-            }).finally(() => {
-                this.wasSubmitted = false;
-            });
+            })
+                .finally(() => this.isSubmitted = false);
         };
         this.userId = '';
         this.session = '';
@@ -229,19 +209,15 @@ const PlayerLugasLimit = class {
         this.clientStylingUrl = '';
         this.mbSource = undefined;
         this.translationUrl = '';
-        this.showCustomAmount = false;
         this.isLoading = false;
-        this.hasErrors = false;
-        this.inputValue = '';
-        this.showInvalidInputError = false;
-        this.predefinedAmountsArray = [];
-        this.isWithinRange = undefined;
-        this.minimumRange = undefined;
+        this.showCustomAmount = false;
+        this.isSubmitted = false;
+        this.isUseExistingLimitOptionActive = true;
         this.selectedPredefinedAmount = undefined;
-        this.errorMessage = '';
-        this.wasSubmitted = false;
-        this.minAmount = undefined;
-        this.maxAmount = undefined;
+        this.errorMessageOnInitialization = '';
+        this.errorMessageOnSubmit = '';
+        this.errorMessageOnInput = '';
+        this.newAmount = '';
     }
     /**
      * Watch for changes in the translation URL and fetch new translations
@@ -267,7 +243,8 @@ const PlayerLugasLimit = class {
         if (this.translationUrl.length > 2) {
             await getTranslations(this.translationUrl);
         }
-        await this.getMonthlyDepositLimit();
+        await this.getMonthlyDepositLimitConfig();
+        this.displayedCurrency = this.currency === 'EUR' ? '€' : this.currency;
     }
     componentDidLoad() {
         if (this.stylingContainer) {
@@ -290,7 +267,7 @@ const PlayerLugasLimit = class {
      *
      * @returns Promise - Promise that resolves when the configuration is fetched
      */
-    async getMonthlyDepositLimit() {
+    async getMonthlyDepositLimitConfig() {
         const url = new URL(`${this.endpoint}api/v1/gm/legislation/config/month-deposit-limit`);
         this.isLoading = true;
         return new Promise((resolve) => {
@@ -302,17 +279,15 @@ const PlayerLugasLimit = class {
                 return res.json();
             })
                 .then((data) => {
-                this.predefinedAmountsArray = data.preDefinedOptions;
+                this.predefinedAmounts = data.preDefinedOptions;
                 this.minAmount = data.minAmount;
                 this.maxAmount = data.maxAmount;
                 resolve(true);
             }).catch((err) => {
-                this.hasErrors = true;
+                this.errorMessageOnInitialization = translate('error', this.lang);
                 console.log(err);
             })
-                .finally(() => {
-                this.isLoading = false;
-            });
+                .finally(() => this.isLoading = false);
         });
     }
     /**
@@ -321,32 +296,30 @@ const PlayerLugasLimit = class {
      */
     handleSubmit(event) {
         event.preventDefault();
-        if (this.showInvalidInputError) {
-            return;
+        if (!this.errorMessageOnInput) {
+            this.submitMonthlyDepositLimit(this.newAmount, false, true);
         }
-        this.postPlayerSituation(this.inputValue, false, true);
-    }
-    /**
-     * Checks if the input contains only digits.
-     * @param input - The input to validate
-     */
-    containsOnlyDigits(input) {
-        const regex = /^[0-9]+$/;
-        return regex.test(input);
     }
     /**
      * Handles input changes.
      * @param event - The input change event
      */
     handleInputChange(event) {
-        const inputValue = event.target.value;
-        this.showInvalidInputError = false;
-        this.inputValue = inputValue;
+        this.newAmount = event.target.value;
         // Perform validation checks
-        this.isValidNumber = !isNaN(Number(inputValue)) && this.containsOnlyDigits(inputValue);
-        this.minimumRange = Number(inputValue) >= this.minAmount;
-        this.isWithinRange = Number(inputValue) <= this.maxAmount;
-        this.showInvalidInputError = inputValue ? !this.isValidNumber || !this.isWithinRange || !this.minimumRange : false;
+        this.isValidNumber = !isNaN(Number(this.newAmount));
+        this.isWithinRange = (Number(this.newAmount) >= this.minAmount) && (Number(this.newAmount) <= this.maxAmount);
+        if (!this.isWithinRange || !this.isValidNumber) {
+            this.errorMessageOnInput = translate('invalidInputMessageLimit', this.lang, { values: { currency: this.displayedCurrency, minValue: this.minAmount, maxValue: this.maxAmount } });
+        }
+        else {
+            this.errorMessageOnInput = '';
+            const newAmountSplit = this.newAmount.split('.');
+            if (newAmountSplit.length > 1) {
+                this.newAmount = `${newAmountSplit[0]}.${newAmountSplit[1].slice(0, 2)}`;
+                event.target.value = this.newAmount;
+            }
+        }
     }
     /**
      * Handles predefined amount clicks.
@@ -354,22 +327,20 @@ const PlayerLugasLimit = class {
      */
     handleAmountClick(amount) {
         this.showCustomAmount = false;
-        this.amount = amount;
-        this.inputValue = '';
-        this.showInvalidInputError = false;
+        this.errorMessageOnInput = '';
         this.selectedPredefinedAmount = amount;
         switch (amount) {
             case 'Other':
+                this.newAmount = '';
                 this.showCustomAmount = true;
-                this.amount = '';
                 break;
             case 'Max':
+                this.newAmount = this.maxAmount.toString();
                 this.showCustomAmount = true;
-                this.amount = this.maxAmount.toString();
-                this.inputValue = this.maxAmount.toString();
                 break;
             default:
-                this.postPlayerSituation(this.amount, false, true);
+                this.newAmount = amount;
+                this.submitMonthlyDepositLimit(this.newAmount, false, true);
                 break;
         }
     }
@@ -384,15 +355,14 @@ const PlayerLugasLimit = class {
      * Renders the validator.
      */
     renderValidator() {
-        const displayedCurrency = this.currency === 'EUR' ? '€' : this.currency;
         const renderPredefinedButtons = () => {
-            return this.predefinedAmountsArray.map((currentAmount) => (h("button", { class: this.selectedPredefinedAmount === currentAmount ? 'Active' : '', onClick: () => this.handleAmountClick(currentAmount) }, currentAmount)));
+            return this.predefinedAmounts.map((currentAmount) => (h("button", { class: this.selectedPredefinedAmount === currentAmount ? 'Active' : '', onClick: () => this.handleAmountClick(currentAmount) }, currentAmount)));
         };
-        return (h("div", { class: "ValidatorContainer" }, this.errorMessage && (h("div", { class: "ErrorContainer" }, h("span", { class: "DismissError", onClick: () => this.errorMessage = '' }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "9", height: "9", viewBox: "0 0 9 9", fill: "none" }, h("path", { d: "M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z", fill: "#111111" }))), h("p", { class: "ErrorParagraph" }, h("span", { class: "ErrorIcon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "9", height: "9", viewBox: "0 0 9 9" }, h("path", { d: "M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z" }))), this.errorMessage))), h("div", { class: "Paragraphs" }, h("p", null, translate('LugasInfoBox', this.lang))), h("div", { class: "LimitAmountWrapper" }, this.wasSubmitted
+        return (h("div", { class: "ValidatorContainer" }, this.errorMessageOnSubmit && (h("div", { class: "ErrorContainer" }, h("span", { class: "DismissError", onClick: () => this.errorMessageOnSubmit = '' }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "9", height: "9", viewBox: "0 0 9 9", fill: "none" }, h("path", { d: "M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z", fill: "#111111" }))), h("p", { class: "ErrorParagraph" }, h("span", { class: "ErrorIcon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "9", height: "9", viewBox: "0 0 9 9" }, h("path", { d: "M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z" }))), this.errorMessageOnSubmit))), h("div", { class: "Paragraphs" }, h("p", null, translate('LugasInfoBox', this.lang))), h("div", { class: "LimitAmountWrapper" }, this.isSubmitted
             && h("slot", { name: 'spinner' })
             && h("div", { class: "LoadingWrapper" }, h("svg", { class: "spinner", viewBox: "0 0 50 50" }, h("circle", { class: "path", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "5" }))), h("p", { class: "ChooseLimitLabel" }, translate('ChooseLimit', this.lang)), h("div", { class: "PredefinedAmounts" }, h("button", { class: this.selectedPredefinedAmount === 'Other' ? 'Active' : '', onClick: () => this.handleAmountClick('Other') }, translate('ButtonCustomValue', this.lang)), renderPredefinedButtons(), h("button", { class: this.selectedPredefinedAmount === 'Max' ? 'Active' : '', onClick: () => this.handleAmountClick('Max') }, translate('ButtonMax', this.lang))), this.showCustomAmount && (h("form", { onSubmit: (event) => this.handleSubmit(event) }, this.showCustomAmount &&
-            h("div", null, h("input", { class: `CustomAmountInput ${this.showInvalidInputError ? 'InvalidInput' : ''}`, type: "number", value: this.amount, onInput: (event) => this.handleInputChange(event), placeholder: "0.00", disabled: this.selectedPredefinedAmount === 'Max' }), this.showInvalidInputError && (h("p", { class: "InvalidParagraph" }, translate('invalidInputMessageLimit', this.lang, { values: { currency: displayedCurrency, minValue: this.minAmount, maxValue: this.maxAmount } })))), this.selectedPredefinedAmount &&
-            h("button", { class: "PrimaryButton SetLimitBtn", type: "submit", disabled: this.wasSubmitted }, translate('LugasSetLimitDialogButtonSetLimit', this.lang, { values: { currency: displayedCurrency, amount: this.inputValue || '0.00' } }))))), h("div", { class: "ModalFooter" }, h("hr", null), h("div", { class: "Paragraphs" }, h("p", { class: "ExistingLimit" }, translate('LugasSetLimitDialogExistingLimit.text', this.lang), h("span", { class: "Link", onClick: () => this.postPlayerSituation(this.amount, true) }, translate('LugasSetLimitDialogExistingLimit.link', this.lang))), h("p", { class: "PrivacyNote" }, translate('LugasSetLimitDialogPrivacyNote.text', this.lang), h("span", { class: "Link", onClick: this.goToPrivacyPolicy }, translate('LugasSetLimitDialogPrivacyNote.link', this.lang)))))));
+            h("div", null, h("input", { class: `CustomAmountInput ${this.errorMessageOnInput ? 'InvalidInput' : ''}`, type: "number", value: this.selectedPredefinedAmount === 'Max' ? this.maxAmount : null, step: 0.01, placeholder: "0.00", disabled: this.selectedPredefinedAmount === 'Max', onInput: (event) => this.handleInputChange(event) }), this.errorMessageOnInput && h("p", { class: "InvalidParagraph" }, this.errorMessageOnInput)), this.selectedPredefinedAmount &&
+            h("button", { class: "PrimaryButton SetLimitBtn", type: "submit", disabled: this.isSubmitted || !Boolean(this.newAmount) || Boolean(this.errorMessageOnInput) }, translate('LugasSetLimitDialogButtonSetLimit', this.lang, { values: { currency: this.displayedCurrency, amount: this.newAmount || '0.00' } }))))), h("div", { class: "ModalFooter" }, h("hr", null), h("div", { class: "Paragraphs" }, h("p", { class: "ExistingLimit" }, translate('LugasSetLimitDialogExistingLimit.text', this.lang), h("span", { class: this.isUseExistingLimitOptionActive ? 'Link' : 'Link Inactive', onClick: () => this.submitMonthlyDepositLimit(this.amount, true) }, translate('LugasSetLimitDialogExistingLimit.link', this.lang))), h("p", { class: "PrivacyNote" }, translate('LugasSetLimitDialogPrivacyNote.text', this.lang), h("span", { class: "Link", onClick: this.goToPrivacyPolicy }, translate('LugasSetLimitDialogPrivacyNote.link', this.lang)))))));
     }
     /**
      * Renders the component.
@@ -401,8 +371,8 @@ const PlayerLugasLimit = class {
         if (this.isLoading) {
             return (h("div", null, h("p", null, translate('loading', this.lang, { values: { currency: this.currency } }))));
         }
-        else if (this.hasErrors) {
-            return (h("div", null, h("p", null, translate('error', this.lang))));
+        else if (this.errorMessageOnInitialization) {
+            return (h("div", null, h("p", null, this.errorMessageOnInitialization)));
         }
         else {
             const validationContainer = this.renderValidator();

package/dist/esm/player-lugas-limit.js

@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["player-lugas-limit",[[1,"player-lugas-limit",{"userId":[1,"user-id"],"session":[1],"endpoint":[1],"currency":[1],"amount":[1],"lang":[1],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"showCustomAmount":[32],"isLoading":[32],"hasErrors":[32],"inputValue":[32],"showInvalidInputError":[32],"predefinedAmountsArray":[32],"isWithinRange":[32],"minimumRange":[32],"selectedPredefinedAmount":[32],"errorMessage":[32],"wasSubmitted":[32],"minAmount":[32],"maxAmount":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}]]]], options);
+  return bootstrapLazy([["player-lugas-limit",[[1,"player-lugas-limit",{"userId":[1,"user-id"],"session":[1],"endpoint":[1],"currency":[1],"amount":[1],"lang":[1],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"mbSource":[1,"mb-source"],"translationUrl":[1,"translation-url"],"isLoading":[32],"showCustomAmount":[32],"isSubmitted":[32],"isUseExistingLimitOptionActive":[32],"selectedPredefinedAmount":[32],"errorMessageOnInitialization":[32],"errorMessageOnSubmit":[32],"errorMessageOnInput":[32],"newAmount":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"]}]]]], options);
 });

package/dist/player-lugas-limit/p-432a02a8.entry.js

@@ -0,0 +1 @@
+import{r as n,c as t,h as i}from"./p-cb6ab8af.js";let e={en:{LugasSetLimitDialogTitle:"Monthly Central Deposit Limit",LugasInfoBox:"The central limit is your monthly deposit limit for all licensed websites in Germany. Note that your limit and deposit details may vary if changed on other sites.",ChooseLimit:"Choose Limit",ButtonCustomValue:"Other",ButtonMax:"Max",LugasSetLimitDialogButtonSetLimit:"SET LIMIT {amount} {currency}",invalidInputMessageLimit:"The value entered must be between {minValue} {currency} and {maxValue} {currency}.",LugasSetLimitDialogPrivacyNote:{text:"The selected limit is connected to processing player's personal data due to our legal obligations. In some cases setting a limit is a consent to processing player's personal data. For details see our ",link:"Privacy Policy"},LugasSetLimitDialogExistingLimit:{text:"If you would like to use your existing limit ",link:"click here"},LugasNotSet:"No deposit limit set. Please enter a new limit.",loading:"Loading, please wait ...",error:"It was an error while trying to fetch the data"},de:{LugasSetLimitDialogTitle:"Monatliches zentrales Einzahlungslimit",LugasInfoBox:"Das zentrale Limit ist Ihr monatliches Einzahlungslimit für alle lizenzierten Websites in Deutschland. Beachten Sie, dass sich Ihr Limit und der verbleibende Betrag ändern können, wenn Sie auf anderen Websites Einzahlungen vornehmen oder Ihr Limit anpassen.",ChooseLimit:"Limit wählen",ButtonCustomValue:"Eigener",ButtonMax:"Max",LugasSetLimitDialogButtonSetLimit:"LIMIT SETZEN {amount} {currency}",invalidInputMessageLimit:"Der eingegebene Wert muss zwischen {minValue} und {maxValue} {currency} liegen.",LugasSetLimitDialogPrivacyNote:{text:"Das gewählte Limit steht wegen unserer rechtlichen Verpflichtungen in Verbindung mit der Verarbeitung persönlicher Daten der Spieler. In manchen Fällen gilt das Setzen eines Limits als Einwilligung zur Verarbeitung persönlicher Daten des Spielers. Mehr Infos unter ",link:"Erklärung zum Datenschutz"},LugasSetLimitDialogExistingLimit:{text:"Wenn Sie Ihr bestehendes Limit nutzen möchten, ",link:"klicken Sie hier"},LugasNotSet:"Kein Einzahlungslimit festgelegt. Bitte geben Sie ein neues Limit ein.",loading:"Laden, bitte warten ...",error:"Beim Versuch, die Daten abzurufen, ist ein Fehler aufgetreten"}};const o=n=>new Promise((t=>{fetch(n).then((n=>n.json())).then((n=>{Object.keys(n).forEach((t=>{e[t]||(e[t]={});for(let i in n[t])e[t][i]=n[t][i]})),t(!0)}))})),a=(n,t,i)=>{let o=(a=e[t||"de"],n.split(".").reduce(((n,t)=>n&&void 0!==n[t]?n[t]:null),a));var a;if(null===o)return n;if(void 0!==i)for(const[n,t]of Object.entries(i.values)){const i=new RegExp(`{${n}}`,"g");o=o.replace(i,t)}return o};function s(n,t){if(n){const i=document.createElement("style");i.innerHTML=t,n.appendChild(i)}}function r(n,t){const i=new URL(t);fetch(i.href).then((n=>n.text())).then((t=>{const i=document.createElement("style");i.innerHTML=t,n&&n.appendChild(i)})).catch((n=>{console.error("There was an error while trying to load client styling from URL",n)}))}const l=class{constructor(i){n(this,i),this.closeLugasModal=t(this,"closeLugasModal",7),this.predefinedAmounts=[],this.displayedCurrency="",this.submitMonthlyDepositLimit=(n,t=!1,i=!1)=>{if(t&&!this.isUseExistingLimitOptionActive)return;this.isSubmitted=!0,this.errorMessageOnSubmit="";const e=new URL(`${this.endpoint}v2/player/${this.userId}/limit/lugas`),o={method:"POST",headers:{"X-SessionId":this.session,"X-Session-Type":"others","Content-Type":"application/json",Authorization:`Bearer ${this.session}`},body:JSON.stringify({amount:n,keepLimit:t,roleLimitAmount:i?this.newAmount:0})};fetch(e.href,o).then((async n=>{if(!n.ok)throw await n.json();this.closeLugasModal.emit()})).catch((n=>{var i;this.errorMessageOnSubmit=a("LugasNotSet",this.lang),t&&(this.isUseExistingLimitOptionActive=!1),3===n.errorCode&&"GmLegislation"===n.errorSourceName?console.error(n.error,null===(i=n.thirdPartyResponse)||void 0===i?void 0:i.message):console.error("Unexpected Error:",n)})).finally((()=>this.isSubmitted=!1))},this.userId="",this.session="",this.endpoint="",this.currency="EUR",this.amount="",this.lang=void 0,this.clientStyling="",this.clientStylingUrl="",this.mbSource=void 0,this.translationUrl="",this.isLoading=!1,this.showCustomAmount=!1,this.isSubmitted=!1,this.isUseExistingLimitOptionActive=!0,this.selectedPredefinedAmount=void 0,this.errorMessageOnInitialization="",this.errorMessageOnSubmit="",this.errorMessageOnInput="",this.newAmount=""}handleNewTranslations(){o(this.translationUrl)}handleClientStylingChange(n,t){n!=t&&s(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(n,t){n!=t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}async componentWillLoad(){this.translationUrl.length>2&&await o(this.translationUrl),await this.getMonthlyDepositLimitConfig(),this.displayedCurrency="EUR"===this.currency?"€":this.currency}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(n,t){if(window.emMessageBus){const i=document.createElement("style");window.emMessageBus.subscribe(t,(t=>{i.innerHTML=t,n&&n.appendChild(i)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&s(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}async getMonthlyDepositLimitConfig(){const n=new URL(`${this.endpoint}api/v1/gm/legislation/config/month-deposit-limit`);return this.isLoading=!0,new Promise((t=>{fetch(n.href).then((n=>{if(n.status>=300)throw new Error("There was an error while fetching the configuration");return n.json()})).then((n=>{this.predefinedAmounts=n.preDefinedOptions,this.minAmount=n.minAmount,this.maxAmount=n.maxAmount,t(!0)})).catch((n=>{this.errorMessageOnInitialization=a("error",this.lang),console.log(n)})).finally((()=>this.isLoading=!1))}))}handleSubmit(n){n.preventDefault(),this.errorMessageOnInput||this.submitMonthlyDepositLimit(this.newAmount,!1,!0)}handleInputChange(n){if(this.newAmount=n.target.value,this.isValidNumber=!isNaN(Number(this.newAmount)),this.isWithinRange=Number(this.newAmount)>=this.minAmount&&Number(this.newAmount)<=this.maxAmount,this.isWithinRange&&this.isValidNumber){this.errorMessageOnInput="";const t=this.newAmount.split(".");t.length>1&&(this.newAmount=`${t[0]}.${t[1].slice(0,2)}`,n.target.value=this.newAmount)}else this.errorMessageOnInput=a("invalidInputMessageLimit",this.lang,{values:{currency:this.displayedCurrency,minValue:this.minAmount,maxValue:this.maxAmount}})}handleAmountClick(n){switch(this.showCustomAmount=!1,this.errorMessageOnInput="",this.selectedPredefinedAmount=n,n){case"Other":this.newAmount="",this.showCustomAmount=!0;break;case"Max":this.newAmount=this.maxAmount.toString(),this.showCustomAmount=!0;break;default:this.newAmount=n,this.submitMonthlyDepositLimit(this.newAmount,!1,!0)}}goToPrivacyPolicy(){window.postMessage({type:"GoToPrivacyPolicy"})}renderValidator(){return i("div",{class:"ValidatorContainer"},this.errorMessageOnSubmit&&i("div",{class:"ErrorContainer"},i("span",{class:"DismissError",onClick:()=>this.errorMessageOnSubmit=""},i("svg",{xmlns:"http://www.w3.org/2000/svg",width:"9",height:"9",viewBox:"0 0 9 9",fill:"none"},i("path",{d:"M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z",fill:"#111111"}))),i("p",{class:"ErrorParagraph"},i("span",{class:"ErrorIcon"},i("svg",{xmlns:"http://www.w3.org/2000/svg",width:"9",height:"9",viewBox:"0 0 9 9"},i("path",{d:"M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z"}))),this.errorMessageOnSubmit)),i("div",{class:"Paragraphs"},i("p",null,a("LugasInfoBox",this.lang))),i("div",{class:"LimitAmountWrapper"},this.isSubmitted&&i("slot",{name:"spinner"})&&i("div",{class:"LoadingWrapper"},i("svg",{class:"spinner",viewBox:"0 0 50 50"},i("circle",{class:"path",cx:"25",cy:"25",r:"20",fill:"none","stroke-width":"5"}))),i("p",{class:"ChooseLimitLabel"},a("ChooseLimit",this.lang)),i("div",{class:"PredefinedAmounts"},i("button",{class:"Other"===this.selectedPredefinedAmount?"Active":"",onClick:()=>this.handleAmountClick("Other")},a("ButtonCustomValue",this.lang)),(()=>this.predefinedAmounts.map((n=>i("button",{class:this.selectedPredefinedAmount===n?"Active":"",onClick:()=>this.handleAmountClick(n)},n))))(),i("button",{class:"Max"===this.selectedPredefinedAmount?"Active":"",onClick:()=>this.handleAmountClick("Max")},a("ButtonMax",this.lang))),this.showCustomAmount&&i("form",{onSubmit:n=>this.handleSubmit(n)},this.showCustomAmount&&i("div",null,i("input",{class:"CustomAmountInput "+(this.errorMessageOnInput?"InvalidInput":""),type:"number",value:"Max"===this.selectedPredefinedAmount?this.maxAmount:null,step:.01,placeholder:"0.00",disabled:"Max"===this.selectedPredefinedAmount,onInput:n=>this.handleInputChange(n)}),this.errorMessageOnInput&&i("p",{class:"InvalidParagraph"},this.errorMessageOnInput)),this.selectedPredefinedAmount&&i("button",{class:"PrimaryButton SetLimitBtn",type:"submit",disabled:this.isSubmitted||!Boolean(this.newAmount)||Boolean(this.errorMessageOnInput)},a("LugasSetLimitDialogButtonSetLimit",this.lang,{values:{currency:this.displayedCurrency,amount:this.newAmount||"0.00"}})))),i("div",{class:"ModalFooter"},i("hr",null),i("div",{class:"Paragraphs"},i("p",{class:"ExistingLimit"},a("LugasSetLimitDialogExistingLimit.text",this.lang),i("span",{class:this.isUseExistingLimitOptionActive?"Link":"Link Inactive",onClick:()=>this.submitMonthlyDepositLimit(this.amount,!0)},a("LugasSetLimitDialogExistingLimit.link",this.lang))),i("p",{class:"PrivacyNote"},a("LugasSetLimitDialogPrivacyNote.text",this.lang),i("span",{class:"Link",onClick:this.goToPrivacyPolicy},a("LugasSetLimitDialogPrivacyNote.link",this.lang))))))}render(){if(this.isLoading)return i("div",null,i("p",null,a("loading",this.lang,{values:{currency:this.currency}})));if(this.errorMessageOnInitialization)return i("div",null,i("p",null,this.errorMessageOnInitialization));{const n=this.renderValidator();return i("div",{class:"ModalContainer",ref:n=>this.stylingContainer=n},i("div",{class:"Container"},i("div",{class:"ModalHeader"},i("h2",null,a("LugasSetLimitDialogTitle",this.lang))),i("div",{class:"ModalBody"},n)))}}static get watchers(){return{translationUrl:["handleNewTranslations"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}}};l.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");\n:host {\n  font-family: "Roboto", sans-serif;\n}\n\n.ModalContainer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: var(--emw--font-size-small, 12px);\n  container-type: inline-size;\n}\n.ModalContainer hr {\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  margin: 10px 0px;\n}\n.ModalContainer p {\n  margin: 0;\n}\n.ModalContainer button {\n  width: 100%;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  padding: 10px 0;\n  cursor: pointer;\n  width: 100%;\n  border-radius: var(--emw--border-radius-small, 4px);\n}\n.ModalContainer button.PrimaryButton {\n  background: var(--emw--color-primary, #6BB816);\n  border: none;\n  font-weight: 500;\n}\n.ModalContainer button.PrimaryButton:not(:disabled) {\n  color: var(--emw--color-white, #FFF);\n}\n.ModalContainer button.PrimaryButton:disabled {\n  cursor: default;\n}\n.ModalContainer .Container {\n  position: fixed;\n  top: 30vh;\n  width: 320px;\n  background: var(--emw--color-white, #fff);\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  transform: scale(1.1);\n  border-radius: 4px;\n  overflow: hidden;\n}\n.ModalContainer .ValidatorContainer {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n}\n.ModalContainer .Paragraphs:not(:last-child) {\n  margin-bottom: 20px;\n}\n.ModalContainer .ModalHeader {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: var(--emw--color-gray-50, #F7F8FA);\n  padding: 12px;\n}\n.ModalContainer .ModalHeader h2 {\n  font-weight: bold;\n  font-size: var(--emw--font-size-small, 12px);\n  margin: 0;\n}\n.ModalContainer .ModalBody {\n  background: var(--emw--color-white, #FFF);\n  padding: 12px;\n  container-type: inline-size;\n  border-radius: 4px;\n}\n.ModalContainer .ModalBody .ErrorContainer {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-red-100, #E10014);\n  border-bottom: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  margin: -12px;\n  padding: 12px;\n  margin-bottom: 12px;\n  font-weight: bold;\n  position: relative;\n  background: linear-gradient(180deg, var(--emw--color-gray-100, #E8E9EB) 0%, rgba(255, 255, 255, 0.47) 30%);\n}\n.ModalContainer .ModalBody .DismissError {\n  position: absolute;\n  right: 12px;\n  cursor: pointer;\n}\n.ModalContainer .ModalBody .ErrorParagraph {\n  display: flex;\n  align-items: center;\n}\n.ModalContainer .ModalBody .ErrorIcon {\n  background: linear-gradient(180deg, var(--emw--color-red-100, #E10014) 0%, var(--emw--color-red-150, #D60080) 100%);\n  text-align: center;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg {\n  width: 6px;\n  height: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg path {\n  fill: var(--emw--color-white, #FFF);\n}\n.ModalContainer .ModalBody .ChooseLimitLabel {\n  text-transform: uppercase;\n}\n.ModalContainer .ModalBody .LimitAmountWrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  position: relative;\n}\n.ModalContainer .ModalBody .PredefinedAmounts {\n  display: flex;\n  justify-content: space-between;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button {\n  background: none;\n  margin: -1px 0 0 -1px;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button.Active {\n  font-weight: bold;\n  background: var(--emw--color-gray-50, #F7F8FA);\n  color: var(--emw--color-gray-200, #323233);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.ModalContainer .ModalBody .CustomAmountInput {\n  width: 100%;\n  padding: 10px;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-bottom: 6px;\n  color: var(--emw--color-gray-200, #323233);\n  font-weight: bold;\n}\n.ModalContainer .ModalBody .CustomAmountInput.InvalidInput {\n  border: 1px solid var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .InvalidParagraph {\n  font-size: var(--emw--font-size-small, 12px);\n  color: var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .SetLimitBtn {\n  margin-top: 10px;\n}\n.ModalContainer .ModalFooter {\n  padding-top: 12px;\n  margin: 5px 0px;\n}\n.ModalContainer .Link {\n  color: inherit;\n  text-decoration: underline;\n  cursor: pointer;\n}\n.ModalContainer .Link.Inactive {\n  cursor: default;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .PrivacyNote {\n  font-size: var(--emw--font-size-x-small, 10px);\n  font-style: italic;\n}\n.ModalContainer .ExistingLimit {\n  margin-bottom: 15px;\n}\n\ninput {\n  /* Firefox */\n  -moz-appearance: textfield;\n  /* Chrome, Safari, Edge, Opera */\n}\ninput::-webkit-outer-spin-button, input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n@container (max-width: 1300px) {\n  .ModalContainer .Container {\n    width: 50%;\n  }\n}\n@container (max-width: 800px) {\n  .ModalContainer .Container {\n    width: 70%;\n  }\n}\n.LoadingWrapper {\n  width: 100%;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.8);\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.spinner {\n  animation: rotate 2s linear infinite;\n  z-index: 2;\n  width: 30px;\n  height: 30px;\n}\n.spinner .path {\n  stroke: var(--emw--color-primary, #6BB816);\n  stroke-linecap: round;\n  animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes dash {\n  0% {\n    stroke-dasharray: 1, 150;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -124;\n  }\n}';export{l as player_lugas_limit}

package/dist/player-lugas-limit/player-lugas-limit.esm.js

@@ -1 +1 @@
-import{p as n,b as t}from"./p-cb6ab8af.js";export{s as setNonce}from"./p-cb6ab8af.js";import{g as e}from"./p-e1255160.js";(()=>{const t=import.meta.url,e={};return""!==t&&(e.resourcesUrl=new URL(".",t).href),n(e)})().then((async n=>(await e(),t([["p-2f7ef26b",[[1,"player-lugas-limit",{userId:[1,"user-id"],session:[1],endpoint:[1],currency:[1],amount:[1],lang:[1],clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],mbSource:[1,"mb-source"],translationUrl:[1,"translation-url"],showCustomAmount:[32],isLoading:[32],hasErrors:[32],inputValue:[32],showInvalidInputError:[32],predefinedAmountsArray:[32],isWithinRange:[32],minimumRange:[32],selectedPredefinedAmount:[32],errorMessage:[32],wasSubmitted:[32],minAmount:[32],maxAmount:[32]},null,{translationUrl:["handleNewTranslations"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}]]]],n))));
+import{p as n,b as t}from"./p-cb6ab8af.js";export{s as setNonce}from"./p-cb6ab8af.js";import{g as e}from"./p-e1255160.js";(()=>{const t=import.meta.url,e={};return""!==t&&(e.resourcesUrl=new URL(".",t).href),n(e)})().then((async n=>(await e(),t([["p-432a02a8",[[1,"player-lugas-limit",{userId:[1,"user-id"],session:[1],endpoint:[1],currency:[1],amount:[1],lang:[1],clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],mbSource:[1,"mb-source"],translationUrl:[1,"translation-url"],isLoading:[32],showCustomAmount:[32],isSubmitted:[32],isUseExistingLimitOptionActive:[32],selectedPredefinedAmount:[32],errorMessageOnInitialization:[32],errorMessageOnSubmit:[32],errorMessageOnInput:[32],newAmount:[32]},null,{translationUrl:["handleNewTranslations"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}]]]],n))));

package/dist/types/components/player-lugas-limit/player-lugas-limit.d.ts

@@ -20,41 +20,42 @@ export declare class PlayerLugasLimit {
     clientStyling: string;
     /** URL for fetching client-specific styling */
     clientStylingUrl: string;
+    /** Client custom styling via streamStyling */
     mbSource: string;
     /** URL for fetching translation strings */
     translationUrl: string;
-    /** Show custom amount state */
-    private showCustomAmount;
     /** Loading state for the component */
-    private isLoading;
-    /** Error state for the component */
-    private hasErrors;
-    /** Value entered in the input field */
-    inputValue: string;
-    /** Show error flag */
-    private showInvalidInputError;
-    /** Array of predefined amounts */
-    private predefinedAmountsArray;
-    /** Flag for checking if input is within range */
-    isWithinRange: boolean;
-    /** Flag for checking if input meets minimum range */
-    minimumRange: boolean;
+    isLoading: boolean;
+    /** Show custom amount state */
+    showCustomAmount: boolean;
+    /** Flag for checking if the limit amount has been submitted successfully */
+    isSubmitted: boolean;
+    /** Flag for checking if the 'use your existing limit' button is available. Turns false after first failed attempt */
+    isUseExistingLimitOptionActive: boolean;
     /** Selected predefined amount */
     selectedPredefinedAmount: string;
-    /** Error message */
-    errorMessage: string;
-    /** Checks if the input has a valid number of decimal places */
-    wasSubmitted: boolean;
-    /** Minimum amount */
-    minAmount: number;
-    /** Maximum amount */
-    maxAmount: number;
+    /** Error state for the component */
+    errorMessageOnInitialization: string;
+    /** Error message on limit submission */
+    errorMessageOnSubmit: string;
+    /** Error message on custom amount input */
+    errorMessageOnInput: string;
+    /** New limit amount */
+    newAmount: string;
     /** Event to emit for closing the popup */
     closeLugasModal: EventEmitter<object>;
-    /** Checks if input is a valid number */
+    /** Array of predefined limit amounts */
+    predefinedAmounts: string[];
+    /** Flag for checking if input is a valid number */
     isValidNumber: boolean;
-    /** Checks if the input has a valid decimal separator */
-    hasValidDecimalSeparator: boolean;
+    /** Flag for checking if input is within range */
+    isWithinRange: boolean;
+    /** Minimum limit amount */
+    minAmount: number;
+    /** Maximum limit amount */
+    maxAmount: number;
+    /** Displayed currency */
+    displayedCurrency: string;
     /** Container for applying dynamic styling */
     private stylingContainer;
     private stylingSubscription;
@@ -75,32 +76,19 @@ export declare class PlayerLugasLimit {
      *
      * @returns Promise - Promise that resolves when the configuration is fetched
      */
-    getMonthlyDepositLimit(): Promise<unknown>;
-    /**
-     * Fetches and applies client styling from a URL
-     */
-    setClientStyling: () => void;
+    getMonthlyDepositLimitConfig(): Promise<boolean>;
     /**
-     * Fetches and applies client styling from a URL
-     */
-    setClientStylingURL: () => void;
-    /**
-     * Posts the player's limit situation to the API.
+     * Submits the new monthly deposit limit set by the player
      * @param userAmount - User-defined amount
      * @param keepLimit - Whether to keep the current limit
      * @param initialNewLimit - Whether the limit is being set initially
      */
-    postPlayerSituation: (userAmount?: string, keepLimit?: boolean, initialNewLimit?: boolean) => void;
+    submitMonthlyDepositLimit: (amount: string, keepLimit?: boolean, initialNewLimit?: boolean) => void;
     /**
      * Handles form submission.
      * @param event - The form submission event
      */
     handleSubmit(event: Event): void;
-    /**
-     * Checks if the input contains only digits.
-     * @param input - The input to validate
-     */
-    containsOnlyDigits(input: string): boolean;
     /**
      * Handles input changes.
      * @param event - The input change event

package/dist/types/components.d.ts

@@ -35,6 +35,9 @@ export namespace Components {
           * Language for translations
          */
         "lang": string;
+        /**
+          * Client custom styling via streamStyling
+         */
         "mbSource": string;
         /**
           * Session ID for the user
@@ -110,6 +113,9 @@ declare namespace LocalJSX {
           * Language for translations
          */
         "lang"?: string;
+        /**
+          * Client custom styling via streamStyling
+         */
         "mbSource"?: string;
         /**
           * Event to emit for closing the popup

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/player-lugas-limit",
-  "version": "1.63.2",
+  "version": "1.64.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/player-lugas-limit/p-2f7ef26b.entry.js

@@ -1 +0,0 @@
-import{r as n,c as t,h as i}from"./p-cb6ab8af.js";let e={en:{LugasSetLimitDialogTitle:"Monthly Central Deposit Limit",LugasInfoBox:"The central limit is your monthly deposit limit for all licensed websites in Germany. Note that your limit and deposit details may vary if changed on other sites.",ChooseLimit:"Choose Limit",ButtonCustomValue:"Other",ButtonMax:"Max",LugasSetLimitDialogButtonSetLimit:"SET LIMIT {amount} {currency}",invalidInputMessageLimit:"The value entered must be between {minValue} {currency} and {maxValue} {currency}.",LugasSetLimitDialogPrivacyNote:{text:"The selected limit is connected to processing player's personal data due to our legal obligations. In some cases setting a limit is a consent to processing player's personal data. For details see our ",link:"Privacy Policy"},LugasSetLimitDialogExistingLimit:{text:"If you would like to use your existing limit ",link:"click here"},LugasNotSet:"No deposit limit set. Please enter a new limit.",loading:"Loading, please wait ...",error:"It was an error while trying to fetch the data"},de:{LugasSetLimitDialogTitle:"Monatliches zentrales Einzahlungslimit",LugasInfoBox:"Das zentrale Limit ist Ihr monatliches Einzahlungslimit für alle lizenzierten Websites in Deutschland. Beachten Sie, dass sich Ihr Limit und der verbleibende Betrag ändern können, wenn Sie auf anderen Websites Einzahlungen vornehmen oder Ihr Limit anpassen.",ChooseLimit:"Limit wählen",ButtonCustomValue:"Eigener",ButtonMax:"Max",LugasSetLimitDialogButtonSetLimit:"LIMIT SETZEN {amount} {currency}",invalidInputMessageLimit:"Der eingegebene Wert muss zwischen {minValue} und {maxValue} {currency} liegen.",LugasSetLimitDialogPrivacyNote:{text:"Das gewählte Limit steht wegen unserer rechtlichen Verpflichtungen in Verbindung mit der Verarbeitung persönlicher Daten der Spieler. In manchen Fällen gilt das Setzen eines Limits als Einwilligung zur Verarbeitung persönlicher Daten des Spielers. Mehr Infos unter ",link:"Erklärung zum Datenschutz"},LugasSetLimitDialogExistingLimit:{text:"Wenn Sie Ihr bestehendes Limit nutzen möchten, ",link:"klicken Sie hier"},LugasNotSet:"Kein Einzahlungslimit festgelegt. Bitte geben Sie ein neues Limit ein.",loading:"Laden, bitte warten ...",error:"Beim Versuch, die Daten abzurufen, ist ein Fehler aufgetreten"}};const o=n=>new Promise((t=>{fetch(n).then((n=>n.json())).then((n=>{Object.keys(n).forEach((t=>{e[t]||(e[t]={});for(let i in n[t])e[t][i]=n[t][i]})),t(!0)}))})),a=(n,t,i)=>{let o=(a=e[t||"de"],n.split(".").reduce(((n,t)=>n&&void 0!==n[t]?n[t]:null),a));var a;if(null===o)return n;if(void 0!==i)for(const[n,t]of Object.entries(i.values)){const i=new RegExp(`{${n}}`,"g");o=o.replace(i,t)}return o};function s(n,t){if(n){const i=document.createElement("style");i.innerHTML=t,n.appendChild(i)}}function r(n,t){const i=new URL(t);fetch(i.href).then((n=>n.text())).then((t=>{const i=document.createElement("style");i.innerHTML=t,n&&n.appendChild(i)})).catch((n=>{console.error("There was an error while trying to load client styling from URL",n)}))}const l=class{constructor(i){n(this,i),this.closeLugasModal=t(this,"closeLugasModal",7),this.setClientStyling=()=>{const n=document.createElement("style");n.innerHTML=this.clientStyling,this.stylingContainer.prepend(n)},this.setClientStylingURL=()=>{const n=new URL(this.clientStylingUrl),t=document.createElement("style");fetch(n.href).then((n=>n.text())).then((n=>{t.innerHTML=n,setTimeout((()=>{this.stylingContainer.prepend(t)}),1)})).catch((n=>{console.log("error ",n)}))},this.postPlayerSituation=(n,t=!1,i=!1)=>{this.wasSubmitted=!0,this.errorMessage="";const e=new URL(`${this.endpoint}v2/player/${this.userId}/limit/lugas`),o={keepLimit:t,roleLimitAmount:i?this.amount:0};n&&(o.amount=`${n}`);const s={method:"POST",headers:{"X-SessionId":this.session,"X-Session-Type":"others","Content-Type":"application/json",Authorization:`Bearer ${this.session}`},body:JSON.stringify(o)};fetch(e.href,s).then((async n=>{if(!n.ok)throw await n.json();return this.closeLugasModal.emit(),n.json()})).catch((n=>{var t;3===n.errorCode&&"GmLegislation"===n.errorSourceName?console.error(n.error,null===(t=n.thirdPartyResponse)||void 0===t?void 0:t.message):console.error("Unexpected Error:",n),this.errorMessage=a("LugasNotSet",this.lang)})).finally((()=>{this.wasSubmitted=!1}))},this.userId="",this.session="",this.endpoint="",this.currency="EUR",this.amount="",this.lang=void 0,this.clientStyling="",this.clientStylingUrl="",this.mbSource=void 0,this.translationUrl="",this.showCustomAmount=!1,this.isLoading=!1,this.hasErrors=!1,this.inputValue="",this.showInvalidInputError=!1,this.predefinedAmountsArray=[],this.isWithinRange=void 0,this.minimumRange=void 0,this.selectedPredefinedAmount=void 0,this.errorMessage="",this.wasSubmitted=!1,this.minAmount=void 0,this.maxAmount=void 0}handleNewTranslations(){o(this.translationUrl)}handleClientStylingChange(n,t){n!=t&&s(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(n,t){n!=t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}async componentWillLoad(){this.translationUrl.length>2&&await o(this.translationUrl),await this.getMonthlyDepositLimit()}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(n,t){if(window.emMessageBus){const i=document.createElement("style");window.emMessageBus.subscribe(t,(t=>{i.innerHTML=t,n&&n.appendChild(i)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&s(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}async getMonthlyDepositLimit(){const n=new URL(`${this.endpoint}api/v1/gm/legislation/config/month-deposit-limit`);return this.isLoading=!0,new Promise((t=>{fetch(n.href).then((n=>{if(n.status>=300)throw new Error("There was an error while fetching the configuration");return n.json()})).then((n=>{this.predefinedAmountsArray=n.preDefinedOptions,this.minAmount=n.minAmount,this.maxAmount=n.maxAmount,t(!0)})).catch((n=>{this.hasErrors=!0,console.log(n)})).finally((()=>{this.isLoading=!1}))}))}handleSubmit(n){n.preventDefault(),this.showInvalidInputError||this.postPlayerSituation(this.inputValue,!1,!0)}containsOnlyDigits(n){return/^[0-9]+$/.test(n)}handleInputChange(n){const t=n.target.value;this.showInvalidInputError=!1,this.inputValue=t,this.isValidNumber=!isNaN(Number(t))&&this.containsOnlyDigits(t),this.minimumRange=Number(t)>=this.minAmount,this.isWithinRange=Number(t)<=this.maxAmount,this.showInvalidInputError=!(!t||this.isValidNumber&&this.isWithinRange&&this.minimumRange)}handleAmountClick(n){switch(this.showCustomAmount=!1,this.amount=n,this.inputValue="",this.showInvalidInputError=!1,this.selectedPredefinedAmount=n,n){case"Other":this.showCustomAmount=!0,this.amount="";break;case"Max":this.showCustomAmount=!0,this.amount=this.maxAmount.toString(),this.inputValue=this.maxAmount.toString();break;default:this.postPlayerSituation(this.amount,!1,!0)}}goToPrivacyPolicy(){window.postMessage({type:"GoToPrivacyPolicy"})}renderValidator(){const n="EUR"===this.currency?"€":this.currency;return i("div",{class:"ValidatorContainer"},this.errorMessage&&i("div",{class:"ErrorContainer"},i("span",{class:"DismissError",onClick:()=>this.errorMessage=""},i("svg",{xmlns:"http://www.w3.org/2000/svg",width:"9",height:"9",viewBox:"0 0 9 9",fill:"none"},i("path",{d:"M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z",fill:"#111111"}))),i("p",{class:"ErrorParagraph"},i("span",{class:"ErrorIcon"},i("svg",{xmlns:"http://www.w3.org/2000/svg",width:"9",height:"9",viewBox:"0 0 9 9"},i("path",{d:"M8.18659 0.14708C8.37063 0.33182 8.38174 0.62421 8.21888 0.821452L8.18659 0.857219L4.87619 4.16727L8.18659 7.47732C8.27743 7.56861 8.32973 7.69132 8.33266 7.82007C8.3356 7.94883 8.28895 8.0738 8.20235 8.16913C8.11576 8.26446 7.99584 8.32288 7.86739 8.3323C7.73895 8.34172 7.61179 8.30143 7.51221 8.21975L7.47645 8.18746L4.1664 4.87706L0.856348 8.18746C0.765058 8.27831 0.64235 8.3306 0.513592 8.33354C0.384834 8.33647 0.25987 8.28982 0.164536 8.20322C0.0692018 8.11663 0.0107856 7.99671 0.00136402 7.86827C-0.00805761 7.73982 0.0322357 7.61266 0.113914 7.51308L0.146209 7.47732L3.4566 4.16727L0.146209 0.857219C0.0553613 0.765928 0.00306475 0.64322 0.000130477 0.514462C-0.0028038 0.385704 0.0438486 0.260741 0.130443 0.165407C0.217038 0.0700723 0.336953 0.0116562 0.4654 0.00223455C0.593846 -0.00718708 0.721002 0.0331062 0.820581 0.114785L0.856348 0.14708L4.1664 3.45748L7.47645 0.14708C7.52307 0.10045 7.57843 0.0634608 7.63935 0.0382248C7.70027 0.0129888 7.76557 0 7.83152 0C7.89746 0 7.96276 0.0129888 8.02368 0.0382248C8.0846 0.0634608 8.13996 0.10045 8.18659 0.14708Z"}))),this.errorMessage)),i("div",{class:"Paragraphs"},i("p",null,a("LugasInfoBox",this.lang))),i("div",{class:"LimitAmountWrapper"},this.wasSubmitted&&i("slot",{name:"spinner"})&&i("div",{class:"LoadingWrapper"},i("svg",{class:"spinner",viewBox:"0 0 50 50"},i("circle",{class:"path",cx:"25",cy:"25",r:"20",fill:"none","stroke-width":"5"}))),i("p",{class:"ChooseLimitLabel"},a("ChooseLimit",this.lang)),i("div",{class:"PredefinedAmounts"},i("button",{class:"Other"===this.selectedPredefinedAmount?"Active":"",onClick:()=>this.handleAmountClick("Other")},a("ButtonCustomValue",this.lang)),(()=>this.predefinedAmountsArray.map((n=>i("button",{class:this.selectedPredefinedAmount===n?"Active":"",onClick:()=>this.handleAmountClick(n)},n))))(),i("button",{class:"Max"===this.selectedPredefinedAmount?"Active":"",onClick:()=>this.handleAmountClick("Max")},a("ButtonMax",this.lang))),this.showCustomAmount&&i("form",{onSubmit:n=>this.handleSubmit(n)},this.showCustomAmount&&i("div",null,i("input",{class:"CustomAmountInput "+(this.showInvalidInputError?"InvalidInput":""),type:"number",value:this.amount,onInput:n=>this.handleInputChange(n),placeholder:"0.00",disabled:"Max"===this.selectedPredefinedAmount}),this.showInvalidInputError&&i("p",{class:"InvalidParagraph"},a("invalidInputMessageLimit",this.lang,{values:{currency:n,minValue:this.minAmount,maxValue:this.maxAmount}}))),this.selectedPredefinedAmount&&i("button",{class:"PrimaryButton SetLimitBtn",type:"submit",disabled:this.wasSubmitted},a("LugasSetLimitDialogButtonSetLimit",this.lang,{values:{currency:n,amount:this.inputValue||"0.00"}})))),i("div",{class:"ModalFooter"},i("hr",null),i("div",{class:"Paragraphs"},i("p",{class:"ExistingLimit"},a("LugasSetLimitDialogExistingLimit.text",this.lang),i("span",{class:"Link",onClick:()=>this.postPlayerSituation(this.amount,!0)},a("LugasSetLimitDialogExistingLimit.link",this.lang))),i("p",{class:"PrivacyNote"},a("LugasSetLimitDialogPrivacyNote.text",this.lang),i("span",{class:"Link",onClick:this.goToPrivacyPolicy},a("LugasSetLimitDialogPrivacyNote.link",this.lang))))))}render(){if(this.isLoading)return i("div",null,i("p",null,a("loading",this.lang,{values:{currency:this.currency}})));if(this.hasErrors)return i("div",null,i("p",null,a("error",this.lang)));{const n=this.renderValidator();return i("div",{class:"ModalContainer",ref:n=>this.stylingContainer=n},i("div",{class:"Container"},i("div",{class:"ModalHeader"},i("h2",null,a("LugasSetLimitDialogTitle",this.lang))),i("div",{class:"ModalBody"},n)))}}static get watchers(){return{translationUrl:["handleNewTranslations"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"]}}};l.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");\n:host {\n  font-family: "Roboto", sans-serif;\n}\n\n.ModalContainer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.5);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: var(--emw--font-size-small, 12px);\n  container-type: inline-size;\n}\n.ModalContainer hr {\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  margin: 10px 0px;\n}\n.ModalContainer p {\n  margin: 0;\n}\n.ModalContainer button {\n  width: 100%;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  padding: 10px 0;\n  cursor: pointer;\n  width: 100%;\n  border-radius: var(--emw--border-radius-small, 4px);\n}\n.ModalContainer button.PrimaryButton {\n  background: var(--emw--color-primary, #6BB816);\n  border: none;\n  font-weight: 500;\n}\n.ModalContainer button.PrimaryButton:not(:disabled) {\n  color: var(--emw--color-white, #FFF);\n}\n.ModalContainer .Container {\n  position: fixed;\n  top: 30vh;\n  width: 320px;\n  background: var(--emw--color-white, #fff);\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  transform: scale(1.1);\n  border-radius: 4px;\n  overflow: hidden;\n}\n.ModalContainer .ValidatorContainer {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n}\n.ModalContainer .Paragraphs:not(:last-child) {\n  margin-bottom: 20px;\n}\n.ModalContainer .ModalHeader {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: var(--emw--color-gray-50, #F7F8FA);\n  padding: 12px;\n}\n.ModalContainer .ModalHeader h2 {\n  font-weight: bold;\n  font-size: var(--emw--font-size-small, 12px);\n  margin: 0;\n}\n.ModalContainer .ModalBody {\n  background: var(--emw--color-white, #FFF);\n  padding: 12px;\n  container-type: inline-size;\n  border-radius: 4px;\n}\n.ModalContainer .ModalBody .ErrorContainer {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-red-100, #E10014);\n  border-bottom: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  margin: -12px;\n  padding: 12px;\n  margin-bottom: 12px;\n  font-weight: bold;\n  position: relative;\n  background: linear-gradient(180deg, var(--emw--color-gray-100, #E8E9EB) 0%, rgba(255, 255, 255, 0.47) 30%);\n}\n.ModalContainer .ModalBody .DismissError {\n  position: absolute;\n  right: 12px;\n  cursor: pointer;\n}\n.ModalContainer .ModalBody .ErrorParagraph {\n  display: flex;\n  align-items: center;\n}\n.ModalContainer .ModalBody .ErrorIcon {\n  background: linear-gradient(180deg, var(--emw--color-red-100, #E10014) 0%, var(--emw--color-red-150, #D60080) 100%);\n  text-align: center;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg {\n  width: 6px;\n  height: 6px;\n}\n.ModalContainer .ModalBody .ErrorIcon svg path {\n  fill: var(--emw--color-white, #FFF);\n}\n.ModalContainer .ModalBody .ChooseLimitLabel {\n  text-transform: uppercase;\n}\n.ModalContainer .ModalBody .LimitAmountWrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  position: relative;\n}\n.ModalContainer .ModalBody .PredefinedAmounts {\n  display: flex;\n  justify-content: space-between;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button {\n  background: none;\n  margin: -1px 0 0 -1px;\n  color: var(--emw--color-gray-150, #808080);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button.Active {\n  font-weight: bold;\n  background: var(--emw--color-gray-50, #F7F8FA);\n  color: var(--emw--color-gray-200, #323233);\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:first-child {\n  border-radius: 4px 0 0 4px;\n}\n.ModalContainer .ModalBody .PredefinedAmounts button:last-child {\n  border-radius: 0 4px 4px 0;\n}\n.ModalContainer .ModalBody .CustomAmountInput {\n  width: 100%;\n  padding: 10px;\n  border: 1px solid var(--emw--color-gray-100, #E8E9EB);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-bottom: 6px;\n  color: var(--emw--color-gray-200, #323233);\n  font-weight: bold;\n}\n.ModalContainer .ModalBody .CustomAmountInput.InvalidInput {\n  border: 1px solid var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .InvalidParagraph {\n  font-size: var(--emw--font-size-small, 12px);\n  color: var(--emw--color-red, #FF0000);\n}\n.ModalContainer .ModalBody .SetLimitBtn {\n  margin-top: 10px;\n}\n.ModalContainer .ModalFooter {\n  padding-top: 12px;\n  margin: 5px 0px;\n}\n.ModalContainer .Link {\n  color: inherit;\n  text-decoration: underline;\n  cursor: pointer;\n}\n.ModalContainer .PrivacyNote {\n  font-size: var(--emw--font-size-x-small, 10px);\n  font-style: italic;\n}\n.ModalContainer .ExistingLimit {\n  margin-bottom: 15px;\n}\n\ninput {\n  /* Firefox */\n  -moz-appearance: textfield;\n  /* Chrome, Safari, Edge, Opera */\n}\ninput::-webkit-outer-spin-button, input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n@container (max-width: 1300px) {\n  .ModalContainer .Container {\n    width: 50%;\n  }\n}\n@container (max-width: 800px) {\n  .ModalContainer .Container {\n    width: 70%;\n  }\n}\n.LoadingWrapper {\n  width: 100%;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.8);\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.spinner {\n  animation: rotate 2s linear infinite;\n  z-index: 2;\n  width: 30px;\n  height: 30px;\n}\n.spinner .path {\n  stroke: var(--emw--color-primary, #6BB816);\n  stroke-linecap: round;\n  animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes dash {\n  0% {\n    stroke-dasharray: 1, 150;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 90, 150;\n    stroke-dashoffset: -124;\n  }\n}';export{l as player_lugas_limit}