@dynamic-labs/sdk-react-core 4.29.6 → 4.30.1

package/CHANGELOG.md

@@ -1,4 +1,29 @@
 
+### [4.30.1](https://github.com/dynamic-labs/dynamic-auth/compare/v4.30.0...v4.30.1) (2025-09-04)
+
+
+### Features
+
+* emit walletConnectionQrCodeReady event when QR code is ready for wallet connection ([#9433](https://github.com/dynamic-labs/dynamic-auth/issues/9433)) ([c9dd9b6](https://github.com/dynamic-labs/dynamic-auth/commit/c9dd9b6e38678af16d71e1d2d3e967a989d128f2))
+
+
+### Bug Fixes
+
+* add spark to getChainIcon ([#9436](https://github.com/dynamic-labs/dynamic-auth/issues/9436)) ([86aefd7](https://github.com/dynamic-labs/dynamic-auth/commit/86aefd7aa1a973b8c3143ca5ba442f5372e8669e))
+
+## [4.30.0](https://github.com/dynamic-labs/dynamic-auth/compare/v4.29.6...v4.30.0) (2025-09-02)
+
+
+### Features
+
+* add BaseAccount wallet support ([#9373](https://github.com/dynamic-labs/dynamic-auth/issues/9373)) ([2d5e601](https://github.com/dynamic-labs/dynamic-auth/commit/2d5e601eeca34653b503302c73da6fbbee98810e))
+* add Spark chain support ([#9430](https://github.com/dynamic-labs/dynamic-auth/issues/9430)) ([c01c31e](https://github.com/dynamic-labs/dynamic-auth/commit/c01c31eed7824871028a731bb5b5ce3004b4d5c7))
+
+
+### Bug Fixes
+
+* unlink oauth with 7702 account ([#9431](https://github.com/dynamic-labs/dynamic-auth/issues/9431)) ([0aae4a4](https://github.com/dynamic-labs/dynamic-auth/commit/0aae4a4e27e56083ff1a9e068048461d5d436569))
+
 ### [4.29.6](https://github.com/dynamic-labs/dynamic-auth/compare/v4.29.5...v4.29.6) (2025-09-01)
 
 

package/package.cjs

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "4.29.6";
+var version = "4.30.1";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.762",
 	"@dynamic-labs-sdk/client": "0.0.1-alpha.25",

package/package.js

@@ -1,5 +1,5 @@
 'use client'
-var version = "4.29.6";
+var version = "4.30.1";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.762",
 	"@dynamic-labs-sdk/client": "0.0.1-alpha.25",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "4.29.6",
+  "version": "4.30.1",
   "dependencies": {
     "@dynamic-labs/sdk-api-core": "0.0.762",
     "@dynamic-labs-sdk/client": "0.0.1-alpha.25",
@@ -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.6",
-    "@dynamic-labs/iconic": "4.29.6",
-    "@dynamic-labs/logger": "4.29.6",
-    "@dynamic-labs/multi-wallet": "4.29.6",
-    "@dynamic-labs/rpc-providers": "4.29.6",
-    "@dynamic-labs/store": "4.29.6",
-    "@dynamic-labs/types": "4.29.6",
-    "@dynamic-labs/utils": "4.29.6",
-    "@dynamic-labs/wallet-book": "4.29.6",
-    "@dynamic-labs/wallet-connector-core": "4.29.6",
+    "@dynamic-labs/assert-package-version": "4.30.1",
+    "@dynamic-labs/iconic": "4.30.1",
+    "@dynamic-labs/logger": "4.30.1",
+    "@dynamic-labs/multi-wallet": "4.30.1",
+    "@dynamic-labs/rpc-providers": "4.30.1",
+    "@dynamic-labs/store": "4.30.1",
+    "@dynamic-labs/types": "4.30.1",
+    "@dynamic-labs/utils": "4.30.1",
+    "@dynamic-labs/wallet-book": "4.30.1",
+    "@dynamic-labs/wallet-connector-core": "4.30.1",
     "eventemitter3": "5.0.1"
   },
   "devDependencies": {

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/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');
@@ -98,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 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';
@@ -94,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 { 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');
@@ -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';
@@ -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/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');
@@ -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' }))] })] }));

package/src/lib/components/TransactionStatusLayout/TransactionStatusLayout.js

@@ -13,7 +13,6 @@ import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
 import '@dynamic-labs/wallet-connector-core';
 import '@dynamic-labs/wallet-book';
-import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '../../utils/constants/colors.js';
 import '../../utils/constants/values.js';
 import '../../shared/consts/index.js';
@@ -74,6 +73,7 @@ import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
 import { Icon } from '../Icon/Icon.js';
+import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import { IconButton } from '../IconButton/IconButton.js';
 import '../MenuList/Dropdown/Dropdown.js';
@@ -126,7 +126,7 @@ const TransactionStatusLayout = ({ destinationAddress, transactionValue, network
     }));
     const closeButton = onClickClose && (jsx(IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close', children: jsx(SvgClose, {}) }));
     const totalFiatCost = getTotalFiatCost(currentToken, transaction, nativePrice, transactionValue);
-    return (jsxs("div", { className: 'transaction-status-layout', children: [jsx(ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsx(Icon, { size: 'large', className: 'transaction-status-layout__status-icon', children: jsx(SvgCheckBlue, {}) }) }), jsxs("div", { className: 'transaction-status-layout__body', children: [jsxs("div", { className: 'transaction-status-layout__sent_to', children: [jsxs(Typography, { variant: 'body_small', color: 'secondary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [t('dyn_send_transaction.succeeded.title'), ' '] }), jsx(Typography, { variant: 'body_small', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: shortenWalletAddress(destinationAddress, 3, 3) })] }), jsx("div", { className: 'transaction-status-layout__content', children: jsx("div", { className: 'transaction-status-layout__rows', children: jsxs(Typography, { variant: 'title', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [`${getValueRounded(isNativeToken, transaction)} ${networkCurrency} `, showFiat &&
+    return (jsxs("div", { className: 'transaction-status-layout', children: [jsx(ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsx(Icon, { size: 'large', className: 'transaction-status-layout__status-icon', children: jsx(SvgCheckBlue, {}) }) }), jsxs("div", { className: 'transaction-status-layout__body', children: [jsxs("div", { className: 'transaction-status-layout__sent_to', children: [jsxs(Typography, { variant: 'body_small', color: 'secondary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [t('dyn_send_transaction.succeeded.title'), ' '] }), jsx(Typography, { variant: 'body_small', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: shortenWalletAddress(destinationAddress) })] }), jsx("div", { className: 'transaction-status-layout__content', children: jsx("div", { className: 'transaction-status-layout__rows', children: jsxs(Typography, { variant: 'title', color: 'primary', className: 'transaction-status-layout__title', copykey: 'dyn_send_transaction.succeeded.title', children: [`${getValueRounded(isNativeToken, transaction)} ${networkCurrency} `, showFiat &&
                                         (currentToken === null || currentToken === void 0 ? void 0 : currentToken.price) &&
                                         totalFiatCost !== undefined &&
                                         `($${Number(totalFiatCost) <= 0.01 ? '<0.01' : totalFiatCost})`] }) }) }), jsx(AnimatePresence, { animationComponent: jsx(VerticalDrawerTransition, {}), children: jsx("div", { className: 'transaction-confirmation__warning', children: jsx(Alert, { variant: 'info', copykey: 'dyn_send_transaction.info_message.refresh_balance_time', children: t('dyn_send_transaction.info_message.refresh_balance_time') }) }) }), jsx("div", { className: 'transaction-status-layout__transaction-link-container', children: txLink && (jsx(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') })) }), jsx("div", { className: 'transaction-status-layout__actions', children: jsx(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 && (jsx(PoweredByDynamic, { classNameRoot: 'transaction-status-layout__footer' }))] })] }));

package/src/lib/components/UserAddress/UserAddress.cjs

@@ -4,25 +4,24 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var useFetchNameService = require('../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.cjs');
+var StatusDot = require('../StatusDot/StatusDot.cjs');
+var Typography = require('../Typography/Typography.cjs');
+require('react');
+require('../../events/dynamicEvents.cjs');
+require('../../../../_virtual/_tslib.cjs');
+require('@dynamic-labs/utils');
+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');
 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 useFetchNameService = require('../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.cjs');
-var StatusDot = require('../StatusDot/StatusDot.cjs');
-var Typography = require('../Typography/Typography.cjs');
-require('../../events/dynamicEvents.cjs');
-require('../../../../_virtual/_tslib.cjs');
-require('../../context/DynamicContext/DynamicContext.cjs');
-require('../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 require('../../store/state/authMode/authMode.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
@@ -79,6 +78,7 @@ require('../Popper/Popper/Popper.cjs');
 require('../Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
 require('qrcode');
+var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('formik');
 require('../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
@@ -112,7 +112,7 @@ const UserAddress = ({ userProfile, walletConnector }) => {
     const { data: walletConnectorAddress } = usePromise.usePromise(() => walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getAddress(), {
         enabled: !userProfile && Boolean(walletConnector),
     });
-    return (jsxRuntime.jsxs("div", { className: 'user-address__container', children: [jsxRuntime.jsx(StatusDot.StatusDot, { variant: 'green', containerClassName: 'user-address__status-dot' }), (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: nameService.name }), jsxRuntime.jsx("div", { className: 'dynamic-widget-wallet-header__seperator' }), jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_medium', color: 'secondary', className: 'user-address', children: shortenWalletAddress.shortenWalletAddress(lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address, 3, 3) })] })) : (jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: shortenWalletAddress.shortenWalletAddress((lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) || walletConnectorAddress, 4, 4) }))] }));
+    return (jsxRuntime.jsxs("div", { className: 'user-address__container', children: [jsxRuntime.jsx(StatusDot.StatusDot, { variant: 'green', containerClassName: 'user-address__status-dot' }), (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: nameService.name }), jsxRuntime.jsx("div", { className: 'dynamic-widget-wallet-header__seperator' }), jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_medium', color: 'secondary', className: 'user-address', children: shortenWalletAddress.shortenWalletAddress(lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) })] })) : (jsxRuntime.jsx(Typography.Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: shortenWalletAddress.shortenWalletAddress((lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) || walletConnectorAddress) }))] }));
 };
 
 exports.UserAddress = UserAddress;

package/src/lib/components/UserAddress/UserAddress.js

@@ -1,24 +1,23 @@
 'use client'
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useFetchNameService } from '../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.js';
+import { StatusDot } from '../StatusDot/StatusDot.js';
+import { Typography } from '../Typography/Typography.js';
+import 'react';
+import '../../events/dynamicEvents.js';
+import '../../../../_virtual/_tslib.js';
+import '@dynamic-labs/utils';
+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 '../../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 { useFetchNameService } from '../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.js';
-import { StatusDot } from '../StatusDot/StatusDot.js';
-import { Typography } from '../Typography/Typography.js';
-import '../../events/dynamicEvents.js';
-import '../../../../_virtual/_tslib.js';
-import '../../context/DynamicContext/DynamicContext.js';
-import '../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '../../store/state/authMode/authMode.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../context/ErrorContext/ErrorContext.js';
@@ -75,6 +74,7 @@ import '../Popper/Popper/Popper.js';
 import '../Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
 import 'qrcode';
+import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import 'formik';
 import '../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
@@ -108,7 +108,7 @@ const UserAddress = ({ userProfile, walletConnector }) => {
     const { data: walletConnectorAddress } = usePromise(() => walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getAddress(), {
         enabled: !userProfile && Boolean(walletConnector),
     });
-    return (jsxs("div", { className: 'user-address__container', children: [jsx(StatusDot, { variant: 'green', containerClassName: 'user-address__status-dot' }), (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? (jsxs(Fragment, { children: [jsx(Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: nameService.name }), jsx("div", { className: 'dynamic-widget-wallet-header__seperator' }), jsx(Typography, { variant: 'numbers_medium', color: 'secondary', className: 'user-address', children: shortenWalletAddress(lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address, 3, 3) })] })) : (jsx(Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: shortenWalletAddress((lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) || walletConnectorAddress, 4, 4) }))] }));
+    return (jsxs("div", { className: 'user-address__container', children: [jsx(StatusDot, { variant: 'green', containerClassName: 'user-address__status-dot' }), (nameService === null || nameService === void 0 ? void 0 : nameService.name) ? (jsxs(Fragment, { children: [jsx(Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: nameService.name }), jsx("div", { className: 'dynamic-widget-wallet-header__seperator' }), jsx(Typography, { variant: 'numbers_medium', color: 'secondary', className: 'user-address', children: shortenWalletAddress(lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) })] })) : (jsx(Typography, { variant: 'numbers_big', color: 'primary', className: 'user-address', children: shortenWalletAddress((lastVerifiedCredential === null || lastVerifiedCredential === void 0 ? void 0 : lastVerifiedCredential.address) || walletConnectorAddress) }))] }));
 };
 
 export { UserAddress };

package/src/lib/components/WalletInformationCard/WalletInformationCard.cjs

@@ -7,18 +7,8 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactI18next = require('react-i18next');
 var Typography = require('../Typography/Typography.cjs');
-require('@dynamic-labs/sdk-api-core');
-require('../../shared/logger.cjs');
-require('@dynamic-labs/iconic');
-require('@dynamic-labs/wallet-connector-core');
-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 Icon = require('../Icon/Icon.cjs');
+var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 
 const WalletInformationCard = ({ address, ens, balance, icon, network, menu, }) => {
     const { t } = reactI18next.useTranslation();

package/src/lib/components/WalletInformationCard/WalletInformationCard.js

@@ -3,18 +3,8 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Typography } from '../Typography/Typography.js';
-import '@dynamic-labs/sdk-api-core';
-import '../../shared/logger.js';
-import '@dynamic-labs/iconic';
-import '@dynamic-labs/wallet-connector-core';
-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 { Icon } from '../Icon/Icon.js';
+import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 
 const WalletInformationCard = ({ address, ens, balance, icon, network, menu, }) => {
     const { t } = useTranslation();