@dynamic-labs/sdk-react-core 0.19.0-alpha.17 → 0.19.0-alpha.19

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.cjs

@@ -10,6 +10,7 @@ require('../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 require('../../context/ViewContext/ViewContext.cjs');
+var checkConnection = require('../../shared/assets/check-connection.cjs');
 require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
@@ -21,6 +22,7 @@ require('@dynamic-labs/multi-wallet');
 var createUserProfile = require('../../utils/functions/createUserProfile/createUserProfile.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');
@@ -67,7 +69,7 @@ const CollectUserDataViewLoginWithEmail = () => {
         return null;
     }
     const userProfile = createUserProfile.createUserProfile(decodedOnboardingOnlyToken);
-    return (jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email', children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsx("div", { className: 'collect-user-data-login-with-email__icon-container', children: jsxRuntime.jsx(UserAvatar.UserAvatar, { user: userProfile }) }), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email__form', children: [jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, { userProfile: userProfile, children: jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email__welcome-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
+    return (jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email', children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email__user-info-container', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-with-email__icon-container', children: jsxRuntime.jsx(UserAvatar.UserAvatar, { user: userProfile }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'medium', className: 'collect-user-data-login-with-email__email-address', children: userProfile.email })] }), jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email__form', children: [jsxRuntime.jsx("div", { className: 'collect-user-data-login-with-email__success-icon', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-primary', size: 'large', children: jsxRuntime.jsx(checkConnection.ReactComponent, {}) }) }), jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, { userProfile: userProfile, children: jsxRuntime.jsxs("div", { className: 'collect-user-data-login-with-email__welcome-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
                                         'We need a bit of information to get started' })] }) }), jsxRuntime.jsx(TextButton.TextButton, { className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut, children: "Log out" })] })] }));
 };

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.js

@@ -6,6 +6,7 @@ import '../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import '../../context/ViewContext/ViewContext.js';
+import { ReactComponent as SvgCheckConnection } from '../../shared/assets/check-connection.js';
 import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
@@ -17,6 +18,7 @@ import '@dynamic-labs/multi-wallet';
 import { createUserProfile } from '../../utils/functions/createUserProfile/createUserProfile.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';
@@ -63,7 +65,7 @@ const CollectUserDataViewLoginWithEmail = () => {
         return null;
     }
     const userProfile = createUserProfile(decodedOnboardingOnlyToken);
-    return (jsxs("div", { className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email', children: [onboardingImageUrl && (jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsx("div", { className: 'collect-user-data-login-with-email__icon-container', children: jsx(UserAvatar, { user: userProfile }) }), jsxs("div", { className: 'collect-user-data-login-with-email__form', children: [jsx(OnboardingUserDataForm, { userProfile: userProfile, children: jsxs("div", { className: 'collect-user-data-login-with-email__welcome-container', children: [jsx(Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
+    return (jsxs("div", { className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email', children: [onboardingImageUrl && (jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxs("div", { className: 'collect-user-data-login-with-email__user-info-container', children: [jsx("div", { className: 'collect-user-data-login-with-email__icon-container', children: jsx(UserAvatar, { user: userProfile }) }), jsx(Typography, { variant: 'body_normal', color: 'primary', weight: 'medium', className: 'collect-user-data-login-with-email__email-address', children: userProfile.email })] }), jsxs("div", { className: 'collect-user-data-login-with-email__form', children: [jsx("div", { className: 'collect-user-data-login-with-email__success-icon', children: jsx(Icon, { color: 'text-primary', size: 'large', children: jsx(SvgCheckConnection, {}) }) }), jsx(OnboardingUserDataForm, { userProfile: userProfile, children: jsxs("div", { className: 'collect-user-data-login-with-email__welcome-container', children: [jsx(Typography, { variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` }), jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
                                         'We need a bit of information to get started' })] }) }), jsx(TextButton, { className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut, children: "Log out" })] })] }));
 };

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.cjs

@@ -39,6 +39,7 @@ require('../../context/FooterAnimationContext/index.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/QrCodeContext/QrCodeContext.cjs');
 require('react-i18next');
+var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
@@ -55,7 +56,6 @@ require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('formik');
 require('yup');
 var IconButton = require('../../components/IconButton/IconButton.cjs');
-var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 require('../../components/Alert/Alert.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.js

@@ -35,6 +35,7 @@ import '../../context/FooterAnimationContext/index.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/QrCodeContext/QrCodeContext.js';
 import 'react-i18next';
+import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
@@ -51,7 +52,6 @@ import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import 'formik';
 import 'yup';
 import { IconButton } from '../../components/IconButton/IconButton.js';
-import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import '../../components/Alert/Alert.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';

package/src/lib/views/EmailUpdate/EmailUpdate.cjs

@@ -5,11 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _tslib = require('../../../../_virtual/_tslib.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var iconic = require('@dynamic-labs/iconic');
 var utils = require('@dynamic-labs/utils');
 var Typography = require('../../components/Typography/Typography.cjs');
 require('@dynamic-labs/sdk-api');
 var logger = require('../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
 var chevronLeft = require('../../shared/assets/chevron-left.cjs');
@@ -54,6 +54,7 @@ require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('formik');
 require('yup');
 var Button = require('../../components/Button/Button.cjs');
+var ModalHeader = require('../../components/ModalHeader/ModalHeader.cjs');
 var IconButton = require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
@@ -73,6 +74,7 @@ const EmailUpdate = () => {
         setView('verify-email');
         setError(undefined);
     };
+    const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: handleBackClick, "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
     // If user tries to update an email for logged user there is already an authToken and onboardingOnlyJwt is undefined
     // If user tries to update the email in the authFlow, authToken is undefined and onboardingOnlyJwt is defined
     const jwtToken = authToken || onboardingOnlyJwt;
@@ -106,12 +108,9 @@ const EmailUpdate = () => {
             setLoading(false);
         }
     });
-    return (jsxRuntime.jsxs("div", { className: 'email-update__container', children: [jsxRuntime.jsx("div", { className: 'email-update__header', children: jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: handleBackClick, "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }) }), jsxRuntime.jsx(iconic.SignInWithEmailIcon, { style: {
-                    height: '3.125rem',
-                    width: '3.125rem',
-                }, className: 'email-update__icon' }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'title', className: 'email-update__title', children: "Update Email" }), jsxRuntime.jsxs("div", { className: 'email-update__copy-text-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "Your current email address is" }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: email })] }), jsxRuntime.jsx(Input.Input, { id: 'email_field', onChange: (e) => {
-                    setUpdatedEmail(e.target.value);
-                }, type: 'email', label: 'Email address', className: 'email-update__input', error: Boolean(emailError), message: emailError }), jsxRuntime.jsx(Button.Button, { buttonVariant: 'primary', buttonPadding: 'medium', buttonClassName: 'email-update__button', onClick: () => handleEmailUpdate(), loading: loading, children: "Send Verification Code" })] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, displayLeading: true, displayBorder: true, children: jsxRuntime.jsx(Typography.Typography, { as: 'h1', variant: 'title', color: 'primary', "data-testid": 'dynamic-auth-modal-heading', className: 'header__typography', children: "Update email" }) }), jsxRuntime.jsxs("div", { className: 'email-update__container', children: [jsxRuntime.jsxs("div", { className: 'email-update__copy-text-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "Your current email address is" }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: email })] }), jsxRuntime.jsx(Input.Input, { id: 'email_field', onChange: (e) => {
+                            setUpdatedEmail(e.target.value);
+                        }, type: 'email', label: 'Email address', className: 'email-update__input', error: Boolean(emailError), message: emailError }), jsxRuntime.jsx(Button.Button, { buttonVariant: 'primary', buttonPadding: 'medium', buttonClassName: 'email-update__button', onClick: () => handleEmailUpdate(), loading: loading, children: "Send Verification Code" })] })] }));
 };
 
 exports.EmailUpdate = EmailUpdate;

package/src/lib/views/EmailUpdate/EmailUpdate.js

@@ -1,11 +1,11 @@
 import { __awaiter } from '../../../../_virtual/_tslib.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { SignInWithEmailIcon } from '@dynamic-labs/iconic';
 import { EmailAlreadyExistsError } from '@dynamic-labs/utils';
 import { Typography } from '../../components/Typography/Typography.js';
 import '@dynamic-labs/sdk-api';
 import { logger } from '../../shared/logger.js';
+import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgChevronLeft } from '../../shared/assets/chevron-left.js';
@@ -50,6 +50,7 @@ import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import 'formik';
 import 'yup';
 import { Button } from '../../components/Button/Button.js';
+import { ModalHeader } from '../../components/ModalHeader/ModalHeader.js';
 import { IconButton } from '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import '../../components/Popper/Popper/Popper.js';
@@ -69,6 +70,7 @@ const EmailUpdate = () => {
         setView('verify-email');
         setError(undefined);
     };
+    const backButton = (jsx(IconButton, { type: 'button', onClick: handleBackClick, "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
     // If user tries to update an email for logged user there is already an authToken and onboardingOnlyJwt is undefined
     // If user tries to update the email in the authFlow, authToken is undefined and onboardingOnlyJwt is defined
     const jwtToken = authToken || onboardingOnlyJwt;
@@ -102,12 +104,9 @@ const EmailUpdate = () => {
             setLoading(false);
         }
     });
-    return (jsxs("div", { className: 'email-update__container', children: [jsx("div", { className: 'email-update__header', children: jsx(IconButton, { type: 'button', onClick: handleBackClick, "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }) }), jsx(SignInWithEmailIcon, { style: {
-                    height: '3.125rem',
-                    width: '3.125rem',
-                }, className: 'email-update__icon' }), jsx(Typography, { weight: 'medium', variant: 'title', className: 'email-update__title', children: "Update Email" }), jsxs("div", { className: 'email-update__copy-text-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "Your current email address is" }), jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: email })] }), jsx(Input, { id: 'email_field', onChange: (e) => {
-                    setUpdatedEmail(e.target.value);
-                }, type: 'email', label: 'Email address', className: 'email-update__input', error: Boolean(emailError), message: emailError }), jsx(Button, { buttonVariant: 'primary', buttonPadding: 'medium', buttonClassName: 'email-update__button', onClick: () => handleEmailUpdate(), loading: loading, children: "Send Verification Code" })] }));
+    return (jsxs(Fragment, { children: [jsx(ModalHeader, { leading: backButton, displayLeading: true, displayBorder: true, children: jsx(Typography, { as: 'h1', variant: 'title', color: 'primary', "data-testid": 'dynamic-auth-modal-heading', className: 'header__typography', children: "Update email" }) }), jsxs("div", { className: 'email-update__container', children: [jsxs("div", { className: 'email-update__copy-text-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "Your current email address is" }), jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: email })] }), jsx(Input, { id: 'email_field', onChange: (e) => {
+                            setUpdatedEmail(e.target.value);
+                        }, type: 'email', label: 'Email address', className: 'email-update__input', error: Boolean(emailError), message: emailError }), jsx(Button, { buttonVariant: 'primary', buttonPadding: 'medium', buttonClassName: 'email-update__button', onClick: () => handleEmailUpdate(), loading: loading, children: "Send Verification Code" })] })] }));
 };
 
 export { EmailUpdate };

package/src/lib/views/EmailVerification/EmailVerification.cjs

@@ -11,7 +11,6 @@ var decodeJwt = require('../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
-var close = require('../../shared/assets/close.cjs');
 var check = require('../../shared/assets/check.cjs');
 var checkCircle = require('../../shared/assets/check-circle.cjs');
 var signInWithEmail = require('../../shared/assets/sign-in-with-email.cjs');
@@ -64,9 +63,7 @@ require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs'
 require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('formik');
 require('yup');
-var ModalHeader = require('../../components/ModalHeader/ModalHeader.cjs');
-var IconButton = require('../../components/IconButton/IconButton.cjs');
-var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
+require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var useCountdown = require('../../utils/hooks/useCountdown/useCountdown.cjs');
 var useOnUnmount = require('../../utils/hooks/useOnUnmount/useOnUnmount.cjs');
@@ -82,6 +79,7 @@ var EmailVerificationContext = require('../../context/EmailVerificationContext/E
 const SECONDS_TO_RETRY = 15;
 const sleepToShowSuccessMessage = () => utils.sleep(1500);
 const EmailVerification = () => {
+    var _a, _b;
     const [hideRetryButton, setHideRetryButton] = React.useState(false);
     const [retried, setRetried] = React.useState(false);
     const [showTransferMessage, setShowTransferMessage] = React.useState(false);
@@ -95,7 +93,7 @@ const EmailVerification = () => {
     const { view, setView, goToInitialView } = ViewContext.useViewContext();
     const { error, setError, setErrorMessage } = ErrorContext.useErrorContext();
     const { setExistentAccountData } = AccountExistsContext.useAccountExistsContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, isVerificationInProgress, projectSettings, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, projectSettings, } = useInternalDynamicContext.useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = EmailVerificationContext.useEmailVerificationContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
     const { createEmbeddedWallet } = useEmbeddedWallet.useEmbeddedWallet();
@@ -121,13 +119,8 @@ const EmailVerification = () => {
     const isLoginView = view === 'login-with-email-verification';
     const { verifyEmail } = useEmailVerificationRequest.useEmailVerificationRequest();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback.useCreateUserProfileByJWTCallback();
-    const close$1 = () => {
-        setShowAuthFlow(false);
-        if (isVerificationInProgress)
-            setIsVerificationInProgress(false);
-    };
     const handleComplete = React.useCallback((verificationToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        var _a;
+        var _c;
         setError(undefined);
         setLoading(true);
         if (!verificationUUID || (!authToken && !onboardingOnlyJwt)) {
@@ -148,7 +141,7 @@ const EmailVerification = () => {
             try {
                 // this function will check turnkey wallet enabled and create wallet if needed
                 // if not enabled, it will throw an error.
-                if ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _a === void 0 ? void 0 : _a.automaticEmbeddedWalletCreation) {
+                if ((_c = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _c === void 0 ? void 0 : _c.automaticEmbeddedWalletCreation) {
                     yield createEmbeddedWallet();
                 }
             }
@@ -179,13 +172,14 @@ const EmailVerification = () => {
         verifyEmail,
         setOnboardingOnlyJwt,
         setCallback,
+        (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _a === void 0 ? void 0 : _a.automaticEmbeddedWalletCreation,
         createEmbeddedWallet,
         setShowAuthFlow,
         setErrorMessage,
         setView,
     ]);
     const handleEmailLogin = React.useCallback((verificationToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        var _b;
+        var _d;
         setError(undefined);
         setLoading(true);
         if (!verificationUUID) {
@@ -219,7 +213,7 @@ const EmailVerification = () => {
             try {
                 // this function will check turnkey wallet enabled and create wallet if needed
                 // if not enabled, it will throw an error.
-                if ((_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.automaticEmbeddedWalletCreation) {
+                if ((_d = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _d === void 0 ? void 0 : _d.automaticEmbeddedWalletCreation) {
                     yield createEmbeddedWallet();
                 }
             }
@@ -252,6 +246,7 @@ const EmailVerification = () => {
         createUserProfileByJWT,
         setOnboardingOnlyJwt,
         setView,
+        (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.automaticEmbeddedWalletCreation,
         createEmbeddedWallet,
         setShowAuthFlow,
         setErrorMessage,
@@ -292,14 +287,13 @@ const EmailVerification = () => {
         callCallbackOnUnmount.current = false;
         setView('update-email');
     };
-    const closeButton = (jsxRuntime.jsx(IconButton.IconButton, { onClick: close$1, type: 'button', "data-testid": 'close-button', children: jsxRuntime.jsx(close.ReactComponent, {}) }));
     const EmailIcon = React.useMemo(() => {
         const EmailIcon = (props) => (jsxRuntime.jsx(Icon.Icon, { color: 'brand-primary', children: jsxRuntime.jsx(signInWithEmail.ReactComponent, Object.assign({}, props)) }));
         return EmailIcon;
     }, []);
-    return (jsxRuntime.jsxs("div", { className: 'email-verification__container', children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { withIcon: false, className: 'email-verification__error-message', children: error })), showTransferMessage && (jsxRuntime.jsx("div", { className: 'email-verification__transfer-message', children: "Verification complete, the email is now verified to this account." })), jsxRuntime.jsx(ModalHeader.ModalHeader, { style: { paddingBlock: 0 }, trailing: !isLoginView && closeButton, children: isValidated ? (jsxRuntime.jsx("div", { className: 'email-verification__icon-container', children: jsxRuntime.jsx(IconWithStatus.IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: EmailIcon, iconSize: 50, InnerIcon: check.ReactComponent }) })) : (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { className: classNames.classNames({
-                        'email-verification__icon-with-spinner': Boolean(!error),
-                    }), Icon: EmailIcon, iconSize: 80, isSpinning: true })) }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary', children: "Confirm verification code" }), jsxRuntime.jsxs("div", { className: 'email-verification__copy-text-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "We\u2019ve sent a verification code to" }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: shortenEmail.shortenEmail(email) })] }), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, { onClick: updateEmail, className: 'email-verification__text-button', disabled: loading, children: "Edit email" })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Re-send code in ", remainingSeconds] }), jsxRuntime.jsxs("span", { className: 'email-verification__retry-container', children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text', children: "Code sent" })] })] })) : (!hideRetryButton && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'secondary', children: "Did not receive your code yet?" }), jsxRuntime.jsx(TextButton.TextButton, { className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry(), children: "Re-send code" })] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, { className: 'email-verification__log-out', onClick: handleLogOut, children: "Log out" })), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { withIcon: false, className: 'email-verification__error-message', children: error })), jsxRuntime.jsxs("div", { className: classNames.classNames('email-verification__container', {
+                    'email-verification__container--error': Boolean(error),
+                }), children: [showTransferMessage && (jsxRuntime.jsx("div", { className: 'email-verification__transfer-message', children: "Verification complete, the email is now verified to this account." })), isValidated ? (jsxRuntime.jsx("div", { className: 'email-verification__icon-container', children: jsxRuntime.jsx(IconWithStatus.IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: EmailIcon, iconSize: 64, InnerIcon: check.ReactComponent }) })) : (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: EmailIcon, iconSize: 96, isSpinning: true, className: 'email-verification__icon-with-spinner' })), jsxRuntime.jsxs("div", { className: 'email-verification__copy-text-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "We\u2019ve sent a verification code to" }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: shortenEmail.shortenEmail(email) })] }), !isLoginView && !isValidated && (jsxRuntime.jsx(TextButton.TextButton, { onClick: updateEmail, className: 'email-verification__text-button', disabled: loading, children: "Edit email" })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'email-verification__retry-text', children: ["Re-send code in ", remainingSeconds] }), jsxRuntime.jsxs("span", { className: 'email-verification__retry-container', children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text', children: "Code sent" })] })] })) : (!hideRetryButton && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { className: 'email-verification__retry-copy', variant: 'body_small', weight: 'medium', color: 'secondary', children: "Did not receive your code yet?" }), jsxRuntime.jsx(TextButton.TextButton, { className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry(), children: "Re-send code" })] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, { className: 'email-verification__log-out', onClick: handleLogOut, children: "Log out" }))] })] }));
 };
 
 exports.EmailVerification = EmailVerification;

package/src/lib/views/EmailVerification/EmailVerification.js

@@ -1,5 +1,5 @@
 import { __awaiter } from '../../../../_virtual/_tslib.js';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState, useRef, useCallback, useMemo } from 'react';
 import { UserHasAccountWithEmailError, NoAccessError, AccountExistsError, sleep } from '@dynamic-labs/utils';
 import { Typography } from '../../components/Typography/Typography.js';
@@ -7,7 +7,6 @@ import { decodeJwt } from '../../shared/utils/functions/decodeJwt/decodeJwt.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
-import { ReactComponent as SvgClose } from '../../shared/assets/close.js';
 import { ReactComponent as SvgCheck } from '../../shared/assets/check.js';
 import { ReactComponent as SvgCheckCircle } from '../../shared/assets/check-circle.js';
 import { ReactComponent as SvgSignInWithEmail } from '../../shared/assets/sign-in-with-email.js';
@@ -60,9 +59,7 @@ import '../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
 import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import 'formik';
 import 'yup';
-import { ModalHeader } from '../../components/ModalHeader/ModalHeader.js';
-import { IconButton } from '../../components/IconButton/IconButton.js';
-import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
+import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { useCountdown } from '../../utils/hooks/useCountdown/useCountdown.js';
 import { useOnUnmount } from '../../utils/hooks/useOnUnmount/useOnUnmount.js';
@@ -78,6 +75,7 @@ import { useEmailVerificationContext } from '../../context/EmailVerificationCont
 const SECONDS_TO_RETRY = 15;
 const sleepToShowSuccessMessage = () => sleep(1500);
 const EmailVerification = () => {
+    var _a, _b;
     const [hideRetryButton, setHideRetryButton] = useState(false);
     const [retried, setRetried] = useState(false);
     const [showTransferMessage, setShowTransferMessage] = useState(false);
@@ -91,7 +89,7 @@ const EmailVerification = () => {
     const { view, setView, goToInitialView } = useViewContext();
     const { error, setError, setErrorMessage } = useErrorContext();
     const { setExistentAccountData } = useAccountExistsContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, isVerificationInProgress, projectSettings, } = useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, projectSettings, } = useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = useEmailVerificationContext();
     const { loading, setLoading } = useLoadingContext();
     const { createEmbeddedWallet } = useEmbeddedWallet();
@@ -117,13 +115,8 @@ const EmailVerification = () => {
     const isLoginView = view === 'login-with-email-verification';
     const { verifyEmail } = useEmailVerificationRequest();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback();
-    const close = () => {
-        setShowAuthFlow(false);
-        if (isVerificationInProgress)
-            setIsVerificationInProgress(false);
-    };
     const handleComplete = useCallback((verificationToken) => __awaiter(void 0, void 0, void 0, function* () {
-        var _a;
+        var _c;
         setError(undefined);
         setLoading(true);
         if (!verificationUUID || (!authToken && !onboardingOnlyJwt)) {
@@ -144,7 +137,7 @@ const EmailVerification = () => {
             try {
                 // this function will check turnkey wallet enabled and create wallet if needed
                 // if not enabled, it will throw an error.
-                if ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _a === void 0 ? void 0 : _a.automaticEmbeddedWalletCreation) {
+                if ((_c = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _c === void 0 ? void 0 : _c.automaticEmbeddedWalletCreation) {
                     yield createEmbeddedWallet();
                 }
             }
@@ -175,13 +168,14 @@ const EmailVerification = () => {
         verifyEmail,
         setOnboardingOnlyJwt,
         setCallback,
+        (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _a === void 0 ? void 0 : _a.automaticEmbeddedWalletCreation,
         createEmbeddedWallet,
         setShowAuthFlow,
         setErrorMessage,
         setView,
     ]);
     const handleEmailLogin = useCallback((verificationToken) => __awaiter(void 0, void 0, void 0, function* () {
-        var _b;
+        var _d;
         setError(undefined);
         setLoading(true);
         if (!verificationUUID) {
@@ -215,7 +209,7 @@ const EmailVerification = () => {
             try {
                 // this function will check turnkey wallet enabled and create wallet if needed
                 // if not enabled, it will throw an error.
-                if ((_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.automaticEmbeddedWalletCreation) {
+                if ((_d = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _d === void 0 ? void 0 : _d.automaticEmbeddedWalletCreation) {
                     yield createEmbeddedWallet();
                 }
             }
@@ -248,6 +242,7 @@ const EmailVerification = () => {
         createUserProfileByJWT,
         setOnboardingOnlyJwt,
         setView,
+        (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.automaticEmbeddedWalletCreation,
         createEmbeddedWallet,
         setShowAuthFlow,
         setErrorMessage,
@@ -288,14 +283,13 @@ const EmailVerification = () => {
         callCallbackOnUnmount.current = false;
         setView('update-email');
     };
-    const closeButton = (jsx(IconButton, { onClick: close, type: 'button', "data-testid": 'close-button', children: jsx(SvgClose, {}) }));
     const EmailIcon = useMemo(() => {
         const EmailIcon = (props) => (jsx(Icon, { color: 'brand-primary', children: jsx(SvgSignInWithEmail, Object.assign({}, props)) }));
         return EmailIcon;
     }, []);
-    return (jsxs("div", { className: 'email-verification__container', children: [error && (jsx(ErrorContainer, { withIcon: false, className: 'email-verification__error-message', children: error })), showTransferMessage && (jsx("div", { className: 'email-verification__transfer-message', children: "Verification complete, the email is now verified to this account." })), jsx(ModalHeader, { style: { paddingBlock: 0 }, trailing: !isLoginView && closeButton, children: isValidated ? (jsx("div", { className: 'email-verification__icon-container', children: jsx(IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: EmailIcon, iconSize: 50, InnerIcon: SvgCheck }) })) : (jsx(IconWithSpinner, { className: classNames({
-                        'email-verification__icon-with-spinner': Boolean(!error),
-                    }), Icon: EmailIcon, iconSize: 80, isSpinning: true })) }), jsx(Typography, { weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary', children: "Confirm verification code" }), jsxs("div", { className: 'email-verification__copy-text-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "We\u2019ve sent a verification code to" }), jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: shortenEmail(email) })] }), !isLoginView && (jsx(TextButton, { onClick: updateEmail, className: 'email-verification__text-button', disabled: loading, children: "Edit email" })), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxs(Fragment, { children: [jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Re-send code in ", remainingSeconds] }), jsxs("span", { className: 'email-verification__retry-container', children: [jsx(SvgCheckCircle, {}), jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text', children: "Code sent" })] })] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'secondary', children: "Did not receive your code yet?" }), jsx(TextButton, { className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry(), children: "Re-send code" })] }))), !isLoginView && (jsx(TextButton, { className: 'email-verification__log-out', onClick: handleLogOut, children: "Log out" })), jsx(PoweredByDynamic, {})] }));
+    return (jsxs(Fragment, { children: [error && (jsx(ErrorContainer, { withIcon: false, className: 'email-verification__error-message', children: error })), jsxs("div", { className: classNames('email-verification__container', {
+                    'email-verification__container--error': Boolean(error),
+                }), children: [showTransferMessage && (jsx("div", { className: 'email-verification__transfer-message', children: "Verification complete, the email is now verified to this account." })), isValidated ? (jsx("div", { className: 'email-verification__icon-container', children: jsx(IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: EmailIcon, iconSize: 64, InnerIcon: SvgCheck }) })) : (jsx(IconWithSpinner, { Icon: EmailIcon, iconSize: 96, isSpinning: true, className: 'email-verification__icon-with-spinner' })), jsxs("div", { className: 'email-verification__copy-text-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: "We\u2019ve sent a verification code to" }), jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', children: shortenEmail(email) })] }), !isLoginView && !isValidated && (jsx(TextButton, { onClick: updateEmail, className: 'email-verification__text-button', disabled: loading, children: "Edit email" })), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxs(Fragment, { children: [jsxs(Typography, { variant: 'body_small', color: 'secondary', className: 'email-verification__retry-text', children: ["Re-send code in ", remainingSeconds] }), jsxs("span", { className: 'email-verification__retry-container', children: [jsx(SvgCheckCircle, {}), jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text', children: "Code sent" })] })] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, { className: 'email-verification__retry-copy', variant: 'body_small', weight: 'medium', color: 'secondary', children: "Did not receive your code yet?" }), jsx(TextButton, { className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry(), children: "Re-send code" })] }))), !isLoginView && (jsx(TextButton, { className: 'email-verification__log-out', onClick: handleLogOut, children: "Log out" }))] })] }));
 };
 
 export { EmailVerification };

package/src/lib/views/EmailWalletOTPVerificationView/EmailWalletOTPVerificationView.cjs

@@ -61,7 +61,7 @@ var useMutation = require('../../utils/hooks/useMutation/useMutation.cjs');
 const EmailWalletOTPVerificationView = () => {
     const { setView } = ViewContext.useViewContext();
     const [error, setError] = React.useState();
-    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, setShowAuthFlow, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, } = useInternalDynamicContext.useInternalDynamicContext();
     if (!emailWalletConnector ||
         !walletConnectorCore.isEmailOTPWalletConnector(emailWalletConnector)) {
         throw new Error('Current wallet is not EmailWalletConnector');
@@ -75,11 +75,10 @@ const EmailWalletOTPVerificationView = () => {
         clearStatesOnBackClick();
         setView('login-with-email-or-wallet');
     };
-    const handleOnClickClose = () => setShowAuthFlow(false);
     const { data: isValid, isLoading, mutate: onSubmit, } = useMutation.useMutation((otp) => emailWalletConnector.verifyOneTimePassword(otp), {
         onFailure: (error) => setError(error),
     });
-    return (jsxRuntime.jsx(OTPVerificationView.OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, onPinChange: () => setError(undefined), onClickClose: handleOnClickClose, onClickEditEmail: handleBackClick, displayPoweredByDynamic: true, successBannerText: 'Sign in to access your email based wallet' }));
+    return (jsxRuntime.jsx(OTPVerificationView.OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, onPinChange: () => setError(undefined), onClickEditEmail: handleBackClick, successBannerText: 'Sign in to access your email based wallet' }));
 };
 
 exports.EmailWalletOTPVerificationView = EmailWalletOTPVerificationView;

package/src/lib/views/EmailWalletOTPVerificationView/EmailWalletOTPVerificationView.js

@@ -57,7 +57,7 @@ import { useMutation } from '../../utils/hooks/useMutation/useMutation.js';
 const EmailWalletOTPVerificationView = () => {
     const { setView } = useViewContext();
     const [error, setError] = useState();
-    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, setShowAuthFlow, } = useInternalDynamicContext();
+    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, } = useInternalDynamicContext();
     if (!emailWalletConnector ||
         !isEmailOTPWalletConnector(emailWalletConnector)) {
         throw new Error('Current wallet is not EmailWalletConnector');
@@ -71,11 +71,10 @@ const EmailWalletOTPVerificationView = () => {
         clearStatesOnBackClick();
         setView('login-with-email-or-wallet');
     };
-    const handleOnClickClose = () => setShowAuthFlow(false);
     const { data: isValid, isLoading, mutate: onSubmit, } = useMutation((otp) => emailWalletConnector.verifyOneTimePassword(otp), {
         onFailure: (error) => setError(error),
     });
-    return (jsx(OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, onPinChange: () => setError(undefined), onClickClose: handleOnClickClose, onClickEditEmail: handleBackClick, displayPoweredByDynamic: true, successBannerText: 'Sign in to access your email based wallet' }));
+    return (jsx(OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, onPinChange: () => setError(undefined), onClickEditEmail: handleBackClick, successBannerText: 'Sign in to access your email based wallet' }));
 };
 
 export { EmailWalletOTPVerificationView };

package/src/lib/views/LoginView/LoginView.cjs

@@ -8,7 +8,6 @@ var Divider = require('../../components/Divider/Divider.cjs');
 var ErrorContext = require('../../context/ErrorContext/ErrorContext.cjs');
 var ErrorContainer = require('../../components/ErrorContainer/ErrorContainer.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
-var useAuthLayoutChecks = require('../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.cjs');
 var classNames = require('../../utils/functions/classNames/classNames.cjs');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
 var WalletList = require('../WalletList/WalletList.cjs');
@@ -20,7 +19,6 @@ var useLoginView = require('./useLoginView.cjs');
 const LoginView = () => {
     const { error } = ErrorContext.useErrorContext();
     const { loading } = LoadingContext.useLoadingContext();
-    const { showToSFooter } = useAuthLayoutChecks.useAuthLayoutChecks();
     const { view, setView } = ViewContext.useViewContext();
     const { isWalletOnly, logingViewSections } = useLoginView.useLoginView();
     const [showWalletList, setShowWalletList] = React.useState(isWalletOnly);
@@ -62,9 +60,9 @@ const LoginView = () => {
     if (showWalletList) {
         return jsxRuntime.jsx(WalletList.WalletList, {});
     }
-    return (jsxRuntime.jsxs("div", { className: 'login-with-email__container', children: [error && jsxRuntime.jsx(ErrorContainer.ErrorContainer, { children: error }), jsxRuntime.jsx("div", { className: classNames.classNames('login-with-email__scroll', {
-                    'login-with-email__scroll--with-footer': showToSFooter,
-                }), "data-testid": 'login-with-email-scroll', children: renderViewSections })] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { className: 'login-with-email__error-container', withIcon: false, children: error })), jsxRuntime.jsx("div", { className: classNames.classNames('login-with-email__container', {
+                    'login-with-email__container--error': Boolean(error),
+                }), children: jsxRuntime.jsx("div", { className: 'login-with-email__scroll', "data-testid": 'login-with-email-scroll', children: renderViewSections }) })] }));
 };
 
 exports.LoginView = LoginView;

package/src/lib/views/LoginView/LoginView.js

@@ -1,10 +1,9 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect, useMemo } from 'react';
 import { Divider } from '../../components/Divider/Divider.js';
 import { useErrorContext } from '../../context/ErrorContext/ErrorContext.js';
 import { ErrorContainer } from '../../components/ErrorContainer/ErrorContainer.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
-import { useAuthLayoutChecks } from '../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.js';
 import { classNames } from '../../utils/functions/classNames/classNames.js';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { WalletList } from '../WalletList/WalletList.js';
@@ -16,7 +15,6 @@ import { useLoginView } from './useLoginView.js';
 const LoginView = () => {
     const { error } = useErrorContext();
     const { loading } = useLoadingContext();
-    const { showToSFooter } = useAuthLayoutChecks();
     const { view, setView } = useViewContext();
     const { isWalletOnly, logingViewSections } = useLoginView();
     const [showWalletList, setShowWalletList] = useState(isWalletOnly);
@@ -58,9 +56,9 @@ const LoginView = () => {
     if (showWalletList) {
         return jsx(WalletList, {});
     }
-    return (jsxs("div", { className: 'login-with-email__container', children: [error && jsx(ErrorContainer, { children: error }), jsx("div", { className: classNames('login-with-email__scroll', {
-                    'login-with-email__scroll--with-footer': showToSFooter,
-                }), "data-testid": 'login-with-email-scroll', children: renderViewSections })] }));
+    return (jsxs(Fragment, { children: [error && (jsx(ErrorContainer, { className: 'login-with-email__error-container', withIcon: false, children: error })), jsx("div", { className: classNames('login-with-email__container', {
+                    'login-with-email__container--error': Boolean(error),
+                }), children: jsx("div", { className: 'login-with-email__scroll', "data-testid": 'login-with-email-scroll', children: renderViewSections }) })] }));
 };
 
 export { LoginView };

package/src/lib/views/LoginView/sections/EmailSignInSection/LoginEmailForm.cjs

@@ -11,7 +11,7 @@ var sdkApi = require('@dynamic-labs/sdk-api');
 var logger = require('../../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('../../../../context/ViewContext/ViewContext.cjs');
-var arrowRight = require('../../../../shared/assets/arrow-right.cjs');
+var arrowRightCircle = require('../../../../shared/assets/arrow-right-circle.cjs');
 require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
@@ -82,7 +82,7 @@ const LoginEmailForm = ({ isLoading: isExternalLoading, onSubmit, onSubmitError,
     };
     // will be true if blocto or magic email are enabled
     const isEmailWalletProviderEnabled = emailWalletConnector !== undefined;
-    const emailInputSuffixIcon = (jsxRuntime.jsx(IconButton.IconButton, { "data-testid": 'email_submit_button', type: 'submit', className: `icon-button${((_a = emailInput === null || emailInput === void 0 ? void 0 : emailInput.trim()) === null || _a === void 0 ? void 0 : _a.length) ? '--visible' : ''}`, disabled: isLoading, children: jsxRuntime.jsx(arrowRight.ReactComponent, {}) }));
+    const emailInputSuffixIcon = (jsxRuntime.jsx(IconButton.IconButton, { "data-testid": 'email_submit_button', type: 'submit', className: `icon-button${((_a = emailInput === null || emailInput === void 0 ? void 0 : emailInput.trim()) === null || _a === void 0 ? void 0 : _a.length) ? '--visible' : ''}`, disabled: isLoading, children: jsxRuntime.jsx(arrowRightCircle.ReactComponent, {}) }));
     const handleSubmit = (e) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         e.preventDefault();
         if (!EMAIL_REGEX.test(emailInput)) {

package/src/lib/views/LoginView/sections/EmailSignInSection/LoginEmailForm.js

@@ -7,7 +7,7 @@ import { ProviderEnum } from '@dynamic-labs/sdk-api';
 import { logger } from '../../../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '../../../../context/ViewContext/ViewContext.js';
-import { ReactComponent as SvgArrowRight } from '../../../../shared/assets/arrow-right.js';
+import { ReactComponent as SvgArrowRightCircle } from '../../../../shared/assets/arrow-right-circle.js';
 import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
@@ -78,7 +78,7 @@ const LoginEmailForm = ({ isLoading: isExternalLoading, onSubmit, onSubmitError,
     };
     // will be true if blocto or magic email are enabled
     const isEmailWalletProviderEnabled = emailWalletConnector !== undefined;
-    const emailInputSuffixIcon = (jsx(IconButton, { "data-testid": 'email_submit_button', type: 'submit', className: `icon-button${((_a = emailInput === null || emailInput === void 0 ? void 0 : emailInput.trim()) === null || _a === void 0 ? void 0 : _a.length) ? '--visible' : ''}`, disabled: isLoading, children: jsx(SvgArrowRight, {}) }));
+    const emailInputSuffixIcon = (jsx(IconButton, { "data-testid": 'email_submit_button', type: 'submit', className: `icon-button${((_a = emailInput === null || emailInput === void 0 ? void 0 : emailInput.trim()) === null || _a === void 0 ? void 0 : _a.length) ? '--visible' : ''}`, disabled: isLoading, children: jsx(SvgArrowRightCircle, {}) }));
     const handleSubmit = (e) => __awaiter(void 0, void 0, void 0, function* () {
         e.preventDefault();
         if (!EMAIL_REGEX.test(emailInput)) {