@dynamic-labs/sdk-react-core 2.0.0-alpha.3 → 2.0.0-alpha.5

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js

@@ -19,12 +19,14 @@ import { useInternalDynamicContext } from '../../../../context/DynamicContext/us
 import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../config/ApiEndpoint.js';
+import 'react-international-phone';
 import 'viem/chains';
 import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../../../config/ApiEndpoint.js';
-import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
+import '../../../../context/WalletContext/WalletContext.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import { useKYCFlag } from '../../../../utils/hooks/useKYCFlag/useKYCFlag.js';
 import '@dynamic-labs/types';
@@ -39,31 +41,33 @@ import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/Input/Input.js';
 import '../../../../components/IsBrowser/IsBrowser.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import { OptionsSwitcher } from '../../../../components/OptionsSwitcher/OptionsSwitcher.js';
+import { PasskeyCreatedSuccessBanner } from '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
-import 'formik';
-import 'i18next';
-import '../../../../components/OverlayCard/OverlayCard.context.js';
-import { PasskeyCreatedSuccessBanner } from '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../../views/WalletList/WalletList.js';
+import 'formik';
 import 'qrcode';
 import '@hcaptcha/react-hcaptcha';
 import '../../../../context/LoadingContext/LoadingContext.js';
 import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import 'i18next';
 import '../../../../context/FooterAnimationContext/index.js';
+import '../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.js';
+import '../../../../context/PasskeyContext/PasskeyContext.js';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
-import '@dynamic-labs/viem-utils';
+import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import { DynamicWidgetWalletHeader } from './DynamicWidgetWalletHeader/DynamicWidgetWalletHeader.js';
 

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetWalletHeader/DynamicWidgetWalletHeader.cjs

@@ -25,13 +25,15 @@ var useInternalDynamicContext = require('../../../../../context/DynamicContext/u
 require('../../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
-var getActiveOauthCredential = require('../../../../../utils/functions/getActiveOauthCredential/getActiveOauthCredential.cjs');
+require('../../../../../config/ApiEndpoint.cjs');
+var getUserIdentifier = require('../../../../../utils/functions/getUserIdentifier/getUserIdentifier.cjs');
+require('react-international-phone');
 require('viem/chains');
 require('../../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
-require('../../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('../../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
+var WalletContext = require('../../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 require('@dynamic-labs/types');
 require('yup');
@@ -41,11 +43,11 @@ require('../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdate
 require('../../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
-require('../../../../../components/OverlayCard/OverlayCard.context.cjs');
+require('../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../../../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../../../../components/Typography/Typography.cjs');
 require('../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
@@ -56,27 +58,28 @@ var Icon = require('../../../../../components/Icon/Icon.cjs');
 require('i18next');
 require('qrcode');
 var DynamicWidgetContext = require('../../../context/DynamicWidgetContext.cjs');
+require('../../../../../components/IconButton/IconButton.cjs');
+require('../../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
 var Button = require('../../../../../components/Button/Button.cjs');
-require('../../../../../components/IconButton/IconButton.cjs');
 require('../../../../../components/Alert/Alert.cjs');
 require('../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../../context/PasskeyContext/PasskeyContext.cjs');
-require('@dynamic-labs/viem-utils');
+require('../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 require('../../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../../components/Input/Input.cjs');
 require('../../../../../components/IsBrowser/IsBrowser.cjs');
-require('../../../../../components/MenuList/Dropdown/Dropdown.cjs');
-var shortenEmail = require('../../../../../shared/utils/functions/shortenEmail/shortenEmail.cjs');
 require('../../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../../components/Popper/PopperContext/PopperContext.cjs');
-var SecureTurnkeyWalletCard = require('../../../../../components/SecureTurnkeyWalletCard/SecureTurnkeyWalletCard.cjs');
 require('../../../../../views/WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
 var UserAvatar = require('../../../../../components/UserAvatar/UserAvatar.cjs');
 require('../../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.cjs');
+var SecureEmbeddedWalletCard = require('../../../../../components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.cjs');
 var FundingContext = require('../../../../../context/FundingContext/FundingContext.cjs');
 var SendBalanceContext = require('../../../../../context/SendBalanceContext/SendBalanceContext.cjs');
 var ActiveWalletInformation = require('../../ActiveWalletInformation/ActiveWalletInformation.cjs');
@@ -91,13 +94,14 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
     const { open: openSendBalanceModal } = SendBalanceContext.useSendBalance();
     const { supportsFunding, setShowFunding, fundingEnabled } = FundingContext.useFundingContext();
     const { setDynamicWidgetView, setIsOpen } = DynamicWidgetContext.useWidgetContext();
+    const { isLoadingEmbeddedWallet } = WalletContext.useWalletContext();
     const isSendBalanceEnabled = React.useMemo(() => {
-        var _a;
         const connector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
         if (!connector)
             return false;
         // @todo: QNTM-804 Remove supported chains check to support other chains
-        return (((_a = connector.supportedChains) === null || _a === void 0 ? void 0 : _a.includes('EVM')) &&
+        const supportedChain = connector.supportedChains;
+        return (((supportedChain === null || supportedChain === void 0 ? void 0 : supportedChain.includes('EVM')) || (supportedChain === null || supportedChain === void 0 ? void 0 : supportedChain.includes('SOL'))) &&
             walletConnectorCore.isEmbeddedConnector(connector));
     }, [primaryWallet]);
     const handleOnClickSend = () => {
@@ -109,17 +113,10 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
             setDynamicWidgetView('send-balance');
         }
     };
-    const renderEmailOrSocialHeader = () => {
-        const oauthCredential = getActiveOauthCredential.getActiveOauthCredential(user);
-        if (oauthCredential === null || oauthCredential === void 0 ? void 0 : oauthCredential.publicIdentifier) {
-            return oauthCredential.publicIdentifier;
-        }
-        return shortenEmail.shortenEmail(user === null || user === void 0 ? void 0 : user.email);
-    };
     const renderWalletHeader = () => {
         const unknownWallet = user === null || user === void 0 ? void 0 : user.verifiedCredentials.find((credential) => credential.walletName === 'unknown');
-        if (primaryWallet) {
-            return jsxRuntime.jsx(ActiveWalletInformation.ActiveWalletInformation, {});
+        if (primaryWallet || isLoadingEmbeddedWallet) {
+            return jsxRuntime.jsx(ActiveWalletInformation.ActiveWalletInformation, { isLoading: isLoadingEmbeddedWallet });
         }
         else if (unknownWallet) {
             return jsxRuntime.jsx(UnknownWalletInformation.UnknownWalletInformation, { address: unknownWallet.address });
@@ -129,11 +126,11 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
         }
     };
     const isActionsVisible = isSendBalanceEnabled || fundingEnabled;
-    return (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxRuntime.jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsxRuntime.jsx(SecureTurnkeyWalletCard.SecureTurnkeyWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), isActionsVisible && (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [fundingEnabled && (jsxRuntime.jsx(Button.Button, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setShowFunding(true), disabled: !supportsFunding, startSlot: 
+    return (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxRuntime.jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsxRuntime.jsx(SecureEmbeddedWalletCard.SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), isActionsVisible && (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [fundingEnabled && (jsxRuntime.jsx(Button.Button, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setShowFunding(true), disabled: !supportsFunding, startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
                                 jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(add.ReactComponent, {}) }), children: "Buy" })), isSendBalanceEnabled && (jsxRuntime.jsx(Button.Button, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
-                                jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(send.ReactComponent, {}) }), children: "Send" }))] }))] })) : (jsxRuntime.jsx(Typography.Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: renderEmailOrSocialHeader() }))] }));
+                                jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(send.ReactComponent, {}) }), children: "Send" }))] }))] })) : (jsxRuntime.jsx(Typography.Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: getUserIdentifier.getUserIdentifier(user) }))] }));
 };
 React__default["default"].memo(DynamicWidgetWalletHeader);
 

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetWalletHeader/DynamicWidgetWalletHeader.js

@@ -21,13 +21,15 @@ import { useInternalDynamicContext } from '../../../../../context/DynamicContext
 import '../../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
-import { getActiveOauthCredential } from '../../../../../utils/functions/getActiveOauthCredential/getActiveOauthCredential.js';
+import '../../../../../config/ApiEndpoint.js';
+import { getUserIdentifier } from '../../../../../utils/functions/getUserIdentifier/getUserIdentifier.js';
+import 'react-international-phone';
 import 'viem/chains';
 import '../../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../../../../config/ApiEndpoint.js';
-import '../../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '../../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
+import { useWalletContext } from '../../../../../context/WalletContext/WalletContext.js';
 import '../../../../../context/ThemeContext/ThemeContext.js';
 import '@dynamic-labs/types';
 import 'yup';
@@ -37,11 +39,11 @@ import '../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateU
 import '../../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../components/ShadowDOM/ShadowDOM.js';
-import '../../../../../components/OverlayCard/OverlayCard.context.js';
+import '../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../../../../components/Typography/Typography.js';
 import '../../../../../context/WalletGroupContext/WalletGroupContext.js';
@@ -52,27 +54,28 @@ import { Icon } from '../../../../../components/Icon/Icon.js';
 import 'i18next';
 import 'qrcode';
 import { useWidgetContext } from '../../../context/DynamicWidgetContext.js';
+import '../../../../../components/IconButton/IconButton.js';
+import '../../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
 import { Button } from '../../../../../components/Button/Button.js';
-import '../../../../../components/IconButton/IconButton.js';
 import '../../../../../components/Alert/Alert.js';
 import '../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../../context/PasskeyContext/PasskeyContext.js';
-import '@dynamic-labs/viem-utils';
+import '../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import '../../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../../components/Input/Input.js';
 import '../../../../../components/IsBrowser/IsBrowser.js';
-import '../../../../../components/MenuList/Dropdown/Dropdown.js';
-import { shortenEmail } from '../../../../../shared/utils/functions/shortenEmail/shortenEmail.js';
 import '../../../../../components/Popper/Popper/Popper.js';
 import '../../../../../components/Popper/PopperContext/PopperContext.js';
-import { SecureTurnkeyWalletCard } from '../../../../../components/SecureTurnkeyWalletCard/SecureTurnkeyWalletCard.js';
 import '../../../../../views/WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
 import { UserAvatar } from '../../../../../components/UserAvatar/UserAvatar.js';
 import '../../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.js';
+import { SecureEmbeddedWalletCard } from '../../../../../components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.js';
 import { useFundingContext } from '../../../../../context/FundingContext/FundingContext.js';
 import { useSendBalance } from '../../../../../context/SendBalanceContext/SendBalanceContext.js';
 import { ActiveWalletInformation } from '../../ActiveWalletInformation/ActiveWalletInformation.js';
@@ -83,13 +86,14 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
     const { open: openSendBalanceModal } = useSendBalance();
     const { supportsFunding, setShowFunding, fundingEnabled } = useFundingContext();
     const { setDynamicWidgetView, setIsOpen } = useWidgetContext();
+    const { isLoadingEmbeddedWallet } = useWalletContext();
     const isSendBalanceEnabled = useMemo(() => {
-        var _a;
         const connector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
         if (!connector)
             return false;
         // @todo: QNTM-804 Remove supported chains check to support other chains
-        return (((_a = connector.supportedChains) === null || _a === void 0 ? void 0 : _a.includes('EVM')) &&
+        const supportedChain = connector.supportedChains;
+        return (((supportedChain === null || supportedChain === void 0 ? void 0 : supportedChain.includes('EVM')) || (supportedChain === null || supportedChain === void 0 ? void 0 : supportedChain.includes('SOL'))) &&
             isEmbeddedConnector(connector));
     }, [primaryWallet]);
     const handleOnClickSend = () => {
@@ -101,17 +105,10 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
             setDynamicWidgetView('send-balance');
         }
     };
-    const renderEmailOrSocialHeader = () => {
-        const oauthCredential = getActiveOauthCredential(user);
-        if (oauthCredential === null || oauthCredential === void 0 ? void 0 : oauthCredential.publicIdentifier) {
-            return oauthCredential.publicIdentifier;
-        }
-        return shortenEmail(user === null || user === void 0 ? void 0 : user.email);
-    };
     const renderWalletHeader = () => {
         const unknownWallet = user === null || user === void 0 ? void 0 : user.verifiedCredentials.find((credential) => credential.walletName === 'unknown');
-        if (primaryWallet) {
-            return jsx(ActiveWalletInformation, {});
+        if (primaryWallet || isLoadingEmbeddedWallet) {
+            return jsx(ActiveWalletInformation, { isLoading: isLoadingEmbeddedWallet });
         }
         else if (unknownWallet) {
             return jsx(UnknownWalletInformation, { address: unknownWallet.address });
@@ -121,11 +118,11 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
         }
     };
     const isActionsVisible = isSendBalanceEnabled || fundingEnabled;
-    return (jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsx(SecureTurnkeyWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), isActionsVisible && (jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [fundingEnabled && (jsx(Button, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setShowFunding(true), disabled: !supportsFunding, startSlot: 
+    return (jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsx(SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), isActionsVisible && (jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [fundingEnabled && (jsx(Button, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setShowFunding(true), disabled: !supportsFunding, startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
                                 jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgAdd, {}) }), children: "Buy" })), isSendBalanceEnabled && (jsx(Button, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
-                                jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgSend, {}) }), children: "Send" }))] }))] })) : (jsx(Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: renderEmailOrSocialHeader() }))] }));
+                                jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgSend, {}) }), children: "Send" }))] }))] })) : (jsx(Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: getUserIdentifier(user) }))] }));
 };
 React__default.memo(DynamicWidgetWalletHeader);
 

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetVariants/variants/DynamicWidgetDropdown/DynamicWidgetDropdown.cjs

@@ -25,12 +25,14 @@ require('../../../../../../shared/consts/index.cjs');
 require('../../../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../../config/ApiEndpoint.cjs');
+require('react-international-phone');
 require('viem/chains');
 require('../../../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../../../../../config/ApiEndpoint.cjs');
-require('../../../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('../../../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
+require('../../../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../../../context/ThemeContext/ThemeContext.cjs');
 require('@dynamic-labs/types');
 require('yup');
@@ -45,28 +47,30 @@ require('../../../../../../components/Alert/Alert.cjs');
 require('../../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../../components/IconButton/IconButton.cjs');
 require('../../../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../../../components/Input/Input.cjs');
 require('../../../../../../components/IsBrowser/IsBrowser.cjs');
 require('../../../../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
+require('../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../../../components/Popper/Popper/Popper.cjs');
 var PopperContext = require('../../../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
-require('formik');
-require('i18next');
-require('../../../../../../components/OverlayCard/OverlayCard.context.cjs');
-require('../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
-require('../../../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../../../../views/WalletList/WalletList.cjs');
+require('formik');
 require('qrcode');
 require('@hcaptcha/react-hcaptcha');
 require('../../../../../../context/LoadingContext/LoadingContext.cjs');
 require('../../../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('i18next');
 require('../../../../../../context/FooterAnimationContext/index.cjs');
+require('../../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.cjs');
+require('../../../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('../../../../context/DynamicWidgetContext.cjs');
 require('../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
-require('@dynamic-labs/viem-utils');
+require('../../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 
 const DynamicWidgetDropdown = ({ zIndex, isShown, onClose, children, className, contentClassName, }) => (jsxRuntime.jsx(ZoomTransition.ZoomTransition, { outDuration: 200, className: classNames.classNames('dynamic-widget-dropdown', className), isShown: isShown, children: jsxRuntime.jsx("div", { "data-testid": 'DynamicWidgetDropdown', style: { zIndex }, className: classNames.classNames('dynamic-widget-dropdown__root', contentClassName), children: jsxRuntime.jsx(PopperContext.PopperProvider, { children: children }) }) }));

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetVariants/variants/DynamicWidgetDropdown/DynamicWidgetDropdown.js

@@ -21,12 +21,14 @@ import '../../../../../../shared/consts/index.js';
 import '../../../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../../config/ApiEndpoint.js';
+import 'react-international-phone';
 import 'viem/chains';
 import '../../../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../../../../../config/ApiEndpoint.js';
-import '../../../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '../../../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
+import '../../../../../../context/WalletContext/WalletContext.js';
 import '../../../../../../context/ThemeContext/ThemeContext.js';
 import '@dynamic-labs/types';
 import 'yup';
@@ -41,28 +43,30 @@ import '../../../../../../components/Alert/Alert.js';
 import '../../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../../components/IconButton/IconButton.js';
 import '../../../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../../../components/Input/Input.js';
 import '../../../../../../components/IsBrowser/IsBrowser.js';
 import '../../../../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
+import '../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../../../components/Popper/Popper/Popper.js';
 import { PopperProvider } from '../../../../../../components/Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
-import 'formik';
-import 'i18next';
-import '../../../../../../components/OverlayCard/OverlayCard.context.js';
-import '../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../../../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../../../../views/WalletList/WalletList.js';
+import 'formik';
 import 'qrcode';
 import '@hcaptcha/react-hcaptcha';
 import '../../../../../../context/LoadingContext/LoadingContext.js';
 import '../../../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import 'i18next';
 import '../../../../../../context/FooterAnimationContext/index.js';
+import '../../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.js';
+import '../../../../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../DynamicWidgetHeader/DynamicWidgetHeader.js';
 import '../../../../context/DynamicWidgetContext.js';
 import '../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
-import '@dynamic-labs/viem-utils';
+import '../../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 
 const DynamicWidgetDropdown = ({ zIndex, isShown, onClose, children, className, contentClassName, }) => (jsx(ZoomTransition, { outDuration: 200, className: classNames('dynamic-widget-dropdown', className), isShown: isShown, children: jsx("div", { "data-testid": 'DynamicWidgetDropdown', style: { zIndex }, className: classNames('dynamic-widget-dropdown__root', contentClassName), children: jsx(PopperProvider, { children: children }) }) }));

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetVariants/variants/DynamicWidgetModal/DynamicWidgetModal.cjs

@@ -24,12 +24,14 @@ require('../../../../../../shared/consts/index.cjs');
 require('../../../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../../config/ApiEndpoint.cjs');
+require('react-international-phone');
 require('viem/chains');
 require('../../../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../../../../../config/ApiEndpoint.cjs');
-require('../../../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('../../../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
+require('../../../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../../../context/ThemeContext/ThemeContext.cjs');
 require('@dynamic-labs/types');
 require('yup');
@@ -39,11 +41,11 @@ require('../../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpd
 require('../../../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../../components/ShadowDOM/ShadowDOM.cjs');
-require('../../../../../../components/OverlayCard/OverlayCard.context.cjs');
+require('../../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../../../../../context/FooterAnimationContext/index.cjs');
 require('../../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../DynamicWidgetHeader/DynamicWidgetHeader.cjs');
@@ -52,23 +54,25 @@ require('../../../../../../context/LoadingContext/LoadingContext.cjs');
 require('i18next');
 require('qrcode');
 require('../../../../context/DynamicWidgetContext.cjs');
+require('../../../../../../components/IconButton/IconButton.cjs');
+require('../../../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
-require('../../../../../../components/IconButton/IconButton.cjs');
 require('../../../../../../components/Alert/Alert.cjs');
 require('../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../../../context/PasskeyContext/PasskeyContext.cjs');
-require('@dynamic-labs/viem-utils');
+require('../../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 require('../../../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../../../components/Input/Input.cjs');
 require('../../../../../../components/IsBrowser/IsBrowser.cjs');
-require('../../../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../../../components/Popper/Popper/Popper.cjs');
 var PopperContext = require('../../../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('../../../../../../views/WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('../../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.cjs');
 
 const DynamicWidgetModal = ({ children, isShown, onClose, zIndex, className, transitionEvents = {}, }) => {
     usePreventPageScroll.usePreventPageScroll(Boolean(isShown));

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetVariants/variants/DynamicWidgetModal/DynamicWidgetModal.js

@@ -20,12 +20,14 @@ import '../../../../../../shared/consts/index.js';
 import '../../../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../../config/ApiEndpoint.js';
+import 'react-international-phone';
 import 'viem/chains';
 import '../../../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../../../context/AccountExistsContext/AccountExistsContext.js';
-import '../../../../../../config/ApiEndpoint.js';
-import '../../../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import '../../../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
+import '../../../../../../context/WalletContext/WalletContext.js';
 import '../../../../../../context/ThemeContext/ThemeContext.js';
 import '@dynamic-labs/types';
 import 'yup';
@@ -35,11 +37,11 @@ import '../../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpda
 import '../../../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../../components/ShadowDOM/ShadowDOM.js';
-import '../../../../../../components/OverlayCard/OverlayCard.context.js';
+import '../../../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../../../context/FooterAnimationContext/index.js';
 import '../../../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../DynamicWidgetHeader/DynamicWidgetHeader.js';
@@ -48,23 +50,25 @@ import '../../../../../../context/LoadingContext/LoadingContext.js';
 import 'i18next';
 import 'qrcode';
 import '../../../../context/DynamicWidgetContext.js';
+import '../../../../../../components/IconButton/IconButton.js';
+import '../../../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
-import '../../../../../../components/IconButton/IconButton.js';
 import '../../../../../../components/Alert/Alert.js';
 import '../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../../../context/PasskeyContext/PasskeyContext.js';
-import '@dynamic-labs/viem-utils';
+import '../../../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import '../../../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../../../components/Input/Input.js';
 import '../../../../../../components/IsBrowser/IsBrowser.js';
-import '../../../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../../../components/Popper/Popper/Popper.js';
 import { PopperProvider } from '../../../../../../components/Popper/PopperContext/PopperContext.js';
 import '../../../../../../views/WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '../../../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.js';
 
 const DynamicWidgetModal = ({ children, isShown, onClose, zIndex, className, transitionEvents = {}, }) => {
     usePreventPageScroll(Boolean(isShown));

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetWallets/DynamicWidgetWallets.cjs

@@ -25,12 +25,14 @@ var useInternalDynamicContext = require('../../../../context/DynamicContext/useD
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
+require('react-international-phone');
 require('viem/chains');
 require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../../../config/ApiEndpoint.cjs');
-require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
+require('../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('@dynamic-labs/types');
 require('yup');
@@ -39,11 +41,11 @@ require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUse
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../components/ShadowDOM/ShadowDOM.cjs');
-require('../../../../components/OverlayCard/OverlayCard.context.cjs');
+require('../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../../../components/Typography/Typography.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
@@ -62,9 +64,10 @@ require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
-require('@dynamic-labs/viem-utils');
+require('../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../components/Input/Input.cjs');
 require('../../../../components/IsBrowser/IsBrowser.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
@@ -73,6 +76,7 @@ require('../../../../views/WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.cjs');
 
 const DynamicWidgetWallets = () => {
     const { t } = reactI18next.useTranslation();