@web3auth/modal 10.4.0 → 10.5.1

package/dist/lib.cjs/packages/modal/src/config.js

@@ -2,7 +2,7 @@
 
 var noModal = require('@web3auth/no-modal');
 
-const version = "10.4.0";
+const version = "10.5.1";
 const defaultConnectorsModalConfig = {
   hideWalletDiscovery: false,
   connectors: {
@@ -12,8 +12,6 @@ const defaultConnectorsModalConfig = {
     }
   }
 };
-const walletRegistryUrl = "https://assets.web3auth.io/v1/wallet-registry.json";
 
 exports.defaultConnectorsModalConfig = defaultConnectorsModalConfig;
 exports.version = version;
-exports.walletRegistryUrl = walletRegistryUrl;

package/dist/lib.cjs/packages/modal/src/index.js

@@ -8,7 +8,6 @@ var noModal = require('@web3auth/no-modal');
 
 exports.defaultConnectorsModalConfig = config.defaultConnectorsModalConfig;
 exports.version = config.version;
-exports.walletRegistryUrl = config.walletRegistryUrl;
 exports.Web3Auth = modalManager.Web3Auth;
 Object.keys(noModal).forEach(function (k) {
 	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {

package/dist/lib.cjs/packages/modal/src/modalManager.js

@@ -296,7 +296,7 @@ class Web3Auth extends noModal.Web3AuthNoModal {
       web3AuthNetwork: this.options.web3AuthNetwork,
       aaProvider: (_this$options$account = this.options.accountAbstractionConfig) === null || _this$options$account === void 0 ? void 0 : _this$options$account.smartAccountType,
       authBuildEnv: this.options.authBuildEnv
-    }), noModal.fetchWalletRegistry(config.walletRegistryUrl)]);
+    }), noModal.fetchWalletRegistry(noModal.WALLET_REGISTRY_URL)]);
     // handle project config result
     if (projectConfigResult.status === "rejected") {
       const error = await auth.serializeError(projectConfigResult.reason);

package/dist/lib.cjs/packages/modal/src/react/hooks/useFunding.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var noModal = require('@web3auth/no-modal');
+var react = require('react');
+var useWalletServicesPlugin = require('./useWalletServicesPlugin.js');
+
+const useFunding = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin.useWalletServicesPlugin();
+  const [loading, setLoading] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const showFunding = react.useCallback(async showFundingParams => {
+    setLoading(true);
+    setError(null);
+    try {
+      if (!plugin) throw noModal.WalletServicesPluginError.notInitialized();
+      if (!ready) throw noModal.WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.showFunding(showFundingParams);
+    } catch (error) {
+      setError(error);
+    } finally {
+      setLoading(false);
+    }
+  }, [plugin, ready]);
+  return {
+    loading,
+    error,
+    showFunding
+  };
+};
+
+exports.useFunding = useFunding;

package/dist/lib.cjs/packages/modal/src/react/hooks/useReceive.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var noModal = require('@web3auth/no-modal');
+var react = require('react');
+var useWalletServicesPlugin = require('./useWalletServicesPlugin.js');
+
+const useReceive = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin.useWalletServicesPlugin();
+  const [loading, setLoading] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const showReceive = react.useCallback(async showReceiveParams => {
+    setLoading(true);
+    setError(null);
+    try {
+      if (!plugin) throw noModal.WalletServicesPluginError.notInitialized();
+      if (!ready) throw noModal.WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.showReceive(showReceiveParams);
+    } catch (error) {
+      setError(error);
+    } finally {
+      setLoading(false);
+    }
+  }, [plugin, ready]);
+  return {
+    loading,
+    error,
+    showReceive
+  };
+};
+
+exports.useReceive = useReceive;

package/dist/lib.cjs/packages/modal/src/react/index.js

@@ -2,8 +2,10 @@
 
 var useCheckout = require('./hooks/useCheckout.js');
 var useEnableMFA = require('./hooks/useEnableMFA.js');
+var useFunding = require('./hooks/useFunding.js');
 var useIdentityToken = require('./hooks/useIdentityToken.js');
 var useManageMFA = require('./hooks/useManageMFA.js');
+var useReceive = require('./hooks/useReceive.js');
 var useSwap = require('./hooks/useSwap.js');
 var useSwitchChain = require('./hooks/useSwitchChain.js');
 var useWalletConnectScanner = require('./hooks/useWalletConnectScanner.js');
@@ -19,8 +21,10 @@ var Web3AuthProvider = require('./Web3AuthProvider.js');
 
 exports.useCheckout = useCheckout.useCheckout;
 exports.useEnableMFA = useEnableMFA.useEnableMFA;
+exports.useFunding = useFunding.useFunding;
 exports.useIdentityToken = useIdentityToken.useIdentityToken;
 exports.useManageMFA = useManageMFA.useManageMFA;
+exports.useReceive = useReceive.useReceive;
 exports.useSwap = useSwap.useSwap;
 exports.useSwitchChain = useSwitchChain.useSwitchChain;
 exports.useWalletConnectScanner = useWalletConnectScanner.useWalletConnectScanner;

package/dist/lib.cjs/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.js

@@ -75,12 +75,12 @@ function ConnectWallet(props) {
     const buttons = [...allExternalButtons.filter(button => button.hasInjectedWallet && defaultButtonKeys.has(button.name)), ...customConnectorButtons, ...allExternalButtons.filter(button => !button.hasInjectedWallet && defaultButtonKeys.has(button.name))].sort((a, b) => {
       // favor MetaMask over other wallets
       if (a.name === noModal.WALLET_CONNECTORS.METAMASK && b.name === noModal.WALLET_CONNECTORS.METAMASK) {
-        // favor injected MetaMask over non-injected MetaMask
-        if (a.hasInjectedWallet) return -1;
-        if (b.hasInjectedWallet) return 1;
         // favor installed MetaMask over non-installed MetaMask
         if (a.isInstalled) return -1;
         if (b.isInstalled) return 1;
+        // favor injected MetaMask over non-injected MetaMask
+        if (a.hasInjectedWallet) return -1;
+        if (b.hasInjectedWallet) return 1;
         return 0;
       }
       if (a.name === noModal.WALLET_CONNECTORS.METAMASK) return -1;
@@ -159,6 +159,7 @@ function ConnectWallet(props) {
       has_wallet_registry_item: !!button.walletRegistryItem,
       total_external_wallets: allUniqueButtons.length
     });
+    noModal.log.info("handleWalletClick", button);
     // for installed wallets
     if (button.isInstalled) {
       var _button$chainNamespac2;

package/dist/lib.cjs/packages/modal/src/ui/components/ConnectWallet/ConnectWalletQrCode/ConnectWalletQrCode.js

@@ -8,6 +8,7 @@ var reactI18next = require('react-i18next');
 var reactQrcodeLogo = require('react-qrcode-logo');
 var constants = require('../../../constants.js');
 var RootContext = require('../../../context/RootContext.js');
+var interfaces = require('../../../interfaces.js');
 var localeImport = require('../../../localeImport.js');
 var Image = require('../../Image/Image.js');
 
@@ -18,7 +19,8 @@ function ConnectWalletQrCode(props) {
   });
   const {
     bodyState,
-    setBodyState
+    setBodyState,
+    setToast
   } = react.useContext(RootContext.RootContext);
   const {
     qrCodeValue,
@@ -41,8 +43,16 @@ function ConnectWalletQrCode(props) {
     className: "w3a--contents",
     children: [qrCodeValue ? jsxRuntime.jsxs("div", {
       className: "w3a--flex w3a--flex-col w3a--items-center w3a--justify-center w3a--gap-y-4 w3a--rounded-2xl w3a--border w3a--border-app-gray-200 w3a--p-4 dark:w3a--border-app-gray-700",
-      children: [jsxRuntime.jsx("div", {
-        className: "w3a--relative w3a--flex w3a--size-[300px] w3a--items-center w3a--justify-center w3a--rounded-2xl",
+      children: [jsxRuntime.jsx("button", {
+        type: "button",
+        className: "w3a--relative w3a--flex w3a--size-[300px] w3a--appearance-none w3a--items-center w3a--justify-center w3a--rounded-2xl",
+        onClick: () => {
+          navigator.clipboard.writeText(qrCodeValue);
+          setToast({
+            message: t("modal.external.qr-code-copied-to-clipboard"),
+            type: interfaces.TOAST_TYPE.SUCCESS
+          });
+        },
         children: jsxRuntime.jsx(reactQrcodeLogo.QRCode, {
           size: isDesktop ? 300 : 260,
           eyeRadius: 5,

package/dist/lib.cjs/packages/modal/src/ui/components/Login/Login.js

@@ -325,6 +325,7 @@ function Login(props) {
       has_wallet_registry_item: !!wallet.walletRegistryItem,
       total_external_wallets: totalExternalWallets
     });
+    noModal.log.info("handleInstalledWalletClick", wallet);
     // for non-injected Metamask on desktop, show QR code to connect
     if (wallet.name === noModal.WALLET_CONNECTORS.METAMASK && !wallet.hasInjectedWallet && deviceDetails.platform === "desktop") {
       handleExternalWalletClick({

package/dist/lib.cjs/packages/modal/src/ui/components/Toast/Toast.js

@@ -55,14 +55,11 @@ const Toast = () => {
           fill: "currentColor"
         })
       })
-    }), jsxRuntime.jsxs("div", {
+    }), jsxRuntime.jsx("div", {
       className: "w3a--flex w3a--items-center w3a--gap-2",
-      children: [jsxRuntime.jsx("p", {
-        className: toastIconClass[toast.type],
-        children: "x"
-      }), jsxRuntime.jsx("p", {
+      children: jsxRuntime.jsx("p", {
         children: toast.message
-      })]
+      })
     })]
   });
 };

package/dist/lib.cjs/packages/modal/src/vue/composables/useFunding.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var noModal = require('@web3auth/no-modal');
+var vue = require('vue');
+var useWalletServicesPlugin = require('./useWalletServicesPlugin.js');
+
+const useFunding = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin.useWalletServicesPlugin();
+  const loading = vue.ref(false);
+  const error = vue.ref(null);
+  const showFunding = async showFundingParams => {
+    loading.value = true;
+    error.value = null;
+    try {
+      if (!plugin) throw noModal.WalletServicesPluginError.notInitialized();
+      if (!ready) throw noModal.WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.value.showFunding(showFundingParams);
+    } catch (err) {
+      error.value = err;
+    } finally {
+      loading.value = false;
+    }
+  };
+  return {
+    loading,
+    error,
+    showFunding
+  };
+};
+
+exports.useFunding = useFunding;

package/dist/lib.cjs/packages/modal/src/vue/composables/useReceive.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var noModal = require('@web3auth/no-modal');
+var vue = require('vue');
+var useWalletServicesPlugin = require('./useWalletServicesPlugin.js');
+
+const useReceive = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin.useWalletServicesPlugin();
+  const loading = vue.ref(false);
+  const error = vue.ref(null);
+  const showReceive = async showReceiveParams => {
+    loading.value = true;
+    error.value = null;
+    try {
+      if (!plugin) throw noModal.WalletServicesPluginError.notInitialized();
+      if (!ready) throw noModal.WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.value.showReceive(showReceiveParams);
+    } catch (err) {
+      error.value = err;
+    } finally {
+      loading.value = false;
+    }
+  };
+  return {
+    loading,
+    error,
+    showReceive
+  };
+};
+
+exports.useReceive = useReceive;

package/dist/lib.cjs/packages/modal/src/vue/index.js

@@ -2,8 +2,10 @@
 
 var useCheckout = require('./composables/useCheckout.js');
 var useEnableMFA = require('./composables/useEnableMFA.js');
+var useFunding = require('./composables/useFunding.js');
 var useIdentityToken = require('./composables/useIdentityToken.js');
 var useManageMFA = require('./composables/useManageMFA.js');
+var useReceive = require('./composables/useReceive.js');
 var useSwap = require('./composables/useSwap.js');
 var useSwitchChain = require('./composables/useSwitchChain.js');
 var useWalletConnectScanner = require('./composables/useWalletConnectScanner.js');
@@ -19,8 +21,10 @@ var Web3AuthProvider = require('./Web3AuthProvider.js');
 
 exports.useCheckout = useCheckout.useCheckout;
 exports.useEnableMFA = useEnableMFA.useEnableMFA;
+exports.useFunding = useFunding.useFunding;
 exports.useIdentityToken = useIdentityToken.useIdentityToken;
 exports.useManageMFA = useManageMFA.useManageMFA;
+exports.useReceive = useReceive.useReceive;
 exports.useSwap = useSwap.useSwap;
 exports.useSwitchChain = useSwitchChain.useSwitchChain;
 exports.useWalletConnectScanner = useWalletConnectScanner.useWalletConnectScanner;

package/dist/lib.cjs/types/config.d.ts

@@ -1,4 +1,3 @@
 import { ConnectorsModalConfig } from "./interface";
 export declare const version: string;
 export declare const defaultConnectorsModalConfig: ConnectorsModalConfig;
-export declare const walletRegistryUrl = "https://assets.web3auth.io/v1/wallet-registry.json";

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

@@ -1,7 +1,9 @@
 export * from "./useCheckout";
 export * from "./useEnableMFA";
+export * from "./useFunding";
 export * from "./useIdentityToken";
 export * from "./useManageMFA";
+export * from "./useReceive";
 export * from "./useSwap";
 export * from "./useSwitchChain";
 export * from "./useWalletConnectScanner";

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

@@ -0,0 +1,8 @@
+import { BaseEmbedControllerState } from "@toruslabs/base-controllers";
+import { Web3AuthError } from "@web3auth/no-modal";
+export interface IUseFunding {
+    loading: boolean;
+    error: Web3AuthError | null;
+    showFunding: (showFundingParams?: BaseEmbedControllerState["showFunding"]) => Promise<void>;
+}
+export declare const useFunding: () => IUseFunding;

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

@@ -0,0 +1,8 @@
+import { BaseEmbedControllerState } from "@toruslabs/base-controllers";
+import { Web3AuthError } from "@web3auth/no-modal";
+export interface IUseReceive {
+    loading: boolean;
+    error: Web3AuthError | null;
+    showReceive: (showReceiveParams?: BaseEmbedControllerState["showReceive"]) => Promise<void>;
+}
+export declare const useReceive: () => IUseReceive;

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

@@ -1,7 +1,9 @@
 export * from "./useCheckout";
 export * from "./useEnableMFA";
+export * from "./useFunding";
 export * from "./useIdentityToken";
 export * from "./useManageMFA";
+export * from "./useReceive";
 export * from "./useSwap";
 export * from "./useSwitchChain";
 export * from "./useWalletConnectScanner";

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

@@ -0,0 +1,9 @@
+import { BaseEmbedControllerState } from "@toruslabs/base-controllers";
+import { Web3AuthError } from "@web3auth/no-modal";
+import { Ref } from "vue";
+export interface IUseFunding {
+    loading: Ref<boolean>;
+    error: Ref<Web3AuthError | null>;
+    showFunding: (showFundingParams?: BaseEmbedControllerState["showFunding"]) => Promise<void>;
+}
+export declare const useFunding: () => IUseFunding;

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

@@ -0,0 +1,9 @@
+import { BaseEmbedControllerState } from "@toruslabs/base-controllers";
+import { Web3AuthError } from "@web3auth/no-modal";
+import { Ref } from "vue";
+export interface IUseReceive {
+    loading: Ref<boolean>;
+    error: Ref<Web3AuthError | null>;
+    showReceive: (showReceiveParams?: BaseEmbedControllerState["showReceive"]) => Promise<void>;
+}
+export declare const useReceive: () => IUseReceive;

package/dist/lib.esm/packages/modal/src/config.js

@@ -1,6 +1,6 @@
 import { EVM_CONNECTORS } from '@web3auth/no-modal';
 
-const version = "10.4.0";
+const version = "10.5.1";
 const defaultConnectorsModalConfig = {
   hideWalletDiscovery: false,
   connectors: {
@@ -10,6 +10,5 @@ const defaultConnectorsModalConfig = {
     }
   }
 };
-const walletRegistryUrl = "https://assets.web3auth.io/v1/wallet-registry.json";
 
-export { defaultConnectorsModalConfig, version, walletRegistryUrl };
+export { defaultConnectorsModalConfig, version };

package/dist/lib.esm/packages/modal/src/index.js

@@ -1,3 +1,3 @@
-export { defaultConnectorsModalConfig, version, walletRegistryUrl } from './config.js';
+export { defaultConnectorsModalConfig, version } from './config.js';
 export { Web3Auth } from './modalManager.js';
 export * from '@web3auth/no-modal';

package/dist/lib.esm/packages/modal/src/modalManager.js

@@ -1,9 +1,9 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { serializeError } from '@web3auth/auth';
-import { Web3AuthNoModal, cloneDeep, WALLET_CONNECTORS, LOGIN_MODE, log, CONNECTOR_STATUS, sdkVersion, ANALYTICS_SDK_TYPE, withAbort, CONNECTOR_EVENTS, ANALYTICS_EVENTS, getErrorAnalyticsProperties, WalletInitializationError, fetchProjectConfig, fetchWalletRegistry, CONNECTOR_CATEGORY, CONNECTOR_NAMES, CONNECTOR_NAMESPACES } from '@web3auth/no-modal';
+import { Web3AuthNoModal, cloneDeep, WALLET_CONNECTORS, LOGIN_MODE, log, CONNECTOR_STATUS, sdkVersion, ANALYTICS_SDK_TYPE, withAbort, CONNECTOR_EVENTS, ANALYTICS_EVENTS, getErrorAnalyticsProperties, WalletInitializationError, fetchProjectConfig, fetchWalletRegistry, WALLET_REGISTRY_URL, CONNECTOR_CATEGORY, CONNECTOR_NAMES, CONNECTOR_NAMESPACES } from '@web3auth/no-modal';
 import deepmerge from 'deepmerge';
-import { defaultConnectorsModalConfig, walletRegistryUrl } from './config.js';
+import { defaultConnectorsModalConfig } from './config.js';
 import { AUTH_PROVIDERS_NAMES, AUTH_PROVIDERS, capitalizeFirstLetter } from './ui/config.js';
 import { LOGIN_MODAL_EVENTS } from './ui/interfaces.js';
 import { LoginModal } from './ui/loginModal.js';
@@ -306,7 +306,7 @@ class Web3Auth extends Web3AuthNoModal {
       web3AuthNetwork: this.options.web3AuthNetwork,
       aaProvider: (_this$options$account = this.options.accountAbstractionConfig) === null || _this$options$account === void 0 ? void 0 : _this$options$account.smartAccountType,
       authBuildEnv: this.options.authBuildEnv
-    }), fetchWalletRegistry(walletRegistryUrl)]);
+    }), fetchWalletRegistry(WALLET_REGISTRY_URL)]);
 
     // handle project config result
     if (projectConfigResult.status === "rejected") {

package/dist/lib.esm/packages/modal/src/react/hooks/useFunding.js

@@ -0,0 +1,32 @@
+import { WalletServicesPluginError } from '@web3auth/no-modal';
+import { useState, useCallback } from 'react';
+import { useWalletServicesPlugin } from './useWalletServicesPlugin.js';
+
+const useFunding = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const showFunding = useCallback(async showFundingParams => {
+    setLoading(true);
+    setError(null);
+    try {
+      if (!plugin) throw WalletServicesPluginError.notInitialized();
+      if (!ready) throw WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.showFunding(showFundingParams);
+    } catch (error) {
+      setError(error);
+    } finally {
+      setLoading(false);
+    }
+  }, [plugin, ready]);
+  return {
+    loading,
+    error,
+    showFunding
+  };
+};
+
+export { useFunding };

package/dist/lib.esm/packages/modal/src/react/hooks/useReceive.js

@@ -0,0 +1,32 @@
+import { WalletServicesPluginError } from '@web3auth/no-modal';
+import { useState, useCallback } from 'react';
+import { useWalletServicesPlugin } from './useWalletServicesPlugin.js';
+
+const useReceive = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const showReceive = useCallback(async showReceiveParams => {
+    setLoading(true);
+    setError(null);
+    try {
+      if (!plugin) throw WalletServicesPluginError.notInitialized();
+      if (!ready) throw WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.showReceive(showReceiveParams);
+    } catch (error) {
+      setError(error);
+    } finally {
+      setLoading(false);
+    }
+  }, [plugin, ready]);
+  return {
+    loading,
+    error,
+    showReceive
+  };
+};
+
+export { useReceive };

package/dist/lib.esm/packages/modal/src/react/index.js

@@ -1,7 +1,9 @@
 export { useCheckout } from './hooks/useCheckout.js';
 export { useEnableMFA } from './hooks/useEnableMFA.js';
+export { useFunding } from './hooks/useFunding.js';
 export { useIdentityToken } from './hooks/useIdentityToken.js';
 export { useManageMFA } from './hooks/useManageMFA.js';
+export { useReceive } from './hooks/useReceive.js';
 export { useSwap } from './hooks/useSwap.js';
 export { useSwitchChain } from './hooks/useSwitchChain.js';
 export { useWalletConnectScanner } from './hooks/useWalletConnectScanner.js';

package/dist/lib.esm/packages/modal/src/ui/components/ConnectWallet/ConnectWallet.js

@@ -1,5 +1,5 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import { WALLET_CONNECTORS, ANALYTICS_EVENTS } from '@web3auth/no-modal';
+import { WALLET_CONNECTORS, ANALYTICS_EVENTS, log } from '@web3auth/no-modal';
 import { useContext, useState, useMemo } from 'react';
 import { CONNECT_WALLET_PAGES } from '../../constants.js';
 import { AnalyticsContext } from '../../context/AnalyticsContext.js';
@@ -73,12 +73,12 @@ function ConnectWallet(props) {
     const buttons = [...allExternalButtons.filter(button => button.hasInjectedWallet && defaultButtonKeys.has(button.name)), ...customConnectorButtons, ...allExternalButtons.filter(button => !button.hasInjectedWallet && defaultButtonKeys.has(button.name))].sort((a, b) => {
       // favor MetaMask over other wallets
       if (a.name === WALLET_CONNECTORS.METAMASK && b.name === WALLET_CONNECTORS.METAMASK) {
-        // favor injected MetaMask over non-injected MetaMask
-        if (a.hasInjectedWallet) return -1;
-        if (b.hasInjectedWallet) return 1;
         // favor installed MetaMask over non-installed MetaMask
         if (a.isInstalled) return -1;
         if (b.isInstalled) return 1;
+        // favor injected MetaMask over non-injected MetaMask
+        if (a.hasInjectedWallet) return -1;
+        if (b.hasInjectedWallet) return 1;
         return 0;
       }
       if (a.name === WALLET_CONNECTORS.METAMASK) return -1;
@@ -158,6 +158,7 @@ function ConnectWallet(props) {
       has_wallet_registry_item: !!button.walletRegistryItem,
       total_external_wallets: allUniqueButtons.length
     });
+    log.info("handleWalletClick", button);
 
     // for installed wallets
     if (button.isInstalled) {

package/dist/lib.esm/packages/modal/src/ui/components/ConnectWallet/ConnectWalletQrCode/ConnectWalletQrCode.js

@@ -5,6 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { QRCode } from 'react-qrcode-logo';
 import { WALLET_CONNECT_LOGO } from '../../../constants.js';
 import { RootContext } from '../../../context/RootContext.js';
+import { TOAST_TYPE } from '../../../interfaces.js';
 import i18nInstance from '../../../localeImport.js';
 import Image from '../../Image/Image.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -16,7 +17,8 @@ function ConnectWalletQrCode(props) {
   });
   const {
     bodyState,
-    setBodyState
+    setBodyState,
+    setToast
   } = useContext(RootContext);
   const {
     qrCodeValue,
@@ -39,8 +41,16 @@ function ConnectWalletQrCode(props) {
     className: "w3a--contents",
     children: [qrCodeValue ? /*#__PURE__*/jsxs("div", {
       className: "w3a--flex w3a--flex-col w3a--items-center w3a--justify-center w3a--gap-y-4 w3a--rounded-2xl w3a--border w3a--border-app-gray-200 w3a--p-4 dark:w3a--border-app-gray-700",
-      children: [/*#__PURE__*/jsx("div", {
-        className: "w3a--relative w3a--flex w3a--size-[300px] w3a--items-center w3a--justify-center w3a--rounded-2xl",
+      children: [/*#__PURE__*/jsx("button", {
+        type: "button",
+        className: "w3a--relative w3a--flex w3a--size-[300px] w3a--appearance-none w3a--items-center w3a--justify-center w3a--rounded-2xl",
+        onClick: () => {
+          navigator.clipboard.writeText(qrCodeValue);
+          setToast({
+            message: t("modal.external.qr-code-copied-to-clipboard"),
+            type: TOAST_TYPE.SUCCESS
+          });
+        },
         children: /*#__PURE__*/jsx(QRCode, {
           size: isDesktop ? 300 : 260,
           eyeRadius: 5,

package/dist/lib.esm/packages/modal/src/ui/components/Login/Login.js

@@ -327,6 +327,7 @@ function Login(props) {
       has_wallet_registry_item: !!wallet.walletRegistryItem,
       total_external_wallets: totalExternalWallets
     });
+    log.info("handleInstalledWalletClick", wallet);
     // for non-injected Metamask on desktop, show QR code to connect
     if (wallet.name === WALLET_CONNECTORS.METAMASK && !wallet.hasInjectedWallet && deviceDetails.platform === "desktop") {
       handleExternalWalletClick({

package/dist/lib.esm/packages/modal/src/ui/components/Toast/Toast.js

@@ -53,14 +53,11 @@ const Toast = () => {
           fill: "currentColor"
         })
       })
-    }), /*#__PURE__*/jsxs("div", {
+    }), /*#__PURE__*/jsx("div", {
       className: "w3a--flex w3a--items-center w3a--gap-2",
-      children: [/*#__PURE__*/jsx("p", {
-        className: toastIconClass[toast.type],
-        children: "x"
-      }), /*#__PURE__*/jsx("p", {
+      children: /*#__PURE__*/jsx("p", {
         children: toast.message
-      })]
+      })
     })]
   });
 };

package/dist/lib.esm/packages/modal/src/vue/composables/useFunding.js

@@ -0,0 +1,32 @@
+import { WalletServicesPluginError } from '@web3auth/no-modal';
+import { ref } from 'vue';
+import { useWalletServicesPlugin } from './useWalletServicesPlugin.js';
+
+const useFunding = () => {
+  const {
+    plugin,
+    ready
+  } = useWalletServicesPlugin();
+  const loading = ref(false);
+  const error = ref(null);
+  const showFunding = async showFundingParams => {
+    loading.value = true;
+    error.value = null;
+    try {
+      if (!plugin) throw WalletServicesPluginError.notInitialized();
+      if (!ready) throw WalletServicesPluginError.walletPluginNotConnected();
+      await plugin.value.showFunding(showFundingParams);
+    } catch (err) {
+      error.value = err;
+    } finally {
+      loading.value = false;
+    }
+  };
+  return {
+    loading,
+    error,
+    showFunding
+  };
+};
+
+export { useFunding };