@dynamic-labs/sdk-react-core 4.29.1 → 4.29.3

package/CHANGELOG.md

@@ -1,4 +1,18 @@
 
+### [4.29.3](https://github.com/dynamic-labs/dynamic-auth/compare/v4.29.2...v4.29.3) (2025-08-26)
+
+### [4.29.2](https://github.com/dynamic-labs/dynamic-auth/compare/v4.29.1...v4.29.2) (2025-08-25)
+
+
+### Features
+
+* return wallet metadata in walletOption ([#9391](https://github.com/dynamic-labs/dynamic-auth/issues/9391)) ([4ddd7ea](https://github.com/dynamic-labs/dynamic-auth/commit/4ddd7eadc37d646ab5d39fab420e598e47f5741b))
+
+
+### Bug Fixes
+
+* export usePayWithDynamic ([#9395](https://github.com/dynamic-labs/dynamic-auth/issues/9395)) ([059999e](https://github.com/dynamic-labs/dynamic-auth/commit/059999e3b156510ce95c6bf413c0a0123a52b251))
+
 ### [4.29.1](https://github.com/dynamic-labs/dynamic-auth/compare/v4.29.0...v4.29.1) (2025-08-21)
 
 

package/package.cjs

@@ -3,9 +3,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "4.29.1";
+var version = "4.29.3";
 var dependencies = {
-	"@dynamic-labs/sdk-api-core": "0.0.753",
+	"@dynamic-labs/sdk-api-core": "0.0.758",
 	"@dynamic-labs-sdk/client": "0.0.1-alpha.24",
 	"@hcaptcha/react-hcaptcha": "1.4.4",
 	"@thumbmarkjs/thumbmarkjs": "0.16.0",

package/package.js

@@ -1,7 +1,7 @@
 'use client'
-var version = "4.29.1";
+var version = "4.29.3";
 var dependencies = {
-	"@dynamic-labs/sdk-api-core": "0.0.753",
+	"@dynamic-labs/sdk-api-core": "0.0.758",
 	"@dynamic-labs-sdk/client": "0.0.1-alpha.24",
 	"@hcaptcha/react-hcaptcha": "1.4.4",
 	"@thumbmarkjs/thumbmarkjs": "0.16.0",

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "4.29.1",
+  "version": "4.29.3",
   "dependencies": {
-    "@dynamic-labs/sdk-api-core": "0.0.753",
+    "@dynamic-labs/sdk-api-core": "0.0.758",
     "@dynamic-labs-sdk/client": "0.0.1-alpha.24",
     "@hcaptcha/react-hcaptcha": "1.4.4",
     "@thumbmarkjs/thumbmarkjs": "0.16.0",
@@ -15,16 +15,16 @@
     "yup": "0.32.11",
     "react-international-phone": "4.5.0",
     "bs58": "5.0.0",
-    "@dynamic-labs/assert-package-version": "4.29.1",
-    "@dynamic-labs/iconic": "4.29.1",
-    "@dynamic-labs/logger": "4.29.1",
-    "@dynamic-labs/multi-wallet": "4.29.1",
-    "@dynamic-labs/rpc-providers": "4.29.1",
-    "@dynamic-labs/store": "4.29.1",
-    "@dynamic-labs/types": "4.29.1",
-    "@dynamic-labs/utils": "4.29.1",
-    "@dynamic-labs/wallet-book": "4.29.1",
-    "@dynamic-labs/wallet-connector-core": "4.29.1",
+    "@dynamic-labs/assert-package-version": "4.29.3",
+    "@dynamic-labs/iconic": "4.29.3",
+    "@dynamic-labs/logger": "4.29.3",
+    "@dynamic-labs/multi-wallet": "4.29.3",
+    "@dynamic-labs/rpc-providers": "4.29.3",
+    "@dynamic-labs/store": "4.29.3",
+    "@dynamic-labs/types": "4.29.3",
+    "@dynamic-labs/utils": "4.29.3",
+    "@dynamic-labs/wallet-book": "4.29.3",
+    "@dynamic-labs/wallet-connector-core": "4.29.3",
     "eventemitter3": "5.0.1"
   },
   "devDependencies": {

package/src/index.cjs

@@ -165,6 +165,7 @@ var useSyncMfaFlow = require('./lib/utils/hooks/useSyncMfaFlow/useSyncMfaFlow.cj
 var useTelegramLogin = require('./lib/utils/hooks/useTelegramLogin/useTelegramLogin.cjs');
 var useUpgradeEmbeddedWallet = require('./lib/utils/hooks/useUpgradeEmbeddedWallet/useUpgradeEmbeddedWallet.cjs');
 var useDeleteUserAccount = require('./lib/utils/hooks/useDeleteUserAccount/useDeleteUserAccount.cjs');
+var usePayWithDynamic = require('./lib/utils/hooks/usePayWithDynamic/usePayWithDynamic.cjs');
 var useGetPasskeys = require('./lib/utils/hooks/useGetPasskeys/useGetPasskeys.cjs');
 var useRegisterPasskey = require('./lib/utils/hooks/useRegisterPasskey/useRegisterPasskey.cjs');
 var useAuthenticatePasskeyMFA = require('./lib/utils/hooks/useAuthenticatePasskeyMFA/useAuthenticatePasskeyMFA.cjs');
@@ -304,6 +305,7 @@ exports.useSyncMfaFlow = useSyncMfaFlow.useSyncMfaFlow;
 exports.useTelegramLogin = useTelegramLogin.useTelegramLogin;
 exports.useUpgradeEmbeddedWallet = useUpgradeEmbeddedWallet.useUpgradeEmbeddedWallet;
 exports.useDeleteUserAccount = useDeleteUserAccount.useDeleteUserAccount;
+exports.usePayWithDynamic = usePayWithDynamic.usePayWithDynamic;
 exports.useGetPasskeys = useGetPasskeys.useGetPasskeys;
 exports.useRegisterPasskey = useRegisterPasskey.useRegisterPasskey;
 exports.useAuthenticatePasskeyMFA = useAuthenticatePasskeyMFA.useAuthenticatePasskeyMFA;

package/src/index.d.ts

@@ -123,6 +123,7 @@ useFunding, } from './lib/utils/hooks/useFunding';
 export { useOnramp } from './lib/utils/hooks/useOnramp';
 export { useOpenFundingOptions } from './lib/utils/hooks/useOpenFundingOptions';
 export { useFundWithWallet } from './lib/utils/hooks/useFundWithWallet';
+export { usePayWithDynamic, type PayWithDynamicProps, } from './lib/utils/hooks/usePayWithDynamic';
 export { useUserUpdateRequest, useWalletConnectorEvent, } from './lib/utils/hooks';
 export { type VerifyOtp, useOtpVerificationRequest, } from './lib/utils/hooks/authenticationHooks/';
 export type { UpdateUserFieldsArg } from './lib/utils/hooks/';

package/src/index.js

@@ -161,6 +161,7 @@ export { useSyncMfaFlow } from './lib/utils/hooks/useSyncMfaFlow/useSyncMfaFlow.
 export { useTelegramLogin } from './lib/utils/hooks/useTelegramLogin/useTelegramLogin.js';
 export { useUpgradeEmbeddedWallet } from './lib/utils/hooks/useUpgradeEmbeddedWallet/useUpgradeEmbeddedWallet.js';
 export { useDeleteUserAccount } from './lib/utils/hooks/useDeleteUserAccount/useDeleteUserAccount.js';
+export { usePayWithDynamic } from './lib/utils/hooks/usePayWithDynamic/usePayWithDynamic.js';
 export { useGetPasskeys } from './lib/utils/hooks/useGetPasskeys/useGetPasskeys.js';
 export { useRegisterPasskey } from './lib/utils/hooks/useRegisterPasskey/useRegisterPasskey.js';
 export { useAuthenticatePasskeyMFA } from './lib/utils/hooks/useAuthenticatePasskeyMFA/useAuthenticatePasskeyMFA.js';

package/src/lib/Main.cjs

@@ -97,6 +97,7 @@ require('./store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('./store/state/tokenBalances.cjs');
 require('./store/state/multichainBalances.cjs');
 require('./shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
+var isSelectedWalletAlreadyConnected = require('./utils/functions/isSelectedWalletAlreadyConnected/isSelectedWalletAlreadyConnected.cjs');
 require('./components/InlineWidget/InlineWidget.cjs');
 require('./components/IsBrowser/IsBrowser.cjs');
 require('./components/Popper/Popper/Popper.cjs');
@@ -105,7 +106,6 @@ var Portal = require('./components/Portal/Portal.cjs');
 require('qrcode');
 var RenderView = require('./components/RenderView/RenderView.cjs');
 require('./main.global.cjs');
-var isSelectedWalletAlreadyConnected = require('./utils/functions/isSelectedWalletAlreadyConnected/isSelectedWalletAlreadyConnected.cjs');
 var useVerifyOnAwaitingSignature = require('./utils/hooks/multiWallet/useVerifyOnAwaitingSignature/useVerifyOnAwaitingSignature.cjs');
 
 const viewsToDisableCloseOnOverlayClick = [

package/src/lib/Main.js

@@ -93,6 +93,7 @@ import './store/state/connectorsInitializing/connectorsInitializing.js';
 import './store/state/tokenBalances.js';
 import './store/state/multichainBalances.js';
 import './shared/utils/functions/getInitialUrl/getInitialUrl.js';
+import { isSelectedWalletAlreadyConnected } from './utils/functions/isSelectedWalletAlreadyConnected/isSelectedWalletAlreadyConnected.js';
 import './components/InlineWidget/InlineWidget.js';
 import './components/IsBrowser/IsBrowser.js';
 import './components/Popper/Popper/Popper.js';
@@ -101,7 +102,6 @@ import { Portal } from './components/Portal/Portal.js';
 import 'qrcode';
 import { RenderView } from './components/RenderView/RenderView.js';
 import './main.global.js';
-import { isSelectedWalletAlreadyConnected } from './utils/functions/isSelectedWalletAlreadyConnected/isSelectedWalletAlreadyConnected.js';
 import { useVerifyOnAwaitingSignature } from './utils/hooks/multiWallet/useVerifyOnAwaitingSignature/useVerifyOnAwaitingSignature.js';
 
 const viewsToDisableCloseOnOverlayClick = [

package/src/lib/client/extension/user/useOnboardingCompleteUser/useOnboardingCompleteUser.js

@@ -1,5 +1,5 @@
 'use client'
-import { useMemo, useRef } from 'react';
+import { useRef, useMemo } from 'react';
 import { hasPendingRequirements } from '../../../../shared/utils/functions/hasPendingRequirements/hasPendingRequirements.js';
 import { convertSdkUserToUserProfile } from '../convertSdkUserToUserProfile/convertSdkUserToUserProfile.js';
 import { useUser } from '../useUser/useUser.js';

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

@@ -4,14 +4,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var reactI18next = require('react-i18next');
-require('react');
-require('../../context/DynamicContext/DynamicContext.cjs');
-require('../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 require('@dynamic-labs/sdk-api-core');
 require('../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
+require('react');
 var tooltip = require('../../shared/assets/tooltip.cjs');
 require('../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/wallet-book');
@@ -20,6 +17,12 @@ 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');
+require('../../context/DynamicContext/DynamicContext.cjs');
+require('../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 require('../../events/dynamicEvents.cjs');
 require('../../../../_virtual/_tslib.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
@@ -27,7 +30,6 @@ 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');
@@ -60,10 +62,9 @@ require('../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 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');
@@ -97,7 +98,6 @@ require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.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');
@@ -111,9 +111,8 @@ require('../../store/state/multichainBalances.cjs');
 require('../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 
-const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, }) => {
+const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, t, }) => {
     var _a;
-    const { t } = reactI18next.useTranslation();
     const { primaryWallet, projectSettings, overrides } = useInternalDynamicContext.useInternalDynamicContext();
     const networkInfo = useNetworkConfigurationsFromProjectSettings.useNetworkConfigurationsFromProjectSettings({
         evmNetworksOverrides: overrides === null || overrides === void 0 ? void 0 : overrides.evmNetworks,
@@ -125,14 +124,13 @@ const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol,
         networkId: chain === null || chain === void 0 ? void 0 : chain.chainId,
         networkInfo,
     });
-    const renderTransferDetails = () => (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsx("div", { className: 'transaction-card__assets-container', children: jsxRuntime.jsx("div", { className: 'transaction-card__out', children: jsxRuntime.jsxs("div", { className: 'transaction-card__info-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.transfer.send', children: t('dyn_send_transaction.confirmation.data.transfer.send') }), jsxRuntime.jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-info', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-row', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'error-1', "data-testid": 'transaction-transfer-amount', children: ["-", valueRounded ||
+    const renderTransferDetails = () => (jsxRuntime.jsx("div", { className: 'transaction-card', children: jsxRuntime.jsx("div", { className: 'transaction-card__assets-container', children: jsxRuntime.jsx("div", { className: 'transaction-card__out', children: jsxRuntime.jsxs("div", { className: 'transaction-card__info-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', children: t('dyn_send_transaction.confirmation.data.transfer.send') }), jsxRuntime.jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-info', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-row', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'error-1', "data-testid": 'transaction-transfer-amount', children: ["-", valueRounded ||
                                                             ((transaction === null || transaction === void 0 ? void 0 : transaction.value)
                                                                 ? transaction.format(transaction.value, {
                                                                     precision: 6,
                                                                 })
                                                                 : '')] }), 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) ||
-                                                (chain === null || chain === void 0 ? void 0 : chain.icon), alt: currencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }) }) }));
+                                                (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
                                             ? '<$0.01'
                                             : `$${gasFiatValue}` })) : (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: [transaction.fee.gas

package/src/lib/components/TransactionCard/SendBalanceTransactionCard.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { TokenBalance } from '@dynamic-labs/sdk-api-core';
 import { IUITransaction } from '@dynamic-labs/types';
-export declare const SendBalanceTransactionCard: ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, }: {
+export declare const SendBalanceTransactionCard: ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, t, }: {
     transaction: IUITransaction;
     currentToken: TokenBalance | undefined;
     currencySymbol: string | undefined;
@@ -12,4 +12,5 @@ export declare const SendBalanceTransactionCard: ({ transaction, currentToken, c
     totalGasFiatValue: string;
     currency: string | undefined;
     total: bigint | undefined;
+    t: any;
 }) => JSX.Element;

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

@@ -1,13 +1,10 @@
 'use client'
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useTranslation } from 'react-i18next';
-import 'react';
-import '../../context/DynamicContext/DynamicContext.js';
-import '../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
+import 'react';
 import { ReactComponent as SvgTooltip } from '../../shared/assets/tooltip.js';
 import '../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
@@ -16,6 +13,12 @@ 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 '../../context/DynamicContext/DynamicContext.js';
+import '../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '../../events/dynamicEvents.js';
 import '../../../../_virtual/_tslib.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
@@ -23,7 +26,6 @@ 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';
@@ -56,10 +58,9 @@ import '../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 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';
@@ -93,7 +94,6 @@ import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.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';
@@ -107,9 +107,8 @@ import '../../store/state/multichainBalances.js';
 import '../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 
-const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, }) => {
+const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol, valueRounded, transactionValue, isGasSponsored, gasFiatValue, totalGasFiatValue, currency, total, t, }) => {
     var _a;
-    const { t } = useTranslation();
     const { primaryWallet, projectSettings, overrides } = useInternalDynamicContext();
     const networkInfo = useNetworkConfigurationsFromProjectSettings({
         evmNetworksOverrides: overrides === null || overrides === void 0 ? void 0 : overrides.evmNetworks,
@@ -121,14 +120,13 @@ const SendBalanceTransactionCard = ({ transaction, currentToken, currencySymbol,
         networkId: chain === null || chain === void 0 ? void 0 : chain.chainId,
         networkInfo,
     });
-    const renderTransferDetails = () => (jsx("div", { className: 'transaction-card', children: jsx("div", { className: 'transaction-card__assets-container', children: jsx("div", { className: 'transaction-card__out', children: jsxs("div", { className: 'transaction-card__info-container', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: 'dyn_send_transaction.confirmation.data.transfer.send', children: t('dyn_send_transaction.confirmation.data.transfer.send') }), jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxs("div", { className: 'transaction-card__token-info', children: [jsxs("div", { className: 'transaction-card__token-row', children: [jsxs(Typography, { variant: 'body_normal', color: 'error-1', "data-testid": 'transaction-transfer-amount', children: ["-", valueRounded ||
+    const renderTransferDetails = () => (jsx("div", { className: 'transaction-card', children: jsx("div", { className: 'transaction-card__assets-container', children: jsx("div", { className: 'transaction-card__out', children: jsxs("div", { className: 'transaction-card__info-container', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', children: t('dyn_send_transaction.confirmation.data.transfer.send') }), jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxs("div", { className: 'transaction-card__token-info', children: [jsxs("div", { className: 'transaction-card__token-row', children: [jsxs(Typography, { variant: 'body_normal', color: 'error-1', "data-testid": 'transaction-transfer-amount', children: ["-", valueRounded ||
                                                             ((transaction === null || transaction === void 0 ? void 0 : transaction.value)
                                                                 ? transaction.format(transaction.value, {
                                                                     precision: 6,
                                                                 })
                                                                 : '')] }), 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) ||
-                                                (chain === null || chain === void 0 ? void 0 : chain.icon), alt: currencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }) }) }));
+                                                (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
                                             ? '<$0.01'
                                             : `$${gasFiatValue}` })) : (jsxs(Typography, { variant: 'body_normal', color: 'primary', "data-testid": 'transaction-estimated-gas-fee', children: [transaction.fee.gas

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

@@ -97,6 +97,7 @@ require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../context/OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');
+var useNetworkConfigurationsFromProjectSettings = require('../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.cjs');
 require('../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
@@ -116,8 +117,11 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATransaction, recipient, }) => {
     var _a, _b, _c, _d, _e, _f, _g;
     const { t } = reactI18next.useTranslation();
-    const { primaryWallet } = useInternalDynamicContext.useInternalDynamicContext();
-    const networkInfo = {};
+    const { primaryWallet, projectSettings, overrides } = useInternalDynamicContext.useInternalDynamicContext();
+    const networkInfo = useNetworkConfigurationsFromProjectSettings.useNetworkConfigurationsFromProjectSettings({
+        evmNetworksOverrides: overrides === null || overrides === void 0 ? void 0 : overrides.evmNetworks,
+        projectSettings,
+    });
     const { chain } = useFetchChain.useFetchChain(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector);
     const networkInfoEntry = networksAndChains.getNetworkInfoEntry({
         chain: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.connectedChain,
@@ -153,14 +157,7 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
         // for solana, the fee is included in the outgoing assets already
         return (outgoingAssetsTotal +
             (nativeCurrencySymbol === 'SOL' || isGasSponsored ? 0 : feeInUsd || 0));
-    }, [
-        simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.outAssets,
-        nativeCurrencySymbol,
-        feeInUsd,
-        blockaidOn,
-        isAATransaction,
-        isGasSponsored,
-    ]);
+    }, [simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.outAssets, nativeCurrencySymbol, feeInUsd]);
     const getTotalAmountInUsdDisplay = (totalAmountInUsd) => {
         if (!totalAmountInUsd)
             return undefined;
@@ -191,7 +188,7 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
             }
             return `$${usdPrice.toFixed(2)}`;
         };
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: `transaction-card__${transfer.direction}`, children: jsxRuntime.jsxs("div", { className: 'transaction-card__info-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', copykey: `dyn_send_transaction.confirmation.data.transfer.${transfer.direction === 'in' ? 'receive' : 'send'}`, children: t(`dyn_send_transaction.confirmation.data.transfer.${transfer.direction === 'in' ? 'receive' : 'send'}`) }), jsxRuntime.jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-info', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-row', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: [transfer.direction === 'out' ? '-' : '+', getAmountDisplay()] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (_b = (transfer.asset.symbol || transfer.asset.name)) !== null && _b !== void 0 ? _b : nativeCurrencySymbol })] }), Number(transfer.usdPrice) > 0 && (jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: getUsdPriceDisplay() }))] }), jsxRuntime.jsx("div", { className: 'transaction-card__icon', children: jsxRuntime.jsx("div", { className: 'transaction-card__icon__container', children: jsxRuntime.jsx("img", { src: transfer.asset.logoUrl ||
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: `transaction-card__${transfer.direction}`, children: jsxRuntime.jsxs("div", { className: 'transaction-card__info-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', children: transfer.direction === 'in' ? 'Receive' : 'Send' }), jsxRuntime.jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-info', children: [jsxRuntime.jsxs("div", { className: 'transaction-card__token-row', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: [transfer.direction === 'out' ? '-' : '+', getAmountDisplay()] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: (_b = (transfer.asset.symbol || transfer.asset.name)) !== null && _b !== void 0 ? _b : nativeCurrencySymbol })] }), Number(transfer.usdPrice) > 0 && (jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: getUsdPriceDisplay() }))] }), jsxRuntime.jsx("div", { className: 'transaction-card__icon', children: jsxRuntime.jsx("div", { className: 'transaction-card__icon__container', children: jsxRuntime.jsx("img", { src: transfer.asset.logoUrl ||
                                                     (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.nativeCurrency.iconUrl), alt: (_c = transfer.asset.symbol) !== null && _c !== void 0 ? _c : nativeCurrencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }), index < array.length - 1 && (jsxRuntime.jsx("div", { className: 'transaction-card__divider' }))] }));
     };
     const inAssets = ((_c = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.inAssets) === null || _c === void 0 ? void 0 : _c.flatMap((assetDiff) => {

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

@@ -93,6 +93,7 @@ import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../../context/OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';
+import { useNetworkConfigurationsFromProjectSettings } from '../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.js';
 import '../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
@@ -108,8 +109,11 @@ import { useInternalDynamicContext } from '../../context/DynamicContext/useDynam
 const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATransaction, recipient, }) => {
     var _a, _b, _c, _d, _e, _f, _g;
     const { t } = useTranslation();
-    const { primaryWallet } = useInternalDynamicContext();
-    const networkInfo = {};
+    const { primaryWallet, projectSettings, overrides } = useInternalDynamicContext();
+    const networkInfo = useNetworkConfigurationsFromProjectSettings({
+        evmNetworksOverrides: overrides === null || overrides === void 0 ? void 0 : overrides.evmNetworks,
+        projectSettings,
+    });
     const { chain } = useFetchChain(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector);
     const networkInfoEntry = getNetworkInfoEntry({
         chain: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.connectedChain,
@@ -145,14 +149,7 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
         // for solana, the fee is included in the outgoing assets already
         return (outgoingAssetsTotal +
             (nativeCurrencySymbol === 'SOL' || isGasSponsored ? 0 : feeInUsd || 0));
-    }, [
-        simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.outAssets,
-        nativeCurrencySymbol,
-        feeInUsd,
-        blockaidOn,
-        isAATransaction,
-        isGasSponsored,
-    ]);
+    }, [simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.outAssets, nativeCurrencySymbol, feeInUsd]);
     const getTotalAmountInUsdDisplay = (totalAmountInUsd) => {
         if (!totalAmountInUsd)
             return undefined;
@@ -183,7 +180,7 @@ const TransactionCard = ({ transaction, simulationResult, isGasSponsored, isAATr
             }
             return `$${usdPrice.toFixed(2)}`;
         };
-        return (jsxs(Fragment, { children: [jsx("div", { className: `transaction-card__${transfer.direction}`, children: jsxs("div", { className: 'transaction-card__info-container', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', copykey: `dyn_send_transaction.confirmation.data.transfer.${transfer.direction === 'in' ? 'receive' : 'send'}`, children: t(`dyn_send_transaction.confirmation.data.transfer.${transfer.direction === 'in' ? 'receive' : 'send'}`) }), jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxs("div", { className: 'transaction-card__token-info', children: [jsxs("div", { className: 'transaction-card__token-row', children: [jsxs(Typography, { variant: 'body_normal', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: [transfer.direction === 'out' ? '-' : '+', getAmountDisplay()] }), jsx(Typography, { variant: 'body_normal', color: 'primary', children: (_b = (transfer.asset.symbol || transfer.asset.name)) !== null && _b !== void 0 ? _b : nativeCurrencySymbol })] }), Number(transfer.usdPrice) > 0 && (jsx(Typography, { variant: 'body_small', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: getUsdPriceDisplay() }))] }), jsx("div", { className: 'transaction-card__icon', children: jsx("div", { className: 'transaction-card__icon__container', children: jsx("img", { src: transfer.asset.logoUrl ||
+        return (jsxs(Fragment, { children: [jsx("div", { className: `transaction-card__${transfer.direction}`, children: jsxs("div", { className: 'transaction-card__info-container', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', children: transfer.direction === 'in' ? 'Receive' : 'Send' }), jsxs("div", { className: 'transaction-card__amount-symbol', children: [jsxs("div", { className: 'transaction-card__token-info', children: [jsxs("div", { className: 'transaction-card__token-row', children: [jsxs(Typography, { variant: 'body_normal', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: [transfer.direction === 'out' ? '-' : '+', getAmountDisplay()] }), jsx(Typography, { variant: 'body_normal', color: 'primary', children: (_b = (transfer.asset.symbol || transfer.asset.name)) !== null && _b !== void 0 ? _b : nativeCurrencySymbol })] }), Number(transfer.usdPrice) > 0 && (jsx(Typography, { variant: 'body_small', color: transfer.direction === 'in' ? 'green-1' : 'error-1', children: getUsdPriceDisplay() }))] }), jsx("div", { className: 'transaction-card__icon', children: jsx("div", { className: 'transaction-card__icon__container', children: jsx("img", { src: transfer.asset.logoUrl ||
                                                     (networkInfoEntry === null || networkInfoEntry === void 0 ? void 0 : networkInfoEntry.nativeCurrency.iconUrl), alt: (_c = transfer.asset.symbol) !== null && _c !== void 0 ? _c : nativeCurrencySymbol, width: 32, height: 32, className: 'transaction-card__icon__container__main' }) }) })] })] }) }), index < array.length - 1 && (jsx("div", { className: 'transaction-card__divider' }))] }));
     };
     const inAssets = ((_c = simulationResult === null || simulationResult === void 0 ? void 0 : simulationResult.inAssets) === null || _c === void 0 ? void 0 : _c.flatMap((assetDiff) => {

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

@@ -142,7 +142,7 @@ const TransactionConfirmationPageLayout = ({ onClickClose, isLoading, onClickBac
     const backButton = onClickBack && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickBack, "data-testid": 'back-button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }));
     const gasFiatValue = fiatUtils.getGasFiatValue(currentToken, transaction, nativePrice);
     const totalGasFiatValue = fiatUtils.getTotalFiatCost(currentToken, transaction, nativePrice, transactionValue);
-    return hideModal ? null : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, leading: backButton, alignContent: 'bottom', children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_send_transaction.data.confirmation_tx', children: t('dyn_send_transaction.data.confirmation_tx') }) }) }), !sendBalanceTransaction && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__banner', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_send_transaction.data.banner', children: t('dyn_send_transaction.data.banner') }) })), jsxRuntime.jsx(PasskeyCreatedSuccessBanner.PasskeyCreatedSuccessBanner, {}), jsxRuntime.jsxs("div", { className: 'transaction-confirmation__body', children: [jsxRuntime.jsxs("div", { className: 'transaction-confirmation__content', children: [!sendBalanceTransaction ? (jsxRuntime.jsx(TransactionCard.TransactionCard, { transaction: transaction, isGasSponsored: isGasSponsored, isAATransaction: (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key) === 'zerodev', simulationResult: simulationResult, recipient: recipient })) : (jsxRuntime.jsx(SendBalanceTransactionCard.SendBalanceTransactionCard, { transaction: transaction, currentToken: currentToken, currencySymbol: currencySymbol, valueRounded: (_a = utils.getValueRounded(Boolean(isNativeToken), transaction)) === null || _a === void 0 ? void 0 : _a.toString(), transactionValue: transactionValue, isGasSponsored: isGasSponsored, gasFiatValue: gasFiatValue || '0', totalGasFiatValue: totalGasFiatValue || '0', currency: currency === null || currency === void 0 ? void 0 : currency.symbol, total: total })), children && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__rows', children: children }))] }), jsxRuntime.jsx(AnimatePresence.AnimatePresence, { animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, {}), children: alert && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__warning', children: alert })) }), jsxRuntime.jsxs("div", { className: 'transaction-confirmation__actions', children: [(onClickBack || onClickClose) && (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'primary', buttonPadding: 'medium', onClick: onClickBack || onClickClose, expanded: true, disabled: isLoading, copykey: 'dyn_send_transaction.confirmation.cancel_button', children: t('dyn_send_transaction.confirmation.cancel_button') })), jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'medium', onClick: handleSubmitWithChecks, expanded: true, loading: isLoading, disabled: disableSendButton, copykey: 'dyn_send_transaction.confirmation.send', dataTestId: 'transaction-confirmation-send', children: t('dyn_send_transaction.confirmation.send') })] }), jsxRuntime.jsx(NeedHelpSection.NeedHelpSection, {}), displayPoweredByDynamicFooter && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-confirmation__divider' }), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { classNameRoot: 'transaction-confirmation__footer' })] }))] })] }));
+    return hideModal ? null : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, leading: backButton, alignContent: 'bottom', children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_send_transaction.data.confirmation_tx', children: t('dyn_send_transaction.data.confirmation_tx') }) }) }), !sendBalanceTransaction && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__banner', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_send_transaction.data.banner', children: t('dyn_send_transaction.data.banner') }) })), jsxRuntime.jsx(PasskeyCreatedSuccessBanner.PasskeyCreatedSuccessBanner, {}), jsxRuntime.jsxs("div", { className: 'transaction-confirmation__body', children: [jsxRuntime.jsxs("div", { className: 'transaction-confirmation__content', children: [!sendBalanceTransaction ? (jsxRuntime.jsx(TransactionCard.TransactionCard, { transaction: transaction, isGasSponsored: isGasSponsored, isAATransaction: (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key) === 'zerodev', simulationResult: simulationResult, recipient: recipient })) : (jsxRuntime.jsx(SendBalanceTransactionCard.SendBalanceTransactionCard, { transaction: transaction, currentToken: currentToken, currencySymbol: currencySymbol, valueRounded: (_a = utils.getValueRounded(Boolean(isNativeToken), transaction)) === null || _a === void 0 ? void 0 : _a.toString(), transactionValue: transactionValue, isGasSponsored: isGasSponsored, gasFiatValue: gasFiatValue || '0', totalGasFiatValue: totalGasFiatValue || '0', currency: currency === null || currency === void 0 ? void 0 : currency.symbol, total: total, t: t })), children && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__rows', children: children }))] }), jsxRuntime.jsx(AnimatePresence.AnimatePresence, { animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, {}), children: alert && (jsxRuntime.jsx("div", { className: 'transaction-confirmation__warning', children: alert })) }), jsxRuntime.jsxs("div", { className: 'transaction-confirmation__actions', children: [(onClickBack || onClickClose) && (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'primary', buttonPadding: 'medium', onClick: onClickBack || onClickClose, expanded: true, disabled: isLoading, copykey: 'dyn_send_transaction.confirmation.cancel_button', children: t('dyn_send_transaction.confirmation.cancel_button') })), jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'medium', onClick: handleSubmitWithChecks, expanded: true, loading: isLoading, disabled: disableSendButton, copykey: 'dyn_send_transaction.confirmation.send', dataTestId: 'transaction-confirmation-send', children: t('dyn_send_transaction.confirmation.send') })] }), jsxRuntime.jsx(NeedHelpSection.NeedHelpSection, {}), displayPoweredByDynamicFooter && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'transaction-confirmation__divider' }), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { classNameRoot: 'transaction-confirmation__footer' })] }))] })] }));
 };
 
 exports.TransactionConfirmationPageLayout = TransactionConfirmationPageLayout;

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

@@ -138,7 +138,7 @@ const TransactionConfirmationPageLayout = ({ onClickClose, isLoading, onClickBac
     const backButton = onClickBack && (jsx(IconButton, { type: 'button', onClick: onClickBack, "data-testid": 'back-button', children: jsx(SvgArrowLeft, {}) }));
     const gasFiatValue = getGasFiatValue(currentToken, transaction, nativePrice);
     const totalGasFiatValue = getTotalFiatCost(currentToken, transaction, nativePrice, transactionValue);
-    return hideModal ? null : (jsxs(Fragment, { children: [jsx(ModalHeader, { trailing: closeButton, leading: backButton, alignContent: 'bottom', children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_send_transaction.data.confirmation_tx', children: t('dyn_send_transaction.data.confirmation_tx') }) }) }), !sendBalanceTransaction && (jsx("div", { className: 'transaction-confirmation__banner', children: jsx(Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_send_transaction.data.banner', children: t('dyn_send_transaction.data.banner') }) })), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'transaction-confirmation__body', children: [jsxs("div", { className: 'transaction-confirmation__content', children: [!sendBalanceTransaction ? (jsx(TransactionCard, { transaction: transaction, isGasSponsored: isGasSponsored, isAATransaction: (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key) === 'zerodev', simulationResult: simulationResult, recipient: recipient })) : (jsx(SendBalanceTransactionCard, { transaction: transaction, currentToken: currentToken, currencySymbol: currencySymbol, valueRounded: (_a = getValueRounded(Boolean(isNativeToken), transaction)) === null || _a === void 0 ? void 0 : _a.toString(), transactionValue: transactionValue, isGasSponsored: isGasSponsored, gasFiatValue: gasFiatValue || '0', totalGasFiatValue: totalGasFiatValue || '0', currency: currency === null || currency === void 0 ? void 0 : currency.symbol, total: total })), children && (jsx("div", { className: 'transaction-confirmation__rows', children: children }))] }), jsx(AnimatePresence, { animationComponent: jsx(VerticalDrawerTransition, {}), children: alert && (jsx("div", { className: 'transaction-confirmation__warning', children: alert })) }), jsxs("div", { className: 'transaction-confirmation__actions', children: [(onClickBack || onClickClose) && (jsx(TypographyButton, { buttonVariant: 'primary', buttonPadding: 'medium', onClick: onClickBack || onClickClose, expanded: true, disabled: isLoading, copykey: 'dyn_send_transaction.confirmation.cancel_button', children: t('dyn_send_transaction.confirmation.cancel_button') })), jsx(TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'medium', onClick: handleSubmitWithChecks, expanded: true, loading: isLoading, disabled: disableSendButton, copykey: 'dyn_send_transaction.confirmation.send', dataTestId: 'transaction-confirmation-send', children: t('dyn_send_transaction.confirmation.send') })] }), jsx(NeedHelpSection, {}), displayPoweredByDynamicFooter && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-confirmation__divider' }), jsx(PoweredByDynamic, { classNameRoot: 'transaction-confirmation__footer' })] }))] })] }));
+    return hideModal ? null : (jsxs(Fragment, { children: [jsx(ModalHeader, { trailing: closeButton, leading: backButton, alignContent: 'bottom', children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_send_transaction.data.confirmation_tx', children: t('dyn_send_transaction.data.confirmation_tx') }) }) }), !sendBalanceTransaction && (jsx("div", { className: 'transaction-confirmation__banner', children: jsx(Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_send_transaction.data.banner', children: t('dyn_send_transaction.data.banner') }) })), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'transaction-confirmation__body', children: [jsxs("div", { className: 'transaction-confirmation__content', children: [!sendBalanceTransaction ? (jsx(TransactionCard, { transaction: transaction, isGasSponsored: isGasSponsored, isAATransaction: (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key) === 'zerodev', simulationResult: simulationResult, recipient: recipient })) : (jsx(SendBalanceTransactionCard, { transaction: transaction, currentToken: currentToken, currencySymbol: currencySymbol, valueRounded: (_a = getValueRounded(Boolean(isNativeToken), transaction)) === null || _a === void 0 ? void 0 : _a.toString(), transactionValue: transactionValue, isGasSponsored: isGasSponsored, gasFiatValue: gasFiatValue || '0', totalGasFiatValue: totalGasFiatValue || '0', currency: currency === null || currency === void 0 ? void 0 : currency.symbol, total: total, t: t })), children && (jsx("div", { className: 'transaction-confirmation__rows', children: children }))] }), jsx(AnimatePresence, { animationComponent: jsx(VerticalDrawerTransition, {}), children: alert && (jsx("div", { className: 'transaction-confirmation__warning', children: alert })) }), jsxs("div", { className: 'transaction-confirmation__actions', children: [(onClickBack || onClickClose) && (jsx(TypographyButton, { buttonVariant: 'primary', buttonPadding: 'medium', onClick: onClickBack || onClickClose, expanded: true, disabled: isLoading, copykey: 'dyn_send_transaction.confirmation.cancel_button', children: t('dyn_send_transaction.confirmation.cancel_button') })), jsx(TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'medium', onClick: handleSubmitWithChecks, expanded: true, loading: isLoading, disabled: disableSendButton, copykey: 'dyn_send_transaction.confirmation.send', dataTestId: 'transaction-confirmation-send', children: t('dyn_send_transaction.confirmation.send') })] }), jsx(NeedHelpSection, {}), displayPoweredByDynamicFooter && (jsxs(Fragment, { children: [jsx("div", { className: 'transaction-confirmation__divider' }), jsx(PoweredByDynamic, { classNameRoot: 'transaction-confirmation__footer' })] }))] })] }));
 };
 
 export { TransactionConfirmationPageLayout };

package/src/lib/context/DynamicContext/DynamicContext.cjs

@@ -91,6 +91,8 @@ var useEndUserWarning = require('../../utils/hooks/useEndUserWarning/useEndUserW
 var useDeviceFingerprint = require('../../utils/hooks/useDeviceFingerprint/useDeviceFingerprint.cjs');
 var useAggregateWalletEvents = require('../../utils/hooks/useAggregateWalletEvents/useAggregateWalletEvents.cjs');
 var useClientSessionKeys = require('../../utils/hooks/useClientSessionKeys/useClientSessionKeys.cjs');
+var OnrampContext = require('../OnrampContext/OnrampContext.cjs');
+require('../../../index.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/InlineWidget/InlineWidget.cjs');
@@ -119,7 +121,6 @@ require('../ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../FooterAnimationContext/index.cjs');
 require('../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.cjs');
 var PasskeyContext = require('../PasskeyContext/PasskeyContext.cjs');
-var OnrampContext = require('../OnrampContext/OnrampContext.cjs');
 require('../../store/state/sendBalances.cjs');
 var useNetworkConfigurationsFromProjectSettings = require('../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.cjs');
 var SyncAuthFlow = require('../../components/SyncAuthFlow/SyncAuthFlow.cjs');
@@ -141,7 +142,6 @@ require('../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cj
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
 require('../../widgets/DynamicWidget/components/PasskeyCard/PasskeyCard.cjs');
-require('../../../index.cjs');
 require('../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 var WidgetRegistryContextProvider = require('../WidgetRegistry/WidgetRegistryContextProvider.cjs');
 var OnrampWidget = require('../../widgets/OnrampWidget/OnrampWidget.cjs');

package/src/lib/context/DynamicContext/DynamicContext.js

@@ -87,6 +87,8 @@ import { useEndUserWarning } from '../../utils/hooks/useEndUserWarning/useEndUse
 import { useDeviceFingerprint } from '../../utils/hooks/useDeviceFingerprint/useDeviceFingerprint.js';
 import { useAggregateWalletEvents } from '../../utils/hooks/useAggregateWalletEvents/useAggregateWalletEvents.js';
 import { useClientSessionKeys } from '../../utils/hooks/useClientSessionKeys/useClientSessionKeys.js';
+import { OnrampContextProvider } from '../OnrampContext/OnrampContext.js';
+import '../../../index.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/InlineWidget/InlineWidget.js';
@@ -115,7 +117,6 @@ import '../ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../FooterAnimationContext/index.js';
 import '../../views/MfaChooseDeviceView/getMfaOptions/getMfaOptions.js';
 import { PasskeyContextProvider } from '../PasskeyContext/PasskeyContext.js';
-import { OnrampContextProvider } from '../OnrampContext/OnrampContext.js';
 import '../../store/state/sendBalances.js';
 import { useNetworkConfigurationsFromProjectSettings } from '../../utils/hooks/useNetworkConfigurationsFromProjectSettings/useNetworkConfigurationsFromProjectSettings.js';
 import { SyncAuthFlow } from '../../components/SyncAuthFlow/SyncAuthFlow.js';
@@ -137,7 +138,6 @@ import '../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js'
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import '../../views/TransactionConfirmationView/TransactionConfirmationView.js';
 import '../../widgets/DynamicWidget/components/PasskeyCard/PasskeyCard.js';
-import '../../../index.js';
 import '../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import { WidgetRegistryContextProvider } from '../WidgetRegistry/WidgetRegistryContextProvider.js';
 import { OnrampWidget } from '../../widgets/OnrampWidget/OnrampWidget.js';