@everymatrix/player-lugas-limit 1.72.1 → 1.72.2

package/dist/collection/components/player-lugas-limit/player-lugas-limit.js

@@ -1,72 +1,38 @@
 import { h } from "@stencil/core";
 import { getTranslations, translate } from "../../utils/locale.utils";
 import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
-/**
- * PlayerLugasLimit Component
- * Handles UI and logic for setting deposit limits for a user in a specific flow.
- */
 export class PlayerLugasLimit {
     constructor() {
-        /** Array of predefined limit amounts */
+        // Internal variables
         this.predefinedAmounts = [];
-        /** Displayed currency */
         this.displayedCurrency = '';
-        /**
-         * Submits the new monthly deposit limit set by the player.
-         * @param amount - User-defined amount
-         * @param keepLimit - Whether to keep the current limit
-         * @param isInitialLimit - Whether the limit is being set initially
-         */
-        this.submitMonthlyDepositLimit = async (amount, keepLimit = false, isInitialLimit = 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 = isInitialLimit ? this.newAmount : 0;
-            const requestBody = {
-                amount,
-                keepLimit,
-                roleLimitAmount
-            };
-            const requestOptions = {
-                method: 'POST',
-                headers: {
-                    'X-SessionId': this.session,
-                    'X-Session-Type': 'others',
-                    'Content-Type': 'application/json',
-                    'Authorization': `Bearer ${this.session}`
-                },
-                body: JSON.stringify(requestBody)
-            };
-            try {
-                const response = await fetch(url.href, requestOptions);
-                if (!response.ok) {
-                    const error = await response.json();
-                    throw error;
-                }
-                this.closeLugasModal.emit();
-            }
-            catch (error) {
-                this.handleSubmissionError(error, keepLimit);
-            }
-            finally {
-                this.isSubmitted = false;
+        this.handleClick = (input) => {
+            switch (input) {
+                case 'UploadDocuments':
+                    this.uploadDocuments.emit();
+                    window.postMessage({ type: 'uploadDocuments' }, window.location.href);
+                    break;
+                case 'Close':
+                    this.closePopup.emit();
+                    window.postMessage({ type: 'closePopup' }, window.location.href);
+                    break;
             }
         };
         this.userId = '';
         this.session = '';
         this.endpoint = '';
         this.currency = 'EUR';
+        this.flow = '';
         this.amount = '';
         this.lang = undefined;
         this.clientStyling = '';
         this.clientStylingUrl = '';
         this.mbSource = undefined;
         this.translationUrl = '';
+        this.hasValidation = true;
+        this.kycStep = undefined;
         this.isLoading = false;
-        this.showCustomAmount = false;
+        this.regularDepositLimitAmount = '';
         this.isSubmitted = false;
         this.isUseExistingLimitOptionActive = true;
         this.selectedPredefinedAmount = undefined;
@@ -74,13 +40,15 @@ export class PlayerLugasLimit {
         this.errorMessageOnSubmit = '';
         this.errorMessageOnInput = '';
         this.hasLugasError = false;
+        this.showCustomAmount = false;
         this.newAmount = '';
     }
-    /**
-     * Watch for changes in the translation URL and fetch new translations
-     */
+    // Watchers
     handleNewTranslations() {
-        getTranslations(this.translationUrl);
+        this.isLoading = true;
+        getTranslations(this.translationUrl).then(() => {
+            this.isLoading = false;
+        });
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -93,65 +61,84 @@ export class PlayerLugasLimit {
                 setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
         }
     }
-    /**
-     * Lifecycle method that fetches translations when the component is loaded.
-     */
+    // Lifecycle methods
     async componentWillLoad() {
         if (this.translationUrl.length > 2) {
             await getTranslations(this.translationUrl);
         }
-        await this.getMonthlyDepositLimitConfig();
+        await this.fetchDepositLimitConfig();
         this.displayedCurrency = this.currency === 'EUR' ? '€' : this.currency;
     }
     componentDidLoad() {
-        if (this.stylingContainer) {
-            if (window.emMessageBus != undefined) {
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
-            }
-            else {
-                if (this.clientStyling)
-                    setClientStyling(this.stylingContainer, this.clientStyling);
-                if (this.clientStylingUrl)
-                    setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
-            }
+        if (!this.stylingContainer)
+            return;
+        if (window.emMessageBus != undefined) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+        else {
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
         }
     }
     disconnectedCallback() {
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
     }
-    /**
-     * Fetches the monthly deposit limit configuration from the API.
-     *
-     * @returns Promise - Promise that resolves when the configuration is fetched
-     */
-    async getMonthlyDepositLimitConfig() {
-        const url = new URL(`${this.endpoint}api/v1/gm/legislation/config/month-deposit-limit`);
+    async fetchDepositLimitConfig() {
         this.isLoading = true;
-        return new Promise((resolve) => {
-            fetch(url.href)
-                .then((res) => {
-                if (res.status >= 300) {
-                    throw new Error('There was an error while fetching the configuration');
-                }
-                return res.json();
-            })
-                .then((data) => {
-                this.predefinedAmounts = data.preDefinedOptions;
-                this.minAmount = data.minAmount;
-                this.maxAmount = data.maxAmount;
-                resolve(true);
-            }).catch((err) => {
-                this.errorMessageOnInitialization = translate('error', this.lang);
-                console.log(err);
-            })
-                .finally(() => this.isLoading = false);
-        });
+        try {
+            const url = new URL('/api/v1/gm/legislation/config/month-deposit-limit/', this.endpoint);
+            const response = await fetch(url.href);
+            if (!response.ok)
+                throw new Error('Failed to load config');
+            const data = await response.json();
+            this.predefinedAmounts = data.preDefinedOptions;
+            this.minAmount = data.minAmount;
+            this.maxAmount = data.maxAmount;
+        }
+        catch (error) {
+            this.errorMessageOnInitialization = translate('error', this.lang);
+            console.error(error);
+        }
+        finally {
+            this.isLoading = false;
+        }
+    }
+    async postPlayerSituation(userAmount, keepLimit = false, initialNewLimit = false) {
+        if (keepLimit && !this.isUseExistingLimitOptionActive)
+            return;
+        this.isSubmitted = true;
+        this.errorMessageOnSubmit = '';
+        const url = new URL(`v2/player/${this.userId}/limit/lugas/`, this.endpoint);
+        const roleLimitAmount = initialNewLimit ? this.amount : 0;
+        const body = Object.assign({ softMigration: this.flow === '1', keepLimit,
+            roleLimitAmount }, (userAmount && { amount: userAmount }));
+        const options = {
+            method: 'POST',
+            headers: {
+                'X-SessionId': this.session,
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${this.session}`
+            },
+            body: JSON.stringify(body)
+        };
+        try {
+            const response = await fetch(url.href, options);
+            if (!response.ok)
+                throw new Error(`HTTP ${response.status}`);
+            const data = await response.json();
+            this.kycStep = data.popup;
+            this.hasValidation = false;
+            this.regularDepositLimitAmount = data.regulatorDepositLimitAmount || '';
+        }
+        catch (error) {
+            this.handleSubmissionError(error, keepLimit);
+        }
+        finally {
+            this.isSubmitted = false;
+        }
     }
-    /**
-     * Handles errors during the submission of the monthly deposit limit.
-     * @param error - Error response from the server
-     * @param keepLimit - Whether the user opted to keep the current limit
-     */
     handleSubmissionError(error, keepLimit) {
         var _a, _b;
         this.errorMessageOnSubmit = translate('LugasNotSet', this.lang);
@@ -171,23 +158,34 @@ export class PlayerLugasLimit {
             console.error('Unexpected Error:', error);
         }
     }
-    /**
-     * Handles form submission.
-     * @param event - The form submission event
-     */
+    handleAmountClick(amount) {
+        this.showCustomAmount = false;
+        this.errorMessageOnInput = '';
+        this.selectedPredefinedAmount = amount;
+        switch (amount) {
+            case 'Other':
+                this.newAmount = '';
+                this.showCustomAmount = true;
+                break;
+            case 'Max':
+                this.newAmount = this.maxAmount.toString();
+                this.showCustomAmount = true;
+                break;
+            default:
+                this.newAmount = amount;
+                this.postPlayerSituation(this.newAmount, false, true);
+                break;
+        }
+    }
     handleSubmit(event) {
         event.preventDefault();
-        if (!this.errorMessageOnInput) {
-            this.submitMonthlyDepositLimit(this.newAmount, false, true);
+        if (this.errorMessageOnInput) {
+            return;
         }
+        this.postPlayerSituation(this.newAmount, false, true);
     }
-    /**
-     * Handles input changes.
-     * @param event - The input change event
-     */
-    handleInputChange(event) {
+    handleValidatorInputChange(event) {
         this.newAmount = event.target.value;
-        // Perform validation checks
         this.isValidNumber = !isNaN(Number(this.newAmount));
         this.isWithinRange = (Number(this.newAmount) >= this.minAmount) && (Number(this.newAmount) <= this.maxAmount);
         if (!this.isWithinRange || !this.isValidNumber) {
@@ -202,68 +200,50 @@ export class PlayerLugasLimit {
             event.target.value = this.newAmount;
         }
     }
-    /**
-     * Handles predefined amount clicks.
-     * @param amount - The predefined amount to set
-     */
-    handleAmountClick(amount) {
-        this.showCustomAmount = false;
-        this.errorMessageOnInput = '';
-        this.selectedPredefinedAmount = amount;
-        switch (amount) {
-            case 'Other':
-                this.newAmount = '';
-                this.showCustomAmount = true;
-                break;
-            case 'Max':
-                this.newAmount = this.maxAmount.toString();
-                this.showCustomAmount = true;
-                break;
+    renderKYC(step) {
+        switch (step) {
+            case 0:
+                this.handleClick('Close');
+                return;
+            case 1:
+                return (h("div", { class: "ValidatorContainer" }, h("div", { class: "Paragraphs" }, h("p", null, translate('kycSure', this.lang, { values: { currency: this.currency } })), h("p", null, translate('kyc1', this.lang, { values: { currency: this.currency } })), h("div", { class: "ContainerButtons" }, h("button", { class: "FirstButton", onClick: () => this.postPlayerSituation(this.newAmount, false) }, translate('setNewLimit', this.lang, { values: { currency: this.currency } })), h("button", { class: "SecondButton", onClick: () => this.postPlayerSituation(this.amount, true) }, translate('keepExistingLimit', this.lang, { values: { currency: this.currency } }))))));
+            case 2:
+                return (h("div", { class: "ValidatorContainer" }, h("div", { class: "Paragraphs" }, h("p", null, translate('kycThanks', this.lang, { values: { currency: this.currency } })), h("p", { innerHTML: translate('kyc2', this.lang, { values: { currency: this.currency, amount: this.regularDepositLimitAmount } }) }), h("div", { class: "ContainerButtons" }, h("button", { class: "FirstButton", onClick: () => this.handleClick('Close') }, translate('Close', this.lang, { values: { currency: this.currency } })), h("button", { class: "SecondButton", onClick: () => this.handleClick('UploadDocuments') }, translate('UploadDocuments', this.lang, { values: { currency: this.currency } }))))));
             default:
-                this.newAmount = amount;
-                this.submitMonthlyDepositLimit(this.newAmount, false, true);
-                break;
+                return (h("div", { class: "ValidatorContainer" }, h("div", { class: "Paragraphs" }, h("p", null, translate('kycThanks', this.lang, { values: { currency: this.currency } })), h("p", null, translate('kyc3', this.lang, { values: { currency: this.currency } })), h("div", { class: "ContainerButtons" }, h("button", { class: "SecondButton", onClick: () => this.handleClick('Close') }, translate('Close', this.lang, { values: { currency: this.currency } }))))));
         }
     }
-    /**
-     * Navigates to the privacy policy page.
-     */
+    renderPredefinedButtons() {
+        return this.predefinedAmounts.map((currentAmount) => (h("button", { class: this.selectedPredefinedAmount === currentAmount ? 'Active' : '', onClick: () => this.handleAmountClick(currentAmount), disabled: this.hasLugasError }, currentAmount)));
+    }
+    ;
     goToPrivacyPolicy() {
         window.postMessage({ type: 'GoToPrivacyPolicy' });
     }
     ;
-    /**
-     * Renders the validator.
-     */
     renderValidator() {
-        const renderPredefinedButtons = () => {
-            return this.predefinedAmounts.map((currentAmount) => (h("button", { class: this.selectedPredefinedAmount === currentAmount ? 'Active' : '', onClick: () => this.handleAmountClick(currentAmount), disabled: this.hasLugasError }, currentAmount)));
-        };
         return (h("div", { class: "ValidatorContainer" }, this.errorMessageOnSubmit && (h("div", { class: "ErrorContainer" }, !this.hasLugasError && (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" }))), h("div", { innerHTML: 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.errorMessageOnInput ? 'InvalidInput' : ''}`, type: "number", value: this.selectedPredefinedAmount === 'Max' ? this.maxAmount : null, step: 0.01, placeholder: "0.00", disabled: this.hasLugasError || this.selectedPredefinedAmount === 'Max', onInput: (event) => this.handleInputChange(event) }), this.errorMessageOnInput && h("p", { class: "InvalidParagraph" }, this.errorMessageOnInput)), this.selectedPredefinedAmount &&
+            && 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)), this.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.errorMessageOnInput ? 'InvalidInput' : ''}`, type: "number", value: this.selectedPredefinedAmount === 'Max' ? this.maxAmount : null, step: 0.01, placeholder: "0.00", disabled: this.hasLugasError || this.selectedPredefinedAmount === 'Max', onInput: (event) => this.handleValidatorInputChange(event) }), this.errorMessageOnInput && h("p", { class: "InvalidParagraph" }, this.errorMessageOnInput)), this.selectedPredefinedAmount &&
             h("button", { class: "PrimaryButton SetLimitBtn", type: "submit", disabled: this.hasLugasError || this.isSubmitted || !Boolean(this.newAmount) || Boolean(this.errorMessageOnInput) }, translate('LugasSetLimitDialogButtonSetLimit', this.lang, {
                 values: {
                     currency: this.displayedCurrency,
                     amount: Number.parseFloat(this.newAmount || '0').toFixed(2)
                 }
-            }))))), 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.
-     */
     render() {
+        const kycConfirmation = this.renderKYC(this.kycStep);
+        const validationContainer = this.renderValidator();
         if (this.isLoading) {
             return (h("div", null, h("p", null, translate('loading', this.lang, { values: { currency: this.currency } }))));
         }
-        else if (this.errorMessageOnInitialization) {
+        if (this.errorMessageOnInitialization) {
             return (h("div", null, h("p", null, this.errorMessageOnInitialization)));
         }
-        else {
-            const validationContainer = this.renderValidator();
-            return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "Container" }, h("div", { class: "ModalHeader" }, h("h2", null, translate('LugasSetLimitDialogTitle', this.lang))), h("div", { class: "ModalBody" }, validationContainer))));
-        }
+        return (h("div", { class: "ModalContainer", ref: el => this.stylingContainer = el }, h("div", { class: "Container" }, h("div", { class: "ModalHeader" }, h("h2", null, translate('LugasSetLimitDialogTitle', this.lang))), h("div", { class: "ModalBody" }, this.hasValidation ? validationContainer : kycConfirmation, this.hasValidation &&
+            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.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)))))))));
     }
     static get is() { return "player-lugas-limit"; }
     static get encapsulation() { return "shadow"; }
@@ -291,10 +271,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "User identifier"
+                    "text": ""
                 },
                 "attribute": "user-id",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "session": {
@@ -309,10 +289,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Session ID for the user"
+                    "text": ""
                 },
                 "attribute": "session",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "endpoint": {
@@ -327,10 +307,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Endpoint URL for the API"
+                    "text": ""
                 },
                 "attribute": "endpoint",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "currency": {
@@ -345,12 +325,30 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Currency of the player"
+                    "text": ""
                 },
                 "attribute": "currency",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "'EUR'"
             },
+            "flow": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "flow",
+                "reflect": true,
+                "defaultValue": "''"
+            },
             "amount": {
                 "type": "string",
                 "mutable": false,
@@ -363,10 +361,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The amount"
+                    "text": ""
                 },
                 "attribute": "amount",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "lang": {
@@ -381,10 +379,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Language for translations"
+                    "text": ""
                 },
                 "attribute": "lang",
-                "reflect": false
+                "reflect": true
             },
             "clientStyling": {
                 "type": "string",
@@ -398,10 +396,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Custom client styling as inline CSS"
+                    "text": ""
                 },
                 "attribute": "client-styling",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "clientStylingUrl": {
@@ -416,10 +414,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "URL for fetching client-specific styling"
+                    "text": ""
                 },
                 "attribute": "client-styling-url",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "mbSource": {
@@ -434,10 +432,10 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Client custom styling via streamStyling"
+                    "text": ""
                 },
                 "attribute": "mb-source",
-                "reflect": false
+                "reflect": true
             },
             "translationUrl": {
                 "type": "string",
@@ -451,18 +449,20 @@ export class PlayerLugasLimit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "URL for fetching translation strings"
+                    "text": ""
                 },
                 "attribute": "translation-url",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             }
         };
     }
     static get states() {
         return {
+            "hasValidation": {},
+            "kycStep": {},
             "isLoading": {},
-            "showCustomAmount": {},
+            "regularDepositLimitAmount": {},
             "isSubmitted": {},
             "isUseExistingLimitOptionActive": {},
             "selectedPredefinedAmount": {},
@@ -470,23 +470,39 @@ export class PlayerLugasLimit {
             "errorMessageOnSubmit": {},
             "errorMessageOnInput": {},
             "hasLugasError": {},
+            "showCustomAmount": {},
             "newAmount": {}
         };
     }
     static get events() {
         return [{
-                "method": "closeLugasModal",
-                "name": "closeLugasModal",
+                "method": "uploadDocuments",
+                "name": "uploadDocuments",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "closePopup",
+                "name": "closePopup",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Event to emit for closing the popup"
+                    "text": ""
                 },
                 "complexType": {
-                    "original": "object",
-                    "resolved": "object",
+                    "original": "any",
+                    "resolved": "any",
                     "references": {}
                 }
             }];

package/dist/collection/utils/locale.utils.js

@@ -19,12 +19,20 @@ let TRANSLATIONS = {
         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',
-        LugasF1002Error: 'We were unable to set your cross-provider deposit limit at LUGAS due to a technical error. Please <a href="https://here-will-be-the-support-link/">contact our support team</a> and provide error code F1002. We\'ll be happy to assist you in resolving this issue.'
+        kyc1: 'All deposit limit changes must be reported to LUGAS in accordance with regulatory requirements. Please note that decreases in the limit will take effect immediately, while increases will only come into effect after 8 days at the latest.',
+        kyc2: 'We were able to set your monthly deposit limit to <b>{amount} {currency}</b>. For the selected limit, we require documents that show your economic capacity. Please upload your last payslip as well as a current bank statement, including the balance, that confirms that you received the payment.',
+        kyc3: 'We have transmitted your desired limit to Lugas Please be aware that the limit will only come into effect after 8 days at the latest.',
+        kycThanks: 'Thank you!',
+        kycSure: 'Are you sure?',
+        setNewLimit: 'SET NEW LIMIT',
+        keepExistingLimit: 'KEEP EXISTING LIMIT',
+        Close: 'CLOSE',
+        UploadDocuments: 'UPLOAD DOCUMENTS',
     },
     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',
+        ChooseLimit: 'Choose Limit',
         ButtonCustomValue: 'Eigener',
         ButtonMax: 'Max',
         LugasSetLimitDialogButtonSetLimit: 'LIMIT SETZEN {amount} {currency}',
@@ -38,9 +46,17 @@ let TRANSLATIONS = {
             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',
-        LugasF1002Error: 'Ihr anbieterübergreifendes Einzahlungslimit konnte aufgrund eines technischen Fehlers nicht in der LUGAS-Datenbank festgelegt werden. Bitte <a href="https://here-will-be-the-support-link/">wenden Sie sich an unseren Kundenservice</a> unter Angabe des Fehlercodes F1002. Wir helfen Ihnen dann gerne weiter.'
+        loading: "Lade, bitte warten ...",
+        error: "Beim Laden der Daten ist ein Fehler aufgetreten.",
+        kyc1: "Alle Änderungen des Einzahlungslimits müssen gemäß den gesetzlichen Anforderungen an LUGAS gemeldet werden. Bitte beachten Sie, dass eine Senkung des Limits sofort wirksam wird, während eine Erhöhung spätestens nach 8 Tagen in Kraft tritt.",
+        kyc2: "Wir konnten Ihr monatliches Einzahlungslimit auf <b>{amount} {currency}</b> festlegen. Für das gewählte Limit benötigen wir Nachweise über Ihre wirtschaftliche Leistungsfähigkeit. Bitte laden Sie Ihre letzte Gehaltsabrechnung sowie einen aktuellen Kontoauszug, einschließlich Kontostand, hoch, der den Zahlungseingang bestätigt.",
+        kyc3: "Wir haben Ihr gewünschtes Limit an LUGAS übermittelt. Bitte beachten Sie, dass das Limit spätestens nach 8 Tagen in Kraft tritt.",
+        kycThanks: "Vielen Dank!",
+        kycSure: "Sind Sie sicher?",
+        setNewLimit: "NEUES LIMIT FESTLEGEN",
+        keepExistingLimit: "AKTUELLES LIMIT BEIBEHALTEN",
+        Close: "SCHLIESSEN",
+        UploadDocuments: "DOKUMENTE HOCHLADEN"
     },
 };
 export const getTranslations = (url) => {