@embarkai/ui-kit 0.4.109 → 0.4.111

package/dist/iframe/index.html

@@ -15,7 +15,7 @@
     <meta http-equiv="X-Content-Type-Options" content="nosniff" />
     <meta http-equiv="Referrer-Policy" content="strict-origin-when-cross-origin" />
 
-    <title>EmbarkAI Secure Wallet - iframe version 0.4.109</title>
+    <title>EmbarkAI Secure Wallet - iframe version 0.4.111</title>
 
     <!-- Styles will be injected by build process -->
     <style>

package/dist/iframe/main.js

@@ -6342,7 +6342,7 @@ var SigningManager = class extends TokenRefreshApiClient {
 };
 
 // src/iframe/main.ts
-var IFRAME_VERSION = "0.4.109";
+var IFRAME_VERSION = "0.4.111";
 var IframeWallet = class {
   // private finchpay: FinchPayRampAPI
   // private rampnow: RampnowOnrampAPI

package/dist/index.cjs

@@ -17635,14 +17635,7 @@ function ConnectExternalWalletMenu() {
             } finally {
               setIsPreparingConnect(false);
             }
-            switch (true) {
-              case (connector.id === "metaMaskSDK" && !hasInjectedWallet2):
-                closeEmbarkAI();
-                break;
-              default:
-                useLayoutStore.getState().setIsDialogForced(true);
-                break;
-            }
+            useLayoutStore.getState().setIsDialogForced(true);
             try {
               await connect({ connector });
             } catch {
@@ -17724,66 +17717,73 @@ function useExternalWalletConnnect(options) {
   const walletMode = config.current?.wallet?.mode;
   const wagmiConfig3 = (0, import_wagmi4.useConfig)();
   const connectors = (0, import_wagmi4.useConnectors)();
-  const { mutate: disconnect } = (0, import_wagmi4.useDisconnect)();
-  const { mutate: connect, ...restUseConnect } = (0, import_wagmi4.useConnect)({
-    mutation: {
-      onSuccess: (connectionData, { connector }) => {
-        const { chainId, accounts } = connectionData;
-        const signingWalletAddress = accounts[0];
-        useExternalWalletStore.getState().setExternalWallet({
-          address: signingWalletAddress,
-          chainId,
-          connectorName: connector.name || "Unknown Wallet"
-        });
-        onSuccess?.({ connected: true, address: signingWalletAddress });
-        useLayoutStore.getState().setIsDialogForced(false);
-      },
-      onError: async (error, { connector }) => {
-        await dropFailedConnectorSession(error, connector, wagmiConfig3);
-        onError?.({
-          connected: false,
-          connector: connector?.name || "Unknown Wallet",
-          error
-        });
-        useLayoutStore.getState().setIsDialogForced(false);
-      }
-    }
-  });
-  const disconnectExternalWallet = (0, import_react47.useCallback)(() => {
-    try {
-      disconnect();
-    } catch {
-      return;
-    }
-    useExternalWalletStore.getState().clearExternalWallet();
-  }, [disconnect]);
+  const connections = (0, import_wagmi4.useConnections)();
+  const { mutate: connect, mutateAsync: connectAsync, ...restUseConnect } = (0, import_wagmi4.useConnect)();
+  const { mutateAsync: disconnectAsync } = (0, import_wagmi4.useDisconnect)();
+  const disconnectExternalWallet = (0, import_react47.useCallback)(async () => {
+    await disconnectAsync();
+    const { externalAddress, clearExternalWallet } = useExternalWalletStore.getState();
+    if (!!externalAddress) clearExternalWallet();
+  }, [disconnectAsync]);
   const connectExternalWallet = (0, import_react47.useCallback)(
     async (walletConnectorType) => {
-      disconnectExternalWallet();
       const connector = connectors.find((c) => c.id === walletConnectorType);
       if (!connector) {
-        console.error("[ExternalWalletConnnect] Connector not found for:", walletConnectorType);
+        console.warn("[useExternalWalletConnect] Connector not found for:", walletConnectorType);
         return;
       }
+      const existingConnection = connections.find((c) => c.connector.uid === connector.uid);
+      if (!!existingConnection?.connector) {
+        console.warn("[useExternalWalletConnect] Disconnecting existing connection");
+        await disconnectExternalWallet();
+      }
       useLayoutStore.getState().setIsDialogForced(true);
       try {
-        await connect({ connector });
-      } catch {
+        connect(
+          { connector },
+          {
+            onSuccess: (connectionData, { connector: connector2 }) => {
+              const { chainId, accounts } = connectionData;
+              const signingWalletAddress = accounts[0];
+              useExternalWalletStore.getState().setExternalWallet({
+                address: signingWalletAddress,
+                chainId,
+                connectorName: connector2.name || "Unknown Wallet"
+              });
+              onSuccess?.({ connected: true, address: signingWalletAddress });
+              setTimeout(() => useLayoutStore.getState().setIsDialogForced(false), 100);
+            },
+            onError: async (error, { connector: connector2 }) => {
+              await dropFailedConnectorSession(error, connector2, wagmiConfig3);
+              onError?.({
+                connected: false,
+                connector: connector2?.name || "Unknown Wallet",
+                error
+              });
+              setTimeout(() => useLayoutStore.getState().setIsDialogForced(false), 100);
+            }
+          }
+        );
+      } catch (connectionError) {
+        console.warn("[useExternalWalletConnect] Error:", connectionError);
+        return;
       }
     },
-    [connectors]
+    [connections, connectors, onSuccess, onError]
   );
   return {
     isAvailable: walletMode === "direct" || walletMode === "both",
     mutate: connectExternalWallet,
+    mutateAsync: connectExternalWallet,
     disconnect: disconnectExternalWallet,
-    ...restUseConnect
+    ...(0, import_lodash_es13.omit)(restUseConnect, ["mutate", "mutateAsync"])
   };
 }
-var import_react47, import_wagmi4;
+var import_lodash_es13, import_react47, import_wagmi4;
 var init_useExternalWalletConnect = __esm({
   "src/internal/components/ConnectExternalWalletMenu/useExternalWalletConnect.ts"() {
     init_ProviderContext();
+    import_lodash_es13 = require("lodash-es");
     import_react47 = require("react");
     import_wagmi4 = require("wagmi");
     init_useLayoutStore();
@@ -22848,7 +22848,7 @@ function useNicknameAvailability(currentNickname) {
       useNicknameStore.getState().setError(error?.message || "Failed to check nickname availability");
     }
   });
-  const debouncedCheckAvailability = (0, import_react68.useCallback)((0, import_lodash_es13.debounce)(checkAvailability, DEBOUNCE_MS), [checkAvailability]);
+  const debouncedCheckAvailability = (0, import_react68.useCallback)((0, import_lodash_es14.debounce)(checkAvailability, DEBOUNCE_MS), [checkAvailability]);
   (0, import_react68.useEffect)(() => {
     if (!currentNickname) return;
     const normalizedInputValue = normalizeNickname(nicknameValue);
@@ -22863,12 +22863,12 @@ function useNicknameAvailability(currentNickname) {
   }, [nicknameValue, currentNickname, debouncedCheckAvailability]);
   return { isCheckingAvailability };
 }
-var import_react_query39, import_lodash_es13, import_react68, DEBOUNCE_MS;
+var import_react_query39, import_lodash_es14, import_react68, DEBOUNCE_MS;
 var init_useNicknameAvailability = __esm({
   "src/internal/components/NicknameMenu/useNicknameAvailability.ts"() {
     init_i18n();
     import_react_query39 = require("@tanstack/react-query");
-    import_lodash_es13 = require("lodash-es");
+    import_lodash_es14 = require("lodash-es");
     import_react68 = require("react");
     init_nickname();
     init_nickname_errors();
@@ -24659,7 +24659,7 @@ var init_UserPolicies2 = __esm({
 function useSecurityMenuParams() {
   (0, import_react76.useEffect)(() => {
     const { pageParams, setPageParams } = useLayoutDataStore.getState();
-    if (!pageParams || !(0, import_lodash_es14.keys)(pageParams).length) return;
+    if (!pageParams || !(0, import_lodash_es15.keys)(pageParams).length) return;
     const { submenu } = pageParams;
     setTimeout(() => {
       switch (submenu) {
@@ -24681,10 +24681,10 @@ function useSecurityMenuParams() {
     setPageParams(null);
   }, []);
 }
-var import_lodash_es14, import_react76;
+var import_lodash_es15, import_react76;
 var init_useSecurityMenuParams = __esm({
   "src/internal/components/SecurityMenu/useSecurityMenuParams.ts"() {
-    import_lodash_es14 = require("lodash-es");
+    import_lodash_es15 = require("lodash-es");
     import_react76 = require("react");
     init_useLayoutDataStore();
     init_UserPolicies2();
@@ -28475,7 +28475,7 @@ function useSendMenuParams() {
   const { config } = useProviderConfig();
   (0, import_react94.useEffect)(() => {
     const { pageParams, setPageParams } = useLayoutDataStore.getState();
-    if (!pageParams || !(0, import_lodash_es15.keys)(pageParams).length) return;
+    if (!pageParams || !(0, import_lodash_es16.keys)(pageParams).length) return;
     const { sendFlow, send, bridge } = pageParams || {};
     if (sendFlow === "bridge" && !config?.current?.features?.showAssetBridge) {
       setPageParams(null);
@@ -28526,11 +28526,11 @@ function useSendMenuParams() {
     setPageParams(null);
   }, []);
 }
-var import_lodash_es15, import_react94;
+var import_lodash_es16, import_react94;
 var init_useSendMenuParams = __esm({
   "src/internal/components/SendMenu/useSendMenuParams.ts"() {
     init_ProviderContext();
-    import_lodash_es15 = require("lodash-es");
+    import_lodash_es16 = require("lodash-es");
     import_react94 = require("react");
     init_useLayoutDataStore();
     init_useBridgeStore();
@@ -30042,7 +30042,7 @@ var init_package = __esm({
   "package.json"() {
     package_default = {
       name: "@embarkai/ui-kit",
-      version: "0.4.109",
+      version: "0.4.111",
       description: "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
       type: "module",
       main: "./dist/index.cjs",
@@ -30527,17 +30527,17 @@ function useDecideContentStyles() {
   return {
     isClosing,
     isMobileView,
-    style: (0, import_lodash_es16.merge)({}, mobileStyles)
+    style: (0, import_lodash_es17.merge)({}, mobileStyles)
   };
 }
-var DialogPrimitive, import_lodash_es16, import_lucide_react85, import_react101, import_jsx_runtime133, Dialog, DialogPortal, DialogOverlay, CONTENT_BG_SETUP, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription;
+var DialogPrimitive, import_lodash_es17, import_lucide_react85, import_react101, import_jsx_runtime133, Dialog, DialogPortal, DialogOverlay, CONTENT_BG_SETUP, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription;
 var init_dialog = __esm({
   "src/internal/components/ui/dialog.tsx"() {
     init_utils();
     init_SessionContext();
     init_i18n();
     DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
-    import_lodash_es16 = require("lodash-es");
+    import_lodash_es17 = require("lodash-es");
     import_lucide_react85 = require("lucide-react");
     import_react101 = require("react");
     init_useLayoutDataStore();
@@ -30546,23 +30546,21 @@ var init_dialog = __esm({
     import_jsx_runtime133 = require("react/jsx-runtime");
     Dialog = DialogPrimitive.Root;
     DialogPortal = DialogPrimitive.Portal;
-    DialogOverlay = (0, import_react101.forwardRef)(
-      ({ className, closing, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
-        DialogPrimitive.Overlay,
-        {
-          ref,
-          style: { backdropFilter: "blur(var(--ui-kit-backdrop-blur))" },
-          className: cn2(
-            "w-[100dvw] h-[100dvh]",
-            "fixed inset-0 z-[9998] bg-[var(--ui-kit-overlay)]",
-            closing ? "animate-dialog-out" : "animate-dialog-in",
-            className
-          ),
-          ...props
-        }
-      )
-    );
-    DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+    DialogOverlay = (0, import_react101.forwardRef)(({ className, closing, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+      "div",
+      {
+        ref,
+        style: { backdropFilter: "blur(var(--ui-kit-backdrop-blur))" },
+        className: cn2(
+          "w-[100dvw] h-[100dvh]",
+          "fixed inset-0 z-[9998] bg-[var(--ui-kit-overlay)]",
+          closing ? "animate-dialog-out" : "animate-dialog-in",
+          className
+        ),
+        ...props
+      }
+    ));
+    DialogOverlay.displayName = "DialogOverlay";
     CONTENT_BG_SETUP = {
       backgroundColor: "var(--ui-kit-bg)",
       border: "1px solid var(--ui-kit-bd)",
@@ -30723,6 +30721,7 @@ function Dialog2() {
     Dialog,
     {
       open: isDialogOpen,
+      modal: false,
       onOpenChange: (open) => {
         if (isDialogForced) return;
         if (!open) {
@@ -33392,7 +33391,7 @@ function Provider(props) {
   const { children, projectId, initialConfig = {}, callbacks } = props;
   const callbacksRef = (0, import_react107.useRef)(callbacks);
   (0, import_react107.useEffect)(() => notifyNoProjetctId(projectId), [projectId]);
-  const config = (0, import_react107.useRef)((0, import_lodash_es17.merge)({}, DEFAULT_PROVIDER_CONFIG, { projectId }, initialConfig));
+  const config = (0, import_react107.useRef)((0, import_lodash_es18.merge)({}, DEFAULT_PROVIDER_CONFIG, { projectId }, initialConfig));
   const wagmiConfig3 = (0, import_react107.useRef)((0, import_core9.getWagmiConfig)(config.current?.wallet?.walletConnectId || null));
   const updateConfig = (0, import_react107.useCallback)((updates) => {
     const prev = config.current;
@@ -33435,7 +33434,7 @@ function Provider(props) {
   }, []);
   (0, import_react107.useEffect)(() => {
     if (typeof window === "undefined" || !projectId) return;
-    const mergedConfig = (0, import_lodash_es17.merge)(DEFAULT_PROVIDER_CONFIG, initialConfig);
+    const mergedConfig = (0, import_lodash_es18.merge)(DEFAULT_PROVIDER_CONFIG, initialConfig);
     updateConfig(mergedConfig);
     if (mergedConfig.wallet?.enabled) {
       clearLegacyWagmiStorage();
@@ -33495,12 +33494,12 @@ function Provider(props) {
   );
   return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(UIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_wagmi11.WagmiProvider, { config: wagmiConfig3.current, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(SessionProvider, { children }) }) });
 }
-var import_core9, import_error_tracking4, import_lodash_es17, import_react107, import_wagmi11, import_jsx_runtime137, UIContext, useProviderConfig;
+var import_core9, import_error_tracking4, import_lodash_es18, import_react107, import_wagmi11, import_jsx_runtime137, UIContext, useProviderConfig;
 var init_ProviderContext = __esm({
   "src/context/ProviderContext.tsx"() {
     import_core9 = require("@embarkai/core");
     import_error_tracking4 = require("@embarkai/core/internal/error-tracking");
-    import_lodash_es17 = require("lodash-es");
+    import_lodash_es18 = require("lodash-es");
     import_react107 = require("react");
     import_wagmi11 = require("wagmi");
     init_initial();

package/dist/index.js

@@ -17598,14 +17598,7 @@ function ConnectExternalWalletMenu() {
             } finally {
               setIsPreparingConnect(false);
             }
-            switch (true) {
-              case (connector.id === "metaMaskSDK" && !hasInjectedWallet2):
-                closeEmbarkAI();
-                break;
-              default:
-                useLayoutStore.getState().setIsDialogForced(true);
-                break;
-            }
+            useLayoutStore.getState().setIsDialogForced(true);
             try {
               await connect({ connector });
             } catch {
@@ -17675,68 +17668,81 @@ var init_ConnectExternalWalletMenu = __esm({
 });
 
 // src/internal/components/ConnectExternalWalletMenu/useExternalWalletConnect.ts
+import { omit as omit2 } from "lodash-es";
 import { useCallback as useCallback18 } from "react";
-import { useConfig as useConfig2, useConnect as useConnect2, useConnectors as useConnectors2, useDisconnect as useDisconnect3 } from "wagmi";
+import {
+  useConfig as useConfig2,
+  useConnect as useConnect2,
+  useConnections as useConnections3,
+  useConnectors as useConnectors2,
+  useDisconnect as useDisconnect3
+} from "wagmi";
 function useExternalWalletConnnect(options) {
   const { onSuccess, onError } = options || {};
   const { config } = useProviderConfig();
   const walletMode = config.current?.wallet?.mode;
   const wagmiConfig3 = useConfig2();
   const connectors = useConnectors2();
-  const { mutate: disconnect } = useDisconnect3();
-  const { mutate: connect, ...restUseConnect } = useConnect2({
-    mutation: {
-      onSuccess: (connectionData, { connector }) => {
-        const { chainId, accounts } = connectionData;
-        const signingWalletAddress = accounts[0];
-        useExternalWalletStore.getState().setExternalWallet({
-          address: signingWalletAddress,
-          chainId,
-          connectorName: connector.name || "Unknown Wallet"
-        });
-        onSuccess?.({ connected: true, address: signingWalletAddress });
-        useLayoutStore.getState().setIsDialogForced(false);
-      },
-      onError: async (error, { connector }) => {
-        await dropFailedConnectorSession(error, connector, wagmiConfig3);
-        onError?.({
-          connected: false,
-          connector: connector?.name || "Unknown Wallet",
-          error
-        });
-        useLayoutStore.getState().setIsDialogForced(false);
-      }
-    }
-  });
-  const disconnectExternalWallet = useCallback18(() => {
-    try {
-      disconnect();
-    } catch {
-      return;
-    }
-    useExternalWalletStore.getState().clearExternalWallet();
-  }, [disconnect]);
+  const connections = useConnections3();
+  const { mutate: connect, mutateAsync: connectAsync, ...restUseConnect } = useConnect2();
+  const { mutateAsync: disconnectAsync } = useDisconnect3();
+  const disconnectExternalWallet = useCallback18(async () => {
+    await disconnectAsync();
+    const { externalAddress, clearExternalWallet } = useExternalWalletStore.getState();
+    if (!!externalAddress) clearExternalWallet();
+  }, [disconnectAsync]);
   const connectExternalWallet = useCallback18(
     async (walletConnectorType) => {
-      disconnectExternalWallet();
       const connector = connectors.find((c) => c.id === walletConnectorType);
       if (!connector) {
-        console.error("[ExternalWalletConnnect] Connector not found for:", walletConnectorType);
+        console.warn("[useExternalWalletConnect] Connector not found for:", walletConnectorType);
         return;
       }
+      const existingConnection = connections.find((c) => c.connector.uid === connector.uid);
+      if (!!existingConnection?.connector) {
+        console.warn("[useExternalWalletConnect] Disconnecting existing connection");
+        await disconnectExternalWallet();
+      }
       useLayoutStore.getState().setIsDialogForced(true);
       try {
-        await connect({ connector });
-      } catch {
+        connect(
+          { connector },
+          {
+            onSuccess: (connectionData, { connector: connector2 }) => {
+              const { chainId, accounts } = connectionData;
+              const signingWalletAddress = accounts[0];
+              useExternalWalletStore.getState().setExternalWallet({
+                address: signingWalletAddress,
+                chainId,
+                connectorName: connector2.name || "Unknown Wallet"
+              });
+              onSuccess?.({ connected: true, address: signingWalletAddress });
+              setTimeout(() => useLayoutStore.getState().setIsDialogForced(false), 100);
+            },
+            onError: async (error, { connector: connector2 }) => {
+              await dropFailedConnectorSession(error, connector2, wagmiConfig3);
+              onError?.({
+                connected: false,
+                connector: connector2?.name || "Unknown Wallet",
+                error
+              });
+              setTimeout(() => useLayoutStore.getState().setIsDialogForced(false), 100);
+            }
+          }
+        );
+      } catch (connectionError) {
+        console.warn("[useExternalWalletConnect] Error:", connectionError);
+        return;
       }
     },
-    [connectors]
+    [connections, connectors, onSuccess, onError]
   );
   return {
     isAvailable: walletMode === "direct" || walletMode === "both",
     mutate: connectExternalWallet,
+    mutateAsync: connectExternalWallet,
     disconnect: disconnectExternalWallet,
-    ...restUseConnect
+    ...omit2(restUseConnect, ["mutate", "mutateAsync"])
   };
 }
 var init_useExternalWalletConnect = __esm({
@@ -29943,7 +29949,7 @@ var init_package = __esm({
   "package.json"() {
     package_default = {
       name: "@embarkai/ui-kit",
-      version: "0.4.109",
+      version: "0.4.111",
       description: "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
       type: "module",
       main: "./dist/index.cjs",
@@ -30446,23 +30452,21 @@ var init_dialog = __esm({
     init_button();
     Dialog = DialogPrimitive.Root;
     DialogPortal = DialogPrimitive.Portal;
-    DialogOverlay = forwardRef6(
-      ({ className, closing, ...props }, ref) => /* @__PURE__ */ jsx133(
-        DialogPrimitive.Overlay,
-        {
-          ref,
-          style: { backdropFilter: "blur(var(--ui-kit-backdrop-blur))" },
-          className: cn2(
-            "w-[100dvw] h-[100dvh]",
-            "fixed inset-0 z-[9998] bg-[var(--ui-kit-overlay)]",
-            closing ? "animate-dialog-out" : "animate-dialog-in",
-            className
-          ),
-          ...props
-        }
-      )
-    );
-    DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+    DialogOverlay = forwardRef6(({ className, closing, ...props }, ref) => /* @__PURE__ */ jsx133(
+      "div",
+      {
+        ref,
+        style: { backdropFilter: "blur(var(--ui-kit-backdrop-blur))" },
+        className: cn2(
+          "w-[100dvw] h-[100dvh]",
+          "fixed inset-0 z-[9998] bg-[var(--ui-kit-overlay)]",
+          closing ? "animate-dialog-out" : "animate-dialog-in",
+          className
+        ),
+        ...props
+      }
+    ));
+    DialogOverlay.displayName = "DialogOverlay";
     CONTENT_BG_SETUP = {
       backgroundColor: "var(--ui-kit-bg)",
       border: "1px solid var(--ui-kit-bd)",
@@ -30626,6 +30630,7 @@ function Dialog2() {
     Dialog,
     {
       open: isDialogOpen,
+      modal: false,
       onOpenChange: (open) => {
         if (isDialogForced) return;
         if (!open) {

package/package.json

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