@everymatrix/user-login 1.94.18 → 1.94.20

package/dist/esm/user-login.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-13692399.js';
+import { r as registerInstance, h, g as getElement } from './index-b943f0d9.js';
 
 const DEFAULT_LANGUAGE = 'en';
 const TRANSLATIONS = {
@@ -498,6 +498,25 @@ function getAdoptStyleSubscription(stylingContainer, domain) {
   });
 }
 
+/**
+ * Get first assigned element from a named slot
+ *
+ * @param {HTMLElement} host
+ * @param {string} slotName
+ * @returns {HTMLElement | null}
+ */
+const getSlottedElement = (host, slotName) => {
+  const slot = /** @type {HTMLSlotElement | null} */ (
+    host.shadowRoot?.querySelector(`slot[name="${slotName}"]`)
+  );
+
+  if (!slot) return null;
+
+  return /** @type {HTMLElement | null} */ (
+    slot.assignedElements?.()[0] ?? null
+  );
+};
+
 /**
  * @name dispatchCustomEvent
  * @description dispatches the custom event CustomEventProcessor is listening for
@@ -517,6 +536,368 @@ const dispatchCustomEvent = (type, data = {}) => {
     document.dispatchEvent(event);
 };
 
+const SCRIPT_SRC$1 = 'https://www.google.com/recaptcha/api.js';
+let scriptPromise$1 = null;
+function loadRecaptcha() {
+    var _a;
+    if (typeof window === 'undefined') {
+        return Promise.reject(new Error('[reCAPTCHA] SSR'));
+    }
+    if ((_a = window.grecaptcha) === null || _a === void 0 ? void 0 : _a.render) {
+        return Promise.resolve();
+    }
+    if (!scriptPromise$1) {
+        scriptPromise$1 = new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = SCRIPT_SRC$1;
+            script.async = true;
+            script.defer = true;
+            script.onload = () => {
+                const check = () => {
+                    var _a;
+                    if ((_a = window.grecaptcha) === null || _a === void 0 ? void 0 : _a.render) {
+                        resolve();
+                    }
+                    else {
+                        setTimeout(check, 50);
+                    }
+                };
+                check();
+            };
+            script.onerror = () => {
+                scriptPromise$1 = null;
+                reject(new Error('[reCAPTCHA] script failed to load'));
+            };
+            document.head.appendChild(script);
+        });
+    }
+    return scriptPromise$1;
+}
+function createRecaptcha(options) {
+    let widgetId;
+    async function render(container) {
+        await loadRecaptcha();
+        if (widgetId !== undefined)
+            return;
+        widgetId = window.grecaptcha.render(container, Object.assign({ theme: 'light', size: 'normal' }, options));
+    }
+    function reset() {
+        if (widgetId === undefined)
+            return;
+        try {
+            window.grecaptcha.reset(widgetId);
+        }
+        catch (_a) { }
+    }
+    function cleanup() {
+        reset();
+        widgetId = undefined;
+    }
+    return {
+        render,
+        reset,
+        cleanup
+    };
+}
+
+const SCRIPT_SRC = 'https://challenges.cloudflare.com/turnstile/v0/api.js';
+const RESET_COOL_DOWN_MS = 3000;
+const RETRY_INTERVAL_MS = 3000;
+const DEFAULT_RETRY_COUNT = 5;
+const DUMMY_TURNSTILE_RESPONSE = 'XXXX.DUMMY.TOKEN.XXXX';
+// Module-level singleton so multiple widgets share one script tag.
+let scriptPromise = null;
+function loadTurnstile() {
+    if (typeof window === 'undefined') {
+        return Promise.reject(new Error('[Turnstile] SSR'));
+    }
+    if (window.turnstile) {
+        return Promise.resolve();
+    }
+    if (!scriptPromise) {
+        scriptPromise = new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = SCRIPT_SRC;
+            script.async = true;
+            script.defer = true;
+            script.onload = () => resolve();
+            script.onerror = () => {
+                scriptPromise = null; // allow later retries
+                reject(new Error('[Turnstile] script failed to load'));
+            };
+            document.head.appendChild(script);
+        });
+    }
+    return scriptPromise;
+}
+/**
+ * Creates a self-contained Cloudflare Turnstile controller for use in any
+ * framework (Stencil, Vue, Svelte, vanilla TS). Mirrors the behavior of the
+ * React `useTurnstile` hook used in the Flash project.
+ *
+ * Typical lifecycle:
+ *   1. Call `render(containerEl)` in your mount/componentDidLoad — loads the
+ *      script and renders an invisible widget.
+ *   2. On form submit, `await ensureToken()` to get (or obtain) a token.
+ *   3. Call `cleanup()` in your unmount/disconnectedCallback.
+ *
+ * @example
+ * ```ts
+ * const turnstile = createTurnstile({
+ *   siteKey: 'YOUR_SITE_KEY',
+ *   action: 'login',
+ *   onLoadingChange: (loading) => { this.isTurnstileLoading = loading; },
+ * });
+ *
+ * // in componentDidLoad
+ * await turnstile.render(this.turnstileContainerEl);
+ *
+ * // in handleSubmit
+ * const token = await turnstile.ensureToken();
+ * headers['X-Captcha-Response'] = token;
+ *
+ * // in disconnectedCallback
+ * turnstile.cleanup();
+ * ```
+ */
+function createTurnstile(options) {
+    const { siteKey, action, isEnabled = true, enableFallback = false, retryCount = DEFAULT_RETRY_COUNT } = options;
+    let token = null;
+    let widgetId;
+    let container;
+    let pendingRequest = null;
+    let currentPromise = null;
+    let shouldReset = false;
+    let lastResetAt = 0;
+    let errorCount = 0;
+    function setToken(value) {
+        var _a;
+        token = value;
+        (_a = options.onTokenChange) === null || _a === void 0 ? void 0 : _a.call(options, value);
+    }
+    function setLoading(value) {
+        var _a;
+        (_a = options.onLoadingChange) === null || _a === void 0 ? void 0 : _a.call(options, value);
+    }
+    function isWidgetReady() {
+        return !!window.turnstile && !!widgetId;
+    }
+    function handleVerificationSuccess(receivedToken) {
+        const pending = pendingRequest;
+        if (pending) {
+            if (pending.retryTimerId != null)
+                clearTimeout(pending.retryTimerId);
+            pending.resolve(receivedToken);
+            pendingRequest = null;
+        }
+        setToken(receivedToken);
+        setLoading(false);
+        shouldReset = false;
+        if (enableFallback)
+            errorCount = 0;
+    }
+    function scheduleNextExecute() {
+        const pending = pendingRequest;
+        if (!pending || !widgetId || !window.turnstile)
+            return;
+        pending.retryTimerId = setTimeout(() => {
+            if (!pendingRequest || !widgetId || !window.turnstile)
+                return;
+            errorCount += 1;
+            if (errorCount >= retryCount) {
+                if (pending.retryTimerId != null) {
+                    clearTimeout(pending.retryTimerId);
+                }
+                try {
+                    if (widgetId && window.turnstile) {
+                        window.turnstile.reset(widgetId);
+                        lastResetAt = Date.now();
+                    }
+                }
+                catch (e) {
+                    console.warn('[Turnstile] final reset failed', e);
+                }
+                setLoading(false);
+                shouldReset = false;
+                if (enableFallback) {
+                    handleVerificationSuccess(DUMMY_TURNSTILE_RESPONSE);
+                    return;
+                }
+                pendingRequest = null;
+                currentPromise = null;
+                errorCount = 0;
+                pending.reject(new Error('[Turnstile] Verification failed. Please try again.'));
+                return;
+            }
+            const now = Date.now();
+            if (shouldReset && now - lastResetAt >= RESET_COOL_DOWN_MS) {
+                try {
+                    window.turnstile.reset(widgetId);
+                    lastResetAt = now;
+                }
+                catch (e) {
+                    console.warn('[Turnstile] reset error', e);
+                }
+                finally {
+                    shouldReset = false;
+                }
+            }
+            try {
+                window.turnstile.execute(widgetId);
+            }
+            catch (e) {
+                console.warn('[Turnstile] execute threw -> reschedule', e);
+                scheduleNextExecute();
+            }
+        }, RETRY_INTERVAL_MS);
+    }
+    function renderWidget() {
+        if (widgetId || !container || !window.turnstile)
+            return;
+        shouldReset = false;
+        widgetId = window.turnstile.render(container, {
+            sitekey: siteKey,
+            retry: 'never',
+            action,
+            appearance: 'interaction-only',
+            execution: 'execute',
+            callback: handleVerificationSuccess,
+            'error-callback': () => {
+                shouldReset = true;
+                if (pendingRequest)
+                    scheduleNextExecute();
+            },
+            'expired-callback': () => {
+                setToken(null);
+                shouldReset = true;
+            },
+            'timeout-callback': () => {
+                if (pendingRequest) {
+                    shouldReset = true;
+                    scheduleNextExecute();
+                }
+            }
+        });
+    }
+    /**
+     * Loads the Turnstile script (once) and renders the invisible widget into
+     * `hostContainer`. Safe to call before the script is available.
+     */
+    async function render(hostContainer) {
+        var _a;
+        if (!isEnabled)
+            return;
+        container = hostContainer;
+        try {
+            await loadTurnstile();
+            renderWidget();
+            (_a = options.onReady) === null || _a === void 0 ? void 0 : _a.call(options);
+        }
+        catch (err) {
+            console.error('[Turnstile] script load error', err);
+        }
+    }
+    /**
+     * Executes the challenge and returns a token Promise. If a request is already
+     * in-flight the same Promise is returned (no duplicate challenges).
+     */
+    async function getToken() {
+        if (!isEnabled)
+            return undefined;
+        if (!isWidgetReady()) {
+            await loadTurnstile();
+            renderWidget();
+            if (!isWidgetReady()) {
+                throw new Error('[Turnstile] widget not ready');
+            }
+        }
+        if (currentPromise)
+            return currentPromise;
+        setLoading(true);
+        const promise = new Promise((resolve, reject) => {
+            pendingRequest = { resolve, reject, retryTimerId: null };
+            try {
+                window.turnstile.execute(widgetId);
+            }
+            catch (e) {
+                console.error('[Turnstile] execute error', e);
+                scheduleNextExecute();
+            }
+        }).finally(() => {
+            if (currentPromise === promise)
+                currentPromise = null;
+        });
+        currentPromise = promise;
+        return promise;
+    }
+    /**
+     * Returns the cached token immediately if still valid; otherwise calls
+     * `getToken()`. Prefer this on form submit.
+     */
+    async function ensureToken() {
+        if (!isEnabled)
+            return undefined;
+        if (token)
+            return token;
+        return getToken();
+    }
+    /**
+     * Resets the widget state and rejects any in-flight token promise.
+     * Call after a failed login attempt so the next submit gets a fresh token.
+     */
+    function reset() {
+        if (widgetId && window.turnstile) {
+            try {
+                window.turnstile.reset(widgetId);
+                lastResetAt = Date.now();
+            }
+            catch (_a) {
+                /* ignore */
+            }
+        }
+        if (pendingRequest) {
+            const pending = pendingRequest;
+            if (pending.retryTimerId != null)
+                clearTimeout(pending.retryTimerId);
+            pending.reject(new Error('[Turnstile] reset by caller'));
+            pendingRequest = null;
+        }
+        shouldReset = false;
+        currentPromise = null;
+        setLoading(false);
+        setToken(null);
+    }
+    /**
+     * Removes the widget from the DOM and rejects any pending promise.
+     * Call in `disconnectedCallback` / component unmount.
+     */
+    function cleanup() {
+        try {
+            if (widgetId && window.turnstile) {
+                window.turnstile.remove(widgetId);
+            }
+        }
+        catch (_a) {
+            /* ignore */
+        }
+        if (pendingRequest) {
+            const pending = pendingRequest;
+            if (pending.retryTimerId != null)
+                clearTimeout(pending.retryTimerId);
+            pending.reject(new Error('[Turnstile] widget destroyed'));
+            pendingRequest = null;
+        }
+        widgetId = undefined;
+        shouldReset = false;
+        currentPromise = null;
+        setLoading(false);
+        setToken(null);
+    }
+    return { render, getToken, ensureToken, reset, cleanup };
+}
+
+const CAPTCHA_CONTAINER_SLOT = "captchaContainer";
+
 var qr=Object.defineProperty,Yr=Object.defineProperties;var Kr=Object.getOwnPropertyDescriptors;var lo=Object.getOwnPropertySymbols;var Gr=Object.prototype.hasOwnProperty,Xr=Object.prototype.propertyIsEnumerable;var Mt=(s,t,e)=>t in s?qr(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,we=(s,t)=>{for(var e in t||(t={}))Gr.call(t,e)&&Mt(s,e,t[e]);if(lo)for(var e of lo(t))Xr.call(t,e)&&Mt(s,e,t[e]);return s},Nt=(s,t)=>Yr(s,Kr(t));var k=(s,t,e)=>(Mt(s,typeof t!="symbol"?t+"":t,e),e);var Ce=(s,t,e)=>new Promise((i,o)=>{var r=l=>{try{a(e.next(l));}catch(d){o(d);}},n=l=>{try{a(e.throw(l));}catch(d){o(d);}},a=l=>l.done?i(l.value):Promise.resolve(l.value).then(r,n);a((e=e.apply(s,t)).next());});/**
  * @license
  * Copyright (c) 2021 - 2024 Vaadin Ltd.
@@ -7184,6 +7565,7 @@ const UserLogin = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.errorCode = '';
+        this.captchaInstance = null;
         this.messageHandler = async (e) => {
             var _a;
             if (((_a = e.data) === null || _a === void 0 ? void 0 : _a.type) === 'NativeAppReady') {
@@ -7200,11 +7582,11 @@ const UserLogin = class {
         /**
          * Fetch phone prefixes from the API
          */
-        this.getPhoneCodes = () => {
+        this.getPhoneCodes = async () => {
             const url = new URL(`${this.endpoint}/v1/player/operatorSupportedPhoneCodes`);
             return fetch(url.href)
                 .then(res => res.json())
-                .then(data => data.phoneCodes.map(code => ({ label: code, value: code })))
+                .then(data => { var _a; return ((_a = data === null || data === void 0 ? void 0 : data.phoneCodes) !== null && _a !== void 0 ? _a : []).map(code => ({ label: code, value: code })); })
                 .catch(err => console.log('Failed to fetch phone codes:', err));
         };
         /**
@@ -7222,6 +7604,7 @@ const UserLogin = class {
          * Login API call for Gm 1.7
          */
         this.userLoginGm17 = async () => {
+            var _a, _b, _c;
             let headers = {
                 'Content-Type': 'application/json'
             };
@@ -7229,8 +7612,15 @@ const UserLogin = class {
                 contact: this.userNameEmail,
                 password: this.userPassword
             };
-            if (this.captchaData.isEnabled) {
-                headers['X-Captcha-Response'] = this.captchaData.token;
+            if (this.captchaInstance) {
+                let token;
+                if (typeof ((_a = this.captchaInstance) === null || _a === void 0 ? void 0 : _a.ensureToken) === "function") {
+                    token = await ((_c = (_b = this.captchaInstance) === null || _b === void 0 ? void 0 : _b.ensureToken) === null || _c === void 0 ? void 0 : _c.call(_b));
+                }
+                else {
+                    token = this.captchaToken;
+                }
+                headers['cf-captcha-response'] = token !== null && token !== void 0 ? token : "";
             }
             const options = {
                 method: 'POST',
@@ -7313,9 +7703,26 @@ const UserLogin = class {
          * Login API call
          */
         this.userLogin = async () => {
+            var _a, _b;
             const url = new URL(`${this.endpoint}/v1/player/legislation/login`);
             const headers = new Headers();
             headers.append('Content-Type', 'application/json');
+            if (this.turnstileSiteKey && this.captchaInstance) {
+                try {
+                    const turnstileToken = await ((_b = (_a = this.captchaInstance) === null || _a === void 0 ? void 0 : _a.ensureToken) === null || _b === void 0 ? void 0 : _b.call(_a));
+                    if (turnstileToken) {
+                        headers.append('cf-captcha-response', turnstileToken);
+                        headers.append('cfCaptchaIsVisible', 'false');
+                    }
+                }
+                catch (error) {
+                    this.hasError = true;
+                    this.errorMessage = translate('genericError', this.lang) || `${error}`;
+                    this.sendErrorNotification(this.errorMessage);
+                    this.isLoginLoading = false;
+                    return;
+                }
+            }
             const body = JSON.stringify({
                 username: this.loginByPhoneNumber === 'true' ? `${this.userPrefix} ${this.userPhone}` : this.userNameEmail,
                 password: this.userPassword
@@ -7483,11 +7890,11 @@ const UserLogin = class {
         this.clientStylingUrl = '';
         this.translationUrl = '';
         this.passwordReset = 'false';
-        this.userEmailRegex = undefined;
+        this.userEmailRegex = '';
         this.userEmailRegexOptions = 'i';
-        this.userPhoneRegex = undefined;
+        this.userPhoneRegex = '';
         this.userPhoneRegexOptions = '';
-        this.passwordRegex = undefined;
+        this.passwordRegex = '';
         this.passwordRegexOptions = '';
         this.version = 'gm16';
         this.loginByPhoneNumber = 'false';
@@ -7497,6 +7904,9 @@ const UserLogin = class {
         this.biometricEnabled = 'false';
         this.biometricactionmode = 'switch';
         this.isFromLogin = true;
+        this.turnstileSiteKey = undefined;
+        this.turnstileEnableFallback = false;
+        this.turnstileRetryCount = undefined;
         this.userNameEmail = '';
         this.userPassword = '';
         this.isValidUserEmail = true;
@@ -7508,16 +7918,11 @@ const UserLogin = class {
         this.errorMessage = '';
         this.errorForFields = {};
         this.hasError = false;
-        this.phoneCodes = undefined;
+        this.phoneCodes = [];
         this.isLoginLoading = false;
-        this.captchaData = {
-            isEnabled: true,
-            token: '',
-            provider: '',
-            siteKey: ''
-        };
         this.isNativeApp = false;
         this.biometricsLoaded = false;
+        this.isTurnstileLoading = false;
     }
     /**
      * Watch for changes in the translation URL and fetch new translations
@@ -7546,7 +7951,7 @@ const UserLogin = class {
      * Populate login credentials from an external caller and trigger the login process
      */
     async autofillCredentials(credentials) {
-        const { userNameEmail, userPassword, userPrefix, userPhone } = credentials || {};
+        const { userNameEmail, userPassword, userPrefix = '', userPhone = '' } = credentials || {};
         this.userNameEmail = userNameEmail;
         this.userPassword = userPassword;
         this.userPrefix = userPrefix;
@@ -7558,15 +7963,16 @@ const UserLogin = class {
      * Lifecycle method: Fetch translations on component load
      */
     async componentWillLoad() {
+        var _a, _b;
         if (this.loginByPhoneNumber === 'true') {
             if (this.defaultPrefix && this.isPrefixEditable === 'false') {
                 this.phoneCodes = [{ label: this.defaultPrefix, value: this.defaultPrefix }];
                 this.userPrefix = this.defaultPrefix;
             }
             else {
-                this.phoneCodes = await this.getPhoneCodes();
-                if (!this.defaultPrefix && this.isPrefixEditable === 'false') {
-                    this.userPrefix = this.phoneCodes[0].value;
+                this.phoneCodes = await (this.getPhoneCodes()) || [];
+                if (((_a = this.phoneCodes) === null || _a === void 0 ? void 0 : _a.length) && !this.defaultPrefix && this.isPrefixEditable === 'false') {
+                    this.userPrefix = (_b = this.phoneCodes[0]) === null || _b === void 0 ? void 0 : _b.value;
                 }
                 else if (this.defaultPrefix && this.isPrefixEditable === 'true') {
                     this.userPrefix = this.defaultPrefix;
@@ -7580,8 +7986,8 @@ const UserLogin = class {
             await getTranslations(this.translationUrl);
         }
         if (this.version === 'gm17') {
-            this.getLoginConfig().then(() => {
-                this.appendCaptchaScript();
+            this.getLoginConfig().then((captchaData) => {
+                this.initializeCaptcha(captchaData);
             }).catch((error) => {
                 console.error(error);
                 this.hasError = true;
@@ -7612,9 +8018,17 @@ const UserLogin = class {
         this.handleClientStyling();
         window.addEventListener('LoginCredentials', this.autofillCredentialsHandler);
         window.postMessage({ type: 'UserLoginDidLoad' });
+        if (this.turnstileSiteKey) {
+            this.initializeCaptcha({
+                isEnabled: true,
+                provider: "cloudflare",
+                siteKey: this.turnstileSiteKey,
+                enableFallback: this.turnstileEnableFallback
+            });
+        }
     }
     /**
-     * Fetches the login configuration from the backend API.
+     * Fetches the login configuration from the backend API, used for gm17 only.
      *
      * @returns A Promise that resolves once the configuration is fetched and set.
      */
@@ -7633,8 +8047,7 @@ const UserLogin = class {
                 if (captcha && typeof captcha.provider === 'string') {
                     captcha.provider = captcha.provider.toLowerCase();
                 }
-                this.captchaData = Object.assign({}, captcha);
-                resolve();
+                resolve(captcha);
             })
                 .catch((error) => {
                 console.error('Error fetching login configuration:', error);
@@ -7642,70 +8055,30 @@ const UserLogin = class {
             });
         });
     }
-    /**
-     * Handles the integration of CAPTCHA based on the login configuration.
-     * Dynamically injects the necessary CAPTCHA script if enabled.
-     */
-    handleCaptcha() {
-        const { isEnabled, provider, siteKey } = this.captchaData;
-        if (!isEnabled) {
-            return;
-        }
-        if (!['cloudflare', 'google'].includes(provider)) {
-            return;
-        }
-        if (provider === 'cloudflare') {
-            window.turnstile.render('#turnstileContainer', {
-                sitekey: siteKey,
-                theme: 'light',
-                callback: this.captchaCallback.bind(this),
-            });
-        }
-        else if (provider === 'google') {
-            window.grecaptcha.ready(() => {
-                window.grecaptcha.render('googleContainer', {
-                    sitekey: siteKey,
-                    callback: this.captchaCallback.bind(this),
-                    theme: 'light'
-                });
-            });
-        }
-    }
-    /**
-     * Common callback function for CAPTCHA response handling.
-     * @param token CAPTCHA response token.
-     */
-    captchaCallback(token) {
-        this.captchaData.token = token;
-        this.captchaData = Object.assign({}, this.captchaData); // Needed to tell Stencil something was changed
-    }
-    /**
-     * Dynamically loads the Turnstile script and renders CAPTCHA when ready.
-     * @param src - The URL of the CAPTCHA script to load.
-     * @param captcha - The CAPTCHA configuration.
-     */
-    appendCaptchaScript() {
-        const { isEnabled, provider } = this.captchaData;
-        if (!isEnabled) {
-            return;
-        }
-        const script = document.createElement('script');
-        if (provider === 'cloudflare') {
-            script.src = 'https://challenges.cloudflare.com/turnstile/v0/api.js';
-        }
-        else if (provider === 'google') {
-            script.src = 'https://www.google.com/recaptcha/api.js';
-        }
-        script.onload = this.handleCaptcha.bind(this);
-        document.head.appendChild(script);
+    async initializeCaptcha({ provider, siteKey, enableFallback }) {
+        const slotElement = getSlottedElement(this.host, CAPTCHA_CONTAINER_SLOT);
+        this.captchaContainerEl = slotElement;
+        const captchaCreator = {
+            "google": createRecaptcha,
+            "cloudflare": createTurnstile
+        };
+        this.captchaInstance = captchaCreator[provider]({
+            action: 'login',
+            siteKey,
+            enableFallback,
+            callback: provider === "google" ? (token) => { this.captchaToken = token; } : undefined
+        });
+        await this.captchaInstance.render(this.captchaContainerEl);
     }
     /**
      * Lifecycle method: Clean up event listeners when the component is removed
      */
     disconnectedCallback() {
+        var _a, _b;
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
         window.removeEventListener('LoginCredentials', this.autofillCredentialsHandler);
         window.removeEventListener('message', this.messageHandler);
+        (_b = (_a = this.captchaInstance) === null || _a === void 0 ? void 0 : _a.cleanup) === null || _b === void 0 ? void 0 : _b.call(_a);
     }
     /**
      * Send error notification as a post message
@@ -7722,12 +8095,12 @@ const UserLogin = class {
     /**
      * Debounce function to limit API calls
      */
-    debounce(func, delay) {
+    debounce(fn, delay = 500) {
         let timer;
-        return function (...args) {
+        return (...args) => {
             clearTimeout(timer);
             timer = setTimeout(() => {
-                func.apply(this, args);
+                fn(...args);
             }, delay);
         };
     }
@@ -7757,9 +8130,12 @@ const UserLogin = class {
         window.dispatchEvent(event);
     }
     checkIsDisabled() {
-        const isDisabled = Boolean(((this.loginByPhoneNumber !== 'true' && (!this.isValidUserEmail || !this.userNameEmail)) ||
+        const isDisabled = Boolean((this.loginByPhoneNumber !== 'true' && (!this.isValidUserEmail || !this.userNameEmail)) ||
             (this.loginByPhoneNumber === 'true' && (!this.isValidUserPhone || !this.userPhone || !this.userPrefix)) ||
-            !this.userPassword || !this.isValidPassword) || this.isLoginLoading || (this.version === 'gm17' && this.captchaData.isEnabled && !this.captchaData.token));
+            !this.userPassword ||
+            !this.isValidPassword ||
+            this.isLoginLoading ||
+            (this.version === 'gm17' && this.captchaInstance && !this.captchaToken));
         return isDisabled;
     }
     renderVisibilityIcon() {
@@ -7777,17 +8153,16 @@ const UserLogin = class {
                 h("p", { class: "CredentialsError" }, translate('userEmailError', this.lang))), h("div", { class: (!this.isValidPassword && this.errorForFields['password']) ? 'InputBox InputInvalidBox' : 'InputBox' }, this.renderVisibilityIcon(), h("input", { name: 'password', type: this.isPasswordVisible ? "text" : "password", placeholder: '', value: this.userPassword, onInput: this.handleInputChangePartial('password'), autocapitalize: "none", required: true }), h("label", { class: (this.userPassword ? 'FieldFilledIn' : '') + ' ' + (!this.isValidPassword && this.errorForFields['password'] ? 'FieldInvalid' : '') }, translate('password', this.lang)), !this.isValidPassword && this.errorForFields['password'] &&
             h("p", { class: "CredentialsError" }, translate('userPasswordError', this.lang))), this.biometricEnabled === 'true' && this.isNativeApp &&
             h("div", { class: "PlayerBiometricsContainer" }, h("div", { class: "PlayerBiometrics" }, h("span", null, translate('biometricLogin')), h("player-account-biometrics-action", { mode: this.biometricactionmode, isFromLogin: this.isFromLogin, isNativeApp: this.isNativeApp, lang: this.lang, translationurl: this.translationUrl, clientstyling: this.clientStyling, clientstylingurl: this.clientStylingUrl, mbsource: this.mbSource, isLoading: this.isLoginLoading }))), this.passwordReset == 'true' &&
-            h("div", { class: "ForgotPassword" }, h("button", { onClick: this.resetPassword }, translate('forgotPassword', this.lang))), this.captchaData.isEnabled && this.captchaData.provider === 'cloudflare' &&
-            h("slot", { name: "turnstile" }), this.captchaData.isEnabled && this.captchaData.provider === 'google' &&
-            h("slot", { name: "google" }), h("button", { disabled: this.checkIsDisabled(), class: "SubmitCredentials", onClick: this.handleLogin }, translate('login', this.lang)), this.hasError &&
+            h("div", { class: "ForgotPassword" }, h("button", { onClick: this.resetPassword }, translate('forgotPassword', this.lang))), h("button", { disabled: this.checkIsDisabled(), class: "SubmitCredentials", onClick: this.handleLogin }, translate('login', this.lang)), this.hasError &&
             h("p", { class: "CredentialsError" }, this.errorMessage))));
     }
     /**
      * Render function
-     */
+    */
     render() {
-        return h("section", { key: '6dcfae23bb6f3bb107c030d3fef3f8e32f88e12b', ref: el => this.stylingContainer = el }, this.renderUserIdentification());
+        return (h("section", { key: 'c72b94ac2e6cde988ae4798402680a527e4a004e', ref: el => this.stylingContainer = el }, this.renderUserIdentification(), h("slot", { key: '36c64bfcc9d5e19ae7b22d50638bf3c720167606', name: CAPTCHA_CONTAINER_SLOT })));
     }
+    get host() { return getElement(this); }
     static get watchers() { return {
         "translationUrl": ["handleNewTranslations"],
         "clientStyling": ["handleClientStylingChange"],