@authowl/react 0.21.2 → 0.22.0

package/dist/index.js

@@ -356,104 +356,19 @@ function PasskeyButton({ redirectTo, onSignedIn }) {
 }
 
 // src/components/ForgotPassword.tsx
-import * as React5 from "react";
-
-// src/components/AuthChallenge.tsx
 import * as React4 from "react";
 
-// src/components/Turnstile.tsx
+// src/components/AuthChallenge.tsx
 import * as React3 from "react";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var SCRIPT_URL = "https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit";
-var SCRIPT_LOAD_TIMEOUT_MS = 1e4;
-var LOCAL_TURNSTILE_TEST_TOKEN = "XXXX.DUMMY.TOKEN.XXXX";
-var loader = null;
-function loadTurnstile() {
-  if (window.turnstile) return Promise.resolve(window.turnstile);
-  if (loader) return loader;
-  loader = new Promise((resolve, reject) => {
-    const existing = document.querySelector(`script[src="${SCRIPT_URL}"]`);
-    const script = existing ?? document.createElement("script");
-    const cleanup = () => {
-      clearTimeout(timeout);
-      script.removeEventListener("load", loaded);
-      script.removeEventListener("error", failed);
-    };
-    const loaded = () => {
-      cleanup();
-      if (window.turnstile) {
-        resolve(window.turnstile);
-      } else {
-        reject(new Error("Turnstile unavailable"));
-      }
-    };
-    const failed = () => {
-      cleanup();
-      if (!existing) script.remove();
-      reject(new Error("Turnstile failed to load"));
-    };
-    const timeout = setTimeout(failed, SCRIPT_LOAD_TIMEOUT_MS);
-    script.addEventListener("load", loaded, { once: true });
-    script.addEventListener("error", failed, { once: true });
-    if (!existing) {
-      script.src = SCRIPT_URL;
-      script.async = true;
-      script.defer = true;
-      const nonce = document.querySelector("script[nonce]")?.nonce;
-      if (nonce) script.nonce = nonce;
-      document.head.appendChild(script);
-    }
-  }).catch((error) => {
-    loader = null;
-    throw error;
-  });
-  return loader;
-}
-function Turnstile({
-  siteKey,
-  theme,
-  onToken,
-  onUnavailable
-}) {
-  const container = React3.useRef(null);
-  const callbacks = React3.useRef({ onToken, onUnavailable });
-  callbacks.current = { onToken, onUnavailable };
-  React3.useEffect(() => {
-    callbacks.current.onToken(null);
-    if (!siteKey) {
-      callbacks.current.onToken(LOCAL_TURNSTILE_TEST_TOKEN);
-      return;
-    }
-    let active = true;
-    let widget = null;
-    void loadTurnstile().then((api) => {
-      if (!active || !container.current) return;
-      const id = api.render(container.current, {
-        sitekey: siteKey,
-        theme: theme === "system" ? "auto" : theme,
-        size: "flexible",
-        callback: (token) => callbacks.current.onToken(token),
-        "expired-callback": () => callbacks.current.onToken(null),
-        "error-callback": () => {
-          callbacks.current.onToken(null);
-          callbacks.current.onUnavailable();
-        }
-      });
-      widget = { api, id };
-    }).catch(() => {
-      if (active) callbacks.current.onUnavailable();
-    });
-    return () => {
-      active = false;
-      if (widget) widget.api.remove(widget.id);
-    };
-  }, [siteKey, theme]);
-  if (!siteKey) return null;
-  return /* @__PURE__ */ jsx4("div", { className: "ba-turnstile", ref: container, "data-testid": "phoneotp-turnstile" });
+
+// src/components/captcha-provider-ids.ts
+var CAPTCHA_PROVIDER_IDS = ["turnstile", "hcaptcha", "recaptcha-v2"];
+function isSupportedCaptchaProvider(provider) {
+  return CAPTCHA_PROVIDER_IDS.includes(provider);
 }
 
 // src/components/AuthChallenge.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var AUTH_CHALLENGE_ACTIONS = {
   signUp: "auth_signup",
   signIn: "auth_signin",
@@ -468,38 +383,53 @@ var challengeError = {
   code: "BOT_CHALLENGE_FAILED",
   message: "Human verification failed."
 };
-function turnstileTheme(root, fallback) {
+function captchaTheme(root, fallback) {
   const rendered = root?.dataset.authowlTheme;
   if (rendered === "light" || rendered === "dark") return rendered;
   if (fallback === "light" || fallback === "dark") return fallback;
   return "auto";
 }
 function useAuthChallenge() {
-  const { config, isLoading } = usePublicConfig();
+  const { config, isLoading, retry } = usePublicConfig();
   const t = useT();
-  const container = React4.useRef(null);
-  const active = React4.useRef(null);
-  const [status, setStatus] = React4.useState("idle");
-  const siteKey = config?.authTurnstileSiteKey ?? null;
-  const removeActive = React4.useCallback((reason) => {
+  const container = React3.useRef(null);
+  const active = React3.useRef(null);
+  const [status, setStatus] = React3.useState("idle");
+  const captcha = config?.captcha ?? null;
+  const providerSupported = captcha ? isSupportedCaptchaProvider(captcha.provider) : false;
+  const unavailableProvider = captcha && !providerSupported ? captcha.provider : null;
+  const refetched = React3.useRef(null);
+  const refetchIfConfigMayBeStale = React3.useCallback(() => {
+    if (!config || refetched.current === config) return;
+    refetched.current = config;
+    retry();
+  }, [config, retry]);
+  const removeActive = React3.useCallback((reason) => {
     const current = active.current;
     active.current = null;
     if (!current) return;
-    current.api.remove(current.id);
+    current.adapter.teardown(current.api, current.id);
     if (reason) current.reject(reason);
   }, []);
-  React4.useEffect(
-    () => () => removeActive(new Error("Turnstile challenge was cancelled")),
+  React3.useEffect(
+    () => () => removeActive(new Error("Captcha challenge was cancelled")),
     [removeActive]
   );
-  const tokenFor = React4.useCallback(
+  const tokenFor = React3.useCallback(
     async (action) => {
-      if (!siteKey) return null;
+      if (!captcha) return null;
+      if (!providerSupported) throw new Error(`Unsupported captcha provider: ${captcha.provider}`);
       setStatus("checking");
-      removeActive(new Error("Turnstile challenge was replaced"));
+      removeActive(new Error("Captcha challenge was replaced"));
       try {
-        const api = await loadTurnstile();
-        if (!container.current) throw new Error("Turnstile container unavailable");
+        const [{ loadCaptcha }, { captchaAdapterFor }] = await Promise.all([
+          import("./captcha-loader-VNULARCZ.js"),
+          import("./captcha-providers-STYFL25P.js")
+        ]);
+        const adapter = captchaAdapterFor(captcha.provider);
+        if (!adapter) throw new Error(`Unsupported captcha provider: ${captcha.provider}`);
+        const api = await loadCaptcha(adapter);
+        if (!container.current) throw new Error("Captcha container unavailable");
         return await new Promise((resolve, reject) => {
           let settled = false;
           const finish = (outcome) => {
@@ -507,27 +437,29 @@ function useAuthChallenge() {
             settled = true;
             const current = active.current;
             active.current = null;
-            if (current) current.api.remove(current.id);
+            if (current) current.adapter.teardown(current.api, current.id);
             if ("token" in outcome) resolve(outcome.token);
             else reject(outcome.error);
           };
-          const fail = () => finish({ error: new Error("Turnstile challenge failed") });
+          const fail = () => finish({ error: new Error("Captcha challenge failed") });
           const root = container.current.closest(".authowl-root");
+          const optionalFailureCallbacks = captcha.provider === "turnstile" ? {
+            "timeout-callback": fail,
+            "unsupported-callback": fail
+          } : {};
           const id = api.render(container.current, {
-            sitekey: siteKey,
-            theme: turnstileTheme(root, config?.branding?.theme),
-            action,
-            execution: "execute",
-            appearance: "interaction-only",
-            size: "flexible",
-            language: root?.dataset.authowlLocale ?? config?.locale,
+            ...adapter.invisibleRenderOptions({
+              siteKey: captcha.siteKey,
+              theme: captchaTheme(root, config?.branding?.theme),
+              action,
+              language: root?.dataset.authowlLocale ?? config?.locale
+            }),
             callback: (token) => finish({ token }),
             "expired-callback": fail,
             "error-callback": fail,
-            "timeout-callback": fail,
-            "unsupported-callback": fail
+            ...optionalFailureCallbacks
           });
-          active.current = { api, id, reject };
+          active.current = { adapter, api, id, reject };
           try {
             api.execute(id);
           } catch {
@@ -538,9 +470,9 @@ function useAuthChallenge() {
         setStatus("idle");
       }
     },
-    [config?.branding?.theme, config?.locale, removeActive, siteKey]
+    [captcha, config?.branding?.theme, config?.locale, providerSupported, removeActive]
   );
-  const run = React4.useCallback(
+  const run = React3.useCallback(
     async (action, request) => {
       if (isLoading) {
         return {
@@ -550,37 +482,40 @@ function useAuthChallenge() {
       }
       try {
         const token = await tokenFor(action);
-        return await request(token ? { authChallengeToken: token } : void 0);
+        const result = await request(token ? { authChallengeToken: token } : void 0);
+        if (result?.error?.code === challengeError.code) refetchIfConfigMayBeStale();
+        return result;
       } catch {
         setStatus("failed");
+        refetchIfConfigMayBeStale();
         return {
           data: null,
           error: challengeError
         };
       }
     },
-    [isLoading, tokenFor]
+    [isLoading, refetchIfConfigMayBeStale, tokenFor]
   );
-  const control = siteKey ? /* @__PURE__ */ jsxs4("div", { className: "ba-auth-challenge", "data-testid": "auth-challenge", children: [
-    /* @__PURE__ */ jsx5("div", { className: "ba-turnstile", ref: container }),
-    /* @__PURE__ */ jsx5("p", { className: "ba-sr-only", role: "status", "aria-live": "polite", children: status === "checking" ? t("authChallenge.checking") : status === "failed" ? t("authChallenge.error.failed") : "" })
+  const control = captcha ? /* @__PURE__ */ jsxs4("div", { className: "ba-auth-challenge", "data-testid": "auth-challenge", children: [
+    providerSupported ? /* @__PURE__ */ jsx4("div", { className: "ba-turnstile", ref: container }) : null,
+    unavailableProvider ? /* @__PURE__ */ jsx4(FormError, { "data-testid": "auth-challenge-unsupported", children: t("authChallenge.error.unsupportedProvider", { provider: unavailableProvider }) }) : /* @__PURE__ */ jsx4("p", { className: "ba-sr-only", role: "status", "aria-live": "polite", children: status === "checking" ? t("authChallenge.checking") : status === "failed" ? t("authChallenge.error.failed") : "" })
   ] }) : null;
   return { run, control, configPending: isLoading };
 }
 
 // src/components/ForgotPassword.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function ForgotPassword({ resetPasswordUrl, onBack }) {
   const t = useT();
   const { requestPasswordReset } = usePasswordReset();
   const { pending, error, run } = useSubmitAction();
   const authChallenge = useAuthChallenge();
-  const [email, setEmail] = React5.useState("");
-  const [sent, setSent] = React5.useState(false);
+  const [email, setEmail] = React4.useState("");
+  const [sent, setSent] = React4.useState(false);
   if (sent) {
     return /* @__PURE__ */ jsxs5("div", { className: "ba-fields", "data-testid": "forgot-sent", children: [
-      /* @__PURE__ */ jsx6("p", { className: "ba-muted", children: richMessage(t("forgotPassword.sent"), { email: /* @__PURE__ */ jsx6(Bidi, { children: email }) }) }),
-      onBack && /* @__PURE__ */ jsx6("button", { type: "button", className: "ba-link-button", onClick: onBack, children: t("forgotPassword.backToSignIn") })
+      /* @__PURE__ */ jsx5("p", { className: "ba-muted", children: richMessage(t("forgotPassword.sent"), { email: /* @__PURE__ */ jsx5(Bidi, { children: email }) }) }),
+      onBack && /* @__PURE__ */ jsx5("button", { type: "button", className: "ba-link-button", onClick: onBack, children: t("forgotPassword.backToSignIn") })
     ] });
   }
   return /* @__PURE__ */ jsxs5(
@@ -599,7 +534,7 @@ function ForgotPassword({ resetPasswordUrl, onBack }) {
       children: [
         /* @__PURE__ */ jsxs5("label", { className: "ba-label", children: [
           t("common.emailLabel"),
-          /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx5(
             "input",
             {
               className: "ba-input",
@@ -612,25 +547,25 @@ function ForgotPassword({ resetPasswordUrl, onBack }) {
           )
         ] }),
         authChallenge.control,
-        /* @__PURE__ */ jsx6(FormError, { children: error }),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx5(FormError, { children: error }),
+        /* @__PURE__ */ jsx5(
           "button",
           {
             className: "ba-button",
             type: "submit",
             disabled: pending || authChallenge.configPending,
             "aria-busy": pending || void 0,
-            children: /* @__PURE__ */ jsx6(Busy, { busy: pending, label: t("common.sending"), children: t("forgotPassword.submit") })
+            children: /* @__PURE__ */ jsx5(Busy, { busy: pending, label: t("common.sending"), children: t("forgotPassword.submit") })
           }
         ),
-        onBack && /* @__PURE__ */ jsx6("button", { type: "button", className: "ba-link-button", onClick: onBack, children: t("forgotPassword.backToSignIn") })
+        onBack && /* @__PURE__ */ jsx5("button", { type: "button", className: "ba-link-button", onClick: onBack, children: t("forgotPassword.backToSignIn") })
       ]
     }
   );
 }
 
 // src/components/OtpCodeForm.tsx
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function OtpCodeForm({
   email,
   code,
@@ -653,8 +588,8 @@ function OtpCodeForm({
       },
       children: [
         /* @__PURE__ */ jsxs6("label", { className: "ba-label", children: [
-          richMessage(t("emailOtp.codeLabel"), { email: /* @__PURE__ */ jsx7(Bidi, { children: email }) }),
-          /* @__PURE__ */ jsx7(
+          richMessage(t("emailOtp.codeLabel"), { email: /* @__PURE__ */ jsx6(Bidi, { children: email }) }),
+          /* @__PURE__ */ jsx6(
             "input",
             {
               className: "ba-input",
@@ -667,24 +602,24 @@ function OtpCodeForm({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx7(FormError, { children: error }),
-        /* @__PURE__ */ jsx7("button", { className: "ba-button", type: "submit", disabled: pending, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx7(Busy, { busy: pending, label: t("common.verifying"), children: t("emailOtp.verifySubmit") }) }),
-        /* @__PURE__ */ jsx7("button", { type: "button", className: "ba-link-button", onClick: onChangeEmail, children: t("emailOtp.changeEmail") })
+        /* @__PURE__ */ jsx6(FormError, { children: error }),
+        /* @__PURE__ */ jsx6("button", { className: "ba-button", type: "submit", disabled: pending, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx6(Busy, { busy: pending, label: t("common.verifying"), children: t("emailOtp.verifySubmit") }) }),
+        /* @__PURE__ */ jsx6("button", { type: "button", className: "ba-link-button", onClick: onChangeEmail, children: t("emailOtp.changeEmail") })
       ]
     }
   );
 }
 
 // src/components/MFAChallenge.tsx
-import * as React6 from "react";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import * as React5 from "react";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function MFAChallenge({ onVerified, allowTrustDevice = true }) {
   const t = useT();
   const { verifyTotp, verifyBackupCode, sendOtp, verifyOtp } = useMFA();
   const { pending, error, setError, run } = useSubmitAction();
-  const [mode, setMode] = React6.useState("totp");
-  const [code, setCode] = React6.useState("");
-  const [trustDevice, setTrustDevice] = React6.useState(false);
+  const [mode, setMode] = React5.useState("totp");
+  const [code, setCode] = React5.useState("");
+  const [trustDevice, setTrustDevice] = React5.useState(false);
   const switchMode = (next) => {
     setMode(next);
     setCode("");
@@ -708,11 +643,11 @@ function MFAChallenge({ onVerified, allowTrustDevice = true }) {
   const hint = mode === "totp" ? t("mfa.challenge.totpHint") : mode === "backup" ? t("mfa.challenge.backupHint") : t("mfa.challenge.otpHint");
   const label2 = mode === "totp" ? t("mfa.challenge.totpLabel") : mode === "backup" ? t("mfa.challenge.backupLabel") : t("mfa.challenge.otpLabel");
   return /* @__PURE__ */ jsxs7("form", { method: "post", className: "ba-fields", "data-testid": "mfa-challenge", onSubmit: submit, children: [
-    /* @__PURE__ */ jsx8("h2", { className: "ba-title", children: t("mfa.challenge.title") }),
-    /* @__PURE__ */ jsx8("p", { className: "ba-muted", children: hint }),
+    /* @__PURE__ */ jsx7("h2", { className: "ba-title", children: t("mfa.challenge.title") }),
+    /* @__PURE__ */ jsx7("p", { className: "ba-muted", children: hint }),
     /* @__PURE__ */ jsxs7("label", { className: "ba-label", children: [
       label2,
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx7(
         "input",
         {
           className: "ba-input",
@@ -730,24 +665,24 @@ function MFAChallenge({ onVerified, allowTrustDevice = true }) {
     ] }),
     mode !== "backup" && allowTrustDevice && /* @__PURE__ */ jsxs7("label", { className: "ba-consent ba-consent-centered", children: [
       /* @__PURE__ */ jsxs7("span", { className: "ba-checkbox-control", children: [
-        /* @__PURE__ */ jsx8("input", { className: "ba-checkbox", type: "checkbox", checked: trustDevice, onChange: (e) => setTrustDevice(e.target.checked) }),
-        /* @__PURE__ */ jsx8("span", { className: "ba-checkbox-visual", "aria-hidden": "true", children: /* @__PURE__ */ jsx8("span", { className: "ba-checkbox-check" }) })
+        /* @__PURE__ */ jsx7("input", { className: "ba-checkbox", type: "checkbox", checked: trustDevice, onChange: (e) => setTrustDevice(e.target.checked) }),
+        /* @__PURE__ */ jsx7("span", { className: "ba-checkbox-visual", "aria-hidden": "true", children: /* @__PURE__ */ jsx7("span", { className: "ba-checkbox-check" }) })
       ] }),
-      /* @__PURE__ */ jsx8("span", { children: t("mfa.challenge.trustDevice", { days: 30 }) })
+      /* @__PURE__ */ jsx7("span", { children: t("mfa.challenge.trustDevice", { days: 30 }) })
     ] }),
-    /* @__PURE__ */ jsx8(FormError, { children: error }),
-    /* @__PURE__ */ jsx8("button", { className: "ba-button", type: "submit", disabled: pending || !code, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx8(Busy, { busy: pending, label: t("common.verifying"), children: t("mfa.challenge.submit") }) }),
-    mode !== "totp" && /* @__PURE__ */ jsx8("button", { type: "button", className: "ba-link-button", onClick: () => switchMode("totp"), children: t("mfa.challenge.useTotp") }),
-    mode !== "backup" && /* @__PURE__ */ jsx8("button", { type: "button", className: "ba-link-button", onClick: () => switchMode("backup"), children: t("mfa.challenge.useBackup") }),
-    /* @__PURE__ */ jsx8("button", { type: "button", className: "ba-link-button", disabled: pending, onClick: requestOtp, children: t(mode === "otp" ? "mfa.challenge.resendOtp" : "mfa.challenge.useEmailOtp") })
+    /* @__PURE__ */ jsx7(FormError, { children: error }),
+    /* @__PURE__ */ jsx7("button", { className: "ba-button", type: "submit", disabled: pending || !code, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx7(Busy, { busy: pending, label: t("common.verifying"), children: t("mfa.challenge.submit") }) }),
+    mode !== "totp" && /* @__PURE__ */ jsx7("button", { type: "button", className: "ba-link-button", onClick: () => switchMode("totp"), children: t("mfa.challenge.useTotp") }),
+    mode !== "backup" && /* @__PURE__ */ jsx7("button", { type: "button", className: "ba-link-button", onClick: () => switchMode("backup"), children: t("mfa.challenge.useBackup") }),
+    /* @__PURE__ */ jsx7("button", { type: "button", className: "ba-link-button", disabled: pending, onClick: requestOtp, children: t(mode === "otp" ? "mfa.challenge.resendOtp" : "mfa.challenge.useEmailOtp") })
   ] });
 }
 
 // src/components/mfa-enrollment-step.tsx
-import * as React9 from "react";
+import * as React8 from "react";
 
 // src/components/MFAEnrollment.tsx
-import * as React8 from "react";
+import * as React7 from "react";
 
 // src/components/mfa-enrollment.ts
 function shouldDiscardSetup(args) {
@@ -756,12 +691,12 @@ function shouldDiscardSetup(args) {
 }
 
 // src/components/QrCode.tsx
-import * as React7 from "react";
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import * as React6 from "react";
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function QrCode({ value, size = 200 }) {
   const t = useT();
-  const [path, setPath] = React7.useState(null);
-  React7.useEffect(() => {
+  const [path, setPath] = React6.useState(null);
+  React6.useEffect(() => {
     let active = true;
     setPath(null);
     void import("./qr-ZNG4MAV5.js").then(
@@ -790,15 +725,15 @@ function QrCode({ value, size = 200 }) {
       shapeRendering: "crispEdges",
       className: "ba-qr",
       children: [
-        /* @__PURE__ */ jsx9("rect", { width: dim, height: dim, fill: "#ffffff" }),
-        /* @__PURE__ */ jsx9("g", { transform: `translate(${margin} ${margin})`, children: /* @__PURE__ */ jsx9("path", { d: path.d, fill: "#000000" }) })
+        /* @__PURE__ */ jsx8("rect", { width: dim, height: dim, fill: "#ffffff" }),
+        /* @__PURE__ */ jsx8("g", { transform: `translate(${margin} ${margin})`, children: /* @__PURE__ */ jsx8("path", { d: path.d, fill: "#000000" }) })
       ]
     }
   );
 }
 
 // src/components/MFAEnrollment.tsx
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function secretFromUri(uri) {
   try {
     return new URL(uri).searchParams.get("secret");
@@ -811,11 +746,11 @@ function MFAEnrollment({ onEnrolled, title }) {
   const { enable, verifyTotp } = useMFA();
   const { user, isLoaded } = useUser();
   const { pending, error, run } = useSubmitAction();
-  const [password, setPassword] = React8.useState("");
-  const [setup, setSetup] = React8.useState(null);
-  const [code, setCode] = React8.useState("");
-  const [done, setDone] = React8.useState(false);
-  const setupOwnerId = React8.useRef(null);
+  const [password, setPassword] = React7.useState("");
+  const [setup, setSetup] = React7.useState(null);
+  const [code, setCode] = React7.useState("");
+  const [done, setDone] = React7.useState(false);
+  const setupOwnerId = React7.useRef(null);
   const userId = user?.id ?? null;
   const stale = shouldDiscardSetup({
     isLoaded,
@@ -824,7 +759,7 @@ function MFAEnrollment({ onEnrolled, title }) {
     currentUserId: userId
   });
   const activeSetup = stale ? null : setup;
-  React8.useEffect(() => {
+  React7.useEffect(() => {
     if (stale) {
       setSetup(null);
       setPassword("");
@@ -833,18 +768,18 @@ function MFAEnrollment({ onEnrolled, title }) {
   }, [stale]);
   if (done) {
     return /* @__PURE__ */ jsxs9("div", { className: "ba-fields", "data-testid": "mfa-enroll-done", children: [
-      /* @__PURE__ */ jsx10("h2", { className: "ba-title", children: t("mfa.enroll.doneTitle") }),
-      /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: t("mfa.enroll.doneBody") })
+      /* @__PURE__ */ jsx9("h2", { className: "ba-title", children: t("mfa.enroll.doneTitle") }),
+      /* @__PURE__ */ jsx9("p", { className: "ba-muted", children: t("mfa.enroll.doneBody") })
     ] });
   }
   if (!activeSetup) {
     if (!isLoaded) {
-      return /* @__PURE__ */ jsx10("div", { className: "ba-fields", "data-testid": "mfa-enroll-loading", "aria-busy": "true", children: /* @__PURE__ */ jsx10("div", { className: "ba-skeleton" }) });
+      return /* @__PURE__ */ jsx9("div", { className: "ba-fields", "data-testid": "mfa-enroll-loading", "aria-busy": "true", children: /* @__PURE__ */ jsx9("div", { className: "ba-skeleton" }) });
     }
     if (user?.twoFactorEnabled) {
       return /* @__PURE__ */ jsxs9("div", { className: "ba-fields", "data-testid": "mfa-enroll-active", children: [
-        /* @__PURE__ */ jsx10("h2", { className: "ba-title", children: t("mfa.enroll.activeTitle") }),
-        /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: t("mfa.enroll.activeBody") })
+        /* @__PURE__ */ jsx9("h2", { className: "ba-title", children: t("mfa.enroll.activeTitle") }),
+        /* @__PURE__ */ jsx9("p", { className: "ba-muted", children: t("mfa.enroll.activeBody") })
       ] });
     }
     return /* @__PURE__ */ jsxs9(
@@ -864,11 +799,11 @@ function MFAEnrollment({ onEnrolled, title }) {
           });
         },
         children: [
-          title !== null && /* @__PURE__ */ jsx10("h2", { className: "ba-title", children: title ?? t("mfa.enroll.title") }),
-          /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: t("mfa.enroll.passwordHint") }),
+          title !== null && /* @__PURE__ */ jsx9("h2", { className: "ba-title", children: title ?? t("mfa.enroll.title") }),
+          /* @__PURE__ */ jsx9("p", { className: "ba-muted", children: t("mfa.enroll.passwordHint") }),
           /* @__PURE__ */ jsxs9("label", { className: "ba-label", children: [
             t("common.passwordLabel"),
-            /* @__PURE__ */ jsx10(
+            /* @__PURE__ */ jsx9(
               "input",
               {
                 className: "ba-input",
@@ -880,27 +815,27 @@ function MFAEnrollment({ onEnrolled, title }) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsx10(FormError, { children: error }),
-          /* @__PURE__ */ jsx10("button", { className: "ba-button", type: "submit", disabled: pending || !password, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx10(Busy, { busy: pending, label: t("mfa.enroll.startPending"), children: t("common.continue") }) })
+          /* @__PURE__ */ jsx9(FormError, { children: error }),
+          /* @__PURE__ */ jsx9("button", { className: "ba-button", type: "submit", disabled: pending || !password, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx9(Busy, { busy: pending, label: t("mfa.enroll.startPending"), children: t("common.continue") }) })
         ]
       }
     );
   }
   const secret = secretFromUri(activeSetup.totpURI);
   return /* @__PURE__ */ jsxs9("div", { className: "ba-fields", "data-testid": "mfa-enroll-verify", children: [
-    /* @__PURE__ */ jsx10("h2", { className: "ba-title", children: t("mfa.enroll.scanQrTitle") }),
-    /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: t("mfa.enroll.scanQrHint") }),
-    /* @__PURE__ */ jsx10(QrCode, { value: activeSetup.totpURI }),
-    secret && /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: richMessage(t("mfa.enroll.manualKey"), {
-      secret: /* @__PURE__ */ jsx10("code", { className: "ba-code", children: /* @__PURE__ */ jsx10(Bidi, { children: secret }) })
+    /* @__PURE__ */ jsx9("h2", { className: "ba-title", children: t("mfa.enroll.scanQrTitle") }),
+    /* @__PURE__ */ jsx9("p", { className: "ba-muted", children: t("mfa.enroll.scanQrHint") }),
+    /* @__PURE__ */ jsx9(QrCode, { value: activeSetup.totpURI }),
+    secret && /* @__PURE__ */ jsx9("p", { className: "ba-muted", children: richMessage(t("mfa.enroll.manualKey"), {
+      secret: /* @__PURE__ */ jsx9("code", { className: "ba-code", children: /* @__PURE__ */ jsx9(Bidi, { children: secret }) })
     }) }),
     /* @__PURE__ */ jsxs9("div", { children: [
       /* @__PURE__ */ jsxs9("p", { className: "ba-muted", children: [
-        /* @__PURE__ */ jsx10("strong", { children: t("mfa.enroll.backupCodesWarningStrong") }),
+        /* @__PURE__ */ jsx9("strong", { children: t("mfa.enroll.backupCodesWarningStrong") }),
         " ",
         t("mfa.enroll.backupCodesWarningRest")
       ] }),
-      /* @__PURE__ */ jsx10("ul", { className: "ba-backup-codes", "data-testid": "mfa-backup-codes", children: activeSetup.backupCodes.map((c) => /* @__PURE__ */ jsx10("li", { children: /* @__PURE__ */ jsx10("code", { className: "ba-code", children: c }) }, c)) })
+      /* @__PURE__ */ jsx9("ul", { className: "ba-backup-codes", "data-testid": "mfa-backup-codes", children: activeSetup.backupCodes.map((c) => /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsx9("code", { className: "ba-code", children: c }) }, c)) })
     ] }),
     /* @__PURE__ */ jsxs9(
       "form",
@@ -922,7 +857,7 @@ function MFAEnrollment({ onEnrolled, title }) {
         children: [
           /* @__PURE__ */ jsxs9("label", { className: "ba-label", children: [
             t("mfa.enroll.codeLabel"),
-            /* @__PURE__ */ jsx10(
+            /* @__PURE__ */ jsx9(
               "input",
               {
                 className: "ba-input",
@@ -934,8 +869,8 @@ function MFAEnrollment({ onEnrolled, title }) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsx10(FormError, { children: error }),
-          /* @__PURE__ */ jsx10("button", { className: "ba-button", type: "submit", disabled: pending || !code, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx10(Busy, { busy: pending, label: t("common.verifying"), children: t("mfa.enroll.activateSubmit") }) })
+          /* @__PURE__ */ jsx9(FormError, { children: error }),
+          /* @__PURE__ */ jsx9("button", { className: "ba-button", type: "submit", disabled: pending || !code, "aria-busy": pending || void 0, children: /* @__PURE__ */ jsx9(Busy, { busy: pending, label: t("common.verifying"), children: t("mfa.enroll.activateSubmit") }) })
         ]
       }
     )
@@ -943,13 +878,13 @@ function MFAEnrollment({ onEnrolled, title }) {
 }
 
 // src/components/mfa-enrollment-step.tsx
-import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function useConfirmedMfaPending(onUnknown = "pending") {
   const client = useAuthClient();
   const { needsMfaEnrollment } = useUser();
   const { refetch } = useSession();
-  const [confirmed, setConfirmed] = React9.useState(null);
-  React9.useEffect(() => {
+  const [confirmed, setConfirmed] = React8.useState(null);
+  React8.useEffect(() => {
     if (!needsMfaEnrollment) {
       setConfirmed(null);
       return;
@@ -974,22 +909,22 @@ function MfaEnrollmentStep({ title }) {
   const t = useT();
   const { refetch } = useSession();
   return /* @__PURE__ */ jsxs10(Fragment2, { children: [
-    /* @__PURE__ */ jsx11("h2", { className: "ba-title", children: title ?? t("mfaGate.title") }),
-    /* @__PURE__ */ jsx11("p", { className: "ba-muted", children: t("mfaGate.body") }),
-    /* @__PURE__ */ jsx11(MFAEnrollment, { onEnrolled: () => refetch({ query: { disableCookieCache: true } }) })
+    /* @__PURE__ */ jsx10("h2", { className: "ba-title", children: title ?? t("mfaGate.title") }),
+    /* @__PURE__ */ jsx10("p", { className: "ba-muted", children: t("mfaGate.body") }),
+    /* @__PURE__ */ jsx10(MFAEnrollment, { onEnrolled: () => refetch({ query: { disableCookieCache: true } }) })
   ] });
 }
 
 // src/components/AuthOwlBadge.tsx
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function OwlMark() {
   return /* @__PURE__ */ jsxs11("svg", { className: "ba-badge-mark", viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", children: [
-    /* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "11", fill: "#F5B84C" }),
-    /* @__PURE__ */ jsx12("circle", { cx: "8.4", cy: "10", r: "3", fill: "#fff" }),
-    /* @__PURE__ */ jsx12("circle", { cx: "15.6", cy: "10", r: "3", fill: "#fff" }),
-    /* @__PURE__ */ jsx12("circle", { cx: "8.4", cy: "10", r: "1.4", fill: "#1f1300" }),
-    /* @__PURE__ */ jsx12("circle", { cx: "15.6", cy: "10", r: "1.4", fill: "#1f1300" }),
-    /* @__PURE__ */ jsx12("path", { d: "M12 13.1l1.5 2.1h-3z", fill: "#1f1300" })
+    /* @__PURE__ */ jsx11("circle", { cx: "12", cy: "12", r: "11", fill: "#F5B84C" }),
+    /* @__PURE__ */ jsx11("circle", { cx: "8.4", cy: "10", r: "3", fill: "#fff" }),
+    /* @__PURE__ */ jsx11("circle", { cx: "15.6", cy: "10", r: "3", fill: "#fff" }),
+    /* @__PURE__ */ jsx11("circle", { cx: "8.4", cy: "10", r: "1.4", fill: "#1f1300" }),
+    /* @__PURE__ */ jsx11("circle", { cx: "15.6", cy: "10", r: "1.4", fill: "#1f1300" }),
+    /* @__PURE__ */ jsx11("path", { d: "M12 13.1l1.5 2.1h-3z", fill: "#1f1300" })
   ] });
 }
 function AuthOwlBadge({ href = "https://authowl.dev", force } = {}) {
@@ -1005,9 +940,9 @@ function AuthOwlBadge({ href = "https://authowl.dev", force } = {}) {
       rel: "noopener noreferrer",
       "data-testid": "authowl-badge",
       children: [
-        /* @__PURE__ */ jsx12(OwlMark, {}),
-        /* @__PURE__ */ jsx12("span", { children: richMessage(t("badge.securedBy"), {
-          brand: /* @__PURE__ */ jsx12("span", { className: "ba-badge-brand", children: "AuthOwl" })
+        /* @__PURE__ */ jsx11(OwlMark, {}),
+        /* @__PURE__ */ jsx11("span", { children: richMessage(t("badge.securedBy"), {
+          brand: /* @__PURE__ */ jsx11("span", { className: "ba-badge-brand", children: "AuthOwl" })
         }) })
       ]
     }
@@ -1022,19 +957,19 @@ import {
 } from "@authowl/core";
 
 // src/components/ConsentDocLinks.tsx
-import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 function ConsentDocLinks({ termsUrl, privacyUrl }) {
   const t = useT();
   if (!termsUrl && !privacyUrl) return null;
   return /* @__PURE__ */ jsxs12(Fragment3, { children: [
-    termsUrl && /* @__PURE__ */ jsx13("a", { href: termsUrl, target: "_blank", rel: "noopener noreferrer", children: t("consent.termsOfService") }),
+    termsUrl && /* @__PURE__ */ jsx12("a", { href: termsUrl, target: "_blank", rel: "noopener noreferrer", children: t("consent.termsOfService") }),
     termsUrl && privacyUrl && t("consent.docJoiner"),
-    privacyUrl && /* @__PURE__ */ jsx13("a", { href: privacyUrl, target: "_blank", rel: "noopener noreferrer", children: t("consent.privacyPolicy") })
+    privacyUrl && /* @__PURE__ */ jsx12("a", { href: privacyUrl, target: "_blank", rel: "noopener noreferrer", children: t("consent.privacyPolicy") })
   ] });
 }
 
 // src/components/LegalConsentCheckbox.tsx
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 function LegalConsentCheckbox({
   legal,
   accepted,
@@ -1045,7 +980,7 @@ function LegalConsentCheckbox({
   if (!legal.required) return null;
   return /* @__PURE__ */ jsxs13("label", { className: "ba-consent", "data-testid": testId, children: [
     /* @__PURE__ */ jsxs13("span", { className: "ba-checkbox-control", children: [
-      /* @__PURE__ */ jsx14(
+      /* @__PURE__ */ jsx13(
         "input",
         {
           className: "ba-checkbox",
@@ -1054,14 +989,69 @@ function LegalConsentCheckbox({
           onChange: (event) => onAcceptedChange(event.target.checked)
         }
       ),
-      /* @__PURE__ */ jsx14("span", { className: "ba-checkbox-visual", "aria-hidden": "true", children: /* @__PURE__ */ jsx14("span", { className: "ba-checkbox-check" }) })
+      /* @__PURE__ */ jsx13("span", { className: "ba-checkbox-visual", "aria-hidden": "true", children: /* @__PURE__ */ jsx13("span", { className: "ba-checkbox-check" }) })
     ] }),
-    /* @__PURE__ */ jsx14("span", { children: richMessage(t("signUp.consentLabel"), {
-      links: /* @__PURE__ */ jsx14(ConsentDocLinks, { termsUrl: legal.termsUrl, privacyUrl: legal.privacyUrl })
+    /* @__PURE__ */ jsx13("span", { children: richMessage(t("signUp.consentLabel"), {
+      links: /* @__PURE__ */ jsx13(ConsentDocLinks, { termsUrl: legal.termsUrl, privacyUrl: legal.privacyUrl })
     }) })
   ] });
 }
 
+// src/components/Turnstile.tsx
+import * as React9 from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var LOCAL_TURNSTILE_TEST_TOKEN = "XXXX.DUMMY.TOKEN.XXXX";
+async function loadTurnstile() {
+  const [{ loadCaptcha }, { CAPTCHA_ADAPTERS }] = await Promise.all([
+    import("./captcha-loader-VNULARCZ.js"),
+    import("./captcha-providers-STYFL25P.js")
+  ]);
+  const adapter = CAPTCHA_ADAPTERS.turnstile;
+  return { api: await loadCaptcha(adapter), adapter };
+}
+function Turnstile({
+  siteKey,
+  theme,
+  onToken,
+  onUnavailable
+}) {
+  const container = React9.useRef(null);
+  const callbacks = React9.useRef({ onToken, onUnavailable });
+  callbacks.current = { onToken, onUnavailable };
+  React9.useEffect(() => {
+    callbacks.current.onToken(null);
+    if (!siteKey) {
+      callbacks.current.onToken(LOCAL_TURNSTILE_TEST_TOKEN);
+      return;
+    }
+    let active = true;
+    let widget = null;
+    void loadTurnstile().then(({ api, adapter }) => {
+      if (!active || !container.current) return;
+      const id = api.render(container.current, {
+        sitekey: siteKey,
+        theme: theme === "system" ? "auto" : theme,
+        size: "flexible",
+        callback: (token) => callbacks.current.onToken(token),
+        "expired-callback": () => callbacks.current.onToken(null),
+        "error-callback": () => {
+          callbacks.current.onToken(null);
+          callbacks.current.onUnavailable();
+        }
+      });
+      widget = { api, adapter, id };
+    }).catch(() => {
+      if (active) callbacks.current.onUnavailable();
+    });
+    return () => {
+      active = false;
+      if (widget) widget.adapter.teardown(widget.api, widget.id);
+    };
+  }, [siteKey, theme]);
+  if (!siteKey) return null;
+  return /* @__PURE__ */ jsx14("div", { className: "ba-turnstile", ref: container, "data-testid": "phoneotp-turnstile" });
+}
+
 // src/components/PhoneOTP.tsx
 import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 function PhoneOTP({
@@ -3449,9 +3439,9 @@ function formatSessionTime(date, locale) {
 
 // src/components/user-profile/use-account-resource.ts
 import * as React32 from "react";
-function useAccountResource(loader2, failure) {
-  const loaderRef = React32.useRef(loader2);
-  loaderRef.current = loader2;
+function useAccountResource(loader, failure) {
+  const loaderRef = React32.useRef(loader);
+  loaderRef.current = loader;
   const failureRef = React32.useRef(failure);
   failureRef.current = failure;
   const toServerError = useServerError();