npm - @thru/wallet - Versions diffs - 0.2.22 - Mend

@thru/wallet 0.2.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (69) hide show

package/README.md +67 -0
package/android/build.gradle +37 -0
package/android/src/main/AndroidManifest.xml +1 -0
package/android/src/main/java/org/thru/walletnative/ThruWebViewBridgeModule.kt +77 -0
package/app.plugin.cjs +101 -0
package/dist/BrowserSDK-CpRFiJsW.d.ts +409 -0
package/dist/index.d.ts +23 -0
package/dist/index.js +941 -0
package/dist/index.js.map +1 -0
package/dist/native/react.d.ts +109 -0
package/dist/native/react.js +2381 -0
package/dist/native/react.js.map +1 -0
package/dist/native.d.ts +329 -0
package/dist/native.js +1126 -0
package/dist/native.js.map +1 -0
package/dist/react-ui.d.ts +5 -0
package/dist/react-ui.js +266 -0
package/dist/react-ui.js.map +1 -0
package/dist/react.d.ts +66 -0
package/dist/react.js +1151 -0
package/dist/react.js.map +1 -0
package/expo-module.config.json +6 -0
package/package.json +114 -0
package/src/BrowserSDK.ts +315 -0
package/src/index.ts +27 -0
package/src/interfaces/IThruChain.ts +37 -0
package/src/interfaces/accounts.ts +61 -0
package/src/interfaces/index.ts +9 -0
package/src/interfaces/types.ts +95 -0
package/src/native/NativeSDK.test.ts +819 -0
package/src/native/NativeSDK.ts +773 -0
package/src/native/index.ts +39 -0
package/src/native/provider/NativeProvider.ts +363 -0
package/src/native/provider/WebViewBridge.test.ts +339 -0
package/src/native/provider/WebViewBridge.ts +339 -0
package/src/native/provider/chains/ThruChain.ts +85 -0
package/src/native/provider/shell.html +88 -0
package/src/native/provider/shell.test.ts +56 -0
package/src/native/provider/shell.ts +111 -0
package/src/native/provider/shims-html.d.ts +4 -0
package/src/native/react/ThruContext.ts +37 -0
package/src/native/react/ThruProvider.tsx +168 -0
package/src/native/react/ThruWalletSheet.tsx +1162 -0
package/src/native/react/android-webauthn.ts +37 -0
package/src/native/react/hooks/useAccounts.ts +35 -0
package/src/native/react/hooks/useThru.ts +11 -0
package/src/native/react/hooks/useWallet.ts +71 -0
package/src/native/react/hooks/useWalletAvailability.ts +31 -0
package/src/native/react/hooks/waitForWallet.ts +21 -0
package/src/native/react/index.ts +29 -0
package/src/protocol/index.ts +2 -0
package/src/protocol/postMessage.ts +283 -0
package/src/protocol/walletState.ts +12 -0
package/src/provider/EmbeddedProvider.ts +330 -0
package/src/provider/IframeManager.ts +438 -0
package/src/provider/chains/ThruChain.ts +86 -0
package/src/provider/index.ts +17 -0
package/src/provider/types/messages.ts +37 -0
package/src/react/ThruContext.ts +31 -0
package/src/react/ThruProvider.tsx +169 -0
package/src/react/hooks/useAccounts.ts +38 -0
package/src/react/hooks/useThru.ts +11 -0
package/src/react/hooks/useWallet.ts +81 -0
package/src/react/index.ts +30 -0
package/src/react-ui/ThruAccountSwitcher.tsx +187 -0
package/src/react-ui/custom.d.ts +8 -0
package/src/react-ui/index.ts +1 -0
package/src/static/logo.png +0 -0
package/src/static/logomark_red.svg +11 -0

package/src/native/provider/chains/ThruChain.ts ADDED Viewed

@@ -0,0 +1,85 @@
+import {
+  AddressType,
+  type IThruChain,
+  type ThruSigningContext,
+  type ThruTransactionIntent,
+} from "../../../interfaces";
+import { POST_MESSAGE_REQUEST_TYPES, createRequestId } from "../../../protocol";
+import type { NativeProvider } from "../NativeProvider";
+import type { WebViewBridge } from "../WebViewBridge";
+/**
+ * NativeThruChain - mirror of EmbeddedThruChain over the WebView bridge.
+ * Sign moments toggle the host bottom sheet via provider.requestShow /
+ * requestHide instead of iframe.show / hide.
+ */
+export class NativeThruChain implements IThruChain {
+  private readonly bridge: WebViewBridge;
+  private readonly provider: NativeProvider;
+  private readonly origin: string;
+  constructor(bridge: WebViewBridge, provider: NativeProvider, origin: string) {
+    this.bridge = bridge;
+    this.provider = provider;
+    this.origin = origin;
+  }
+  get connected(): boolean {
+    return this.provider.isConnected();
+  }
+  async connect(): Promise<{ publicKey: string }> {
+    const result = await this.provider.connect();
+    const selectedAccount = result.selectedAccount;
+    const thruAccount =
+      selectedAccount?.accountType === AddressType.THRU
+        ? selectedAccount
+        : result.accounts.find((addr) => addr.accountType === AddressType.THRU);
+    if (!thruAccount) {
+      throw new Error("Thru address not found in connection result");
+    }
+    return { publicKey: thruAccount.address };
+  }
+  async disconnect(): Promise<void> {
+    await this.provider.disconnect();
+  }
+  async getSigningContext(): Promise<ThruSigningContext> {
+    if (!this.provider.isConnected()) {
+      throw new Error("Wallet not connected");
+    }
+    const response = await this.bridge.sendMessage({
+      id: createRequestId(),
+      type: POST_MESSAGE_REQUEST_TYPES.GET_SIGNING_CONTEXT,
+      origin: this.origin,
+    });
+    return response.result.signingContext;
+  }
+  async signTransaction(transaction: ThruTransactionIntent): Promise<string> {
+    if (!this.provider.isConnected()) {
+      throw new Error("Wallet not connected");
+    }
+    this.provider.requestShow();
+    try {
+      const response = await this.bridge.sendMessage({
+        id: createRequestId(),
+        type: POST_MESSAGE_REQUEST_TYPES.SIGN_TRANSACTION,
+        payload: {
+          walletAddress: transaction.walletAddress,
+          programAddress: transaction.programAddress,
+          instructionData: transaction.instructionData,
+          readWriteAddresses: transaction.readWriteAddresses,
+          readOnlyAddresses: transaction.readOnlyAddresses,
+          review: transaction.review,
+        },
+        origin: this.origin,
+      });
+      return response.result.signedTransaction;
+    } finally {
+      this.provider.requestHide();
+    }
+  }
+}

package/src/native/provider/shell.html ADDED Viewed

@@ -0,0 +1,88 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+  <title>thru-shell</title>
+  <style>
+    html, body, iframe {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      border: 0;
+      background: transparent;
+    }
+  </style>
+</head>
+<body>
+  <iframe
+    id="w"
+    data-src="WALLET_URL_PLACEHOLDER"
+    allow="publickey-credentials-get *; publickey-credentials-create *"
+  ></iframe>
+  <script>
+    (function () {
+      var f = document.getElementById('w');
+      var ORIGIN = 'WALLET_ORIGIN_PLACEHOLDER';
+      function frameId() {
+        try {
+          return new URL(f.dataset.src).searchParams.get('tn_frame_id');
+        } catch (err) {
+          return null;
+        }
+      }
+      function postShell(type, data) {
+        var rn = window.ReactNativeWebView;
+        if (!rn || !rn.postMessage) return;
+        try {
+          rn.postMessage(JSON.stringify({
+            type: type,
+            frameId: frameId(),
+            data: data || {}
+          }));
+        } catch (err) {
+          /* drop unserializable messages */
+        }
+      }
+      function postToWallet(msg) {
+        if (!f.contentWindow) return;
+        var outbound = msg;
+        if (msg && typeof msg === 'object') {
+          outbound = Object.assign({}, msg, { frameId: frameId() });
+        }
+        f.contentWindow.postMessage(outbound, ORIGIN);
+      }
+      window.addEventListener('message', function (e) {
+        var fromFrame = e.source === f.contentWindow;
+        var fromWalletOrigin = e.origin === ORIGIN;
+        var hasFrameId = e.data && e.data.frameId === frameId();
+        if (!fromWalletOrigin || (!fromFrame && !hasFrameId)) return;
+        var rn = window.ReactNativeWebView;
+        if (rn && rn.postMessage) {
+          try {
+            rn.postMessage(JSON.stringify(e.data));
+          } catch (err) {
+            /* drop unserializable messages */
+          }
+        }
+      });
+      window.__pushIn = postToWallet;
+      window.addEventListener('thru:native-sheet-dismiss', function () {
+        postToWallet({
+          type: 'thru:native-sheet-dismiss',
+          frameId: frameId()
+        });
+      });
+      f.addEventListener('load', function () {
+        postShell('shell:iframe-load', { src: f.src });
+      });
+      f.addEventListener('error', function () {
+        postShell('shell:iframe-error', { src: f.src });
+      });
+      postShell('shell:loading', { src: f.dataset.src });
+      f.src = f.dataset.src;
+    })();
+  </script>
+</body>
+</html>

package/src/native/provider/shell.test.ts ADDED Viewed

@@ -0,0 +1,56 @@
+import { readFileSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { dirname, join } from 'node:path';
+import { describe, expect, it } from 'vitest';
+import { getShellHtml } from './shell';
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const TEST_SHELL_OPTIONS = {
+  walletUrl: 'https://wallet.thru.org/embedded?tn_frame_id=frame_test',
+  walletOrigin: 'https://wallet.thru.org',
+};
+describe('native shell HTML', () => {
+  it('forwards WKWebView iframe messages when event.source is unavailable', () => {
+    const html = getShellHtml(TEST_SHELL_OPTIONS);
+    expect(html).toContain('var fromFrame = e.source === f.contentWindow;');
+    expect(html).toContain('var fromWalletOrigin = e.origin === ORIGIN;');
+    expect(html).toContain(
+      'var hasFrameId = e.data && e.data.frameId === frameId();'
+    );
+    expect(html).toContain(
+      'if (!fromWalletOrigin || (!fromFrame && !hasFrameId)) return;'
+    );
+  });
+  it('forwards native sheet dismissals into the wallet iframe', () => {
+    const html = getShellHtml(TEST_SHELL_OPTIONS);
+    expect(html).toContain(
+      "window.addEventListener('thru:native-sheet-dismiss', function () {"
+    );
+    expect(html).toContain("type: 'thru:native-sheet-dismiss'");
+    expect(html).toContain('postToWallet({');
+  });
+  it('substitutes shell placeholders without reprocessing inserted values', () => {
+    const walletUrl =
+      'https://wallet.thru.org/embedded?marker=WALLET_ORIGIN_PLACEHOLDER';
+    const walletOrigin = 'thru-mobile://WALLET_URL_PLACEHOLDER/$&';
+    const html = getShellHtml({ walletUrl, walletOrigin });
+    expect(html).toContain(`data-src="${walletUrl}"`);
+    expect(html).toContain(`var ORIGIN = '${walletOrigin}';`);
+  });
+  it('tags native requests with the wallet frame id before forwarding', () => {
+    const html = getShellHtml(TEST_SHELL_OPTIONS);
+    expect(html).toContain(
+      'outbound = Object.assign({}, msg, { frameId: frameId() });'
+    );
+    expect(html).toContain('f.contentWindow.postMessage(outbound, ORIGIN);');
+  });
+});

package/src/native/provider/shell.ts ADDED Viewed

@@ -0,0 +1,111 @@
+const SHELL_HTML_TEMPLATE = String.raw`<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+  <title>thru-shell</title>
+  <style>
+    html, body, iframe {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      height: 100%;
+      border: 0;
+      background: transparent;
+    }
+  </style>
+</head>
+<body>
+  <iframe
+    id="w"
+    data-src="WALLET_URL_PLACEHOLDER"
+    allow="publickey-credentials-get *; publickey-credentials-create *"
+  ></iframe>
+  <script>
+    (function () {
+      var f = document.getElementById('w');
+      var ORIGIN = 'WALLET_ORIGIN_PLACEHOLDER';
+      function frameId() {
+        try {
+          return new URL(f.dataset.src).searchParams.get('tn_frame_id');
+        } catch (err) {
+          return null;
+        }
+      }
+      function postShell(type, data) {
+        var rn = window.ReactNativeWebView;
+        if (!rn || !rn.postMessage) return;
+        try {
+          rn.postMessage(JSON.stringify({
+            type: type,
+            frameId: frameId(),
+            data: data || {}
+          }));
+        } catch (err) {
+          /* drop unserializable messages */
+        }
+      }
+      function postToWallet(msg) {
+        if (!f.contentWindow) return;
+        var outbound = msg;
+        if (msg && typeof msg === 'object') {
+          outbound = Object.assign({}, msg, { frameId: frameId() });
+        }
+        f.contentWindow.postMessage(outbound, ORIGIN);
+      }
+      window.addEventListener('message', function (e) {
+        var fromFrame = e.source === f.contentWindow;
+        var fromWalletOrigin = e.origin === ORIGIN;
+        var hasFrameId = e.data && e.data.frameId === frameId();
+        if (!fromWalletOrigin || (!fromFrame && !hasFrameId)) return;
+        var rn = window.ReactNativeWebView;
+        if (rn && rn.postMessage) {
+          try {
+            rn.postMessage(JSON.stringify(e.data));
+          } catch (err) {
+            /* drop unserializable messages */
+          }
+        }
+      });
+      window.__pushIn = postToWallet;
+      window.addEventListener('thru:native-sheet-dismiss', function () {
+        postToWallet({
+          type: 'thru:native-sheet-dismiss',
+          frameId: frameId()
+        });
+      });
+      f.addEventListener('load', function () {
+        postShell('shell:iframe-load', { src: f.src });
+      });
+      f.addEventListener('error', function () {
+        postShell('shell:iframe-error', { src: f.src });
+      });
+      postShell('shell:loading', { src: f.dataset.src });
+      f.src = f.dataset.src;
+    })();
+  </script>
+</body>
+</html>`;
+const SHELL_PLACEHOLDER_PATTERN =
+  /WALLET_URL_PLACEHOLDER|WALLET_ORIGIN_PLACEHOLDER/g;
+export interface ShellOptions {
+  walletUrl: string;
+  walletOrigin: string;
+}
+/**
+ * Returns the shell HTML for loading wallet.thru.org/embedded inside a
+ * react-native-webview. The shell hosts an <iframe> pointing at the wallet
+ * and bridges window.postMessage traffic between the iframe and the
+ * react-native-webview's onMessage / injectJavaScript channels.
+ *
+ * Caller substitutes the placeholders with the runtime wallet URL + origin.
+ */
+export function getShellHtml(opts: ShellOptions): string {
+  return SHELL_HTML_TEMPLATE.replace(SHELL_PLACEHOLDER_PATTERN, (placeholder) =>
+    placeholder === 'WALLET_URL_PLACEHOLDER'
+      ? opts.walletUrl
+      : opts.walletOrigin
+  );
+}

package/src/native/provider/shims-html.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+declare module '*.html' {
+  const content: string;
+  export default content;
+}

package/src/native/react/ThruContext.ts ADDED Viewed

@@ -0,0 +1,37 @@
+import { createContext } from 'react';
+import type {
+  NativeSDK,
+  WalletAvailability,
+} from "../NativeSDK";
+import type { WalletAccount } from "../../interfaces";
+import type { ManageAccountsResult } from "../../protocol";
+export const CHECKING_WALLET_AVAILABILITY: WalletAvailability = {
+  status: 'checking',
+  isAuthorized: false,
+  isConnected: false,
+  isUnlocked: false,
+  hasPasskey: false,
+  hasWalletAccount: false,
+  accounts: [],
+  selectedAccount: null,
+  metadata: null,
+  error: null,
+};
+export interface ThruContextValue {
+  /** Initialized NativeSDK instance, or null while still constructing. */
+  wallet: NativeSDK | null;
+  /** Lazily-instantiated Thru chain client (cast at the call site). */
+  thru: unknown;
+  isConnected: boolean;
+  isConnecting: boolean;
+  accounts: WalletAccount[];
+  selectedAccount: WalletAccount | null;
+  walletAvailability: WalletAvailability;
+  error: Error | null;
+  selectAccount: (account: WalletAccount) => Promise<void>;
+  manageAccounts: () => Promise<ManageAccountsResult>;
+}
+export const ThruContext = createContext<ThruContextValue | null>(null);

package/src/native/react/ThruProvider.tsx ADDED Viewed

@@ -0,0 +1,168 @@
+/* React Native mirror of `@thru/wallet/react`'s ThruProvider. Owns the
+   NativeSDK instance, mirrors its events into context state. The
+   bottom sheet is a separate component (<ThruWalletSheet>) the host
+   composes alongside this provider. */
+import { type ReactNode, useCallback, useEffect, useState } from "react";
+import {
+  NativeSDK,
+  type NativeSDKConfig,
+  type WalletAvailability,
+} from "../NativeSDK";
+import type { WalletAccount } from "../../interfaces";
+import { CHECKING_WALLET_AVAILABILITY, ThruContext } from "./ThruContext";
+export interface ThruProviderProps {
+  children: ReactNode;
+  config: NativeSDKConfig;
+}
+export function ThruProvider({ children, config }: ThruProviderProps) {
+  const [sdk, setSdk] = useState<NativeSDK | null>(null);
+  const [thru, setThru] = useState<unknown>(null);
+  const [isConnected, setIsConnected] = useState(false);
+  const [accounts, setAccounts] = useState<WalletAccount[]>([]);
+  const [isConnecting, setIsConnecting] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+  const [selectedAccount, setSelectedAccount] = useState<WalletAccount | null>(
+    null,
+  );
+  const [walletAvailability, setWalletAvailability] =
+    useState<WalletAvailability>(CHECKING_WALLET_AVAILABILITY);
+  useEffect(() => {
+    const sdkInstance = new NativeSDK(config);
+    setSdk(sdkInstance);
+    /* getThru() is lazy in NativeSDK; pull it eagerly so consumers see
+       a stable reference. */
+    setThru(sdkInstance.getThru());
+    const updateAccountsFromSdk = () => setAccounts(sdkInstance.getAccounts());
+    const updateSelectedAccount = (account?: WalletAccount | null) => {
+      if (account) {
+        setSelectedAccount(account);
+        return;
+      }
+      const fallback =
+        sdkInstance.getSelectedAccount() ??
+        sdkInstance.getAccounts()[0] ??
+        null;
+      setSelectedAccount(fallback);
+    };
+    /* Initialization is lazy: NativeSDK.connect() will call initialize
+       on demand. We don't pre-initialize because the bridge needs a
+       WebView ref attached first by ThruWalletSheet. */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const handleConnect = (result: any) => {
+      if (result?.status === "connecting") {
+        setIsConnecting(true);
+        setError(null);
+        return;
+      }
+      setIsConnected(true);
+      updateAccountsFromSdk();
+      setIsConnecting(false);
+      setError(null);
+      setWalletAvailability(sdkInstance.getWalletAvailability());
+      updateSelectedAccount();
+    };
+    const resetData = () => {
+      setIsConnected(false);
+      setAccounts([]);
+      setIsConnecting(false);
+      setSelectedAccount(null);
+    };
+    const handleDisconnect = () => resetData();
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const handleError = (err: any) => {
+      setError(err?.error ?? err ?? new Error("Unknown error"));
+      setIsConnecting(false);
+      setWalletAvailability(sdkInstance.getWalletAvailability());
+    };
+    const handleLock = () => resetData();
+    const handleAccountChanged = (
+      account: WalletAccount | null | undefined,
+    ) => {
+      updateAccountsFromSdk();
+      updateSelectedAccount(account ?? undefined);
+    };
+    const handleAvailabilityChanged = (availability: WalletAvailability) => {
+      setWalletAvailability(availability);
+    };
+    sdkInstance.on("connect", handleConnect);
+    sdkInstance.on("disconnect", handleDisconnect);
+    sdkInstance.on("error", handleError);
+    sdkInstance.on("lock", handleLock);
+    sdkInstance.on("accountChanged", handleAccountChanged);
+    sdkInstance.on("availabilityChanged", handleAvailabilityChanged);
+    void sdkInstance.restoreConnection({ hydrate: false }).catch(handleError);
+    return () => {
+      sdkInstance.off("connect", handleConnect);
+      sdkInstance.off("disconnect", handleDisconnect);
+      sdkInstance.off("error", handleError);
+      sdkInstance.off("lock", handleLock);
+      sdkInstance.off("accountChanged", handleAccountChanged);
+      sdkInstance.off("availabilityChanged", handleAvailabilityChanged);
+      sdkInstance.destroy();
+    };
+    /* Empty deps: SDK is constructed once; config changes after mount
+       are intentionally ignored to mirror @thru/wallet/react semantics. */
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const selectAccount = useCallback(
+    async (account: WalletAccount) => {
+      if (!sdk) throw new Error("NativeSDK not initialized");
+      try {
+        const updated = await sdk.selectAccount(account.address);
+        setSelectedAccount(updated);
+        setAccounts([updated]);
+      } catch (err) {
+        setError(
+          err instanceof Error ? err : new Error("selectAccount failed"),
+        );
+        throw err;
+      }
+    },
+    [sdk],
+  );
+  const manageAccounts = useCallback(async () => {
+    if (!sdk) throw new Error("NativeSDK not initialized");
+    try {
+      const result = await sdk.manageAccounts();
+      setSelectedAccount(result.selectedAccount);
+      setAccounts(result.accounts);
+      return result;
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error("manageAccounts failed"));
+      throw err;
+    }
+  }, [sdk]);
+  return (
+    <ThruContext.Provider
+      value={{
+        thru,
+        wallet: sdk,
+        isConnected,
+        accounts,
+        isConnecting,
+        error,
+        selectedAccount,
+        walletAvailability,
+        selectAccount,
+        manageAccounts,
+      }}
+    >
+      {children}
+    </ThruContext.Provider>
+  );
+}