@dynamic-labs/sdk-react-core 4.0.0-alpha.2 → 4.0.0-alpha.21

package/src/lib/utils/hooks/useWalletConnectors/utils/createLinkedWalletsFromWalletOptions/createLinkedWalletsFromWalletOptions.js

@@ -1,11 +1,12 @@
 'use client'
-import { WalletProviderEnum } from '@dynamic-labs/sdk-api-core';
+import { HardwareWalletEnum, WalletProviderEnum } from '@dynamic-labs/sdk-api-core';
+import { isHardwareWalletConnector } from '@dynamic-labs/wallet-connector-core';
 import { findWalletOptionFor } from '../../../../functions/findWalletOptionFor/findWalletOptionFor.js';
 import { shouldManuallyReconnectOnRefresh } from '../../../../functions/shouldManuallyReconnectOnRefresh/shouldManuallyReconnectOnRefresh.js';
 import { convertLegacyPhantomLedgerConnector } from '../convertLegacyPhantomLedgerConnector/convertLegacyPhantomLedgerConnector.js';
 import { isOwnerOfASmartWallet, initializeSmartWallet } from '../smartWallet/smartWallet.js';
 
-const createLinkedWalletsFromWalletOptions = ({ user, walletConnectorOptions, primaryWalletId, }) => {
+const createLinkedWalletsFromWalletOptions = ({ user, walletConnectorOptions, primaryWalletId, separateSmartWalletAndSigner, }) => {
     // wallet state should be null while loading all the wallets or when there is no user
     if (!walletConnectorOptions || !user) {
         return [];
@@ -13,7 +14,7 @@ const createLinkedWalletsFromWalletOptions = ({ user, walletConnectorOptions, pr
     return user.verifiedCredentials
         .map(convertLegacyPhantomLedger)
         .map((account) => {
-        var _a;
+        var _a, _b;
         const wallet = findWalletOptionFor(account, walletConnectorOptions);
         // this probably shouldn't happen. this would mean that the user has an account linked
         // with wallet W, but the customer has toggled off wallet W or the chain that
@@ -25,14 +26,22 @@ const createLinkedWalletsFromWalletOptions = ({ user, walletConnectorOptions, pr
             shouldManuallyReconnectOnRefresh(wallet.walletConnector)) {
             wallet.walletConnector.connect();
         }
+        // only checking for ledger hardware wallets since we only specify ledger as a hardware wallet
+        if (((_a = account.walletProperties) === null || _a === void 0 ? void 0 : _a.hardwareWallet) ===
+            HardwareWalletEnum.Ledger &&
+            isHardwareWalletConnector(wallet.walletConnector)) {
+            wallet.walletConnector.isHardwareWalletEnabled = true;
+        }
         // this account is the owner of a smart wallet, and should not be surfaced
-        if (isOwnerOfASmartWallet(account, user.verifiedCredentials)) {
+        if (!separateSmartWalletAndSigner &&
+            isOwnerOfASmartWallet(account, user.verifiedCredentials)) {
             return null;
         }
         if (account.address && account.chain) {
             if (account.walletProvider === WalletProviderEnum.SmartContractWallet) {
                 initializeSmartWallet({
                     account,
+                    primaryWalletId,
                     verifiedCredentials: user.verifiedCredentials,
                     walletConnectorOptions,
                 });
@@ -44,7 +53,7 @@ const createLinkedWalletsFromWalletOptions = ({ user, walletConnectorOptions, pr
                 connector: wallet.walletConnector,
                 id: account.id,
                 isAuthenticated: true,
-                key: (_a = account.walletName) !== null && _a !== void 0 ? _a : wallet.walletConnector.key,
+                key: (_b = account.walletName) !== null && _b !== void 0 ? _b : wallet.walletConnector.key,
             });
         }
         return null;

package/src/lib/utils/hooks/useWalletConnectors/utils/smartWallet/smartWallet.cjs

@@ -13,7 +13,7 @@ var findWalletOptionFor = require('../../../../functions/findWalletOptionFor/fin
 const findOwner = (account, verifiedCredentials) => verifiedCredentials.find((credential) => credential.id === account.signerRefId);
 const findSmartWallet = (account, verifiedCredentials) => verifiedCredentials.find((credential) => credential.signerRefId === account.id);
 const isOwnerOfASmartWallet = (account, verifiedCredentials) => Boolean(findSmartWallet(account, verifiedCredentials));
-const initializeSmartWallet = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ account, verifiedCredentials, walletConnectorOptions, }) {
+const initializeSmartWallet = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ account, verifiedCredentials, walletConnectorOptions, primaryWalletId, }) {
     var _b, _c;
     const owner = findOwner(account, verifiedCredentials);
     if (!owner) {
@@ -45,7 +45,16 @@ const initializeSmartWallet = (_a) => _tslib.__awaiter(void 0, [_a], void 0, fun
     if (!walletConnectorCore.isAccountAbstractionConnector(connector)) {
         throw new Error('could not initialize smart wallet');
     }
-    yield connector.setEoaConnector(ownerWallet.walletConnector);
+    if (!owner.address || !account.address) {
+        throw new Error('could not find owner or smart wallet address');
+    }
+    const shouldSetEoaConnector = primaryWalletId === owner.id || primaryWalletId === account.id;
+    yield connector.registerEoa({
+        eoaAddress: owner.address,
+        eoaConnector: ownerWallet.walletConnector,
+        shouldSetEoaConnector,
+        smartWalletAddress: account.address,
+    });
 });
 
 exports.findOwner = findOwner;

package/src/lib/utils/hooks/useWalletConnectors/utils/smartWallet/smartWallet.d.ts

@@ -3,8 +3,9 @@ import { WalletOption } from '../../../../../shared';
 export declare const findOwner: (account: JwtVerifiedCredential, verifiedCredentials: JwtVerifiedCredential[]) => JwtVerifiedCredential | undefined;
 export declare const findSmartWallet: (account: JwtVerifiedCredential, verifiedCredentials: JwtVerifiedCredential[]) => JwtVerifiedCredential | undefined;
 export declare const isOwnerOfASmartWallet: (account: JwtVerifiedCredential, verifiedCredentials: JwtVerifiedCredential[]) => boolean;
-export declare const initializeSmartWallet: ({ account, verifiedCredentials, walletConnectorOptions, }: {
+export declare const initializeSmartWallet: ({ account, verifiedCredentials, walletConnectorOptions, primaryWalletId, }: {
     account: JwtVerifiedCredential;
     verifiedCredentials: JwtVerifiedCredential[];
     walletConnectorOptions: WalletOption[];
+    primaryWalletId?: string;
 }) => Promise<void>;

package/src/lib/utils/hooks/useWalletConnectors/utils/smartWallet/smartWallet.js

@@ -9,7 +9,7 @@ import { findWalletOptionFor } from '../../../../functions/findWalletOptionFor/f
 const findOwner = (account, verifiedCredentials) => verifiedCredentials.find((credential) => credential.id === account.signerRefId);
 const findSmartWallet = (account, verifiedCredentials) => verifiedCredentials.find((credential) => credential.signerRefId === account.id);
 const isOwnerOfASmartWallet = (account, verifiedCredentials) => Boolean(findSmartWallet(account, verifiedCredentials));
-const initializeSmartWallet = (_a) => __awaiter(void 0, [_a], void 0, function* ({ account, verifiedCredentials, walletConnectorOptions, }) {
+const initializeSmartWallet = (_a) => __awaiter(void 0, [_a], void 0, function* ({ account, verifiedCredentials, walletConnectorOptions, primaryWalletId, }) {
     var _b, _c;
     const owner = findOwner(account, verifiedCredentials);
     if (!owner) {
@@ -41,7 +41,16 @@ const initializeSmartWallet = (_a) => __awaiter(void 0, [_a], void 0, function*
     if (!isAccountAbstractionConnector(connector)) {
         throw new Error('could not initialize smart wallet');
     }
-    yield connector.setEoaConnector(ownerWallet.walletConnector);
+    if (!owner.address || !account.address) {
+        throw new Error('could not find owner or smart wallet address');
+    }
+    const shouldSetEoaConnector = primaryWalletId === owner.id || primaryWalletId === account.id;
+    yield connector.registerEoa({
+        eoaAddress: owner.address,
+        eoaConnector: ownerWallet.walletConnector,
+        shouldSetEoaConnector,
+        smartWalletAddress: account.address,
+    });
 });
 
 export { findOwner, findSmartWallet, initializeSmartWallet, isOwnerOfASmartWallet };

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

@@ -22,13 +22,6 @@ var useWalletConnectorEvent = require('../events/useWalletConnectorEvent/useWall
 var dynamicEvents = require('../../../events/dynamicEvents.cjs');
 
 const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet, multiWalletWidgetState, primaryWallet, secondaryWallets, selectedWalletConnector, selectedWalletWithAction, setSelectedWalletConnectorKey, setSelectedWalletWithAction, setMultiWalletWidgetState, user, setPrimaryWalletId, authMode, refreshConnectedWallet, detectNewWalletsForLinking, }) => {
-    useWalletConnectorEvent.useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'chainChange', ({ chain }) => {
-        logger.logger.debug('primary wallet chain change', { chain });
-        if (!primaryWallet) {
-            return;
-        }
-        refreshConnectedWallet(primaryWallet.id, primaryWallet.connector);
-    });
     const handleAccountChangeWhenAwaitingAccountSwitch = React.useCallback((isPrimaryWallet, newAddress) => {
         logger.logger.debug('handleAccountChangeWhenAwaitingAccountSwitch', {
             isPrimaryWallet,
@@ -149,13 +142,6 @@ const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet,
             handleAccountChangeWhenAwaitingAccountSwitch(false, (selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.address) || '');
         }
     }));
-    useWalletConnectorEvent.useWalletConnectorEvent(uniqueNonPrimaryWallets, 'chainChange', (_, changedConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        logger.logger.debug('secondary wallet chain change');
-        // Get all wallets with this connector
-        const affectedWallets = secondaryWallets.filter(({ connector }) => connector.key === changedConnector.key);
-        for (const wallet of affectedWallets)
-            refreshConnectedWallet(wallet.id, wallet.connector);
-    }));
     useWalletConnectorEvent.useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'disconnect', () => {
         logger.logger.debug('primary wallet disconnect');
         if (authMode === 'connect-only') {

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

@@ -18,13 +18,6 @@ import { useWalletConnectorEvent } from '../events/useWalletConnectorEvent/useWa
 import { dynamicEvents } from '../../../events/dynamicEvents.js';
 
 const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet, multiWalletWidgetState, primaryWallet, secondaryWallets, selectedWalletConnector, selectedWalletWithAction, setSelectedWalletConnectorKey, setSelectedWalletWithAction, setMultiWalletWidgetState, user, setPrimaryWalletId, authMode, refreshConnectedWallet, detectNewWalletsForLinking, }) => {
-    useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'chainChange', ({ chain }) => {
-        logger.debug('primary wallet chain change', { chain });
-        if (!primaryWallet) {
-            return;
-        }
-        refreshConnectedWallet(primaryWallet.id, primaryWallet.connector);
-    });
     const handleAccountChangeWhenAwaitingAccountSwitch = useCallback((isPrimaryWallet, newAddress) => {
         logger.debug('handleAccountChangeWhenAwaitingAccountSwitch', {
             isPrimaryWallet,
@@ -145,13 +138,6 @@ const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet,
             handleAccountChangeWhenAwaitingAccountSwitch(false, (selectedWalletWithAction === null || selectedWalletWithAction === void 0 ? void 0 : selectedWalletWithAction.wallet.address) || '');
         }
     }));
-    useWalletConnectorEvent(uniqueNonPrimaryWallets, 'chainChange', (_, changedConnector) => __awaiter(void 0, void 0, void 0, function* () {
-        logger.debug('secondary wallet chain change');
-        // Get all wallets with this connector
-        const affectedWallets = secondaryWallets.filter(({ connector }) => connector.key === changedConnector.key);
-        for (const wallet of affectedWallets)
-            refreshConnectedWallet(wallet.id, wallet.connector);
-    }));
     useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'disconnect', () => {
         logger.debug('primary wallet disconnect');
         if (authMode === 'connect-only') {

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

@@ -72,28 +72,19 @@ require('qrcode');
 require('formik');
 require('../../../context/FooterAnimationContext/index.cjs');
 require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
-require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../store/state/sendBalances.cjs');
 require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
-require('../../../../polyfills.cjs');
-require('../../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
-require('../../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
-require('../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
-require('../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.cjs');
-require('../../../context/WidgetRegistry/WidgetRegistryContextProvider.cjs');
-require('../../../context/FundingContext/FundingContext.cjs');
-require('../../../context/SendBalanceContext/SendBalanceContext.cjs');
-require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
-require('../../../context/ConnectWithOtpContext/constants.cjs');
-require('../../../context/ReinitializeContext/ReinitializeContextProvider.cjs');
+require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 
 const useWalletItemActions = () => {
@@ -140,12 +131,22 @@ const useWalletItemActions = () => {
                 verificationType: 'awaiting_verification',
             });
         }
-        onlyConnectUser({ walletConnector });
+        const attemptConnection = () => {
+            onlyConnectUser({ shouldShowPendingConnectView: false, walletConnector });
+        };
+        setView('mobile-wallet-redirect-view', { onRetry: attemptConnection });
+        attemptConnection();
     });
     const handleInstalledExtensionClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         logger.logger.debug('handleInstalledExtensionClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
-        setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
+        if (authMode === 'connect-only') {
+            setView('pending-connect');
+            onlyConnectUser({ walletConnector });
+        }
+        else {
+            setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
+        }
     });
     const handleUninstalledClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         logger.logger.debug('handleUninstalledClick', walletConnector);
@@ -218,9 +219,13 @@ const useWalletItemActions = () => {
             yield walletConnector.endSession();
         }
         setLegacyIsVerifying(false);
+        const isMetamask = walletConnector.key === 'metamask';
         // in connect only we only allow one account to be connected in the same wallet
-        if (authMode !== 'connect-only') {
+        // also this is only a feature in MM
+        if (authMode !== 'connect-only' && isMetamask) {
             try {
+                setSelectedWalletConnectorKey(walletConnector.key);
+                setView('pending-connect');
                 yield walletConnector.chooseAccountsToConnect();
             }
             catch (error) {

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

@@ -68,28 +68,19 @@ import 'qrcode';
 import 'formik';
 import '../../../context/FooterAnimationContext/index.js';
 import '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
-import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../store/state/sendBalances.js';
 import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import '../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
-import '../../../../polyfills.js';
-import '../../../context/ErrorBoundary/ErrorBoundaryBase.js';
-import '../../../context/ErrorBoundary/ErrorBoundaryContext.js';
-import '../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
-import '../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.js';
-import '../../../context/WidgetRegistry/WidgetRegistryContextProvider.js';
-import '../../../context/FundingContext/FundingContext.js';
-import '../../../context/SendBalanceContext/SendBalanceContext.js';
-import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
-import '../../../context/ConnectWithOtpContext/constants.js';
-import '../../../context/ReinitializeContext/ReinitializeContextProvider.js';
+import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
 
 const useWalletItemActions = () => {
@@ -136,12 +127,22 @@ const useWalletItemActions = () => {
                 verificationType: 'awaiting_verification',
             });
         }
-        onlyConnectUser({ walletConnector });
+        const attemptConnection = () => {
+            onlyConnectUser({ shouldShowPendingConnectView: false, walletConnector });
+        };
+        setView('mobile-wallet-redirect-view', { onRetry: attemptConnection });
+        attemptConnection();
     });
     const handleInstalledExtensionClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
         logger.debug('handleInstalledExtensionClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
-        setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
+        if (authMode === 'connect-only') {
+            setView('pending-connect');
+            onlyConnectUser({ walletConnector });
+        }
+        else {
+            setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
+        }
     });
     const handleUninstalledClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
         logger.debug('handleUninstalledClick', walletConnector);
@@ -214,9 +215,13 @@ const useWalletItemActions = () => {
             yield walletConnector.endSession();
         }
         setLegacyIsVerifying(false);
+        const isMetamask = walletConnector.key === 'metamask';
         // in connect only we only allow one account to be connected in the same wallet
-        if (authMode !== 'connect-only') {
+        // also this is only a feature in MM
+        if (authMode !== 'connect-only' && isMetamask) {
             try {
+                setSelectedWalletConnectorKey(walletConnector.key);
+                setView('pending-connect');
                 yield walletConnector.chooseAccountsToConnect();
             }
             catch (error) {

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

@@ -70,28 +70,19 @@ require('formik');
 var groupWalletOptions = require('../../functions/walletListBuilder/utils/groupWalletOptions/groupWalletOptions.cjs');
 require('../../../context/FooterAnimationContext/index.cjs');
 var WalletGroupContext = require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
-require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../store/state/sendBalances.cjs');
 require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
-require('../../../../polyfills.cjs');
-require('../../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
-require('../../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
-require('../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
-require('../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.cjs');
-require('../../../context/WidgetRegistry/WidgetRegistryContextProvider.cjs');
-require('../../../context/FundingContext/FundingContext.cjs');
-require('../../../context/SendBalanceContext/SendBalanceContext.cjs');
-require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
-require('../../../context/ConnectWithOtpContext/constants.cjs');
-require('../../../context/ReinitializeContext/ReinitializeContextProvider.cjs');
+require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 
 const embeddedWalletsKeys = [
@@ -118,6 +109,7 @@ const useWalletOptions = () => {
             return {
                 group: option.group,
                 groupName,
+                isInstalledOnBrowser: option.isInstalledOnBrowser,
                 key: option.walletConnector.key,
                 name: option.name,
             };

package/src/lib/utils/hooks/useWalletOptions/useWalletOptions.d.ts

@@ -3,6 +3,7 @@ export declare const useWalletOptions: () => {
     walletOptions: {
         group: string | undefined;
         groupName: string | undefined;
+        isInstalledOnBrowser: boolean;
         key: string;
         name: string;
     }[];

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

@@ -66,28 +66,19 @@ import 'formik';
 import { groupWalletOptions } from '../../functions/walletListBuilder/utils/groupWalletOptions/groupWalletOptions.js';
 import '../../../context/FooterAnimationContext/index.js';
 import { useWalletGroupContext } from '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
-import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../store/state/sendBalances.js';
 import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import '../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
-import '../../../../polyfills.js';
-import '../../../context/ErrorBoundary/ErrorBoundaryBase.js';
-import '../../../context/ErrorBoundary/ErrorBoundaryContext.js';
-import '../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
-import '../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.js';
-import '../../../context/WidgetRegistry/WidgetRegistryContextProvider.js';
-import '../../../context/FundingContext/FundingContext.js';
-import '../../../context/SendBalanceContext/SendBalanceContext.js';
-import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
-import '../../../context/ConnectWithOtpContext/constants.js';
-import '../../../context/ReinitializeContext/ReinitializeContextProvider.js';
+import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
 
 const embeddedWalletsKeys = [
@@ -114,6 +105,7 @@ const useWalletOptions = () => {
             return {
                 group: option.group,
                 groupName,
+                isInstalledOnBrowser: option.isInstalledOnBrowser,
                 key: option.walletConnector.key,
                 name: option.name,
             };

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

@@ -51,6 +51,7 @@ require('../../../store/state/environmentId.cjs');
 require('../../../store/state/walletConnectorOptions.cjs');
 require('../../../store/state/tokenBalances.cjs');
 require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 require('react-dom');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');
@@ -69,11 +70,11 @@ require('react-focus-lock');
 require('qrcode');
 require('formik');
 require('../../../context/FooterAnimationContext/index.cjs');
+require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
-require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../store/state/sendBalances.cjs');
 var CreatePasswordModal = require('../../../modals/CreatePasswordModal/CreatePasswordModal.cjs');
@@ -84,6 +85,7 @@ var EnterPasswordModal = require('../../../modals/EnterPasswordModal/EnterPasswo
 var SignMessageConfirmationModal = require('../../../modals/SignMessageConfirmationModal/SignMessageConfirmationModal.cjs');
 var SyncWalletPromptModal = require('../../../modals/SyncWalletPromptModal/SyncWalletPromptModal.cjs');
 var TransactionConfirmationModal = require('../../../modals/TransactionConfirmationModal/TransactionConfirmationModal.cjs');
+var AddNetworkModal = require('../../../modals/AddNetworkModal/AddNetworkModal.cjs');
 
 const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUIs = false, }) => {
     const confirmationStateRef = React.useRef('enabled');
@@ -103,6 +105,9 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
     const { modal: syncWalletPromptModal, open: openSyncWalletPrompt } = useConfirmationModal.useConfirmationModal({
         elementId: 'dynamic-sync-wallet',
     });
+    const { modal: addNetworkModal, open: openAddNetwork } = useConfirmationModal.useConfirmationModal({
+        elementId: 'dynamic-prompt-to-add-network',
+    });
     const shouldConfirmAction = React.useCallback(() => {
         if (confirmationStateRef.current === 'disabled') {
             confirmationStateRef.current = 'enabled';
@@ -154,10 +159,14 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
     const syncWallet = React.useCallback((_d) => _tslib.__awaiter(void 0, [_d], void 0, function* ({ walletConnector, activeAddress, expectedAddress }) {
         yield openSyncWalletPrompt((resolve, reject) => (jsxRuntime.jsx(SyncWalletPromptModal.SyncWalletPromptModal, { onResolve: resolve, onReject: reject, connector: walletConnector, expectedAddress: expectedAddress, activeAddress: activeAddress })));
     }), [openSyncWalletPrompt]);
+    const addNetwork = React.useCallback((_e) => _tslib.__awaiter(void 0, [_e], void 0, function* ({ handler, network, walletKey }) {
+        yield openAddNetwork((resolve) => (jsxRuntime.jsx(AddNetworkModal.AddNetworkModal, { network: network, walletKey: walletKey, onCancel: resolve, onNetworkAdded: resolve, addNetworkMutation: handler })));
+    }), [openAddNetwork]);
     const disabledConfirmationOnce = React.useCallback(() => {
         confirmationStateRef.current = 'disabled';
     }, []);
     const walletUiUtils = React.useMemo(() => ({
+        addNetwork,
         createPassword,
         disabledConfirmationOnce,
         enterPassword,
@@ -171,13 +180,15 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         enterPassword,
         createPassword,
         syncWallet,
+        addNetwork,
     ]);
     return React.useMemo(() => [
         signMessageModal ||
             sendTransactionModal ||
             enterPasswordModal ||
             createPasswordModal ||
-            syncWalletPromptModal,
+            syncWalletPromptModal ||
+            addNetworkModal,
         walletUiUtils,
     ], [
         signMessageModal,
@@ -185,6 +196,7 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         enterPasswordModal,
         createPasswordModal,
         syncWalletPromptModal,
+        addNetworkModal,
         walletUiUtils,
     ]);
 };

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

@@ -47,6 +47,7 @@ import '../../../store/state/environmentId.js';
 import '../../../store/state/walletConnectorOptions.js';
 import '../../../store/state/tokenBalances.js';
 import '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import 'react-dom';
 import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../components/IconButton/IconButton.js';
@@ -65,11 +66,11 @@ import 'react-focus-lock';
 import 'qrcode';
 import 'formik';
 import '../../../context/FooterAnimationContext/index.js';
+import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
-import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../store/state/sendBalances.js';
 import { CreatePasswordModal } from '../../../modals/CreatePasswordModal/CreatePasswordModal.js';
@@ -80,6 +81,7 @@ import { EnterPasswordModal } from '../../../modals/EnterPasswordModal/EnterPass
 import { SignMessageConfirmationModal } from '../../../modals/SignMessageConfirmationModal/SignMessageConfirmationModal.js';
 import { SyncWalletPromptModal } from '../../../modals/SyncWalletPromptModal/SyncWalletPromptModal.js';
 import { TransactionConfirmationModal } from '../../../modals/TransactionConfirmationModal/TransactionConfirmationModal.js';
+import { AddNetworkModal } from '../../../modals/AddNetworkModal/AddNetworkModal.js';
 
 const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUIs = false, }) => {
     const confirmationStateRef = useRef('enabled');
@@ -99,6 +101,9 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
     const { modal: syncWalletPromptModal, open: openSyncWalletPrompt } = useConfirmationModal({
         elementId: 'dynamic-sync-wallet',
     });
+    const { modal: addNetworkModal, open: openAddNetwork } = useConfirmationModal({
+        elementId: 'dynamic-prompt-to-add-network',
+    });
     const shouldConfirmAction = useCallback(() => {
         if (confirmationStateRef.current === 'disabled') {
             confirmationStateRef.current = 'enabled';
@@ -150,10 +155,14 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
     const syncWallet = useCallback((_d) => __awaiter(void 0, [_d], void 0, function* ({ walletConnector, activeAddress, expectedAddress }) {
         yield openSyncWalletPrompt((resolve, reject) => (jsx(SyncWalletPromptModal, { onResolve: resolve, onReject: reject, connector: walletConnector, expectedAddress: expectedAddress, activeAddress: activeAddress })));
     }), [openSyncWalletPrompt]);
+    const addNetwork = useCallback((_e) => __awaiter(void 0, [_e], void 0, function* ({ handler, network, walletKey }) {
+        yield openAddNetwork((resolve) => (jsx(AddNetworkModal, { network: network, walletKey: walletKey, onCancel: resolve, onNetworkAdded: resolve, addNetworkMutation: handler })));
+    }), [openAddNetwork]);
     const disabledConfirmationOnce = useCallback(() => {
         confirmationStateRef.current = 'disabled';
     }, []);
     const walletUiUtils = useMemo(() => ({
+        addNetwork,
         createPassword,
         disabledConfirmationOnce,
         enterPassword,
@@ -167,13 +176,15 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         enterPassword,
         createPassword,
         syncWallet,
+        addNetwork,
     ]);
     return useMemo(() => [
         signMessageModal ||
             sendTransactionModal ||
             enterPasswordModal ||
             createPasswordModal ||
-            syncWalletPromptModal,
+            syncWalletPromptModal ||
+            addNetworkModal,
         walletUiUtils,
     ], [
         signMessageModal,
@@ -181,6 +192,7 @@ const useWalletUiUtils = ({ appLogoUrl, appName, hideEmbeddedWalletTransactionUI
         enterPasswordModal,
         createPasswordModal,
         syncWalletPromptModal,
+        addNetworkModal,
         walletUiUtils,
     ]);
 };

package/src/lib/views/AccessBlockedView/AccessBlockedView.cjs

@@ -71,26 +71,17 @@ require('../../components/Input/Input.cjs');
 require('../TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
-require('../../../polyfills.cjs');
-require('../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
-require('../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
-require('../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
-require('../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.cjs');
-require('../../components/IsBrowser/IsBrowser.cjs');
-require('../../context/WidgetRegistry/WidgetRegistryContextProvider.cjs');
-require('../../context/FundingContext/FundingContext.cjs');
-require('../../components/Popper/Popper/Popper.cjs');
-require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('../../../index.cjs');
+var IpConfigurationContext = require('../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
-var IpConfigurationContext = require('../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
-require('../../context/SendBalanceContext/SendBalanceContext.cjs');
-require('../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
-require('../../context/ConnectWithOtpContext/constants.cjs');
-require('../../context/ReinitializeContext/ReinitializeContextProvider.cjs');
 require('../../store/state/tokenBalances.cjs');
+require('../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/IsBrowser/IsBrowser.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('qrcode');
 
 const AccessBlockedView = () => {