Merge pull request #283 from node-real/feat/binance-web3-wallet-extension-support

feat(binanceWallet): add Solana and Tron chain support

Author: aiden-cao

.changeset/five-beds-begin.md

@@ -0,0 +1,6 @@
+---
+'@node-real/walletkit': minor
+---
+
+feat(binanceWallet): add Solana and Tron chain support  
+

.claude/settings.local.json

@@ -4,7 +4,18 @@
       "Bash(pnpm install:*)",
       "Bash(export:*)",
       "Bash(source:*)",
-      "Bash(find:*)"
+      "Bash(find:*)",
+      "Bash(grep:*)",
+      "WebFetch(domain:developers.binance.com)",
+      "WebSearch",
+      "WebFetch(domain:binance-wallet.gitbook.io)",
+      "WebFetch(domain:www.npmjs.com)",
+      "WebFetch(domain:registry.npmjs.org)",
+      "Bash(npm view:*)",
+      "WebFetch(domain:raw.githubusercontent.com)",
+      "Bash(git log:*)",
+      "Bash(pnpm build:*)",
+      "Bash(git status:*)"
     ]
   }
 }

packages/walletkit/__dev__/App.tsx

@@ -14,6 +14,7 @@ import {
   walletConnect,
 } from '@/evm/index';
 import {
+  binanceWallet as solanaBinanceWallet,
   trustWallet as solanaTrustWallet,
   phantomWallet as solanaPhantomWallet,
   defaultSolanaConfig,
@@ -22,7 +23,12 @@ import {
 import { bsc, mainnet, dfk } from 'viem/chains';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { useAccount, useDisconnect } from 'wagmi';
-import { defaultTronConfig, tronLink, useTronWallet } from '@/tron/index';
+import {
+  binanceWallet as tronBinanceWallet,
+  defaultTronConfig,
+  tronLink,
+  useTronWallet,
+} from '@/tron/index';
 import { uxuyWallet } from '@/evm/wallets/uxuyWallet';
 import { useEvmSwitchChain } from '@/evm/hooks/useEvmSwitchChain';
 import { codexFieldWallet } from '@/evm/wallets/codexFieldWallet';
@@ -67,12 +73,12 @@ const config: WalletKitConfig = {
   solanaConfig: defaultSolanaConfig({
     autoConnect: true,
     rpcUrl: 'https://solana-rpc.debridge.finance',
-    wallets: [solanaTrustWallet(), solanaPhantomWallet()],
+    wallets: [solanaBinanceWallet(), solanaTrustWallet(), solanaPhantomWallet()],
   }),
   tronConfig: defaultTronConfig({
     autoConnect: true,
     initialChainId: '0xcd8690dc',
-    wallets: [tronLink()],
+    wallets: [tronBinanceWallet(), tronLink()],
   }),
 };
 

packages/walletkit/package.json

@@ -61,6 +61,7 @@
     "@solana/web3.js": "^1",
     "@tronweb3/tronwallet-abstract-adapter": "^1",
     "@tronweb3/tronwallet-adapter-react-hooks": "^1",
+    "@tronweb3/tronwallet-adapter-binance": "^1.0.2",
     "@tronweb3/tronwallet-adapter-tronlink": "^1.1.11",
     "@uxuycom/web3-tg-sdk": "^0.1.5",
     "buffer": "^6.0.3",

packages/walletkit/src/core/utils/binance.ts

@@ -0,0 +1,38 @@
+/**
+ * Detect if running inside the Binance App in-app browser.
+ * The Binance App sets window.isBinance = true.
+ */
+export function isInBinanceApp(): boolean {
+  if (typeof window === 'undefined') return false;
+  return Boolean(window.isBinance);
+}
+
+/**
+ * Detect if the Binance Web3 Wallet browser extension is installed.
+ * The extension injects window.binancew3w.
+ */
+export function isBinanceExtensionInstalled(): boolean {
+  if (typeof window === 'undefined') return false;
+  return Boolean(window.binancew3w);
+}
+
+/**
+ * Returns true if any Binance wallet source is available.
+ */
+export function isBinanceInstalled(): boolean {
+  return isInBinanceApp() || isBinanceExtensionInstalled();
+}
+
+/**
+ * Generate Binance App deep link for the current page.
+ */
+export function getBinanceAppLink(): string {
+  const url = window.location.href;
+  const base = 'bnc://app.binance.com/mp/app';
+  const appId = 'yFK5FCqYprrXDiVFbhyRx7';
+  const startPagePath = window.btoa('/pages/browser/index');
+  const startPageQuery = window.btoa(`url=${url}`);
+  const deeplink = `${base}?appId=${appId}&startPagePath=${startPagePath}&startPageQuery=${startPageQuery}`;
+  const dp = window.btoa(deeplink);
+  return `https://app.binance.com/en/download?_dp=${dp}`;
+}

packages/walletkit/src/evm/wallets/binanceWallet/index.tsx

@@ -1,6 +1,7 @@
 import { BinanceW3WParameters, getWagmiConnectorV2 } from '@binance/w3w-wagmi-connector-v2';
 import { isMobile, isTMA } from '@/core/base/utils/mobile';
 import { binanceWalletConfig } from '@/core/configs/binanceWallet';
+import { isBinanceInstalled, getBinanceAppLink } from '@/core/utils/binance';
 import { EvmWallet } from '../types';
 import { getEvmInjectedProvider } from '../../utils/getEvmInjectedProvider';
 import { sleep } from '@/core/utils/common';
@@ -10,42 +11,22 @@ export interface BinanceWalletOptions extends Partial<EvmWallet> {
   connectorOptions?: BinanceW3WParameters;
 }
 
-/**
- * Detect if running inside the Binance App in-app browser.
- * The Binance App sets window.isBinance = true.
- */
-function isInBinanceApp(): boolean {
-  if (typeof window === 'undefined') return false;
-  return Boolean(window.isBinance);
-}
-
-/**
- * Detect if the Binance Web3 Wallet browser extension is installed.
- * The extension injects window.binancew3w.
- */
-function isBinanceExtensionInstalled(): boolean {
-  if (typeof window === 'undefined') return false;
-  return Boolean(window.binancew3w);
-}
-
 /**
  * Get the Binance EVM provider.
  * Priority: window.ethereum.isBinance > window.binancew3w.ethereum
  */
 function getBinanceProvider(): any {
   if (typeof window === 'undefined') return undefined;
-  // Standard EIP-1193: injected by Binance App or extension via window.ethereum
   const injectedProvider = getEvmInjectedProvider('isBinance');
   if (injectedProvider) return injectedProvider;
-  // Fallback: standalone provider from extension
   return window.binancew3w?.ethereum;
 }
 
 /**
- * Returns true if any Binance wallet source is available.
+ * Returns true if any Binance EVM wallet source is available.
  */
-function isBinanceInstalled(): boolean {
-  return isInBinanceApp() || isBinanceExtensionInstalled() || Boolean(getBinanceProvider());
+function isBinanceEvmInstalled(): boolean {
+  return isBinanceInstalled() || Boolean(getBinanceProvider());
 }
 
 export function binanceWallet(props: BinanceWalletOptions = {}): EvmWallet {
@@ -84,9 +65,9 @@ export function binanceWallet(props: BinanceWalletOptions = {}): EvmWallet {
       {
         platforms: ['browser-pc'],
         connectType: 'default' as const,
-        isInstalled: isBinanceInstalled,
+        isInstalled: isBinanceEvmInstalled,
         getCreateConnectorFn() {
-          if (isBinanceInstalled()) {
+          if (isBinanceEvmInstalled()) {
             return injected({
               shimDisconnect: true,
               target: {
@@ -109,16 +90,9 @@ export function binanceWallet(props: BinanceWalletOptions = {}): EvmWallet {
       {
         platforms: ['browser-android', 'browser-ios'],
         connectType: 'default' as const,
-        isInstalled: isBinanceInstalled,
+        isInstalled: isBinanceEvmInstalled,
         getAppLink() {
-          const url = window.location.href;
-          const base = 'bnc://app.binance.com/mp/app';
-          const appId = 'yFK5FCqYprrXDiVFbhyRx7';
-          const startPagePath = window.btoa('/pages/browser/index');
-          const startPageQuery = window.btoa(`url=${url}`);
-          const deeplink = `${base}?appId=${appId}&startPagePath=${startPagePath}&startPageQuery=${startPageQuery}`;
-          const dp = window.btoa(deeplink);
-          return `https://app.binance.com/en/download?_dp=${dp}`;
+          return getBinanceAppLink();
         },
         getCreateConnectorFn() {
           let isReady = false;

packages/walletkit/src/solana/wallets/binanceWallet/index.tsx

@@ -0,0 +1,29 @@
+import { SolanaWallet } from '../types';
+import { binanceWalletConfig } from '@/core/configs/binanceWallet';
+import { isBinanceInstalled, getBinanceAppLink } from '@/core/utils/binance';
+
+type BinanceWalletOptions = Partial<SolanaWallet>
+
+export function binanceWallet(props: BinanceWalletOptions = {}): SolanaWallet {
+  const { ...restProps } = props;
+
+  return {
+    ...binanceWalletConfig,
+    id: 'solana:binanceWallet',
+    walletType: 'solana',
+    adapterName: 'Binance Wallet',
+    behaviors: [
+      {
+        platforms: ['browser-android', 'browser-ios', 'browser-pc'],
+        connectType: 'default',
+        isInstalled() {
+          return isBinanceInstalled();
+        },
+        getAppLink() {
+          return getBinanceAppLink();
+        },
+      },
+    ],
+    ...restProps,
+  };
+}

packages/walletkit/src/solana/wallets/index.ts

@@ -4,3 +4,4 @@ export * from './types';
 // wallets
 export * from './trustWallet';
 export * from './phantomWallet';
+export * from './binanceWallet';

packages/walletkit/src/tron/wallets/binanceWallet/index.ts

@@ -0,0 +1,35 @@
+import { BinanceWalletAdapter } from '@tronweb3/tronwallet-adapter-binance';
+import { TronWallet } from '../types';
+import { binanceWalletConfig } from '@/core/configs/binanceWallet';
+import { isBinanceInstalled, getBinanceAppLink } from '@/core/utils/binance';
+
+interface BinanceWalletOptions extends Partial<TronWallet> {
+  adapterOptions?: ConstructorParameters<typeof BinanceWalletAdapter>[0];
+}
+
+export function binanceWallet(props: BinanceWalletOptions = {}): TronWallet {
+  const { adapterOptions, ...restProps } = props;
+
+  return {
+    ...binanceWalletConfig,
+    id: 'tron:binanceWallet',
+    walletType: 'tron',
+    adapterName: 'Binance Wallet',
+    behaviors: [
+      {
+        platforms: ['browser-android', 'browser-ios', 'browser-pc'],
+        connectType: 'default',
+        isInstalled() {
+          return isBinanceInstalled();
+        },
+        getAppLink() {
+          return getBinanceAppLink();
+        },
+        getAdapter() {
+          return new BinanceWalletAdapter(adapterOptions);
+        },
+      },
+    ],
+    ...restProps,
+  };
+}

packages/walletkit/src/tron/wallets/index.ts

@@ -3,3 +3,4 @@ export * from './types';
 
 // wallets
 export * from './tronLink';
+export * from './binanceWallet';