@dynamic-labs/sdk-react-core 5.0.0-rc.0 → 5.0.0-rc.1

package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.js

@@ -6,6 +6,7 @@ import { SocialOAuthErrorCode } from '@dynamic-labs/types';
 import { SocialAccountAlreadyExistsError, tracing, PlatformService, isMobile, Oauth2Service, DynamicError } from '@dynamic-labs/utils';
 import { getDynamicClient } from '../../../client/client.js';
 import { useCaptchaContext } from '../../../context/CaptchaContext/CaptchaContext.js';
+import { isCaptchaEnabled } from '../../captcha.js';
 import '../../../context/DynamicContext/useDynamicContext/useDynamicContext.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 import { useErrorContext } from '../../../context/ErrorContext/ErrorContext.js';
@@ -68,7 +69,7 @@ const socialProviders = [
 const providersRequiringPkce = ['twitter', 'github'];
 // Hook to handle common social auth logic (for social linking and social sign in)
 const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
-    var _a, _b, _c;
+    var _a, _b;
     const { environmentId, setShowAuthFlow, socialSettings, projectSettings, redirectUrl: defaultRedirectUrl, } = useInternalDynamicContext();
     /**
      * Represents if the SDK will use a popup or redirect for social auth
@@ -145,7 +146,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             verifyFunction: () => apiCall(),
         });
     }), [handleError, initAuth$1, onSettled]);
-    const completeConnection = useCallback((_d) => __awaiter(void 0, [_d], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, ssoProviderId, requestedScopes, }) {
+    const completeConnection = useCallback((_c) => __awaiter(void 0, [_c], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, ssoProviderId, requestedScopes, }) {
         try {
             if (authMode === 'signin') {
                 // Warm the embedded-wallet iframe connection at sign-in start
@@ -239,7 +240,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectWithFarcaster = useCallback((authMode_1, _e) => __awaiter(void 0, [authMode_1, _e], void 0, function* (authMode, { captchaToken, redirectUrl }) {
+    const connectWithFarcaster = useCallback((authMode_1, _d) => __awaiter(void 0, [authMode_1, _d], void 0, function* (authMode, { captchaToken, redirectUrl }) {
         let dynamicNonce;
         try {
             dynamicNonce = consumeNonce();
@@ -331,8 +332,8 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectSocialAccount = useCallback((_f) => __awaiter(void 0, [_f], void 0, function* ({ authMode, provider, validator, captchaToken, isHeadlessSocialSignIn, payingWithDynamic, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, forcePopup, ssoProviderId, requestedScopes, }) {
-        var _g, _h, _j, _k, _l;
+    const connectSocialAccount = useCallback((_e) => __awaiter(void 0, [_e], void 0, function* ({ authMode, provider, validator, captchaToken, isHeadlessSocialSignIn, payingWithDynamic, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, forcePopup, ssoProviderId, requestedScopes, }) {
+        var _f, _g, _h, _j, _k;
         clearError();
         setIsProcessing(true);
         if (!authMode) {
@@ -373,8 +374,8 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             state,
             triggerFundFromExchangeOnSuccess,
         });
-        const isGoogleDriveBackupEnabled = (_j = (_h = (_g = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _g === void 0 ? void 0 : _g.waas) === null || _h === void 0 ? void 0 : _h.backupOptions) === null || _j === void 0 ? void 0 : _j.includes(WaasBackupOptionsEnum.GoogleDrive);
-        const loginUrlString = getOauthLoginUrl((_k = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _k !== void 0 ? _k : [], provider, { isGoogleDriveBackupEnabled });
+        const isGoogleDriveBackupEnabled = (_h = (_g = (_f = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _f === void 0 ? void 0 : _f.waas) === null || _g === void 0 ? void 0 : _g.backupOptions) === null || _h === void 0 ? void 0 : _h.includes(WaasBackupOptionsEnum.GoogleDrive);
+        const loginUrlString = getOauthLoginUrl((_j = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _j !== void 0 ? _j : [], provider, { isGoogleDriveBackupEnabled });
         if (!loginUrlString) {
             handleError(provider, SocialOAuthErrorCode.NO_OAUTH_URL, `Failed to get login url to connect social account: ${provider}`, { raiseAuthFailure: authMode === 'signin' });
             return;
@@ -389,9 +390,15 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         }
         const isMobile$1 = isMobile();
         try {
-            const effectiveStrategy = authMode === 'stepup' || forcePopup ? 'popup' : strategy;
+            // Step-up normally forces a popup, but on mobile browsers popups
+            // opened after an async gap (e.g. captcha verification) lose user
+            // activation and are blocked (notably iOS Safari). Fall back to the
+            // configured strategy (redirect) on mobile so the flow can resume.
+            const effectiveStrategy = (authMode === 'stepup' && !isMobile$1) || forcePopup
+                ? 'popup'
+                : strategy;
             const authCode = yield Oauth2Service.getOauthCode({
-                apiProvider: getProviderByType((_l = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _l !== void 0 ? _l : [], provider),
+                apiProvider: getProviderByType((_k = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _k !== void 0 ? _k : [], provider),
                 getOAuthResultFromApi: () => getOAuthResult(environmentId, provider, {
                     state,
                 }),
@@ -449,7 +456,6 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         strategy,
     ]);
     const checkCaptchaAndConnect = useCallback((props) => __awaiter(void 0, void 0, void 0, function* () {
-        var _m;
         if (props.authMode === 'signin' && getDynamicClient().user) {
             throw new DynamicError('User is already logged in', 'user_is_already_logged_in');
         }
@@ -457,7 +463,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             !getDynamicClient().user) {
             throw new DynamicError('User is not logged in', 'user_is_not_logged_in');
         }
-        if (!((_m = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _m === void 0 ? void 0 : _m.enabled)) {
+        if (!isCaptchaEnabled(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security)) {
             yield connectSocialAccount(props);
             return;
         }
@@ -469,6 +475,17 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         });
         engageCaptcha({
             authMethod: 'social',
+            // Backing out of the captcha view abandons onCaptchaSuccess, so the
+            // social flow must settle here — otherwise the social-redirect-view
+            // beneath it spins forever waiting for a connection that never starts
+            onCaptchaCancel: () => {
+                onFailed(props.provider, {
+                    error: {
+                        code: SocialOAuthErrorCode.USER_CANCELLED,
+                        message: 'User cancelled connection',
+                    },
+                }, { raiseAuthFailure: true });
+            },
             onCaptchaSuccess: (captchaToken) => __awaiter(void 0, void 0, void 0, function* () {
                 yield connectSocialAccount(Object.assign(Object.assign({}, props), { captchaToken }));
                 setShowAuthFlow(false);
@@ -478,7 +495,8 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         setShowAuthFlow,
         connectSocialAccount,
         engageCaptcha,
-        (_c = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _c === void 0 ? void 0 : _c.enabled,
+        onFailed,
+        projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security,
     ]);
     return useMemo(() => ({
         checkValidProvider,

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpAuthentication.cjs

@@ -34,11 +34,18 @@ var usePromptStepUpAuth = require('./usePromptStepUpAuth.cjs');
  *   wallet to use. For OTP, must be an email or SMS credential. Defaults to the
  *   first sign-in enabled email or SMS credential on the authenticated user.
  *
+ * When captcha is enabled for the environment, `sendOtp()` does not send
+ * immediately: it sets `state.captchaRequired` to `true` and returns `null`.
+ * The UI must collect a captcha token and call `submitCaptchaToken(token)`,
+ * which supplies the token to the headless client and completes the send.
+ *
  * @example
  * ```tsx
  * // OTP flow
- * const { sendOtp, verifyOtp } = useStepUpAuthentication();
+ * const { sendOtp, submitCaptchaToken, verifyOtp, state } = useStepUpAuthentication();
  * await sendOtp();
+ * // if captcha is required, state.captchaRequired is true — after solving it:
+ * if (state.captchaRequired) await submitCaptchaToken(captchaToken);
  * const result = await verifyOtp({ verificationToken: '123456', requestedScopes: ['wallet:export'] });
  *
  * // Passkey MFA flow
@@ -52,7 +59,7 @@ var usePromptStepUpAuth = require('./usePromptStepUpAuth.cjs');
  */
 const useStepUpAuthentication = ({ credentialId, } = {}) => {
     const stateActions = useStepUpState.useStepUpState();
-    const { resetOtpRef, sendOtp, verifyOtp } = useStepUpOtp.useStepUpOtp({
+    const { resetOtpRef, sendOtp, submitCaptchaToken, verifyOtp } = useStepUpOtp.useStepUpOtp({
         credentialId,
         stateActions,
     });
@@ -91,6 +98,7 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
         resetState,
         sendOtp,
         state: stateActions.state,
+        submitCaptchaToken,
         verifyOtp,
         verifyPasskeyMfa,
         verifyRecoveryCode,

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpAuthentication.d.ts

@@ -18,11 +18,18 @@ import type { UseStepUpAuthenticationParams, UseStepUpAuthenticationReturn } fro
  *   wallet to use. For OTP, must be an email or SMS credential. Defaults to the
  *   first sign-in enabled email or SMS credential on the authenticated user.
  *
+ * When captcha is enabled for the environment, `sendOtp()` does not send
+ * immediately: it sets `state.captchaRequired` to `true` and returns `null`.
+ * The UI must collect a captcha token and call `submitCaptchaToken(token)`,
+ * which supplies the token to the headless client and completes the send.
+ *
  * @example
  * ```tsx
  * // OTP flow
- * const { sendOtp, verifyOtp } = useStepUpAuthentication();
+ * const { sendOtp, submitCaptchaToken, verifyOtp, state } = useStepUpAuthentication();
  * await sendOtp();
+ * // if captcha is required, state.captchaRequired is true — after solving it:
+ * if (state.captchaRequired) await submitCaptchaToken(captchaToken);
  * const result = await verifyOtp({ verificationToken: '123456', requestedScopes: ['wallet:export'] });
  *
  * // Passkey MFA flow

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpAuthentication.js

@@ -30,11 +30,18 @@ import { usePromptStepUpAuth } from './usePromptStepUpAuth.js';
  *   wallet to use. For OTP, must be an email or SMS credential. Defaults to the
  *   first sign-in enabled email or SMS credential on the authenticated user.
  *
+ * When captcha is enabled for the environment, `sendOtp()` does not send
+ * immediately: it sets `state.captchaRequired` to `true` and returns `null`.
+ * The UI must collect a captcha token and call `submitCaptchaToken(token)`,
+ * which supplies the token to the headless client and completes the send.
+ *
  * @example
  * ```tsx
  * // OTP flow
- * const { sendOtp, verifyOtp } = useStepUpAuthentication();
+ * const { sendOtp, submitCaptchaToken, verifyOtp, state } = useStepUpAuthentication();
  * await sendOtp();
+ * // if captcha is required, state.captchaRequired is true — after solving it:
+ * if (state.captchaRequired) await submitCaptchaToken(captchaToken);
  * const result = await verifyOtp({ verificationToken: '123456', requestedScopes: ['wallet:export'] });
  *
  * // Passkey MFA flow
@@ -48,7 +55,7 @@ import { usePromptStepUpAuth } from './usePromptStepUpAuth.js';
  */
 const useStepUpAuthentication = ({ credentialId, } = {}) => {
     const stateActions = useStepUpState();
-    const { resetOtpRef, sendOtp, verifyOtp } = useStepUpOtp({
+    const { resetOtpRef, sendOtp, submitCaptchaToken, verifyOtp } = useStepUpOtp({
         credentialId,
         stateActions,
     });
@@ -87,6 +94,7 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
         resetState,
         sendOtp,
         state: stateActions.state,
+        submitCaptchaToken,
         verifyOtp,
         verifyPasskeyMfa,
         verifyRecoveryCode,

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpAuthentication.types.d.ts

@@ -1,6 +1,7 @@
 import type { checkStepUpAuth, OTPVerification } from '@dynamic-labs-sdk/client';
 import type { ProviderEnum, TokenScope, VerifyResponse } from '@dynamic-labs/sdk-api-core';
 export type StepUpAuthenticationState = {
+    captchaRequired: boolean;
     error: string | null;
     isLoading: boolean;
     otpVerification: OTPVerification | null;
@@ -59,6 +60,7 @@ export type UseStepUpAuthenticationReturn = {
     resetState: () => void;
     sendOtp: (params?: SendOtpParams) => Promise<OTPVerification | null>;
     state: StepUpAuthenticationState;
+    submitCaptchaToken: (captchaToken: string) => Promise<OTPVerification | null>;
     verifyOtp: (params: VerifyOtpParams) => Promise<VerifyResponse | null>;
     verifyPasskeyMfa: (params: VerifyPasskeyMfaParams) => Promise<VerifyResponse | null>;
     verifyRecoveryCode: (params: VerifyRecoveryCodeParams) => Promise<VerifyResponse | null>;

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpOtp.cjs

@@ -67,8 +67,24 @@ const dispatchOtp = (credential) => _tslib.__awaiter(void 0, void 0, void 0, fun
 });
 const useStepUpOtp = ({ credentialId, stateActions, }) => {
     const user = useUser.useUser();
-    const { setError, setLoading, setSuccess } = stateActions;
+    const { setError, setLoading, setState, setSuccess } = stateActions;
     const otpVerificationRef = React.useRef(null);
+    // Holds the credential whose OTP send is blocked awaiting a captcha token.
+    const pendingCaptchaCredentialRef = React.useRef(null);
+    const dispatchAndStoreOtp = React.useCallback((credential) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        setLoading();
+        try {
+            const otpVerification = yield dispatchOtp(credential);
+            otpVerificationRef.current = otpVerification;
+            setSuccess({ otpVerification });
+            return otpVerification;
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Failed to send OTP';
+            setError(errorMessage);
+            return null;
+        }
+    }), [setError, setLoading, setSuccess]);
     const sendOtp = React.useCallback((params) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
         const credentials = user === null || user === void 0 ? void 0 : user.verifiedCredentials;
@@ -86,19 +102,32 @@ const useStepUpOtp = ({ credentialId, stateActions, }) => {
             setError(`Credential format "${result.format}" does not support OTP verification. Only email and SMS credentials are supported`);
             return null;
         }
-        setLoading();
-        try {
-            const otpVerification = yield dispatchOtp(result);
-            otpVerificationRef.current = otpVerification;
-            setSuccess({ otpVerification });
-            return otpVerification;
+        // The headless client consumes a captcha token when sending an OTP for
+        // captcha-enabled environments. Defer the send and surface the challenge
+        // to the UI, which collects a token and completes it via submitCaptchaToken.
+        if (client.isCaptchaRequired()) {
+            pendingCaptchaCredentialRef.current = result;
+            setState((prev) => (Object.assign(Object.assign({}, prev), { captchaRequired: true, error: null })));
+            return null;
         }
-        catch (error) {
-            const errorMessage = error instanceof Error ? error.message : 'Failed to send OTP';
-            setError(errorMessage);
+        return dispatchAndStoreOtp(result);
+    }), [
+        credentialId,
+        dispatchAndStoreOtp,
+        setError,
+        setState,
+        user === null || user === void 0 ? void 0 : user.verifiedCredentials,
+    ]);
+    const submitCaptchaToken = React.useCallback((captchaToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        const credential = pendingCaptchaCredentialRef.current;
+        if (!credential) {
             return null;
         }
-    }), [credentialId, setError, setLoading, setSuccess, user === null || user === void 0 ? void 0 : user.verifiedCredentials]);
+        pendingCaptchaCredentialRef.current = null;
+        client.setCaptchaToken({ captchaToken });
+        setState((prev) => (Object.assign(Object.assign({}, prev), { captchaRequired: false })));
+        return dispatchAndStoreOtp(credential);
+    }), [dispatchAndStoreOtp, setState]);
     const verifyOtp = React.useCallback((_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ requestedScopes, verificationToken, }) {
         const otpVerification = otpVerificationRef.current;
         if (!otpVerification) {
@@ -123,8 +152,9 @@ const useStepUpOtp = ({ credentialId, stateActions, }) => {
     }), [setError, setLoading, setSuccess]);
     const resetOtpRef = React.useCallback(() => {
         otpVerificationRef.current = null;
+        pendingCaptchaCredentialRef.current = null;
     }, []);
-    return { resetOtpRef, sendOtp, verifyOtp };
+    return { resetOtpRef, sendOtp, submitCaptchaToken, verifyOtp };
 };
 
 exports.useStepUpOtp = useStepUpOtp;

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpOtp.d.ts

@@ -10,6 +10,7 @@ type UseStepUpOtpParams = {
 export declare const useStepUpOtp: ({ credentialId, stateActions, }: UseStepUpOtpParams) => {
     resetOtpRef: () => void;
     sendOtp: (params?: SendOtpParams) => Promise<OTPVerification | null>;
+    submitCaptchaToken: (captchaToken: string) => Promise<OTPVerification | null>;
     verifyOtp: ({ requestedScopes, verificationToken, }: VerifyOtpParams) => Promise<VerifyResponse | null>;
 };
 export {};

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpOtp.js

@@ -1,7 +1,7 @@
 'use client'
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useRef, useCallback } from 'react';
-import { verifyOTP, sendEmailOTP, supportedCountries, sendSmsOTP } from '@dynamic-labs-sdk/client';
+import { isCaptchaRequired, setCaptchaToken, verifyOTP, sendEmailOTP, supportedCountries, sendSmsOTP } from '@dynamic-labs-sdk/client';
 import { JwtVerifiedCredentialFormatEnum } from '@dynamic-labs/sdk-api-core';
 import '@dynamic-labs-sdk/client/core';
 import 'eventemitter3';
@@ -63,8 +63,24 @@ const dispatchOtp = (credential) => __awaiter(void 0, void 0, void 0, function*
 });
 const useStepUpOtp = ({ credentialId, stateActions, }) => {
     const user = useUser();
-    const { setError, setLoading, setSuccess } = stateActions;
+    const { setError, setLoading, setState, setSuccess } = stateActions;
     const otpVerificationRef = useRef(null);
+    // Holds the credential whose OTP send is blocked awaiting a captcha token.
+    const pendingCaptchaCredentialRef = useRef(null);
+    const dispatchAndStoreOtp = useCallback((credential) => __awaiter(void 0, void 0, void 0, function* () {
+        setLoading();
+        try {
+            const otpVerification = yield dispatchOtp(credential);
+            otpVerificationRef.current = otpVerification;
+            setSuccess({ otpVerification });
+            return otpVerification;
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Failed to send OTP';
+            setError(errorMessage);
+            return null;
+        }
+    }), [setError, setLoading, setSuccess]);
     const sendOtp = useCallback((params) => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
         const credentials = user === null || user === void 0 ? void 0 : user.verifiedCredentials;
@@ -82,19 +98,32 @@ const useStepUpOtp = ({ credentialId, stateActions, }) => {
             setError(`Credential format "${result.format}" does not support OTP verification. Only email and SMS credentials are supported`);
             return null;
         }
-        setLoading();
-        try {
-            const otpVerification = yield dispatchOtp(result);
-            otpVerificationRef.current = otpVerification;
-            setSuccess({ otpVerification });
-            return otpVerification;
+        // The headless client consumes a captcha token when sending an OTP for
+        // captcha-enabled environments. Defer the send and surface the challenge
+        // to the UI, which collects a token and completes it via submitCaptchaToken.
+        if (isCaptchaRequired()) {
+            pendingCaptchaCredentialRef.current = result;
+            setState((prev) => (Object.assign(Object.assign({}, prev), { captchaRequired: true, error: null })));
+            return null;
         }
-        catch (error) {
-            const errorMessage = error instanceof Error ? error.message : 'Failed to send OTP';
-            setError(errorMessage);
+        return dispatchAndStoreOtp(result);
+    }), [
+        credentialId,
+        dispatchAndStoreOtp,
+        setError,
+        setState,
+        user === null || user === void 0 ? void 0 : user.verifiedCredentials,
+    ]);
+    const submitCaptchaToken = useCallback((captchaToken) => __awaiter(void 0, void 0, void 0, function* () {
+        const credential = pendingCaptchaCredentialRef.current;
+        if (!credential) {
             return null;
         }
-    }), [credentialId, setError, setLoading, setSuccess, user === null || user === void 0 ? void 0 : user.verifiedCredentials]);
+        pendingCaptchaCredentialRef.current = null;
+        setCaptchaToken({ captchaToken });
+        setState((prev) => (Object.assign(Object.assign({}, prev), { captchaRequired: false })));
+        return dispatchAndStoreOtp(credential);
+    }), [dispatchAndStoreOtp, setState]);
     const verifyOtp = useCallback((_b) => __awaiter(void 0, [_b], void 0, function* ({ requestedScopes, verificationToken, }) {
         const otpVerification = otpVerificationRef.current;
         if (!otpVerification) {
@@ -119,8 +148,9 @@ const useStepUpOtp = ({ credentialId, stateActions, }) => {
     }), [setError, setLoading, setSuccess]);
     const resetOtpRef = useCallback(() => {
         otpVerificationRef.current = null;
+        pendingCaptchaCredentialRef.current = null;
     }, []);
-    return { resetOtpRef, sendOtp, verifyOtp };
+    return { resetOtpRef, sendOtp, submitCaptchaToken, verifyOtp };
 };
 
 export { useStepUpOtp };

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpState.cjs

@@ -33,6 +33,7 @@ require('../../../events/dynamicEvents.cjs');
 var useUser = require('../../../client/extension/user/useUser/useUser.cjs');
 
 const INITIAL_STATE = {
+    captchaRequired: false,
     error: null,
     isLoading: false,
     otpVerification: null,

package/src/lib/utils/hooks/useStepUpAuthentication/useStepUpState.js

@@ -29,6 +29,7 @@ import '../../../events/dynamicEvents.js';
 import { useUser } from '../../../client/extension/user/useUser/useUser.js';
 
 const INITIAL_STATE = {
+    captchaRequired: false,
     error: null,
     isLoading: false,
     otpVerification: null,

package/src/lib/utils/hooks/useSubmitExchangeFunding/useSubmitExchangeFunding.cjs

@@ -44,16 +44,13 @@ require('../../../store/state/authMode/authMode.cjs');
 require('../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 require('../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
-require('../../functions/compareChains/compareChains.cjs');
-require('../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs');
 require('../../../context/ThemeContext/ThemeContext.cjs');
+require('../../functions/compareChains/compareChains.cjs');
 require('../useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('bs58');
 require('@dynamic-labs/types');
 require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../context/LoadingContext/LoadingContext.cjs');
-require('../../../context/WalletContext/WalletContext.cjs');
-require('../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
 require('yup');
 require('../../../context/MockContext/MockContext.cjs');
 require('../../../views/CollectUserDataView/useFields.cjs');
@@ -71,9 +68,11 @@ require('../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget
 require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
+require('../../../context/WalletContext/WalletContext.cjs');
 var DynamicWidgetContext = require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../components/IconButton/IconButton.cjs');
 require('../useGetMfaToken/useGetMfaToken.cjs');
+require('../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs');
 require('../useWalletDelegation/DelegationError.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('formik');
@@ -97,10 +96,11 @@ require('qrcode');
 require('../../../widgets/DynamicWidget/views/ManagePasskeysMfaWidgetView/ManagePasskeysMfaWidgetView.cjs');
 require('../../../widgets/DynamicWidget/views/ManageTotpMfaWidgetView/ManageTotpMfaWidgetView.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
+require('@hcaptcha/react-hcaptcha');
+require('@marsidev/react-turnstile');
 require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
-require('@hcaptcha/react-hcaptcha');
 require('../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');

package/src/lib/utils/hooks/useSubmitExchangeFunding/useSubmitExchangeFunding.js

@@ -40,16 +40,13 @@ import '../../../store/state/authMode/authMode.js';
 import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
-import '../../functions/compareChains/compareChains.js';
-import '../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js';
 import '../../../context/ThemeContext/ThemeContext.js';
+import '../../functions/compareChains/compareChains.js';
 import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
 import 'bs58';
 import '@dynamic-labs/types';
 import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../context/LoadingContext/LoadingContext.js';
-import '../../../context/WalletContext/WalletContext.js';
-import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
 import 'yup';
 import '../../../context/MockContext/MockContext.js';
 import '../../../views/CollectUserDataView/useFields.js';
@@ -67,9 +64,11 @@ import '../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.
 import '../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
+import '../../../context/WalletContext/WalletContext.js';
 import { useWidgetContext } from '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../components/IconButton/IconButton.js';
 import '../useGetMfaToken/useGetMfaToken.js';
+import '../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js';
 import '../useWalletDelegation/DelegationError.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';
 import 'formik';
@@ -93,10 +92,11 @@ import 'qrcode';
 import '../../../widgets/DynamicWidget/views/ManagePasskeysMfaWidgetView/ManagePasskeysMfaWidgetView.js';
 import '../../../widgets/DynamicWidget/views/ManageTotpMfaWidgetView/ManageTotpMfaWidgetView.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
+import '@hcaptcha/react-hcaptcha';
+import '@marsidev/react-turnstile';
 import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
 import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
-import '@hcaptcha/react-hcaptcha';
 import '../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';

package/src/lib/utils/hooks/useSwitchWallet/useSwitchWallet.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var React = require('react');
+var utils = require('@dynamic-labs/utils');
 var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 require('../../../context/DynamicContext/useDynamicContext/useDynamicContext.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
@@ -49,6 +50,19 @@ const useSwitchWallet = () => {
         if (!wallet.connector.isAvailable) {
             throw new Error("Cannot make this wallet active, since this wallet doesn't have a compatible connector on this device.");
         }
+        // On mobile, an in-app-browser wallet that isn't injected on the current
+        // browser (e.g. switching to a linked Phantom on mobile web) has no
+        // provider to sign with. Trigger the wallet's in-app-browser redirect up
+        // front so the user lands inside the wallet app, instead of the switch
+        // silently succeeding and every later signature failing. The connector
+        // self-gates: this is a no-op for installed, embedded, or redirect-only
+        // wallets.
+        if (utils.isMobile()) {
+            const didOpenInAppBrowser = wallet.connector.openInAppBrowserIfRequired();
+            if (didOpenInAppBrowser) {
+                return;
+            }
+        }
         const eoaWallet = getEOAWallet(wallet);
         if (eoaWallet && walletConnectorCore.isTurnkeyWalletConnector(eoaWallet.connector)) {
             const sortedVcs = (_b = (_a = eoaWallet.connector) === null || _a === void 0 ? void 0 : _a.verifiedCredentials) === null || _b === void 0 ? void 0 : _b.reduce((acc, vc) => {

package/src/lib/utils/hooks/useSwitchWallet/useSwitchWallet.js

@@ -1,6 +1,7 @@
 'use client'
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useCallback } from 'react';
+import { isMobile } from '@dynamic-labs/utils';
 import { isTurnkeyWalletConnector, isEmailWalletConnector } from '@dynamic-labs/wallet-connector-core';
 import '../../../context/DynamicContext/useDynamicContext/useDynamicContext.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
@@ -45,6 +46,19 @@ const useSwitchWallet = () => {
         if (!wallet.connector.isAvailable) {
             throw new Error("Cannot make this wallet active, since this wallet doesn't have a compatible connector on this device.");
         }
+        // On mobile, an in-app-browser wallet that isn't injected on the current
+        // browser (e.g. switching to a linked Phantom on mobile web) has no
+        // provider to sign with. Trigger the wallet's in-app-browser redirect up
+        // front so the user lands inside the wallet app, instead of the switch
+        // silently succeeding and every later signature failing. The connector
+        // self-gates: this is a no-op for installed, embedded, or redirect-only
+        // wallets.
+        if (isMobile()) {
+            const didOpenInAppBrowser = wallet.connector.openInAppBrowserIfRequired();
+            if (didOpenInAppBrowser) {
+                return;
+            }
+        }
         const eoaWallet = getEOAWallet(wallet);
         if (eoaWallet && isTurnkeyWalletConnector(eoaWallet.connector)) {
             const sortedVcs = (_b = (_a = eoaWallet.connector) === null || _a === void 0 ? void 0 : _a.verifiedCredentials) === null || _b === void 0 ? void 0 : _b.reduce((acc, vc) => {