@embarkai/ui-kit 0.3.1 → 0.3.3

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.3.1</title>
+    <title>EmbarkAI Secure Wallet - iframe version 0.3.3</title>
 
     <!-- Styles will be injected by build process -->
     <style>

package/dist/iframe/main.js

@@ -4410,7 +4410,7 @@ var SigningManager = class extends TokenRefreshApiClient {
 };
 
 // src/iframe/main.ts
-var IFRAME_VERSION = "0.3.1";
+var IFRAME_VERSION = "0.3.3";
 var IframeWallet = class {
   constructor() {
     console.log("=".repeat(60));

package/dist/index.cjs

@@ -15573,7 +15573,7 @@ var init_package = __esm({
   "package.json"() {
     package_default = {
       name: "@embarkai/ui-kit",
-      version: "0.3.1",
+      version: "0.3.3",
       description: "React UI components and hooks for EmbarkAI authentication and Account Abstraction",
       type: "module",
       main: "./dist/index.cjs",
@@ -16392,6 +16392,7 @@ function WalletConnectHandler() {
   const setPage = useLayoutDataStore((st) => st.setPage);
   const setIsWalletLinking = useLayoutDataStore((st) => st.setIsWalletLinking);
   const setAuthError = useAuthStore((st) => st.setAlert);
+  const setAuthStep = useAuthStore((st) => st.setStep);
   const setManageWalletLinkError = useManageWalletStore((st) => st.setLinkError);
   const setLinkIsLoading = useManageWalletStore((st) => st.setLinkIsLoading);
   const setProviderType = useManageWalletStore((st) => st.setProviderType);
@@ -16430,6 +16431,8 @@ function WalletConnectHandler() {
     [qc, passportWalletAddress, setProviderType, setPage, setIsWalletLinking]
   );
   const [hasStartedLinking, setHasStartedLinking] = import_react63.default.useState(false);
+  const [modalWasOpened, setModalWasOpened] = import_react63.default.useState(false);
+  const [pendingModalOpen, setPendingModalOpen] = import_react63.default.useState(false);
   (0, import_react63.useEffect)(() => {
     if (isWalletLinking && !hasStartedLinking) {
       console.log("[WalletConnectHandler] Starting wallet link flow:", {
@@ -16439,20 +16442,22 @@ function WalletConnectHandler() {
       });
       setHasStartedLinking(true);
       setProviderType(null);
-      disconnect();
-      setTimeout(() => {
-        setPage(null);
-        if (openConnectModal) {
-          openConnectModal();
-        } else {
-          console.error("[WalletConnectHandler] openConnectModal is undefined!");
-          setIsWalletLinking(false);
-          setHasStartedLinking(false);
-        }
-      }, 500);
+      setPage(null);
+      if (isConnected) {
+        disconnect();
+        setPendingModalOpen(true);
+      } else if (openConnectModal) {
+        openConnectModal();
+      } else {
+        console.error("[WalletConnectHandler] openConnectModal is undefined!");
+        setIsWalletLinking(false);
+        setHasStartedLinking(false);
+      }
     }
     if (!isWalletLinking && hasStartedLinking) {
       setHasStartedLinking(false);
+      setModalWasOpened(false);
+      setPendingModalOpen(false);
       const shouldKeepConnected = walletMode === "direct" || walletMode === "both";
       if (isConnected && !shouldKeepConnected) disconnect();
     }
@@ -16467,12 +16472,24 @@ function WalletConnectHandler() {
     walletMode
   ]);
   (0, import_react63.useEffect)(() => {
-    if (hasStartedLinking && !connectModalOpen && !isConnected && isWalletLinking) {
+    if (pendingModalOpen && !isConnected && openConnectModal) {
+      setPendingModalOpen(false);
+      openConnectModal();
+    }
+  }, [pendingModalOpen, isConnected, openConnectModal]);
+  (0, import_react63.useEffect)(() => {
+    if (connectModalOpen && hasStartedLinking) {
+      setModalWasOpened(true);
+    }
+  }, [connectModalOpen, hasStartedLinking]);
+  (0, import_react63.useEffect)(() => {
+    if (modalWasOpened && !connectModalOpen && !isConnected && isWalletLinking) {
       console.log("[WalletConnectHandler] Modal closed without connecting");
       onLinkingComplete(false);
       setHasStartedLinking(false);
+      setModalWasOpened(false);
     }
-  }, [connectModalOpen, hasStartedLinking, isConnected, isWalletLinking]);
+  }, [connectModalOpen, modalWasOpened, isConnected, isWalletLinking]);
   (0, import_react63.useEffect)(() => {
     if (isWalletLinking) {
       const timeout = setTimeout(() => {
@@ -16487,7 +16504,7 @@ function WalletConnectHandler() {
           setAuthError({ title: "Connection timed out", message: "Wallet did not respond. Please try again." });
           setPage("auth" /* AUTH */);
         }
-      }, 12e4);
+      }, 3e5);
       return () => clearTimeout(timeout);
     }
   }, [isWalletLinking, setIsWalletLinking, disconnect]);
@@ -16514,7 +16531,7 @@ function WalletConnectHandler() {
       const signature = await Promise.race([
         signMessageAsync({ message, account: signingWalletAddress }),
         new Promise(
-          (_, reject) => setTimeout(() => reject(new Error("Signature request timed out. Please try again.")), 6e4)
+          (_, reject) => setTimeout(() => reject(new Error("Signature request timed out. Please try again.")), 12e4)
         )
       ]);
       if (!signature) {
@@ -16569,6 +16586,7 @@ function WalletConnectHandler() {
       onLinkingComplete(false);
       setHasStartedLinking(false);
       setLinkIsLoading(false);
+      setAuthStep("signin");
       const errorMsg = err?.message || (isAuthFlow ? "Wallet login failed" : "Failed to link wallet");
       if (errorMsg.includes("User rejected") || errorMsg.includes("User denied")) {
         if (passportWalletAddress) {
@@ -16593,11 +16611,15 @@ function WalletConnectHandler() {
     }
   });
   (0, import_react63.useEffect)(() => {
-    if (!!chain?.id && isConnected && walletAddress && isWalletLinking && hasStartedLinking) {
+    if (!!chain?.id && isConnected && walletAddress && isWalletLinking && hasStartedLinking && modalWasOpened && !pendingModalOpen) {
       console.log("[WalletConnectHandler] handleWalletSign triggered");
+      if (!passportWalletAddress) {
+        setPage("auth" /* AUTH */);
+        setAuthStep("loading");
+      }
       handleWalletSign({ chainId: chain.id, signingWalletAddress: walletAddress });
     }
-  }, [chain, isConnected, walletAddress, isWalletLinking, hasStartedLinking]);
+  }, [chain, isConnected, walletAddress, isWalletLinking, hasStartedLinking, modalWasOpened, pendingModalOpen]);
   (0, import_react63.useEffect)(() => {
     if (isConnected && !chain?.id && isWalletLinking && hasStartedLinking && !connectModalOpen && !isWalletSigning) {
       const timeout = setTimeout(() => {
@@ -19528,7 +19550,7 @@ function Provider(props) {
     [config, updateConfig, callbacks, updateCallbacks]
   );
   if (!!initialConfig?.wallet?.enabled)
-    return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(WagmiProvider2, { children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(UIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(RainbowKitProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(SessionProvider, { children }) }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(UIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(RainbowKitProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(SessionProvider, { children }) }) });
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(WagmiProvider2, { children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(UIContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(SessionProvider, { children }) }) });
 }
 var import_error_tracking4, import_lodash_es6, import_react67, import_jsx_runtime96, UIContext, useProviderConfig;