@dynamic-labs/sdk-react-core 0.19.0-alpha.7 → 0.19.0-alpha.9

package/src/lib/widgets/DynamicWidget/prompts/NoQrNotInstalledModalView/NoQrNotInstalledModalView.cjs

@@ -19,6 +19,7 @@ require('../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
 var pixelToRem = require('../../../../utils/functions/pixelToRem/pixelToRem.cjs');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -58,14 +58,14 @@ const NoQrNotInstalledModalView = () => {
     if (!selectedWalletConnector) {
         return null;
     }
-    const walletName = walletBook.getWalletBookWallet(walletBook$1, selectedWalletConnector.name).name;
-    const walletLinks = walletBook.getWalletLinks(walletBook$1, selectedWalletConnector.name);
+    const walletName = walletBook.getWalletBookWallet(walletBook$1, selectedWalletConnector.key).name;
+    const walletLinks = walletBook.getWalletLinks(walletBook$1, selectedWalletConnector.key);
     const { currentDesktopUrl, userBrowser } = parseWalletLinks.parseWalletLinks(walletLinks);
     const downloadLinks = userBrowser && currentDesktopUrl ? (jsxRuntime.jsx(WalletHelpLink.WalletHelpLink, { name: userBrowser, link: currentDesktopUrl, Icon: getBrowserIcon.getBrowserIcon(userBrowser) }, userBrowser)) : (Object.entries(walletLinks)
         .filter(([, link]) => link !== '')
         .filter(([name]) => name !== 'ios' && name !== 'android')
         .map(([name, link]) => (jsxRuntime.jsx(WalletHelpLink.WalletHelpLink, { name: name, link: link, Icon: getBrowserIcon.getBrowserIcon(name) }, name))));
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view', "data-testid": 'no-qr-code-not-installed' }, { children: [jsxRuntime.jsx(walletBook.WalletIcon, { walletName: selectedWalletConnector.name, style: { height: pixelToRem.pixelToRem(64), width: pixelToRem.pixelToRem(64) } }), jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: ["We can\u2019t detect ", walletName, " extension"] })), Array.isArray(downloadLinks) && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: "Select from your preferred options below:" }))), jsxRuntime.jsx("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view__links-section' }, { children: downloadLinks })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: "Refresh the page once installed" }))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view', "data-testid": 'no-qr-code-not-installed' }, { children: [jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletConnector.key, style: { height: pixelToRem.pixelToRem(64), width: pixelToRem.pixelToRem(64) } }), jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: ["We can\u2019t detect ", walletName, " extension"] })), Array.isArray(downloadLinks) && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: "Select from your preferred options below:" }))), jsxRuntime.jsx("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view__links-section' }, { children: downloadLinks })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: "Refresh the page once installed" }))] })));
 };
 
 exports.NoQrNotInstalledModalView = NoQrNotInstalledModalView;

package/src/lib/widgets/DynamicWidget/prompts/NoQrNotInstalledModalView/NoQrNotInstalledModalView.js

@@ -15,6 +15,7 @@ import '../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
 import { pixelToRem } from '../../../../utils/functions/pixelToRem/pixelToRem.js';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
@@ -54,14 +54,14 @@ const NoQrNotInstalledModalView = () => {
     if (!selectedWalletConnector) {
         return null;
     }
-    const walletName = getWalletBookWallet(walletBook, selectedWalletConnector.name).name;
-    const walletLinks = getWalletLinks(walletBook, selectedWalletConnector.name);
+    const walletName = getWalletBookWallet(walletBook, selectedWalletConnector.key).name;
+    const walletLinks = getWalletLinks(walletBook, selectedWalletConnector.key);
     const { currentDesktopUrl, userBrowser } = parseWalletLinks(walletLinks);
     const downloadLinks = userBrowser && currentDesktopUrl ? (jsx(WalletHelpLink, { name: userBrowser, link: currentDesktopUrl, Icon: getBrowserIcon(userBrowser) }, userBrowser)) : (Object.entries(walletLinks)
         .filter(([, link]) => link !== '')
         .filter(([name]) => name !== 'ios' && name !== 'android')
         .map(([name, link]) => (jsx(WalletHelpLink, { name: name, link: link, Icon: getBrowserIcon(name) }, name))));
-    return (jsxs("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view', "data-testid": 'no-qr-code-not-installed' }, { children: [jsx(WalletIcon, { walletName: selectedWalletConnector.name, style: { height: pixelToRem(64), width: pixelToRem(64) } }), jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: ["We can\u2019t detect ", walletName, " extension"] })), Array.isArray(downloadLinks) && (jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: "Select from your preferred options below:" }))), jsx("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view__links-section' }, { children: downloadLinks })), jsx(Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: "Refresh the page once installed" }))] })));
+    return (jsxs("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view', "data-testid": 'no-qr-code-not-installed' }, { children: [jsx(WalletIcon, { walletKey: selectedWalletConnector.key, style: { height: pixelToRem(64), width: pixelToRem(64) } }), jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: ["We can\u2019t detect ", walletName, " extension"] })), Array.isArray(downloadLinks) && (jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: "Select from your preferred options below:" }))), jsx("div", Object.assign({ className: 'no-qr-code-not-installed-modal-view__links-section' }, { children: downloadLinks })), jsx(Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: "Refresh the page once installed" }))] })));
 };
 
 export { NoQrNotInstalledModalView };

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/PendingAccountSwitchModal.cjs

@@ -30,7 +30,7 @@ const PendingAccountSwitchModal = () => {
         });
         disconnectAndConnect();
     }, [selectedConnector]);
-    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletName: selectedConnector === null || selectedConnector === void 0 ? void 0 : selectedConnector.name }), title: `Switch wallet in ${selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.connector.name}` }, { children: isSameWallet || !connectedWallet ? (jsxRuntime.jsx(SwitchAccountView.SwitchAccountView, { selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) : (jsxRuntime.jsx(SwitchOrUseActiveAccountView.SwitchOrUseActiveAccountView, { connectedWallet: connectedWallet, selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) })));
+    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedConnector === null || selectedConnector === void 0 ? void 0 : selectedConnector.key }), title: `Switch wallet in ${selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.connector.name}` }, { children: isSameWallet || !connectedWallet ? (jsxRuntime.jsx(SwitchAccountView.SwitchAccountView, { selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) : (jsxRuntime.jsx(SwitchOrUseActiveAccountView.SwitchOrUseActiveAccountView, { connectedWallet: connectedWallet, selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) })));
 };
 
 exports.PendingAccountSwitchModal = PendingAccountSwitchModal;

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/PendingAccountSwitchModal.js

@@ -26,7 +26,7 @@ const PendingAccountSwitchModal = () => {
         });
         disconnectAndConnect();
     }, [selectedConnector]);
-    return (jsx(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletName: selectedConnector === null || selectedConnector === void 0 ? void 0 : selectedConnector.name }), title: `Switch wallet in ${selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.connector.name}` }, { children: isSameWallet || !connectedWallet ? (jsx(SwitchAccountView, { selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) : (jsx(SwitchOrUseActiveAccountView, { connectedWallet: connectedWallet, selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) })));
+    return (jsx(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletKey: selectedConnector === null || selectedConnector === void 0 ? void 0 : selectedConnector.key }), title: `Switch wallet in ${selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.connector.name}` }, { children: isSameWallet || !connectedWallet ? (jsx(SwitchAccountView, { selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) : (jsx(SwitchOrUseActiveAccountView, { connectedWallet: connectedWallet, selectedWalletToSwitchTo: selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet })) })));
 };
 
 export { PendingAccountSwitchModal };

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/SwitchAccountView/SwitchAccountView.cjs

@@ -19,6 +19,7 @@ require('ethers');
 require('../../../../../shared/consts/index.cjs');
 require('../../../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/SwitchAccountView/SwitchAccountView.js

@@ -15,6 +15,7 @@ import 'ethers';
 import '../../../../../shared/consts/index.js';
 import '../../../../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../config/ApiEndpoint.js';
 import '../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/SwitchOrUseActiveAccountView/SwitchOrUseActiveAccountView.cjs

@@ -20,6 +20,7 @@ require('ethers');
 require('../../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 var Icon = require('../../../../../components/Icon/Icon.cjs');
@@ -28,7 +29,6 @@ require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');
@@ -74,7 +74,7 @@ const SwitchOrUseActiveAccountView = ({ connectedWallet, selectedWalletToSwitchT
         computeConnectedStateForWallets,
         setSelectedWalletConnector,
     ]);
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.address, 3, 3) })), ' ', "is not active in ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, ". To make active, open your ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, " wallet and switch to this account."] })), jsxRuntime.jsx(Divider.Divider, { fullWidth: true, text: 'Or' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: "Use your active wallet" })), jsxRuntime.jsxs(Button.Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onUseActiveWalletClick, dataTestId: 'use-active-wallet-button' }, { children: ["Select", ' ', jsxRuntime.jsx(Icon.Icon, Object.assign({ size: 'xsmall' }, { children: jsxRuntime.jsx(walletBook.WalletIcon, { walletName: selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name }) })), ' ', shortenWalletAddress.shortenWalletAddress(connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.address, 3, 3)] }))] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.address, 3, 3) })), ' ', "is not active in ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, ". To make active, open your ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, " wallet and switch to this account."] })), jsxRuntime.jsx(Divider.Divider, { fullWidth: true, text: 'Or' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: "Use your active wallet" })), jsxRuntime.jsxs(Button.Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onUseActiveWalletClick, dataTestId: 'use-active-wallet-button' }, { children: ["Select", ' ', jsxRuntime.jsx(Icon.Icon, Object.assign({ size: 'xsmall' }, { children: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.key }) })), ' ', shortenWalletAddress.shortenWalletAddress(connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.address, 3, 3)] }))] }));
 };
 
 exports.SwitchOrUseActiveAccountView = SwitchOrUseActiveAccountView;

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchModal/SwitchOrUseActiveAccountView/SwitchOrUseActiveAccountView.js

@@ -16,6 +16,7 @@ import 'ethers';
 import '../../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../config/ApiEndpoint.js';
 import '../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../context/ThemeContext/ThemeContext.js';
 import { Icon } from '../../../../../components/Icon/Icon.js';
@@ -24,7 +25,6 @@ import 'react-focus-lock';
 import '../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';
@@ -70,7 +70,7 @@ const SwitchOrUseActiveAccountView = ({ connectedWallet, selectedWalletToSwitchT
         computeConnectedStateForWallets,
         setSelectedWalletConnector,
     ]);
-    return (jsxs(Fragment, { children: [jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.address, 3, 3) })), ' ', "is not active in ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, ". To make active, open your ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, " wallet and switch to this account."] })), jsx(Divider, { fullWidth: true, text: 'Or' }), jsx(Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: "Use your active wallet" })), jsxs(Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onUseActiveWalletClick, dataTestId: 'use-active-wallet-button' }, { children: ["Select", ' ', jsx(Icon, Object.assign({ size: 'xsmall' }, { children: jsx(WalletIcon, { walletName: selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name }) })), ' ', shortenWalletAddress(connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.address, 3, 3)] }))] }));
+    return (jsxs(Fragment, { children: [jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.address, 3, 3) })), ' ', "is not active in ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, ". To make active, open your ", selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.name, " wallet and switch to this account."] })), jsx(Divider, { fullWidth: true, text: 'Or' }), jsx(Typography, Object.assign({ variant: 'body_normal', color: 'primary' }, { children: "Use your active wallet" })), jsxs(Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onUseActiveWalletClick, dataTestId: 'use-active-wallet-button' }, { children: ["Select", ' ', jsx(Icon, Object.assign({ size: 'xsmall' }, { children: jsx(WalletIcon, { walletKey: selectedWalletToSwitchTo === null || selectedWalletToSwitchTo === void 0 ? void 0 : selectedWalletToSwitchTo.connector.key }) })), ' ', shortenWalletAddress(connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.address, 3, 3)] }))] }));
 };
 
 export { SwitchOrUseActiveAccountView };

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchToLinkModal/PendingAccountSwitchToLinkModal.cjs

@@ -19,6 +19,7 @@ require('../../../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
 require('../../../../shared/consts/index.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -64,7 +64,7 @@ const PendingAccountSwitchToLinkModal = () => {
         });
         disconnectAndConnect();
     }, [selectedWalletConnector]);
-    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name }), title: `Switch wallet in ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["To link a new wallet, open", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name })), ' ', "and switch to the account you want to link."] })) })));
+    return (jsxRuntime.jsx(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key }), title: `Switch wallet in ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["To link a new wallet, open", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name })), ' ', "and switch to the account you want to link."] })) })));
 };
 
 exports.PendingAccountSwitchToLinkModal = PendingAccountSwitchToLinkModal;

package/src/lib/widgets/DynamicWidget/prompts/PendingAccountSwitchToLinkModal/PendingAccountSwitchToLinkModal.js

@@ -15,6 +15,7 @@ import '../../../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
 import '../../../../shared/consts/index.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
@@ -60,7 +60,7 @@ const PendingAccountSwitchToLinkModal = () => {
         });
         disconnectAndConnect();
     }, [selectedWalletConnector]);
-    return (jsx(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name }), title: `Switch wallet in ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["To link a new wallet, open", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name })), ' ', "and switch to the account you want to link."] })) })));
+    return (jsx(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key }), title: `Switch wallet in ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["To link a new wallet, open", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name })), ' ', "and switch to the account you want to link."] })) })));
 };
 
 export { PendingAccountSwitchToLinkModal };

package/src/lib/widgets/DynamicWidget/prompts/PendingConnectionModal/PendingConnectionModal.cjs

@@ -20,6 +20,7 @@ require('ethers');
 require('../../../../shared/consts/index.cjs');
 require('@dynamic-labs/multi-wallet');
 var getReferencedAccount = require('../../../../utils/functions/getReferencedAccount/getReferencedAccount.cjs');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -27,7 +28,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');

package/src/lib/widgets/DynamicWidget/prompts/PendingConnectionModal/PendingConnectionModal.js

@@ -16,6 +16,7 @@ import 'ethers';
 import '../../../../shared/consts/index.js';
 import '@dynamic-labs/multi-wallet';
 import { getReferencedAccount } from '../../../../utils/functions/getReferencedAccount/getReferencedAccount.js';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -23,7 +24,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';

package/src/lib/widgets/DynamicWidget/prompts/PendingSignModal/DefaultPendingSignModalContent/DefaultPendingSignModalContent.cjs

@@ -19,6 +19,7 @@ require('ethers');
 require('../../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../../context/ErrorContext/ErrorContext.cjs');
@@ -70,7 +70,7 @@ const DefaultPendingSignModalContent = () => {
             setMultiWalletWidgetState('idle');
         }
     });
-    return (jsxRuntime.jsxs(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name }), title: `Sign in with ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "Sign the message in your wallet to approve linking this wallet to your account" })), utils.isMobile() &&
+    return (jsxRuntime.jsxs(DefaultPromptModal.DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key }), title: `Sign in with ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "Sign the message in your wallet to approve linking this wallet to your account" })), utils.isMobile() &&
                 !(selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.canConnectViaCustodialService) && (jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onClickToSign, dataTestId: 'click-to-sign-button' }, { children: "Click to Sign" })))] })));
 };
 

package/src/lib/widgets/DynamicWidget/prompts/PendingSignModal/DefaultPendingSignModalContent/DefaultPendingSignModalContent.js

@@ -15,6 +15,7 @@ import 'ethers';
 import '../../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../../config/ApiEndpoint.js';
 import '../../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';
@@ -66,7 +66,7 @@ const DefaultPendingSignModalContent = () => {
             setMultiWalletWidgetState('idle');
         }
     });
-    return (jsxs(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name }), title: `Sign in with ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "Sign the message in your wallet to approve linking this wallet to your account" })), isMobile() &&
+    return (jsxs(DefaultPromptModal, Object.assign({ showCloseButton: true, dataTestId: 'pending-account-switch', icon: jsx(WalletIcon, { walletKey: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.key }), title: `Sign in with ${selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name}` }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "Sign the message in your wallet to approve linking this wallet to your account" })), isMobile() &&
                 !(selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.canConnectViaCustodialService) && (jsx(Button, Object.assign({ buttonClassName: 'default-prompt-modal__button', buttonRounded: 'small', expanded: true, type: 'button', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, onClick: onClickToSign, dataTestId: 'click-to-sign-button' }, { children: "Click to Sign" })))] })));
 };
 

package/src/lib/widgets/DynamicWidget/prompts/PrimaryNotConnectedModal/PrimaryNotConnectedModal.cjs

@@ -19,6 +19,7 @@ require('ethers');
 require('../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -26,7 +27,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -55,7 +55,7 @@ var DefaultPromptModal = require('../DefaultPromptModal/DefaultPromptModal.cjs')
 const PrimaryNotConnectedModal = () => {
     var _a;
     const { primaryWallet } = useInternalDynamicContext.useInternalDynamicContext();
-    return (jsxRuntime.jsxs(DefaultPromptModal.DefaultPromptModal, Object.assign({ dataTestId: 'wallet-not-connected', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletName: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.name }), title: `Switch wallet in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name}` }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Your active wallet in", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name })), ' ', "is not linked. Please switch to wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })), ' ', "to log in."] })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "You can link this wallet to this account after you log in." })), jsxRuntime.jsx(Divider.Divider, { fullWidth: true, text: 'Or' }), jsxRuntime.jsx(LogoutButton.LogoutButton, { isTextButton: false, buttonClassName: 'primary-not-connected__log-out-button' })] })));
+    return (jsxRuntime.jsxs(DefaultPromptModal.DefaultPromptModal, Object.assign({ dataTestId: 'wallet-not-connected', icon: jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.key }), title: `Switch wallet in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name}` }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Your active wallet in", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name })), ' ', "is not linked. Please switch to wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })), ' ', "to log in."] })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "You can link this wallet to this account after you log in." })), jsxRuntime.jsx(Divider.Divider, { fullWidth: true, text: 'Or' }), jsxRuntime.jsx(LogoutButton.LogoutButton, { isTextButton: false, buttonClassName: 'primary-not-connected__log-out-button' })] })));
 };
 
 exports.PrimaryNotConnectedModal = PrimaryNotConnectedModal;

package/src/lib/widgets/DynamicWidget/prompts/PrimaryNotConnectedModal/PrimaryNotConnectedModal.js

@@ -15,6 +15,7 @@ import 'ethers';
 import '../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import 'react-dom';
@@ -22,7 +23,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
@@ -51,7 +51,7 @@ import { DefaultPromptModal } from '../DefaultPromptModal/DefaultPromptModal.js'
 const PrimaryNotConnectedModal = () => {
     var _a;
     const { primaryWallet } = useInternalDynamicContext();
-    return (jsxs(DefaultPromptModal, Object.assign({ dataTestId: 'wallet-not-connected', icon: jsx(WalletIcon, { walletName: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.name }), title: `Switch wallet in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name}` }, { children: [jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Your active wallet in", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name })), ' ', "is not linked. Please switch to wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })), ' ', "to log in."] })), jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "You can link this wallet to this account after you log in." })), jsx(Divider, { fullWidth: true, text: 'Or' }), jsx(LogoutButton, { isTextButton: false, buttonClassName: 'primary-not-connected__log-out-button' })] })));
+    return (jsxs(DefaultPromptModal, Object.assign({ dataTestId: 'wallet-not-connected', icon: jsx(WalletIcon, { walletKey: (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) === null || _a === void 0 ? void 0 : _a.key }), title: `Switch wallet in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name}` }, { children: [jsxs(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: ["Your active wallet in", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name })), ' ', "is not linked. Please switch to wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address, 3, 3) })), ' ', "to log in."] })), jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'regular', "data-testid": 'content' }, { children: "You can link this wallet to this account after you log in." })), jsx(Divider, { fullWidth: true, text: 'Or' }), jsx(LogoutButton, { isTextButton: false, buttonClassName: 'primary-not-connected__log-out-button' })] })));
 };
 
 export { PrimaryNotConnectedModal };

package/src/lib/widgets/DynamicWidget/prompts/QrCodeModalView/QrCodeModalView.cjs

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var walletBook = require('@dynamic-labs/wallet-book');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var QRCode = require('../../../../views/QrCodeView/QRCode.cjs');
 require('react');
 var Typography = require('../../../../components/Typography/Typography.cjs');
@@ -23,6 +23,7 @@ require('../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
 var pixelToRem = require('../../../../utils/functions/pixelToRem/pixelToRem.cjs');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 var ThemeContext = require('../../../../context/ThemeContext/ThemeContext.cjs');
 var Icon = require('../../../../components/Icon/Icon.cjs');
@@ -31,7 +32,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -57,25 +57,26 @@ require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
 
 const QrCodeModalView = ({ walletId }) => {
-    var _a;
+    var _a, _b;
     const { secondaryWallets, qrcodeUri, desktopUri } = useInternalDynamicContext.useInternalDynamicContext();
     const { walletBook: walletBook$1 } = walletBook.useWalletBookContext();
     const newPrimaryWallet = secondaryWallets.find(({ id }) => id === walletId);
-    const walletName = ((_a = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _a === void 0 ? void 0 : _a.name) || '';
+    const walletKey = ((_a = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _a === void 0 ? void 0 : _a.key) || '';
+    const walletName = ((_b = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _b === void 0 ? void 0 : _b.name) || '';
     const { theme } = ThemeContext.useThemeContext();
     const qrCodeColorsByTheme = {
         dark: {
             accentColor: 'var(--dynamic-text-primary)',
         },
         light: {
-            accentColor: walletBook.getWalletPrimaryColor(walletBook$1, walletName) ||
+            accentColor: walletBook.getWalletPrimaryColor(walletBook$1, walletKey) ||
                 'var(--dynamic-text-primary)',
         },
     };
     // can't use theme because it's string instead of 'light' | 'dark'
     const typedTheme = theme.theme.name === 'light' ? 'light' : 'dark';
-    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletName: walletName, style: { height: pixelToRem.pixelToRem(24), width: pixelToRem.pixelToRem(24) } }));
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'qr-code-modal-view' }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'button_primary', color: 'primary', className: 'qr-code-modal-view__title' }, { children: ["Connect with ", newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.name] })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_small', color: 'secondary', className: 'qr-code-modal-view__title' }, { children: ["Connect wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.address, 4, 4) })), ' ', "to switch active account."] })), jsxRuntime.jsx("div", Object.assign({ className: 'qr-code-modal-view__container' }, { children: jsxRuntime.jsx("div", Object.assign({ className: 'qr-code-modal-view__wrapper' }, { children: qrcodeUri ? (jsxRuntime.jsx(QRCode.QRCode, { Icon: icon, accentColor: qrCodeColorsByTheme[typedTheme].accentColor, value: qrcodeUri, size: 175, logoSize: 40, walletName: walletConnectorCore.normalizeWalletName(walletName) })) : (
+    const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletKey, style: { height: pixelToRem.pixelToRem(24), width: pixelToRem.pixelToRem(24) } }));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'qr-code-modal-view' }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'button_primary', color: 'primary', className: 'qr-code-modal-view__title' }, { children: ["Connect with ", newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.name] })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_small', color: 'secondary', className: 'qr-code-modal-view__title' }, { children: ["Connect wallet", ' ', jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.address, 4, 4) })), ' ', "to switch active account."] })), jsxRuntime.jsx("div", Object.assign({ className: 'qr-code-modal-view__container' }, { children: jsxRuntime.jsx("div", Object.assign({ className: 'qr-code-modal-view__wrapper' }, { children: qrcodeUri ? (jsxRuntime.jsx(QRCode.QRCode, { Icon: icon, accentColor: qrCodeColorsByTheme[typedTheme].accentColor, value: qrcodeUri, size: 175, logoSize: 40, walletKey: walletConnectorCore.normalizeWalletName(walletKey) })) : (
                     // this div exists to give the parent a child, so that the parent
                     // takes on its given width and height. the result is stable
                     // rendering of this component, without this there is a brief flash

package/src/lib/widgets/DynamicWidget/prompts/QrCodeModalView/QrCodeModalView.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { normalizeWalletName } from '@dynamic-labs/wallet-connector-core';
 import { useWalletBookContext, getWalletPrimaryColor, WalletIcon } from '@dynamic-labs/wallet-book';
+import { normalizeWalletName } from '@dynamic-labs/wallet-connector-core';
 import { QRCode } from '../../../../views/QrCodeView/QRCode.js';
 import 'react';
 import { Typography } from '../../../../components/Typography/Typography.js';
@@ -19,6 +19,7 @@ import '../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
 import '@dynamic-labs/multi-wallet';
 import { pixelToRem } from '../../../../utils/functions/pixelToRem/pixelToRem.js';
+import '../../../../config/ApiEndpoint.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import { useThemeContext } from '../../../../context/ThemeContext/ThemeContext.js';
 import { Icon } from '../../../../components/Icon/Icon.js';
@@ -27,7 +28,6 @@ import 'react-focus-lock';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
@@ -53,25 +53,26 @@ import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
 
 const QrCodeModalView = ({ walletId }) => {
-    var _a;
+    var _a, _b;
     const { secondaryWallets, qrcodeUri, desktopUri } = useInternalDynamicContext();
     const { walletBook } = useWalletBookContext();
     const newPrimaryWallet = secondaryWallets.find(({ id }) => id === walletId);
-    const walletName = ((_a = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _a === void 0 ? void 0 : _a.name) || '';
+    const walletKey = ((_a = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _a === void 0 ? void 0 : _a.key) || '';
+    const walletName = ((_b = newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector) === null || _b === void 0 ? void 0 : _b.name) || '';
     const { theme } = useThemeContext();
     const qrCodeColorsByTheme = {
         dark: {
             accentColor: 'var(--dynamic-text-primary)',
         },
         light: {
-            accentColor: getWalletPrimaryColor(walletBook, walletName) ||
+            accentColor: getWalletPrimaryColor(walletBook, walletKey) ||
                 'var(--dynamic-text-primary)',
         },
     };
     // can't use theme because it's string instead of 'light' | 'dark'
     const typedTheme = theme.theme.name === 'light' ? 'light' : 'dark';
-    const icon = (jsx(WalletIcon, { walletName: walletName, style: { height: pixelToRem(24), width: pixelToRem(24) } }));
-    return (jsxs("div", Object.assign({ className: 'qr-code-modal-view' }, { children: [jsxs(Typography, Object.assign({ variant: 'button_primary', color: 'primary', className: 'qr-code-modal-view__title' }, { children: ["Connect with ", newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.name] })), jsxs(Typography, Object.assign({ variant: 'body_small', color: 'secondary', className: 'qr-code-modal-view__title' }, { children: ["Connect wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.address, 4, 4) })), ' ', "to switch active account."] })), jsx("div", Object.assign({ className: 'qr-code-modal-view__container' }, { children: jsx("div", Object.assign({ className: 'qr-code-modal-view__wrapper' }, { children: qrcodeUri ? (jsx(QRCode, { Icon: icon, accentColor: qrCodeColorsByTheme[typedTheme].accentColor, value: qrcodeUri, size: 175, logoSize: 40, walletName: normalizeWalletName(walletName) })) : (
+    const icon = (jsx(WalletIcon, { walletKey: walletKey, style: { height: pixelToRem(24), width: pixelToRem(24) } }));
+    return (jsxs("div", Object.assign({ className: 'qr-code-modal-view' }, { children: [jsxs(Typography, Object.assign({ variant: 'button_primary', color: 'primary', className: 'qr-code-modal-view__title' }, { children: ["Connect with ", newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.name] })), jsxs(Typography, Object.assign({ variant: 'body_small', color: 'secondary', className: 'qr-code-modal-view__title' }, { children: ["Connect wallet", ' ', jsx(Typography, Object.assign({ as: 'span', weight: 'medium', color: 'primary' }, { children: shortenWalletAddress(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.address, 4, 4) })), ' ', "to switch active account."] })), jsx("div", Object.assign({ className: 'qr-code-modal-view__container' }, { children: jsx("div", Object.assign({ className: 'qr-code-modal-view__wrapper' }, { children: qrcodeUri ? (jsx(QRCode, { Icon: icon, accentColor: qrCodeColorsByTheme[typedTheme].accentColor, value: qrcodeUri, size: 175, logoSize: 40, walletKey: normalizeWalletName(walletKey) })) : (
                     // this div exists to give the parent a child, so that the parent
                     // takes on its given width and height. the result is stable
                     // rendering of this component, without this there is a brief flash

package/src/lib/widgets/DynamicWidget/prompts/UnlinkWalletPopUp/UnlinkWalletPopUp.cjs

@@ -21,6 +21,7 @@ require('../../../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
 require('../../../../shared/consts/index.cjs');
 require('@dynamic-labs/multi-wallet');
+require('../../../../config/ApiEndpoint.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../context/ThemeContext/ThemeContext.cjs');
 require('react-dom');
@@ -28,7 +29,6 @@ require('react-focus-lock');
 require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
@@ -53,7 +53,7 @@ require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
 
 const UnlinkWalletPopUp = ({ walletId }) => {
-    const { handleUnlinkWallet, eventsCallbacks, setSelectedWalletWithAction, user, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { handleUnlinkWallet, eventsCallbacks, setSelectedWalletWithAction, user, authMode, } = useInternalDynamicContext.useInternalDynamicContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
     const onConfirmClick = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
@@ -76,10 +76,10 @@ const UnlinkWalletPopUp = ({ walletId }) => {
     const onCancelClick = () => {
         setSelectedWalletWithAction(null);
     };
-    return (jsxRuntime.jsx(WidgetPortal.WidgetPortal, Object.assign({ onBackdropClick: onCancelClick }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'unlink-wallet-popup__container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'primary', className: 'unlink-wallet-popup__title', variant: 'body_normal', as: 'h6' }, { children: "Unlink your wallet?" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'unlink-wallet-popup__label', variant: 'body_small', color: 'secondary' }, { children: "Are you sure you want to unlink your wallet?" })), jsxRuntime.jsx(Button.Button, Object.assign({ buttonPadding: 'small', onClick: onConfirmClick, disabled: loading, buttonClassName: 'unlink-wallet-popup__button unlink-wallet-popup__button--shadow', color: 'primary', expanded: true, buttonRounded: 'small', typographyProps: {
+    return (jsxRuntime.jsx(WidgetPortal.WidgetPortal, Object.assign({ onBackdropClick: onCancelClick }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'unlink-wallet-popup__container' }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ color: 'primary', className: 'unlink-wallet-popup__title', variant: 'body_normal', as: 'h6' }, { children: [authMode === 'connect-only' ? 'Disconnect' : 'Unlink', " your wallet?"] })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ className: 'unlink-wallet-popup__label', variant: 'body_small', color: 'secondary' }, { children: ["Are you sure you want to", ' ', authMode === 'connect-only' ? 'disconnect' : 'unlink', " your wallet?"] })), jsxRuntime.jsxs(Button.Button, Object.assign({ buttonPadding: 'small', onClick: onConfirmClick, disabled: loading, buttonClassName: 'unlink-wallet-popup__button unlink-wallet-popup__button--shadow', color: 'primary', expanded: true, buttonRounded: 'small', typographyProps: {
                         variant: 'button_secondary',
                         weight: 'medium',
-                    }, dataTestId: 'unlink-wallet-popup-yes-button' }, { children: "Yes, unlink" })), jsxRuntime.jsx(Button.Button, Object.assign({ expanded: true, buttonPadding: 'small', onClick: onCancelClick, buttonVariant: 'secondary', buttonClassName: 'unlink-wallet-popup__button', buttonRounded: 'small', typographyProps: {
+                    }, dataTestId: 'unlink-wallet-popup-yes-button' }, { children: ["Yes, ", authMode === 'connect-only' ? 'disconnect' : 'unlink'] })), jsxRuntime.jsx(Button.Button, Object.assign({ expanded: true, buttonPadding: 'small', onClick: onCancelClick, buttonVariant: 'secondary', buttonClassName: 'unlink-wallet-popup__button', buttonRounded: 'small', typographyProps: {
                         variant: 'button_secondary',
                         weight: 'medium',
                     } }, { children: "No" }))] })) })));