@dynamic-labs/sdk-react-core 0.19.0-alpha.7 → 0.19.0-alpha.9

package/src/lib/data/api.d.ts

@@ -1,4 +1,4 @@
-import { ProjectSettings, UserFields, NetworkConfigurationResponse, ChainEnum, UpdateSelfResponse, WalletProviderEnum, AuthModeEnum, EmailVerificationCreateResponse, VerifyResponse, OauthRequest, ProviderEnum, OnrampConfiguration, EmailProviderResponse } from '@dynamic-labs/sdk-api';
+import { ProjectSettings, UserFields, NetworkConfigurationResponse, ChainEnum, UpdateSelfResponse, WalletProviderEnum, AuthModeEnum, EmailVerificationCreateResponse, VerifyResponse, OauthRequest, OauthResultRequest, ProviderEnum, OnrampConfiguration, EmailProviderResponse, OauthResultResponse } from '@dynamic-labs/sdk-api';
 import { AuthModeType, VerifyWallet } from '../shared/types';
 export declare const fetchNonce: (environmentId: string) => Promise<string | undefined>;
 export declare const getEmailProvider: ({ email, environmentId, }: {
@@ -34,7 +34,7 @@ export declare const unlinkWallet: ({ environmentId, primaryWalletId, walletId,
     primaryWalletId: string | undefined;
     walletId: string;
 }, userJwt: string) => Promise<string | undefined>;
-export declare const transferWallet: (environmentId: string, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, skipEmptyAccountCheck, }: VerifyWallet, userJwt: string) => Promise<string | undefined>;
+export declare const transferWallet: (environmentId: string, { network, messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, skipEmptyAccountCheck, }: VerifyWallet, userJwt: string) => Promise<string | undefined>;
 export declare const mapChainToChainEnum: (chain: string) => ChainEnum;
 export declare const mapProviderToProviderEnum: (provider: string) => WalletProviderEnum;
 export declare const mapAuthModeTypeToEnum: (authMode: string) => AuthModeEnum;
@@ -52,10 +52,13 @@ export declare const fetchProjectSettings: (environmentId: string) => Promise<Pr
 export declare const updateUserProfileFields: (jwt: string | undefined, environmentId: string, fields: UserFields) => Promise<UpdateSelfResponse>;
 export declare const getOauthLoginUrl: (environmentId: string, providerType: ProviderEnum, userJwt: string) => Promise<string | undefined>;
 export declare const verifyOAuth: (environmentId: string, providerType: ProviderEnum, { code, codeVerifier, state }: OauthRequest, userJwt: string) => Promise<string | undefined>;
-export declare const unlinkOAuth: ({ environmentId, verifiedCrentialId, }: {
+export declare const unlinkOAuth: ({ environmentId, primaryWalletId, verifiedCrentialId, }: {
     environmentId: string;
+    primaryWalletId: string | undefined;
     verifiedCrentialId: string;
 }, userJwt: string) => Promise<string | undefined>;
+export declare const signInOAuth: (environmentId: string, providerType: ProviderEnum, { code, codeVerifier, state }: OauthRequest) => Promise<string | undefined>;
+export declare const getOAuthResult: (environmentId: string, providerType: ProviderEnum, { state }: OauthResultRequest) => Promise<OauthResultResponse | undefined>;
 export declare const getOnrampProviders: ({ chain, environmentId, networkId, token, walletAddress, }: {
     chain: string;
     environmentId: string;

package/src/lib/data/api.js

@@ -1,5 +1,5 @@
 import { __awaiter } from '../../../_virtual/_tslib.js';
-import { NoAccessError, AccountExistsError, EmailVerificationError, UserHasAccountWithEmailError, DynamicError, EmailAlreadyExistsError, UsernameAlreadyExistsError, EmailProviderError, WalletUsedError, WalletNotDeployedError, ChainalysisError, GateBlockedError } from '@dynamic-labs/utils';
+import { NoAccessError, AccountExistsError, EmailVerificationError, UserHasAccountWithEmailError, DynamicError, EmailAlreadyExistsError, UsernameAlreadyExistsError, EmailProviderError, WalletUsedError, WalletNotDeployedError, ChainalysisError, GateBlockedError, SocialAccountAlreadyExistsError } from '@dynamic-labs/utils';
 import { UnprocessableEntityErrorCode, SDKApi, Configuration, VerifyRequestFromJSON, ChainEnum, WalletProviderEnum, AuthModeEnum } from '@dynamic-labs/sdk-api';
 import { VERSION, API_VERSION } from '../../version.js';
 import ApiEndpoint from '../config/ApiEndpoint.js';
@@ -14,7 +14,7 @@ import '../utils/constants/colors.js';
 import '../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
 import '../shared/consts/index.js';
-import { isSDKSessionSettingExpired, setSDKSessionSettings } from '../context/DynamicContext/helpers.js';
+import { isDynamicContextSessionSettingExpired, setDynamicContextSessionSettings, isWagmiSessionSettingExpired, setWagmiSessionSettings } from '../context/DynamicContext/helpers.js';
 
 const sdkApi = (jwt) => {
     const settings = {
@@ -184,11 +184,12 @@ const unlinkWallet = ({ environmentId, primaryWalletId, walletId, }, userJwt) =>
         return undefined;
     }
 });
-const transferWallet = (environmentId, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, skipEmptyAccountCheck = false, }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+const transferWallet = (environmentId, { network, messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, skipEmptyAccountCheck = false, }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
     // We should find a better way to do this than force type casting
     const verifyRequest = {
         chain,
         messageToSign,
+        network,
         publicWalletAddress,
         signedMessage,
         skipEmptyAccountCheck,
@@ -336,27 +337,52 @@ const updateUserProfileFields = (jwt, environmentId, fields) => __awaiter(void 0
         throw e;
     }
 });
-const getOauthLoginUrl = (environmentId, providerType, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+const verifyOAuth = (environmentId, providerType, { code, codeVerifier, state }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+    const oauthRequest = {
+        code,
+        codeVerifier,
+        state,
+    };
     try {
-        const { url } = yield sdkApi(userJwt).oauthLoginUrl({
+        const { jwt } = yield sdkApi(userJwt).oauthVerify({
             environmentId,
+            oauthRequest,
             providerType,
         });
-        return url;
+        return jwt;
     }
     catch (e) {
         logger.error(e);
+        const data = yield e.json();
+        if (data.code === 'social_account_already_exists') {
+            throw new SocialAccountAlreadyExistsError();
+        }
         return undefined;
     }
 });
-const verifyOAuth = (environmentId, providerType, { code, codeVerifier, state }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+const unlinkOAuth = ({ environmentId, primaryWalletId, verifiedCrentialId, }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+        const { jwt } = yield sdkApi(userJwt).verifyUnlink({
+            environmentId,
+            verifyUnlinkRequest: {
+                primaryWalletId,
+                verifiedCrentialId,
+            },
+        });
+        return jwt;
+    }
+    catch (e) {
+        return undefined;
+    }
+});
+const signInOAuth = (environmentId, providerType, { code, codeVerifier, state }) => __awaiter(void 0, void 0, void 0, function* () {
     const oauthRequest = {
         code,
         codeVerifier,
         state,
     };
     try {
-        const { jwt } = yield sdkApi(userJwt).oauthVerify({
+        const { jwt } = yield sdkApi().oauthSignIn({
             environmentId,
             oauthRequest,
             providerType,
@@ -365,20 +391,32 @@ const verifyOAuth = (environmentId, providerType, { code, codeVerifier, state },
     }
     catch (e) {
         logger.error(e);
+        const data = yield e.json();
+        if (data.error.code === 'gate_blocked') {
+            throw new GateBlockedError(data.payload.walletPublicKey);
+        }
+        if (data.error.code === 'missing_from_list') {
+            throw new NoAccessError({
+                walletPublicKey: data.payload.walletPublicKey,
+            });
+        }
         return undefined;
     }
 });
-const unlinkOAuth = ({ environmentId, verifiedCrentialId, }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+const getOAuthResult = (environmentId, providerType, { state }) => __awaiter(void 0, void 0, void 0, function* () {
+    const oauthResultRequest = {
+        state,
+    };
     try {
-        const { jwt } = yield sdkApi(userJwt).verifyUnlink({
+        const result = yield sdkApi().oauthResult({
             environmentId,
-            verifyUnlinkRequest: {
-                verifiedCrentialId,
-            },
+            oauthResultRequest,
+            providerType,
         });
-        return jwt;
+        return result;
     }
     catch (e) {
+        logger.error(e);
         return undefined;
     }
 });
@@ -397,26 +435,25 @@ const getOnrampProviders = ({ chain, environmentId, networkId, token, walletAddr
 });
 const sendDynamicProps = (environmentId, settingsToSend) => __awaiter(void 0, void 0, void 0, function* () {
     try {
-        const isSettingsExpired = isSDKSessionSettingExpired();
-        // sent once. no need to send again
-        if (!isSettingsExpired) {
-            return;
-        }
         const { dynamicContextProps, dynamicWagmiSettings } = settingsToSend;
-        if (dynamicContextProps || dynamicWagmiSettings) {
-            yield sdkApi().logDynamicSdkSettings({
-                environmentId,
-                sdkSettingsRequest: {
-                    dynamicContextProps,
-                    dynamicWagmiSettings,
-                },
-            });
+        if (dynamicContextProps) {
+            yield sendDynamicContextSettings(environmentId, { dynamicContextProps }, isDynamicContextSessionSettingExpired, setDynamicContextSessionSettings);
+        }
+        if (dynamicWagmiSettings) {
+            yield sendDynamicContextSettings(environmentId, { dynamicWagmiSettings }, isWagmiSessionSettingExpired, setWagmiSessionSettings);
         }
-        setSDKSessionSettings();
     }
-    catch (e) {
-        logger.error(e);
+    catch (error) {
+        logger.warn('Error caught when sending sdkSettings to api. Please notify Dynamic, and send the DynamicContextProvider settings you currently have configured', { error });
+    }
+});
+const sendDynamicContextSettings = (environmentId, sdkSettingsRequest, isSdkSettingExpired, setSDKSessionSettings) => __awaiter(void 0, void 0, void 0, function* () {
+    // sent once. no need to send again
+    if (!isSdkSettingExpired()) {
+        return;
     }
+    yield sdkApi().logDynamicSdkSettings({ environmentId, sdkSettingsRequest });
+    setSDKSessionSettings();
 });
 const mergeUserAccounts = (userJwt, environmentId) => __awaiter(void 0, void 0, void 0, function* () {
     try {
@@ -431,4 +468,4 @@ const mergeUserAccounts = (userJwt, environmentId) => __awaiter(void 0, void 0,
     }
 });
 
-export { createEmailVerification, createVisit, fetchNetworkSettings, fetchNonce, fetchProjectSettings, getEmailProvider, getOauthLoginUrl, getOnrampProviders, linkWallet, mapAuthModeTypeToEnum, mapChainToChainEnum, mapProviderToProviderEnum, mergeUserAccounts, retryEmailVerification, revokeSession, sendDynamicProps, signInWithEmailVerification, transferWallet, unlinkOAuth, unlinkWallet, updateUserProfileFields, verifyEmail, verifyOAuth, verifyWallet };
+export { createEmailVerification, createVisit, fetchNetworkSettings, fetchNonce, fetchProjectSettings, getEmailProvider, getOAuthResult, getOnrampProviders, linkWallet, mapAuthModeTypeToEnum, mapChainToChainEnum, mapProviderToProviderEnum, mergeUserAccounts, retryEmailVerification, revokeSession, sendDynamicProps, signInOAuth, signInWithEmailVerification, transferWallet, unlinkOAuth, unlinkWallet, updateUserProfileFields, verifyEmail, verifyOAuth, verifyWallet };

package/src/lib/layout/DynamicAuthLayout/DynamicAuthLayout.cjs

@@ -17,8 +17,9 @@ require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
 require('../../shared/consts/index.cjs');
-require('../../context/DynamicContext/DynamicContext.cjs');
+var useInternalDynamicContext = require('../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../config/ApiEndpoint.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
@@ -58,11 +58,14 @@ var header = require('./Header/header.cjs');
 var ToSFooter = require('./ToSFooter/ToSFooter.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 var HelpContent = require('./HelpContent/HelpContent.cjs');
+require('react-i18next');
 var WalletProgressStepper = require('./WalletProgressStepper/WalletProgressStepper.cjs');
 
 const DynamicAuthLayout = ({ children, onClose, transitionProps, projectSettings, walletConnector, }) => {
     const { view } = ViewContext.useViewContext();
+    const { authMode } = useInternalDynamicContext.useInternalDynamicContext();
     const { headerData, helpHeaderData } = useDynamicLayoutData.useDynamicLayoutData({
+        authMode,
         view,
     });
     const { isFooterExpanded } = index.useFooterAnimationContext();

package/src/lib/layout/DynamicAuthLayout/DynamicAuthLayout.js

@@ -13,8 +13,9 @@ import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
 import '../../shared/consts/index.js';
-import '../../context/DynamicContext/DynamicContext.js';
+import { useInternalDynamicContext } from '../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../config/ApiEndpoint.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../context/ErrorContext/ErrorContext.js';
@@ -54,11 +54,14 @@ import { Header } from './Header/header.js';
 import { ToSFooter } from './ToSFooter/ToSFooter.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import { HelpContent } from './HelpContent/HelpContent.js';
+import 'react-i18next';
 import { WalletProgressStepper } from './WalletProgressStepper/WalletProgressStepper.js';
 
 const DynamicAuthLayout = ({ children, onClose, transitionProps, projectSettings, walletConnector, }) => {
     const { view } = useViewContext();
+    const { authMode } = useInternalDynamicContext();
     const { headerData, helpHeaderData } = useDynamicLayoutData({
+        authMode,
         view,
     });
     const { isFooterExpanded } = useFooterAnimationContext();

package/src/lib/layout/DynamicAuthLayout/Header/header.cjs

@@ -22,6 +22,7 @@ require('ethers');
 require('../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../config/ApiEndpoint.cjs');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -29,7 +30,6 @@ require('react-focus-lock');
 require('../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 var ErrorContext = require('../../../context/ErrorContext/ErrorContext.cjs');

package/src/lib/layout/DynamicAuthLayout/Header/header.js

@@ -18,6 +18,7 @@ import 'ethers';
 import '../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../config/ApiEndpoint.js';
 import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -25,7 +26,6 @@ import 'react-focus-lock';
 import '../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import { useErrorContext } from '../../../context/ErrorContext/ErrorContext.js';

package/src/lib/layout/DynamicAuthLayout/HelpContent/HelpContent.cjs

@@ -10,6 +10,7 @@ var WalletListHelpContent = require('./WalletListHelpContent/WalletListHelpConte
 var WalletMoreInfoContent = require('./WalletMoreInfoContent/WalletMoreInfoContent.cjs');
 var EmptyHelpContent = require('./EmptyHelpContent/EmptyHelpContent.cjs');
 var HelpHeader = require('./HelpHeader/HelpHeader.cjs');
+var PasskeyInfoHelper = require('./PasskeyInfoHelper/PasskeyInfoHelper.cjs');
 
 const HelpContent = () => (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(HelpHeader.HelpHeader, {}), jsxRuntime.jsx(HelpContentSwitch, {})] }));
 const HelpContentSwitch = () => {
@@ -22,6 +23,7 @@ const HelpContentSwitch = () => {
     const isPendingSignatureTypeView = React.useMemo(() => view === 'pending-signature-without-back-button' ||
         view === 'pending-signature', [view]);
     const isPendingConnectTypeView = React.useMemo(() => view === 'pending-connect' || view === 'qr-code', [view]);
+    const isPasskeyIntroView = React.useMemo(() => view === 'passkey-intro', [view]);
     if (isWalletListTypeView) {
         return (jsxRuntime.jsx(WalletListHelpContent.WalletListHelpContent, { chains: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.chains, newToWeb3WalletChainMap: newToWeb3WalletChainMap }));
     }
@@ -31,6 +33,9 @@ const HelpContentSwitch = () => {
     if (isPendingConnectTypeView) {
         return jsxRuntime.jsx(WalletMoreInfoContent.WalletMoreInfoContent, { variant: 'connect' });
     }
+    if (isPasskeyIntroView) {
+        return jsxRuntime.jsx(PasskeyInfoHelper.PasskeyInfoHelper, {});
+    }
     return jsxRuntime.jsx(EmptyHelpContent.EmptyHelpContent, {});
 };
 

package/src/lib/layout/DynamicAuthLayout/HelpContent/HelpContent.js

@@ -6,6 +6,7 @@ import { WalletListHelpContent } from './WalletListHelpContent/WalletListHelpCon
 import { WalletMoreInfoContent } from './WalletMoreInfoContent/WalletMoreInfoContent.js';
 import { EmptyHelpContent } from './EmptyHelpContent/EmptyHelpContent.js';
 import { HelpHeader } from './HelpHeader/HelpHeader.js';
+import { PasskeyInfoHelper } from './PasskeyInfoHelper/PasskeyInfoHelper.js';
 
 const HelpContent = () => (jsxs("div", { children: [jsx(HelpHeader, {}), jsx(HelpContentSwitch, {})] }));
 const HelpContentSwitch = () => {
@@ -18,6 +19,7 @@ const HelpContentSwitch = () => {
     const isPendingSignatureTypeView = useMemo(() => view === 'pending-signature-without-back-button' ||
         view === 'pending-signature', [view]);
     const isPendingConnectTypeView = useMemo(() => view === 'pending-connect' || view === 'qr-code', [view]);
+    const isPasskeyIntroView = useMemo(() => view === 'passkey-intro', [view]);
     if (isWalletListTypeView) {
         return (jsx(WalletListHelpContent, { chains: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.chains, newToWeb3WalletChainMap: newToWeb3WalletChainMap }));
     }
@@ -27,6 +29,9 @@ const HelpContentSwitch = () => {
     if (isPendingConnectTypeView) {
         return jsx(WalletMoreInfoContent, { variant: 'connect' });
     }
+    if (isPasskeyIntroView) {
+        return jsx(PasskeyInfoHelper, {});
+    }
     return jsx(EmptyHelpContent, {});
 };
 

package/src/lib/layout/DynamicAuthLayout/HelpContent/HelpHeader/HelpHeader.cjs

@@ -17,8 +17,9 @@ require('../../../../utils/constants/colors.cjs');
 require('../../../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
 require('../../../../shared/consts/index.cjs');
-require('../../../../context/DynamicContext/DynamicContext.cjs');
+var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -53,9 +53,10 @@ var index = require('../../../../context/FooterAnimationContext/index.cjs');
 var useDynamicLayoutData = require('../../../../utils/hooks/useDynamicLayoutData/useDynamicLayoutData.cjs');
 
 const HelpHeader = () => {
+    const { authMode } = useInternalDynamicContext.useInternalDynamicContext();
     const { setIsFooterExpanded } = index.useFooterAnimationContext();
     const { view } = ViewContext.useViewContext();
-    const { helpHeaderData } = useDynamicLayoutData.useDynamicLayoutData({ view });
+    const { helpHeaderData } = useDynamicLayoutData.useDynamicLayoutData({ authMode, view });
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: () => setIsFooterExpanded(false), "data-testid": 'back-button', className: 'header__icon' }, { children: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'back-button ' }) })));
     return (jsxRuntime.jsx("div", Object.assign({ className: 'help-header' }, { children: jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ trailing: backButton }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'h1', variant: 'title', color: 'primary', "data-testid": 'dynamic-auth-help-heading', className: 'header__typography' }, { children: helpHeaderData === null || helpHeaderData === void 0 ? void 0 : helpHeaderData.heading })) })) })));
 };

package/src/lib/layout/DynamicAuthLayout/HelpContent/HelpHeader/HelpHeader.js

@@ -13,8 +13,9 @@ import '../../../../utils/constants/colors.js';
 import '../../../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
 import '../../../../shared/consts/index.js';
-import '../../../../context/DynamicContext/DynamicContext.js';
+import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
@@ -49,9 +49,10 @@ import { useFooterAnimationContext } from '../../../../context/FooterAnimationCo
 import { useDynamicLayoutData } from '../../../../utils/hooks/useDynamicLayoutData/useDynamicLayoutData.js';
 
 const HelpHeader = () => {
+    const { authMode } = useInternalDynamicContext();
     const { setIsFooterExpanded } = useFooterAnimationContext();
     const { view } = useViewContext();
-    const { helpHeaderData } = useDynamicLayoutData({ view });
+    const { helpHeaderData } = useDynamicLayoutData({ authMode, view });
     const backButton = (jsx(IconButton, Object.assign({ type: 'button', onClick: () => setIsFooterExpanded(false), "data-testid": 'back-button', className: 'header__icon' }, { children: jsx(SvgChevronLeft, { className: 'back-button ' }) })));
     return (jsx("div", Object.assign({ className: 'help-header' }, { children: jsx(ModalHeader, Object.assign({ trailing: backButton }, { children: jsx(Typography, Object.assign({ as: 'h1', variant: 'title', color: 'primary', "data-testid": 'dynamic-auth-help-heading', className: 'header__typography' }, { children: helpHeaderData === null || helpHeaderData === void 0 ? void 0 : helpHeaderData.heading })) })) })));
 };

package/src/lib/layout/DynamicAuthLayout/HelpContent/PasskeyInfoHelper/PasskeyInfoHelper.cjs

@@ -0,0 +1,61 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactI18next = require('react-i18next');
+require('@dynamic-labs/sdk-api');
+require('../../../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
+require('../../../../context/ViewContext/ViewContext.cjs');
+require('react');
+var footerKeyIcon = require('../../../../shared/assets/footer-key-icon.cjs');
+var userAccount2 = require('../../../../shared/assets/user-account-2.cjs');
+require('@dynamic-labs/wallet-book');
+require('@dynamic-labs/utils');
+require('../../../../utils/constants/colors.cjs');
+require('../../../../shared/utils/classes/storage/localStorage.cjs');
+require('ethers');
+require('../../../../shared/consts/index.cjs');
+var Typography = require('../../../../components/Typography/Typography.cjs');
+require('../../../../context/DynamicContext/DynamicContext.cjs');
+require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
+require('../../../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../../../context/ThemeContext/ThemeContext.cjs');
+var Icon = require('../../../../components/Icon/Icon.cjs');
+require('react-dom');
+require('react-focus-lock');
+require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
+require('../../../../context/ErrorContext/ErrorContext.cjs');
+require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
+require('../../../../components/IconButton/IconButton.cjs');
+require('../../../../components/Alert/Alert.cjs');
+require('formik');
+require('yup');
+require('../../../../views/CollectUserDataView/fieldsConfig.cjs');
+require('../../../../context/MockContext/MockContext.cjs');
+require('../../../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('@dynamic-labs/types');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+var EnterTileAnimation = require('../../../../components/EnterTileAnimation/EnterTileAnimation.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../../../../components/OverlayCard/OverlayCard.context.cjs');
+
+const PasskeyInfoHelper = () => {
+    const { t } = reactI18next.useTranslation();
+    return (jsxRuntime.jsx("div", Object.assign({ className: 'passkey-info-help-content__container' }, { children: jsxRuntime.jsx(EnterTileAnimation.EnterTileAnimation, Object.assign({ delay: '300ms' }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'passkey-info-help-content__typography-wrapper' }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'passkey-info-help-content__details' }, { children: [jsxRuntime.jsx(Icon.Icon, Object.assign({ size: 'medium', color: 'text-tertiary' }, { children: jsxRuntime.jsx(userAccount2.ReactComponent, {}) })), jsxRuntime.jsxs("div", Object.assign({ className: 'passkey-info-help-content__wrapper' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', weight: 'medium' }, { children: t('dyn_passkey_intro.helper.section_1.title') })), jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'p', variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'passkey-info-help-content__typography--label' }, { children: t('dyn_passkey_intro.helper.section_1.description') }))] }))] })), jsxRuntime.jsxs("div", Object.assign({ className: 'passkey-info-help-content__details' }, { children: [jsxRuntime.jsx(Icon.Icon, Object.assign({ size: 'medium', color: 'text-tertiary' }, { children: jsxRuntime.jsx(footerKeyIcon.ReactComponent, {}) })), jsxRuntime.jsxs("div", Object.assign({ className: 'passkey-info-help-content__wrapper' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', weight: 'medium' }, { children: t('dyn_passkey_intro.helper.section_2.title') })), jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'p', variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'passkey-info-help-content__typography--label' }, { children: t('dyn_passkey_intro.helper.section_2.description') }))] }))] }))] })) })) })));
+};
+
+exports.PasskeyInfoHelper = PasskeyInfoHelper;

package/src/lib/layout/DynamicAuthLayout/HelpContent/PasskeyInfoHelper/PasskeyInfoHelper.d.ts

@@ -0,0 +1 @@
+export declare const PasskeyInfoHelper: () => JSX.Element;

package/src/lib/layout/DynamicAuthLayout/HelpContent/PasskeyInfoHelper/PasskeyInfoHelper.js

@@ -0,0 +1,57 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useTranslation } from 'react-i18next';
+import '@dynamic-labs/sdk-api';
+import '../../../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import '../../../../context/ViewContext/ViewContext.js';
+import 'react';
+import { ReactComponent as SvgFooterKeyIcon } from '../../../../shared/assets/footer-key-icon.js';
+import { ReactComponent as SvgUserAccount2 } from '../../../../shared/assets/user-account-2.js';
+import '@dynamic-labs/wallet-book';
+import '@dynamic-labs/utils';
+import '../../../../utils/constants/colors.js';
+import '../../../../shared/utils/classes/storage/localStorage.js';
+import 'ethers';
+import '../../../../shared/consts/index.js';
+import { Typography } from '../../../../components/Typography/Typography.js';
+import '../../../../context/DynamicContext/DynamicContext.js';
+import '@dynamic-labs/multi-wallet';
+import '../../../../config/ApiEndpoint.js';
+import '../../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../../context/ThemeContext/ThemeContext.js';
+import { Icon } from '../../../../components/Icon/Icon.js';
+import 'react-dom';
+import 'react-focus-lock';
+import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '@dynamic-labs/rpc-providers';
+import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
+import '../../../../context/ErrorContext/ErrorContext.js';
+import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../../components/IconButton/IconButton.js';
+import '../../../../components/Alert/Alert.js';
+import 'formik';
+import 'yup';
+import '../../../../views/CollectUserDataView/fieldsConfig.js';
+import '../../../../context/MockContext/MockContext.js';
+import '../../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '@dynamic-labs/types';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import { EnterTileAnimation } from '../../../../components/EnterTileAnimation/EnterTileAnimation.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
+import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../../components/OverlayCard/OverlayCard.context.js';
+
+const PasskeyInfoHelper = () => {
+    const { t } = useTranslation();
+    return (jsx("div", Object.assign({ className: 'passkey-info-help-content__container' }, { children: jsx(EnterTileAnimation, Object.assign({ delay: '300ms' }, { children: jsxs("div", Object.assign({ className: 'passkey-info-help-content__typography-wrapper' }, { children: [jsxs("div", Object.assign({ className: 'passkey-info-help-content__details' }, { children: [jsx(Icon, Object.assign({ size: 'medium', color: 'text-tertiary' }, { children: jsx(SvgUserAccount2, {}) })), jsxs("div", Object.assign({ className: 'passkey-info-help-content__wrapper' }, { children: [jsx(Typography, Object.assign({ variant: 'title', weight: 'medium' }, { children: t('dyn_passkey_intro.helper.section_1.title') })), jsx(Typography, Object.assign({ as: 'p', variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'passkey-info-help-content__typography--label' }, { children: t('dyn_passkey_intro.helper.section_1.description') }))] }))] })), jsxs("div", Object.assign({ className: 'passkey-info-help-content__details' }, { children: [jsx(Icon, Object.assign({ size: 'medium', color: 'text-tertiary' }, { children: jsx(SvgFooterKeyIcon, {}) })), jsxs("div", Object.assign({ className: 'passkey-info-help-content__wrapper' }, { children: [jsx(Typography, Object.assign({ variant: 'title', weight: 'medium' }, { children: t('dyn_passkey_intro.helper.section_2.title') })), jsx(Typography, Object.assign({ as: 'p', variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'passkey-info-help-content__typography--label' }, { children: t('dyn_passkey_intro.helper.section_2.description') }))] }))] }))] })) })) })));
+};
+
+export { PasskeyInfoHelper };

package/src/lib/layout/DynamicAuthLayout/HelpContent/PasskeyInfoHelper/index.d.ts

@@ -0,0 +1 @@
+export { PasskeyInfoHelper } from './PasskeyInfoHelper';

package/src/lib/layout/DynamicAuthLayout/HelpContent/WalletListHelpContent/Item/Item.cjs

@@ -18,6 +18,7 @@ require('ethers');
 require('../../../../../shared/consts/index.cjs');
 require('../../../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -25,7 +26,6 @@ require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');

package/src/lib/layout/DynamicAuthLayout/HelpContent/WalletListHelpContent/Item/Item.js

@@ -14,6 +14,7 @@ import 'ethers';
 import '../../../../../shared/consts/index.js';
 import '../../../../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../config/ApiEndpoint.js';
 import '../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -21,7 +22,6 @@ import 'react-focus-lock';
 import '../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';

package/src/lib/layout/DynamicAuthLayout/HelpContent/WalletListHelpContent/WalletExtensionOrAppContinueButton/WalletExtensionOrAppContinueButton.cjs

@@ -19,6 +19,7 @@ require('ethers');
 require('../../../../../shared/consts/index.cjs');
 require('../../../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');