@dynamic-labs/sdk-react-core 0.19.4 → 0.19.6

package/src/lib/views/NetworkNotSupported/NetworkNotSupported.js

@@ -64,7 +64,7 @@ import { UserAddress } from '../../components/UserAddress/UserAddress.js';
 import { SelectNetworkButton } from '../../components/SelectNetworkButton/SelectNetworkButton.js';
 
 const NetworkNotSupported = () => {
-    const { network, onboardingImageUrl, selectedWalletConnector: walletConnector, connectedWallets, primaryWallet, isFullyConnected, setShowAuthFlow, walletsToConnectByChain, } = useInternalDynamicContext();
+    const { onboardingImageUrl, selectedWalletConnector: walletConnector, connectedWallets, primaryWallet, isFullyConnected, setShowAuthFlow, walletsToConnectByChain, } = useInternalDynamicContext();
     const { t } = useTranslation();
     // Refresh selectedWalletConnector network when primaryWallet or connectedWallets updates
     const { data: walletConnectorNetwork } = usePromise(() => walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getNetwork(), { deps: [primaryWallet, walletConnector, connectedWallets] });
@@ -104,10 +104,13 @@ const NetworkNotSupported = () => {
         }
     });
     const evmNetworks = walletConnector.evmNetworks || [];
-    const _isSupportedNetwork = isSupportedNetwork({ network, walletConnector });
+    const _isSupportedNetwork = isSupportedNetwork({
+        network: walletConnectorNetwork,
+        walletConnector,
+    });
     return (jsxs("div", { className: 'network-not-supported', "data-testid": 'network-not-supported', children: [onboardingImageUrl && (jsx("img", { className: 'network-not-supported__main-img', src: onboardingImageUrl, alt: 'onboarding' })), !_isSupportedNetwork && (jsx(ErrorContainer, { variant: 'info', withIcon: false, className: 'network-not-supported__error--not-supported', children: t('dyn_network_not_supported.warning_message') })), jsxs("div", { className: classNames('network-not-supported__content-container', {
                     'network-not-supported__content-container--error': !_isSupportedNetwork,
-                }), children: [jsx("div", { className: 'network-not-supported__img-container', children: jsx(WalletIcon, { style: { height: 64, width: 64 }, walletKey: walletConnector.key }) }), jsx(UserAddress, { walletConnector: walletConnector }), jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsx(NetworkPicker, { evmNetworks: evmNetworks, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsx("div", { className: 'network-not-supported__welcome-container', children: jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsx(SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
+                }), children: [jsx("div", { className: 'network-not-supported__img-container', children: jsx(WalletIcon, { style: { height: 64, width: 64 }, walletKey: walletConnector.key }) }), jsx(UserAddress, { walletConnector: walletConnector }), jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsx(NetworkPicker, { evmNetworks: evmNetworks, currentNetwork: walletConnectorNetwork, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsx("div", { className: 'network-not-supported__welcome-container', children: jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsx(SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
 };
 
 export { NetworkNotSupported };

package/src/lib/views/QrCodeView/QRCode.cjs

@@ -40,6 +40,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
@@ -51,7 +52,6 @@ var usePromise = require('../../utils/hooks/usePromise/usePromise.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

package/src/lib/views/QrCodeView/QRCode.js

@@ -36,6 +36,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
@@ -47,7 +48,6 @@ import { usePromise } from '../../utils/hooks/usePromise/usePromise.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import '../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/views/QrCodeView/QrCodeView.cjs

@@ -39,6 +39,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
@@ -50,7 +51,6 @@ require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

package/src/lib/views/QrCodeView/QrCodeView.js

@@ -35,6 +35,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
@@ -46,7 +47,6 @@ import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/views/SendBalanceView/components/TransactionStage/TransactionStage.cjs

@@ -40,6 +40,7 @@ require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
@@ -52,7 +53,6 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

package/src/lib/views/SendBalanceView/components/TransactionStage/TransactionStage.js

@@ -36,6 +36,7 @@ import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
@@ -48,7 +49,6 @@ import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/views/TransactionConfirmationView/TransactionConfirmationView.cjs

@@ -45,6 +45,7 @@ var TransactionConfirmationPageLayout = require('../../components/TransactionCon
 var TransactionRow = require('../../components/TransactionConfirmationPageLayout/components/TransactionRow/TransactionRow.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
@@ -58,7 +59,6 @@ require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

package/src/lib/views/TransactionConfirmationView/TransactionConfirmationView.js

@@ -41,6 +41,7 @@ import { TransactionConfirmationPageLayout } from '../../components/TransactionC
 import { TransactionRow } from '../../components/TransactionConfirmationPageLayout/components/TransactionRow/TransactionRow.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
@@ -54,7 +55,6 @@ import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/views/TransactionConfirmationView/hooks/useTransactionGas/useTransactionGas.cjs

@@ -38,6 +38,7 @@ require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
@@ -51,7 +52,6 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

package/src/lib/views/TransactionConfirmationView/hooks/useTransactionGas/useTransactionGas.js

@@ -34,6 +34,7 @@ import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
@@ -47,7 +48,6 @@ import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/widgets/DynamicEmbeddedWidget/DynamicEmbeddedUserProfile/DynamicEmbeddedUserProfile.cjs

@@ -49,6 +49,7 @@ require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 var useIsLoggedIn = require('../../../utils/hooks/useIsLoggedIn/useIsLoggedIn.cjs');
 require('../../../components/Popper/Popper/Popper.cjs');
 var PopperContext = require('../../../components/Popper/PopperContext/PopperContext.cjs');
+require('i18next');
 var ModalCard = require('../../../components/ModalCard/ModalCard.cjs');
 require('../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');

package/src/lib/widgets/DynamicEmbeddedWidget/DynamicEmbeddedUserProfile/DynamicEmbeddedUserProfile.js

@@ -45,6 +45,7 @@ import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import { useIsLoggedIn } from '../../../utils/hooks/useIsLoggedIn/useIsLoggedIn.js';
 import '../../../components/Popper/Popper/Popper.js';
 import { PopperProvider } from '../../../components/Popper/PopperContext/PopperContext.js';
+import 'i18next';
 import { ModalCard } from '../../../components/ModalCard/ModalCard.js';
 import '../../../components/InlineWidget/InlineWidget.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';

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

@@ -115,7 +115,7 @@ const ActiveWalletInformation = () => {
         [];
     return (jsxRuntime.jsxs("div", { className: 'active-wallet-information-container', "data-testid": 'active-wallet-information', children: [jsxRuntime.jsxs("div", { className: 'active-wallet-information', children: [jsxRuntime.jsxs("div", { className: 'active-wallet-information__header', children: [jsxRuntime.jsx("div", { className: 'active-wallet-information__avatar--centered', children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsxRuntime.jsx("div", { className: 'active-wallet-information__avatar', children: jsxRuntime.jsx("img", { src: nameService === null || nameService === void 0 ? void 0 : nameService.avatar, alt: '' }) })) : (jsxRuntime.jsx("div", { className: 'active-wallet-information__wallet-img', children: jsxRuntime.jsx(AuthProviderIcon.AuthProviderIcon, { jwt: authToken, iconSize: ICON_SIZE, showStatus: true }) })) }), jsxRuntime.jsxs("div", { className: 'active-wallet-information__details', children: [jsxRuntime.jsxs("div", { className: classNames.classNames('active-wallet-information__actions-container', {
                                             'active-wallet-information__actions-container--centered': !(nameService === null || nameService === void 0 ? void 0 : nameService.name),
-                                        }), children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Typography.Typography, { className: 'active-wallet-information__handle', color: 'primary', variant: 'body_normal', children: nameService === null || nameService === void 0 ? void 0 : nameService.name }), jsxRuntime.jsx(Typography.Typography, { className: 'active-wallet-information__address', weight: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'regular' : 'medium', variant: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'body_small' : 'body_normal', color: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'secondary' : 'primary', children: shortenWalletAddress.shortenWalletAddress(address, 4, 4) })] }), jsxRuntime.jsx(DotsMenu.DotsMenu, { "data-testid": 'dots-menu', options: options, buttonClassName: 'active-wallet-information__dots-menu', buttonClassNameWithOpenMenu: 'active-wallet-information__dots-menu' })] }), jsxRuntime.jsx(NetworkPicker.NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'active-wallet-information__network-picker', buttonClassName: 'active-wallet-information__network-picker-button', evmNetworks: evmNetworks, showNetworkName: true })] })] }), testnet && (jsxRuntime.jsx(Alert.Alert, { variant: 'warning', children: t('dyn_active_wallet_info.testnet_warning') }))] }), jsxRuntime.jsxs("div", { className: 'balance-container', children: [jsxRuntime.jsx(Typography.Typography, { color: 'secondary', variant: 'body_small', children: "Balance" }), primaryWallet && (jsxRuntime.jsx(Balance.Balance, { className: 'balance-container__balance', connector: primaryWallet.connector, address: primaryWallet.address, network: network }))] })] }));
+                                        }), children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Typography.Typography, { className: 'active-wallet-information__handle', color: 'primary', variant: 'body_normal', children: nameService === null || nameService === void 0 ? void 0 : nameService.name }), jsxRuntime.jsx(Typography.Typography, { className: 'active-wallet-information__address', weight: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'regular' : 'medium', variant: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'body_small' : 'body_normal', color: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'secondary' : 'primary', children: shortenWalletAddress.shortenWalletAddress(address, 4, 4) })] }), jsxRuntime.jsx(DotsMenu.DotsMenu, { "data-testid": 'dots-menu', options: options, buttonClassName: 'active-wallet-information__dots-menu', buttonClassNameWithOpenMenu: 'active-wallet-information__dots-menu' })] }), jsxRuntime.jsx(NetworkPicker.NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, isNetworkPickerOpen: isNetworkPickerOpen, currentNetwork: network, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'active-wallet-information__network-picker', buttonClassName: 'active-wallet-information__network-picker-button', evmNetworks: evmNetworks, showNetworkName: true })] })] }), testnet && (jsxRuntime.jsx(Alert.Alert, { variant: 'warning', children: t('dyn_active_wallet_info.testnet_warning') }))] }), jsxRuntime.jsxs("div", { className: 'balance-container', children: [jsxRuntime.jsx(Typography.Typography, { color: 'secondary', variant: 'body_small', children: "Balance" }), primaryWallet && (jsxRuntime.jsx(Balance.Balance, { className: 'balance-container__balance', connector: primaryWallet.connector, address: primaryWallet.address, network: network }))] })] }));
 };
 
 exports.ActiveWalletInformation = ActiveWalletInformation;

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

@@ -111,7 +111,7 @@ const ActiveWalletInformation = () => {
         [];
     return (jsxs("div", { className: 'active-wallet-information-container', "data-testid": 'active-wallet-information', children: [jsxs("div", { className: 'active-wallet-information', children: [jsxs("div", { className: 'active-wallet-information__header', children: [jsx("div", { className: 'active-wallet-information__avatar--centered', children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsx("div", { className: 'active-wallet-information__avatar', children: jsx("img", { src: nameService === null || nameService === void 0 ? void 0 : nameService.avatar, alt: '' }) })) : (jsx("div", { className: 'active-wallet-information__wallet-img', children: jsx(AuthProviderIcon, { jwt: authToken, iconSize: ICON_SIZE, showStatus: true }) })) }), jsxs("div", { className: 'active-wallet-information__details', children: [jsxs("div", { className: classNames('active-wallet-information__actions-container', {
                                             'active-wallet-information__actions-container--centered': !(nameService === null || nameService === void 0 ? void 0 : nameService.name),
-                                        }), children: [jsxs("div", { children: [jsx(Typography, { className: 'active-wallet-information__handle', color: 'primary', variant: 'body_normal', children: nameService === null || nameService === void 0 ? void 0 : nameService.name }), jsx(Typography, { className: 'active-wallet-information__address', weight: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'regular' : 'medium', variant: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'body_small' : 'body_normal', color: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'secondary' : 'primary', children: shortenWalletAddress(address, 4, 4) })] }), jsx(DotsMenu, { "data-testid": 'dots-menu', options: options, buttonClassName: 'active-wallet-information__dots-menu', buttonClassNameWithOpenMenu: 'active-wallet-information__dots-menu' })] }), jsx(NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'active-wallet-information__network-picker', buttonClassName: 'active-wallet-information__network-picker-button', evmNetworks: evmNetworks, showNetworkName: true })] })] }), testnet && (jsx(Alert, { variant: 'warning', children: t('dyn_active_wallet_info.testnet_warning') }))] }), jsxs("div", { className: 'balance-container', children: [jsx(Typography, { color: 'secondary', variant: 'body_small', children: "Balance" }), primaryWallet && (jsx(Balance, { className: 'balance-container__balance', connector: primaryWallet.connector, address: primaryWallet.address, network: network }))] })] }));
+                                        }), children: [jsxs("div", { children: [jsx(Typography, { className: 'active-wallet-information__handle', color: 'primary', variant: 'body_normal', children: nameService === null || nameService === void 0 ? void 0 : nameService.name }), jsx(Typography, { className: 'active-wallet-information__address', weight: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'regular' : 'medium', variant: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'body_small' : 'body_normal', color: (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? 'secondary' : 'primary', children: shortenWalletAddress(address, 4, 4) })] }), jsx(DotsMenu, { "data-testid": 'dots-menu', options: options, buttonClassName: 'active-wallet-information__dots-menu', buttonClassNameWithOpenMenu: 'active-wallet-information__dots-menu' })] }), jsx(NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, isNetworkPickerOpen: isNetworkPickerOpen, currentNetwork: network, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'active-wallet-information__network-picker', buttonClassName: 'active-wallet-information__network-picker-button', evmNetworks: evmNetworks, showNetworkName: true })] })] }), testnet && (jsx(Alert, { variant: 'warning', children: t('dyn_active_wallet_info.testnet_warning') }))] }), jsxs("div", { className: 'balance-container', children: [jsx(Typography, { color: 'secondary', variant: 'body_small', children: "Balance" }), primaryWallet && (jsx(Balance, { className: 'balance-container__balance', connector: primaryWallet.connector, address: primaryWallet.address, network: network }))] })] }));
 };
 
 export { ActiveWalletInformation };

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

@@ -62,7 +62,7 @@ require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 
 const DynamicNav = () => {
     const [isNetworkPickerOpen, setIsNetworkPickerOpen] = React.useState(false);
-    const { primaryWallet, projectSettings } = useInternalDynamicContext.useInternalDynamicContext();
+    const { primaryWallet, projectSettings, network } = useInternalDynamicContext.useInternalDynamicContext();
     const { inlineControlsRef } = DynamicWidgetContext.useWidgetContext();
     const evmNetworks = ((primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) &&
         primaryWallet.connector.evmNetworks) ||
@@ -70,7 +70,7 @@ const DynamicNav = () => {
     if (!projectSettings)
         return null;
     const shouldHideNetwork = projectSettings.sdk.hideNetworkInDynamicWidget;
-    return (jsxRuntime.jsx(IsBrowser.IsBrowser, { children: jsxRuntime.jsxs("div", { ref: inlineControlsRef, "data-testid": 'DynamicNav', className: 'dynamic-widget-inline-controls', children: [!shouldHideNetwork && primaryWallet && (jsxRuntime.jsx(PopperContext.PopperProvider, { children: jsxRuntime.jsx(NetworkPicker.NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'dynamic-widget-inline-controls__network-picker-main', buttonClassName: 'dynamic-widget-inline-controls__network-picker', listClassName: 'dynamic-widget-inline-controls__network-picker-list', checkboxClassName: 'dynamic-widget-inline-controls__network-picker-checkbox', evmNetworks: evmNetworks }) })), jsxRuntime.jsx("div", { className: 'dynamic-widget-inline-controls__account-control-container', children: jsxRuntime.jsx(AccountControl.AccountControl, { className: 'dynamic-widget-inline-controls__account-control' }) })] }) }));
+    return (jsxRuntime.jsx(IsBrowser.IsBrowser, { children: jsxRuntime.jsxs("div", { ref: inlineControlsRef, "data-testid": 'DynamicNav', className: 'dynamic-widget-inline-controls', children: [!shouldHideNetwork && primaryWallet && (jsxRuntime.jsx(PopperContext.PopperProvider, { children: jsxRuntime.jsx(NetworkPicker.NetworkPicker, { currentNetwork: network, connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'dynamic-widget-inline-controls__network-picker-main', buttonClassName: 'dynamic-widget-inline-controls__network-picker', listClassName: 'dynamic-widget-inline-controls__network-picker-list', checkboxClassName: 'dynamic-widget-inline-controls__network-picker-checkbox', evmNetworks: evmNetworks }) })), jsxRuntime.jsx("div", { className: 'dynamic-widget-inline-controls__account-control-container', children: jsxRuntime.jsx(AccountControl.AccountControl, { className: 'dynamic-widget-inline-controls__account-control' }) })] }) }));
 };
 const ShadowedDynamicNav = () => (jsxRuntime.jsx(ShadowDOM.ShadowDOM, { children: jsxRuntime.jsx(DynamicNav, {}) }));
 

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

@@ -58,7 +58,7 @@ import '../../../../components/MenuList/Dropdown/Dropdown.js';
 
 const DynamicNav = () => {
     const [isNetworkPickerOpen, setIsNetworkPickerOpen] = useState(false);
-    const { primaryWallet, projectSettings } = useInternalDynamicContext();
+    const { primaryWallet, projectSettings, network } = useInternalDynamicContext();
     const { inlineControlsRef } = useWidgetContext();
     const evmNetworks = ((primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) &&
         primaryWallet.connector.evmNetworks) ||
@@ -66,7 +66,7 @@ const DynamicNav = () => {
     if (!projectSettings)
         return null;
     const shouldHideNetwork = projectSettings.sdk.hideNetworkInDynamicWidget;
-    return (jsx(IsBrowser, { children: jsxs("div", { ref: inlineControlsRef, "data-testid": 'DynamicNav', className: 'dynamic-widget-inline-controls', children: [!shouldHideNetwork && primaryWallet && (jsx(PopperProvider, { children: jsx(NetworkPicker, { connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'dynamic-widget-inline-controls__network-picker-main', buttonClassName: 'dynamic-widget-inline-controls__network-picker', listClassName: 'dynamic-widget-inline-controls__network-picker-list', checkboxClassName: 'dynamic-widget-inline-controls__network-picker-checkbox', evmNetworks: evmNetworks }) })), jsx("div", { className: 'dynamic-widget-inline-controls__account-control-container', children: jsx(AccountControl, { className: 'dynamic-widget-inline-controls__account-control' }) })] }) }));
+    return (jsx(IsBrowser, { children: jsxs("div", { ref: inlineControlsRef, "data-testid": 'DynamicNav', className: 'dynamic-widget-inline-controls', children: [!shouldHideNetwork && primaryWallet && (jsx(PopperProvider, { children: jsx(NetworkPicker, { currentNetwork: network, connector: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, mainClassName: 'dynamic-widget-inline-controls__network-picker-main', buttonClassName: 'dynamic-widget-inline-controls__network-picker', listClassName: 'dynamic-widget-inline-controls__network-picker-list', checkboxClassName: 'dynamic-widget-inline-controls__network-picker-checkbox', evmNetworks: evmNetworks }) })), jsx("div", { className: 'dynamic-widget-inline-controls__account-control-container', children: jsx(AccountControl, { className: 'dynamic-widget-inline-controls__account-control' }) })] }) }));
 };
 const ShadowedDynamicNav = () => (jsx(ShadowDOM, { children: jsx(DynamicNav, {}) }));
 

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

@@ -48,6 +48,7 @@ require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUse
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 var PopperContext = require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('i18next');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 var IsBrowser = require('../../../../components/IsBrowser/IsBrowser.cjs');

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

@@ -44,6 +44,7 @@ import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import { PopperProvider } from '../../../../components/Popper/PopperContext/PopperContext.js';
+import 'i18next';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import { IsBrowser } from '../../../../components/IsBrowser/IsBrowser.js';

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

@@ -38,6 +38,7 @@ require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
@@ -49,7 +50,6 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

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

@@ -34,6 +34,7 @@ import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
@@ -45,7 +46,6 @@ import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

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

@@ -38,6 +38,7 @@ require('../../../../../../components/Popper/Popper/Popper.cjs');
 var PopperContext = require('../../../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../../../components/OverlayCard/OverlayCard.context.cjs');
@@ -50,7 +51,6 @@ require('../../../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../../../../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../../../context/DynamicWidgetContext.cjs');
 require('../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');

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

@@ -34,6 +34,7 @@ import '../../../../../../components/Popper/Popper/Popper.js';
 import { PopperProvider } from '../../../../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../../../components/OverlayCard/OverlayCard.context.js';
@@ -46,7 +47,6 @@ import '../../../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../../../../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../../../context/DynamicWidgetContext.js';
 import '../../../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';

package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.cjs

@@ -37,6 +37,7 @@ require('../../../components/Popper/Popper/Popper.cjs');
 require('../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('i18next');
 require('../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../components/OverlayCard/OverlayCard.context.cjs');
@@ -49,7 +50,6 @@ require('../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('qrcode');
 require('../../../context/LoadingContext/LoadingContext.cjs');
-require('i18next');
 require('../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/types');
 require('../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');

package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.js

@@ -33,6 +33,7 @@ import '../../../components/Popper/Popper/Popper.js';
 import '../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import 'i18next';
 import '../../../components/InlineWidget/InlineWidget.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../components/OverlayCard/OverlayCard.context.js';
@@ -45,7 +46,6 @@ import '../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'qrcode';
 import '../../../context/LoadingContext/LoadingContext.js';
-import 'i18next';
 import '../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/types';
 import '../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';

package/src/lib/widgets/DynamicWidget/helpers/helpers.cjs

@@ -29,11 +29,10 @@ const copyToClipboard = (textToCopy) => {
 // First apply ceil with very high accuracy, to account for floating point inaccuracies
 // const smartFloor = (value: number) => Math.floor(value);
 const smartFloor = (value) => Math.floor(ceil.ceil(value, 13));
-const MIN_BALANCE_VALUE = 0.0001;
 const WITHOUT_DECIMAL_VALUE = 1000;
 const MAX_BALANCE_VALUE = 1000000;
-const PRECISION_FLOOR_DIVIDER = 1 / MIN_BALANCE_VALUE;
-const roundBalance = (balanceString) => {
+const PRECISION_FLOOR_DIVIDER = 10000;
+const roundBalance = (balanceString, decimals = 4) => {
     const clearedBalance = parseFloat(replaceAll(balanceString, '"', ''));
     if (clearedBalance > MAX_BALANCE_VALUE) {
         const dividedValue = Math.floor(clearedBalance);
@@ -44,10 +43,11 @@ const roundBalance = (balanceString) => {
     if (clearedBalance > WITHOUT_DECIMAL_VALUE) {
         return String(Math.floor(clearedBalance));
     }
-    if (clearedBalance < MIN_BALANCE_VALUE && clearedBalance > 0)
-        return `< ${MIN_BALANCE_VALUE}`;
-    const roundedBalance = smartFloor(clearedBalance * PRECISION_FLOOR_DIVIDER) /
-        PRECISION_FLOOR_DIVIDER;
+    const decimalsPrecision = Math.pow(10, decimals);
+    const minBalanceValue = 1 / decimalsPrecision;
+    if (clearedBalance < minBalanceValue && clearedBalance > 0)
+        return `< ${minBalanceValue}`;
+    const roundedBalance = smartFloor(clearedBalance * decimalsPrecision) / decimalsPrecision;
     if (roundedBalance === 0)
         return '0.0';
     return String(roundedBalance);

package/src/lib/widgets/DynamicWidget/helpers/helpers.d.ts

@@ -4,6 +4,6 @@ export * from './getPasskeyProviderFromUserAgent';
 export * from './getTimeSince';
 export declare const replaceAll: (text: string, char: string, replace: string) => string;
 export declare const copyToClipboard: (textToCopy: string) => void;
-export declare const roundBalance: (balanceString: string) => string;
+export declare const roundBalance: (balanceString: string, decimals?: number) => string;
 export declare const capitalize: (text: string) => string;
 export declare const getExportKeysOption: (connector?: WalletConnector, providerSettings?: Provider[]) => (() => void) | undefined;

package/src/lib/widgets/DynamicWidget/helpers/helpers.js

@@ -25,11 +25,10 @@ const copyToClipboard = (textToCopy) => {
 // First apply ceil with very high accuracy, to account for floating point inaccuracies
 // const smartFloor = (value: number) => Math.floor(value);
 const smartFloor = (value) => Math.floor(ceil(value, 13));
-const MIN_BALANCE_VALUE = 0.0001;
 const WITHOUT_DECIMAL_VALUE = 1000;
 const MAX_BALANCE_VALUE = 1000000;
-const PRECISION_FLOOR_DIVIDER = 1 / MIN_BALANCE_VALUE;
-const roundBalance = (balanceString) => {
+const PRECISION_FLOOR_DIVIDER = 10000;
+const roundBalance = (balanceString, decimals = 4) => {
     const clearedBalance = parseFloat(replaceAll(balanceString, '"', ''));
     if (clearedBalance > MAX_BALANCE_VALUE) {
         const dividedValue = Math.floor(clearedBalance);
@@ -40,10 +39,11 @@ const roundBalance = (balanceString) => {
     if (clearedBalance > WITHOUT_DECIMAL_VALUE) {
         return String(Math.floor(clearedBalance));
     }
-    if (clearedBalance < MIN_BALANCE_VALUE && clearedBalance > 0)
-        return `< ${MIN_BALANCE_VALUE}`;
-    const roundedBalance = smartFloor(clearedBalance * PRECISION_FLOOR_DIVIDER) /
-        PRECISION_FLOOR_DIVIDER;
+    const decimalsPrecision = Math.pow(10, decimals);
+    const minBalanceValue = 1 / decimalsPrecision;
+    if (clearedBalance < minBalanceValue && clearedBalance > 0)
+        return `< ${minBalanceValue}`;
+    const roundedBalance = smartFloor(clearedBalance * decimalsPrecision) / decimalsPrecision;
     if (roundedBalance === 0)
         return '0.0';
     return String(roundedBalance);

package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var reactI18next = require('react-i18next');
 var iconic = require('@dynamic-labs/iconic');
-require('react');
 var Typography = require('../../../../../components/Typography/Typography.cjs');
 require('@dynamic-labs/sdk-api');
 require('../../../../../shared/logger.cjs');
@@ -21,6 +21,7 @@ require('../../../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
+var classNames = require('../../../../../utils/functions/classNames/classNames.cjs');
 require('react-dom');
 require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
@@ -71,6 +72,7 @@ const mapPasskeyProviderToIcon = {
 };
 const PasskeyCard = ({ passkey }) => {
     const { t } = reactI18next.useTranslation();
+    const [showTooltip, setShowTooltip] = React.useState(false);
     const { value: timeSinceValue, unit: timeSinceUnit } = getTimeSince.getTimeSince(passkey.createdAt);
     const PasskeyProviderIcon = () => {
         if (!passkey.userAgent)
@@ -88,11 +90,19 @@ const PasskeyCard = ({ passkey }) => {
             return null;
         return t(`dyn_manage_passkeys.passkey_providers.${provider}`);
     };
-    return (jsxRuntime.jsxs("div", { className: 'passkey-card', children: [jsxRuntime.jsxs("div", { className: 'passkey-card__info', children: [jsxRuntime.jsx("div", { className: 'passkey-card__info__icon', children: jsxRuntime.jsx(PasskeyProviderIcon, {}) }), jsxRuntime.jsxs("div", { className: 'passkey-card__info__text', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: shortenEmail.shortenEmail(passkey.alias, {
-                                    breakpoint: 12,
-                                    cutEnd: 4,
-                                    cutStart: 4,
-                                }) }), getPasskeyProviderName() && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: [t('dyn_manage_passkeys.passkey_from'), " ", getPasskeyProviderName()] }))] })] }), jsxRuntime.jsx("div", { className: 'passkey-card__date', children: jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: [t('dyn_time_since.created'), ' ', `${timeSinceValue} ${timeSinceUnit} ${t('dyn_time_since.ago')}`] }) })] }));
+    const handleShowTooltip = () => {
+        setShowTooltip(true);
+        setTimeout(() => {
+            setShowTooltip(false);
+        }, 2000);
+    };
+    return (jsxRuntime.jsxs("div", { className: 'passkey-card', children: [jsxRuntime.jsxs("div", { className: 'passkey-card__info', children: [jsxRuntime.jsx("div", { className: 'passkey-card__info__icon', "data-testId": 'provider-icon', children: jsxRuntime.jsx(PasskeyProviderIcon, {}) }), jsxRuntime.jsxs("div", { className: 'passkey-card__info__text', children: [jsxRuntime.jsxs(Typography.Typography, { "data-testid": 'passkey-alias', variant: 'body_normal', color: 'primary', title: passkey.alias, onClick: handleShowTooltip, children: [shortenEmail.shortenEmail(passkey.alias, {
+                                        breakpoint: 12,
+                                        cutEnd: 4,
+                                        cutStart: 4,
+                                    }), jsxRuntime.jsx("p", { className: classNames.classNames('passkey-card__info__tooltip', {
+                                            'passkey-card__info__tooltip--visible': showTooltip,
+                                        }), children: passkey.alias })] }), getPasskeyProviderName() && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: [t('dyn_manage_passkeys.passkey_from'), " ", getPasskeyProviderName()] }))] })] }), jsxRuntime.jsx("div", { className: 'passkey-card__date', children: jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: [t('dyn_time_since.created'), ' ', `${timeSinceValue} ${timeSinceUnit} ${t('dyn_time_since.ago')}`] }) })] }));
 };
 
 exports.PasskeyCard = PasskeyCard;