@web3auth/modal 4.1.1-alpha.0 → 4.2.0

package/dist/types/default.d.ts

@@ -1,6 +1,9 @@
+import type { OPENLOGIN_NETWORK_TYPE } from "@toruslabs/openlogin";
 import { CustomChainConfig, IAdapter, WALLET_ADAPTER_TYPE } from "@web3auth/base";
 export declare const getDefaultAdapterModule: (params: {
     name: WALLET_ADAPTER_TYPE;
     clientId: string;
     customChainConfig: Partial<CustomChainConfig> & Pick<CustomChainConfig, "chainNamespace">;
+    sessionTime?: number;
+    web3AuthNetwork?: OPENLOGIN_NETWORK_TYPE;
 }) => Promise<IAdapter<unknown>>;

package/dist/types/interface.d.ts

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

package/dist/types/modalManager.d.ts

@@ -1,36 +1,7 @@
 import { SafeEventEmitterProvider, WALLET_ADAPTER_TYPE } from "@web3auth/base";
 import { Web3AuthCore, Web3AuthCoreOptions } from "@web3auth/core";
-import { LoginModal } from "@web3auth/ui";
-import { ModalConfig } from "./interface";
-export interface UIConfig {
-    /**
-     * Logo for your app.
-     */
-    appLogo?: string;
-    /**
-     * theme for the modal
-     *
-     * @defaultValue `light`
-     */
-    theme?: "light" | "dark";
-    /**
-     * order of how login methods are shown
-     *
-     * @defaultValue `["google", "facebook", "twitter", "reddit", "discord", "twitch", "apple", "line", "github", "kakao", "linkedin", "weibo", "wechat", "email_passwordless"]`
-     */
-    loginMethodsOrder?: string[];
-    /**
-     * language which will be used by web3auth. app will use browser language if not specified. if language is not supported it will use "en"
-     * en: english
-     * de: german
-     * ja: japanese
-     * ko: korean
-     * zh: mandarin
-     * es: spanish
-     *
-     */
-    defaultLanguage?: string;
-}
+import { LoginModal, UIConfig } from "@web3auth/ui";
+import { IWeb3AuthModal, ModalConfig } from "./interface";
 export interface Web3AuthOptions extends Web3AuthCoreOptions {
     /**
      * web3auth instance provides different adapters for different type of usages. If you are dapp and want to
@@ -44,15 +15,9 @@ export interface Web3AuthOptions extends Web3AuthCoreOptions {
     /**
      * Config for configuring modal ui display properties
      */
-    uiConfig?: UIConfig;
-    /**
-     * Whether to show errors on Web3Auth modal.
-     *
-     * @defaultValue `true`
-     */
-    displayErrorsOnModal?: boolean;
+    uiConfig?: Omit<UIConfig, "adapterListener">;
 }
-export declare class Web3Auth extends Web3AuthCore {
+export declare class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
     loginModal: LoginModal;
     readonly options: Web3AuthOptions;
     private modalConfig;

package/dist/types/utils.d.ts

@@ -6,5 +6,6 @@ export declare const languageMap: {
     zh: string;
     es: string;
     fr: string;
+    pt: string;
 };
 export declare const getUserLanguage: (defaultLanguage: string | undefined) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3auth/modal",
-  "version": "4.1.1-alpha.0",
+  "version": "4.2.0",
   "homepage": "https://github.com/Web3Auth/Web3Auth#readme",
   "license": "ISC",
   "main": "dist/modal.cjs.js",
@@ -19,21 +19,21 @@
     "pre-commit": "lint-staged --cwd ."
   },
   "dependencies": {
-    "@web3auth/base": "^4.0.0-alpha.0",
-    "@web3auth/core": "^4.0.0-alpha.0",
-    "@web3auth/metamask-adapter": "^4.0.0-alpha.0",
-    "@web3auth/openlogin-adapter": "^4.0.0-alpha.0",
-    "@web3auth/phantom-adapter": "^4.0.0-alpha.0",
-    "@web3auth/torus-evm-adapter": "^4.0.0-alpha.0",
-    "@web3auth/torus-solana-adapter": "^4.0.0-alpha.0",
-    "@web3auth/ui": "^4.1.0-alpha.0",
-    "@web3auth/wallet-connect-v1-adapter": "^4.0.0-alpha.0"
+    "@web3auth/base": "^4.0.0",
+    "@web3auth/core": "^4.0.0",
+    "@web3auth/metamask-adapter": "^4.2.0",
+    "@web3auth/openlogin-adapter": "^4.2.0",
+    "@web3auth/phantom-adapter": "^4.2.0",
+    "@web3auth/torus-evm-adapter": "^4.2.0",
+    "@web3auth/torus-solana-adapter": "^4.2.0",
+    "@web3auth/ui": "^4.1.1",
+    "@web3auth/wallet-connect-v1-adapter": "^4.2.0"
   },
   "devDependencies": {
     "@svgr/webpack": "^6.5.1",
+    "@toruslabs/isomorphic-style-loader": "^5.3.3",
     "@toruslabs/openlogin": "^2.10.0",
-    "css-loader": "^6.7.2",
-    "isomorphic-style-loader": "^5.3.2",
+    "css-loader": "^6.7.3",
     "postcss-prefix-selector": "^1.16.0",
     "style-loader": "^3.3.1",
     "tailwindcss": "^3.2.4",
@@ -63,5 +63,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a2fe29ce951bcffd02b5efb9c7bb587b0b7290dd"
+  "gitHead": "199baf3b4f6f2028e28ebf46c4c2e7d11c58937a"
 }

package/src/default.ts

@@ -1,13 +1,15 @@
-import type { OpenLoginOptions } from "@toruslabs/openlogin";
+import type { OPENLOGIN_NETWORK_TYPE, OpenLoginOptions } from "@toruslabs/openlogin";
 import { CHAIN_NAMESPACES, CustomChainConfig, getChainConfig, IAdapter, WALLET_ADAPTER_TYPE, WALLET_ADAPTERS } from "@web3auth/base";
 
-// warning: this function is not compatible with "OTHER" chainnamespace.
+// warning: this function is not compatible with "OTHER" chain namespace.
 export const getDefaultAdapterModule = async (params: {
   name: WALLET_ADAPTER_TYPE;
   clientId: string;
   customChainConfig: Partial<CustomChainConfig> & Pick<CustomChainConfig, "chainNamespace">;
+  sessionTime?: number;
+  web3AuthNetwork?: OPENLOGIN_NETWORK_TYPE;
 }): Promise<IAdapter<unknown>> => {
-  const { name, customChainConfig, clientId } = params;
+  const { name, customChainConfig, clientId, sessionTime, web3AuthNetwork } = params;
   if (!Object.values(CHAIN_NAMESPACES).includes(customChainConfig.chainNamespace))
     throw new Error(`Invalid chainNamespace: ${customChainConfig.chainNamespace}`);
   const finalChainConfig = {
@@ -16,31 +18,34 @@ export const getDefaultAdapterModule = async (params: {
   };
   if (name === WALLET_ADAPTERS.TORUS_EVM) {
     const { TorusWalletAdapter } = await import("@web3auth/torus-evm-adapter");
-    const adapter = new TorusWalletAdapter({ chainConfig: finalChainConfig, clientId });
+    const adapter = new TorusWalletAdapter({ chainConfig: finalChainConfig, clientId, sessionTime, web3AuthNetwork });
     return adapter;
   } else if (name === WALLET_ADAPTERS.TORUS_SOLANA) {
     const { SolanaWalletAdapter } = await import("@web3auth/torus-solana-adapter");
-    const adapter = new SolanaWalletAdapter({ chainConfig: finalChainConfig, clientId });
+    const adapter = new SolanaWalletAdapter({ chainConfig: finalChainConfig, clientId, sessionTime, web3AuthNetwork });
     return adapter;
   } else if (name === WALLET_ADAPTERS.METAMASK) {
     const { MetamaskAdapter } = await import("@web3auth/metamask-adapter");
-    const adapter = new MetamaskAdapter({ chainConfig: finalChainConfig, clientId });
+    const adapter = new MetamaskAdapter({ chainConfig: finalChainConfig, clientId, sessionTime, web3AuthNetwork });
     return adapter;
   } else if (name === WALLET_ADAPTERS.PHANTOM) {
     const { PhantomAdapter } = await import("@web3auth/phantom-adapter");
-    const adapter = new PhantomAdapter({ chainConfig: finalChainConfig, clientId });
+    const adapter = new PhantomAdapter({ chainConfig: finalChainConfig, clientId, sessionTime, web3AuthNetwork });
     return adapter;
   } else if (name === WALLET_ADAPTERS.WALLET_CONNECT_V1) {
     const { WalletConnectV1Adapter } = await import("@web3auth/wallet-connect-v1-adapter");
-    const adapter = new WalletConnectV1Adapter({ chainConfig: finalChainConfig, clientId });
+    const adapter = new WalletConnectV1Adapter({ chainConfig: finalChainConfig, clientId, sessionTime, web3AuthNetwork });
     return adapter;
   } else if (name === WALLET_ADAPTERS.OPENLOGIN) {
     const { OpenloginAdapter, getOpenloginDefaultOptions } = await import("@web3auth/openlogin-adapter");
     const defaultOptions = getOpenloginDefaultOptions();
     const adapter = new OpenloginAdapter({
       ...defaultOptions,
+      clientId,
       chainConfig: { ...finalChainConfig },
-      adapterSettings: { ...(defaultOptions.adapterSettings as OpenLoginOptions), clientId },
+      adapterSettings: { ...(defaultOptions.adapterSettings as OpenLoginOptions), clientId, network: web3AuthNetwork },
+      sessionTime,
+      web3AuthNetwork,
     });
     return adapter;
   }

package/src/interface.ts

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

package/src/modalManager.ts

@@ -12,7 +12,7 @@ import {
   WALLET_ADAPTERS,
 } from "@web3auth/base";
 import { Web3AuthCore, Web3AuthCoreOptions } from "@web3auth/core";
-import { getAdapterSocialLogins, LOGIN_MODAL_EVENTS, LoginModal, OPENLOGIN_PROVIDERS } from "@web3auth/ui";
+import { getAdapterSocialLogins, LOGIN_MODAL_EVENTS, LoginModal, OPENLOGIN_PROVIDERS, UIConfig } from "@web3auth/ui";
 
 import {
   defaultEvmDappModalConfig,
@@ -22,41 +22,9 @@ import {
   defaultSolanaWalletModalConfig,
 } from "./config";
 import { getDefaultAdapterModule } from "./default";
-import { AdaptersModalConfig, ModalConfig } from "./interface";
+import { AdaptersModalConfig, IWeb3AuthModal, ModalConfig } from "./interface";
 import { getUserLanguage } from "./utils";
 
-export interface UIConfig {
-  /**
-   * Logo for your app.
-   */
-  appLogo?: string;
-
-  /**
-   * theme for the modal
-   *
-   * @defaultValue `light`
-   */
-  theme?: "light" | "dark";
-
-  /**
-   * order of how login methods are shown
-   *
-   * @defaultValue `["google", "facebook", "twitter", "reddit", "discord", "twitch", "apple", "line", "github", "kakao", "linkedin", "weibo", "wechat", "email_passwordless"]`
-   */
-  loginMethodsOrder?: string[];
-
-  /**
-   * language which will be used by web3auth. app will use browser language if not specified. if language is not supported it will use "en"
-   * en: english
-   * de: german
-   * ja: japanese
-   * ko: korean
-   * zh: mandarin
-   * es: spanish
-   *
-   */
-  defaultLanguage?: string;
-}
 export interface Web3AuthOptions extends Web3AuthCoreOptions {
   /**
    * web3auth instance provides different adapters for different type of usages. If you are dapp and want to
@@ -70,16 +38,10 @@ export interface Web3AuthOptions extends Web3AuthCoreOptions {
   /**
    * Config for configuring modal ui display properties
    */
-  uiConfig?: UIConfig;
-
-  /**
-   * Whether to show errors on Web3Auth modal.
-   *
-   * @defaultValue `true`
-   */
-  displayErrorsOnModal?: boolean;
+  uiConfig?: Omit<UIConfig, "adapterListener">;
 }
-export class Web3Auth extends Web3AuthCore {
+
+export class Web3Auth extends Web3AuthCore implements IWeb3AuthModal {
   public loginModal: LoginModal;
 
   readonly options: Web3AuthOptions;
@@ -117,11 +79,12 @@ export class Web3Auth extends Web3AuthCore {
 
     this.loginModal = new LoginModal({
       theme: this.options.uiConfig?.theme,
+      appName: this.options.uiConfig?.appName || "blockchain",
       appLogo: this.options.uiConfig?.appLogo || "",
-      version: "",
       adapterListener: this,
-      displayErrorsOnModal: this.options.displayErrorsOnModal,
+      displayErrorsOnModal: this.options.uiConfig?.displayErrorsOnModal,
       defaultLanguage,
+      modalZIndex: this.options.uiConfig?.modalZIndex || "99998",
     });
     this.subscribeToLoginModalEvents();
   }
@@ -161,6 +124,8 @@ export class Web3Auth extends Web3AuthCore {
           name: adapterName,
           customChainConfig: this.options.chainConfig,
           clientId: this.options.clientId,
+          sessionTime: this.options.sessionTime,
+          web3AuthNetwork: this.options.web3AuthNetwork,
         });
 
         this.walletAdapters[adapterName] = ad;

package/src/utils.ts

@@ -10,6 +10,7 @@ export const languageMap = {
   zh: "mandarin",
   es: "spanish",
   fr: "french",
+  pt: "portuguese",
 };
 
 export const getUserLanguage = (defaultLanguage: string | undefined) => {