@getpara/graz-integration 2.0.0-alpha.50 → 2.0.0-alpha.51

package/package.json

@@ -1,19 +1,22 @@
 {
   "name": "@getpara/graz-integration",
-  "version": "2.0.0-alpha.50",
+  "version": "2.0.0-alpha.51",
   "sideEffects": false,
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
   "scripts": {
     "typegen": "tsc --emitDeclarationOnly",
     "build": "rm -rf dist && yarn typegen && node ./scripts/build.mjs"
   },
   "dependencies": {
-    "@getpara/graz-connector": "2.0.0-alpha.50"
+    "@getpara/graz-connector": "2.0.0-alpha.51"
   },
   "devDependencies": {
-    "@getpara/react-sdk-lite": "2.0.0-alpha.50",
+    "@getpara/react-sdk-lite": "2.0.0-alpha.51",
     "@tanstack/react-query": "^5.74.0",
     "graz": "^0.3.3",
     "react": "^18.2.0",
@@ -21,7 +24,7 @@
     "typescript": "5.1.6"
   },
   "peerDependencies": {
-    "@getpara/react-sdk-lite": "2.0.0-alpha.50",
+    "@getpara/react-sdk-lite": "2.0.0-alpha.51",
     "@tanstack/react-query": "^5.74.0",
     "graz": "^0.3.3",
     "react": ">=18.0.0",

package/scripts/build.mjs

@@ -1,36 +0,0 @@
-import * as esbuild from 'esbuild';
-import * as fs from 'fs/promises';
-import { fileURLToPath } from 'url';
-import { dirname, resolve } from 'path';
-import { glob } from 'glob';
-
-const entryPoints = await glob('src/**/*.{ts,tsx,js,jsx}');
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const distDir = resolve(__dirname, '../dist');
-
-await fs.mkdir(distDir, { recursive: true });
-await fs.writeFile(`${distDir}/package.json`, JSON.stringify({ type: 'module', sideEffects: false }, null, 2));
-
-/** @type {import('esbuild').BuildOptions} */
-await esbuild.build({
-  banner: {
-    js: '"use client";', // Required for Next 13 App Router
-  },
-  bundle: false,
-  write: true,
-  format: 'esm',
-  loader: {
-    '.png': 'dataurl',
-    '.svg': 'dataurl',
-    '.json': 'text',
-  },
-  platform: 'browser',
-  entryPoints,
-  outdir: distDir,
-  allowOverwrite: true,
-  splitting: true, // Required for tree shaking
-  minify: false,
-  target: ['es2015'],
-  packages: 'external',
-});

package/src/connector.ts

@@ -1,88 +0,0 @@
-import { ChainInfo } from '@keplr-wallet/types';
-import {
-  ParaGrazConnector as CoreParaGrazConnector,
-  ParaGrazConfig as CoreParaGrazConfig,
-  toArray,
-} from '@getpara/graz-connector';
-import { ParaModalProps as CoreParaModalProps } from '@getpara/react-sdk-lite';
-import { renderModal } from './connectorModal';
-import { QueryClient } from '@tanstack/react-query';
-
-export type ParaModalProps = Omit<CoreParaModalProps, 'isOpen' | 'para'> & { appName: string };
-
-export interface ParaGrazConfig extends CoreParaGrazConfig {
-  modalProps?: ParaModalProps;
-  queryClient?: QueryClient;
-}
-
-export class ParaGrazConnector extends CoreParaGrazConnector {
-  protected isModalClosed = true;
-  declare protected config: ParaGrazConfig;
-
-  constructor(config: ParaGrazConfig, chains?: ChainInfo[] | null) {
-    super(config, chains);
-  }
-
-  protected async waitForLogin(timeoutMs = 60_000): Promise<void> {
-    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('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);
-    }
-  }
-
-  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 ?? {},
-        () => {
-          this.isModalClosed = true;
-        },
-        this.config.queryClient!,
-      );
-
-      await this.waitForLogin();
-      await this.waitForAccounts();
-
-      this.events?.onEnabled?.(chainIds, this);
-    } catch (err) {
-      this.enabledChainIds = previousEnabled;
-
-      if (err instanceof Error) {
-        throw err;
-      }
-
-      throw new Error('Failed to enable Para wallet with modal');
-    } finally {
-      this.isModalClosed = true;
-    }
-  }
-}

package/src/connectorModal.tsx

@@ -1,120 +0,0 @@
-import ParaWeb, { setIsOpen } from '@getpara/react-sdk-lite';
-import React from 'react';
-import { type QueryClient } from '@tanstack/react-query';
-import { ParaModalProps } from './connector';
-
-type Root = { render(node: React.ReactNode): void; unmount(): void };
-
-let rendererPromise: Promise<{
-  createRoot?: (el: HTMLElement) => Root;
-  legacyRender?: (node: React.ReactNode, el: HTMLElement) => void;
-  legacyUnmount?: (el: HTMLElement) => void;
-}> | 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 (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,
-        };
-      }
-    })();
-  }
-  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);
-  }
-  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.render(element);
-      console.log('[DEBUG] Rendered using root.render.');
-    } else {
-      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();
-    throw wrap('renderModal', err, `containerId: ${containerId}, modalProps: ${JSON.stringify(props)}`);
-  }
-}

package/src/index.ts

@@ -1,2 +0,0 @@
-export { ParaGrazConnector } from './connector';
-export type { ParaModalProps, ParaGrazConfig } from './connector';

package/tsconfig.json

@@ -1,13 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "./dist",
-    "lib": ["dom", "dom.iterable", "esnext"],
-    "jsx": "react-jsx",
-    "module": "ESNext",
-    "declaration": true,
-    "declarationDir": "./dist"
-  },
-  "include": ["src/**/*.ts", "src/**/*.tsx"],
-  "exclude": ["node_modules", "dist", "**/*.test.ts", "**/*.test.tsx", "__tests__"]
-}