@dynamic-labs/sdk-react-core 4.0.0-alpha.29 → 4.0.0-alpha.30

package/src/lib/utils/functions/getPlatformForConnector/getPlatformForConnector.d.ts

@@ -1,3 +1,3 @@
-import { WalletSchema } from '@dynamic-labs/wallet-book';
+import { WalletLimitations } from '@dynamic-labs/wallet-connector-core';
 import { WalletConnector } from '../../../..';
-export declare const getPlatformForConnector: (connector: WalletConnector) => keyof NonNullable<WalletSchema['walletLimitations']>;
+export declare const getPlatformForConnector: (connector: WalletConnector) => keyof NonNullable<WalletLimitations>;

package/src/lib/utils/functions/getUserProfileFields/getUserProfileFields.cjs

@@ -59,7 +59,7 @@ const getNonEditableUserProfileFields = ({ projectSettingsKyc = [], user, }) =>
  * @returns {ProjectSettingsKyc[]} - The list of all user profile fields based on project settings.
  */
 const getUserProfileFields = ({ projectSettingsKyc = [], customFields = [], user, }) => {
-    var _a;
+    var _a, _b;
     const editableUserProfileFields = getEditableUserProfileFields([
         ...projectSettingsKyc,
         ...customFields,
@@ -72,10 +72,12 @@ const getUserProfileFields = ({ projectSettingsKyc = [], customFields = [], user
         ...editableUserProfileFields,
         ...nonEditableUserProfileFields,
     ];
-    const hasEmbeddedWallet = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletProvider }) => walletProvider === sdkApiCore.WalletProviderEnum.EmbeddedWallet);
+    const userEmbeddedWallet = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletProvider }) => walletProvider === sdkApiCore.WalletProviderEnum.EmbeddedWallet);
+    const hasV1EmbeddedWallet = ((_b = userEmbeddedWallet === null || userEmbeddedWallet === void 0 ? void 0 : userEmbeddedWallet.walletProperties) === null || _b === void 0 ? void 0 : _b.version) ===
+        sdkApiCore.EmbeddedWalletVersionEnum.V1;
     const userHasEmail = Boolean(user === null || user === void 0 ? void 0 : user.email);
     const userHasPhoneNumber = Boolean(user === null || user === void 0 ? void 0 : user.phoneNumber);
-    if (hasEmbeddedWallet) {
+    if (hasV1EmbeddedWallet) {
         concatedList = concatedList.map((field) => {
             if ((field.name === 'email' && userHasEmail) ||
                 (field.name === 'phoneNumber' && userHasPhoneNumber)) {

package/src/lib/utils/functions/getUserProfileFields/getUserProfileFields.js

@@ -1,5 +1,5 @@
 'use client'
-import { WalletProviderEnum, KycFieldType } from '@dynamic-labs/sdk-api-core';
+import { WalletProviderEnum, EmbeddedWalletVersionEnum, KycFieldType } from '@dynamic-labs/sdk-api-core';
 import { getEnabledKYC } from '../getEnabledKYC/index.js';
 
 /**
@@ -55,7 +55,7 @@ const getNonEditableUserProfileFields = ({ projectSettingsKyc = [], user, }) =>
  * @returns {ProjectSettingsKyc[]} - The list of all user profile fields based on project settings.
  */
 const getUserProfileFields = ({ projectSettingsKyc = [], customFields = [], user, }) => {
-    var _a;
+    var _a, _b;
     const editableUserProfileFields = getEditableUserProfileFields([
         ...projectSettingsKyc,
         ...customFields,
@@ -68,10 +68,12 @@ const getUserProfileFields = ({ projectSettingsKyc = [], customFields = [], user
         ...editableUserProfileFields,
         ...nonEditableUserProfileFields,
     ];
-    const hasEmbeddedWallet = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletProvider }) => walletProvider === WalletProviderEnum.EmbeddedWallet);
+    const userEmbeddedWallet = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletProvider }) => walletProvider === WalletProviderEnum.EmbeddedWallet);
+    const hasV1EmbeddedWallet = ((_b = userEmbeddedWallet === null || userEmbeddedWallet === void 0 ? void 0 : userEmbeddedWallet.walletProperties) === null || _b === void 0 ? void 0 : _b.version) ===
+        EmbeddedWalletVersionEnum.V1;
     const userHasEmail = Boolean(user === null || user === void 0 ? void 0 : user.email);
     const userHasPhoneNumber = Boolean(user === null || user === void 0 ? void 0 : user.phoneNumber);
-    if (hasEmbeddedWallet) {
+    if (hasV1EmbeddedWallet) {
         concatedList = concatedList.map((field) => {
             if ((field.name === 'email' && userHasEmail) ||
                 (field.name === 'phoneNumber' && userHasPhoneNumber)) {

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.cjs

@@ -7,7 +7,7 @@ var filterConnectedWallets = require('../filterConnectedWallets/filterConnectedW
 var staticLinkedWalletFilter = require('../staticLinkedWalletFilter/staticLinkedWalletFilter.cjs');
 var filterWalletConnectWallets = require('../filterWalletConnectWallets/filterWalletConnectWallets.cjs');
 
-const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, walletBook, }) => {
+const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, }) => {
     const walletList = filterWalletConnectWallets.filterWalletConnectWallets({
         userWallets,
         walletOptions,
@@ -18,7 +18,7 @@ const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, walletB
             walletOptions: walletList,
         });
     }
-    return staticLinkedWalletFilter.staticWalletFilter(userWallets, walletList, walletBook);
+    return staticLinkedWalletFilter.staticWalletFilter(userWallets, walletList);
 };
 
 exports.applyMultiWalletFilters = applyMultiWalletFilters;

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.d.ts

@@ -1,8 +1,6 @@
-import { WalletBookSchema } from '@dynamic-labs/wallet-book';
 import { AuthModeType, Wallet, WalletOption } from '../../../../../shared';
-export declare const applyMultiWalletFilters: ({ authMode, userWallets, walletOptions, walletBook, }: {
+export declare const applyMultiWalletFilters: ({ authMode, userWallets, walletOptions, }: {
     authMode: AuthModeType;
     userWallets: Wallet[];
     walletOptions: WalletOption[];
-    walletBook: WalletBookSchema;
 }) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.js

@@ -3,7 +3,7 @@ import { filterConnectedWallets } from '../filterConnectedWallets/filterConnecte
 import { staticWalletFilter } from '../staticLinkedWalletFilter/staticLinkedWalletFilter.js';
 import { filterWalletConnectWallets } from '../filterWalletConnectWallets/filterWalletConnectWallets.js';
 
-const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, walletBook, }) => {
+const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, }) => {
     const walletList = filterWalletConnectWallets({
         userWallets,
         walletOptions,
@@ -14,7 +14,7 @@ const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, walletB
             walletOptions: walletList,
         });
     }
-    return staticWalletFilter(userWallets, walletList, walletBook);
+    return staticWalletFilter(userWallets, walletList);
 };
 
 export { applyMultiWalletFilters };

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.cjs

@@ -3,15 +3,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var walletBook = require('@dynamic-labs/wallet-book');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var getPlatformForConnector = require('../../../getPlatformForConnector/getPlatformForConnector.cjs');
 
 /**
  * This function is a helper to filter out wallets that should not appear in the wallet list
  * if they are already linked to the user profile.
  */
-const staticWalletFilter = (linkedWallets, walletOptions, walletBook$1) => walletOptions.filter((walletOption) => {
-    if (walletBook.isWalletEventSupported(walletBook.findWalletBookWallet(walletBook$1, walletOption.key), 'accountChanged', getPlatformForConnector.getPlatformForConnector(walletOption.walletConnector))) {
+const staticWalletFilter = (linkedWallets, walletOptions) => walletOptions.filter((walletOption) => {
+    if (walletOption.walletConnector &&
+        walletConnectorCore.isConnectorEventSupported(walletOption.walletConnector, 'accountChanged', getPlatformForConnector.getPlatformForConnector(walletOption.walletConnector))) {
         return true;
     }
     if (linkedWallets.some((wallet) => wallet.connector.key === walletOption.key)) {

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.d.ts

@@ -1,7 +1,6 @@
-import { WalletBookSchema } from '@dynamic-labs/wallet-book';
 import { Wallet, WalletOption } from '../../../../../shared';
 /**
  * This function is a helper to filter out wallets that should not appear in the wallet list
  * if they are already linked to the user profile.
  */
-export declare const staticWalletFilter: (linkedWallets: Wallet[], walletOptions: WalletOption[], walletBook: WalletBookSchema) => WalletOption[];
+export declare const staticWalletFilter: (linkedWallets: Wallet[], walletOptions: WalletOption[]) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.js

@@ -1,13 +1,14 @@
 'use client'
-import { isWalletEventSupported, findWalletBookWallet } from '@dynamic-labs/wallet-book';
+import { isConnectorEventSupported } from '@dynamic-labs/wallet-connector-core';
 import { getPlatformForConnector } from '../../../getPlatformForConnector/getPlatformForConnector.js';
 
 /**
  * This function is a helper to filter out wallets that should not appear in the wallet list
  * if they are already linked to the user profile.
  */
-const staticWalletFilter = (linkedWallets, walletOptions, walletBook) => walletOptions.filter((walletOption) => {
-    if (isWalletEventSupported(findWalletBookWallet(walletBook, walletOption.key), 'accountChanged', getPlatformForConnector(walletOption.walletConnector))) {
+const staticWalletFilter = (linkedWallets, walletOptions) => walletOptions.filter((walletOption) => {
+    if (walletOption.walletConnector &&
+        isConnectorEventSupported(walletOption.walletConnector, 'accountChanged', getPlatformForConnector(walletOption.walletConnector))) {
         return true;
     }
     if (linkedWallets.some((wallet) => wallet.connector.key === walletOption.key)) {

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.cjs

@@ -65,7 +65,6 @@ const walletListBuilder = ({ authMode, userWallets, multiWallet, numberOfWallets
         walletList = applyMultiWalletFilters.applyMultiWalletFilters({
             authMode,
             userWallets,
-            walletBook,
             walletOptions: walletList,
         });
     }

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.js

@@ -61,7 +61,6 @@ const walletListBuilder = ({ authMode, userWallets, multiWallet, numberOfWallets
         walletList = applyMultiWalletFilters({
             authMode,
             userWallets,
-            walletBook,
             walletOptions: walletList,
         });
     }

package/src/lib/utils/hooks/useWalletUiUtils/useWalletUiUtils.cjs

@@ -158,7 +158,12 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         if (!shouldConfirmAction())
             return transaction.submit();
         return openSendTransaction((resolve, reject) => (jsxRuntime.jsx(TransactionConfirmationModal.TransactionConfirmationModal, { copykey: 'dyn_send_transaction.confirmation.title', title: t('dyn_send_transaction.confirmation.title'), transaction: transaction, onTransactionResponseSuccess: resolve, onReject: reject, walletConnector: walletConnector, hideModal: hideEmbeddedWalletTransactionUIs &&
-                !(walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.isGlobalTransaction) }))).then((signedTransaction) => _tslib.__awaiter(void 0, void 0, void 0, function* () { return signedTransaction; }));
+                !(walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.isGlobalTransaction) }))).then((signedTransaction) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+            if (signedTransaction === 'callHandlerOutsideModal')
+                return transaction.submit();
+            else
+                return signedTransaction;
+        }));
     }), [
         hideEmbeddedWalletTransactionUIs,
         openSendTransaction,

package/src/lib/utils/hooks/useWalletUiUtils/useWalletUiUtils.js

@@ -154,7 +154,12 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         if (!shouldConfirmAction())
             return transaction.submit();
         return openSendTransaction((resolve, reject) => (jsx(TransactionConfirmationModal, { copykey: 'dyn_send_transaction.confirmation.title', title: t('dyn_send_transaction.confirmation.title'), transaction: transaction, onTransactionResponseSuccess: resolve, onReject: reject, walletConnector: walletConnector, hideModal: hideEmbeddedWalletTransactionUIs &&
-                !(walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.isGlobalTransaction) }))).then((signedTransaction) => __awaiter(void 0, void 0, void 0, function* () { return signedTransaction; }));
+                !(walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.isGlobalTransaction) }))).then((signedTransaction) => __awaiter(void 0, void 0, void 0, function* () {
+            if (signedTransaction === 'callHandlerOutsideModal')
+                return transaction.submit();
+            else
+                return signedTransaction;
+        }));
     }), [
         hideEmbeddedWalletTransactionUIs,
         openSendTransaction,

package/src/lib/views/MergeUserAccountsWithSameEmailView/MergeUserAccountsWithSameEmailView.cjs

@@ -130,7 +130,7 @@ const MergeUserAccountsWithSameEmailView = ({ returnToView }) => {
         }
         setView('collect-user-data');
     };
-    return (jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__container', children: [jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts', children: [jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.key, className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenWalletAddress.shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })] }), jsxRuntime.jsx("div", { className: 'merge-user-accounts-with-same-email__accounts__divider', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-secondary', size: 'small', children: jsxRuntime.jsx(doubleArrowRight.ReactComponent, {}) }) }), jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsxRuntime.jsx(iconic.UserProfileIcon, { className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenEmail.shortenEmail(email, {
+    return (jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__container', children: [jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts', children: [jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsxRuntime.jsx(walletBook.WalletIcon, { icon: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.metadata.icon, walletKey: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.key, className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenWalletAddress.shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })] }), jsxRuntime.jsx("div", { className: 'merge-user-accounts-with-same-email__accounts__divider', children: jsxRuntime.jsx(Icon.Icon, { color: 'text-secondary', size: 'small', children: jsxRuntime.jsx(doubleArrowRight.ReactComponent, {}) }) }), jsxRuntime.jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsxRuntime.jsx(iconic.UserProfileIcon, { className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenEmail.shortenEmail(email, {
                                     breakpoint: 4,
                                     cutEnd: 1,
                                     cutStart: 2,

package/src/lib/views/MergeUserAccountsWithSameEmailView/MergeUserAccountsWithSameEmailView.js

@@ -126,7 +126,7 @@ const MergeUserAccountsWithSameEmailView = ({ returnToView }) => {
         }
         setView('collect-user-data');
     };
-    return (jsxs("div", { className: 'merge-user-accounts-with-same-email__container', children: [jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts', children: [jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsx(WalletIcon, { walletKey: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.key, className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })] }), jsx("div", { className: 'merge-user-accounts-with-same-email__accounts__divider', children: jsx(Icon, { color: 'text-secondary', size: 'small', children: jsx(SvgDoubleArrowRight, {}) }) }), jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsx(UserProfileIcon, { className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenEmail(email, {
+    return (jsxs("div", { className: 'merge-user-accounts-with-same-email__container', children: [jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts', children: [jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsx(WalletIcon, { icon: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.metadata.icon, walletKey: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.key, className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })] }), jsx("div", { className: 'merge-user-accounts-with-same-email__accounts__divider', children: jsx(Icon, { color: 'text-secondary', size: 'small', children: jsx(SvgDoubleArrowRight, {}) }) }), jsxs("div", { className: 'merge-user-accounts-with-same-email__accounts__item', children: [jsx(UserProfileIcon, { className: 'merge-user-accounts-with-same-email__accounts__item__icon' }), jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'secondary', className: 'merge-user-accounts-with-same-email__accounts__item__text', children: shortenEmail(email, {
                                     breakpoint: 4,
                                     cutEnd: 1,
                                     cutStart: 2,

package/src/lib/views/MobileWalletRedirectView/MobileWalletRedirectView.cjs

@@ -113,7 +113,7 @@ const MobileWalletRedirectView = ({ onRetry, }) => {
         };
     }, [selectedWalletConnector, walletBook$1]);
     const openWalletApp = () => walletLink && window.open(walletLink, '_blank', 'noopener,noreferrer');
-    const makeIcon = (size) => (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key, style: {
+    const makeIcon = (size) => (jsxRuntime.jsx(walletBook.WalletIcon, { icon: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.metadata.icon, walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key, style: {
             height: pixelToRem.pixelToRem(size),
             width: pixelToRem.pixelToRem(size),
         } }));

package/src/lib/views/MobileWalletRedirectView/MobileWalletRedirectView.js

@@ -109,7 +109,7 @@ const MobileWalletRedirectView = ({ onRetry, }) => {
         };
     }, [selectedWalletConnector, walletBook]);
     const openWalletApp = () => walletLink && window.open(walletLink, '_blank', 'noopener,noreferrer');
-    const makeIcon = (size) => (jsx(WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key, style: {
+    const makeIcon = (size) => (jsx(WalletIcon, { icon: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.metadata.icon, walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key, style: {
             height: pixelToRem(size),
             width: pixelToRem(size),
         } }));

package/src/lib/views/NetworkNotSupported/NetworkNotSupported.cjs

@@ -117,7 +117,7 @@ const NetworkNotSupported = () => {
     });
     return (jsxRuntime.jsxs("div", { className: 'network-not-supported', "data-testid": 'network-not-supported', children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'network-not-supported__main-img', src: onboardingImageUrl, alt: 'onboarding' })), !_isSupportedNetwork && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { variant: 'info', withIcon: false, className: 'network-not-supported__error--not-supported', copykey: 'dyn_network_not_supported.warning_message', children: t('dyn_network_not_supported.warning_message') })), jsxRuntime.jsxs("div", { className: classNames.classNames('network-not-supported__content-container', {
                     'network-not-supported__content-container--error': !_isSupportedNetwork,
-                }), children: [jsxRuntime.jsx("div", { className: 'network-not-supported__img-container', children: jsxRuntime.jsx(walletBook.WalletIcon, { style: { height: 64, width: 64 }, walletKey: walletConnector.key }) }), jsxRuntime.jsx(UserAddress.UserAddress, { walletConnector: walletConnector }), jsxRuntime.jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsxRuntime.jsx(NetworkPicker.NetworkPicker, { currentNetwork: currentNetwork, evmNetworks: evmNetworks, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsxRuntime.jsx("div", { className: 'network-not-supported__welcome-container', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', copykey: 'dyn_network_not_supported.subtitle', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsxRuntime.jsx(SelectNetworkButton.SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
+                }), children: [jsxRuntime.jsx("div", { className: 'network-not-supported__img-container', children: jsxRuntime.jsx(walletBook.WalletIcon, { style: { height: 64, width: 64 }, icon: walletConnector.metadata.icon, walletKey: walletConnector.key }) }), jsxRuntime.jsx(UserAddress.UserAddress, { walletConnector: walletConnector }), jsxRuntime.jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsxRuntime.jsx(NetworkPicker.NetworkPicker, { currentNetwork: currentNetwork, evmNetworks: evmNetworks, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsxRuntime.jsx("div", { className: 'network-not-supported__welcome-container', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', copykey: 'dyn_network_not_supported.subtitle', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsxRuntime.jsx(SelectNetworkButton.SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
 };
 
 exports.NetworkNotSupported = NetworkNotSupported;

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

@@ -113,7 +113,7 @@ const NetworkNotSupported = () => {
     });
     return (jsxs("div", { className: 'network-not-supported', "data-testid": 'network-not-supported', children: [onboardingImageUrl && (jsx("img", { className: 'network-not-supported__main-img', src: onboardingImageUrl, alt: 'onboarding' })), !_isSupportedNetwork && (jsx(ErrorContainer, { variant: 'info', withIcon: false, className: 'network-not-supported__error--not-supported', copykey: 'dyn_network_not_supported.warning_message', children: t('dyn_network_not_supported.warning_message') })), jsxs("div", { className: classNames('network-not-supported__content-container', {
                     'network-not-supported__content-container--error': !_isSupportedNetwork,
-                }), children: [jsx("div", { className: 'network-not-supported__img-container', children: jsx(WalletIcon, { style: { height: 64, width: 64 }, walletKey: walletConnector.key }) }), jsx(UserAddress, { walletConnector: walletConnector }), jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsx(NetworkPicker, { currentNetwork: currentNetwork, evmNetworks: evmNetworks, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsx("div", { className: 'network-not-supported__welcome-container', children: jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', copykey: 'dyn_network_not_supported.subtitle', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsx(SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
+                }), children: [jsx("div", { className: 'network-not-supported__img-container', children: jsx(WalletIcon, { style: { height: 64, width: 64 }, icon: walletConnector.metadata.icon, walletKey: walletConnector.key }) }), jsx(UserAddress, { walletConnector: walletConnector }), jsx("div", { className: 'network-not-supported__network-container', children: evmNetworks.length > 1 && (jsx(NetworkPicker, { currentNetwork: currentNetwork, evmNetworks: evmNetworks, connector: walletConnector, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, showNetworkName: true, buttonClassName: 'network-not-supported__network-picker-button', mainClassName: 'network-not-supported__network-picker' })) }), jsx("div", { className: 'network-not-supported__welcome-container', children: jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', copykey: 'dyn_network_not_supported.subtitle', children: t('dyn_network_not_supported.subtitle') }) }), evmNetworks.length === 1 && (jsx(SelectNetworkButton, { onClick: onSelectNetworkButtonClick, networkId: evmNetworks[0].networkId, networkName: evmNetworks[0].vanityName || evmNetworks[0].name, networkIconUrl: evmNetworks[0].iconUrls[0] }))] })] }));
 };
 
 export { NetworkNotSupported };

package/src/lib/views/NetworkNotSupportedSwitchManual/NetworkNotSupportedSwitchManual.cjs

@@ -97,7 +97,7 @@ const NetworkNotSupportedSwitchManual = () => {
     useNetworkNotSupported.useNetworkNotSupported();
     const { t } = reactI18next.useTranslation();
     const iconSize = 80;
-    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
+    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { icon: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon, walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
             height: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
             width: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
         } }));

package/src/lib/views/NetworkNotSupportedSwitchManual/NetworkNotSupportedSwitchManual.js

@@ -93,7 +93,7 @@ const NetworkNotSupportedSwitchManual = () => {
     useNetworkNotSupported();
     const { t } = useTranslation();
     const iconSize = 80;
-    const icon = (jsx(WalletIcon, { walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
+    const icon = (jsx(WalletIcon, { icon: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon, walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
             height: pixelToRem(iconSize * iconRatio),
             width: pixelToRem(iconSize * iconRatio),
         } }));

package/src/lib/views/NoQrNotInstalledView/NoQrNotInstalledView.cjs

@@ -101,7 +101,7 @@ const NoQrNotInstalledView = () => {
         .map(([name, link]) => (jsxRuntime.jsx(WalletHelpLink.WalletHelpLink, { name: name, link: link, 
         // justification: we're looping over the keys of walletLinks.desktop
         Icon: getBrowserIcon.getBrowserIcon(name) }, name)));
-    return (jsxRuntime.jsxs("div", { className: 'no-qr-code-installed__container', "data-testid": 'no-qr-code-installed', children: [jsxRuntime.jsx("div", { className: 'no-qr-code-installed__img', children: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletConnector.key, style: { height: pixelToRem.pixelToRem(64), width: pixelToRem.pixelToRem(64) } }) }), jsxRuntime.jsx(Typography.Typography, { className: 'no-qr-code-installed__typography--title', variant: 'title', copykey: 'dyn_qr_code.wallet_not_installed.install', children: t('dyn_qr_code.wallet_not_installed.install', {
+    return (jsxRuntime.jsxs("div", { className: 'no-qr-code-installed__container', "data-testid": 'no-qr-code-installed', children: [jsxRuntime.jsx("div", { className: 'no-qr-code-installed__img', children: jsxRuntime.jsx(walletBook.WalletIcon, { icon: selectedWalletConnector.metadata.icon, walletKey: selectedWalletConnector.key, style: { height: pixelToRem.pixelToRem(64), width: pixelToRem.pixelToRem(64) } }) }), jsxRuntime.jsx(Typography.Typography, { className: 'no-qr-code-installed__typography--title', variant: 'title', copykey: 'dyn_qr_code.wallet_not_installed.install', children: t('dyn_qr_code.wallet_not_installed.install', {
                     wallet: walletBook.getWalletBookWallet(walletBook$1, selectedWalletConnector.key)
                         .name,
                 }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', className: 'no-qr-code-installed__typography', color: 'secondary', copykey: 'dyn_qr_code.wallet_not_installed.select', children: t('dyn_qr_code.wallet_not_installed.select') }), jsxRuntime.jsx("div", { className: 'no-qr-code-installed__links-section', children: downloadLinks }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', className: 'no-qr-code-installed__typography', weight: 'medium', color: 'secondary', copykey: 'dyn_qr_code.wallet_not_installed.refresh', children: t('dyn_qr_code.wallet_not_installed.refresh') })] }));

package/src/lib/views/NoQrNotInstalledView/NoQrNotInstalledView.js

@@ -97,7 +97,7 @@ const NoQrNotInstalledView = () => {
         .map(([name, link]) => (jsx(WalletHelpLink, { name: name, link: link, 
         // justification: we're looping over the keys of walletLinks.desktop
         Icon: getBrowserIcon(name) }, name)));
-    return (jsxs("div", { className: 'no-qr-code-installed__container', "data-testid": 'no-qr-code-installed', children: [jsx("div", { className: 'no-qr-code-installed__img', children: jsx(WalletIcon, { walletKey: selectedWalletConnector.key, style: { height: pixelToRem(64), width: pixelToRem(64) } }) }), jsx(Typography, { className: 'no-qr-code-installed__typography--title', variant: 'title', copykey: 'dyn_qr_code.wallet_not_installed.install', children: t('dyn_qr_code.wallet_not_installed.install', {
+    return (jsxs("div", { className: 'no-qr-code-installed__container', "data-testid": 'no-qr-code-installed', children: [jsx("div", { className: 'no-qr-code-installed__img', children: jsx(WalletIcon, { icon: selectedWalletConnector.metadata.icon, walletKey: selectedWalletConnector.key, style: { height: pixelToRem(64), width: pixelToRem(64) } }) }), jsx(Typography, { className: 'no-qr-code-installed__typography--title', variant: 'title', copykey: 'dyn_qr_code.wallet_not_installed.install', children: t('dyn_qr_code.wallet_not_installed.install', {
                     wallet: getWalletBookWallet(walletBook, selectedWalletConnector.key)
                         .name,
                 }) }), jsx(Typography, { variant: 'body_normal', className: 'no-qr-code-installed__typography', color: 'secondary', copykey: 'dyn_qr_code.wallet_not_installed.select', children: t('dyn_qr_code.wallet_not_installed.select') }), jsx("div", { className: 'no-qr-code-installed__links-section', children: downloadLinks }), jsx(Typography, { variant: 'body_mini', className: 'no-qr-code-installed__typography', weight: 'medium', color: 'secondary', copykey: 'dyn_qr_code.wallet_not_installed.refresh', children: t('dyn_qr_code.wallet_not_installed.refresh') })] }));

package/src/lib/views/PendingConnectView/PendingConnectView.cjs

@@ -91,7 +91,7 @@ const PendingConnectView = () => {
     const { selectedWalletConnector: walletConnector } = useInternalDynamicContext.useInternalDynamicContext();
     const { t } = reactI18next.useTranslation();
     const iconSize = 94;
-    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
+    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { icon: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon, walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
             height: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
             width: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
         } }));

package/src/lib/views/PendingConnectView/PendingConnectView.js

@@ -87,7 +87,7 @@ const PendingConnectView = () => {
     const { selectedWalletConnector: walletConnector } = useInternalDynamicContext();
     const { t } = useTranslation();
     const iconSize = 94;
-    const icon = (jsx(WalletIcon, { walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
+    const icon = (jsx(WalletIcon, { icon: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon, walletKey: walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.key, style: {
             height: pixelToRem(iconSize * iconRatio),
             width: pixelToRem(iconSize * iconRatio),
         } }));

package/src/lib/views/PendingSignatureView/PendingSignatureView.cjs

@@ -117,7 +117,7 @@ const PendingSignatureView = () => {
             setLoading(false);
         }
     });
-    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletConnector.key, style: {
+    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { icon: walletConnector.metadata.icon, walletKey: walletConnector.key, style: {
             height: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
             width: pixelToRem.pixelToRem(iconSize * IconWithSpinner.iconRatio),
         } }));

package/src/lib/views/PendingSignatureView/PendingSignatureView.js

@@ -113,7 +113,7 @@ const PendingSignatureView = () => {
             setLoading(false);
         }
     });
-    const icon = (jsx(WalletIcon, { walletKey: walletConnector.key, style: {
+    const icon = (jsx(WalletIcon, { icon: walletConnector.metadata.icon, walletKey: walletConnector.key, style: {
             height: pixelToRem(iconSize * iconRatio),
             width: pixelToRem(iconSize * iconRatio),
         } }));

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

@@ -91,16 +91,15 @@ const QrCodeView = () => {
     const { theme: { theme }, } = ThemeContext.useThemeContext();
     const { name } = theme;
     const { qrcodeUri, desktopUri, selectedWalletConnector: walletConnector, } = useInternalDynamicContext.useInternalDynamicContext();
-    const { walletBook: walletBook$1 } = walletBook.useWalletBookContext();
     if (!walletConnector) {
         return null;
     }
-    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletConnector.key, style: { height: pixelToRem.pixelToRem(32), width: pixelToRem.pixelToRem(32) } }));
+    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { icon: walletConnector.metadata.icon, walletKey: walletConnector.key, style: { height: pixelToRem.pixelToRem(32), width: pixelToRem.pixelToRem(32) } }));
     return (jsxRuntime.jsx(QrCodeWrapper.QrCodeWrapper, { uri: qrcodeUri, desktopUri: desktopUri, accentColor: 
         /* istanbul ignore next */
         name === 'dark'
             ? theme.colors.textPrimary
-            : (_a = walletBook.getWalletPrimaryColor(walletBook$1, walletConnector.key)) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
+            : (_a = walletConnector.metadata.brandColor) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
 };
 
 exports.QrCodeView = QrCodeView;

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

@@ -1,6 +1,6 @@
 'use client'
 import { jsx } from 'react/jsx-runtime';
-import { useWalletBookContext, WalletIcon, getWalletPrimaryColor } from '@dynamic-labs/wallet-book';
+import { WalletIcon } from '@dynamic-labs/wallet-book';
 import { useThemeContext } from '../../context/ThemeContext/ThemeContext.js';
 import 'react';
 import '../../context/DynamicContext/DynamicContext.js';
@@ -87,16 +87,15 @@ const QrCodeView = () => {
     const { theme: { theme }, } = useThemeContext();
     const { name } = theme;
     const { qrcodeUri, desktopUri, selectedWalletConnector: walletConnector, } = useInternalDynamicContext();
-    const { walletBook } = useWalletBookContext();
     if (!walletConnector) {
         return null;
     }
-    const icon = (jsx(WalletIcon, { walletKey: walletConnector.key, style: { height: pixelToRem(32), width: pixelToRem(32) } }));
+    const icon = (jsx(WalletIcon, { icon: walletConnector.metadata.icon, walletKey: walletConnector.key, style: { height: pixelToRem(32), width: pixelToRem(32) } }));
     return (jsx(QrCodeWrapper, { uri: qrcodeUri, desktopUri: desktopUri, accentColor: 
         /* istanbul ignore next */
         name === 'dark'
             ? theme.colors.textPrimary
-            : (_a = getWalletPrimaryColor(walletBook, walletConnector.key)) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
+            : (_a = walletConnector.metadata.brandColor) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
 };
 
 export { QrCodeView };

package/src/lib/views/SelectHardwareWalletView/SelectHardwareWalletView.cjs

@@ -90,7 +90,7 @@ require('qrcode');
 
 const SelectHardwareWalletView = ({ wallet, onSelectWallet, }) => {
     const { t } = reactI18next.useTranslation();
-    return (jsxRuntime.jsx("div", { className: 'select-hardware-wallet-view', children: jsxRuntime.jsxs("div", { className: 'select-hardware-wallet-view__container', children: [jsxRuntime.jsx(Icon.Icon, { className: 'select-hardware-wallet-view__icon', children: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: wallet.key }) }), jsxRuntime.jsx(Typography.Typography, { className: 'select-hardware-wallet-view__text', as: 'p', color: 'secondary', variant: 'body_normal', copykey: 'dyn_select_hardware_wallet.description', children: t('dyn_select_hardware_wallet.description') }), walletConnectorCore.isHardwareWalletConnector(wallet.walletConnector) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(HardwareWalletToggle.HardwareWalletToggle, { connectors: [wallet.walletConnector], copykey: 'dyn_select_chain.using_hardware_wallet_toggle_label', label: t('dyn_select_chain.using_hardware_wallet_toggle_label') }), jsxRuntime.jsx(Divider.Divider, {})] })), jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'primary', onClick: () => onSelectWallet === null || onSelectWallet === void 0 ? void 0 : onSelectWallet(wallet), copykey: 'dyn_select_hardware_wallet.button', dataTestId: 'select-hardware-wallet-connect-button', children: t('dyn_select_hardware_wallet.button') })] }) }));
+    return (jsxRuntime.jsx("div", { className: 'select-hardware-wallet-view', children: jsxRuntime.jsxs("div", { className: 'select-hardware-wallet-view__container', children: [jsxRuntime.jsx(Icon.Icon, { className: 'select-hardware-wallet-view__icon', children: jsxRuntime.jsx(walletBook.WalletIcon, { icon: wallet.walletConnector.metadata.icon, walletKey: wallet.key }) }), jsxRuntime.jsx(Typography.Typography, { className: 'select-hardware-wallet-view__text', as: 'p', color: 'secondary', variant: 'body_normal', copykey: 'dyn_select_hardware_wallet.description', children: t('dyn_select_hardware_wallet.description') }), walletConnectorCore.isHardwareWalletConnector(wallet.walletConnector) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(HardwareWalletToggle.HardwareWalletToggle, { connectors: [wallet.walletConnector], copykey: 'dyn_select_chain.using_hardware_wallet_toggle_label', label: t('dyn_select_chain.using_hardware_wallet_toggle_label') }), jsxRuntime.jsx(Divider.Divider, {})] })), jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'primary', onClick: () => onSelectWallet === null || onSelectWallet === void 0 ? void 0 : onSelectWallet(wallet), copykey: 'dyn_select_hardware_wallet.button', dataTestId: 'select-hardware-wallet-connect-button', children: t('dyn_select_hardware_wallet.button') })] }) }));
 };
 
 exports.SelectHardwareWalletView = SelectHardwareWalletView;

package/src/lib/views/SelectHardwareWalletView/SelectHardwareWalletView.js

@@ -86,7 +86,7 @@ import 'qrcode';
 
 const SelectHardwareWalletView = ({ wallet, onSelectWallet, }) => {
     const { t } = useTranslation();
-    return (jsx("div", { className: 'select-hardware-wallet-view', children: jsxs("div", { className: 'select-hardware-wallet-view__container', children: [jsx(Icon, { className: 'select-hardware-wallet-view__icon', children: jsx(WalletIcon, { walletKey: wallet.key }) }), jsx(Typography, { className: 'select-hardware-wallet-view__text', as: 'p', color: 'secondary', variant: 'body_normal', copykey: 'dyn_select_hardware_wallet.description', children: t('dyn_select_hardware_wallet.description') }), isHardwareWalletConnector(wallet.walletConnector) && (jsxs(Fragment, { children: [jsx(HardwareWalletToggle, { connectors: [wallet.walletConnector], copykey: 'dyn_select_chain.using_hardware_wallet_toggle_label', label: t('dyn_select_chain.using_hardware_wallet_toggle_label') }), jsx(Divider, {})] })), jsx(TypographyButton, { buttonVariant: 'primary', onClick: () => onSelectWallet === null || onSelectWallet === void 0 ? void 0 : onSelectWallet(wallet), copykey: 'dyn_select_hardware_wallet.button', dataTestId: 'select-hardware-wallet-connect-button', children: t('dyn_select_hardware_wallet.button') })] }) }));
+    return (jsx("div", { className: 'select-hardware-wallet-view', children: jsxs("div", { className: 'select-hardware-wallet-view__container', children: [jsx(Icon, { className: 'select-hardware-wallet-view__icon', children: jsx(WalletIcon, { icon: wallet.walletConnector.metadata.icon, walletKey: wallet.key }) }), jsx(Typography, { className: 'select-hardware-wallet-view__text', as: 'p', color: 'secondary', variant: 'body_normal', copykey: 'dyn_select_hardware_wallet.description', children: t('dyn_select_hardware_wallet.description') }), isHardwareWalletConnector(wallet.walletConnector) && (jsxs(Fragment, { children: [jsx(HardwareWalletToggle, { connectors: [wallet.walletConnector], copykey: 'dyn_select_chain.using_hardware_wallet_toggle_label', label: t('dyn_select_chain.using_hardware_wallet_toggle_label') }), jsx(Divider, {})] })), jsx(TypographyButton, { buttonVariant: 'primary', onClick: () => onSelectWallet === null || onSelectWallet === void 0 ? void 0 : onSelectWallet(wallet), copykey: 'dyn_select_hardware_wallet.button', dataTestId: 'select-hardware-wallet-connect-button', children: t('dyn_select_hardware_wallet.button') })] }) }));
 };
 
 export { SelectHardwareWalletView };

package/src/lib/views/SyncWalletView/AutoReconnectingView/AutoReconnectingView.cjs

@@ -98,7 +98,7 @@ const AutoReconnectingView = ({ onCancel, onSuccess, connector, expectedAddress,
             onSuccess();
         }
     }), { deps: [connector] });
-    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, { dataTestId: 'auto-reconnecting', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: connector === null || connector === void 0 ? void 0 : connector.key }), title: t('dyn_sync_wallet.reconnecting.title'), onClose: onCancel, children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', weight: 'regular', children: t('dyn_sync_wallet.reconnecting.description', {
+    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, { dataTestId: 'auto-reconnecting', icon: jsxRuntime.jsx(walletBook.WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), title: t('dyn_sync_wallet.reconnecting.title'), onClose: onCancel, children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', weight: 'regular', children: t('dyn_sync_wallet.reconnecting.description', {
                 walletAddress: shortenWalletAddress.shortenWalletAddress(expectedAddress, 3, 3),
             }) }) }));
 };

package/src/lib/views/SyncWalletView/AutoReconnectingView/AutoReconnectingView.js

@@ -94,7 +94,7 @@ const AutoReconnectingView = ({ onCancel, onSuccess, connector, expectedAddress,
             onSuccess();
         }
     }), { deps: [connector] });
-    return (jsx(DefaultPromptModal, { dataTestId: 'auto-reconnecting', icon: jsx(WalletIcon, { walletKey: connector === null || connector === void 0 ? void 0 : connector.key }), title: t('dyn_sync_wallet.reconnecting.title'), onClose: onCancel, children: jsx(Typography, { variant: 'body_normal', color: 'secondary', weight: 'regular', children: t('dyn_sync_wallet.reconnecting.description', {
+    return (jsx(DefaultPromptModal, { dataTestId: 'auto-reconnecting', icon: jsx(WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), title: t('dyn_sync_wallet.reconnecting.title'), onClose: onCancel, children: jsx(Typography, { variant: 'body_normal', color: 'secondary', weight: 'regular', children: t('dyn_sync_wallet.reconnecting.description', {
                 walletAddress: shortenWalletAddress(expectedAddress, 3, 3),
             }) }) }));
 };

package/src/lib/views/SyncWalletView/ReconnectWithQrCodeView/ReconnectWithQrCodeView.cjs

@@ -89,7 +89,6 @@ var QrCodeWrapper = require('../../../components/QrCodeWrapper/QrCodeWrapper.cjs
 const ReconnectWithQrCodeView = ({ onCancel, onSuccess, connector, expectedAddress, }) => {
     var _a;
     const { t } = reactI18next.useTranslation();
-    const { walletBook: walletBook$1 } = walletBook.useWalletBookContext();
     const { theme: { theme }, } = ThemeContext.useThemeContext();
     const { name: themeName } = theme;
     const [qrcodeUri, setQrcodeUri] = React.useState();
@@ -115,7 +114,9 @@ const ReconnectWithQrCodeView = ({ onCancel, onSuccess, connector, expectedAddre
             /* istanbul ignore next */
             themeName === 'dark'
                 ? theme.colors.textPrimary
-                : (_a = walletBook.getWalletPrimaryColor(walletBook$1, connector.key)) !== null && _a !== void 0 ? _a : '', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: connector === null || connector === void 0 ? void 0 : connector.key }), showCopyToClipboardButton: true, walletConnector: connector })) }));
+                : (_a = connector.metadata.brandColor) !== null && _a !== void 0 ? _a : '', icon: 
+            // eslint-disable-next-line react/jsx-wrap-multilines
+            jsxRuntime.jsx(walletBook.WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), showCopyToClipboardButton: true, walletConnector: connector })) }));
 };
 
 exports.ReconnectWithQrCodeView = ReconnectWithQrCodeView;

package/src/lib/views/SyncWalletView/ReconnectWithQrCodeView/ReconnectWithQrCodeView.js

@@ -4,7 +4,7 @@ import { jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { isSameAddress } from '@dynamic-labs/wallet-connector-core';
-import { useWalletBookContext, getWalletPrimaryColor, WalletIcon } from '@dynamic-labs/wallet-book';
+import { WalletIcon } from '@dynamic-labs/wallet-book';
 import { DefaultPromptModal } from '../../../widgets/DynamicWidget/prompts/DefaultPromptModal/DefaultPromptModal.js';
 import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../components/Alert/Alert.js';
@@ -85,7 +85,6 @@ import { QrCodeWrapper } from '../../../components/QrCodeWrapper/QrCodeWrapper.j
 const ReconnectWithQrCodeView = ({ onCancel, onSuccess, connector, expectedAddress, }) => {
     var _a;
     const { t } = useTranslation();
-    const { walletBook } = useWalletBookContext();
     const { theme: { theme }, } = useThemeContext();
     const { name: themeName } = theme;
     const [qrcodeUri, setQrcodeUri] = useState();
@@ -111,7 +110,9 @@ const ReconnectWithQrCodeView = ({ onCancel, onSuccess, connector, expectedAddre
             /* istanbul ignore next */
             themeName === 'dark'
                 ? theme.colors.textPrimary
-                : (_a = getWalletPrimaryColor(walletBook, connector.key)) !== null && _a !== void 0 ? _a : '', icon: jsx(WalletIcon, { walletKey: connector === null || connector === void 0 ? void 0 : connector.key }), showCopyToClipboardButton: true, walletConnector: connector })) }));
+                : (_a = connector.metadata.brandColor) !== null && _a !== void 0 ? _a : '', icon: 
+            // eslint-disable-next-line react/jsx-wrap-multilines
+            jsx(WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), showCopyToClipboardButton: true, walletConnector: connector })) }));
 };
 
 export { ReconnectWithQrCodeView };

package/src/lib/views/SyncWalletView/SwitchWalletView/SwitchWalletView.cjs

@@ -90,7 +90,7 @@ require('qrcode');
 
 const SwitchWalletView = ({ onCancel, connector, expectedAddress, activeAddress, }) => {
     const { t } = reactI18next.useTranslation();
-    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, { dataTestId: 'switch-wallet', className: 'switch-wallet', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: connector.key }), title: t('dyn_sync_wallet.switch_wallet.title'), onClose: onCancel, children: jsxRuntime.jsxs("div", { className: 'switch-wallet__body', children: [activeAddress && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.active_address.heading', children: t('dyn_sync_wallet.switch_wallet.active_address.heading') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', children: shortenWalletAddress.shortenWalletAddress(activeAddress, 3, 3) }), jsxRuntime.jsx(Divider.Divider, { className: 'switch-wallet__body__divider', children: jsxRuntime.jsx(arrowCircleRight.ReactComponent, {}) })] })), jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.heading', children: t('dyn_sync_wallet.switch_wallet.expected_address.heading') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.prompt', className: 'switch-wallet__body__expected-address__prompt', children: t('dyn_sync_wallet.switch_wallet.expected_address.prompt') }), jsxRuntime.jsx(Typography.Typography, { color: 'green-1', weight: 'bold', className: 'switch-wallet__body__expected-address__address', children: shortenWalletAddress.shortenWalletAddress(expectedAddress, 3, 3) })] }) }));
+    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, { dataTestId: 'switch-wallet', className: 'switch-wallet', icon: jsxRuntime.jsx(walletBook.WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), title: t('dyn_sync_wallet.switch_wallet.title'), onClose: onCancel, children: jsxRuntime.jsxs("div", { className: 'switch-wallet__body', children: [activeAddress && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.active_address.heading', children: t('dyn_sync_wallet.switch_wallet.active_address.heading') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', children: shortenWalletAddress.shortenWalletAddress(activeAddress, 3, 3) }), jsxRuntime.jsx(Divider.Divider, { className: 'switch-wallet__body__divider', children: jsxRuntime.jsx(arrowCircleRight.ReactComponent, {}) })] })), jsxRuntime.jsx(Typography.Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.heading', children: t('dyn_sync_wallet.switch_wallet.expected_address.heading') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.prompt', className: 'switch-wallet__body__expected-address__prompt', children: t('dyn_sync_wallet.switch_wallet.expected_address.prompt') }), jsxRuntime.jsx(Typography.Typography, { color: 'green-1', weight: 'bold', className: 'switch-wallet__body__expected-address__address', children: shortenWalletAddress.shortenWalletAddress(expectedAddress, 3, 3) })] }) }));
 };
 
 exports.SwitchWalletView = SwitchWalletView;

package/src/lib/views/SyncWalletView/SwitchWalletView/SwitchWalletView.js

@@ -86,7 +86,7 @@ import 'qrcode';
 
 const SwitchWalletView = ({ onCancel, connector, expectedAddress, activeAddress, }) => {
     const { t } = useTranslation();
-    return (jsx(DefaultPromptModal, { dataTestId: 'switch-wallet', className: 'switch-wallet', icon: jsx(WalletIcon, { walletKey: connector.key }), title: t('dyn_sync_wallet.switch_wallet.title'), onClose: onCancel, children: jsxs("div", { className: 'switch-wallet__body', children: [activeAddress && (jsxs(Fragment, { children: [jsx(Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.active_address.heading', children: t('dyn_sync_wallet.switch_wallet.active_address.heading') }), jsx(Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', children: shortenWalletAddress(activeAddress, 3, 3) }), jsx(Divider, { className: 'switch-wallet__body__divider', children: jsx(SvgArrowCircleRight, {}) })] })), jsx(Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.heading', children: t('dyn_sync_wallet.switch_wallet.expected_address.heading') }), jsx(Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.prompt', className: 'switch-wallet__body__expected-address__prompt', children: t('dyn_sync_wallet.switch_wallet.expected_address.prompt') }), jsx(Typography, { color: 'green-1', weight: 'bold', className: 'switch-wallet__body__expected-address__address', children: shortenWalletAddress(expectedAddress, 3, 3) })] }) }));
+    return (jsx(DefaultPromptModal, { dataTestId: 'switch-wallet', className: 'switch-wallet', icon: jsx(WalletIcon, { icon: connector.metadata.icon, walletKey: connector.key }), title: t('dyn_sync_wallet.switch_wallet.title'), onClose: onCancel, children: jsxs("div", { className: 'switch-wallet__body', children: [activeAddress && (jsxs(Fragment, { children: [jsx(Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.active_address.heading', children: t('dyn_sync_wallet.switch_wallet.active_address.heading') }), jsx(Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', children: shortenWalletAddress(activeAddress, 3, 3) }), jsx(Divider, { className: 'switch-wallet__body__divider', children: jsx(SvgArrowCircleRight, {}) })] })), jsx(Typography, { variant: 'body_mini', color: 'secondary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.heading', children: t('dyn_sync_wallet.switch_wallet.expected_address.heading') }), jsx(Typography, { variant: 'body_normal', color: 'primary', weight: 'regular', copykey: 'dyn_sync_wallet.switch_wallet.expected_address.prompt', className: 'switch-wallet__body__expected-address__prompt', children: t('dyn_sync_wallet.switch_wallet.expected_address.prompt') }), jsx(Typography, { color: 'green-1', weight: 'bold', className: 'switch-wallet__body__expected-address__address', children: shortenWalletAddress(expectedAddress, 3, 3) })] }) }));
 };
 
 export { SwitchWalletView };

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

@@ -119,7 +119,7 @@ const TransactionConfirmationView = ({ transaction, onError, onSuccess, mutation
     useEffectOnce.useEffectOnce(() => {
         const fetchSimulationResult = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
             var _a, _b;
-            if (sendBalanceTransaction) {
+            if (sendBalanceTransaction || hideModal) {
                 setIsSimulationComplete(true);
                 return;
             }

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

@@ -111,7 +111,7 @@ const TransactionConfirmationView = ({ transaction, onError, onSuccess, mutation
     useEffectOnce(() => {
         const fetchSimulationResult = () => __awaiter(void 0, void 0, void 0, function* () {
             var _a, _b;
-            if (sendBalanceTransaction) {
+            if (sendBalanceTransaction || hideModal) {
                 setIsSimulationComplete(true);
                 return;
             }