@dynamic-labs/sdk-react-core 4.67.0 → 4.67.2

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

@@ -1,191 +1,20 @@
 'use client'
-import { __awaiter } from '../../../../../_virtual/_tslib.js';
-import { useCallback } from 'react';
-import { onEvent } from '@dynamic-labs-sdk/client';
-import { MFADeviceType } from '@dynamic-labs/sdk-api-core';
-import { DeferredPromise } from '@dynamic-labs/utils';
-import { useGetUserMfaMethods } from '../useGetUserMfaMethods/useGetUserMfaMethods.js';
-import { useViewContext } from '../../../context/ViewContext/ViewContext.js';
-import '../../../context/DynamicContext/DynamicContext.js';
-import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
-import '@dynamic-labs/iconic';
-import '@dynamic-labs/wallet-connector-core';
-import 'react/jsx-runtime';
-import '../../../shared/logger.js';
-import '@dynamic-labs/wallet-book';
-import '../../constants/colors.js';
-import '../../constants/values.js';
-import '../../../shared/consts/index.js';
-import { dynamicEvents } from '../../../events/dynamicEvents.js';
-import '../../../context/CaptchaContext/CaptchaContext.js';
-import '../../../context/ErrorContext/ErrorContext.js';
-import '@dynamic-labs/multi-wallet';
-import 'react-international-phone';
-import '../../../store/state/nonce/nonce.js';
-import '@dynamic-labs-sdk/client/core';
-import { useDynamicClient } from '../../../client/client.js';
-import '../../../config/ApiEndpoint.js';
-import '@dynamic-labs/locale';
-import '../../../store/state/dynamicContextProps/dynamicContextProps.js';
-import '../../../store/state/primaryWalletId/primaryWalletId.js';
-import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
-import '../../functions/getWaasAddressTypeLabel/getWaasAddressTypeLabel.js';
-import '../../../context/AccessDeniedContext/AccessDeniedContext.js';
-import '../../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../../context/UserWalletsContext/UserWalletsContext.js';
-import '../../../store/state/authMode/authMode.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 '../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';
-import '../../../context/FieldsStateContext/FieldsStateContext.js';
-import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
-import '@dynamic-labs/rpc-providers';
-import '../../../store/state/walletOptions/walletOptions.js';
-import 'react-i18next';
-import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
-import '../../../components/Alert/Alert.js';
-import '../../../components/ShadowDOM/ShadowDOM.js';
-import '../../../components/IconButton/IconButton.js';
-import '../../../components/InlineWidget/InlineWidget.js';
-import '../../../components/Input/Input.js';
-import '../../../components/IsBrowser/IsBrowser.js';
-import '../../../components/MenuList/Dropdown/Dropdown.js';
-import '../../../components/OverlayCard/OverlayCard.js';
-import '../../../components/Transition/ZoomTransition/ZoomTransition.js';
-import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
-import '../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../../components/Popper/Popper/Popper.js';
-import '../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
-import 'qrcode';
-import 'formik';
-import '../useSubdomainCheck/useSubdomainCheck.js';
-import '../../../context/WalletGroupContext/WalletGroupContext.js';
-import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
-import '../useWalletBackup/useWalletBackup.js';
-import '../useWalletBackup/types.js';
-import '../useWalletBackup/cloudProviders.js';
-import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
-import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
-import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
-import '@hcaptcha/react-hcaptcha';
-import '../../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js';
-import '../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
-import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
-import '../../../context/FooterAnimationContext/index.js';
-import '../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
-import '../../../context/PasskeyContext/PasskeyContext.js';
-import '../../../context/OnrampContext/OnrampContext.js';
-import '../../../store/state/sendBalances.js';
-import '../../../store/state/connectorsInitializing/connectorsInitializing.js';
-import '../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
-import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import '../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
-import '../../../widgets/DynamicWidget/components/PasskeyCard/PasskeyCard.js';
-import '../../../widgets/DynamicWidget/views/CryptoComOnramp/CryptoComOnramp.js';
-import '../../../../index.js';
-import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
-import '../../../store/state/tokenBalances.js';
-import '../../../store/state/multichainBalances.js';
-import { useAuthenticatePasskeyMFA } from '../useAuthenticatePasskeyMFA/useAuthenticatePasskeyMFA.js';
-import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
-import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
+import { useStepUpAuthentication } from '../useStepUpAuthentication/useStepUpAuthentication.js';
 
+/**
+ * Opens the Dynamic MFA modal (passkey or TOTP) and resolves when the user completes MFA.
+ *
+ * @deprecated Use `useStepUpAuthentication().promptMfa()` instead. Step-up authentication
+ * is the generic category; MFA is one verification method. The `promptMfa` method on
+ * `useStepUpAuthentication` provides the same behavior. This hook will be removed in the
+ * next major version.
+ *
+ * @returns A function that opens the MFA flow and returns a promise resolving to the
+ *   MFA token (or `undefined` when using `requestedScopes` — use `getElevatedAccessToken({ scope })` after completion).
+ */
 const usePromptMfaAuth = () => {
-    const { setShowAuthFlow } = useInternalDynamicContext();
-    const { pushView } = useViewContext();
-    const getUserMfaMethods = useGetUserMfaMethods();
-    const authenticatePasskeyMFA = useAuthenticatePasskeyMFA();
-    const dynamicClient = useDynamicClient();
-    const promptMfaAuth = useCallback((props) => __awaiter(void 0, void 0, void 0, function* () {
-        const methods = yield getUserMfaMethods();
-        const allMethods = [
-            ...methods.passkeys.map((passkey) => (Object.assign(Object.assign({}, passkey), { type: MFADeviceType.Passkey }))),
-            ...methods.devices.map((device) => (Object.assign(Object.assign({}, device), { type: MFADeviceType.Totp }))),
-        ];
-        if (!methods.userHasVerifiedMfaMethods || allMethods.length === 0) {
-            setShowAuthFlow(true);
-            pushView('mfa-choose-device', {
-                createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
-            });
-            return;
-        }
-        const lastCreatedMethod = allMethods.reduce((a, b) => {
-            if (a.createdAt && b.createdAt) {
-                return a.createdAt >= b.createdAt ? a : b;
-            }
-            if (b.createdAt) {
-                return b;
-            }
-            return a;
-        });
-        switch (lastCreatedMethod.type) {
-            case MFADeviceType.Passkey: {
-                const createMfaTokenOptions = (props === null || props === void 0 ? void 0 : props.createMfaToken)
-                    ? { singleUse: true }
-                    : undefined;
-                // we're calling authenticatePasskeyMFA here because we don't want
-                // it to be called twice by the usePromise in the confirmPasskey view
-                const authenticatePasskeyPromise = authenticatePasskeyMFA({
-                    createMfaToken: createMfaTokenOptions,
-                });
-                setShowAuthFlow(true);
-                pushView('passkey-confirm', {
-                    authenticatePasskeyPromise,
-                    createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
-                });
-                // Return the promise so callers can await MFA completion
-                return authenticatePasskeyPromise;
-            }
-            case MFADeviceType.Totp: {
-                if (dynamicClient === null || dynamicClient === void 0 ? void 0 : dynamicClient.mfaToken) {
-                    return dynamicClient === null || dynamicClient === void 0 ? void 0 : dynamicClient.mfaToken;
-                }
-                // If the mfaToken is not present, we need to open the MFA UI and wait for it to be available
-                const deferred = new DeferredPromise();
-                // Open the MFA UI if the mfaToken is not available yet
-                setShowAuthFlow(true);
-                pushView('mfa-verification', {
-                    createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
-                });
-                const mfaCompletionSuccessOff = onEvent({
-                    event: 'mfaCompletionSuccess',
-                    listener: ({ mfaToken }) => deferred.resolve(mfaToken),
-                }, dynamicClient);
-                // Reject the promise if the auth flow is closed
-                const onAuthFlowCloseHandler = () => deferred.reject(new Error('MFA view closed'));
-                dynamicEvents.on('authFlowClose', onAuthFlowCloseHandler);
-                // Cleanup the event listeners
-                deferred.promise.finally(() => {
-                    mfaCompletionSuccessOff();
-                    dynamicEvents.off('authFlowClose', onAuthFlowCloseHandler);
-                });
-                return deferred.promise;
-            }
-            default:
-                throw new Error('Error determining MFA method to use');
-        }
-    }), [
-        authenticatePasskeyMFA,
-        dynamicClient,
-        getUserMfaMethods,
-        pushView,
-        setShowAuthFlow,
-    ]);
-    return promptMfaAuth;
+    const { promptMfa } = useStepUpAuthentication();
+    return promptMfa;
 };
 
 export { usePromptMfaAuth };

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

@@ -1,2 +1,2 @@
 export { useStepUpAuthentication } from './useStepUpAuthentication';
-export type { IsStepUpRequiredParams, StepUpAuthenticationState, UseStepUpAuthenticationParams, UseStepUpAuthenticationReturn, VerifyOtpParams, VerifyPasskeyMfaParams, VerifyTotpMfaParams, VerifyWalletParams, } from './useStepUpAuthentication';
+export type { IsStepUpRequiredParams, PromptMfaParams, StepUpAuthenticationState, UseStepUpAuthenticationParams, UseStepUpAuthenticationReturn, VerifyOtpParams, VerifyPasskeyMfaParams, VerifyRecoveryCodeParams, VerifyTotpMfaParams, VerifyWalletParams, } from './useStepUpAuthentication';

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

@@ -5,18 +5,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var React = require('react');
-var client = require('@dynamic-labs-sdk/client');
+var client$1 = require('@dynamic-labs-sdk/client');
 var sdkApiCore = require('@dynamic-labs/sdk-api-core');
+var utils = require('@dynamic-labs/utils');
 require('@dynamic-labs-sdk/client/core');
-require('../../../client/client.cjs');
+var client = require('../../../client/client.cjs');
 require('../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 require('react/jsx-runtime');
-require('../../../context/ViewContext/ViewContext.cjs');
+var ViewContext = require('../../../context/ViewContext/ViewContext.cjs');
 var logger = require('../../../shared/logger.cjs');
 require('@dynamic-labs/wallet-book');
-require('@dynamic-labs/utils');
 require('../../constants/colors.cjs');
 require('../../constants/values.cjs');
 require('../../../shared/consts/index.cjs');
@@ -28,18 +28,95 @@ var dynamicContextProps = require('../../../store/state/dynamicContextProps/dyna
 require('../../../store/state/primaryWalletId/primaryWalletId.cjs');
 require('../../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs');
 require('../../functions/getWaasAddressTypeLabel/getWaasAddressTypeLabel.cjs');
-require('../../../events/dynamicEvents.cjs');
+var dynamicEvents = require('../../../events/dynamicEvents.cjs');
 var useUser = require('../../../client/extension/user/useUser/useUser.cjs');
 var hasElevatedAccessToken = require('../../../client/extension/functions/hasElevatedAccessToken/hasElevatedAccessToken.cjs');
+require('../../../context/DynamicContext/DynamicContext.cjs');
+require('../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 var useConnectAndSign = require('../authenticationHooks/useConnectAndSign/useConnectAndSign.cjs');
+require('../../../context/ErrorContext/ErrorContext.cjs');
+require('../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('../../../context/AccountExistsContext/AccountExistsContext.cjs');
 var UserWalletsContext = require('../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../store/state/authMode/authMode.cjs');
+require('../../../context/CaptchaContext/CaptchaContext.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('../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');
+require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
+require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../../store/state/walletOptions/walletOptions.cjs');
+require('react-i18next');
+require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
+require('../../../components/Alert/Alert.cjs');
+require('../../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../../components/IconButton/IconButton.cjs');
+require('../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../components/Input/Input.cjs');
+require('../../../components/IsBrowser/IsBrowser.cjs');
+require('../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../../../components/OverlayCard/OverlayCard.cjs');
+require('../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
+require('../../../components/Popper/Popper/Popper.cjs');
+require('../../../components/Popper/PopperContext/PopperContext.cjs');
+require('react-focus-lock');
+require('qrcode');
+require('formik');
+require('../useSubdomainCheck/useSubdomainCheck.cjs');
+require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
+require('../useWalletBackup/useWalletBackup.cjs');
+require('../useWalletBackup/types.cjs');
+require('../useWalletBackup/cloudProviders.cjs');
+require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
+require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
+require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('@hcaptcha/react-hcaptcha');
+require('../../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.cjs');
+require('../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
+require('../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
+require('../../../context/FooterAnimationContext/index.cjs');
+require('../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
+require('../../../context/PasskeyContext/PasskeyContext.cjs');
+require('../../../context/OnrampContext/OnrampContext.cjs');
+require('../../../store/state/sendBalances.cjs');
+require('../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
+require('../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
+require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
+require('../../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
+require('../../../widgets/DynamicWidget/components/PasskeyCard/PasskeyCard.cjs');
+require('../../../widgets/DynamicWidget/views/CryptoComOnramp/CryptoComOnramp.cjs');
+require('../../../../index.cjs');
+require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
+require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
+var useGetUserMfaMethods = require('../useGetUserMfaMethods/useGetUserMfaMethods.cjs');
+var useAuthenticatePasskeyMFA = require('../useAuthenticatePasskeyMFA/useAuthenticatePasskeyMFA.cjs');
+require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
+var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 
 const INITIAL_STATE = {
     error: null,
     isLoading: false,
     otpVerification: null,
 };
-const isCountryCode = (value) => value !== undefined && value in client.supportedCountries;
+const isCountryCode = (value) => value !== undefined && value in client$1.supportedCountries;
 const isOtpCapableCredential = (cred) => cred.format === sdkApiCore.JwtVerifiedCredentialFormatEnum.Email ||
     cred.format === sdkApiCore.JwtVerifiedCredentialFormatEnum.PhoneNumber;
 const resolveTargetCredential = (credentials, credentialId) => {
@@ -53,19 +130,19 @@ const sendEmailOtp = (credential) => _tslib.__awaiter(void 0, void 0, void 0, fu
     if (!credential.email) {
         throw new Error('Email credential is missing email address');
     }
-    return client.sendEmailOTP({ email: credential.email });
+    return client$1.sendEmailOTP({ email: credential.email });
 });
 const sendSmsOtp = (credential) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
     var _a;
     const normalizedPhoneCountryCode = (_a = credential.phoneCountryCode) === null || _a === void 0 ? void 0 : _a.replace(/^\+/, '');
-    const matchedCountryCode = Object.keys(client.supportedCountries).find((key) => client.supportedCountries[key].code === normalizedPhoneCountryCode);
+    const matchedCountryCode = Object.keys(client$1.supportedCountries).find((key) => client$1.supportedCountries[key].code === normalizedPhoneCountryCode);
     const isoCountryCode = isCountryCode(credential.isoCountryCode)
         ? credential.isoCountryCode
         : matchedCountryCode;
     if (!credential.phoneNumber || !isoCountryCode) {
         throw new Error('SMS credential is missing phone number or country code');
     }
-    return client.sendSmsOTP({ isoCountryCode, phoneNumber: credential.phoneNumber });
+    return client$1.sendSmsOTP({ isoCountryCode, phoneNumber: credential.phoneNumber });
 });
 const dispatchOtp = (credential) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
     return credential.format === sdkApiCore.JwtVerifiedCredentialFormatEnum.Email
@@ -110,6 +187,11 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
     const [state, setState] = React.useState(INITIAL_STATE);
     const connectAndSign = useConnectAndSign.useConnectAndSign();
     const { userWallets } = UserWalletsContext.useInternalUserWallets();
+    const { setShowAuthFlow } = useInternalDynamicContext.useInternalDynamicContext();
+    const { pushView } = ViewContext.useViewContext();
+    const getUserMfaMethods = useGetUserMfaMethods.useGetUserMfaMethods();
+    const authenticatePasskeyMFA = useAuthenticatePasskeyMFA.useAuthenticatePasskeyMFA();
+    const dynamicClient = client.useDynamicClient();
     // Ref keeps the latest otpVerification available inside the verifyOtp
     // callback without creating a stale closure over state.
     const otpVerificationRef = React.useRef(null);
@@ -169,7 +251,7 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
         }
         setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: true })));
         try {
-            const response = yield client.verifyOTP({
+            const response = yield client$1.verifyOTP({
                 otpVerification,
                 requestedScopes,
                 verificationToken,
@@ -213,19 +295,11 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
                 userId: user === null || user === void 0 ? void 0 : user.id,
             });
         }
-    }), [
-        connectAndSign,
-        credentialId,
-        environmentId,
-        setError,
-        user === null || user === void 0 ? void 0 : user.id,
-        userWallets,
-    ]);
+    }), [connectAndSign, credentialId, environmentId, setError, user, userWallets]);
     const verifyPasskeyMfa = React.useCallback((_c) => _tslib.__awaiter(void 0, [_c], void 0, function* ({ requestedScopes, }) {
         setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: true })));
         try {
-            // requestedScopes is available in @dynamic-labs-sdk/client >= 0.14.0
-            const response = yield client.authenticatePasskeyMFA({
+            const response = yield client$1.authenticatePasskeyMFA({
                 requestedScopes,
             });
             setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: false })));
@@ -239,12 +313,11 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
             logger.logger.error('Failed to authenticate passkey for step-up authentication', { environmentId, error, userId: user === null || user === void 0 ? void 0 : user.id });
             return null;
         }
-    }), [environmentId, user === null || user === void 0 ? void 0 : user.id]);
+    }), [environmentId, user]);
     const verifyTotpMfa = React.useCallback((_d) => _tslib.__awaiter(void 0, [_d], void 0, function* ({ code, deviceId, requestedScopes, }) {
         setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: true })));
         try {
-            // requestedScopes is available in @dynamic-labs-sdk/client >= 0.14.0
-            const response = yield client.authenticateTotpMfaDevice({
+            const response = yield client$1.authenticateTotpMfaDevice({
                 code,
                 deviceId,
                 requestedScopes,
@@ -260,14 +333,112 @@ const useStepUpAuthentication = ({ credentialId, } = {}) => {
             logger.logger.error('Failed to authenticate TOTP device for step-up authentication', { environmentId, error, userId: user === null || user === void 0 ? void 0 : user.id });
             return null;
         }
-    }), [environmentId, user === null || user === void 0 ? void 0 : user.id]);
+    }), [environmentId, user]);
+    const verifyRecoveryCode = React.useCallback((_e) => _tslib.__awaiter(void 0, [_e], void 0, function* ({ code, requestedScopes, }) {
+        setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: true })));
+        try {
+            const response = yield client$1.authenticateMfaRecoveryCode({
+                code,
+                requestedScopes,
+            });
+            setState((prev) => (Object.assign(Object.assign({}, prev), { error: null, isLoading: false })));
+            return response;
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error
+                ? error.message
+                : 'Failed to authenticate recovery code for step-up authentication';
+            setState((prev) => (Object.assign(Object.assign({}, prev), { error: errorMessage, isLoading: false })));
+            logger.logger.error('Failed to authenticate recovery code for step-up authentication', { environmentId, error, userId: user === null || user === void 0 ? void 0 : user.id });
+            return null;
+        }
+    }), [environmentId, user]);
+    const promptMfa = React.useCallback((props) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        var _f;
+        const methods = yield getUserMfaMethods();
+        const allMethods = [
+            ...methods.passkeys.map((passkey) => (Object.assign(Object.assign({}, passkey), { type: sdkApiCore.MFADeviceType.Passkey }))),
+            ...methods.devices.map((device) => (Object.assign(Object.assign({}, device), { type: sdkApiCore.MFADeviceType.Totp }))),
+        ];
+        if (!methods.userHasVerifiedMfaMethods || allMethods.length === 0) {
+            setShowAuthFlow(true);
+            pushView('mfa-choose-device', {
+                createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
+                requestedScopes: props === null || props === void 0 ? void 0 : props.requestedScopes,
+            });
+            return;
+        }
+        const lastCreatedMethod = allMethods.reduce((a, b) => {
+            if (!a)
+                return b;
+            if (!b)
+                return a;
+            if (a.createdAt && b.createdAt) {
+                return a.createdAt >= b.createdAt ? a : b;
+            }
+            if (b.createdAt) {
+                return b;
+            }
+            return a;
+        }, allMethods[0]);
+        switch (lastCreatedMethod.type) {
+            case sdkApiCore.MFADeviceType.Passkey: {
+                const createMfaTokenOptions = (props === null || props === void 0 ? void 0 : props.createMfaToken)
+                    ? { singleUse: true }
+                    : undefined;
+                const authenticatePasskeyPromise = authenticatePasskeyMFA({
+                    createMfaToken: createMfaTokenOptions,
+                    requestedScopes: props === null || props === void 0 ? void 0 : props.requestedScopes,
+                });
+                setShowAuthFlow(true);
+                pushView('passkey-confirm', {
+                    authenticatePasskeyPromise,
+                    createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
+                    requestedScopes: props === null || props === void 0 ? void 0 : props.requestedScopes,
+                });
+                return authenticatePasskeyPromise;
+            }
+            case sdkApiCore.MFADeviceType.Totp: {
+                if ((dynamicClient === null || dynamicClient === void 0 ? void 0 : dynamicClient.mfaToken) && !((_f = props === null || props === void 0 ? void 0 : props.requestedScopes) === null || _f === void 0 ? void 0 : _f.length)) {
+                    return dynamicClient === null || dynamicClient === void 0 ? void 0 : dynamicClient.mfaToken;
+                }
+                const deferred = new utils.DeferredPromise();
+                setShowAuthFlow(true);
+                pushView('mfa-verification', {
+                    createMfaToken: props === null || props === void 0 ? void 0 : props.createMfaToken,
+                    requestedScopes: props === null || props === void 0 ? void 0 : props.requestedScopes,
+                });
+                const mfaCompletionSuccessOff = client$1.onEvent({
+                    event: 'mfaCompletionSuccess',
+                    listener: ({ mfaToken }) => deferred.resolve(mfaToken),
+                }, dynamicClient);
+                const onAuthFlowCloseHandler = () => deferred.reject(new Error('MFA view closed'));
+                dynamicEvents.dynamicEvents.on('authFlowClose', onAuthFlowCloseHandler);
+                deferred.promise.finally(() => {
+                    mfaCompletionSuccessOff();
+                    dynamicEvents.dynamicEvents.off('authFlowClose', onAuthFlowCloseHandler);
+                });
+                return deferred.promise;
+            }
+            default:
+                throw new Error('Error determining MFA method to use');
+        }
+    }), [
+        authenticatePasskeyMFA,
+        dynamicClient,
+        getUserMfaMethods,
+        pushView,
+        setShowAuthFlow,
+    ]);
     return {
         isStepUpRequired,
+        promptMfa,
         resetState,
         sendOtp,
         state,
         verifyOtp,
         verifyPasskeyMfa,
+        verifyRecoveryCode,
         verifyTotpMfa,
         verifyWallet,
     };

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

@@ -20,6 +20,10 @@ export type VerifyTotpMfaParams = {
     deviceId?: string;
     requestedScopes?: TokenScope[];
 };
+export type VerifyRecoveryCodeParams = {
+    code: string;
+    requestedScopes?: TokenScope[];
+};
 export type IsStepUpRequiredParams = {
     scope: TokenScope;
 };
@@ -28,14 +32,20 @@ export type UseStepUpAuthenticationParams = {
 };
 export type UseStepUpAuthenticationReturn = {
     isStepUpRequired: (params: IsStepUpRequiredParams) => boolean;
+    promptMfa: (props?: PromptMfaParams) => Promise<string | undefined>;
     resetState: () => void;
     sendOtp: () => Promise<OTPVerification | null>;
     state: StepUpAuthenticationState;
     verifyOtp: (params: VerifyOtpParams) => Promise<VerifyResponse | null>;
     verifyPasskeyMfa: (params: VerifyPasskeyMfaParams) => Promise<VerifyResponse | null>;
+    verifyRecoveryCode: (params: VerifyRecoveryCodeParams) => Promise<VerifyResponse | null>;
     verifyTotpMfa: (params: VerifyTotpMfaParams) => Promise<VerifyResponse | null>;
     verifyWallet: (params: VerifyWalletParams) => Promise<void>;
 };
+export type PromptMfaParams = {
+    createMfaToken?: boolean;
+    requestedScopes?: TokenScope[];
+};
 /**
  * Perform step-up authentication for an already-authenticated user.
  *