@ant-design/web3-wagmi 1.1.2 → 2.0.1

package/dist/lib/wagmi-provider/config-provider.js

@@ -13,7 +13,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const AntDesignWeb3ConfigProvider = props => {
   const {
     children,
-    assets,
+    chainAssets,
+    walletFactorys,
     availableChains,
     availableConnectors,
     ens,
@@ -22,18 +23,17 @@ const AntDesignWeb3ConfigProvider = props => {
   } = props;
   const {
     address,
-    isDisconnected
+    isDisconnected,
+    chain
   } = (0, _wagmi.useAccount)();
+  const config = (0, _wagmi.useConfig)();
   const [account, setAccount] = _react.default.useState();
   const {
     connectAsync
   } = (0, _wagmi.useConnect)();
   const {
-    switchNetwork
-  } = (0, _wagmi.useSwitchNetwork)();
-  const {
-    chain
-  } = (0, _wagmi.useNetwork)();
+    switchChain
+  } = (0, _wagmi.useSwitchChain)();
   const {
     disconnectAsync
   } = (0, _wagmi.useDisconnect)();
@@ -52,23 +52,33 @@ const AntDesignWeb3ConfigProvider = props => {
       const a = {
         address
       };
-      setAccount(ens ? await (0, _methods.addNameToAccount)(a) : a);
+      setAccount(ens ? await (0, _methods.addNameToAccount)(config, a) : a);
     };
     updateAccounts();
   }, [address, isDisconnected, chain, ens]);
   const wallets = _react.default.useMemo(() => {
-    return availableConnectors.map(connector => {
-      const walletFactory = assets?.find(item => item.name === connector.name);
+    availableConnectors.forEach(connector => {
+      // check use assets config and console.error for alert
+      const walletFactory = walletFactorys?.find(item => item.connectors?.includes(connector.name));
       if (!walletFactory?.create) {
-        console.error(`Can not find wallet factory for ${connector.name}, you should config it in WagmiWeb3ConfigProvider 'assets'.`);
+        console.error(`Can not find wallet factory for ${connector.name}, you should config it in WagmiWeb3ConfigProvider 'wallets'.`);
+      }
+    });
+
+    // Generate Wallet for @ant-design/web3
+    const allWallet = walletFactorys?.map(factory => {
+      const connectors = factory.connectors.map(name => availableConnectors.find(item => item.name === name)).filter(item => !!item);
+      if (connectors.length === 0) {
+        // Not config connector for this wallet factory, ignore it.
         return null;
       }
-      return walletFactory.create(connector);
+      return factory.create(connectors);
     }).filter(item => item !== null);
-  }, [availableConnectors, assets]);
+    return allWallet;
+  }, [availableConnectors, walletFactorys]);
   const chainList = _react.default.useMemo(() => {
     return availableChains.map(item => {
-      const c = assets?.find(asset => {
+      const c = chainAssets?.find(asset => {
         return asset.id === item.id;
       });
       if (c?.id) {
@@ -82,7 +92,7 @@ const AntDesignWeb3ConfigProvider = props => {
         return null;
       }
     }).filter(item => item !== null);
-  }, [availableChains, assets]);
+  }, [availableChains, chainAssets]);
   _react.default.useEffect(() => {
     if (!chain && currentChain) {
       // not connected any chain, keep current chain
@@ -92,7 +102,7 @@ const AntDesignWeb3ConfigProvider = props => {
     if (!currentWagmiChain) {
       return;
     }
-    let c = assets?.find(item => item.id === currentWagmiChain?.id);
+    let c = chainAssets?.find(item => item.id === currentWagmiChain?.id);
     if (!c?.id) {
       c = {
         id: currentWagmiChain.id,
@@ -101,7 +111,7 @@ const AntDesignWeb3ConfigProvider = props => {
     }
     setCurrentChain(c);
     return;
-  }, [chain, assets, availableChains, currentChain]);
+  }, [chain, chainAssets, availableChains, currentChain]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_web3Common.Web3ConfigProvider, {
     locale: locale,
     availableChains: chainList,
@@ -115,7 +125,13 @@ const AntDesignWeb3ConfigProvider = props => {
     } : undefined,
     availableWallets: wallets,
     connect: async wallet => {
-      const connector = availableConnectors.find(item => item.name === wallet?.name);
+      let connector = await wallet?.getWagmiConnector?.();
+      if (!connector) {
+        connector = availableConnectors.find(item => item.name === wallet?.name);
+      }
+      if (!connector) {
+        throw new Error(`Can not find connector for ${wallet?.name}`);
+      }
       await connectAsync({
         connector,
         chainId: currentChain?.id
@@ -129,13 +145,15 @@ const AntDesignWeb3ConfigProvider = props => {
         // hava not connected any chain
         setCurrentChain(c);
       } else {
-        switchNetwork?.(c.id);
+        switchChain?.({
+          chainId: c.id
+        });
       }
     },
     getNFTMetadata: async ({
       address: contractAddress,
       tokenId
-    }) => (0, _methods.getNFTMetadata)(contractAddress, tokenId, chain?.id),
+    }) => (0, _methods.getNFTMetadata)(config, contractAddress, tokenId, chain?.id),
     children: children
   });
 };

package/dist/lib/wagmi-provider/index.d.ts

@@ -1,12 +1,15 @@
 import React from 'react';
-import type { PublicClient, WebSocketPublicClient, Config } from 'wagmi';
 import type { Chain, Locale } from '@ant-design/web3-common';
+import { QueryClient } from '@tanstack/react-query';
+import type { Config } from 'wagmi';
 import type { WalletFactory } from '../interface';
-export type WagmiWeb3ConfigProviderProps<TPublicClient extends PublicClient = PublicClient, TWebSocketPublicClient extends WebSocketPublicClient = WebSocketPublicClient> = {
-    config: Config<TPublicClient, TWebSocketPublicClient>;
+export type WagmiWeb3ConfigProviderProps = {
+    config: Config;
     locale?: Locale;
-    assets?: (Chain | WalletFactory)[];
+    wallets?: WalletFactory[];
+    chains?: Chain[];
     ens?: boolean;
+    queryClient?: QueryClient;
     balance?: boolean;
 };
-export declare function WagmiWeb3ConfigProvider<TPublicClient extends PublicClient, TWebSocketPublicClient extends WebSocketPublicClient>({ children, assets, ens, locale, balance, config, ...restProps }: React.PropsWithChildren<WagmiWeb3ConfigProviderProps<TPublicClient, TWebSocketPublicClient>>): React.ReactElement;
+export declare function WagmiWeb3ConfigProvider({ children, wallets, chains, ens, locale, balance, config, queryClient, ...restProps }: React.PropsWithChildren<WagmiWeb3ConfigProviderProps>): React.ReactElement;

package/dist/lib/wagmi-provider/index.js

@@ -5,51 +5,44 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WagmiWeb3ConfigProvider = WagmiWeb3ConfigProvider;
 var _react = _interopRequireDefault(require("react"));
+var _web3Assets = require("@ant-design/web3-assets");
+var _reactQuery = require("@tanstack/react-query");
 var _wagmi = require("wagmi");
 var _configProvider = require("./config-provider");
-var _web3Assets = require("@ant-design/web3-assets");
-var _wallets = require("../wallets");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // Built in popular chains
 
-// MetaMask built-in
-
 function WagmiWeb3ConfigProvider({
   children,
-  assets = [],
+  wallets = [],
+  chains = [],
   ens,
   locale,
   balance,
   config,
+  queryClient,
   ...restProps
 }) {
-  const availableChains = _react.default.useMemo(() => {
-    // merge all available chains fro user select
-    const chains = [];
-    for (const connector of config.connectors) {
-      connector.chains.forEach(chain => {
-        if (chains.find(c => c.id === chain.id)) return;
-        chains.push(chain);
-      });
-    }
-    config.publicClient.chains?.forEach(chain => {
-      if (chains.find(c => c.id === chain.id)) return;
-      chains.push(chain);
-    });
-    return chains;
-  }, [config]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_wagmi.WagmiConfig, {
+  const chainAssets = [...chains, _web3Assets.Mainnet];
+  const mergedQueryClient = _react.default.useMemo(() => {
+    return queryClient ?? new _reactQuery.QueryClient();
+  }, [queryClient]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_wagmi.WagmiProvider, {
     config: config,
     ...restProps,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_configProvider.AntDesignWeb3ConfigProvider, {
-      locale: locale,
-      assets: [...assets, _wallets.MetaMask, _web3Assets.Mainnet, _web3Assets.Goerli],
-      availableChains: availableChains,
-      availableConnectors: config.connectors || [],
-      ens: ens,
-      balance: balance,
-      children: children
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactQuery.QueryClientProvider, {
+      client: mergedQueryClient,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_configProvider.AntDesignWeb3ConfigProvider, {
+        locale: locale,
+        chainAssets: chainAssets,
+        walletFactorys: wallets,
+        availableChains: config.chains,
+        availableConnectors: config.connectors,
+        ens: ens,
+        balance: balance,
+        children: children
+      })
     })
   });
 }

package/dist/lib/wagmi-provider/methods/addNameToAccount.d.ts

@@ -1,2 +1,3 @@
 import type { Account } from '@ant-design/web3-common';
-export declare function addNameToAccount(account: Account, chainId?: number): Promise<Account>;
+import { type Config } from '@wagmi/core';
+export declare function addNameToAccount(config: Config, account: Account, chainId?: number): Promise<Account>;

package/dist/lib/wagmi-provider/methods/addNameToAccount.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.addNameToAccount = addNameToAccount;
 var _core = require("@wagmi/core");
-async function addNameToAccount(account, chainId) {
-  const name = await (0, _core.fetchEnsName)({
+async function addNameToAccount(config, account, chainId) {
+  const name = await (0, _core.getEnsName)(config, {
     address: account.address,
     chainId
   });

package/dist/lib/wagmi-provider/methods/getNFTMetadata.d.ts

@@ -1,2 +1,3 @@
 import { type NFTMetadata } from '@ant-design/web3-common';
-export declare function getNFTMetadata(address: string, tokenId: bigint, chainId?: number): Promise<NFTMetadata>;
+import { type Config } from '@wagmi/core';
+export declare function getNFTMetadata(config: Config, address: string, tokenId: bigint, chainId?: number): Promise<NFTMetadata>;

package/dist/lib/wagmi-provider/methods/getNFTMetadata.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.getNFTMetadata = getNFTMetadata;
 var _web3Common = require("@ant-design/web3-common");
 var _core = require("@wagmi/core");
-async function getNFTMetadata(address, tokenId, chainId) {
-  const tokenURI = await (0, _core.readContract)({
+async function getNFTMetadata(config, address, tokenId, chainId) {
+  const tokenURI = await (0, _core.readContract)(config, {
     address: (0, _web3Common.fillAddressWith0x)(address),
     args: [tokenId],
     chainId,

package/dist/lib/wallets/coinbase-wallet.d.ts

@@ -1,2 +1,2 @@
-import type { WalletFactory } from '../interface';
-export declare const CoinbaseWallet: WalletFactory;
+import type { EthereumWallet } from '../interface';
+export declare const CoinbaseWallet: EthereumWallet;

package/dist/lib/wallets/coinbase-wallet.js

@@ -5,14 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CoinbaseWallet = void 0;
 var _web3Assets = require("@ant-design/web3-assets");
-const CoinbaseWallet = exports.CoinbaseWallet = {
-  name: 'Coinbase Wallet',
-  create: () => {
-    return {
-      ..._web3Assets.metadata_CoinbaseWallet,
-      hasWalletReady: async () => {
-        return true;
-      }
-    };
-  }
-};
+const CoinbaseWallet = metadata => {
+  return {
+    connectors: ['Coinbase Wallet'],
+    create: () => {
+      return {
+        ..._web3Assets.metadata_CoinbaseWallet,
+        hasWalletReady: async () => {
+          return true;
+        },
+        ...metadata
+      };
+    }
+  };
+};
+exports.CoinbaseWallet = CoinbaseWallet;

package/dist/lib/wallets/index.d.ts

@@ -3,3 +3,4 @@ export * from './wallet-connect';
 export * from './coinbase-wallet';
 export * from './token-pocket';
 export * from './safeheron';
+export * from './universal-wallet';

package/dist/lib/wallets/index.js

@@ -57,4 +57,15 @@ Object.keys(_safeheron).forEach(function (key) {
       return _safeheron[key];
     }
   });
+});
+var _universalWallet = require("./universal-wallet");
+Object.keys(_universalWallet).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _universalWallet[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _universalWallet[key];
+    }
+  });
 });

package/dist/lib/wallets/meta-mask.d.ts

@@ -1,2 +1,2 @@
-import type { WalletFactory } from '../interface';
-export declare const MetaMask: WalletFactory;
+import type { EthereumWallet } from '../interface';
+export declare const MetaMask: EthereumWallet;

package/dist/lib/wallets/meta-mask.js

@@ -5,14 +5,21 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.MetaMask = void 0;
 var _web3Assets = require("@ant-design/web3-assets");
-const MetaMask = exports.MetaMask = {
-  name: 'MetaMask',
-  create: () => {
-    return {
-      ..._web3Assets.metadata_MetaMask,
-      hasWalletReady: async () => {
-        return !!window.ethereum?.isMetaMask;
-      }
-    };
-  }
-};
+const MetaMask = metadata => {
+  return {
+    connectors: ['MetaMask'],
+    create: () => {
+      return {
+        ..._web3Assets.metadata_MetaMask,
+        hasWalletReady: async () => {
+          return !!window.ethereum?.isMetaMask;
+        },
+        hasExtensionInstalled: async () => {
+          return !!window.ethereum?.isMetaMask;
+        },
+        ...metadata
+      };
+    }
+  };
+};
+exports.MetaMask = MetaMask;

package/dist/lib/wallets/safeheron.d.ts

@@ -1,2 +1,2 @@
-import type { WalletFactory } from '../interface';
-export declare const SafeheronWallet: WalletFactory;
+import type { EthereumWallet } from '../interface';
+export declare const SafeheronWallet: EthereumWallet;

package/dist/lib/wallets/safeheron.js

@@ -5,14 +5,21 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SafeheronWallet = void 0;
 var _web3Assets = require("@ant-design/web3-assets");
-const SafeheronWallet = exports.SafeheronWallet = {
-  name: 'Safeheron',
-  create: connector => {
-    return {
-      ..._web3Assets.metadata_Safeheron,
-      hasWalletReady: async () => {
-        return !!connector?.ready;
-      }
-    };
-  }
-};
+const SafeheronWallet = metadata => {
+  return {
+    connectors: ['Safeheron'],
+    create: connectors => {
+      return {
+        ..._web3Assets.metadata_Safeheron,
+        hasWalletReady: async () => {
+          return !!(await connectors?.[0]?.getProvider());
+        },
+        hasExtensionInstalled: async () => {
+          return !!(await connectors?.[0]?.getProvider());
+        },
+        ...metadata
+      };
+    }
+  };
+};
+exports.SafeheronWallet = SafeheronWallet;

package/dist/lib/wallets/token-pocket.d.ts

@@ -1,2 +1,2 @@
-import type { WalletFactory } from '../interface';
-export declare const TokenPocket: WalletFactory;
+import { EthereumWallet } from '../interface';
+export declare const TokenPocket: EthereumWallet;

package/dist/lib/wallets/token-pocket.js

@@ -5,14 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TokenPocket = void 0;
 var _web3Assets = require("@ant-design/web3-assets");
-const TokenPocket = exports.TokenPocket = {
-  name: 'TokenPocket',
-  create: () => {
-    return {
-      ..._web3Assets.metadata_TokenPocket,
-      hasWalletReady: async () => {
-        return true;
-      }
-    };
-  }
-};
+var _universalWallet = require("./universal-wallet");
+const TokenPocket = metadata => {
+  return new _universalWallet.UniversalWallet({
+    ..._web3Assets.metadata_TokenPocket,
+    ...metadata
+  });
+};
+exports.TokenPocket = TokenPocket;

package/dist/lib/wallets/universal-wallet.d.ts

@@ -0,0 +1,9 @@
+import type { WalletMetadata } from '@ant-design/web3-common';
+import type { Connector } from 'wagmi';
+import type { WalletFactory, WalletUseInWagmiAdapter } from '../interface';
+export declare class UniversalWallet implements WalletFactory {
+    private wallet;
+    connectors: string[];
+    constructor(wallet: WalletMetadata);
+    create: (connectors?: readonly Connector[]) => WalletUseInWagmiAdapter;
+}

package/dist/lib/wallets/universal-wallet.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UniversalWallet = void 0;
+class UniversalWallet {
+  connectors = [];
+  constructor(wallet) {
+    this.wallet = wallet;
+    if (wallet.extensions) {
+      // support injected connector
+      // https://wagmi.sh/react/connectors/injected
+      this.connectors.push(wallet.name);
+    }
+    if (wallet.app) {
+      // support WalletConnect https://wagmi.sh/react/connectors/walletConnect
+      this.connectors.push('WalletConnect');
+    }
+  }
+  create = connectors => {
+    const walletConnector = connectors?.find(item => item.name === 'WalletConnect');
+    const injectedConnector = connectors?.find(item => item.name === this.wallet.name);
+    const getQrCode = async () => {
+      const provider = await walletConnector?.getProvider();
+      return new Promise(resolve => {
+        provider?.on('display_uri', uri => {
+          resolve({
+            uri
+          });
+        });
+      });
+    };
+    const hasExtensionInstalled = async () => {
+      const provider = await injectedConnector?.getProvider();
+      return !!provider;
+    };
+    return {
+      ...this.wallet,
+      getWagmiConnector: async () => {
+        if (await hasExtensionInstalled()) {
+          return injectedConnector;
+        }
+        return walletConnector;
+      },
+      hasExtensionInstalled: async () => {
+        return hasExtensionInstalled();
+      },
+      hasWalletReady: async () => {
+        const installed = await hasExtensionInstalled();
+        return !!(installed || walletConnector);
+      },
+      getQrCode: walletConnector ? getQrCode : undefined
+    };
+  };
+}
+exports.UniversalWallet = UniversalWallet;

package/dist/lib/wallets/wallet-connect.d.ts

@@ -1,2 +1,7 @@
+import { WalletMetadata } from '@ant-design/web3-common';
 import type { WalletFactory } from '../interface';
-export declare const WalletConnect: WalletFactory;
+type EthereumWalletConnect = (metadata?: Partial<WalletMetadata> & {
+    useWalletConnectOfficialModal?: boolean;
+}) => WalletFactory;
+export declare const WalletConnect: EthereumWalletConnect;
+export {};

package/dist/lib/wallets/wallet-connect.js

@@ -5,25 +5,33 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WalletConnect = void 0;
 var _web3Assets = require("@ant-design/web3-assets");
-const WalletConnect = exports.WalletConnect = {
-  name: 'WalletConnect',
-  create: connector => {
-    const getQrCode = async () => {
-      const provider = await connector?.getProvider();
-      return new Promise(resolve => {
-        provider.on('display_uri', uri => {
-          resolve({
-            uri
+const WalletConnect = metadata => {
+  const {
+    useWalletConnectOfficialModal = false,
+    ...rest
+  } = metadata || {};
+  return {
+    connectors: ['WalletConnect'],
+    create: connectors => {
+      const getQrCode = async () => {
+        const provider = await connectors?.[0]?.getProvider();
+        return new Promise(resolve => {
+          provider?.on('display_uri', uri => {
+            resolve({
+              uri
+            });
           });
         });
-      });
-    };
-    return {
-      ..._web3Assets.metadata_WalletConnect,
-      hasWalletReady: async () => {
-        return true;
-      },
-      getQrCode: connector?.options.showQrModal === false ? getQrCode : undefined
-    };
-  }
-};
+      };
+      return {
+        ..._web3Assets.metadata_WalletConnect,
+        hasWalletReady: async () => {
+          return true;
+        },
+        getQrCode: useWalletConnectOfficialModal ? undefined : getQrCode,
+        ...rest
+      };
+    }
+  };
+};
+exports.WalletConnect = WalletConnect;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ant-design/web3-wagmi",
-  "version": "1.1.2",
+  "version": "2.0.1",
   "main": "dist/lib/index.js",
   "module": "dist/esm/index.js",
   "typings": "dist/esm/index.d.ts",
@@ -31,17 +31,19 @@
   },
   "dependencies": {
     "debug": "^4.3.4",
-    "@ant-design/web3-assets": "1.1.2",
-    "@ant-design/web3-common": "1.1.2"
+    "@wagmi/core": "^2.0.0",
+    "viem": "2.0.0",
+    "@tanstack/react-query": "^5.17.0",
+    "@ant-design/web3-assets": "1.1.4",
+    "@ant-design/web3-common": "1.3.0"
   },
   "devDependencies": {
     "@types/debug": "^4.1.12",
-    "@wagmi/core": "^1.4.12",
     "father": "^4.3.8",
     "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "wagmi": "^1.4.12"
+    "wagmi": "^2.0.0"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",