@dynamic-labs/sdk-react-core 4.30.0 → 4.30.2

package/src/lib/components/SandboxIndicatorWrapper/SandboxIndicatorWrapper.js

@@ -83,7 +83,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.cjs

@@ -91,7 +91,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 var PasskeyContext = require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.js

@@ -87,7 +87,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import { usePasskeyContext } from '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/SendBalanceForm/SendBalanceForm.cjs

@@ -90,7 +90,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 var sendBalances = require('../../store/state/sendBalances.cjs');

package/src/lib/components/SendBalanceForm/SendBalanceForm.js

@@ -86,7 +86,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import { useSendBalanceState, setSendBalanceVariable } from '../../store/state/sendBalances.js';

package/src/lib/components/SendBalancePageLayout/SendBalancePageLayout.cjs

@@ -96,7 +96,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 var SendBalanceForm = require('../SendBalanceForm/SendBalanceForm.cjs');

package/src/lib/components/SendBalancePageLayout/SendBalancePageLayout.js

@@ -92,7 +92,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import { SendBalanceForm } from '../SendBalanceForm/SendBalanceForm.js';

package/src/lib/components/SendBalancePageLayout/components/TokensBalanceDropdown/TokensBalanceDropdown.cjs

@@ -99,7 +99,7 @@ require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/Se
 require('@hcaptcha/react-hcaptcha');
 require('../../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
-require('../../../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../../../../store/state/tokenBalances.cjs');
 require('../../../../store/state/multichainBalances.cjs');

package/src/lib/components/SendBalancePageLayout/components/TokensBalanceDropdown/TokensBalanceDropdown.js

@@ -95,7 +95,7 @@ import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/Sec
 import '@hcaptcha/react-hcaptcha';
 import '../../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
-import '../../../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../../../../store/state/tokenBalances.js';
 import '../../../../store/state/multichainBalances.js';

package/src/lib/components/ShadowDOM/ShadowDOM.cjs

@@ -86,7 +86,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/ShadowDOM/ShadowDOM.js

@@ -82,7 +82,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/SignMessagePreview/components/SignTypedDataPreview/SignTypedDataPreview.cjs

@@ -6,18 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var Typography = require('../../../Typography/Typography.cjs');
 var capitalize = require('../../../../shared/utils/functions/capitalize/capitalize.cjs');
-require('@dynamic-labs/sdk-api-core');
-require('../../../../shared/logger.cjs');
-require('@dynamic-labs/iconic');
-require('@dynamic-labs/wallet-connector-core');
-require('react');
-require('../../../../context/ViewContext/ViewContext.cjs');
-require('@dynamic-labs/wallet-book');
 var shortenWalletAddress = require('../../../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
-require('@dynamic-labs/utils');
-require('../../../../utils/constants/colors.cjs');
-require('../../../../utils/constants/values.cjs');
-require('../../../../shared/consts/index.cjs');
 
 const SignTypedDataPreview = ({ currentType, types, showTypeName = false, data }) => {
     const fields = types[currentType].map((field) => {
@@ -33,9 +22,7 @@ const SignTypedDataPreview = ({ currentType, types, showTypeName = false, data }
         }
         const fieldData = data === null || data === void 0 ? void 0 : data[field.name];
         const fieldType = field.type;
-        return (jsxRuntime.jsx(FieldRow, { name: capitalize.capitalize(field.name), data: fieldData, displayValue: fieldType === 'address'
-                ? shortenWalletAddress.shortenWalletAddress(fieldData, 4, 4)
-                : fieldData }, field.name));
+        return (jsxRuntime.jsx(FieldRow, { name: capitalize.capitalize(field.name), data: fieldData, displayValue: fieldType === 'address' ? shortenWalletAddress.shortenWalletAddress(fieldData) : fieldData }, field.name));
     });
     if (showTypeName) {
         return jsxRuntime.jsx(TypeSection, { title: currentType, children: fields });

package/src/lib/components/SignMessagePreview/components/SignTypedDataPreview/SignTypedDataPreview.js

@@ -2,18 +2,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Typography } from '../../../Typography/Typography.js';
 import { capitalize } from '../../../../shared/utils/functions/capitalize/capitalize.js';
-import '@dynamic-labs/sdk-api-core';
-import '../../../../shared/logger.js';
-import '@dynamic-labs/iconic';
-import '@dynamic-labs/wallet-connector-core';
-import 'react';
-import '../../../../context/ViewContext/ViewContext.js';
-import '@dynamic-labs/wallet-book';
 import { shortenWalletAddress } from '../../../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
-import '@dynamic-labs/utils';
-import '../../../../utils/constants/colors.js';
-import '../../../../utils/constants/values.js';
-import '../../../../shared/consts/index.js';
 
 const SignTypedDataPreview = ({ currentType, types, showTypeName = false, data }) => {
     const fields = types[currentType].map((field) => {
@@ -29,9 +18,7 @@ const SignTypedDataPreview = ({ currentType, types, showTypeName = false, data }
         }
         const fieldData = data === null || data === void 0 ? void 0 : data[field.name];
         const fieldType = field.type;
-        return (jsx(FieldRow, { name: capitalize(field.name), data: fieldData, displayValue: fieldType === 'address'
-                ? shortenWalletAddress(fieldData, 4, 4)
-                : fieldData }, field.name));
+        return (jsx(FieldRow, { name: capitalize(field.name), data: fieldData, displayValue: fieldType === 'address' ? shortenWalletAddress(fieldData) : fieldData }, field.name));
     });
     if (showTypeName) {
         return jsx(TypeSection, { title: currentType, children: fields });

package/src/lib/components/SocialSignIn/SocialSignIn.cjs

@@ -94,7 +94,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/SocialSignIn/SocialSignIn.js

@@ -90,7 +90,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/SyncAuthFlow/SyncAuthFlow.cjs

@@ -86,7 +86,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/SyncAuthFlow/SyncAuthFlow.js

@@ -82,7 +82,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/Tooltip/Tooltip.cjs

@@ -91,7 +91,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/Tooltip/Tooltip.js

@@ -87,7 +87,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/TosAndPp/TosAndPp.cjs

@@ -88,7 +88,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');

package/src/lib/components/TosAndPp/TosAndPp.js

@@ -84,7 +84,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';

package/src/lib/components/TransactionCard/SendBalanceTransactionCard.cjs

@@ -12,15 +12,11 @@ require('react');
 var tooltip = require('../../shared/assets/tooltip.cjs');
 require('../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/wallet-book');
-var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../utils/constants/values.cjs');
 require('../../shared/consts/index.cjs');
-var networksAndChains = require('../../utils/functions/networksAndChains/networksAndChains.cjs');
-var Icon = require('../Icon/Icon.cjs');
-var utils = require('../TransactionConfirmationPageLayout/utils.cjs');
-var Typography = require('../Typography/Typography.cjs');
+var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 require('../../events/dynamicEvents.cjs');
@@ -30,6 +26,7 @@ require('../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 require('../../store/state/nonce/nonce.cjs');
+var networksAndChains = require('../../utils/functions/networksAndChains/networksAndChains.cjs');
 require('@dynamic-labs-sdk/client/core');
 require('../../client/client.cjs');
 require('@dynamic-labs-sdk/client');
@@ -65,6 +62,8 @@ require('../../store/state/walletOptions/walletOptions.cjs');
 require('react-i18next');
 require('../Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../Alert/Alert.cjs');
+var Typography = require('../Typography/Typography.cjs');
+var Icon = require('../Icon/Icon.cjs');
 var Tooltip = require('../Tooltip/Tooltip.cjs');
 require('../IconButton/IconButton.cjs');
 require('../InlineWidget/InlineWidget.cjs');
@@ -94,10 +93,11 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');
+var utils = require('../TransactionConfirmationPageLayout/utils.cjs');
 var useNetworkConfigurationsFromProjectSettings = require('../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.cjs');
 require('../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
@@ -131,7 +131,7 @@ const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol,
                                                                 })
                                                                 : '')] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', children: currencySymbol })] }), transactionValue && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'error-1', "data-testid": 'transaction-transfer-amount-fiat', children: ["$", utils.getDisplayFiatPrice(Number(transactionValue) || Number(valueRounded) || 0, currentToken)] }))] }), jsxRuntime.jsx("div", { className: 'transaction-card__icon', children: jsxRuntime.jsx("div", { className: 'transaction-card__icon__container', children: jsxRuntime.jsx("img", { src: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.logoURI) ||
                                                 (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.nativeCurrency.iconUrl), alt: currencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }) }) }));
-    const renderTransactionDetails = () => (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsxs("div", { className: 'transaction-card__details', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress.shortenWalletAddress(transaction.to, 4, 4) })] }), !isGasSponsored && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', "data-testid": 'transaction-network', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxRuntime.jsxs("div", { className: 'transaction-card__network-info', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsxRuntime.jsx("img", { src: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0]) || (chain === null || chain === void 0 ? void 0 : chain.icon), alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsxRuntime.jsx(Tooltip.Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsxRuntime.jsx(Icon.Icon, { size: 'small', className: 'fee-tooltip', children: jsxRuntime.jsx(tooltip.ReactComponent, {}) }) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__value', children: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) ? (jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: Number(gasFiatValue) <= 0.01
+    const renderTransactionDetails = () => (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsxs("div", { className: 'transaction-card__details', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress.shortenWalletAddress(transaction.to) })] }), !isGasSponsored && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', "data-testid": 'transaction-network', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxRuntime.jsxs("div", { className: 'transaction-card__network-info', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsxRuntime.jsx("img", { src: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0]) || (chain === null || chain === void 0 ? void 0 : chain.icon), alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsxRuntime.jsx(Tooltip.Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsxRuntime.jsx(Icon.Icon, { size: 'small', className: 'fee-tooltip', children: jsxRuntime.jsx(tooltip.ReactComponent, {}) }) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__value', children: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) ? (jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: Number(gasFiatValue) <= 0.01
                                             ? '<$0.01'
                                             : `$${gasFiatValue}` })) : (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: [transaction.fee.gas
                                                 ? transaction.format(transaction.fee.gas, {

package/src/lib/components/TransactionCard/SendBalanceTransactionCard.js

@@ -8,15 +8,11 @@ import 'react';
 import { ReactComponent as SvgTooltip } from '../../shared/assets/tooltip.js';
 import '../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
-import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../utils/constants/values.js';
 import '../../shared/consts/index.js';
-import { getNetworkInfoEntry } from '../../utils/functions/networksAndChains/networksAndChains.js';
-import { Icon } from '../Icon/Icon.js';
-import { getDisplayFiatPrice } from '../TransactionConfirmationPageLayout/utils.js';
-import { Typography } from '../Typography/Typography.js';
+import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '../../context/DynamicContext/DynamicContext.js';
 import '../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '../../events/dynamicEvents.js';
@@ -26,6 +22,7 @@ import '../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import '../../store/state/nonce/nonce.js';
+import { getNetworkInfoEntry } from '../../utils/functions/networksAndChains/networksAndChains.js';
 import '@dynamic-labs-sdk/client/core';
 import '../../client/client.js';
 import '@dynamic-labs-sdk/client';
@@ -61,6 +58,8 @@ import '../../store/state/walletOptions/walletOptions.js';
 import 'react-i18next';
 import '../Accordion/components/AccordionItem/AccordionItem.js';
 import '../Alert/Alert.js';
+import { Typography } from '../Typography/Typography.js';
+import { Icon } from '../Icon/Icon.js';
 import { Tooltip } from '../Tooltip/Tooltip.js';
 import '../IconButton/IconButton.js';
 import '../InlineWidget/InlineWidget.js';
@@ -90,10 +89,11 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';
+import { getDisplayFiatPrice } from '../TransactionConfirmationPageLayout/utils.js';
 import { useNetworkConfigurationsFromProjectSettings } from '../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.js';
 import '../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
@@ -127,7 +127,7 @@ const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol,
                                                                 })
                                                                 : '')] }), jsx(Typography, { variant: 'body_normal', color: 'secondary', children: currencySymbol })] }), transactionValue && (jsxs(Typography, { variant: 'body_small', color: 'error-1', "data-testid": 'transaction-transfer-amount-fiat', children: ["$", getDisplayFiatPrice(Number(transactionValue) || Number(valueRounded) || 0, currentToken)] }))] }), jsx("div", { className: 'transaction-card__icon', children: jsx("div", { className: 'transaction-card__icon__container', children: jsx("img", { src: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.logoURI) ||
                                                 (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.nativeCurrency.iconUrl), alt: currencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }) }) }));
-    const renderTransactionDetails = () => (jsx("div", { className: 'transaction-card', children: jsxs("div", { className: 'transaction-card__details', children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress(transaction.to, 4, 4) })] }), !isGasSponsored && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', "data-testid": 'transaction-network', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxs("div", { className: 'transaction-card__network-info', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsx("img", { src: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0]) || (chain === null || chain === void 0 ? void 0 : chain.icon), alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsx(Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsx(Icon, { size: 'small', className: 'fee-tooltip', children: jsx(SvgTooltip, {}) }) })] }), jsx("div", { className: 'transaction-card__value', children: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) ? (jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: Number(gasFiatValue) <= 0.01
+    const renderTransactionDetails = () => (jsx("div", { className: 'transaction-card', children: jsxs("div", { className: 'transaction-card__details', children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress(transaction.to) })] }), !isGasSponsored && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', "data-testid": 'transaction-network', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxs("div", { className: 'transaction-card__network-info', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsx("img", { src: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0]) || (chain === null || chain === void 0 ? void 0 : chain.icon), alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsx(Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsx(Icon, { size: 'small', className: 'fee-tooltip', children: jsx(SvgTooltip, {}) }) })] }), jsx("div", { className: 'transaction-card__value', children: (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) ? (jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: Number(gasFiatValue) <= 0.01
                                             ? '<$0.01'
                                             : `$${gasFiatValue}` })) : (jsxs(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: [transaction.fee.gas
                                                 ? transaction.format(transaction.fee.gas, {

package/src/lib/components/TransactionCard/TransactionCard.cjs

@@ -13,7 +13,6 @@ require('@dynamic-labs/wallet-connector-core');
 var tooltip = require('../../shared/assets/tooltip.cjs');
 require('../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/wallet-book');
-var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../utils/constants/values.cjs');
@@ -81,6 +80,7 @@ require('../ShadowDOM/ShadowDOM.cjs');
 require('react-focus-lock');
 require('qrcode');
 var useFetchChain = require('../../widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.cjs');
+var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('formik');
 require('../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
@@ -93,7 +93,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');
@@ -237,8 +237,8 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
         }
         return `-- ${nativeCurrencySymbol}`;
     };
-    return (jsxRuntime.jsxs("div", { className: 'transaction-card-container', children: [allAssets.length > 0 && (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsx("div", { className: 'transaction-card__assets-container', children: allAssets.map((asset, index, array) => (jsxRuntime.jsx(React__default["default"].Fragment, { children: renderAssetTransfer(asset, index, array) }, `asset-${index}`))) }) })), jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsxs("div", { className: 'transaction-card__details', children: [recipient && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.recipient', children: t('dyn_send_transaction.confirmation.data.recipient') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-recipient', children: shortenWalletAddress.shortenWalletAddress(recipient, 4, 4) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' })] })), !recipient &&
-                            (transaction.to || ((_e = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _e === void 0 ? void 0 : _e[0])) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress.shortenWalletAddress((_f = transaction.to) !== null && _f !== void 0 ? _f : (_g = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _g === void 0 ? void 0 : _g[0], 4, 4) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' })] })), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxRuntime.jsxs("div", { className: 'transaction-card__network-info', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsxRuntime.jsx("img", { src: networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0], alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), !isGasSponsored && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsxRuntime.jsx(Tooltip.Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsxRuntime.jsx(Icon.Icon, { size: 'small', className: 'fee-tooltip', children: jsxRuntime.jsx(tooltip.ReactComponent, {}) }) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__value', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: getGasFeeDisplay() }) })] })] })), blockaidOn &&
+    return (jsxRuntime.jsxs("div", { className: 'transaction-card-container', children: [allAssets.length > 0 && (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsx("div", { className: 'transaction-card__assets-container', children: allAssets.map((asset, index, array) => (jsxRuntime.jsx(React__default["default"].Fragment, { children: renderAssetTransfer(asset, index, array) }, `asset-${index}`))) }) })), jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsxs("div", { className: 'transaction-card__details', children: [recipient && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.recipient', children: t('dyn_send_transaction.confirmation.data.recipient') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-recipient', children: shortenWalletAddress.shortenWalletAddress(recipient) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' })] })), !recipient &&
+                            (transaction.to || ((_e = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _e === void 0 ? void 0 : _e[0])) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress.shortenWalletAddress((_f = transaction.to) !== null && _f !== void 0 ? _f : (_g = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _g === void 0 ? void 0 : _g[0]) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__divider' })] })), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxRuntime.jsxs("div", { className: 'transaction-card__network-info', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsxRuntime.jsx("img", { src: networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0], alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), !isGasSponsored && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsxRuntime.jsx(Tooltip.Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsxRuntime.jsx(Icon.Icon, { size: 'small', className: 'fee-tooltip', children: jsxRuntime.jsx(tooltip.ReactComponent, {}) }) })] }), jsxRuntime.jsx("div", { className: 'transaction-card__value', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: getGasFeeDisplay() }) })] })] })), blockaidOn &&
                             totalAmountInUsd !== undefined &&
                             totalAmountInUsd > 0 &&
                             !(isAATransaction && !isGasSponsored) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-card__divider' }), jsxRuntime.jsxs("div", { className: 'transaction-card__row', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', weight: 'bold', copykey: 'dyn_send_transaction.confirmation.data.total', children: t('dyn_send_transaction.confirmation.data.total') }), jsxRuntime.jsx("div", { className: 'transaction-card__total-amount', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-total', children: getTotalAmountInUsdDisplay(totalAmountInUsd) }) })] })] }))] }) })] }));

package/src/lib/components/TransactionCard/TransactionCard.js

@@ -9,7 +9,6 @@ import '@dynamic-labs/wallet-connector-core';
 import { ReactComponent as SvgTooltip } from '../../shared/assets/tooltip.js';
 import '../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
-import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../utils/constants/values.js';
@@ -77,6 +76,7 @@ import '../ShadowDOM/ShadowDOM.js';
 import 'react-focus-lock';
 import 'qrcode';
 import { useFetchChain } from '../../widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.js';
+import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import 'formik';
 import '../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
@@ -89,7 +89,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';
@@ -229,8 +229,8 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
         }
         return `-- ${nativeCurrencySymbol}`;
     };
-    return (jsxs("div", { className: 'transaction-card-container', children: [allAssets.length > 0 && (jsx("div", { className: 'transaction-card', children: jsx("div", { className: 'transaction-card__assets-container', children: allAssets.map((asset, index, array) => (jsx(React__default.Fragment, { children: renderAssetTransfer(asset, index, array) }, `asset-${index}`))) }) })), jsx("div", { className: 'transaction-card', children: jsxs("div", { className: 'transaction-card__details', children: [recipient && (jsxs(Fragment, { children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.recipient', children: t('dyn_send_transaction.confirmation.data.recipient') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-recipient', children: shortenWalletAddress(recipient, 4, 4) })] }), jsx("div", { className: 'transaction-card__divider' })] })), !recipient &&
-                            (transaction.to || ((_e = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _e === void 0 ? void 0 : _e[0])) && (jsxs(Fragment, { children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress((_f = transaction.to) !== null && _f !== void 0 ? _f : (_g = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _g === void 0 ? void 0 : _g[0], 4, 4) })] }), jsx("div", { className: 'transaction-card__divider' })] })), jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxs("div", { className: 'transaction-card__network-info', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsx("img", { src: networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0], alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), !isGasSponsored && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsx(Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsx(Icon, { size: 'small', className: 'fee-tooltip', children: jsx(SvgTooltip, {}) }) })] }), jsx("div", { className: 'transaction-card__value', children: jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: getGasFeeDisplay() }) })] })] })), blockaidOn &&
+    return (jsxs("div", { className: 'transaction-card-container', children: [allAssets.length > 0 && (jsx("div", { className: 'transaction-card', children: jsx("div", { className: 'transaction-card__assets-container', children: allAssets.map((asset, index, array) => (jsx(React__default.Fragment, { children: renderAssetTransfer(asset, index, array) }, `asset-${index}`))) }) })), jsx("div", { className: 'transaction-card', children: jsxs("div", { className: 'transaction-card__details', children: [recipient && (jsxs(Fragment, { children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.recipient', children: t('dyn_send_transaction.confirmation.data.recipient') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-recipient', children: shortenWalletAddress(recipient) })] }), jsx("div", { className: 'transaction-card__divider' })] })), !recipient &&
+                            (transaction.to || ((_e = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _e === void 0 ? void 0 : _e[0])) && (jsxs(Fragment, { children: [jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.destination', children: t('dyn_send_transaction.confirmation.data.destination') }), jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-destination', children: shortenWalletAddress((_f = transaction.to) !== null && _f !== void 0 ? _f : (_g = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.counterparties) === null || _g === void 0 ? void 0 : _g[0]) })] }), jsx("div", { className: 'transaction-card__divider' })] })), jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.network', children: t('dyn_send_transaction.confirmation.data.network') }), jsxs("div", { className: 'transaction-card__network-info', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Ethereum' }), jsx("img", { src: networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.iconUrls[0], alt: (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.name) || 'Network icon', width: 16, height: 16, className: 'transaction-card__network-icon' })] })] }), !isGasSponsored && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsxs("div", { className: 'transaction-card__label-with-tooltip', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.gas_estimate', children: t('dyn_send_transaction.confirmation.data.gas_estimate') }), jsx(Tooltip, { content: 'Network fees are paid to process your transaction', className: 'transaction-confirmation', children: jsx(Icon, { size: 'small', className: 'fee-tooltip', children: jsx(SvgTooltip, {}) }) })] }), jsx("div", { className: 'transaction-card__value', children: jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: getGasFeeDisplay() }) })] })] })), blockaidOn &&
                             totalAmountInUsd !== undefined &&
                             totalAmountInUsd > 0 &&
                             !(isAATransaction && !isGasSponsored) && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-card__divider' }), jsxs("div", { className: 'transaction-card__row', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', weight: 'bold', copykey: 'dyn_send_transaction.confirmation.data.total', children: t('dyn_send_transaction.confirmation.data.total') }), jsx("div", { className: 'transaction-card__total-amount', children: jsx(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-total', children: getTotalAmountInUsdDisplay(totalAmountInUsd) }) })] })] }))] }) })] }));

package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.cjs

@@ -101,7 +101,7 @@ require('../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.c
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 var PasskeyContext = require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 var sendBalances = require('../../store/state/sendBalances.cjs');

package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.js

@@ -97,7 +97,7 @@ import '../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js
 import '../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
 import '../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../context/FooterAnimationContext/index.js';
-import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
+import '../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
 import { usePasskeyContext } from '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import { useSendBalanceState } from '../../store/state/sendBalances.js';

package/src/lib/components/TransactionStatusLayout/TransactionStatusLayout.cjs

@@ -17,7 +17,6 @@ require('@dynamic-labs/sdk-api-core');
 require('../../shared/logger.cjs');
 require('@dynamic-labs/wallet-connector-core');
 require('@dynamic-labs/wallet-book');
-var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('../../utils/constants/colors.cjs');
 require('../../utils/constants/values.cjs');
 require('../../shared/consts/index.cjs');
@@ -78,6 +77,7 @@ require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
 var Icon = require('../Icon/Icon.cjs');
+var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 var IconButton = require('../IconButton/IconButton.cjs');
 require('../MenuList/Dropdown/Dropdown.cjs');
@@ -105,7 +105,7 @@ require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/Secondar
 require('@hcaptcha/react-hcaptcha');
 require('../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.cjs');
 require('../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
-require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
+require('../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.cjs');
 require('../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../../store/state/tokenBalances.cjs');
 require('../../store/state/multichainBalances.cjs');
@@ -130,7 +130,7 @@ const TransactionStatusLayout = ({ destinationAddress, transactionValue, network
     }));
     const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close', children: jsxRuntime.jsx(close.ReactComponent, {}) }));
     const totalFiatCost = fiatUtils.getTotalFiatCost(currentToken, transaction, nativePrice, transactionValue);
-    return (jsxRuntime.jsxs("div", { className: 'transaction-status-layout', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsxRuntime.jsx(Icon.Icon, { size: 'large', className: 'transaction-status-layout__status-icon', children: jsxRuntime.jsx(checkBlue.ReactComponent, {}) }) }), jsxRuntime.jsxs("div", { className: 'transaction-status-layout__body', children: [jsxRuntime.jsxs("div", { className: 'transaction-status-layout__sent_to', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [t('dyn_send_transaction.succeeded.title'), ' '] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: shortenWalletAddress.shortenWalletAddress(destinationAddress, 3, 3) })] }), jsxRuntime.jsx("div", { className: 'transaction-status-layout__content', children: jsxRuntime.jsx("div", { className: 'transaction-status-layout__rows', children: jsxRuntime.jsxs(Typography.Typography, { variant: 'title', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [`${utils.getValueRounded(isNativeToken, transaction)} ${networkCurrency} `, showFiat &&
+    return (jsxRuntime.jsxs("div", { className: 'transaction-status-layout', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsxRuntime.jsx(Icon.Icon, { size: 'large', className: 'transaction-status-layout__status-icon', children: jsxRuntime.jsx(checkBlue.ReactComponent, {}) }) }), jsxRuntime.jsxs("div", { className: 'transaction-status-layout__body', children: [jsxRuntime.jsxs("div", { className: 'transaction-status-layout__sent_to', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [t('dyn_send_transaction.succeeded.title'), ' '] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: shortenWalletAddress.shortenWalletAddress(destinationAddress) })] }), jsxRuntime.jsx("div", { className: 'transaction-status-layout__content', children: jsxRuntime.jsx("div", { className: 'transaction-status-layout__rows', children: jsxRuntime.jsxs(Typography.Typography, { variant: 'title', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [`${utils.getValueRounded(isNativeToken, transaction)} ${networkCurrency} `, showFiat &&
                                         (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) &&
                                         totalFiatCost !== undefined &&
                                         `($${Number(totalFiatCost) <= 0.01 ? '<0.01' : totalFiatCost})`] }) }) }), jsxRuntime.jsx(AnimatePresence.AnimatePresence, { animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, {}), children: jsxRuntime.jsx("div", { className: 'transaction-confirmation__warning', children: jsxRuntime.jsx(Alert.Alert, { variant: 'info', copykey: 'dyn_send_transaction.info_message.refresh_balance_time', children: t('dyn_send_transaction.info_message.refresh_balance_time') }) }) }), jsxRuntime.jsx("div", { className: 'transaction-status-layout__transaction-link-container', children: txLink && (jsxRuntime.jsx(Typography.Typography, { as: 'a', href: txLink, target: '_blank', rel: 'noreferrer', className: 'transaction-status-layout__transaction-link-container__transaction-link', variant: 'body_small', children: t('dyn_wallet_funding.success_txn_link') })) }), jsxRuntime.jsx("div", { className: 'transaction-status-layout__actions', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'small', expanded: true, onClick: onDone, loading: false, copykey: 'dyn_send_transaction.succeeded.continue_button', dataTestId: 'transaction-done-continue', children: t('dyn_send_transaction.succeeded.continue_button') }) }), displayPoweredByDynamicFooter && (jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { classNameRoot: 'transaction-status-layout__footer' }))] })] }));