@embarkai/ui-kit 0.4.105 → 0.4.107

package/dist/index.d.cts

@@ -2736,6 +2736,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;
@@ -3323,6 +3324,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;
@@ -3910,6 +3912,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;

package/dist/index.d.ts

@@ -2736,6 +2736,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;
@@ -3323,6 +3324,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;
@@ -3910,6 +3912,7 @@ declare const PASSPORT_TRANSLATIONS: {
             connectMenu: {
                 connectWallet: string;
                 noWallets: string;
+                requestPending: string;
                 instructions: {
                     follow: string;
                     confirm: string;

package/dist/index.js

@@ -7554,6 +7554,7 @@ var init_en = __esm({
       connectMenu: {
         connectWallet: "Connect Wallet Profile",
         noWallets: "No wallets available to connect",
+        requestPending: "{{wallet}} already has a pending request from this site. Open {{wallet}}, reject or close that request, then try again.",
         instructions: {
           follow: "Watch your connecting wallet app.\nYou will be asked to:\n {{steps}}",
           confirm: "- 1. Confirm your wallet connection into embarkAI",
@@ -8146,6 +8147,7 @@ var init_ru = __esm({
       connectMenu: {
         connectWallet: "\u041F\u043E\u0434\u043A\u043B\u044E\u0447\u0438\u0442\u044C \u043F\u0440\u043E\u0444\u0438\u043B\u044C \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430",
         noWallets: "\u041D\u0435\u0442 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0445 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u043E\u0432 \u0434\u043B\u044F \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u044F",
+        requestPending: "\u0412 {{wallet}} \u0443\u0436\u0435 \u0432\u0438\u0441\u0438\u0442 \u0437\u0430\u043F\u0440\u043E\u0441 \u043E\u0442 \u044D\u0442\u043E\u0433\u043E \u0441\u0430\u0439\u0442\u0430. \u041E\u0442\u043A\u0440\u043E\u0439\u0442\u0435 {{wallet}}, \u043E\u0442\u043A\u043B\u043E\u043D\u0438\u0442\u0435 \u0438\u043B\u0438 \u0437\u0430\u043A\u0440\u043E\u0439\u0442\u0435 \u044D\u0442\u043E\u0442 \u0437\u0430\u043F\u0440\u043E\u0441 \u0438 \u043F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u0441\u043D\u043E\u0432\u0430.",
         instructions: {
           follow: "\u0421\u043B\u0435\u0434\u0438\u0442\u0435 \u0437\u0430 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0430\u0435\u043C\u044B\u043C \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435\u043C \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430.\n\u0412\u0430\u043C \u0431\u0443\u0434\u0435\u0442 \u043F\u0440\u0435\u0434\u043B\u043E\u0436\u0435\u043D\u043E:\n {{steps}}",
           confirm: "- 1. \u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u043A embarkAI",
@@ -8738,6 +8740,7 @@ var init_zh = __esm({
       connectMenu: {
         connectWallet: "\u8FDE\u63A5\u94B1\u5305\u914D\u7F6E\u6587\u4EF6",
         noWallets: "\u6CA1\u6709\u53EF\u8FDE\u63A5\u7684\u94B1\u5305",
+        requestPending: "{{wallet}} \u4E2D\u5DF2\u6709\u6765\u81EA\u672C\u7F51\u7AD9\u7684\u5F85\u5904\u7406\u8BF7\u6C42\u3002\u8BF7\u6253\u5F00 {{wallet}}\uFF0C\u62D2\u7EDD\u6216\u5173\u95ED\u8BE5\u8BF7\u6C42\uFF0C\u7136\u540E\u91CD\u8BD5\u3002",
         instructions: {
           follow: "\u8BF7\u67E5\u770B\u60A8\u6B63\u5728\u8FDE\u63A5\u7684\u94B1\u5305\u5E94\u7528\u3002\n\u60A8\u5C06\u88AB\u8981\u6C42\uFF1A\n {{steps}}",
           confirm: "- 1. \u786E\u8BA4\u5C06\u60A8\u7684\u94B1\u5305\u8FDE\u63A5\u5230 embarkAI",
@@ -16737,6 +16740,7 @@ var init_useLinkTelegram = __esm({
 
 // src/internal/components/ManageWalletMenu/ProviderCard.tsx
 import { Clock, Link2Icon, LoaderIcon as LoaderIcon8, Trash2Icon, UnplugIcon } from "lucide-react";
+import { useConnections } from "wagmi";
 import { Fragment as Fragment18, jsx as jsx71, jsxs as jsxs62 } from "react/jsx-runtime";
 function getProviderCaption(provider) {
   const providerName = provider.provider;
@@ -16759,16 +16763,19 @@ function getProviderCaption(provider) {
 function ProviderCard(props) {
   const { provider, meta, externalId, disabled } = props;
   const { t } = useT();
-  const externalWalletAddress = useExternalWalletStore((st) => st.externalAddress);
+  const connections = useConnections();
   const {
     mutate: connectExternalWallet,
     disconnect: disconnectExternalWallet,
     isPending: isConnectingExternalWallet,
     variables: pendingConnectVariables,
     isAvailable: isConnectExternalWalletAvailable
-  } = useExternalWalletConnnect();
-  const setPage = useLayoutDataStore((st) => st.setPage);
-  const setConfirmUnlink = useManageWalletStore((st) => st.setConfirmUnlink);
+  } = useExternalWalletConnnect({
+    // onSuccess: undefined,
+    onError: ({ connector, error }) => {
+      console.warn("[useExternalWalletConnect]", connector, error);
+    }
+  });
   const { data: providers = [] } = useProvidersList();
   if (!provider) {
     console.warn("[ProviderCard] Received undefined provider");
@@ -16781,7 +16788,7 @@ function ProviderCard(props) {
   };
   const info = getProviderDisplayInfo(provider);
   const allowUnlink = canUnlink(props);
-  const isWalletProviderConnected = !!externalWalletAddress && provider === "wallet" && externalWalletAddress === externalId;
+  const isWalletProviderConnected = provider === "wallet" && connections.some((c) => c.accounts.includes(externalId));
   const IconComponent = provider === "wallet" ? WALLET_ICONS[meta?.walletType || "default"] || WALLET_ICONS.default : info.icon;
   return /* @__PURE__ */ jsxs62("div", { className: "w-full flex items-center justify-between gap-[var(--ui-kit-gap)]", children: [
     /* @__PURE__ */ jsx71(
@@ -16859,8 +16866,8 @@ function ProviderCard(props) {
           disabled: disabled || isConnectingExternalWallet,
           title: t("passport:common.delete"),
           onClick: () => {
-            setConfirmUnlink({ provider, providerName: info.name, externalId });
-            setPage("unlink-provider" /* UNLINK_PROVIDER */);
+            useManageWalletStore.getState().setConfirmUnlink({ provider, providerName: info.name, externalId });
+            useLayoutDataStore.getState().setPage("unlink-provider" /* UNLINK_PROVIDER */);
           },
           children: /* @__PURE__ */ jsx71(Trash2Icon, { className: "w-4 h-4 text-[var(--ui-kit-bg-error)]" })
         }
@@ -16874,7 +16881,6 @@ var init_ProviderCard = __esm({
     init_useT();
     init_wallets();
     init_types();
-    init_useExternalWalletStore();
     init_cn();
     init_ConnectExternalWalletMenu2();
     init_button();
@@ -17269,26 +17275,67 @@ var init_useHasInjectedWallet = __esm({
 import { useMutation as useMutation10, useQuery as useQuery9, useQueryClient as useQueryClient14 } from "@tanstack/react-query";
 import { ArrowLeft as ArrowLeft8, Loader as Loader11, Wallet2Icon as Wallet2Icon2 } from "lucide-react";
 import { useCallback as useCallback17, useMemo as useMemo9, useState as useState14 } from "react";
-import { useConnect, useConnectors, useDisconnect as useDisconnect2, useSignMessage } from "wagmi";
+import {
+  useConfig,
+  useConnect,
+  useConnections as useConnections2,
+  useConnectors,
+  useDisconnect as useDisconnect2,
+  useSignMessage,
+  useSwitchChain,
+  useSwitchConnection
+} from "wagmi";
+import { mainnet } from "wagmi/chains";
 import { jsx as jsx74, jsxs as jsxs65 } from "react/jsx-runtime";
 function getConnectFlowType(params) {
   const { isEmbarkAI, connectFlow } = params;
   if (!isEmbarkAI) return "auth";
   return connectFlow;
 }
+function someInErrorChain(error, predicate) {
+  let current = error;
+  for (let depth = 0; current && depth < 10; depth++) {
+    if (predicate(current)) return true;
+    current = current.cause;
+  }
+  return false;
+}
 function ConnectExternalWalletMenu() {
   const { config, callbacksRef } = useProviderConfig();
   const allowedWallets = config.current?.wallet?.allowedWallets;
   const walletMode = config.current?.wallet?.mode || "both";
   const qc = useQueryClient14();
   const { t } = useT();
-  const { address: embarkAiAddress } = useSession();
-  const { open: openEmbarkAI, close: closeEmbarkAI } = useOpenPage();
+  const embarkAiAddress = useSession((st) => st.address);
+  const { close: closeEmbarkAI } = useOpenPage();
   const menuParams = useConnectExternalWalletMenuParams();
   const connectors = useConnectors();
   const hasInjectedWallet2 = useHasInjectedWallet();
-  const { mutate: disconnect } = useDisconnect2();
+  const wagmiConfig3 = useConfig();
+  const connections = useConnections2();
+  const { mutate: disconnect, mutateAsync: disconnectAsync } = useDisconnect2();
   const { mutateAsync: signMessageAsync } = useSignMessage();
+  const { mutateAsync: switchChainAsync } = useSwitchChain();
+  const { mutateAsync: switchConnectionAsync } = useSwitchConnection();
+  const [isPreparingConnect, setIsPreparingConnect] = useState14(false);
+  const signOnSupportedChain = async (params) => {
+    const { connector, account, message } = params;
+    const signOnce = async (viaFallback = false) => {
+      let chainId = await connector.getChainId();
+      if (viaFallback) {
+        await switchChainAsync({ connector, chainId: SIGN_FALLBACK_CHAIN_ID });
+        chainId = SIGN_FALLBACK_CHAIN_ID;
+      }
+      const signature = await signMessageAsync({ connector, account, message });
+      return { chainId, signature };
+    };
+    try {
+      return await signOnce(false);
+    } catch (error) {
+      if (!isUnsupportedChainError(error)) throw error;
+      return await signOnce(true);
+    }
+  };
   const walletMenuOpenedFrom = useLayoutDataStore((st) => st.walletMenuOpenedFrom);
   const { data: providers = [] } = useQuery9({
     retry: false,
@@ -17308,7 +17355,24 @@ function ConnectExternalWalletMenu() {
       callbacksRef.current?.onAccountUpdate?.({ providers: providers2 });
     }
   });
-  const { mutateAsync: loginOrLinkOrConnectWallet, isPending: isLoginOrLinkOrConnectWallet } = useMutation10({
+  const keepOrReleaseExternalWallet = (connector, address, chainId) => {
+    if (walletMode === "direct" || walletMode === "both") {
+      useExternalWalletStore.getState().setExternalWallet({
+        address,
+        chainId,
+        connectorName: connector.name || "Unknown Wallet"
+      });
+    } else {
+      disconnect();
+      const { externalAddress, clearExternalWallet } = useExternalWalletStore.getState();
+      if (!!externalAddress) clearExternalWallet();
+    }
+  };
+  const completeExternalConnect = (connector, address, chainId) => {
+    useLayoutDataStore.getState().setPage(walletMenuOpenedFrom || "manage-wallet" /* MANAGE_WALLET */);
+    keepOrReleaseExternalWallet(connector, address, chainId);
+  };
+  const { mutateAsync: loginOrLinkWallet, isPending: isLoginOrLinkWallet } = useMutation10({
     mutationFn: async (payload) => {
       const { walletData, connectFlowType } = payload;
       switch (connectFlowType) {
@@ -17323,13 +17387,9 @@ function ConnectExternalWalletMenu() {
           await linkWallet(walletData);
           await onLinkingComplete(true);
           return { linked: true, message: `Address ${walletData.address} linked` };
-        // Connect external wallet flow, only if embarkAI is connected
-        case "connect":
-          return null;
       }
     },
     onSuccess: async (response, { walletData, connector, connectFlowType }) => {
-      let shouldKeepConnected = walletMode === "direct" || walletMode === "both";
       switch (connectFlowType) {
         case "auth":
           useLayoutDataStore.getState().setPendingWalletLogin(response);
@@ -17339,23 +17399,11 @@ function ConnectExternalWalletMenu() {
           const { linked, message } = response || {};
           if (!linked && message.includes("already linked")) {
             console.warn("[LINK STATUS] already linked", response);
-            useManageWalletStore.getState().setProviderType(null);
-            useLayoutDataStore.getState().setPage(walletMenuOpenedFrom || "manage-wallet" /* MANAGE_WALLET */);
+            await onLinkingComplete(false);
           }
           break;
-        case "connect":
-          useLayoutDataStore.getState().setPage(walletMenuOpenedFrom || "main-menu" /* MAIN_MENU */);
-          break;
-      }
-      if (shouldKeepConnected && walletData.chainId && connector) {
-        useExternalWalletStore.getState().setExternalWallet({
-          address: walletData.address,
-          chainId: walletData.chainId,
-          connectorName: connector.name || "Unknown Wallet"
-        });
-      } else {
-        disconnect();
       }
+      keepOrReleaseExternalWallet(connector, walletData.address, walletData.chainId);
       useLayoutStore.getState().setIsDialogForced(false);
     },
     onError: async (err, { walletData, connectFlowType }) => {
@@ -17370,9 +17418,6 @@ function ConnectExternalWalletMenu() {
           useManageWalletStore.getState().setAlert({ title: "Error", message: errorMsg });
           await onLinkingComplete(false);
           break;
-        case "connect":
-          openEmbarkAI(walletMenuOpenedFrom || "main-menu" /* MAIN_MENU */);
-          break;
       }
     }
   });
@@ -17382,75 +17427,75 @@ function ConnectExternalWalletMenu() {
     variables: pendingConnectVariables
   } = useConnect({
     mutation: {
-      onSuccess: async (connectionData, { connector }) => {
-        const { chainId, accounts } = connectionData;
-        const projectId = config.current?.projectId;
-        const projectName = projectId ? await fetchProjectName(projectId) : "EmbarkAI";
+      onSuccess: async ({ chainId, accounts }, variables) => {
+        const connector = variables.connector;
         const signingWalletAddress = accounts[0];
         const connectFlowType = getConnectFlowType({
           isEmbarkAI: !!embarkAiAddress,
           connectFlow: menuParams.current?.connectFlowType || "auth"
         });
-        let message;
-        let signature;
-        switch (connectFlowType) {
-          case "auth":
-            message = createLoginMessage(signingWalletAddress, projectName);
-            signature = await signMessageAsync({ message, account: signingWalletAddress });
-            break;
-          case "link":
-            message = createSignatureMessage(signingWalletAddress, projectName);
-            signature = await signMessageAsync({ message, account: signingWalletAddress });
-            break;
-          case "connect":
-            message = "UNUSED_MESSAGE";
-            signature = "0xUNUSED_SIGNATURE";
-            break;
-        }
-        if (!message || !signature) {
-          throw new Error("Failed to get sign message & signature");
+        if (connectFlowType === "connect") {
+          completeExternalConnect(connector, signingWalletAddress, chainId);
+          useLayoutStore.getState().setIsDialogForced(false);
+          return;
         }
-        await loginOrLinkOrConnectWallet({
+        const projectId = config.current?.projectId;
+        const projectName = projectId ? await fetchProjectName(projectId) : "EmbarkAI";
+        const createMessage = connectFlowType === "auth" ? createLoginMessage : createSignatureMessage;
+        const message = createMessage(signingWalletAddress, projectName);
+        const { signature, chainId: signedChainId } = await signOnSupportedChain({
+          connector,
+          account: signingWalletAddress,
+          message
+        });
+        await loginOrLinkWallet({
           connector,
           connectFlowType,
           walletData: {
-            chainId,
+            chainId: signedChainId,
             address: signingWalletAddress,
             signature,
             message,
-            walletName: connector?.name || "Unknown Wallet",
-            // @ts-expect-error id exists
-            walletType: connector?.id || "unknown"
+            walletName: connector.name || "Unknown Wallet",
+            walletType: connector.id || "unknown"
           }
         });
       },
-      onError: (error, { connector }) => {
-        const connectFlowType = getConnectFlowType({
-          isEmbarkAI: !!embarkAiAddress,
-          connectFlow: menuParams.current?.connectFlowType || "auth"
-        });
-        const setPage = useLayoutDataStore.getState().setPage;
-        setTimeout(() => {
-          switch (connectFlowType) {
-            case "auth":
-              setConnectError(error?.message || "Failed to connect wallet");
-              break;
-            case "link":
-              setPage("manage-wallet" /* MANAGE_WALLET */);
-              useManageWalletStore.getState().setAlert({
-                title: `Failed to connect: ${connector.name}`,
-                message: error?.message || "Failed to connect wallet before linking"
-              });
-              break;
-            case "connect":
-              setConnectError(error?.message || "Failed to connect wallet");
-              break;
-          }
-          useLayoutStore.getState().setIsDialogForced(false);
-        }, 100);
-      }
+      onError: (error, { connector }) => reportConnectError(error, connector)
     }
   });
+  function reportConnectError(error, connector) {
+    const connectFlowType = getConnectFlowType({
+      isEmbarkAI: !!embarkAiAddress,
+      connectFlow: menuParams.current?.connectFlowType || "auth"
+    });
+    const isRequestPending = isRequestPendingError(error);
+    if (!isRequestPending && connectFlowType !== "connect" && wagmiConfig3.state.connections.has(connector.uid)) {
+      disconnect({ connector });
+    }
+    const errorMessage = isRequestPending ? (
+      // @ts-expect-error i18n typing
+      t("passport:connectMenu.requestPending", { wallet: connector.name })
+    ) : error?.message;
+    setTimeout(() => {
+      switch (connectFlowType) {
+        case "auth":
+          setConnectError(errorMessage || "Failed to connect wallet");
+          break;
+        case "link":
+          useLayoutDataStore.getState().setPage("manage-wallet" /* MANAGE_WALLET */);
+          useManageWalletStore.getState().setAlert({
+            title: `Failed to connect: ${connector.name}`,
+            message: errorMessage || "Failed to connect wallet before linking"
+          });
+          break;
+        case "connect":
+          setConnectError(errorMessage || "Failed to connect wallet");
+          break;
+      }
+      useLayoutStore.getState().setIsDialogForced(false);
+    }, 100);
+  }
   const visibleConnectors = useMemo9(() => {
     const seen = /* @__PURE__ */ new Set();
     const unique = connectors.filter((connector) => {
@@ -17490,8 +17535,8 @@ function ConnectExternalWalletMenu() {
           variant: "ghost",
           size: "icon",
           title: t("passport:common.back"),
-          disabled: isConnectingExternalWallet || isLoginOrLinkOrConnectWallet,
-          onClick: () => useLayoutDataStore.getState().setPage(walletMenuOpenedFrom ?? "main-menu" /* MAIN_MENU */),
+          disabled: isConnectingExternalWallet || isLoginOrLinkWallet,
+          onClick: () => useLayoutDataStore.getState().setPage(walletMenuOpenedFrom ?? "manage-wallet" /* MANAGE_WALLET */),
           children: /* @__PURE__ */ jsx74(ArrowLeft8, { className: "h-4 w-4" })
         }
       ),
@@ -17507,14 +17552,32 @@ function ConnectExternalWalletMenu() {
           variant: "secondary",
           size: "large",
           className: "w-full justify-center",
-          disabled: isConnectingExternalWallet,
+          disabled: isConnectingExternalWallet || isPreparingConnect || isLoginOrLinkWallet,
           onClick: async () => {
             if (connectError) setConnectError(null);
+            const connectFlowType = getConnectFlowType({
+              isEmbarkAI: !!embarkAiAddress,
+              connectFlow: menuParams.current?.connectFlowType || "auth"
+            });
+            setIsPreparingConnect(true);
             try {
-              disconnect();
-            } catch {
+              const existingConnection = connections.find((c) => c.connector.uid === connector.uid);
+              if (connectFlowType === "connect" && existingConnection?.accounts[0]) {
+                await switchConnectionAsync({ connector });
+                completeExternalConnect(connector, existingConnection.accounts[0], existingConnection.chainId);
+                useLayoutStore.getState().setIsDialogForced(false);
+                return;
+              }
+              const connectionsToDrop = connections.filter((c) => c.connector.uid === connector.uid);
+              for (const { connector: connectedConnector } of connectionsToDrop) {
+                await disconnectAsync({ connector: connectedConnector });
+              }
+            } catch (error) {
+              reportConnectError(error, connector);
+              return;
+            } finally {
+              setIsPreparingConnect(false);
             }
-            await new Promise((resolve) => setTimeout(resolve, 500));
             switch (true) {
               case (connector.id === "metaMaskSDK" && !hasInjectedWallet2):
                 closeEmbarkAI();
@@ -17566,6 +17629,7 @@ function ConnectExternalWalletMenu() {
     ] })
   ] });
 }
+var SIGN_FALLBACK_CHAIN_ID, REQUEST_PENDING_ERROR_CODE, isRequestPendingError, isUnsupportedChainError;
 var init_ConnectExternalWalletMenu = __esm({
   "src/internal/components/ConnectExternalWalletMenu/ConnectExternalWalletMenu.tsx"() {
     init_ProviderContext();
@@ -17585,13 +17649,18 @@ var init_ConnectExternalWalletMenu = __esm({
     init_highlight();
     init_useConnectExternalWalletMenuParams();
     init_useHasInjectedWallet();
+    SIGN_FALLBACK_CHAIN_ID = mainnet.id;
+    REQUEST_PENDING_ERROR_CODE = -32002;
+    isRequestPendingError = (error) => someInErrorChain(error, (e) => e.code === REQUEST_PENDING_ERROR_CODE);
+    isUnsupportedChainError = (error) => someInErrorChain(error, (e) => typeof e.message === "string" && e.message.includes("supportedNetworks"));
   }
 });
 
 // src/internal/components/ConnectExternalWalletMenu/useExternalWalletConnect.ts
 import { useCallback as useCallback18 } from "react";
 import { useConnect as useConnect2, useConnectors as useConnectors2, useDisconnect as useDisconnect3 } from "wagmi";
-function useExternalWalletConnnect() {
+function useExternalWalletConnnect(options) {
+  const { onSuccess, onError } = options || {};
   const { config } = useProviderConfig();
   const walletMode = config.current?.wallet?.mode;
   const connectors = useConnectors2();
@@ -17606,9 +17675,15 @@ function useExternalWalletConnnect() {
           chainId,
           connectorName: connector.name || "Unknown Wallet"
         });
+        onSuccess?.({ connected: true, address: signingWalletAddress });
         useLayoutStore.getState().setIsDialogForced(false);
       },
-      onError: (error, variables) => {
+      onError: (error, { connector }) => {
+        onError?.({
+          connected: false,
+          connector: connector?.name || "Unknown Wallet",
+          error
+        });
         useLayoutStore.getState().setIsDialogForced(false);
       }
     }
@@ -25340,13 +25415,13 @@ var init_useOperationHashesStore = __esm({
 // src/internal/components/SendMenu/hyperbridge/hooks/useBridge.ts
 import { useMutation as useMutation20, useQueryClient as useQueryClient25 } from "@tanstack/react-query";
 import { useCallback as useCallback28 } from "react";
-import { useSwitchChain, useWalletClient } from "wagmi";
+import { useSwitchChain as useSwitchChain2, useWalletClient } from "wagmi";
 function useBridge() {
   const qc = useQueryClient25();
   const { t } = useT();
   const address = useSession((st) => st.address);
   const { data: walletClient } = useWalletClient();
-  const { mutateAsync: switchChainAsync } = useSwitchChain();
+  const { mutateAsync: switchChainAsync } = useSwitchChain2();
   const swapDirection = useCallback28(() => {
     const {
       // bridgeStep,
@@ -25818,7 +25893,7 @@ import { CHAINS_BROWSERS_TRANSPORTS as CHAINS_BROWSERS_TRANSPORTS2 } from "@emba
 import { useQuery as useQuery25, useQueryClient as useQueryClient26 } from "@tanstack/react-query";
 import { useCallback as useCallback29, useEffect as useEffect45 } from "react";
 import { createPublicClient as createPublicClient2, erc20Abi as erc20Abi3, formatUnits as formatUnits9, http as http3 } from "viem";
-import { useSwitchChain as useSwitchChain2 } from "wagmi";
+import { useSwitchChain as useSwitchChain3 } from "wagmi";
 function useBridgeBalance(isLoadingWarpRoutes, hyperlaneWarpRoutes) {
   const qc = useQueryClient26();
   const { t } = useT();
@@ -25826,7 +25901,7 @@ function useBridgeBalance(isLoadingWarpRoutes, hyperlaneWarpRoutes) {
   const activeChainId = useSession((st) => st.activeChainId);
   const directWalletAddress = useExternalWalletStore((st) => st.externalAddress);
   const directWalletChainId = useExternalWalletStore((st) => st.externalChainId);
-  const { mutateAsync: switchChainAsync } = useSwitchChain2();
+  const { mutateAsync: switchChainAsync } = useSwitchChain3();
   const hyperRoute = useBridgeStore((st) => st.hyperRoute);
   const bridgeSender = useBridgeStore((st) => st.bridgeSender);
   const originChain = useBridgeStore((st) => st.originChain);
@@ -29847,7 +29922,7 @@ var init_package = __esm({
   "package.json"() {
     package_default = {
       name: "@embarkai/ui-kit",
-      version: "0.4.105",
+      version: "0.4.107",
       description: "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
       type: "module",
       main: "./dist/index.cjs",
@@ -30608,12 +30683,12 @@ var init_Dialog2 = __esm({
 
 // src/internal/components/DirectWalletHandler.tsx
 import { useEffect as useEffect55 } from "react";
-import { useConnection as useConnection2 } from "wagmi";
+import { useConnection } from "wagmi";
 function DirectWalletHandler() {
   const walletMode = useProviderConfig().config.current?.wallet?.mode || "both";
   const externalAddress = useExternalWalletStore((st) => st.externalAddress);
   const isExternalConnected = useExternalWalletStore((st) => st.isExternalConnected);
-  const { address, isConnected, chain, connector } = useConnection2();
+  const { address, isConnected, chain, connector } = useConnection();
   useEffect55(() => {
     const { setConfigMode, setActiveMode } = useExternalWalletStore.getState();
     setConfigMode(walletMode);
@@ -34387,12 +34462,12 @@ function useDirectWallet() {
 init_useExternalWalletStore();
 import { useCallback as useCallback40, useState as useState39 } from "react";
 import { isAddress as isAddress4, parseEther as parseEther3 } from "viem";
-import { useSendTransaction as useWagmiSendTransaction, useSwitchChain as useSwitchChain3 } from "wagmi";
+import { useSendTransaction as useWagmiSendTransaction, useSwitchChain as useSwitchChain4 } from "wagmi";
 function useSendDirectTransaction() {
   const isConnected = useExternalWalletStore((st) => st.isExternalConnected);
   const externalChainId = useExternalWalletStore((st) => st.externalChainId);
   const { sendTransactionAsync } = useWagmiSendTransaction();
-  const { switchChainAsync } = useSwitchChain3();
+  const { switchChainAsync } = useSwitchChain4();
   const [isPending, setIsPending] = useState39(false);
   const [error, setError] = useState39(null);
   const [txHash, setTxHash] = useState39(null);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embarkai/ui-kit",
-  "version": "0.4.105",
+  "version": "0.4.107",
   "description": "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
   "type": "module",
   "main": "./dist/index.cjs",