@avalabs/avacloud-waas-react 1.3.1 → 1.4.1

package/dist/index.js

@@ -48,6 +48,7 @@ __export(index_exports, {
   useAvaCloudWallet: () => useAvaCloudWallet,
   useBlockchain: () => useBlockchain,
   useChainId: () => useChainId,
+  useGaslessConfig: () => useGaslessConfig,
   useGaslessTransaction: () => useGaslessTransaction,
   useGlacier: () => useGlacier,
   usePostMessage: () => usePostMessage,
@@ -92,10 +93,11 @@ function getDerivationPath(vm, accountIndex) {
   return `m/44'/${coinIndex}'/0'/0/${accountIndex}`;
 }
 
-// src/hooks/usePostMessage.ts
+// src/hooks/usePenpalAuth.ts
 var import_react = require("react");
+var import_penpal = require("penpal");
 
-// src/constants/storage.ts
+// ../avacloud-waas-common/dist/constants/storage.js
 var OIDC_TOKEN_KEY = "avacloud-auth-oidc-token";
 var AUTH_TOKENS_KEY = "auth_tokens";
 var AUTH0_STORAGE_KEYS = {
@@ -107,26 +109,12 @@ var AUTH0_STORAGE_KEYS = {
 var CUBIST_USER_ID_KEY = "cubist_user_id";
 var ORG_CONFIG_CACHE_KEY = "avacloud-org-config-cache";
 
-// src/hooks/usePostMessage.ts
-var globalAuthState = {
-  signupInProgress: false,
-  loginInProgress: false,
-  lastSignupTimestamp: 0,
-  lastLoginTimestamp: 0,
-  processingMessageIds: /* @__PURE__ */ new Set()
-};
-function cleanupProcessedMessageIds() {
-  if (globalAuthState.processingMessageIds.size > 100) {
-    const messageIds = Array.from(globalAuthState.processingMessageIds);
-    globalAuthState.processingMessageIds = new Set(messageIds.slice(-50));
-  }
-}
-function usePostMessage({
+// src/hooks/usePenpalAuth.ts
+function usePenpalAuth({
   authServiceUrl,
   orgId,
   environment,
   iframe,
-  isIframeReady,
   onAuthSuccess,
   onAuthError,
   onOidcReceived,
@@ -134,16 +122,13 @@ function usePostMessage({
   setIsAuthenticated,
   setUser,
   setIsLoading,
-  setIsIframeReady,
-  cubistClient
+  setIsIframeReady
 }) {
-  const lastAuthStateRef = (0, import_react.useRef)({
-    isAuthenticated: false,
-    userId: null,
-    lastUpdateTime: 0
-  });
-  const hasRequestedOidcRef = (0, import_react.useRef)(false);
-  const isHandlingMessageRef = (0, import_react.useRef)(false);
+  const connectionRef = (0, import_react.useRef)(null);
+  const [authService, setAuthService] = (0, import_react.useState)(null);
+  const [isConnected, setIsConnected] = (0, import_react.useState)(false);
+  const isConnectedRef = (0, import_react.useRef)(false);
+  const hasCheckedAuthRef = (0, import_react.useRef)(false);
   const hasLoadedCacheRef = (0, import_react.useRef)(false);
   (0, import_react.useEffect)(() => {
     if (orgId && onOrgConfigUpdate && !hasLoadedCacheRef.current) {
@@ -164,233 +149,250 @@ function usePostMessage({
       }
     }
   }, [orgId, environment, onOrgConfigUpdate]);
-  const sendMessage = (0, import_react.useCallback)((message) => {
-    if (iframe == null ? void 0 : iframe.contentWindow) {
-      try {
-        if (message.type === "SIGNUP_REQUEST") {
-          if (globalAuthState.signupInProgress) {
-            return;
-          }
-          const now = Date.now();
-          if (now - globalAuthState.lastSignupTimestamp < 3e3) {
-            return;
-          }
-          globalAuthState.signupInProgress = true;
-          globalAuthState.lastSignupTimestamp = now;
-          let finalMessage = message;
-          if (!message.requestId) {
-            finalMessage = {
-              ...message,
-              requestId: `signup-${now}`
-            };
-          }
-          let messageToSend = finalMessage;
-          if (finalMessage.payload && typeof finalMessage.payload.email === "string" && typeof finalMessage.payload.password === "string") {
-            messageToSend = {
-              type: "SIGNUP_REQUEST",
-              email: finalMessage.payload.email,
-              password: finalMessage.payload.password,
-              requestId: finalMessage.requestId || `signup-${now}`
-            };
-          }
-          if ("requestId" in messageToSend && messageToSend.requestId) {
-            globalAuthState.processingMessageIds.add(messageToSend.requestId);
-          }
-          iframe.contentWindow.postMessage(messageToSend, authServiceUrl);
-          return;
-        }
-        if (message.type === "LOGIN_REQUEST") {
-          if (globalAuthState.loginInProgress) {
-            return;
-          }
-          const now = Date.now();
-          if (now - globalAuthState.lastLoginTimestamp < 3e3) {
-            return;
-          }
-          globalAuthState.loginInProgress = true;
-          globalAuthState.lastLoginTimestamp = now;
-          let finalMessage = message;
-          if (!message.requestId) {
-            finalMessage = {
-              ...message,
-              requestId: `login-${now}`
+  const parentMethods = {
+    onReady: () => {
+      console.log("[Penpal Parent] Iframe is ready");
+      setIsIframeReady(true);
+    },
+    onAuthStatusChange: (status) => {
+      var _a;
+      console.log("[Penpal Parent] Auth status changed:", status);
+      setIsAuthenticated(status.isAuthenticated);
+      if (status.user) {
+        const userInfo = {
+          email: status.user.email,
+          sub: status.user.sub,
+          configured_mfa: [],
+          displayName: status.user.nickname || status.user.name || ((_a = status.user.email) == null ? void 0 : _a.split("@")[0]) || "User",
+          rawUserData: status.user
+        };
+        setUser(userInfo);
+      } else {
+        setUser(null);
+      }
+      if (status.orgConfig) {
+        onOrgConfigUpdate == null ? void 0 : onOrgConfigUpdate(status.orgConfig);
+        if (orgId) {
+          try {
+            const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY}-${orgId}-${environment}`;
+            const configWithTimestamp = {
+              ...status.orgConfig,
+              _timestamp: Date.now()
             };
+            localStorage.setItem(cachedConfigKey, JSON.stringify(configWithTimestamp));
+          } catch (error) {
           }
-          if (finalMessage.requestId) {
-            globalAuthState.processingMessageIds.add(finalMessage.requestId);
-          }
-          iframe.contentWindow.postMessage(finalMessage, authServiceUrl);
-          return;
-        }
-        iframe.contentWindow.postMessage(message, authServiceUrl);
-      } catch (error) {
-        if (message.type === "SIGNUP_REQUEST") {
-          globalAuthState.signupInProgress = false;
-        }
-        if (message.type === "LOGIN_REQUEST") {
-          globalAuthState.loginInProgress = false;
         }
       }
-    }
-  }, [iframe, authServiceUrl]);
-  (0, import_react.useEffect)(() => {
-    const handleMessage = async (event) => {
-      var _a, _b, _c, _d, _e, _f, _g;
-      if (isHandlingMessageRef.current) {
-        return;
+      if (status.isAuthenticated) {
+        onAuthSuccess == null ? void 0 : onAuthSuccess();
       }
-      if (event.origin !== new URL(authServiceUrl).origin) {
+      setIsLoading(false);
+    },
+    onError: (error) => {
+      console.error("[Penpal Parent] Error from iframe:", error);
+      if (error.message === "User not authenticated in iframe" || error.message === "Unknown error" || error.message.includes("OIDC user not found")) {
         return;
       }
-      if (typeof ((_a = event.data) == null ? void 0 : _a.type) !== "string") {
+      onAuthError == null ? void 0 : onAuthError(new Error(error.message));
+      setIsLoading(false);
+    },
+    onWalletUpdate: (wallet) => {
+      console.log("[Penpal Parent] Wallet update:", wallet);
+    }
+  };
+  (0, import_react.useEffect)(() => {
+    if (!(iframe == null ? void 0 : iframe.contentWindow)) {
+      return;
+    }
+    let isCancelled = false;
+    const setupConnection = async (attempt = 1, maxAttempts = 3) => {
+      if (isCancelled) return;
+      if (isConnectedRef.current && connectionRef.current) {
+        console.log("[Penpal Parent] Already connected, skipping setup");
         return;
       }
-      if (event.data.requestId && globalAuthState.processingMessageIds.has(event.data.requestId)) {
-        return;
+      console.log(`[Penpal Parent] Setting up connection to iframe (attempt ${attempt}/${maxAttempts})...`);
+      if (connectionRef.current) {
+        connectionRef.current.destroy();
+        connectionRef.current = null;
+        setAuthService(null);
+        setIsConnected(false);
+        isConnectedRef.current = false;
       }
       try {
-        isHandlingMessageRef.current = true;
-        if (event.data.type === "ERROR") {
-          globalAuthState.signupInProgress = false;
-          globalAuthState.loginInProgress = false;
-        } else if (event.data.type === "AUTH_STATUS" && event.data.isAuthenticated) {
-          globalAuthState.signupInProgress = false;
-          globalAuthState.loginInProgress = false;
-          cleanupProcessedMessageIds();
-        } else if (event.data.type === "RECEIVE_OIDC") {
-          globalAuthState.signupInProgress = false;
-          globalAuthState.loginInProgress = false;
+        const authServiceOrigin = new URL(authServiceUrl).origin;
+        const messenger = new import_penpal.WindowMessenger({
+          remoteWindow: iframe.contentWindow,
+          allowedOrigins: [authServiceOrigin]
+        });
+        const connection = (0, import_penpal.connect)({
+          messenger,
+          methods: parentMethods,
+          timeout: 1e4
+          // 10 second connection timeout per attempt
+        });
+        connectionRef.current = connection;
+        const remote = await connection.promise;
+        if (isCancelled) {
+          connection.destroy();
+          return;
         }
-        switch (event.data.type) {
-          case "IFRAME_READY":
-            setIsIframeReady(true);
-            break;
-          case "RECEIVE_OIDC":
-            if (typeof ((_b = event.data.payload) == null ? void 0 : _b.idToken) === "string") {
-              const oidcToken = event.data.payload.idToken;
-              hasRequestedOidcRef.current = false;
-              onOidcReceived == null ? void 0 : onOidcReceived(oidcToken);
-            } else {
-              hasRequestedOidcRef.current = false;
-            }
-            break;
-          case "AUTH_STATUS": {
-            const newIsAuthenticated = !!event.data.isAuthenticated;
-            const newUserId = (_d = (_c = event.data.user) == null ? void 0 : _c.sub) != null ? _d : null;
-            const now = Date.now();
-            if (now - lastAuthStateRef.current.lastUpdateTime < 500) {
-              return;
-            }
-            const authStateChanged = lastAuthStateRef.current.isAuthenticated !== newIsAuthenticated || lastAuthStateRef.current.userId !== newUserId;
-            if (authStateChanged) {
-              setIsAuthenticated(newIsAuthenticated);
-              if (event.data.user) {
-                const userInfo = {
-                  email: event.data.user.email,
-                  sub: event.data.user.sub,
-                  configured_mfa: [],
-                  displayName: event.data.user.nickname || event.data.user.name || ((_e = event.data.user.email) == null ? void 0 : _e.split("@")[0]) || "User",
-                  rawUserData: event.data.user
-                };
-                setUser(userInfo);
-                if (newIsAuthenticated && !cubistClient && !hasRequestedOidcRef.current) {
-                  hasRequestedOidcRef.current = true;
-                  sendMessage({ type: "GET_OIDC" });
-                  return;
-                }
-              } else {
-                setUser(null);
-                localStorage.removeItem(AUTH_TOKENS_KEY);
-                localStorage.removeItem(AUTH0_STORAGE_KEYS.IS_AUTHENTICATED);
-                sessionStorage.removeItem(OIDC_TOKEN_KEY);
-              }
-              lastAuthStateRef.current = {
-                isAuthenticated: newIsAuthenticated,
-                userId: newUserId,
-                lastUpdateTime: now
-              };
-              if (newIsAuthenticated && event.data.user) {
-                if (!hasRequestedOidcRef.current) {
-                  if (event.data.tokens) {
-                    localStorage.setItem(AUTH_TOKENS_KEY, JSON.stringify(event.data.tokens));
-                  }
-                  onAuthSuccess == null ? void 0 : onAuthSuccess();
-                }
-              }
-            }
-            if (event.data.orgConfig && onOrgConfigUpdate) {
-              onOrgConfigUpdate(event.data.orgConfig);
-              if (orgId) {
-                try {
-                  const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY}-${orgId}-${environment}`;
-                  const configWithTimestamp = {
-                    ...event.data.orgConfig,
-                    _timestamp: Date.now()
-                  };
-                  localStorage.setItem(cachedConfigKey, JSON.stringify(configWithTimestamp));
-                } catch (error) {
-                }
-              }
-            }
-            if (!hasRequestedOidcRef.current) {
-              setIsLoading(false);
-            }
-            break;
-          }
-          case "REGISTER_SUCCESS": {
-            const userId = (_f = event.data.payload) == null ? void 0 : _f.userId;
-            if (userId) {
-              localStorage.setItem(CUBIST_USER_ID_KEY, userId);
-              if (!hasRequestedOidcRef.current) {
-                hasRequestedOidcRef.current = true;
-                sendMessage({ type: "GET_OIDC" });
-              }
-            }
-            break;
+        console.log("[Penpal Parent] Connected to auth service");
+        isConnectedRef.current = true;
+        setAuthService(remote);
+        setIsConnected(true);
+        setIsIframeReady(true);
+      } catch (error) {
+        if (isCancelled) return;
+        console.error(`[Penpal Parent] Failed to connect (attempt ${attempt}):`, error);
+        if (attempt < maxAttempts) {
+          console.log(`[Penpal Parent] Retrying in 1 second...`);
+          await new Promise((resolve) => setTimeout(resolve, 1e3));
+          if (!isCancelled) {
+            await setupConnection(attempt + 1, maxAttempts);
           }
-          case "ERROR":
-            if (event.data.error === "User not authenticated in iframe") {
-              isHandlingMessageRef.current = false;
-              return;
-            }
-            onAuthError == null ? void 0 : onAuthError(new Error((_g = event.data.error) != null ? _g : "Unknown error"));
-            setIsLoading(false);
-            break;
+        } else {
+          onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Failed to connect to auth service"));
         }
-      } finally {
-        isHandlingMessageRef.current = false;
       }
     };
-    window.addEventListener("message", handleMessage);
-    return () => window.removeEventListener("message", handleMessage);
-  }, [
-    authServiceUrl,
-    onAuthError,
-    onAuthSuccess,
-    onOidcReceived,
-    onOrgConfigUpdate,
-    setIsAuthenticated,
-    setIsIframeReady,
-    setIsLoading,
-    setUser,
-    sendMessage,
-    cubistClient,
-    orgId,
-    environment
-  ]);
+    setupConnection();
+    return () => {
+      isCancelled = true;
+    };
+  }, [iframe, authServiceUrl]);
   (0, import_react.useEffect)(() => {
-    if (isIframeReady && (iframe == null ? void 0 : iframe.contentWindow)) {
-      sendMessage({
-        type: "CHECK_AUTH_STATUS",
-        payload: {
-          orgId,
-          environment
+    if (isConnected && authService && !hasCheckedAuthRef.current) {
+      hasCheckedAuthRef.current = true;
+      authService.checkAuthStatus(orgId, environment).then((status) => {
+        console.log("[Penpal Parent] Initial auth status:", status);
+        parentMethods.onAuthStatusChange(status);
+        if (status.isAuthenticated) {
+          return authService.getOidc();
+        }
+        return null;
+      }).then((oidcResult) => {
+        if (oidcResult == null ? void 0 : oidcResult.idToken) {
+          onOidcReceived == null ? void 0 : onOidcReceived(oidcResult.idToken);
         }
+      }).catch((error) => {
+        console.error("[Penpal Parent] Error checking auth status:", error);
+        setIsLoading(false);
       });
     }
-  }, [isIframeReady, iframe, sendMessage, orgId, environment]);
+  }, [isConnected, authService, orgId, environment]);
+  const login = (0, import_react.useCallback)(async (params) => {
+    var _a;
+    if (!authService) {
+      console.warn("[Penpal] Cannot login - not connected");
+      return;
+    }
+    try {
+      const result = await authService.login(params || {});
+      setIsAuthenticated(true);
+      if (result.user) {
+        const userInfo = {
+          email: result.user.email,
+          sub: result.user.sub,
+          configured_mfa: [],
+          displayName: result.user.nickname || result.user.name || ((_a = result.user.email) == null ? void 0 : _a.split("@")[0]) || "User",
+          rawUserData: result.user
+        };
+        setUser(userInfo);
+      }
+      if (result.accessToken) {
+        onOidcReceived == null ? void 0 : onOidcReceived(result.accessToken);
+      }
+      onAuthSuccess == null ? void 0 : onAuthSuccess();
+      return result;
+    } catch (error) {
+      onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Login failed"));
+      throw error;
+    }
+  }, [authService, setIsAuthenticated, setUser, onOidcReceived, onAuthSuccess, onAuthError]);
+  const signup = (0, import_react.useCallback)(async (email, password) => {
+    var _a;
+    if (!authService) {
+      console.warn("[Penpal] Cannot signup - not connected");
+      return;
+    }
+    try {
+      const result = await authService.signup({ email, password });
+      setIsAuthenticated(true);
+      if (result.user) {
+        const userInfo = {
+          email: result.user.email,
+          sub: result.user.sub,
+          configured_mfa: [],
+          displayName: result.user.nickname || result.user.name || ((_a = result.user.email) == null ? void 0 : _a.split("@")[0]) || "User",
+          rawUserData: result.user
+        };
+        setUser(userInfo);
+      }
+      if (result.accessToken) {
+        onOidcReceived == null ? void 0 : onOidcReceived(result.accessToken);
+      }
+      onAuthSuccess == null ? void 0 : onAuthSuccess();
+      return result;
+    } catch (error) {
+      onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Signup failed"));
+      throw error;
+    }
+  }, [authService, setIsAuthenticated, setUser, onOidcReceived, onAuthSuccess, onAuthError]);
+  const logout = (0, import_react.useCallback)(async () => {
+    if (!authService) {
+      console.warn("[Penpal] Cannot logout - not connected");
+      return;
+    }
+    try {
+      await authService.logout();
+      setIsAuthenticated(false);
+      setUser(null);
+      localStorage.removeItem(AUTH_TOKENS_KEY);
+      localStorage.removeItem(AUTH0_STORAGE_KEYS.IS_AUTHENTICATED);
+      localStorage.removeItem(AUTH0_STORAGE_KEYS.ACCESS_TOKEN);
+      localStorage.removeItem(AUTH0_STORAGE_KEYS.ID_TOKEN);
+      localStorage.removeItem(AUTH0_STORAGE_KEYS.EXPIRES_AT);
+      localStorage.removeItem(CUBIST_USER_ID_KEY);
+      sessionStorage.removeItem(OIDC_TOKEN_KEY);
+    } catch (error) {
+      onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Logout failed"));
+      throw error;
+    }
+  }, [authService, setIsAuthenticated, setUser, onAuthError]);
+  const getOidc = (0, import_react.useCallback)(async () => {
+    if (!authService) {
+      console.warn("[Penpal] Cannot get OIDC - not connected");
+      return;
+    }
+    try {
+      return await authService.getOidc();
+    } catch (error) {
+      onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Failed to get OIDC token"));
+      throw error;
+    }
+  }, [authService, onAuthError]);
+  const checkAuthStatus = (0, import_react.useCallback)(async () => {
+    if (!authService) {
+      console.warn("[Penpal] Cannot check auth status - not connected");
+      return;
+    }
+    try {
+      return await authService.checkAuthStatus(orgId, environment);
+    } catch (error) {
+      onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Failed to check auth status"));
+      throw error;
+    }
+  }, [authService, orgId, environment, onAuthError]);
   return {
-    sendMessage
+    authService,
+    isConnected,
+    login,
+    signup,
+    logout,
+    getOidc,
+    checkAuthStatus
   };
 }
 
@@ -1010,123 +1012,72 @@ function SignInContent({
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function LoginModal({ open, onClose }) {
   var _a;
-  const { iframe, orgConfig, signup } = useAvaCloudWallet();
+  const { orgConfig, signup, login, isAuthenticated } = useAvaCloudWallet();
   const [isSubmitting, setIsSubmitting] = (0, import_react3.useState)(false);
   const [error, setError] = (0, import_react3.useState)("");
   const timeoutIdRef = (0, import_react3.useRef)(null);
-  const signupInProgressRef = (0, import_react3.useRef)(false);
-  const lastSignupAttemptRef = (0, import_react3.useRef)(0);
   const socialLogins = (_a = orgConfig == null ? void 0 : orgConfig.adminPortalSettings) == null ? void 0 : _a.socialLogins;
   (0, import_react3.useEffect)(() => {
-    let requestInProgress = false;
-    const handleMessage = (event) => {
-      if (!event.data || typeof event.data.type !== "string") {
-        return;
+    if (isAuthenticated && open) {
+      setIsSubmitting(false);
+      if (timeoutIdRef.current) {
+        clearTimeout(timeoutIdRef.current);
+        timeoutIdRef.current = null;
       }
-      if (event.data.type === "ERROR") {
-        if (event.data.payload === "User not authenticated in iframe") {
-          return;
-        }
-        setError(event.data.payload);
-        setIsSubmitting(false);
-        signupInProgressRef.current = false;
-        if (timeoutIdRef.current) {
-          clearTimeout(timeoutIdRef.current);
-          timeoutIdRef.current = null;
-        }
-      } else if (event.data.type === "AUTH_STATUS" && event.data.isAuthenticated) {
-        setIsSubmitting(false);
-        signupInProgressRef.current = false;
-        requestInProgress = false;
-        if (timeoutIdRef.current) {
-          clearTimeout(timeoutIdRef.current);
-          timeoutIdRef.current = null;
-        }
-        onClose();
-      } else if (event.data.type === "RECEIVE_OIDC") {
-        signupInProgressRef.current = false;
-        requestInProgress = false;
+      onClose();
+    }
+  }, [isAuthenticated, open, onClose]);
+  (0, import_react3.useEffect)(() => {
+    if (!open) {
+      setIsSubmitting(false);
+      setError("");
+      if (timeoutIdRef.current) {
+        clearTimeout(timeoutIdRef.current);
+        timeoutIdRef.current = null;
       }
-    };
-    window.addEventListener("message", handleMessage);
+    }
+  }, [open]);
+  (0, import_react3.useEffect)(() => {
     return () => {
-      window.removeEventListener("message", handleMessage);
       if (timeoutIdRef.current) {
         clearTimeout(timeoutIdRef.current);
         timeoutIdRef.current = null;
       }
     };
-  }, [onClose]);
-  const handleProviderLogin = (provider) => {
-    var _a2;
+  }, []);
+  const handleProviderLogin = (0, import_react3.useCallback)((provider) => {
     setError("");
-    if (!iframe) {
-      setError("Authentication service not available");
-      return;
-    }
-    (_a2 = iframe.contentWindow) == null ? void 0 : _a2.postMessage({
-      type: "LOGIN_REQUEST",
-      connection: provider,
-      requestId: `login-${Date.now()}`
-    }, "*");
-    onClose();
-  };
-  const handleEmailLogin = (email, password) => {
-    var _a2;
+    setIsSubmitting(true);
+    login({ connection: provider });
+  }, [login]);
+  const handleEmailLogin = (0, import_react3.useCallback)((email, password) => {
     setError("");
     setIsSubmitting(true);
-    if (!iframe) {
-      setError("Authentication service not available");
-      setIsSubmitting(false);
-      return;
-    }
     if (timeoutIdRef.current) {
       clearTimeout(timeoutIdRef.current);
       timeoutIdRef.current = null;
     }
-    (_a2 = iframe.contentWindow) == null ? void 0 : _a2.postMessage({
-      type: "LOGIN_REQUEST",
-      email,
-      password,
-      requestId: `login-${Date.now()}`
-    }, "*");
+    login({ email, password });
     timeoutIdRef.current = setTimeout(() => {
       setError("Authentication service timed out");
       setIsSubmitting(false);
       timeoutIdRef.current = null;
     }, 1e4);
-  };
-  const handleEmailSignup = (email, password) => {
-    if (signupInProgressRef.current) {
-      return;
-    }
-    const now = Date.now();
-    if (now - lastSignupAttemptRef.current < 2e3) {
-      return;
-    }
-    lastSignupAttemptRef.current = now;
+  }, [login]);
+  const handleEmailSignup = (0, import_react3.useCallback)((email, password) => {
     setError("");
     setIsSubmitting(true);
-    signupInProgressRef.current = true;
     if (timeoutIdRef.current) {
       clearTimeout(timeoutIdRef.current);
       timeoutIdRef.current = null;
     }
-    try {
-      signup(email, password);
-    } catch (error2) {
-      setError("Failed to initiate signup");
-      setIsSubmitting(false);
-      signupInProgressRef.current = false;
-      return;
-    }
+    signup(email, password);
     timeoutIdRef.current = setTimeout(() => {
       setError("Authentication service timed out");
       setIsSubmitting(false);
-      signupInProgressRef.current = false;
       timeoutIdRef.current = null;
     }, 1e4);
-  };
+  }, [signup]);
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     import_core_k2_components3.Dialog,
     {
@@ -1593,7 +1544,7 @@ function ThemeProvider({ children, darkMode, onDarkModeChange }) {
     if (darkMode !== void 0 && darkMode !== isDarkMode) {
       setIsDarkMode(darkMode);
     }
-  }, [darkMode]);
+  }, [darkMode, isDarkMode]);
   const toggleTheme = (0, import_react8.useCallback)(() => {
     const newDarkMode = !isDarkMode;
     setIsDarkMode(newDarkMode);
@@ -1602,6 +1553,18 @@ function ThemeProvider({ children, darkMode, onDarkModeChange }) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ThemeContext.Provider, { value: { isDarkMode, toggleTheme }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core_k2_components5.ThemeProvider, { theme: isDarkMode ? darkTheme : lightTheme, children }) });
 }
 
+// src/constants/storage.ts
+var OIDC_TOKEN_KEY2 = "avacloud-auth-oidc-token";
+var AUTH_TOKENS_KEY2 = "auth_tokens";
+var AUTH0_STORAGE_KEYS2 = {
+  IS_AUTHENTICATED: "auth0.is.authenticated",
+  ACCESS_TOKEN: "auth0.access_token",
+  ID_TOKEN: "auth0.id_token",
+  EXPIRES_AT: "auth0.expires_at"
+};
+var CUBIST_USER_ID_KEY2 = "cubist_user_id";
+var ORG_CONFIG_CACHE_KEY2 = "avacloud-org-config-cache";
+
 // src/AvaCloudWalletProvider.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var AvaCloudWalletContext = (0, import_react9.createContext)(void 0);
@@ -1632,6 +1595,23 @@ function ViemProviderWrapper({ children, chainId }) {
     }
   );
 }
+function normalizeOrgConfig(config) {
+  if (!config) {
+    return null;
+  }
+  const typedConfig = config;
+  const explicitWalletProvider = typeof typedConfig.walletProviderOrgID === "string" ? typedConfig.walletProviderOrgID.trim() : "";
+  const cubistOrgId = typeof typedConfig.cubistOrgId === "string" ? typedConfig.cubistOrgId.trim() : "";
+  const resolvedOrgId = explicitWalletProvider || cubistOrgId;
+  if (!resolvedOrgId) {
+    return typedConfig;
+  }
+  return {
+    ...typedConfig,
+    walletProviderOrgID: resolvedOrgId,
+    cubistOrgId: cubistOrgId || resolvedOrgId
+  };
+}
 function AvaCloudWalletProvider({
   children,
   orgId,
@@ -1672,7 +1652,7 @@ function AvaCloudWalletProvider({
   const [wallet, setWallet] = (0, import_react9.useState)({ address: null });
   const [orgConfig, setOrgConfig] = (0, import_react9.useState)(null);
   const [iframe, setIframe] = (0, import_react9.useState)(null);
-  const [isIframeReady, setIsIframeReady] = (0, import_react9.useState)(false);
+  const [_isIframeReady, setIsIframeReady] = (0, import_react9.useState)(false);
   const [cubistClient, setCubistClient] = (0, import_react9.useState)(null);
   const [cubistError, setCubistError] = (0, import_react9.useState)(null);
   const [pendingOidcToken, setPendingOidcToken] = (0, import_react9.useState)(null);
@@ -1719,7 +1699,7 @@ function AvaCloudWalletProvider({
       if (oidcToken) {
         accessToken = oidcToken;
       } else {
-        const tokens = localStorage.getItem(AUTH_TOKENS_KEY);
+        const tokens = localStorage.getItem(AUTH_TOKENS_KEY2);
         if (!tokens) {
           throw new Error("No authentication tokens found in localStorage");
         }
@@ -1762,8 +1742,8 @@ function AvaCloudWalletProvider({
           });
         }
       } catch (error) {
-        localStorage.removeItem(AUTH_TOKENS_KEY);
-        localStorage.removeItem(AUTH0_STORAGE_KEYS.IS_AUTHENTICATED);
+        localStorage.removeItem(AUTH_TOKENS_KEY2);
+        localStorage.removeItem(AUTH0_STORAGE_KEYS2.IS_AUTHENTICATED);
         setIsAuthenticated(false);
         setUser(null);
         setCubistClient(null);
@@ -1777,12 +1757,17 @@ function AvaCloudWalletProvider({
       setIsCubistLoading(false);
     }
   }, [wallet, onWalletUpdate, onAuthError, getWalletInfo, orgConfig, environment]);
-  const { sendMessage } = usePostMessage({
+  const {
+    authService,
+    isConnected,
+    login: penpalLogin,
+    signup: penpalSignup,
+    logout: penpalLogout
+  } = usePenpalAuth({
     authServiceUrl,
     orgId,
     environment,
     iframe,
-    isIframeReady,
     onAuthSuccess: () => {
       if (user) {
         if (wallet.address) {
@@ -1792,8 +1777,7 @@ function AvaCloudWalletProvider({
     },
     onAuthError: (error) => {
       const errorMessage = (error == null ? void 0 : error.message) || "";
-      if (errorMessage === "User not authenticated in iframe" || errorMessage === "Unknown error" || // Generic error that often appears during signup
-      errorMessage.includes("OIDC user not found")) {
+      if (errorMessage === "User not authenticated in iframe" || errorMessage === "Unknown error" || errorMessage.includes("OIDC user not found")) {
         return;
       }
       setIsCubistLoading(false);
@@ -1819,76 +1803,78 @@ function AvaCloudWalletProvider({
       };
     },
     onOrgConfigUpdate: (config) => {
-      setOrgConfig(config);
+      setOrgConfig(normalizeOrgConfig(config));
     },
     setIsAuthenticated,
     setUser,
-    setIsLoading: (isLoading2) => {
-      setIsLoading(isLoading2);
+    setIsLoading: (loading) => {
+      setIsLoading(loading);
     },
-    setIsIframeReady,
-    wallet,
-    cubistClient
+    setIsIframeReady
   });
-  const login = (0, import_react9.useCallback)(() => {
-    if (iframe == null ? void 0 : iframe.contentWindow) {
-      setIsCubistLoading(true);
-      sendMessage({ type: "LOGIN_REQUEST" });
+  const login = (0, import_react9.useCallback)((params) => {
+    if (isConnected) {
+      const isEmailLogin = (params == null ? void 0 : params.email) && (params == null ? void 0 : params.password);
+      if (isEmailLogin) {
+        setIsCubistLoading(true);
+      }
+      penpalLogin(params).catch((error) => {
+        setIsCubistLoading(false);
+        onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Login failed"));
+      });
     }
-  }, [iframe, sendMessage]);
+  }, [isConnected, penpalLogin, onAuthError]);
   const signup = (0, import_react9.useCallback)((email, password) => {
-    if (iframe == null ? void 0 : iframe.contentWindow) {
+    if (isConnected) {
       setIsCubistLoading(true);
-      sendMessage({
-        type: "SIGNUP_REQUEST",
-        payload: {
-          email,
-          password
-        },
-        requestId: `signup-${Date.now()}`
+      penpalSignup(email, password).catch((error) => {
+        setIsCubistLoading(false);
+        onAuthError == null ? void 0 : onAuthError(error instanceof Error ? error : new Error("Signup failed"));
       });
     }
-  }, [iframe, sendMessage]);
+  }, [isConnected, penpalSignup, onAuthError]);
   const logout = (0, import_react9.useCallback)(() => {
-    sendMessage({ type: "LOGOUT_REQUEST" });
+    penpalLogout().catch((error) => {
+      console.error("Logout error:", error);
+    });
     setUser(null);
     setWallet({ address: null });
     setIsAuthenticated(false);
-    localStorage.removeItem(AUTH_TOKENS_KEY);
-    localStorage.removeItem(AUTH0_STORAGE_KEYS.IS_AUTHENTICATED);
-    localStorage.removeItem(AUTH0_STORAGE_KEYS.ACCESS_TOKEN);
-    localStorage.removeItem(AUTH0_STORAGE_KEYS.ID_TOKEN);
-    localStorage.removeItem(AUTH0_STORAGE_KEYS.EXPIRES_AT);
-    localStorage.removeItem(CUBIST_USER_ID_KEY);
+    localStorage.removeItem(AUTH_TOKENS_KEY2);
+    localStorage.removeItem(AUTH0_STORAGE_KEYS2.IS_AUTHENTICATED);
+    localStorage.removeItem(AUTH0_STORAGE_KEYS2.ACCESS_TOKEN);
+    localStorage.removeItem(AUTH0_STORAGE_KEYS2.ID_TOKEN);
+    localStorage.removeItem(AUTH0_STORAGE_KEYS2.EXPIRES_AT);
+    localStorage.removeItem(CUBIST_USER_ID_KEY2);
     if (orgId) {
-      const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY}-${orgId}-${env}`;
+      const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY2}-${orgId}-${env}`;
       localStorage.removeItem(cachedConfigKey);
     }
-    sessionStorage.removeItem(OIDC_TOKEN_KEY);
+    sessionStorage.removeItem(OIDC_TOKEN_KEY2);
     setCubistClient(null);
     setCubistError(null);
     setPendingOidcToken(null);
-  }, [sendMessage, orgId, env]);
+  }, [penpalLogout, orgId, env]);
   const addAccount = (0, import_react9.useCallback)(async (accountIndex) => {
     if (!isAuthenticated || !user || !wallet.mnemonicId) {
       throw new Error("User must be authenticated and have a wallet to add an account");
     }
+    if (!authService) {
+      throw new Error("Auth service not connected");
+    }
     const path = getDerivationPath("EVM" /* EVM */, accountIndex);
-    sendMessage({
-      type: "ADD_ACCOUNT",
-      payload: {
-        accountIndex,
-        mnemonicId: wallet.mnemonicId,
-        derivationPath: path,
-        identityProof: {
-          email: user.email,
-          displayName: user.displayName,
-          sub: user.sub,
-          configured_mfa: user.configured_mfa
-        }
+    await authService.addAccount({
+      accountIndex,
+      mnemonicId: wallet.mnemonicId,
+      derivationPath: path,
+      identityProof: {
+        email: user.email,
+        displayName: user.displayName,
+        sub: user.sub,
+        configured_mfa: user.configured_mfa
       }
     });
-  }, [sendMessage, isAuthenticated, user, wallet.mnemonicId]);
+  }, [authService, isAuthenticated, user, wallet.mnemonicId]);
   (0, import_react9.useEffect)(() => {
     const hasOrgConfig = !!(orgConfig == null ? void 0 : orgConfig.walletProviderOrgID);
     const hasOidcToken = !!pendingOidcToken;
@@ -1938,20 +1924,20 @@ function AvaCloudWalletProvider({
     if (typeof window === "undefined") {
       return;
     }
-    const isAuthenticatedInStorage = localStorage.getItem(AUTH0_STORAGE_KEYS.IS_AUTHENTICATED) === "true";
+    const isAuthenticatedInStorage = localStorage.getItem(AUTH0_STORAGE_KEYS2.IS_AUTHENTICATED) === "true";
     if (!isAuthenticatedInStorage) {
       return;
     }
-    const existingOidcToken = sessionStorage.getItem(OIDC_TOKEN_KEY);
+    const existingOidcToken = sessionStorage.getItem(OIDC_TOKEN_KEY2);
     if (existingOidcToken) {
       setPendingOidcToken(existingOidcToken);
     } else {
       try {
-        const tokensJson = localStorage.getItem(AUTH_TOKENS_KEY);
+        const tokensJson = localStorage.getItem(AUTH_TOKENS_KEY2);
         if (tokensJson) {
           const tokens = JSON.parse(tokensJson);
           if (tokens.access_token) {
-            sessionStorage.setItem(OIDC_TOKEN_KEY, tokens.access_token);
+            sessionStorage.setItem(OIDC_TOKEN_KEY2, tokens.access_token);
             setPendingOidcToken(tokens.access_token);
           }
         }
@@ -3287,32 +3273,27 @@ var import_react16 = require("react");
 var import_core_k2_components11 = require("@avalabs/core-k2-components");
 var import_jsx_runtime13 = require("react/jsx-runtime");
 function ExportView({ onBack }) {
-  const { wallet, iframe } = useAvaCloudWallet();
-  const [showKey, setShowKey] = (0, import_react16.useState)(false);
+  const { wallet } = useAvaCloudWallet();
+  const [showKey, _setShowKey] = (0, import_react16.useState)(false);
   const [copied, setCopied] = (0, import_react16.useState)(false);
-  const [privateKey, setPrivateKey] = (0, import_react16.useState)(null);
+  const [privateKey, _setPrivateKey] = (0, import_react16.useState)(null);
   const [error, setError] = (0, import_react16.useState)(null);
-  const handleExport = async () => {
-    if (!(iframe == null ? void 0 : iframe.contentWindow)) return;
-    try {
-      iframe.contentWindow.postMessage({
-        type: "EXPORT_PRIVATE_KEY",
-        payload: {
-          address: wallet.address
-        }
-      }, "*");
-      const handleResponse = (event) => {
-        if (event.data.type === "EXPORT_PRIVATE_KEY_RESPONSE") {
-          setPrivateKey(event.data.payload.privateKey);
-          setShowKey(true);
-          window.removeEventListener("message", handleResponse);
-        }
-      };
-      window.addEventListener("message", handleResponse);
+  const [isLoading, setIsLoading] = (0, import_react16.useState)(false);
+  const handleExport = (0, import_react16.useCallback)(async () => {
+    if (!wallet.address) {
+      setError("No wallet address available");
+      return;
+    }
+    setIsLoading(true);
+    setError(null);
+    try {
+      setError("Private key export is not yet available. Please use the wallet provider directly.");
     } catch (err) {
       setError("Failed to export private key. Please try again.");
+    } finally {
+      setIsLoading(false);
     }
-  };
+  }, [wallet.address]);
   const handleCopy = () => {
     if (privateKey) {
       navigator.clipboard.writeText(privateKey);
@@ -3333,8 +3314,9 @@ function ExportView({ onBack }) {
         variant: "contained",
         color: "warning",
         onClick: handleExport,
+        disabled: isLoading,
         sx: { mb: 2 },
-        children: "Show Private Key"
+        children: isLoading ? "Loading..." : "Show Private Key"
       }
     ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core_k2_components11.Box, { sx: { mb: 3 }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core_k2_components11.Box, { sx: {
       display: "flex",
@@ -4277,134 +4259,422 @@ function WalletButton({
                 },
                 children: displayAddress
               }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-              import_core_k2_components19.IconButton,
-              {
-                size: "small",
-                onClick: handleCopy,
-                sx: { color: "text.secondary" },
-                children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core_k2_components19.CopyIcon, {})
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+              import_core_k2_components19.IconButton,
+              {
+                size: "small",
+                onClick: handleCopy,
+                sx: { color: "text.secondary" },
+                children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core_k2_components19.CopyIcon, {})
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(WalletCard, { onClose: handleClose })
+  ] });
+}
+
+// src/components/WalletDisplay.tsx
+var import_react23 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+function WalletDisplay({
+  className = "",
+  truncateAddress = true,
+  showAddAccount = true
+}) {
+  const { wallet, addAccount, isAuthenticated } = useAvaCloudWallet();
+  const [isAdding, setIsAdding] = (0, import_react23.useState)(false);
+  const [accountIndex, setAccountIndex] = (0, import_react23.useState)(0);
+  if (!isAuthenticated || !wallet.address) {
+    return null;
+  }
+  const displayAddress = truncateAddress ? `${wallet.address.slice(0, 6)}...${wallet.address.slice(-4)}` : wallet.address;
+  const handleAddAccount = async () => {
+    try {
+      setIsAdding(true);
+      await addAccount(accountIndex);
+      setAccountIndex((prev) => prev + 1);
+    } catch (error) {
+      console.error("Failed to add account:", error);
+    } finally {
+      setIsAdding(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `space-y-4 ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "bg-gray-50 rounded-lg p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-sm text-gray-500", children: "Wallet Address" }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "mt-1 font-mono text-sm break-all", children: displayAddress })
+    ] }),
+    showAddAccount && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: handleAddAccount,
+        disabled: isAdding,
+        className: "w-full inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed",
+        children: isAdding ? "Adding Account..." : "Add Account"
+      }
+    )
+  ] });
+}
+
+// src/components/UserProfile.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
+function UserProfile({
+  className = "",
+  showLogout = true
+}) {
+  const { user, logout, isAuthenticated } = useAvaCloudWallet();
+  if (!isAuthenticated || !user) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: `space-y-4 ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-white shadow rounded-lg p-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "px-4 py-5 sm:px-6", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h3", { className: "text-lg font-medium leading-6 text-gray-900", children: "User Profile" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-gray-200", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dl", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { className: "text-sm font-medium text-gray-500", children: "Display Name" }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { className: "mt-1 text-sm text-gray-900 sm:col-span-2", children: user.displayName })
+      ] }),
+      user.email && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { className: "text-sm font-medium text-gray-500", children: "Email address" }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { className: "mt-1 text-sm text-gray-900 sm:col-span-2", children: user.email })
+      ] }),
+      user.configured_mfa && user.configured_mfa.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-sm font-medium text-gray-500", children: "MFA Methods" }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mt-1 space-y-1", children: user.configured_mfa.map((method) => {
+          const mfaMethod = typeof method === "string" ? { type: method } : method;
+          return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "div",
+            {
+              className: "text-sm text-gray-900",
+              children: mfaMethod.type === "totp" ? "Authenticator App" : mfaMethod.name
+            },
+            mfaMethod.type === "fido" ? mfaMethod.id : `totp-${mfaMethod.type}`
+          );
+        }) })
+      ] })
+    ] }) }),
+    showLogout && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mt-6", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: logout,
+        className: "w-full inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500",
+        children: "Sign Out"
+      }
+    ) })
+  ] }) });
+}
+
+// src/hooks/usePostMessage.ts
+var import_react24 = require("react");
+var globalAuthState = {
+  signupInProgress: false,
+  loginInProgress: false,
+  lastSignupTimestamp: 0,
+  lastLoginTimestamp: 0,
+  processingMessageIds: /* @__PURE__ */ new Set()
+};
+function cleanupProcessedMessageIds() {
+  if (globalAuthState.processingMessageIds.size > 100) {
+    const messageIds = Array.from(globalAuthState.processingMessageIds);
+    globalAuthState.processingMessageIds = new Set(messageIds.slice(-50));
+  }
+}
+function usePostMessage({
+  authServiceUrl,
+  orgId,
+  environment,
+  iframe,
+  isIframeReady,
+  onAuthSuccess,
+  onAuthError,
+  onOidcReceived,
+  onOrgConfigUpdate,
+  setIsAuthenticated,
+  setUser,
+  setIsLoading,
+  setIsIframeReady,
+  cubistClient
+}) {
+  const lastAuthStateRef = (0, import_react24.useRef)({
+    isAuthenticated: false,
+    userId: null,
+    lastUpdateTime: 0
+  });
+  const hasRequestedOidcRef = (0, import_react24.useRef)(false);
+  const isHandlingMessageRef = (0, import_react24.useRef)(false);
+  const hasLoadedCacheRef = (0, import_react24.useRef)(false);
+  (0, import_react24.useEffect)(() => {
+    if (orgId && onOrgConfigUpdate && !hasLoadedCacheRef.current) {
+      hasLoadedCacheRef.current = true;
+      try {
+        const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY2}-${orgId}-${environment}`;
+        const cachedConfigJson = localStorage.getItem(cachedConfigKey);
+        if (cachedConfigJson) {
+          const cachedConfig = JSON.parse(cachedConfigJson);
+          const timestamp = cachedConfig._timestamp || 0;
+          const isExpired = Date.now() - timestamp > 30 * 60 * 1e3;
+          if (!isExpired) {
+            const { _timestamp, ...configWithoutTimestamp } = cachedConfig;
+            onOrgConfigUpdate(configWithoutTimestamp);
+          }
+        }
+      } catch (error) {
+      }
+    }
+  }, [orgId, environment, onOrgConfigUpdate]);
+  const sendMessage = (0, import_react24.useCallback)((message) => {
+    if (iframe == null ? void 0 : iframe.contentWindow) {
+      try {
+        if (message.type === "SIGNUP_REQUEST") {
+          if (globalAuthState.signupInProgress) {
+            return;
+          }
+          const now = Date.now();
+          if (now - globalAuthState.lastSignupTimestamp < 3e3) {
+            return;
+          }
+          globalAuthState.signupInProgress = true;
+          globalAuthState.lastSignupTimestamp = now;
+          let finalMessage = message;
+          if (!message.requestId) {
+            finalMessage = {
+              ...message,
+              requestId: `signup-${now}`
+            };
+          }
+          let messageToSend = finalMessage;
+          if (finalMessage.payload && typeof finalMessage.payload.email === "string" && typeof finalMessage.payload.password === "string") {
+            messageToSend = {
+              type: "SIGNUP_REQUEST",
+              email: finalMessage.payload.email,
+              password: finalMessage.payload.password,
+              requestId: finalMessage.requestId || `signup-${now}`
+            };
+          }
+          if ("requestId" in messageToSend && messageToSend.requestId) {
+            globalAuthState.processingMessageIds.add(messageToSend.requestId);
+          }
+          iframe.contentWindow.postMessage(messageToSend, authServiceUrl);
+          return;
+        }
+        if (message.type === "LOGIN_REQUEST") {
+          if (globalAuthState.loginInProgress) {
+            return;
+          }
+          const now = Date.now();
+          if (now - globalAuthState.lastLoginTimestamp < 3e3) {
+            return;
+          }
+          globalAuthState.loginInProgress = true;
+          globalAuthState.lastLoginTimestamp = now;
+          let finalMessage = message;
+          if (!message.requestId) {
+            finalMessage = {
+              ...message,
+              requestId: `login-${now}`
+            };
+          }
+          if (finalMessage.requestId) {
+            globalAuthState.processingMessageIds.add(finalMessage.requestId);
+          }
+          iframe.contentWindow.postMessage(finalMessage, authServiceUrl);
+          return;
+        }
+        iframe.contentWindow.postMessage(message, authServiceUrl);
+      } catch (error) {
+        if (message.type === "SIGNUP_REQUEST") {
+          globalAuthState.signupInProgress = false;
+        }
+        if (message.type === "LOGIN_REQUEST") {
+          globalAuthState.loginInProgress = false;
+        }
+      }
+    }
+  }, [iframe, authServiceUrl]);
+  (0, import_react24.useEffect)(() => {
+    const handleMessage = async (event) => {
+      var _a, _b, _c, _d, _e, _f, _g;
+      if (isHandlingMessageRef.current) {
+        return;
+      }
+      if (event.origin !== new URL(authServiceUrl).origin) {
+        return;
+      }
+      if (typeof ((_a = event.data) == null ? void 0 : _a.type) !== "string") {
+        return;
+      }
+      if (event.data.requestId && globalAuthState.processingMessageIds.has(event.data.requestId)) {
+        return;
+      }
+      try {
+        isHandlingMessageRef.current = true;
+        if (event.data.type === "ERROR") {
+          globalAuthState.signupInProgress = false;
+          globalAuthState.loginInProgress = false;
+        } else if (event.data.type === "AUTH_STATUS" && event.data.isAuthenticated) {
+          globalAuthState.signupInProgress = false;
+          globalAuthState.loginInProgress = false;
+          cleanupProcessedMessageIds();
+        } else if (event.data.type === "RECEIVE_OIDC") {
+          globalAuthState.signupInProgress = false;
+          globalAuthState.loginInProgress = false;
+        }
+        switch (event.data.type) {
+          case "IFRAME_READY":
+            setIsIframeReady(true);
+            break;
+          case "RECEIVE_OIDC":
+            if (typeof ((_b = event.data.payload) == null ? void 0 : _b.idToken) === "string") {
+              const oidcToken = event.data.payload.idToken;
+              hasRequestedOidcRef.current = false;
+              onOidcReceived == null ? void 0 : onOidcReceived(oidcToken);
+            } else {
+              hasRequestedOidcRef.current = false;
+            }
+            break;
+          case "AUTH_STATUS": {
+            const newIsAuthenticated = !!event.data.isAuthenticated;
+            const newUserId = (_d = (_c = event.data.user) == null ? void 0 : _c.sub) != null ? _d : null;
+            const now = Date.now();
+            if (now - lastAuthStateRef.current.lastUpdateTime < 500) {
+              return;
+            }
+            const authStateChanged = lastAuthStateRef.current.isAuthenticated !== newIsAuthenticated || lastAuthStateRef.current.userId !== newUserId;
+            if (authStateChanged) {
+              setIsAuthenticated(newIsAuthenticated);
+              if (event.data.user) {
+                const userInfo = {
+                  email: event.data.user.email,
+                  sub: event.data.user.sub,
+                  configured_mfa: [],
+                  displayName: event.data.user.nickname || event.data.user.name || ((_e = event.data.user.email) == null ? void 0 : _e.split("@")[0]) || "User",
+                  rawUserData: event.data.user
+                };
+                setUser(userInfo);
+                if (newIsAuthenticated && !cubistClient && !hasRequestedOidcRef.current) {
+                  hasRequestedOidcRef.current = true;
+                  sendMessage({ type: "GET_OIDC" });
+                  return;
+                }
+              } else {
+                setUser(null);
+                localStorage.removeItem(AUTH_TOKENS_KEY2);
+                localStorage.removeItem(AUTH0_STORAGE_KEYS2.IS_AUTHENTICATED);
+                sessionStorage.removeItem(OIDC_TOKEN_KEY2);
+              }
+              lastAuthStateRef.current = {
+                isAuthenticated: newIsAuthenticated,
+                userId: newUserId,
+                lastUpdateTime: now
+              };
+              if (newIsAuthenticated && event.data.user) {
+                if (!hasRequestedOidcRef.current) {
+                  if (event.data.tokens) {
+                    localStorage.setItem(AUTH_TOKENS_KEY2, JSON.stringify(event.data.tokens));
+                  }
+                  onAuthSuccess == null ? void 0 : onAuthSuccess();
+                }
               }
-            )
-          ] })
-        ]
+            }
+            if (event.data.orgConfig && onOrgConfigUpdate) {
+              onOrgConfigUpdate(event.data.orgConfig);
+              if (orgId) {
+                try {
+                  const cachedConfigKey = `${ORG_CONFIG_CACHE_KEY2}-${orgId}-${environment}`;
+                  const configWithTimestamp = {
+                    ...event.data.orgConfig,
+                    _timestamp: Date.now()
+                  };
+                  localStorage.setItem(cachedConfigKey, JSON.stringify(configWithTimestamp));
+                } catch (error) {
+                }
+              }
+            }
+            if (!hasRequestedOidcRef.current) {
+              setIsLoading(false);
+            }
+            break;
+          }
+          case "REGISTER_SUCCESS": {
+            const userId = (_f = event.data.payload) == null ? void 0 : _f.userId;
+            if (userId) {
+              localStorage.setItem(CUBIST_USER_ID_KEY2, userId);
+              if (!hasRequestedOidcRef.current) {
+                hasRequestedOidcRef.current = true;
+                sendMessage({ type: "GET_OIDC" });
+              }
+            }
+            break;
+          }
+          case "ERROR":
+            if (event.data.error === "User not authenticated in iframe") {
+              isHandlingMessageRef.current = false;
+              return;
+            }
+            onAuthError == null ? void 0 : onAuthError(new Error((_g = event.data.error) != null ? _g : "Unknown error"));
+            setIsLoading(false);
+            break;
+        }
+      } finally {
+        isHandlingMessageRef.current = false;
       }
-    ),
-    isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(WalletCard, { onClose: handleClose })
-  ] });
-}
-
-// src/components/WalletDisplay.tsx
-var import_react23 = require("react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-function WalletDisplay({
-  className = "",
-  truncateAddress = true,
-  showAddAccount = true
-}) {
-  const { wallet, addAccount, isAuthenticated } = useAvaCloudWallet();
-  const [isAdding, setIsAdding] = (0, import_react23.useState)(false);
-  const [accountIndex, setAccountIndex] = (0, import_react23.useState)(0);
-  if (!isAuthenticated || !wallet.address) {
-    return null;
-  }
-  const displayAddress = truncateAddress ? `${wallet.address.slice(0, 6)}...${wallet.address.slice(-4)}` : wallet.address;
-  const handleAddAccount = async () => {
-    try {
-      setIsAdding(true);
-      await addAccount(accountIndex);
-      setAccountIndex((prev) => prev + 1);
-    } catch (error) {
-      console.error("Failed to add account:", error);
-    } finally {
-      setIsAdding(false);
+    };
+    window.addEventListener("message", handleMessage);
+    return () => window.removeEventListener("message", handleMessage);
+  }, [
+    authServiceUrl,
+    onAuthError,
+    onAuthSuccess,
+    onOidcReceived,
+    onOrgConfigUpdate,
+    setIsAuthenticated,
+    setIsIframeReady,
+    setIsLoading,
+    setUser,
+    sendMessage,
+    cubistClient,
+    orgId,
+    environment
+  ]);
+  (0, import_react24.useEffect)(() => {
+    if (isIframeReady && (iframe == null ? void 0 : iframe.contentWindow)) {
+      sendMessage({
+        type: "CHECK_AUTH_STATUS",
+        payload: {
+          orgId,
+          environment
+        }
+      });
     }
+  }, [isIframeReady, iframe, sendMessage, orgId, environment]);
+  return {
+    sendMessage
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `space-y-4 ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "bg-gray-50 rounded-lg p-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-sm text-gray-500", children: "Wallet Address" }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "mt-1 font-mono text-sm break-all", children: displayAddress })
-    ] }),
-    showAddAccount && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: handleAddAccount,
-        disabled: isAdding,
-        className: "w-full inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed",
-        children: isAdding ? "Adding Account..." : "Add Account"
-      }
-    )
-  ] });
-}
-
-// src/components/UserProfile.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
-function UserProfile({
-  className = "",
-  showLogout = true
-}) {
-  const { user, logout, isAuthenticated } = useAvaCloudWallet();
-  if (!isAuthenticated || !user) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: `space-y-4 ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-white shadow rounded-lg p-6", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "px-4 py-5 sm:px-6", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h3", { className: "text-lg font-medium leading-6 text-gray-900", children: "User Profile" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "border-t border-gray-200", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dl", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { className: "text-sm font-medium text-gray-500", children: "Display Name" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { className: "mt-1 text-sm text-gray-900 sm:col-span-2", children: user.displayName })
-      ] }),
-      user.email && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { className: "text-sm font-medium text-gray-500", children: "Email address" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { className: "mt-1 text-sm text-gray-900 sm:col-span-2", children: user.email })
-      ] }),
-      user.configured_mfa && user.configured_mfa.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-sm font-medium text-gray-500", children: "MFA Methods" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mt-1 space-y-1", children: user.configured_mfa.map((method) => {
-          const mfaMethod = typeof method === "string" ? { type: method } : method;
-          return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-            "div",
-            {
-              className: "text-sm text-gray-900",
-              children: mfaMethod.type === "totp" ? "Authenticator App" : mfaMethod.name
-            },
-            mfaMethod.type === "fido" ? mfaMethod.id : `totp-${mfaMethod.type}`
-          );
-        }) })
-      ] })
-    ] }) }),
-    showLogout && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mt-6", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: logout,
-        className: "w-full inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500",
-        children: "Sign Out"
-      }
-    ) })
-  ] }) });
 }
 
 // src/hooks/useSignMessage.ts
-var import_react24 = require("react");
+var import_react25 = require("react");
 var import_cubesigner_sdk4 = require("@cubist-labs/cubesigner-sdk");
 function useSignMessage() {
-  const [state, setState] = (0, import_react24.useState)({
+  const [state, setState] = (0, import_react25.useState)({
     isLoading: false,
     error: null,
     signature: null
   });
   const { wallet, cubistClient } = useAvaCloudWallet();
-  const reset = (0, import_react24.useCallback)(() => {
+  const reset = (0, import_react25.useCallback)(() => {
     setState({
       isLoading: false,
       error: null,
       signature: null
     });
   }, []);
-  const signMessage = (0, import_react24.useCallback)(async (message) => {
+  const signMessage = (0, import_react25.useCallback)(async (message) => {
     if (!cubistClient || !wallet.address) {
       setState((prev) => ({
         ...prev,
@@ -4441,10 +4711,11 @@ function useSignMessage() {
 }
 
 // src/hooks/useSignTransaction.ts
-var import_react25 = require("react");
+var import_react26 = require("react");
 var import_cubesigner_sdk5 = require("@cubist-labs/cubesigner-sdk");
+var import_viem5 = require("viem");
 function useSignTransaction() {
-  const [state, setState] = (0, import_react25.useState)({
+  const [state, setState] = (0, import_react26.useState)({
     isLoading: false,
     error: null,
     signature: null,
@@ -4452,7 +4723,7 @@ function useSignTransaction() {
   });
   const { wallet, cubistClient } = useAvaCloudWallet();
   const { publicClient } = useViem();
-  const reset = (0, import_react25.useCallback)(() => {
+  const reset = (0, import_react26.useCallback)(() => {
     setState({
       isLoading: false,
       error: null,
@@ -4460,8 +4731,7 @@ function useSignTransaction() {
       signedTransaction: null
     });
   }, []);
-  const signTransaction = (0, import_react25.useCallback)(async (transaction) => {
-    var _a, _b, _c, _d;
+  const signTransaction = (0, import_react26.useCallback)(async (transaction) => {
     if (!(wallet == null ? void 0 : wallet.address)) {
       setState((prev) => ({
         ...prev,
@@ -4497,13 +4767,13 @@ function useSignTransaction() {
         chain_id: publicClient.chain.id,
         tx: {
           to: transaction.to || void 0,
-          value: (_a = transaction.value) == null ? void 0 : _a.toString(),
+          value: transaction.value !== void 0 ? (0, import_viem5.toHex)(transaction.value) : void 0,
           data: transaction.data || "0x",
-          nonce: (_b = transaction.nonce) == null ? void 0 : _b.toString(),
+          nonce: transaction.nonce !== void 0 ? (0, import_viem5.toHex)(transaction.nonce) : void 0,
           type: "0x2",
           // EIP-1559
-          maxFeePerGas: (_c = transaction.maxFeePerGas) == null ? void 0 : _c.toString(),
-          maxPriorityFeePerGas: (_d = transaction.maxPriorityFeePerGas) == null ? void 0 : _d.toString()
+          maxFeePerGas: transaction.maxFeePerGas !== void 0 ? (0, import_viem5.toHex)(transaction.maxFeePerGas) : void 0,
+          maxPriorityFeePerGas: transaction.maxPriorityFeePerGas !== void 0 ? (0, import_viem5.toHex)(transaction.maxPriorityFeePerGas) : void 0
         }
       };
       const sig = await key.signEvm(signReq);
@@ -4529,11 +4799,11 @@ function useSignTransaction() {
 }
 
 // src/hooks/useUserWallets.ts
-var import_react26 = require("react");
+var import_react27 = require("react");
 function useUserWallets() {
-  const [error, setError] = (0, import_react26.useState)(null);
-  const [isLoading, setIsLoading] = (0, import_react26.useState)(false);
-  const getWallets = (0, import_react26.useCallback)(async (client) => {
+  const [error, setError] = (0, import_react27.useState)(null);
+  const [isLoading, setIsLoading] = (0, import_react27.useState)(false);
+  const getWallets = (0, import_react27.useCallback)(async (client) => {
     setIsLoading(true);
     setError(null);
     try {
@@ -4563,21 +4833,36 @@ function useUserWallets() {
 
 // src/wagmi/connector.ts
 var import_core = require("@wagmi/core");
-var import_viem5 = require("viem");
+var import_viem6 = require("viem");
 function avaCloudWallet() {
   return (0, import_core.createConnector)((config) => ({
     id: "avaCloudWallet",
     name: "AvaCloud Wallet",
     type: "injected",
-    async connect() {
+    async connect(parameters) {
+      const { withCapabilities } = parameters != null ? parameters : {};
       const { walletClient } = useViem();
       if (!walletClient) {
         throw new Error("AvaCloud Wallet not connected");
       }
       const accounts = await this.getAccounts();
       const chainId = await this.getChainId();
+      if (withCapabilities) {
+        const result = {
+          accounts: accounts.map((address) => ({
+            address,
+            capabilities: {}
+          })),
+          chainId
+        };
+        config.emitter.emit("connect", { accounts, chainId });
+        return result;
+      }
       config.emitter.emit("connect", { accounts, chainId });
-      return { accounts, chainId };
+      return {
+        accounts,
+        chainId
+      };
     },
     async disconnect() {
       config.emitter.emit("disconnect");
@@ -4609,7 +4894,7 @@ function avaCloudWallet() {
         this.disconnect();
       } else {
         config.emitter.emit("change", {
-          accounts: accounts.map((x) => (0, import_viem5.getAddress)(x))
+          accounts: accounts.map((x) => (0, import_viem6.getAddress)(x))
         });
       }
     },
@@ -4624,7 +4909,7 @@ function avaCloudWallet() {
 }
 
 // src/providers/GaslessProvider.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 var import_jsx_runtime24 = require("react/jsx-runtime");
 function validateGaslessConfig(config) {
   if (!config || typeof config !== "object") {
@@ -4658,15 +4943,15 @@ function validateGaslessConfig(config) {
   }
   return null;
 }
-var GaslessContext = (0, import_react27.createContext)(null);
+var GaslessContext = (0, import_react28.createContext)(null);
 function GaslessProvider({ children, config, fetchParams }) {
-  const [state, setState] = (0, import_react27.useState)({
+  const [state, setState] = (0, import_react28.useState)({
     isLoading: false,
     error: null,
     config: null
   });
   const { authServiceUrl, environment } = useAvaCloudWallet();
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (config) {
       const validationError = validateGaslessConfig(config);
       if (validationError) {
@@ -4753,9 +5038,16 @@ function GaslessProvider({ children, config, fetchParams }) {
   }, [config, fetchParams, authServiceUrl, environment]);
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(GaslessContext.Provider, { value: state, children });
 }
+function useGaslessConfig() {
+  const ctx = (0, import_react28.useContext)(GaslessContext);
+  if (!ctx) {
+    throw new Error("useGaslessConfig must be used within a GaslessProvider");
+  }
+  return ctx;
+}
 
 // src/hooks/useGaslessTransaction.ts
-var import_react28 = require("react");
+var import_react29 = require("react");
 var ethers = __toESM(require("ethers"));
 var import_axios = __toESM(require("axios"));
 var import_cubesigner_sdk6 = require("@cubist-labs/cubesigner-sdk");
@@ -4781,7 +5073,7 @@ var FORWARDER_GET_NONCE_ABI = [
   }
 ];
 function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContractAddress, abi: defaultAbi }) {
-  const [state, setState] = (0, import_react28.useState)({
+  const [state, setState] = (0, import_react29.useState)({
     isLoading: false,
     error: null,
     txHash: null
@@ -4789,14 +5081,14 @@ function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContract
   const config = gaslessConfig;
   const { wallet, cubistClient } = useAvaCloudWallet();
   useViem();
-  const reset = (0, import_react28.useCallback)(() => {
+  const reset = (0, import_react29.useCallback)(() => {
     setState({
       isLoading: false,
       error: null,
       txHash: null
     });
   }, []);
-  const validateConfig = (0, import_react28.useCallback)((config2) => {
+  const validateConfig = (0, import_react29.useCallback)((config2) => {
     if (!config2) {
       return "Gasless configuration is not available. Please ensure GaslessProvider is properly configured.";
     }
@@ -4830,7 +5122,7 @@ function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContract
     }
     return null;
   }, []);
-  const sendGaslessTransaction = (0, import_react28.useCallback)(async ({
+  const sendGaslessTransaction = (0, import_react29.useCallback)(async ({
     functionName,
     args = [],
     abi: overrideAbi,
@@ -4915,7 +5207,12 @@ function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContract
         const suffixParts = config.suffix.match(/^(\w+)\s+(.+)\)$/);
         if (suffixParts) {
           const [, , suffixName] = suffixParts;
-          message[suffixName] = Buffer.from(config.suffix, "utf8");
+          const encoder = new TextEncoder();
+          const suffixBytes = encoder.encode(config.suffix);
+          const paddedBytes = new Uint8Array(32);
+          paddedBytes.set(suffixBytes.slice(0, 32));
+          const hexString = Array.from(paddedBytes).map((b) => b.toString(16).padStart(2, "0")).join("");
+          message[suffixName] = "0x" + hexString;
         }
       }
       const domain = {
@@ -4924,12 +5221,22 @@ function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContract
         chainId: (await provider.getNetwork()).chainId,
         verifyingContract: config.forwarderAddress
       };
-      const digest = ethers.utils._TypedDataEncoder.hash(domain, {
-        [config.requestType]: types[config.requestType]
-      }, message);
       const key = await cubistClient.org().getKeyByMaterialId(import_cubesigner_sdk6.Secp256k1.Evm, wallet.address);
-      const sigResp = await key.signBlob({
-        message_base64: Buffer.from(digest.slice(2), "hex").toString("base64")
+      const sigResp = await key.signEip712({
+        chain_id: domain.chainId,
+        typed_data: {
+          domain: {
+            name: domain.name,
+            version: domain.version,
+            chainId: `0x${domain.chainId.toString(16)}`,
+            verifyingContract: domain.verifyingContract
+          },
+          primaryType: config.requestType,
+          types: {
+            [config.requestType]: types[config.requestType]
+          },
+          message
+        }
       });
       const signatureData = sigResp.data().signature;
       const signature = signatureData.startsWith("0x") ? signatureData : `0x${signatureData}`;
@@ -5020,6 +5327,7 @@ function useGaslessTransaction({ gaslessConfig, contractAddress: defaultContract
   useAvaCloudWallet,
   useBlockchain,
   useChainId,
+  useGaslessConfig,
   useGaslessTransaction,
   useGlacier,
   usePostMessage,