@dynamic-labs/sdk-react-core 0.19.0-alpha.0 → 0.19.0-alpha.2

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

@@ -2,6 +2,7 @@ import { __awaiter } from '../../../../_virtual/_tslib.js';
 import { jsxs, jsx } 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';
@@ -9,7 +10,6 @@ import '@dynamic-labs/wallet-connector-core';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgChevronLeft } from '../../shared/assets/chevron-left.js';
 import '@dynamic-labs/wallet-book';
-import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
@@ -33,16 +33,19 @@ import '../../context/AccountExistsContext/AccountExistsContext.js';
 import { IconButton } from '../../components/IconButton/IconButton.js';
 import { Button } from '../../components/Button/Button.js';
 import '../../components/Alert/Alert.js';
+import 'formik';
+import 'yup';
+import '../CollectUserDataView/fieldsConfig.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
-import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '@dynamic-labs/types';
+import '../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
-import 'formik';
-import 'yup';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
-import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
 
 const EmailUpdate = () => {
@@ -51,18 +54,23 @@ const EmailUpdate = () => {
     const { loading, setLoading } = useLoadingContext();
     const { setView, goToInitialView } = useViewContext();
     const { email, setEmail, setVerificationUUID } = useEmailVerificationContext();
-    const { environmentId, handleLogOut, onboardingOnlyJwt } = useInternalDynamicContext();
+    const { environmentId, handleLogOut, onboardingOnlyJwt, authToken } = useInternalDynamicContext();
+    const [emailError, setEmailError] = useState(undefined);
     const handleBackClick = () => {
         setView('verify-email');
         setError(undefined);
     };
+    // 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;
     const handleEmailUpdate = () => __awaiter(void 0, void 0, void 0, function* () {
         try {
             if (!updatedEmail) {
                 return;
             }
+            setEmailError(undefined);
             setLoading(true);
-            const { emailVerification } = yield updateUserProfileFields(onboardingOnlyJwt, environmentId, { email: updatedEmail });
+            const { emailVerification } = yield updateUserProfileFields(jwtToken, environmentId, { email: updatedEmail });
             if (!emailVerification) {
                 yield handleLogOut();
                 goToInitialView();
@@ -75,6 +83,10 @@ const EmailUpdate = () => {
         }
         catch (error) {
             logger.debug(error);
+            if (error instanceof EmailAlreadyExistsError) {
+                setEmailError('Email already exists');
+                return;
+            }
             setErrorMessage(error.code);
         }
         finally {
@@ -86,7 +98,7 @@ const EmailUpdate = () => {
                     width: '3.125rem',
                 }, className: 'email-update__icon' }), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-update__title' }, { children: "Update Email" })), jsxs("div", Object.assign({ className: 'email-update__copy-text-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Your current email address is" })), jsx(Typography, Object.assign({ 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' }), jsx(Button, Object.assign({ buttonVariant: 'primary', buttonPadding: 'medium', buttonClassName: 'email-update__button', onClick: () => handleEmailUpdate(), loading: loading }, { children: "Send Verification Code" }))] })));
+                }, type: 'email', label: 'Email address', className: 'email-update__input', error: Boolean(emailError), message: emailError }), jsx(Button, Object.assign({ 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,6 +11,7 @@ var Typography = require('../../components/Typography/Typography.cjs');
 var decodeJwt = require('../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
 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 logger = require('../../shared/logger.cjs');
@@ -18,6 +19,7 @@ require('@dynamic-labs/wallet-book');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
+var useEffectOnce = require('../../shared/utils/hooks/useEffectOnce/useEffectOnce.cjs');
 require('../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -36,49 +38,80 @@ require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetu
 var ErrorContext = require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 var AccountExistsContext = require('../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../components/IconButton/IconButton.cjs');
+var ModalHeader = require('../../components/ModalHeader/ModalHeader.cjs');
+var IconButton = require('../../components/IconButton/IconButton.cjs');
 var IconWithStatus = require('../../components/IconWithStatus/IconWithStatus.cjs');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 require('../../components/Alert/Alert.cjs');
+require('formik');
+require('yup');
+require('../CollectUserDataView/fieldsConfig.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
-require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+var useEmailVerificationRequest = require('../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.cjs');
 var useCountdown = require('../../utils/hooks/useCountdown/useCountdown.cjs');
+require('@dynamic-labs/types');
+var useCreateUserProfileByJWTCallback = require('../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs');
+require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+var useOnUnmount = require('../../utils/hooks/useOnUnmount/useOnUnmount.cjs');
 var TextButton = require('../../components/TextButton/TextButton.cjs');
 var ErrorContainer = require('../../components/ErrorContainer/ErrorContainer.cjs');
 var PinField = require('../../components/PinField/PinField.cjs');
 var shortenEmail = require('../../shared/utils/functions/shortenEmail/shortenEmail.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
-require('formik');
-require('yup');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
-var useEmailVerificationRequest = require('../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.cjs');
-var useCreateUserProfileByJWTCallback = require('../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs');
 
 const SECONDS_TO_RETRY = 15;
 const EmailVerification = () => {
     const [hideRetryButton, setHideRetryButton] = React.useState(false);
     const [retried, setRetried] = React.useState(false);
-    const [isValidated, setIsValidated] = React.useState(false);
     const [showTransferMessage, setShowTransferMessage] = React.useState(false);
+    // Use a state to ensure UI is updated, but also a ref to access in effect cleanup
+    const [isValidated, _setIsValidated] = React.useState(false);
+    const isValidatedRef = React.useRef(isValidated);
+    const setIsValidated = (value) => {
+        _setIsValidated(value);
+        isValidatedRef.current = value;
+    };
     const { view, setView, goToInitialView } = ViewContext.useViewContext();
     const { error, setError, setErrorMessage } = ErrorContext.useErrorContext();
     const { setExistentAccountData } = AccountExistsContext.useAccountExistsContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, isVerificationInProgress, } = useInternalDynamicContext.useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = EmailVerificationContext.useEmailVerificationContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
     const { remainingSeconds, startCountdown } = useCountdown.useCountdown({
         callback: () => setRetried(false),
         seconds: SECONDS_TO_RETRY,
     });
+    // When true, causes the component to call emailVerificationX callback on unmount
+    const callCallbackOnUnmount = React.useRef(true);
+    useOnUnmount.useOnUnmount(() => {
+        if (!callCallbackOnUnmount.current)
+            return;
+        const callback = isValidatedRef.current
+            ? 'emailVerificationSuccess'
+            : 'emailVerificationFailure';
+        setCallback(callback, { email: email !== null && email !== void 0 ? email : '' });
+    });
+    useEffectOnce.useEffectOnce(() => {
+        // Set verification in progress
+        // It should be disabled by either clearStatesOnBackClick, the close button, or onAuthSuccess
+        setIsVerificationInProgress(true);
+    });
     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* () {
         setError(undefined);
         setLoading(true);
@@ -101,6 +134,11 @@ const EmailVerification = () => {
         }
         catch (error) {
             logger.logger.debug(error);
+            // Handle the case where the user has already an account with the email
+            if (error instanceof utils.UserHasAccountWithEmailError) {
+                setView('merge-user-accounts');
+                return; // Early return to not show the error message
+            }
             setErrorMessage(error.code);
         }
         finally {
@@ -119,6 +157,7 @@ const EmailVerification = () => {
         setOnboardingOnlyJwt,
         setCallback,
         setErrorMessage,
+        setView,
     ]);
     const handleEmailLogin = React.useCallback((verificationToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         setError(undefined);
@@ -214,9 +253,15 @@ const EmailVerification = () => {
             setLoading(false);
         }
     });
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), isValidated ? (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsxRuntime.jsx(IconWithStatus.IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent }) }))) : (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { className: classNames.classNames({
-                    'email-verification__icon-with-spinner': Boolean(!error),
-                }), Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) }))] })), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ onClick: () => setView('update-email'), 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, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxRuntime.jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, Object.assign({ 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, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] })));
+    // Go to update email screen, but prevent onEmailVerificationX callback from being called
+    const updateEmail = () => {
+        callCallbackOnUnmount.current = false;
+        setView('update-email');
+    };
+    const closeButton = (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: close$1, type: 'button', "data-testid": 'close-button' }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ style: { paddingBlock: 0 }, trailing: !isLoginView && closeButton }, { children: isValidated ? (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsxRuntime.jsx(IconWithStatus.IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent }) }))) : (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { className: classNames.classNames({
+                        'email-verification__icon-with-spinner': Boolean(!error),
+                    }), Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true })) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) }))] })), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ 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, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxRuntime.jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, Object.assign({ 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, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] })));
 };
 
 exports.EmailVerification = EmailVerification;

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

@@ -1,12 +1,13 @@
 import { __awaiter } from '../../../../_virtual/_tslib.js';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useState, useCallback } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useState, useRef, useCallback } from 'react';
 import { SignInWithEmailIcon } from '@dynamic-labs/iconic';
-import { NoAccessError, AccountExistsError } from '@dynamic-labs/utils';
+import { UserHasAccountWithEmailError, NoAccessError, AccountExistsError } from '@dynamic-labs/utils';
 import { Typography } from '../../components/Typography/Typography.js';
 import { decodeJwt } from '../../shared/utils/functions/decodeJwt/decodeJwt.js';
 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 { logger } from '../../shared/logger.js';
@@ -14,6 +15,7 @@ import '@dynamic-labs/wallet-book';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
+import { useEffectOnce } from '../../shared/utils/hooks/useEffectOnce/useEffectOnce.js';
 import '../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -32,49 +34,80 @@ import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup
 import { useErrorContext } from '../../context/ErrorContext/ErrorContext.js';
 import '../../context/AccessDeniedContext/AccessDeniedContext.js';
 import { useAccountExistsContext } from '../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../components/IconButton/IconButton.js';
+import { ModalHeader } from '../../components/ModalHeader/ModalHeader.js';
+import { IconButton } from '../../components/IconButton/IconButton.js';
 import { IconWithStatus } from '../../components/IconWithStatus/IconWithStatus.js';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import '../../components/Alert/Alert.js';
+import 'formik';
+import 'yup';
+import '../CollectUserDataView/fieldsConfig.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
-import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import { useEmailVerificationRequest } from '../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.js';
 import { useCountdown } from '../../utils/hooks/useCountdown/useCountdown.js';
+import '@dynamic-labs/types';
+import { useCreateUserProfileByJWTCallback } from '../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.js';
+import '../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import { useOnUnmount } from '../../utils/hooks/useOnUnmount/useOnUnmount.js';
 import { TextButton } from '../../components/TextButton/TextButton.js';
 import { ErrorContainer } from '../../components/ErrorContainer/ErrorContainer.js';
 import { PinField } from '../../components/PinField/PinField.js';
 import { shortenEmail } from '../../shared/utils/functions/shortenEmail/shortenEmail.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
-import 'formik';
-import 'yup';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
-import { useEmailVerificationRequest } from '../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.js';
-import { useCreateUserProfileByJWTCallback } from '../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.js';
 
 const SECONDS_TO_RETRY = 15;
 const EmailVerification = () => {
     const [hideRetryButton, setHideRetryButton] = useState(false);
     const [retried, setRetried] = useState(false);
-    const [isValidated, setIsValidated] = useState(false);
     const [showTransferMessage, setShowTransferMessage] = useState(false);
+    // Use a state to ensure UI is updated, but also a ref to access in effect cleanup
+    const [isValidated, _setIsValidated] = useState(false);
+    const isValidatedRef = useRef(isValidated);
+    const setIsValidated = (value) => {
+        _setIsValidated(value);
+        isValidatedRef.current = value;
+    };
     const { view, setView, goToInitialView } = useViewContext();
     const { error, setError, setErrorMessage } = useErrorContext();
     const { setExistentAccountData } = useAccountExistsContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, setIsVerificationInProgress, isVerificationInProgress, } = useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = useEmailVerificationContext();
     const { loading, setLoading } = useLoadingContext();
     const { remainingSeconds, startCountdown } = useCountdown({
         callback: () => setRetried(false),
         seconds: SECONDS_TO_RETRY,
     });
+    // When true, causes the component to call emailVerificationX callback on unmount
+    const callCallbackOnUnmount = useRef(true);
+    useOnUnmount(() => {
+        if (!callCallbackOnUnmount.current)
+            return;
+        const callback = isValidatedRef.current
+            ? 'emailVerificationSuccess'
+            : 'emailVerificationFailure';
+        setCallback(callback, { email: email !== null && email !== void 0 ? email : '' });
+    });
+    useEffectOnce(() => {
+        // Set verification in progress
+        // It should be disabled by either clearStatesOnBackClick, the close button, or onAuthSuccess
+        setIsVerificationInProgress(true);
+    });
     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* () {
         setError(undefined);
         setLoading(true);
@@ -97,6 +130,11 @@ const EmailVerification = () => {
         }
         catch (error) {
             logger.debug(error);
+            // Handle the case where the user has already an account with the email
+            if (error instanceof UserHasAccountWithEmailError) {
+                setView('merge-user-accounts');
+                return; // Early return to not show the error message
+            }
             setErrorMessage(error.code);
         }
         finally {
@@ -115,6 +153,7 @@ const EmailVerification = () => {
         setOnboardingOnlyJwt,
         setCallback,
         setErrorMessage,
+        setView,
     ]);
     const handleEmailLogin = useCallback((verificationToken) => __awaiter(void 0, void 0, void 0, function* () {
         setError(undefined);
@@ -210,9 +249,15 @@ const EmailVerification = () => {
             setLoading(false);
         }
     });
-    return (jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsx(ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), isValidated ? (jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsx(IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: SignInWithEmailIcon, iconSize: 50, InnerIcon: SvgCheck }) }))) : (jsx(IconWithSpinner, { className: classNames({
-                    'email-verification__icon-with-spinner': Boolean(!error),
-                }), Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) }))] })), !isLoginView && (jsx(TextButton, Object.assign({ onClick: () => setView('update-email'), 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, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsx(SvgCheckCircle, {}), jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsx(TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsx(TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsx(PoweredByDynamic, {})] })));
+    // Go to update email screen, but prevent onEmailVerificationX callback from being called
+    const updateEmail = () => {
+        callCallbackOnUnmount.current = false;
+        setView('update-email');
+    };
+    const closeButton = (jsx(IconButton, Object.assign({ onClick: close, type: 'button', "data-testid": 'close-button' }, { children: jsx(SvgClose, {}) })));
+    return (jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsx(ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), jsx(ModalHeader, Object.assign({ style: { paddingBlock: 0 }, trailing: !isLoginView && closeButton }, { children: isValidated ? (jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsx(IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: SignInWithEmailIcon, iconSize: 50, InnerIcon: SvgCheck }) }))) : (jsx(IconWithSpinner, { className: classNames({
+                        'email-verification__icon-with-spinner': Boolean(!error),
+                    }), Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true })) })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) }))] })), !isLoginView && (jsx(TextButton, Object.assign({ 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, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsx(SvgCheckCircle, {}), jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsx(TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsx(TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsx(PoweredByDynamic, {})] })));
 };
 
 export { EmailVerification };

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

@@ -39,15 +39,19 @@ require('formik');
 require('yup');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../CollectUserDataView/fieldsConfig.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var useMutation = require('../../utils/hooks/useMutation/useMutation.cjs');
-require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+require('@dynamic-labs/types');
+require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 
 const EmailWalletOTPVerificationView = () => {
     const { setView } = ViewContext.useViewContext();
     const [error, setError] = React.useState();
-    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, setShowAuthFlow, } = useInternalDynamicContext.useInternalDynamicContext();
     if (!emailWalletConnector ||
         !walletConnectorCore.isEmailOTPWalletConnector(emailWalletConnector)) {
         throw new Error('Current wallet is not EmailWalletConnector');
@@ -61,10 +65,11 @@ 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), onClickEditEmail: handleBackClick, displayPoweredByDynamic: true }));
+    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: 'By signing in, you will access a wallet that is only associated to this email.' }));
 };
 
 exports.EmailWalletOTPVerificationView = EmailWalletOTPVerificationView;

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

@@ -35,15 +35,19 @@ import 'formik';
 import 'yup';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
+import '../CollectUserDataView/fieldsConfig.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
+import '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useMutation } from '../../utils/hooks/useMutation/useMutation.js';
-import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import '@dynamic-labs/types';
+import '../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 
 const EmailWalletOTPVerificationView = () => {
     const { setView } = useViewContext();
     const [error, setError] = useState();
-    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, } = useInternalDynamicContext();
+    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, setShowAuthFlow, } = useInternalDynamicContext();
     if (!emailWalletConnector ||
         !isEmailOTPWalletConnector(emailWalletConnector)) {
         throw new Error('Current wallet is not EmailWalletConnector');
@@ -57,10 +61,11 @@ 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), onClickEditEmail: handleBackClick, displayPoweredByDynamic: true }));
+    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: 'By signing in, you will access a wallet that is only associated to this email.' }));
 };
 
 export { EmailWalletOTPVerificationView };

package/src/lib/views/LoginWithEmailView/components/ListItemButton/ListItemButton.cjs

@@ -35,14 +35,18 @@ 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('../../../CollectUserDataView/fieldsConfig.cjs');
 require('../../../../context/MockContext/MockContext.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
-require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('@dynamic-labs/types');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 var ListTile = require('../../../../components/ListTile/ListTile.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('formik');
-require('yup');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 var Badge = require('../../../../components/Badge/Badge.cjs');

package/src/lib/views/LoginWithEmailView/components/ListItemButton/ListItemButton.js

@@ -31,14 +31,18 @@ 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 '../../../CollectUserDataView/fieldsConfig.js';
 import '../../../../context/MockContext/MockContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
-import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '@dynamic-labs/types';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import { ListTile } from '../../../../components/ListTile/ListTile.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'formik';
-import 'yup';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import { Badge } from '../../../../components/Badge/Badge.js';

package/src/lib/views/LoginWithEmailView/components/LoginWithEmailForm/LoginWithEmailForm.cjs

@@ -10,6 +10,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');
 require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
@@ -32,27 +33,31 @@ require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagic
 var ErrorContext = require('../../../../context/ErrorContext/ErrorContext.cjs');
 require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../../../components/IconButton/IconButton.cjs');
-var Button = require('../../../../components/Button/Button.cjs');
+var IconButton = require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
+require('formik');
+require('yup');
+require('../../../CollectUserDataView/fieldsConfig.cjs');
 require('../../../../context/MockContext/MockContext.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
-require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('@dynamic-labs/types');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('formik');
-require('yup');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 var LoadingContext = require('../../../../context/LoadingContext/LoadingContext.cjs');
 var useEmailProvider = require('../../../../utils/hooks/useEmailProvider/useEmailProvider.cjs');
 
 const EMAIL_REGEX = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
-const LoginWithEmailForm = () => {
+const LoginWithEmailForm = ({ currentEmail }) => {
+    var _a;
     const { environmentId, wallets, projectSettings } = useInternalDynamicContext.useInternalDynamicContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
     const { setErrorMessage } = ErrorContext.useErrorContext();
-    const [emailInput, setEmailInput] = React.useState('');
+    const [emailInput, setEmailInput] = React.useState(currentEmail !== null && currentEmail !== void 0 ? currentEmail : '');
     const [emailError, setEmailError] = React.useState(false);
     const emailWalletConnector = wallets
         .map(({ walletConnector }) => walletConnector)
@@ -67,6 +72,7 @@ const LoginWithEmailForm = () => {
     };
     const isInjectedWalletProviderEnabled = emailWalletConnector !== undefined;
     const onChangeHandler = handleEmailOnChangeEvent;
+    const emailInputSuffixIcon = (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ "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 handleSubmit = (e) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         e.preventDefault();
         if (!EMAIL_REGEX.test(emailInput)) {
@@ -99,7 +105,7 @@ const LoginWithEmailForm = () => {
         }
     });
     // social sign in currently coupled to email... might be better to decouple
-    return (jsxRuntime.jsxs("form", Object.assign({ className: 'login-with-email-form', onSubmit: (e) => handleSubmit(e) }, { children: [jsxRuntime.jsx(Input.Input, { id: 'email_field', value: emailInput, onChange: onChangeHandler, label: 'Enter your email', error: emailError, message: emailError && 'Please enter a valid email address' }), jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'login-with-email-form__button', type: 'submit', loading: isLoading, disabled: isLoading, buttonVariant: 'primary', buttonPadding: 'large', buttonRounded: 'medium', expanded: true }, { children: "Continue" }))] })));
+    return (jsxRuntime.jsx("form", Object.assign({ className: 'login-with-email-form', onSubmit: (e) => handleSubmit(e) }, { children: jsxRuntime.jsx(Input.Input, { id: 'email_field', value: emailInput, onChange: onChangeHandler, label: 'Enter your email', error: emailError, message: emailError && 'Please enter a valid email address', suffix: emailInputSuffixIcon }) })));
 };
 
 exports.EMAIL_REGEX = EMAIL_REGEX;

package/src/lib/views/LoginWithEmailView/components/LoginWithEmailForm/LoginWithEmailForm.d.ts

@@ -1,3 +1,7 @@
 /// <reference types="react" />
 export declare const EMAIL_REGEX: RegExp;
-export declare const LoginWithEmailForm: () => JSX.Element;
+type Props = {
+    currentEmail?: string;
+};
+export declare const LoginWithEmailForm: ({ currentEmail }: Props) => JSX.Element;
+export {};