@web3auth/no-modal 10.7.0 → 10.8.1

package/dist/lib.cjs/base/utils.js

@@ -145,7 +145,7 @@ const getWalletServicesAnalyticsProperties = walletServicesConfig => {
     ws_default_portfolio: walletServicesConfig === null || walletServicesConfig === void 0 || (_walletServicesConfig1 = walletServicesConfig.whiteLabel) === null || _walletServicesConfig1 === void 0 ? void 0 : _walletServicesConfig1.defaultPortfolio
   };
 };
-const sdkVersion = "10.7.0";
+const sdkVersion = "10.8.1";
 const getErrorAnalyticsProperties = error => {
   try {
     const code = error instanceof index.Web3AuthError ? error.code : error === null || error === void 0 ? void 0 : error.code;

package/dist/lib.cjs/connectors/coinbase-connector/coinbaseConnector.js

@@ -147,12 +147,37 @@ class CoinbaseConnector extends baseEvmConnector.BaseEvmConnector {
   }
   async switchChain(params, init = false) {
     super.checkSwitchChainRequirements(params, init);
-    await this.coinbaseProvider.request({
-      method: "wallet_switchEthereumChain",
-      params: [{
-        chainId: params.chainId
-      }]
-    });
+    try {
+      await this.coinbaseProvider.request({
+        method: "wallet_switchEthereumChain",
+        params: [{
+          chainId: params.chainId
+        }]
+      });
+    } catch (switchError) {
+      // 4902 indicates that the client does not recognize the Harmony One network
+      if (switchError.code === 4902) {
+        const chainConfig = this.coreOptions.chains.find(x => x.chainId === params.chainId);
+        if (!chainConfig) throw index$1.WalletLoginError.connectionError("Chain config is not available");
+        await this.coinbaseProvider.request({
+          method: "wallet_addEthereumChain",
+          params: [{
+            chainId: chainConfig.chainId,
+            rpcUrls: [chainConfig.rpcTarget],
+            chainName: chainConfig.displayName,
+            nativeCurrency: {
+              name: chainConfig.tickerName,
+              symbol: chainConfig.ticker,
+              decimals: chainConfig.decimals || 18
+            },
+            blockExplorerUrls: [chainConfig.blockExplorerUrl],
+            iconUrls: [chainConfig.logo]
+          }]
+        });
+        return;
+      }
+      throw switchError;
+    }
   }
   async enableMFA() {
     throw new Error("Method Not implemented");

package/dist/lib.cjs/react/context/Web3AuthInnerContext.js

@@ -30,6 +30,8 @@ function Web3AuthInnerProvider(params) {
     setProvider(null);
     return new noModal.Web3AuthNoModal(web3AuthOptions, initialState);
   }, [web3AuthOptions, initialState]);
+  const [chainId, setChainId] = react.useState(null);
+  const [chainNamespace, setChainNamespace] = react.useState(null);
   const [isInitializing, setIsInitializing] = react.useState(false);
   const [initError, setInitError] = react.useState(null);
   const [isConnected, setIsConnected] = react.useState(false);
@@ -45,6 +47,7 @@ function Web3AuthInnerProvider(params) {
     const controller = new AbortController();
     async function init() {
       try {
+        var _web3Auth$currentChai;
         setInitError(null);
         setIsInitializing(true);
         web3Auth.setAnalyticsProperties({
@@ -53,6 +56,8 @@ function Web3AuthInnerProvider(params) {
         await web3Auth.init({
           signal: controller.signal
         });
+        setChainId(web3Auth.currentChainId);
+        setChainNamespace((_web3Auth$currentChai = web3Auth.currentChain) === null || _web3Auth$currentChai === void 0 ? void 0 : _web3Auth$currentChai.chainNamespace);
       } catch (error) {
         setInitError(error);
       } finally {
@@ -64,6 +69,19 @@ function Web3AuthInnerProvider(params) {
       controller.abort();
     };
   }, [web3Auth]);
+  react.useEffect(() => {
+    const handleChainChange = async chainId => {
+      var _web3Auth$currentChai2;
+      setChainId(chainId);
+      setChainNamespace(web3Auth === null || web3Auth === void 0 || (_web3Auth$currentChai2 = web3Auth.currentChain) === null || _web3Auth$currentChai2 === void 0 ? void 0 : _web3Auth$currentChai2.chainNamespace);
+    };
+    if (provider) {
+      provider.on("chainChanged", handleChainChange);
+      return () => {
+        provider.off("chainChanged", handleChainChange);
+      };
+    }
+  }, [web3Auth, provider]);
   react.useEffect(() => {
     const notReadyListener = () => setStatus(constants.CONNECTOR_STATUS.NOT_READY);
     const readyListener = () => {
@@ -133,10 +151,12 @@ function Web3AuthInnerProvider(params) {
       isInitializing,
       initError,
       isMFAEnabled,
+      chainId,
+      chainNamespace,
       getPlugin,
       setIsMFAEnabled
     };
-  }, [web3Auth, isConnected, isInitialized, provider, status, getPlugin, isInitializing, initError, isMFAEnabled, setIsMFAEnabled]);
+  }, [web3Auth, isConnected, isInitialized, provider, status, getPlugin, isInitializing, initError, isMFAEnabled, setIsMFAEnabled, chainId, chainNamespace]);
   return react.createElement(Web3AuthInnerContext.Provider, {
     value
   }, children);

package/dist/lib.cjs/react/hooks/useChain.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var useWeb3AuthInner = require('./useWeb3AuthInner.js');
+
+const useChain = () => {
+  const {
+    chainId,
+    chainNamespace
+  } = useWeb3AuthInner.useWeb3AuthInner();
+  return {
+    chainId,
+    chainNamespace
+  };
+};
+
+exports.useChain = useChain;

package/dist/lib.cjs/react/index.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var useChain = require('./hooks/useChain.js');
 var useCheckout = require('./hooks/useCheckout.js');
 var useEnableMFA = require('./hooks/useEnableMFA.js');
 var useFunding = require('./hooks/useFunding.js');
@@ -19,6 +20,7 @@ var Web3AuthProvider = require('./Web3AuthProvider.js');
 
 
 
+exports.useChain = useChain.useChain;
 exports.useCheckout = useCheckout.useCheckout;
 exports.useEnableMFA = useEnableMFA.useEnableMFA;
 exports.useFunding = useFunding.useFunding;

package/dist/lib.cjs/react/solana/hooks/useSolanaWallet.js

@@ -23,6 +23,9 @@ require('../../../providers/base-provider/CommonJRPCProvider.js');
 require('../../../providers/base-provider/commonPrivateKeyProvider.js');
 require('@web3auth/ws-embed');
 var solanaWallet = require('../../../providers/solana-provider/solanaWallet.js');
+var useChain = require('../../hooks/useChain.js');
+require('../../context/WalletServicesInnerContext.js');
+require('../../context/Web3AuthInnerContext.js');
 var useWeb3Auth = require('../../hooks/useWeb3Auth.js');
 
 const useSolanaWallet = () => {
@@ -30,29 +33,33 @@ const useSolanaWallet = () => {
     provider,
     web3Auth
   } = useWeb3Auth.useWeb3Auth();
+  const {
+    chainNamespace
+  } = useChain.useChain();
   const [accounts, setAccounts] = react.useState(null);
   const solanaWallet$1 = react.useMemo(() => {
     if (!provider) return null;
+    if (chainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) return null;
     return new solanaWallet.SolanaWallet(provider);
-  }, [provider]);
+  }, [provider, chainNamespace]);
   const connection = react.useMemo(() => {
-    if (!web3Auth || !provider) return null;
+    if (!web3Auth || !provider || chainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) return null;
     return new web3_js.Connection(web3Auth.currentChain.rpcTarget);
-  }, [web3Auth, provider]);
+  }, [web3Auth, provider, chainNamespace]);
   react.useEffect(() => {
     const init = async () => {
-      var _web3Auth$currentChai;
-      if (!solanaWallet$1) return;
-      if (!(web3Auth !== null && web3Auth !== void 0 && (_web3Auth$currentChai = web3Auth.currentChain) !== null && _web3Auth$currentChai !== void 0 && _web3Auth$currentChai.chainNamespace) || web3Auth.currentChain.chainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) {
+      if (chainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) {
+        setAccounts(null);
         return;
       }
+      if (!solanaWallet$1) return;
       const accounts = await solanaWallet$1.getAccounts();
       if ((accounts === null || accounts === void 0 ? void 0 : accounts.length) > 0) {
         setAccounts(accounts);
       }
     };
     if (solanaWallet$1) init();
-  }, [solanaWallet$1]);
+  }, [solanaWallet$1, chainNamespace]);
   return {
     solanaWallet: solanaWallet$1,
     accounts,

package/dist/lib.cjs/react/wagmi/provider.js

@@ -19,18 +19,21 @@ require('../../base/plugin/errors.js');
 require('../../base/plugin/IPlugin.js');
 require('@toruslabs/constants');
 require('@toruslabs/http-helpers');
-require('../context/WalletServicesInnerContext.js');
 require('../context/Web3AuthInnerContext.js');
+require('../context/WalletServicesInnerContext.js');
 var useWeb3Auth = require('../hooks/useWeb3Auth.js');
 var useWeb3AuthDisconnect = require('../hooks/useWeb3AuthDisconnect.js');
 var constants = require('./constants.js');
 
 const _excluded = ["children"];
 const WEB3AUTH_CONNECTOR_ID = "web3auth";
+function getWeb3authConnector(config) {
+  return config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+}
 // Helper to initialize connectors for the given wallets
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 async function setupConnector(provider, config) {
-  let connector = config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+  let connector = getWeb3authConnector(config);
   if (connector) return connector;
   // Create new connector if not already existing
   connector = connectors.injected({
@@ -65,8 +68,15 @@ async function connectWeb3AuthWithWagmi(connector, config) {
     status: "connected"
   }));
 }
-async function disconnectWeb3AuthFromWagmi(config) {
+function resetConnectorState(config) {
   config._internal.connectors.setState(prev => prev.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID));
+  config.connectors.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID);
+}
+async function disconnectWeb3AuthFromWagmi(config) {
+  var _config$storage3, _config$storage4;
+  const connector = getWeb3authConnector(config);
+  await Promise.all([(_config$storage3 = config.storage) === null || _config$storage3 === void 0 ? void 0 : _config$storage3.setItem(`${connector === null || connector === void 0 ? void 0 : connector.id}.disconnected`, true), (_config$storage4 = config.storage) === null || _config$storage4 === void 0 ? void 0 : _config$storage4.removeItem("injected.connected")]);
+  resetConnectorState(config);
   config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
     chainId: state.chainId,
     connections: new Map(),
@@ -92,6 +102,12 @@ function Web3AuthWagmiProvider({
     onDisconnect: async () => {
       loglevel.log.info("Disconnected from wagmi");
       if (isConnected) await disconnect();
+      const connector = getWeb3authConnector(wagmiConfig);
+      // reset wagmi connector state if the provider handles disconnection because of the accountsChanged event
+      // from the connected provider
+      if (connector) {
+        resetConnectorState(wagmiConfig);
+      }
     }
   });
   react.useEffect(() => {
@@ -192,7 +208,6 @@ function WagmiProvider(_ref) {
       });
       finalConfig.chains = [wagmiChains[0], ...wagmiChains.slice(1)];
     }
-    if (!finalConfig.chains) return;
     return wagmi.createConfig(finalConfig);
   }, [config, web3Auth, isInitialized]);
   return react.createElement(wagmi.WagmiProvider, // typecast to WagmiProviderPropsBase to avoid type error

package/dist/lib.cjs/types/base/hooks/index.d.ts

@@ -1,6 +1,9 @@
+import type { ChainNamespaceType } from "../chain/IChainInterface";
 import { CONNECTOR_STATUS_TYPE, IProvider } from "../connector";
 import { IPlugin } from "../plugin";
 export interface IBaseWeb3AuthHookContext {
+    chainId: string | null;
+    chainNamespace: ChainNamespaceType | null;
     isInitialized: boolean;
     isInitializing: boolean;
     initError: unknown;

package/dist/lib.cjs/types/react/hooks/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./useChain";
 export * from "./useCheckout";
 export * from "./useEnableMFA";
 export * from "./useFunding";

package/dist/lib.cjs/types/react/hooks/useChain.d.ts

@@ -0,0 +1,6 @@
+import { ChainNamespaceType } from "../../base";
+export type IUseChain = {
+    chainId: string | null;
+    chainNamespace: ChainNamespaceType | null;
+};
+export declare const useChain: () => IUseChain;

package/dist/lib.cjs/types/react/hooks/useWeb3Auth.d.ts

@@ -1,3 +1,3 @@
 import { IWeb3AuthInnerContext } from "../interfaces";
-export type IUseWeb3Auth = Omit<IWeb3AuthInnerContext, "isMFAEnabled" | "setIsMFAEnabled">;
+export type IUseWeb3Auth = Omit<IWeb3AuthInnerContext, "isMFAEnabled" | "setIsMFAEnabled" | "chainId" | "chainNamespace">;
 export declare const useWeb3Auth: () => IUseWeb3Auth;

package/dist/lib.cjs/types/vue/composables/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./useChain";
 export * from "./useCheckout";
 export * from "./useEnableMFA";
 export * from "./useFunding";

package/dist/lib.cjs/types/vue/composables/useChain.d.ts

@@ -0,0 +1,7 @@
+import { ComputedRef } from "vue";
+import { ChainNamespaceType } from "../../base";
+export type IUseChain = {
+    chainId: ComputedRef<string | null>;
+    chainNamespace: ComputedRef<ChainNamespaceType | null>;
+};
+export declare const useChain: () => IUseChain;

package/dist/lib.cjs/vue/composables/useChain.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var vue = require('vue');
+var useWeb3AuthInner = require('./useWeb3AuthInner.js');
+
+const useChain = () => {
+  const context = useWeb3AuthInner.useWeb3AuthInner();
+  const chainId = vue.computed(() => {
+    var _context$web3Auth$val;
+    if (!((_context$web3Auth$val = context.web3Auth.value) !== null && _context$web3Auth$val !== void 0 && _context$web3Auth$val.currentChain)) return null;
+    return context.web3Auth.value.currentChain.chainId;
+  });
+  const chainNamespace = vue.computed(() => {
+    var _context$web3Auth$val2;
+    if (!((_context$web3Auth$val2 = context.web3Auth.value) !== null && _context$web3Auth$val2 !== void 0 && _context$web3Auth$val2.currentChain)) return null;
+    return context.web3Auth.value.currentChain.chainNamespace;
+  });
+  return {
+    chainId,
+    chainNamespace
+  };
+};
+
+exports.useChain = useChain;

package/dist/lib.cjs/vue/index.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var useChain = require('./composables/useChain.js');
 var useCheckout = require('./composables/useCheckout.js');
 var useEnableMFA = require('./composables/useEnableMFA.js');
 var useFunding = require('./composables/useFunding.js');
@@ -20,6 +21,7 @@ var Web3AuthProvider = require('./Web3AuthProvider.js');
 
 
 
+exports.useChain = useChain.useChain;
 exports.useCheckout = useCheckout.useCheckout;
 exports.useEnableMFA = useEnableMFA.useEnableMFA;
 exports.useFunding = useFunding.useFunding;

package/dist/lib.cjs/vue/solana/composables/useSolanaWallet.js

@@ -4,6 +4,7 @@ var web3_js = require('@solana/web3.js');
 var vue = require('vue');
 var baseControllers = require('@toruslabs/base-controllers');
 var solanaWallet = require('../../../providers/solana-provider/solanaWallet.js');
+var useChain = require('../../composables/useChain.js');
 require('@babel/runtime/helpers/objectSpread2');
 require('@babel/runtime/helpers/defineProperty');
 require('@segment/analytics-next');
@@ -24,12 +25,19 @@ const useSolanaWallet = () => {
     provider,
     web3Auth
   } = useWeb3Auth.useWeb3Auth();
+  const {
+    chainNamespace
+  } = useChain.useChain();
   const accounts = vue.ref([]);
   const solanaWallet$1 = vue.shallowRef(null);
   const connection = vue.shallowRef(null);
+  const isSolana = vue.computed(() => chainNamespace.value === baseControllers.CHAIN_NAMESPACES.SOLANA);
   const setupWallet = async () => {
-    var _web3Auth$value, _web3Auth$value2;
-    if (!((_web3Auth$value = web3Auth.value) !== null && _web3Auth$value !== void 0 && (_web3Auth$value = _web3Auth$value.currentChain) !== null && _web3Auth$value !== void 0 && _web3Auth$value.chainNamespace) || web3Auth.value.currentChain.chainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) {
+    var _web3Auth$value;
+    if (!isSolana.value) {
+      return;
+    }
+    if (!provider.value) {
       return;
     }
     solanaWallet$1.value = new solanaWallet.SolanaWallet(provider.value);
@@ -37,19 +45,26 @@ const useSolanaWallet = () => {
     if ((result === null || result === void 0 ? void 0 : result.length) > 0) {
       accounts.value = result;
     }
-    connection.value = new web3_js.Connection((_web3Auth$value2 = web3Auth.value) === null || _web3Auth$value2 === void 0 || (_web3Auth$value2 = _web3Auth$value2.currentChain) === null || _web3Auth$value2 === void 0 ? void 0 : _web3Auth$value2.rpcTarget);
+    if ((_web3Auth$value = web3Auth.value) !== null && _web3Auth$value !== void 0 && (_web3Auth$value = _web3Auth$value.currentChain) !== null && _web3Auth$value !== void 0 && _web3Auth$value.rpcTarget) {
+      connection.value = new web3_js.Connection(web3Auth.value.currentChain.rpcTarget);
+    }
+  };
+  const resetWallet = () => {
+    solanaWallet$1.value = null;
+    accounts.value = null;
+    connection.value = null;
   };
   if (provider.value && !solanaWallet$1.value) {
     setupWallet();
   }
-  vue.watch(provider, async newVal => {
-    if (!newVal && solanaWallet$1.value) {
-      solanaWallet$1.value = null;
-      accounts.value = null;
-      connection.value = null;
+  vue.watch([provider, chainNamespace], async ([newProvider, newChainNamespace]) => {
+    if (!newProvider || newChainNamespace !== baseControllers.CHAIN_NAMESPACES.SOLANA) {
+      if (solanaWallet$1.value) {
+        resetWallet();
+      }
       return;
     }
-    if (newVal && !solanaWallet$1.value) {
+    if (newProvider && !solanaWallet$1.value) {
       setupWallet();
     }
   }, {

package/dist/lib.cjs/vue/wagmi/provider.js

@@ -24,10 +24,13 @@ var useWeb3AuthDisconnect = require('../composables/useWeb3AuthDisconnect.js');
 var constants = require('./constants.js');
 
 const WEB3AUTH_CONNECTOR_ID = "web3auth";
+function getWeb3authConnector(config) {
+  return config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+}
 // Helper to initialize connectors for the given wallets
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 async function setupConnector(provider, config) {
-  let connector = config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+  let connector = getWeb3authConnector(config);
   if (connector) return connector;
   // Create new connector if not already existing
   connector = connectors.injected({
@@ -62,8 +65,15 @@ async function connectWeb3AuthWithWagmi(connector, config) {
     status: "connected"
   }));
 }
-async function disconnectWeb3AuthFromWagmi(config) {
+function resetConnectorState(config) {
   config._internal.connectors.setState(prev => prev.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID));
+  config.connectors.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID);
+}
+async function disconnectWeb3AuthFromWagmi(config) {
+  var _config$storage3, _config$storage4;
+  const connector = getWeb3authConnector(config);
+  await Promise.all([(_config$storage3 = config.storage) === null || _config$storage3 === void 0 ? void 0 : _config$storage3.setItem(`${connector === null || connector === void 0 ? void 0 : connector.id}.disconnected`, true), (_config$storage4 = config.storage) === null || _config$storage4 === void 0 ? void 0 : _config$storage4.removeItem("injected.connected")]);
+  resetConnectorState(config);
   config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
     chainId: state.chainId,
     connections: new Map(),
@@ -89,6 +99,12 @@ const Web3AuthWagmiProvider = vue.defineComponent({
       onDisconnect: async () => {
         loglevel.log.info("Disconnected from wagmi");
         if (isConnected.value) await disconnect();
+        const connector = getWeb3authConnector(wagmiConfig);
+        // reset wagmi connector state if the provider handles disconnection because of the accountsChanged event
+        // from the connected provider
+        if (connector) {
+          resetConnectorState(wagmiConfig);
+        }
       }
     });
     vue.watch(isConnected, async newIsConnected => {
@@ -223,12 +239,12 @@ const WagmiProvider = vue.defineComponent({
         }, props.config));
       }
     };
-    vue.watch(isInitialized, newIsInitialized => {
+    vue.watch(isInitialized, (newIsInitialized, prevIsInitialized) => {
       var _web3Auth$value2;
       (_web3Auth$value2 = web3Auth.value) === null || _web3Auth$value2 === void 0 || _web3Auth$value2.setAnalyticsProperties({
         wagmi_enabled: true
       });
-      if (newIsInitialized && !finalConfig.value) {
+      if (newIsInitialized && !prevIsInitialized) {
         finalConfig.value = defineWagmiConfig();
         hydrateWagmiConfig();
         configKey.value = auth.randomId();
@@ -245,10 +261,7 @@ const WagmiProvider = vue.defineComponent({
     };
   },
   render() {
-    if (!this.finalConfig) return null;
-    return vue.h(Web3AuthWagmiInnerProvider,
-    // This key is used to remount the provider when the config changes.
-    {
+    return vue.h(Web3AuthWagmiInnerProvider, {
       config: this.finalConfig,
       key: this.configKey
     }, {

package/dist/lib.esm/base/utils.js

@@ -145,7 +145,7 @@ const getWalletServicesAnalyticsProperties = walletServicesConfig => {
     ws_default_portfolio: walletServicesConfig === null || walletServicesConfig === void 0 || (_walletServicesConfig1 = walletServicesConfig.whiteLabel) === null || _walletServicesConfig1 === void 0 ? void 0 : _walletServicesConfig1.defaultPortfolio
   };
 };
-const sdkVersion = "10.7.0";
+const sdkVersion = "10.8.1";
 const getErrorAnalyticsProperties = error => {
   try {
     const code = error instanceof Web3AuthError ? error.code : error === null || error === void 0 ? void 0 : error.code;

package/dist/lib.esm/connectors/coinbase-connector/coinbaseConnector.js

@@ -137,12 +137,37 @@ class CoinbaseConnector extends BaseEvmConnector {
   }
   async switchChain(params, init = false) {
     super.checkSwitchChainRequirements(params, init);
-    await this.coinbaseProvider.request({
-      method: "wallet_switchEthereumChain",
-      params: [{
-        chainId: params.chainId
-      }]
-    });
+    try {
+      await this.coinbaseProvider.request({
+        method: "wallet_switchEthereumChain",
+        params: [{
+          chainId: params.chainId
+        }]
+      });
+    } catch (switchError) {
+      // 4902 indicates that the client does not recognize the Harmony One network
+      if (switchError.code === 4902) {
+        const chainConfig = this.coreOptions.chains.find(x => x.chainId === params.chainId);
+        if (!chainConfig) throw WalletLoginError.connectionError("Chain config is not available");
+        await this.coinbaseProvider.request({
+          method: "wallet_addEthereumChain",
+          params: [{
+            chainId: chainConfig.chainId,
+            rpcUrls: [chainConfig.rpcTarget],
+            chainName: chainConfig.displayName,
+            nativeCurrency: {
+              name: chainConfig.tickerName,
+              symbol: chainConfig.ticker,
+              decimals: chainConfig.decimals || 18
+            },
+            blockExplorerUrls: [chainConfig.blockExplorerUrl],
+            iconUrls: [chainConfig.logo]
+          }]
+        });
+        return;
+      }
+      throw switchError;
+    }
   }
   async enableMFA() {
     throw new Error("Method Not implemented");

package/dist/lib.esm/react/context/Web3AuthInnerContext.js

@@ -18,6 +18,8 @@ function Web3AuthInnerProvider(params) {
     setProvider(null);
     return new Web3AuthNoModal(web3AuthOptions, initialState);
   }, [web3AuthOptions, initialState]);
+  const [chainId, setChainId] = useState(null);
+  const [chainNamespace, setChainNamespace] = useState(null);
   const [isInitializing, setIsInitializing] = useState(false);
   const [initError, setInitError] = useState(null);
   const [isConnected, setIsConnected] = useState(false);
@@ -33,6 +35,7 @@ function Web3AuthInnerProvider(params) {
     const controller = new AbortController();
     async function init() {
       try {
+        var _web3Auth$currentChai;
         setInitError(null);
         setIsInitializing(true);
         web3Auth.setAnalyticsProperties({
@@ -41,6 +44,8 @@ function Web3AuthInnerProvider(params) {
         await web3Auth.init({
           signal: controller.signal
         });
+        setChainId(web3Auth.currentChainId);
+        setChainNamespace((_web3Auth$currentChai = web3Auth.currentChain) === null || _web3Auth$currentChai === void 0 ? void 0 : _web3Auth$currentChai.chainNamespace);
       } catch (error) {
         setInitError(error);
       } finally {
@@ -52,6 +57,19 @@ function Web3AuthInnerProvider(params) {
       controller.abort();
     };
   }, [web3Auth]);
+  useEffect(() => {
+    const handleChainChange = async chainId => {
+      var _web3Auth$currentChai2;
+      setChainId(chainId);
+      setChainNamespace(web3Auth === null || web3Auth === void 0 || (_web3Auth$currentChai2 = web3Auth.currentChain) === null || _web3Auth$currentChai2 === void 0 ? void 0 : _web3Auth$currentChai2.chainNamespace);
+    };
+    if (provider) {
+      provider.on("chainChanged", handleChainChange);
+      return () => {
+        provider.off("chainChanged", handleChainChange);
+      };
+    }
+  }, [web3Auth, provider]);
   useEffect(() => {
     const notReadyListener = () => setStatus(CONNECTOR_STATUS.NOT_READY);
     const readyListener = () => {
@@ -121,10 +139,12 @@ function Web3AuthInnerProvider(params) {
       isInitializing,
       initError,
       isMFAEnabled,
+      chainId,
+      chainNamespace,
       getPlugin,
       setIsMFAEnabled
     };
-  }, [web3Auth, isConnected, isInitialized, provider, status, getPlugin, isInitializing, initError, isMFAEnabled, setIsMFAEnabled]);
+  }, [web3Auth, isConnected, isInitialized, provider, status, getPlugin, isInitializing, initError, isMFAEnabled, setIsMFAEnabled, chainId, chainNamespace]);
   return createElement(Web3AuthInnerContext.Provider, {
     value
   }, children);

package/dist/lib.esm/react/hooks/useChain.js

@@ -0,0 +1,14 @@
+import { useWeb3AuthInner } from './useWeb3AuthInner.js';
+
+const useChain = () => {
+  const {
+    chainId,
+    chainNamespace
+  } = useWeb3AuthInner();
+  return {
+    chainId,
+    chainNamespace
+  };
+};
+
+export { useChain };

package/dist/lib.esm/react/index.js

@@ -1,4 +1,5 @@
 export { Web3AuthProvider } from './Web3AuthProvider.js';
+export { useChain } from './hooks/useChain.js';
 export { useCheckout } from './hooks/useCheckout.js';
 export { useEnableMFA } from './hooks/useEnableMFA.js';
 export { useFunding } from './hooks/useFunding.js';

package/dist/lib.esm/react/solana/hooks/useSolanaWallet.js

@@ -2,6 +2,7 @@ import { Connection } from '@solana/web3.js';
 import { useState, useMemo, useEffect } from 'react';
 import { CHAIN_NAMESPACES } from '@toruslabs/base-controllers';
 import { useWeb3Auth } from '../../hooks/useWeb3Auth.js';
+import { useChain } from '../../hooks/useChain.js';
 import { SolanaWallet } from '../../../providers/solana-provider/solanaWallet.js';
 
 const useSolanaWallet = () => {
@@ -9,29 +10,33 @@ const useSolanaWallet = () => {
     provider,
     web3Auth
   } = useWeb3Auth();
+  const {
+    chainNamespace
+  } = useChain();
   const [accounts, setAccounts] = useState(null);
   const solanaWallet = useMemo(() => {
     if (!provider) return null;
+    if (chainNamespace !== CHAIN_NAMESPACES.SOLANA) return null;
     return new SolanaWallet(provider);
-  }, [provider]);
+  }, [provider, chainNamespace]);
   const connection = useMemo(() => {
-    if (!web3Auth || !provider) return null;
+    if (!web3Auth || !provider || chainNamespace !== CHAIN_NAMESPACES.SOLANA) return null;
     return new Connection(web3Auth.currentChain.rpcTarget);
-  }, [web3Auth, provider]);
+  }, [web3Auth, provider, chainNamespace]);
   useEffect(() => {
     const init = async () => {
-      var _web3Auth$currentChai;
-      if (!solanaWallet) return;
-      if (!(web3Auth !== null && web3Auth !== void 0 && (_web3Auth$currentChai = web3Auth.currentChain) !== null && _web3Auth$currentChai !== void 0 && _web3Auth$currentChai.chainNamespace) || web3Auth.currentChain.chainNamespace !== CHAIN_NAMESPACES.SOLANA) {
+      if (chainNamespace !== CHAIN_NAMESPACES.SOLANA) {
+        setAccounts(null);
         return;
       }
+      if (!solanaWallet) return;
       const accounts = await solanaWallet.getAccounts();
       if ((accounts === null || accounts === void 0 ? void 0 : accounts.length) > 0) {
         setAccounts(accounts);
       }
     };
     if (solanaWallet) init();
-  }, [solanaWallet]);
+  }, [solanaWallet, chainNamespace]);
   return {
     solanaWallet,
     accounts,

package/dist/lib.esm/react/wagmi/provider.js

@@ -13,11 +13,14 @@ import { log } from '../../base/loglevel.js';
 
 const _excluded = ["children"];
 const WEB3AUTH_CONNECTOR_ID = "web3auth";
+function getWeb3authConnector(config) {
+  return config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+}
 
 // Helper to initialize connectors for the given wallets
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 async function setupConnector(provider, config) {
-  let connector = config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+  let connector = getWeb3authConnector(config);
   if (connector) return connector;
 
   // Create new connector if not already existing
@@ -54,8 +57,15 @@ async function connectWeb3AuthWithWagmi(connector, config) {
     status: "connected"
   }));
 }
-async function disconnectWeb3AuthFromWagmi(config) {
+function resetConnectorState(config) {
   config._internal.connectors.setState(prev => prev.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID));
+  config.connectors.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID);
+}
+async function disconnectWeb3AuthFromWagmi(config) {
+  var _config$storage3, _config$storage4;
+  const connector = getWeb3authConnector(config);
+  await Promise.all([(_config$storage3 = config.storage) === null || _config$storage3 === void 0 ? void 0 : _config$storage3.setItem(`${connector === null || connector === void 0 ? void 0 : connector.id}.disconnected`, true), (_config$storage4 = config.storage) === null || _config$storage4 === void 0 ? void 0 : _config$storage4.removeItem("injected.connected")]);
+  resetConnectorState(config);
   config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
     chainId: state.chainId,
     connections: new Map(),
@@ -81,6 +91,12 @@ function Web3AuthWagmiProvider({
     onDisconnect: async () => {
       log.info("Disconnected from wagmi");
       if (isConnected) await disconnect();
+      const connector = getWeb3authConnector(wagmiConfig);
+      // reset wagmi connector state if the provider handles disconnection because of the accountsChanged event
+      // from the connected provider
+      if (connector) {
+        resetConnectorState(wagmiConfig);
+      }
     }
   });
   useEffect(() => {
@@ -181,7 +197,6 @@ function WagmiProvider(_ref) {
       });
       finalConfig.chains = [wagmiChains[0], ...wagmiChains.slice(1)];
     }
-    if (!finalConfig.chains) return;
     return createConfig(finalConfig);
   }, [config, web3Auth, isInitialized]);
   return createElement(WagmiProvider$1, // typecast to WagmiProviderPropsBase to avoid type error

package/dist/lib.esm/vue/composables/useChain.js

@@ -0,0 +1,22 @@
+import { computed } from 'vue';
+import { useWeb3AuthInner } from './useWeb3AuthInner.js';
+
+const useChain = () => {
+  const context = useWeb3AuthInner();
+  const chainId = computed(() => {
+    var _context$web3Auth$val;
+    if (!((_context$web3Auth$val = context.web3Auth.value) !== null && _context$web3Auth$val !== void 0 && _context$web3Auth$val.currentChain)) return null;
+    return context.web3Auth.value.currentChain.chainId;
+  });
+  const chainNamespace = computed(() => {
+    var _context$web3Auth$val2;
+    if (!((_context$web3Auth$val2 = context.web3Auth.value) !== null && _context$web3Auth$val2 !== void 0 && _context$web3Auth$val2.currentChain)) return null;
+    return context.web3Auth.value.currentChain.chainNamespace;
+  });
+  return {
+    chainId,
+    chainNamespace
+  };
+};
+
+export { useChain };

package/dist/lib.esm/vue/index.js

@@ -1,4 +1,5 @@
 export { Web3AuthProvider } from './Web3AuthProvider.js';
+export { useChain } from './composables/useChain.js';
 export { useCheckout } from './composables/useCheckout.js';
 export { useEnableMFA } from './composables/useEnableMFA.js';
 export { useFunding } from './composables/useFunding.js';

package/dist/lib.esm/vue/solana/composables/useSolanaWallet.js

@@ -1,20 +1,28 @@
 import { Connection } from '@solana/web3.js';
-import { ref, shallowRef, watch } from 'vue';
+import { ref, shallowRef, computed, watch } from 'vue';
 import { CHAIN_NAMESPACES } from '@toruslabs/base-controllers';
 import { SolanaWallet } from '../../../providers/solana-provider/solanaWallet.js';
 import { useWeb3Auth } from '../../composables/useWeb3Auth.js';
+import { useChain } from '../../composables/useChain.js';
 
 const useSolanaWallet = () => {
   const {
     provider,
     web3Auth
   } = useWeb3Auth();
+  const {
+    chainNamespace
+  } = useChain();
   const accounts = ref([]);
   const solanaWallet = shallowRef(null);
   const connection = shallowRef(null);
+  const isSolana = computed(() => chainNamespace.value === CHAIN_NAMESPACES.SOLANA);
   const setupWallet = async () => {
-    var _web3Auth$value, _web3Auth$value2;
-    if (!((_web3Auth$value = web3Auth.value) !== null && _web3Auth$value !== void 0 && (_web3Auth$value = _web3Auth$value.currentChain) !== null && _web3Auth$value !== void 0 && _web3Auth$value.chainNamespace) || web3Auth.value.currentChain.chainNamespace !== CHAIN_NAMESPACES.SOLANA) {
+    var _web3Auth$value;
+    if (!isSolana.value) {
+      return;
+    }
+    if (!provider.value) {
       return;
     }
     solanaWallet.value = new SolanaWallet(provider.value);
@@ -22,19 +30,26 @@ const useSolanaWallet = () => {
     if ((result === null || result === void 0 ? void 0 : result.length) > 0) {
       accounts.value = result;
     }
-    connection.value = new Connection((_web3Auth$value2 = web3Auth.value) === null || _web3Auth$value2 === void 0 || (_web3Auth$value2 = _web3Auth$value2.currentChain) === null || _web3Auth$value2 === void 0 ? void 0 : _web3Auth$value2.rpcTarget);
+    if ((_web3Auth$value = web3Auth.value) !== null && _web3Auth$value !== void 0 && (_web3Auth$value = _web3Auth$value.currentChain) !== null && _web3Auth$value !== void 0 && _web3Auth$value.rpcTarget) {
+      connection.value = new Connection(web3Auth.value.currentChain.rpcTarget);
+    }
+  };
+  const resetWallet = () => {
+    solanaWallet.value = null;
+    accounts.value = null;
+    connection.value = null;
   };
   if (provider.value && !solanaWallet.value) {
     setupWallet();
   }
-  watch(provider, async newVal => {
-    if (!newVal && solanaWallet.value) {
-      solanaWallet.value = null;
-      accounts.value = null;
-      connection.value = null;
+  watch([provider, chainNamespace], async ([newProvider, newChainNamespace]) => {
+    if (!newProvider || newChainNamespace !== CHAIN_NAMESPACES.SOLANA) {
+      if (solanaWallet.value) {
+        resetWallet();
+      }
       return;
     }
-    if (newVal && !solanaWallet.value) {
+    if (newProvider && !solanaWallet.value) {
       setupWallet();
     }
   }, {

package/dist/lib.esm/vue/wagmi/provider.js

@@ -13,11 +13,14 @@ import { CHAIN_NAMESPACES } from '@toruslabs/base-controllers';
 import { WalletInitializationError } from '../../base/errors/index.js';
 
 const WEB3AUTH_CONNECTOR_ID = "web3auth";
+function getWeb3authConnector(config) {
+  return config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+}
 
 // Helper to initialize connectors for the given wallets
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 async function setupConnector(provider, config) {
-  let connector = config.connectors.find(c => c.id === WEB3AUTH_CONNECTOR_ID);
+  let connector = getWeb3authConnector(config);
   if (connector) return connector;
 
   // Create new connector if not already existing
@@ -54,8 +57,15 @@ async function connectWeb3AuthWithWagmi(connector, config) {
     status: "connected"
   }));
 }
-async function disconnectWeb3AuthFromWagmi(config) {
+function resetConnectorState(config) {
   config._internal.connectors.setState(prev => prev.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID));
+  config.connectors.filter(c => c.id !== WEB3AUTH_CONNECTOR_ID);
+}
+async function disconnectWeb3AuthFromWagmi(config) {
+  var _config$storage3, _config$storage4;
+  const connector = getWeb3authConnector(config);
+  await Promise.all([(_config$storage3 = config.storage) === null || _config$storage3 === void 0 ? void 0 : _config$storage3.setItem(`${connector === null || connector === void 0 ? void 0 : connector.id}.disconnected`, true), (_config$storage4 = config.storage) === null || _config$storage4 === void 0 ? void 0 : _config$storage4.removeItem("injected.connected")]);
+  resetConnectorState(config);
   config.setState(state => _objectSpread(_objectSpread({}, state), {}, {
     chainId: state.chainId,
     connections: new Map(),
@@ -81,6 +91,12 @@ const Web3AuthWagmiProvider = defineComponent({
       onDisconnect: async () => {
         log.info("Disconnected from wagmi");
         if (isConnected.value) await disconnect();
+        const connector = getWeb3authConnector(wagmiConfig);
+        // reset wagmi connector state if the provider handles disconnection because of the accountsChanged event
+        // from the connected provider
+        if (connector) {
+          resetConnectorState(wagmiConfig);
+        }
       }
     });
     watch(isConnected, async newIsConnected => {
@@ -215,12 +231,12 @@ const WagmiProvider = defineComponent({
         }, props.config));
       }
     };
-    watch(isInitialized, newIsInitialized => {
+    watch(isInitialized, (newIsInitialized, prevIsInitialized) => {
       var _web3Auth$value2;
       (_web3Auth$value2 = web3Auth.value) === null || _web3Auth$value2 === void 0 || _web3Auth$value2.setAnalyticsProperties({
         wagmi_enabled: true
       });
-      if (newIsInitialized && !finalConfig.value) {
+      if (newIsInitialized && !prevIsInitialized) {
         finalConfig.value = defineWagmiConfig();
         hydrateWagmiConfig();
         configKey.value = randomId();
@@ -237,10 +253,7 @@ const WagmiProvider = defineComponent({
     };
   },
   render() {
-    if (!this.finalConfig) return null;
-    return h(Web3AuthWagmiInnerProvider,
-    // This key is used to remount the provider when the config changes.
-    {
+    return h(Web3AuthWagmiInnerProvider, {
       config: this.finalConfig,
       key: this.configKey
     }, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3auth/no-modal",
-  "version": "10.7.0",
+  "version": "10.8.1",
   "description": "Multi chain wallet aggregator for web3Auth",
   "keywords": [
     "web3Auth/no-modal",
@@ -203,5 +203,5 @@
     "node": ">=20.x",
     "npm": ">=9.x"
   },
-  "gitHead": "058c186f8bfc63bef7f1394a15948789144574c6"
+  "gitHead": "d93410531e87a465eba46ae0e9b645a6646ee0b4"
 }