Merge pull request #288 from node-real/feat/1x-binance-web3-wallet-extension

feat: Binance Web3 Wallet desktop extension support

Author: aiden-cao

.changeset/lemon-bugs-try.md

@@ -0,0 +1,6 @@
+---
+'@node-real/walletkit': minor
+---
+
+fix: restore BinanceWeb3WalletConnector for mobile in-app browser compatibility  
+

.changeset/moody-shrimps-melt.md

@@ -0,0 +1,5 @@
+---
+'@node-real/walletkit': minor
+---
+
+feat: add desktop extension support for Binance Web3 Wallet

.claude/settings.local.json

@@ -0,0 +1,13 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(/tmp/comparison.txt:*)",
+      "Read(//tmp/**)",
+      "WebFetch(domain:developers.binance.com)",
+      "Bash(npm run:*)",
+      "Bash(git stash:*)",
+      "Bash(grep \"\"version\"\":*)",
+      "Bash(npx tsc:*)"
+    ]
+  }
+}

examples/nextjs/pages/_app.tsx

@@ -10,7 +10,12 @@ import {
   WalletKitProvider,
   getDefaultConfig,
 } from '@node-real/walletkit';
-import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
+import {
+  binanceWeb3Wallet,
+  trustWallet,
+  metaMask,
+  walletConnect,
+} from '@node-real/walletkit/wallets';
 
 const config = createConfig(
   getDefaultConfig({
@@ -22,7 +27,7 @@ const config = createConfig(
     walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
 
     chains,
-    connectors: [trustWallet(), metaMask(), walletConnect()],
+    connectors: [binanceWeb3Wallet(), trustWallet(), metaMask(), walletConnect()],
   }),
 );
 

examples/vite/src/App.tsx

@@ -8,7 +8,12 @@ import {
   WalletKitOptions,
   SwitchNetworkModal,
 } from '@node-real/walletkit';
-import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets';
+import {
+  binanceWeb3Wallet,
+  trustWallet,
+  metaMask,
+  walletConnect,
+} from '@node-real/walletkit/wallets';
 
 const config = createConfig(
   getDefaultConfig({
@@ -20,7 +25,7 @@ const config = createConfig(
     walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767',
 
     chains,
-    connectors: [trustWallet(), metaMask(), walletConnect()],
+    connectors: [binanceWeb3Wallet(), trustWallet(), metaMask(), walletConnect()],
   }),
 );
 

packages/walletkit/src/typings.d.ts

@@ -12,6 +12,7 @@ declare global {
     tokenpocket: any;
     okexchain: any;
     bitkeep: any;
+    binancew3w: any;
   }
 }
 

packages/walletkit/src/wallets/binanceWeb3Wallet/connector.ts

@@ -49,4 +49,7 @@ function getProvider() {
   if (isMobile()) {
     return window.ethereum;
   }
+
+  // Desktop: use Binance Web3 Wallet browser extension
+  return window.binancew3w?.ethereum;
 }

packages/walletkit/src/wallets/binanceWeb3Wallet/index.tsx

@@ -21,13 +21,12 @@ export function binanceWeb3Wallet(props: PartialCustomProps = {}): WalletProps {
       default: 'https://www.binance.com/en/web3wallet',
     },
     spinnerColor: undefined,
-    showQRCode: true,
+    showQRCode: false,
     isInstalled: isBinanceWeb3Wallet,
     createConnector: (chains: Chain[]) => {
       return new BinanceWeb3WalletConnector({
         chains,
         options: {
-          shimDisconnect: true,
           ...connectorOptions,
         },
       });
@@ -44,7 +43,8 @@ export function binanceWeb3Wallet(props: PartialCustomProps = {}): WalletProps {
 }
 
 export function isBinanceWeb3Wallet() {
-  return hasInjectedProvider('isBinance' as any);
+  if (typeof window === 'undefined') return false;
+  return !!window.binancew3w?.ethereum || hasInjectedProvider('isBinance' as any);
 }
 
 const getDeepLink = (url: string) => {

website/src/pages/index.mdx

@@ -18,7 +18,7 @@ npm i @node-real/walletkit@^1 wagmi@^1 viem@^1
 
 | wallet              | mainnet | testnet |
 | ------------------- | ------- | ------- |
-| binanceWeb3Wallet() | ✅      | ❌      |
+| binanceWeb3Wallet() | ✅      | ✅      |
 | bitgetWallet()      | ✅      | ❌      |
 | coinbaseWallet()    | ✅      | ✅      |
 | metaMask()          | ✅      | ✅      |
@@ -96,7 +96,12 @@ import {
   WalletKitOptions,
   SwitchNetworkModal,
 } from '@node-real/walletkit';
-import { metaMask, trustWallet, walletConnect } from '@node-real/walletkit/wallets';
+import {
+  binanceWeb3Wallet,
+  metaMask,
+  trustWallet,
+  walletConnect,
+} from '@node-real/walletkit/wallets';
 
 const config = createConfig(
   getDefaultConfig({
@@ -108,7 +113,7 @@ const config = createConfig(
     walletConnectProjectId: 'xxx',
 
     chains,
-    connectors: [trustWallet(), metaMask(), walletConnect()],
+    connectors: [binanceWeb3Wallet(), trustWallet(), metaMask(), walletConnect()],
   }),
 );