@web3auth/modal 6.1.8 → 7.0.0

package/dist/types/default.d.ts

@@ -1,6 +1,6 @@
 import type { OPENLOGIN_NETWORK_TYPE } from "@toruslabs/openlogin-utils";
-import { CustomChainConfig, IAdapter, WALLET_ADAPTER_TYPE } from "@web3auth/base";
-import { IBaseProvider } from "@web3auth/base-provider";
+import { CustomChainConfig, IAdapter, IBaseProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
+import { UIConfig } from "@web3auth/ui";
 export declare function getPrivateKeyProvider(chainConfig: CustomChainConfig): Promise<IBaseProvider<string>>;
 export declare const getDefaultAdapterModule: (params: {
     name: WALLET_ADAPTER_TYPE;
@@ -8,4 +8,5 @@ export declare const getDefaultAdapterModule: (params: {
     customChainConfig: Partial<CustomChainConfig> & Pick<CustomChainConfig, "chainNamespace">;
     sessionTime?: number;
     web3AuthNetwork?: OPENLOGIN_NETWORK_TYPE;
+    uiConfig?: Omit<UIConfig, "adapterListener">;
 }) => Promise<IAdapter<unknown>>;

package/dist/types/interface.d.ts

@@ -1,4 +1,4 @@
-import type { BaseAdapterConfig, ChainNamespaceType, IWeb3Auth, LoginMethodConfig, SafeEventEmitterProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
+import type { BaseAdapterConfig, ChainNamespaceType, IProvider, IWeb3Auth, LoginMethodConfig, WALLET_ADAPTER_TYPE } from "@web3auth/base";
 export interface ModalConfig extends BaseAdapterConfig {
     loginMethods?: LoginMethodConfig;
 }
@@ -10,5 +10,5 @@ export interface IWeb3AuthModal extends IWeb3Auth {
     initModal(params?: {
         modalConfig?: Record<WALLET_ADAPTER_TYPE, ModalConfig>;
     }): Promise<void>;
-    connect(): Promise<SafeEventEmitterProvider | null>;
+    connect(): Promise<IProvider | null>;
 }

package/dist/types/modalManager.d.ts

@@ -1,4 +1,4 @@
-import { SafeEventEmitterProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
+import { IProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
 import { Web3AuthNoModal, Web3AuthNoModalOptions } from "@web3auth/no-modal";
 import { LoginModal, UIConfig } from "@web3auth/ui";
 import { IWeb3AuthModal, ModalConfig } from "./interface";
@@ -25,7 +25,7 @@ export declare class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal
     initModal(params?: {
         modalConfig?: Record<WALLET_ADAPTER_TYPE, ModalConfig>;
     }): Promise<void>;
-    connect(): Promise<SafeEventEmitterProvider | null>;
+    connect(): Promise<IProvider | null>;
     private initExternalWalletAdapters;
     private initializeInAppWallet;
     private subscribeToLoginModalEvents;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3auth/modal",
-  "version": "6.1.8",
+  "version": "7.0.0",
   "homepage": "https://github.com/Web3Auth/Web3Auth#readme",
   "license": "ISC",
   "main": "dist/modal.cjs.js",
@@ -19,23 +19,23 @@
     "pre-commit": "lint-staged --cwd ."
   },
   "dependencies": {
-    "@web3auth/base": "^6.1.7",
-    "@web3auth/base-provider": "^6.1.7",
-    "@web3auth/ethereum-provider": "^6.1.8",
-    "@web3auth/metamask-adapter": "^6.1.7",
-    "@web3auth/no-modal": "^6.1.7",
-    "@web3auth/openlogin-adapter": "^6.1.7",
-    "@web3auth/phantom-adapter": "^6.1.8",
-    "@web3auth/solana-provider": "^6.1.8",
-    "@web3auth/torus-evm-adapter": "^6.1.7",
-    "@web3auth/torus-solana-adapter": "^6.1.8",
-    "@web3auth/ui": "^6.1.8",
-    "@web3auth/wallet-connect-v2-adapter": "^6.1.8"
+    "@web3auth/base": "^7.0.0",
+    "@web3auth/base-provider": "^7.0.0",
+    "@web3auth/ethereum-provider": "^7.0.0",
+    "@web3auth/metamask-adapter": "^7.0.0",
+    "@web3auth/no-modal": "^7.0.0",
+    "@web3auth/openlogin-adapter": "^7.0.0",
+    "@web3auth/phantom-adapter": "^7.0.0",
+    "@web3auth/solana-provider": "^7.0.0",
+    "@web3auth/torus-evm-adapter": "^7.0.0",
+    "@web3auth/torus-solana-adapter": "^7.0.0",
+    "@web3auth/ui": "^7.0.0",
+    "@web3auth/wallet-connect-v2-adapter": "^7.0.0"
   },
   "devDependencies": {
-    "@svgr/webpack": "^8.0.1",
+    "@svgr/webpack": "^8.1.0",
     "@toruslabs/isomorphic-style-loader": "^5.3.3",
-    "@toruslabs/openlogin-utils": "^4.7.0",
+    "@toruslabs/openlogin-utils": "^5.0.2",
     "css-loader": "^6.8.1",
     "postcss-prefix-selector": "^1.16.0",
     "style-loader": "^3.3.3",
@@ -68,8 +68,8 @@
     "access": "public"
   },
   "engines": {
-    "node": ">=16.18.1",
-    "npm": ">=8.x"
+    "node": ">=18.x",
+    "npm": ">=9.x"
   },
-  "gitHead": "68f852e07cc44d21e40076b42aae1f801b911771"
+  "gitHead": "b13ea4976979dcd6c63a1ecb3d96b5dc448fd535"
 }

package/src/default.ts

@@ -1,6 +1,7 @@
 import type { OPENLOGIN_NETWORK_TYPE, OpenLoginOptions } from "@toruslabs/openlogin-utils";
-import { CHAIN_NAMESPACES, CustomChainConfig, getChainConfig, IAdapter, WALLET_ADAPTER_TYPE, WALLET_ADAPTERS } from "@web3auth/base";
-import { CommonPrivateKeyProvider, IBaseProvider } from "@web3auth/base-provider";
+import { CHAIN_NAMESPACES, CustomChainConfig, getChainConfig, IAdapter, IBaseProvider, WALLET_ADAPTER_TYPE, WALLET_ADAPTERS } from "@web3auth/base";
+import { CommonPrivateKeyProvider } from "@web3auth/base-provider";
+import { UIConfig } from "@web3auth/ui";
 
 export async function getPrivateKeyProvider(chainConfig: CustomChainConfig): Promise<IBaseProvider<string>> {
   if (chainConfig.chainNamespace === CHAIN_NAMESPACES.SOLANA) {
@@ -24,8 +25,9 @@ export const getDefaultAdapterModule = async (params: {
   customChainConfig: Partial<CustomChainConfig> & Pick<CustomChainConfig, "chainNamespace">;
   sessionTime?: number;
   web3AuthNetwork?: OPENLOGIN_NETWORK_TYPE;
+  uiConfig?: Omit<UIConfig, "adapterListener">;
 }): Promise<IAdapter<unknown>> => {
-  const { name, customChainConfig, clientId, sessionTime, web3AuthNetwork } = params;
+  const { name, customChainConfig, clientId, sessionTime, web3AuthNetwork, uiConfig } = params;
   if (!Object.values(CHAIN_NAMESPACES).includes(customChainConfig.chainNamespace))
     throw new Error(`Invalid chainNamespace: ${customChainConfig.chainNamespace}`);
   const finalChainConfig = {
@@ -73,7 +75,7 @@ export const getDefaultAdapterModule = async (params: {
       ...defaultOptions,
       clientId,
       chainConfig: { ...finalChainConfig },
-      adapterSettings: { ...(defaultOptions.adapterSettings as OpenLoginOptions), clientId, network: web3AuthNetwork },
+      adapterSettings: { ...(defaultOptions.adapterSettings as OpenLoginOptions), clientId, network: web3AuthNetwork, whiteLabel: uiConfig },
       sessionTime,
       web3AuthNetwork,
       privateKeyProvider,

package/src/interface.ts

@@ -1,11 +1,4 @@
-import type {
-  BaseAdapterConfig,
-  ChainNamespaceType,
-  IWeb3Auth,
-  LoginMethodConfig,
-  SafeEventEmitterProvider,
-  WALLET_ADAPTER_TYPE,
-} from "@web3auth/base";
+import type { BaseAdapterConfig, ChainNamespaceType, IProvider, IWeb3Auth, LoginMethodConfig, WALLET_ADAPTER_TYPE } from "@web3auth/base";
 export interface ModalConfig extends BaseAdapterConfig {
   loginMethods?: LoginMethodConfig;
 }
@@ -17,5 +10,5 @@ export interface AdaptersModalConfig {
 
 export interface IWeb3AuthModal extends IWeb3Auth {
   initModal(params?: { modalConfig?: Record<WALLET_ADAPTER_TYPE, ModalConfig> }): Promise<void>;
-  connect(): Promise<SafeEventEmitterProvider | null>;
+  connect(): Promise<IProvider | null>;
 }

package/src/modalManager.ts

@@ -6,16 +6,16 @@ import {
   CHAIN_NAMESPACES,
   CustomChainConfig,
   getChainConfig,
+  IProvider,
   log,
   LoginMethodConfig,
-  SafeEventEmitterProvider,
   WALLET_ADAPTER_TYPE,
   WALLET_ADAPTERS,
 } from "@web3auth/base";
 import { CommonJRPCProvider } from "@web3auth/base-provider";
 import { Web3AuthNoModal, Web3AuthNoModalOptions } from "@web3auth/no-modal";
 import type { OpenloginAdapter } from "@web3auth/openlogin-adapter";
-import { getAdapterSocialLogins, LOGIN_MODAL_EVENTS, LoginModal, OPENLOGIN_PROVIDERS, UIConfig } from "@web3auth/ui";
+import { getAdapterSocialLogins, getUserLanguage, LOGIN_MODAL_EVENTS, LoginModal, OPENLOGIN_PROVIDERS, UIConfig } from "@web3auth/ui";
 
 import {
   defaultEvmDappModalConfig,
@@ -26,7 +26,6 @@ import {
 } from "./config";
 import { getDefaultAdapterModule, getPrivateKeyProvider } from "./default";
 import { AdaptersModalConfig, IWeb3AuthModal, ModalConfig } from "./interface";
-import { getUserLanguage } from "./utils";
 
 export interface Web3AuthOptions extends Web3AuthNoModalOptions {
   /**
@@ -77,20 +76,12 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
       throw new Error(`Invalid chainNamespace provided: ${providedChainConfig.chainNamespace}`);
     }
 
-    // get userLanguage
-    const defaultLanguage = getUserLanguage(this.options.uiConfig?.defaultLanguage);
+    if (!this.options.uiConfig.defaultLanguage) this.options.uiConfig.defaultLanguage = getUserLanguage(this.options.uiConfig.defaultLanguage);
+    if (!this.options.uiConfig.mode) this.options.uiConfig.mode = "auto";
 
     this.loginModal = new LoginModal({
-      theme: this.options.uiConfig?.theme,
-      appName: this.options.uiConfig?.appName || "blockchain",
-      appLogo: this.options.uiConfig?.appLogo || "",
+      ...this.options.uiConfig,
       adapterListener: this,
-      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();
   }
@@ -132,6 +123,7 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
           clientId: this.options.clientId,
           sessionTime: this.options.sessionTime,
           web3AuthNetwork: this.options.web3AuthNetwork,
+          uiConfig: this.options.uiConfig,
         });
 
         this.walletAdapters[adapterName] = ad;
@@ -160,7 +152,7 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
           const openloginAdapter = this.walletAdapters[adapterName] as OpenloginAdapter;
           if (!openloginAdapter.privateKeyProvider) {
             const currentPrivateKeyProvider = await getPrivateKeyProvider(openloginAdapter.chainConfigProxy as CustomChainConfig);
-            openloginAdapter.setAdapterSettings({ privateKeyProvider: currentPrivateKeyProvider });
+            openloginAdapter.setAdapterSettings({ privateKeyProvider: currentPrivateKeyProvider, whiteLabel: this.options.uiConfig });
           }
         }
 
@@ -168,14 +160,13 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
       }
     });
 
-    let adapterNames = await Promise.all(adapterConfigurationPromises);
+    const 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;
       if (!this.modalConfig.adapters?.[adapter.name]?.loginMethods) return true;
       const mergedLoginMethods = getAdapterSocialLogins(
         adapter.name,
-        this.walletAdapters[adapter.name],
         (this.modalConfig.adapters as Record<WALLET_ADAPTER_TYPE, ModalConfig>)[adapter.name]?.loginMethods
       );
       if (Object.values(mergedLoginMethods).some((method: LoginMethodConfig[keyof LoginMethodConfig]) => method.showOnModal)) return true;
@@ -183,11 +174,6 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
     });
     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;
@@ -232,7 +218,7 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
     }
   }
 
-  public async connect(): Promise<SafeEventEmitterProvider | null> {
+  public async connect(): Promise<IProvider | null> {
     // if (!this.loginModal.initialized) throw new Error("Login modal is not initialized");
     // if already connected return provider
     if (this.connectedAdapterName && this.status === ADAPTER_STATUS.CONNECTED && this.provider) return this.provider;
@@ -281,11 +267,7 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
     if (this.walletAdapters[adapterName].type === ADAPTER_CATEGORY.IN_APP) {
       this.loginModal.addSocialLogins(
         adapterName,
-        getAdapterSocialLogins(
-          adapterName,
-          this.walletAdapters[adapterName],
-          (this.modalConfig.adapters as Record<WALLET_ADAPTER_TYPE, ModalConfig>)[adapterName]?.loginMethods
-        ),
+        getAdapterSocialLogins(adapterName, (this.modalConfig.adapters as Record<WALLET_ADAPTER_TYPE, ModalConfig>)[adapterName]?.loginMethods),
         this.options.uiConfig?.loginMethodsOrder || OPENLOGIN_PROVIDERS,
         {
           ...this.options.uiConfig,
@@ -317,7 +299,7 @@ export class Web3Auth extends Web3AuthNoModal 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 adapter = this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V2] || this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V1];
+      const adapter = this.walletAdapters[WALLET_ADAPTERS.WALLET_CONNECT_V2];
       if (adapter) {
         const walletConnectStatus = adapter?.status;
         log.debug("trying refreshing wc session", visibility, walletConnectStatus);

package/dist/types/utils.d.ts

@@ -1,12 +0,0 @@
-export declare const languageMap: {
-    en: string;
-    de: string;
-    ja: string;
-    ko: string;
-    zh: string;
-    es: string;
-    fr: string;
-    pt: string;
-    nl: string;
-};
-export declare const getUserLanguage: (defaultLanguage: string | undefined) => string;

package/src/utils.ts

@@ -1,25 +0,0 @@
-interface NavigatorLanguage {
-  userLanguage?: string;
-}
-
-export const languageMap = {
-  en: "english",
-  de: "german",
-  ja: "japanese",
-  ko: "korean",
-  zh: "mandarin",
-  es: "spanish",
-  fr: "french",
-  pt: "portuguese",
-  nl: "dutch",
-};
-
-export const getUserLanguage = (defaultLanguage: string | undefined) => {
-  let userLanguage = defaultLanguage;
-  if (!userLanguage) {
-    const browserLanguage =
-      typeof window !== "undefined" ? (window.navigator as NavigatorLanguage).userLanguage || window.navigator.language || "en-US" : "en-US";
-    userLanguage = browserLanguage.split("-")[0];
-  }
-  return Object.prototype.hasOwnProperty.call(languageMap, userLanguage) ? userLanguage : "en";
-};