@getpara/graz-integration 2.0.0-dev.10 → 2.0.0-dev.11

package/dist/connector.js

@@ -18,9 +18,15 @@ class ParaGrazConnector extends CoreParaGrazConnector {
       let delay = 500;
       const MAX_DELAY = 5e3;
       while (true) {
-        if (yield this.paraWebClient.isFullyLoggedIn()) return;
-        if (this.isModalClosed) throw new Error("Para connector: user closed login modal");
-        if (Date.now() >= deadline) throw new Error("Para connector: login timeout");
+        if (yield this.paraWebClient.isFullyLoggedIn()) {
+          return;
+        }
+        if (this.isModalClosed) {
+          throw new Error("Login modal closed by user");
+        }
+        if (Date.now() >= deadline) {
+          throw new Error(`Login timeout after ${timeoutMs / 1e3}s`);
+        }
         yield new Promise((r) => setTimeout(r, delay));
         delay = Math.min(delay * 1.5, MAX_DELAY);
       }
@@ -51,7 +57,10 @@ class ParaGrazConnector extends CoreParaGrazConnector {
         (_e = (_d = this.events) == null ? void 0 : _d.onEnabled) == null ? void 0 : _e.call(_d, chainIds, this);
       } catch (err) {
         this.enabledChainIds = previousEnabled;
-        throw err;
+        if (err instanceof Error) {
+          throw err;
+        }
+        throw new Error("Failed to enable Para wallet with modal");
       } finally {
         this.isModalClosed = true;
       }

package/dist/connectorModal.js

@@ -8,13 +8,20 @@ import { jsx } from "react/jsx-runtime";
 import { setIsOpen } from "@getpara/react-sdk-lite";
 let rendererPromise = null;
 function getRenderer() {
+  console.log("[DEBUG] getRenderer called.");
   if (!rendererPromise) {
     rendererPromise = (() => __async(this, null, function* () {
       try {
         const { createRoot } = yield import("react-dom/client");
+        console.log("[DEBUG] Imported createRoot from react-dom/client.");
         return { createRoot: (el) => createRoot(el) };
-      } catch (e) {
+      } catch (err) {
+        console.log(
+          "[DEBUG] Failed to import react-dom/client; falling back to legacy ReactDOM. Error:",
+          err.message
+        );
         const ReactDOM = yield import("react-dom");
+        console.log("[DEBUG] Imported legacy ReactDOM.");
         return {
           legacyRender: ReactDOM.render,
           legacyUnmount: ReactDOM.unmountComponentAtNode
@@ -24,54 +31,83 @@ function getRenderer() {
   }
   return rendererPromise;
 }
+const wrap = (ctx, err, extraInfo) => {
+  const baseMsg = `connectorModal error in ${ctx}: ${err.message}`;
+  const fullMsg = extraInfo ? `${baseMsg}. Additional details: ${extraInfo}` : baseMsg;
+  throw new Error(fullMsg);
+};
 function renderModal(para, modalProps, onCloseArg, queryClient) {
   return __async(this, null, function* () {
     var _a, _b, _c;
+    console.log("[DEBUG] renderModal called with para:", para, "modalProps:", modalProps, "queryClient:", queryClient);
     if (typeof window === "undefined") {
+      console.log("[DEBUG] renderModal: window undefined, returning early.");
       return;
     }
     const props = modalProps != null ? modalProps : {};
+    console.log("[DEBUG] Using modal props:", props);
     const containerId = "para-modal";
     let container = document.getElementById(containerId);
+    console.log("[DEBUG] Existing container:", container);
     if (!container) {
       container = document.createElement("div");
       container.id = containerId;
       document.body.appendChild(container);
+      console.log("[DEBUG] Created new container:", container);
     }
-    const renderer = yield getRenderer();
-    let root = (_a = container.__paraRoot) != null ? _a : null;
-    if (!root && renderer.createRoot) {
-      root = renderer.createRoot(container);
-      container.__paraRoot = root;
-    }
-    const { ParaProvider } = yield import("@getpara/react-sdk-lite");
-    const { QueryClientProvider } = yield import("@tanstack/react-query");
-    const handleClose = () => {
-      var _a2, _b2;
-      onCloseArg();
-      (_a2 = props.onClose) == null ? void 0 : _a2.call(props);
-      setIsOpen(false);
+    try {
+      const renderer = yield getRenderer();
+      console.log("[DEBUG] Retrieved renderer:", renderer);
+      let root = (_a = container.__paraRoot) != null ? _a : null;
+      console.log("[DEBUG] Existing root:", root);
+      if (!root && renderer.createRoot) {
+        root = renderer.createRoot(container);
+        container.__paraRoot = root;
+        console.log("[DEBUG] Created new root with createRoot.");
+      }
+      const { ParaProvider } = yield import("@getpara/react-sdk-lite");
+      console.log("[DEBUG] Imported ParaProvider from @getpara/react-sdk-lite.");
+      const { QueryClientProvider } = yield import("@tanstack/react-query");
+      console.log("[DEBUG] Imported QueryClientProvider from @tanstack/react-query.");
+      const handleClose = () => {
+        var _a2, _b2;
+        console.log("[DEBUG] handleClose triggered.");
+        onCloseArg();
+        (_a2 = props.onClose) == null ? void 0 : _a2.call(props);
+        setIsOpen(false);
+        if (root) {
+          root.unmount();
+          console.log("[DEBUG] Unmounted using root.unmount.");
+        } else {
+          (_b2 = renderer.legacyUnmount) == null ? void 0 : _b2.call(renderer, container);
+          console.log("[DEBUG] Unmounted using legacyUnmount.");
+        }
+        container == null ? void 0 : container.remove();
+        console.log("[DEBUG] Removed container.");
+      };
+      const element = /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(
+        ParaProvider,
+        {
+          paraClientConfig: para,
+          config: { appName: (_b = props.appName) != null ? _b : "" },
+          paraModalConfig: __spreadProps(__spreadValues({}, props), { onClose: handleClose })
+        }
+      ) });
+      console.log("[DEBUG] Created render element.");
       if (root) {
-        root.unmount();
+        root.render(element);
+        console.log("[DEBUG] Rendered using root.render.");
       } else {
-        (_b2 = renderer.legacyUnmount) == null ? void 0 : _b2.call(renderer, container);
+        (_c = renderer.legacyRender) == null ? void 0 : _c.call(renderer, element, container);
+        console.log("[DEBUG] Rendered using legacyRender.");
       }
+      setIsOpen(true);
+      console.log("[DEBUG] Set modal isOpen to true.");
+    } catch (err) {
+      console.log("[DEBUG] Error in renderModal; cleaning up container.");
       container == null ? void 0 : container.remove();
-    };
-    const element = /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(
-      ParaProvider,
-      {
-        paraClientConfig: para,
-        config: { appName: (_b = props.appName) != null ? _b : "" },
-        paraModalConfig: __spreadProps(__spreadValues({}, props), { onClose: handleClose })
-      }
-    ) });
-    if (root) {
-      root.render(element);
-    } else {
-      (_c = renderer.legacyRender) == null ? void 0 : _c.call(renderer, element, container);
+      throw wrap("renderModal", err, `containerId: ${containerId}, modalProps: ${JSON.stringify(props)}`);
     }
-    setIsOpen(true);
   });
 }
 export {

package/dist/index.d.ts

@@ -1,4 +1,2 @@
 export { ParaGrazConnector } from './connector';
 export type { ParaModalProps, ParaGrazConfig } from './connector';
-export type { ParaGrazConfig as CoreParaGrazConfig } from '@getpara/graz-connector';
-export { ParaWeb, Environment, WalletType, AuthLayout, AuthMethod, OAuthMethod } from '@getpara/react-sdk-lite';

package/dist/index.js

@@ -1,13 +1,6 @@
 "use client";
 import "./chunk-IV3L3JVM.js";
 import { ParaGrazConnector } from "./connector";
-import { ParaWeb, Environment, WalletType, AuthLayout, AuthMethod, OAuthMethod } from "@getpara/react-sdk-lite";
 export {
-  AuthLayout,
-  AuthMethod,
-  Environment,
-  OAuthMethod,
-  ParaGrazConnector,
-  ParaWeb,
-  WalletType
+  ParaGrazConnector
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getpara/graz-integration",
-  "version": "2.0.0-dev.10",
+  "version": "2.0.0-dev.11",
   "sideEffects": false,
   "type": "module",
   "main": "dist/index.js",
@@ -11,15 +11,16 @@
     "typegen": "tsc --emitDeclarationOnly"
   },
   "dependencies": {
-    "@getpara/graz-connector": "2.0.0-dev.10",
-    "@getpara/react-sdk-lite": "2.0.0-alpha.42"
+    "@getpara/graz-connector": "~2.0.0-dev.11"
   },
   "devDependencies": {
+    "@getpara/react-sdk-lite": "~2.0.0-alpha.44",
     "@tanstack/react-query": "^5.74.0",
     "graz": "^0.3.3",
     "typescript": "5.1.6"
   },
   "peerDependencies": {
+    "@getpara/react-sdk-lite": "~2.0.0-alpha.44",
     "@tanstack/react-query": "^5.74.0",
     "graz": "^0.3.3",
     "react": ">=18",

package/src/connector.ts

@@ -27,10 +27,20 @@ export class ParaGrazConnector extends CoreParaGrazConnector {
     const deadline = Date.now() + timeoutMs;
     let delay = 500;
     const MAX_DELAY = 5_000;
+
     while (true) {
-      if (await this.paraWebClient.isFullyLoggedIn()) return;
-      if (this.isModalClosed) throw new Error('Para connector: user closed login modal');
-      if (Date.now() >= deadline) throw new Error('Para connector: login timeout');
+      if (await this.paraWebClient.isFullyLoggedIn()) {
+        return;
+      }
+
+      if (this.isModalClosed) {
+        throw new Error('Login modal closed by user');
+      }
+
+      if (Date.now() >= deadline) {
+        throw new Error(`Login timeout after ${timeoutMs / 1000}s`);
+      }
+
       await new Promise(r => setTimeout(r, delay));
       delay = Math.min(delay * 1.5, MAX_DELAY);
     }
@@ -39,13 +49,17 @@ export class ParaGrazConnector extends CoreParaGrazConnector {
   async enable(chainIdsInput: string | string[]): Promise<void> {
     const chainIds = toArray(chainIdsInput);
     const previousEnabled = new Set(this.enabledChainIds);
+
     try {
       chainIds.forEach(id => this.enabledChainIds.add(id));
+
       if (await this.hasCosmosWallet()) {
         this.events?.onEnabled?.(chainIds, this);
         return;
       }
+
       this.isModalClosed = false;
+
       await renderModal(
         this.paraWebClient,
         this.config.modalProps ?? {},
@@ -54,12 +68,19 @@ export class ParaGrazConnector extends CoreParaGrazConnector {
         },
         this.config.queryClient!,
       );
+
       await this.waitForLogin();
       await this.waitForAccounts();
+
       this.events?.onEnabled?.(chainIds, this);
     } catch (err) {
       this.enabledChainIds = previousEnabled;
-      throw err;
+
+      if (err instanceof Error) {
+        throw err;
+      }
+
+      throw new Error('Failed to enable Para wallet with modal');
     } finally {
       this.isModalClosed = true;
     }

package/src/connectorModal.tsx

@@ -12,13 +12,20 @@ let rendererPromise: Promise<{
 }> | null = null;
 
 function getRenderer() {
+  console.log('[DEBUG] getRenderer called.');
   if (!rendererPromise) {
     rendererPromise = (async () => {
       try {
         const { createRoot } = await import('react-dom/client');
+        console.log('[DEBUG] Imported createRoot from react-dom/client.');
         return { createRoot: (el: HTMLElement) => createRoot(el) };
-      } catch {
+      } catch (err) {
+        console.log(
+          '[DEBUG] Failed to import react-dom/client; falling back to legacy ReactDOM. Error:',
+          (err as Error).message,
+        );
         const ReactDOM = await import('react-dom');
+        console.log('[DEBUG] Imported legacy ReactDOM.');
         return {
           legacyRender: ReactDOM.render,
           legacyUnmount: ReactDOM.unmountComponentAtNode,
@@ -29,55 +36,85 @@ function getRenderer() {
   return rendererPromise;
 }
 
+const wrap = (ctx: string, err: unknown, extraInfo?: string): never => {
+  const baseMsg = `connectorModal error in ${ctx}: ${(err as Error).message}`;
+  const fullMsg = extraInfo ? `${baseMsg}. Additional details: ${extraInfo}` : baseMsg;
+  throw new Error(fullMsg);
+};
+
 export async function renderModal(
   para: ParaWeb,
   modalProps: Partial<ParaModalProps> | undefined,
   onCloseArg: () => void,
   queryClient: QueryClient,
 ): Promise<void> {
+  console.log('[DEBUG] renderModal called with para:', para, 'modalProps:', modalProps, 'queryClient:', queryClient);
   if (typeof window === 'undefined') {
+    console.log('[DEBUG] renderModal: window undefined, returning early.');
     return;
   }
   const props = modalProps ?? {};
+  console.log('[DEBUG] Using modal props:', props);
   const containerId = 'para-modal';
   let container = document.getElementById(containerId) as HTMLElement | null;
+  console.log('[DEBUG] Existing container:', container);
   if (!container) {
     container = document.createElement('div');
     container.id = containerId;
     document.body.appendChild(container);
+    console.log('[DEBUG] Created new container:', container);
   }
-  const renderer = await getRenderer();
-  let root: Root | null = (container as any).__paraRoot ?? null;
-  if (!root && renderer.createRoot) {
-    root = renderer.createRoot(container);
-    (container as any).__paraRoot = root;
-  }
-  const { ParaProvider } = await import('@getpara/react-sdk-lite');
-  const { QueryClientProvider } = await import('@tanstack/react-query');
-  const handleClose = () => {
-    onCloseArg();
-    props.onClose?.();
-    setIsOpen(false);
+  try {
+    const renderer = await getRenderer();
+    console.log('[DEBUG] Retrieved renderer:', renderer);
+    let root: Root | null = (container as any).__paraRoot ?? null;
+    console.log('[DEBUG] Existing root:', root);
+    if (!root && renderer.createRoot) {
+      root = renderer.createRoot(container);
+      (container as any).__paraRoot = root;
+      console.log('[DEBUG] Created new root with createRoot.');
+    }
+    const { ParaProvider } = await import('@getpara/react-sdk-lite');
+    console.log('[DEBUG] Imported ParaProvider from @getpara/react-sdk-lite.');
+    const { QueryClientProvider } = await import('@tanstack/react-query');
+    console.log('[DEBUG] Imported QueryClientProvider from @tanstack/react-query.');
+    const handleClose = () => {
+      console.log('[DEBUG] handleClose triggered.');
+      onCloseArg();
+      props.onClose?.();
+      setIsOpen(false);
+      if (root) {
+        root.unmount();
+        console.log('[DEBUG] Unmounted using root.unmount.');
+      } else {
+        renderer.legacyUnmount?.(container!);
+        console.log('[DEBUG] Unmounted using legacyUnmount.');
+      }
+      container?.remove();
+      console.log('[DEBUG] Removed container.');
+    };
+    const element = (
+      <QueryClientProvider client={queryClient}>
+        <ParaProvider
+          paraClientConfig={para}
+          config={{ appName: props.appName ?? '' }}
+          paraModalConfig={{ ...props, onClose: handleClose }}
+        />
+      </QueryClientProvider>
+    );
+    console.log('[DEBUG] Created render element.');
     if (root) {
-      root.unmount();
+      root.render(element);
+      console.log('[DEBUG] Rendered using root.render.');
     } else {
-      renderer.legacyUnmount?.(container!);
+      renderer.legacyRender?.(element, container!);
+      console.log('[DEBUG] Rendered using legacyRender.');
     }
+    setIsOpen(true);
+    console.log('[DEBUG] Set modal isOpen to true.');
+  } catch (err) {
+    console.log('[DEBUG] Error in renderModal; cleaning up container.');
     container?.remove();
-  };
-  const element = (
-    <QueryClientProvider client={queryClient}>
-      <ParaProvider
-        paraClientConfig={para}
-        config={{ appName: props.appName ?? '' }}
-        paraModalConfig={{ ...props, onClose: handleClose }}
-      />
-    </QueryClientProvider>
-  );
-  if (root) {
-    root.render(element);
-  } else {
-    renderer.legacyRender?.(element, container!);
+    throw wrap('renderModal', err, `containerId: ${containerId}, modalProps: ${JSON.stringify(props)}`);
   }
-  setIsOpen(true);
 }

package/src/index.ts

@@ -1,4 +1,2 @@
 export { ParaGrazConnector } from './connector';
 export type { ParaModalProps, ParaGrazConfig } from './connector';
-export type { ParaGrazConfig as CoreParaGrazConfig } from '@getpara/graz-connector';
-export { ParaWeb, Environment, WalletType, AuthLayout, AuthMethod, OAuthMethod } from '@getpara/react-sdk-lite';