@web3auth/modal 4.6.2 → 5.0.0

package/dist/types/modalManager.d.ts

@@ -1,8 +1,8 @@
 import { SafeEventEmitterProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
-import { Web3AuthCore, Web3AuthCoreOptions } from "@web3auth/core";
+import { Web3AuthNoModal, Web3AuthNoModalOptions } from "@web3auth/no-modal";
 import { LoginModal, UIConfig } from "@web3auth/ui";
 import { IWeb3AuthModal, ModalConfig } from "./interface";
-export interface Web3AuthOptions extends Web3AuthCoreOptions {
+export interface Web3AuthOptions extends Web3AuthNoModalOptions {
     /**
      * web3auth instance provides different adapters for different type of usages. If you are dapp and want to
      * use external wallets like metamask, then you can use the `DAPP` authMode.
@@ -17,7 +17,7 @@ export interface Web3AuthOptions extends Web3AuthCoreOptions {
      */
     uiConfig?: Omit<UIConfig, "adapterListener">;
 }
-export declare class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
+export declare class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
     loginModal: LoginModal;
     readonly options: Web3AuthOptions;
     private modalConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3auth/modal",
-  "version": "4.6.2",
+  "version": "5.0.0",
   "homepage": "https://github.com/Web3Auth/Web3Auth#readme",
   "license": "ISC",
   "main": "dist/modal.cjs.js",
@@ -19,28 +19,29 @@
     "pre-commit": "lint-staged --cwd ."
   },
   "dependencies": {
-    "@web3auth/base": "^4.6.0",
-    "@web3auth/core": "^4.6.0",
-    "@web3auth/metamask-adapter": "^4.6.0",
-    "@web3auth/openlogin-adapter": "^4.6.0",
-    "@web3auth/phantom-adapter": "^4.6.0",
-    "@web3auth/torus-evm-adapter": "^4.6.0",
-    "@web3auth/torus-solana-adapter": "^4.6.0",
-    "@web3auth/ui": "^4.6.2",
-    "@web3auth/wallet-connect-v1-adapter": "^4.6.0"
+    "@web3auth/base": "^5.0.0",
+    "@web3auth/metamask-adapter": "^5.0.0",
+    "@web3auth/no-modal": "^5.0.0",
+    "@web3auth/openlogin-adapter": "^5.0.0",
+    "@web3auth/phantom-adapter": "^5.0.0",
+    "@web3auth/torus-evm-adapter": "^5.0.0",
+    "@web3auth/torus-solana-adapter": "^5.0.0",
+    "@web3auth/ui": "^5.0.0",
+    "@web3auth/wallet-connect-v1-adapter": "^5.0.0"
   },
   "devDependencies": {
     "@svgr/webpack": "^6.5.1",
     "@toruslabs/isomorphic-style-loader": "^5.3.3",
-    "@toruslabs/openlogin": "^3.1.0",
+    "@toruslabs/openlogin": "^3.2.1",
     "css-loader": "^6.7.3",
     "postcss-prefix-selector": "^1.16.0",
-    "style-loader": "^3.3.1",
-    "tailwindcss": "^3.2.6",
+    "style-loader": "^3.3.2",
+    "tailwindcss": "^3.2.7",
     "url-loader": "^4.1.1"
   },
   "peerDependencies": {
-    "@babel/runtime": "7.x"
+    "@babel/runtime": "7.x",
+    "@solana/web3.js": "^1.x"
   },
   "files": [
     "dist",
@@ -63,5 +64,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "4c7feb39f21f4c944c8430f09198bf3e8e7fb976"
+  "gitHead": "8702657a42f44ff5ebc0a4be796e68a10f506dde"
 }

package/src/modalManager.ts

@@ -12,7 +12,7 @@ import {
   WALLET_ADAPTER_TYPE,
   WALLET_ADAPTERS,
 } from "@web3auth/base";
-import { Web3AuthCore, Web3AuthCoreOptions } from "@web3auth/core";
+import { Web3AuthNoModal, Web3AuthNoModalOptions } from "@web3auth/no-modal";
 import { getAdapterSocialLogins, LOGIN_MODAL_EVENTS, LoginModal, OPENLOGIN_PROVIDERS, UIConfig } from "@web3auth/ui";
 
 import {
@@ -26,7 +26,7 @@ import { getDefaultAdapterModule } from "./default";
 import { AdaptersModalConfig, IWeb3AuthModal, ModalConfig } from "./interface";
 import { getUserLanguage } from "./utils";
 
-export interface Web3AuthOptions extends Web3AuthCoreOptions {
+export interface Web3AuthOptions extends Web3AuthNoModalOptions {
   /**
    * web3auth instance provides different adapters for different type of usages. If you are dapp and want to
    * use external wallets like metamask, then you can use the `DAPP` authMode.
@@ -42,7 +42,7 @@ export interface Web3AuthOptions extends Web3AuthCoreOptions {
   uiConfig?: Omit<UIConfig, "adapterListener">;
 }
 
-export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
+export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
   public loginModal: LoginModal;
 
   readonly options: Web3AuthOptions;
@@ -86,6 +86,9 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
       displayErrorsOnModal: this.options.uiConfig?.displayErrorsOnModal,
       defaultLanguage,
       modalZIndex: this.options.uiConfig?.modalZIndex || "99998",
+      web3AuthNetwork: this.options.web3AuthNetwork,
+      loginGridCol: this.options.uiConfig?.loginGridCol || 3,
+      primaryButton: this.options.uiConfig?.primaryButton || "socialLogin",
     });
     this.subscribeToLoginModalEvents();
   }
@@ -130,7 +133,6 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
         });
 
         this.walletAdapters[adapterName] = ad;
-
         return adapterName;
       } else if (adapter?.type === ADAPTER_CATEGORY.IN_APP || adapter?.type === ADAPTER_CATEGORY.EXTERNAL || adapterName === this.cachedAdapter) {
         if (!this.modalConfig.adapters?.[adapterName].showOnModal) return;
@@ -156,7 +158,7 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
       }
     });
 
-    const adapterNames = await Promise.all(adapterConfigurationPromises);
+    let adapterNames = await Promise.all(adapterConfigurationPromises);
     const hasInAppWallets = Object.values(this.walletAdapters).some((adapter) => {
       if (adapter.type !== ADAPTER_CATEGORY.IN_APP) return false;
       if (this.modalConfig.adapters?.[adapter.name]?.showOnModal !== true) return false;
@@ -169,7 +171,13 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
       if (Object.values(mergedLoginMethods).some((method: LoginMethodConfig[keyof LoginMethodConfig]) => method.showOnModal)) return true;
       return false;
     });
-    log.debug(hasInAppWallets, this.walletAdapters, "hasInAppWallets");
+    log.debug(hasInAppWallets, this.walletAdapters, adapterNames, "hasInAppWallets");
+
+    // if both wc1 and wc2 are configured, give precedence to wc2.
+    if (this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1] && this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V2]) {
+      delete this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1];
+      adapterNames = adapterNames.filter((ad) => ad !== WALLET_ADAPTERS.WALLET_CONNECT_V1);
+    }
     // Now, initialize the adapters.
     const initPromises = adapterNames.map(async (adapterName) => {
       if (!adapterName) return;
@@ -263,7 +271,12 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
           this.walletAdapters[adapterName],
           (this.modalConfig.adapters as Record<WALLET_ADAPTER_TYPE, ModalConfig>)[adapterName]?.loginMethods
         ),
-        this.options.uiConfig?.loginMethodsOrder || OPENLOGIN_PROVIDERS
+        this.options.uiConfig?.loginMethodsOrder || OPENLOGIN_PROVIDERS,
+        {
+          ...this.options.uiConfig,
+          loginGridCol: this.options.uiConfig?.loginGridCol || 3,
+          primaryButton: this.options.uiConfig?.primaryButton || "socialLogin",
+        }
       );
     }
   }
@@ -289,13 +302,19 @@ export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
     this.loginModal.on(LOGIN_MODAL_EVENTS.MODAL_VISIBILITY, async (visibility: boolean) => {
       log.debug("is login modal visible", visibility);
       this.emit(LOGIN_MODAL_EVENTS.MODAL_VISIBILITY, visibility);
-      const walletConnectStatus = this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1]?.status;
-      if (visibility && walletConnectStatus === ADAPTER_STATUS.READY) {
-        // refreshing session for wallet connect whenever modal is opened.
-        try {
-          this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1].connect();
-        } catch (error) {
-          log.error(`Error while disconnecting to wallet connect in core`, error);
+      const adapter = this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V2] || this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1];
+      if (adapter) {
+        const walletConnectStatus = adapter?.status;
+        log.debug("trying refreshing wc session", visibility, walletConnectStatus);
+        if (visibility && (walletConnectStatus === ADAPTER_STATUS.READY || walletConnectStatus === ADAPTER_STATUS.CONNECTING)) {
+          log.debug("refreshing wc session");
+
+          // refreshing session for wallet connect whenever modal is opened.
+          try {
+            adapter.connect();
+          } catch (error) {
+            log.error(`Error while disconnecting to wallet connect in core`, error);
+          }
         }
       }
     });