refactor(ethers): split ethers sub pkg with legacy versions v5 (#862)

* refactor(ethers): split ethers sub pkg with legacy versions v5

* chore(example): update ethers examples

* fix: ci build issue

* fix(test): pkg resolve

* fix(ci): test issue

* chore(ethers): add changeset

* docs(ethereum): split ethersjs doc

* fix(ethers): cr comments

* chore(ethers): reset code case by cr comment

.changeset/five-steaks-invite.md

@@ -0,0 +1,7 @@
+---
+"@ant-design/web3-ethers": patch
+"@ant-design/web3-wagmi": patch
+"@ant-design/web3": patch
+---
+
+chore(ethers): adjusted the compatibility form of the old version of etherjs

.changeset/soft-singers-reflect.md

@@ -0,0 +1,5 @@
+---
+"@ant-design/web3-ethers-v5": major
+---
+
+feat(ethers-v5): split and release

examples/ethers-v5/CHANGELOG.md

@@ -19,7 +19,6 @@
   - @ant-design/web3-common@1.9.0
   - @ant-design/web3-ethers@1.0.1
 
-
 ### Patch Changes
 
 - Updated dependencies [62f1def]

examples/ethers-v5/package.json

@@ -13,7 +13,7 @@
     "@ant-design/web3": "workspace:*",
     "@ant-design/web3-assets": "workspace:*",
     "@ant-design/web3-common": "workspace:*",
-    "@ant-design/web3-ethers": "workspace:*",
+    "@ant-design/web3-ethers-v5": "workspace:*",
     "antd": "^5.16.5",
     "ethers": "^5.7.2",
     "umi": "^4.1.5"
@@ -22,6 +22,5 @@
     "@types/react": "^18.2.78",
     "@types/react-dom": "^18.2.25",
     "typescript": "^5.4.4"
-  },
-  "version": null
+  }
 }

examples/ethers-v5/src/pages/index.tsx

@@ -7,7 +7,7 @@ import {
   TokenPocket,
   useEthersProvider,
   useEthersSigner,
-} from '@ant-design/web3-ethers/legacy-v5';
+} from '@ant-design/web3-ethers-v5';
 import { Button, message } from 'antd';
 
 const App = () => {

examples/ethers/CHANGELOG.md

@@ -19,7 +19,6 @@
   - @ant-design/web3-common@1.9.0
   - @ant-design/web3-ethers@1.0.1
 
-
 ### Patch Changes
 
 - Updated dependencies [62f1def]

examples/ethers/package.json

@@ -22,6 +22,5 @@
     "@types/react": "^18.2.78",
     "@types/react-dom": "^18.2.25",
     "typescript": "^5.4.4"
-  },
-  "version": null
+  }
 }

packages/ethers-v5/.fatherrc.ts

@@ -0,0 +1,5 @@
+import { defineConfig } from 'father';
+
+export default defineConfig({
+  extends: '../../.fatherrc.base.ts',
+});

packages/ethers-v5/README.md

@@ -0,0 +1,3 @@
+# @ant-design/web3-ethers
+
+[https://web3.ant.design](https://web3.ant.design)

packages/ethers-v5/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@ant-design/web3-ethers-v5",
+  "version": "0.1.0",
+  "type": "module",
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
+  "typings": "dist/esm/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/esm/index.js",
+      "require": "./dist/lib/index.js",
+      "types": "./dist/esm/index.d.ts"
+    },
+    "./wagmi": {
+      "import": "./dist/esm/wagmi.js",
+      "require": "./dist/lib/wagmi.js",
+      "types": "./dist/esm/wagmi.d.ts"
+    }
+  },
+  "files": [
+    "dist",
+    "CHANGELOG.md",
+    "README.md"
+  ],
+  "keywords": [
+    "ant",
+    "component",
+    "components",
+    "design",
+    "framework",
+    "frontend",
+    "react",
+    "react-component",
+    "ui",
+    "web3",
+    "ethers-v5",
+    "ethersjs"
+  ],
+  "homepage": "https://we3.ant.design",
+  "bugs": {
+    "url": "https://github.com/ant-design/ant-design-web3/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ant-design/ant-design-web3"
+  },
+  "scripts": {
+    "dev": "father dev",
+    "build": "father build"
+  },
+  "dependencies": {
+    "@ant-design/web3-assets": "workspace:*",
+    "@ant-design/web3-common": "workspace:*",
+    "@ant-design/web3-wagmi": "workspace:*",
+    "@ant-design/web3-ethers": "workspace:*",
+    "@tanstack/react-query": "^5.28.4",
+    "debug": "^4.3.4",
+    "viem": ">=2.9.25",
+    "wagmi": "^2.8.3"
+  },
+  "devDependencies": {
+    "@types/debug": "^4.1.12",
+    "father": "^4.4.0",
+    "typescript": "^5.4.4",
+    "ethers": "^5.7.2"
+  },
+  "peerDependencies": {
+    "ethers": "^5.7.2"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org",
+    "access": "public"
+  },
+  "browserslist": [
+    "last 2 versions",
+    "Firefox ESR",
+    "> 1%",
+    "ie >= 11"
+  ]
+}

packages/ethers-v5/src/global.d.ts

@@ -0,0 +1,5 @@
+import type { EIP1193Provider } from 'viem';
+
+declare interface Window {
+  ethereum?: EIP1193Provider;
+}

packages/ethers-v5/src/hooks/index.ts

@@ -0,0 +1,2 @@
+export * from './use-ethers-provider';
+export * from './use-ethers-signer';

packages/ethers/src/hooks/use-ethers-provider-v5.test.tsx → packages/ethers-v5/src/hooks/use-ethers-provider.test.tsx

@@ -1,9 +1,9 @@
+import { EthersWeb3ConfigProvider } from '@ant-design/web3-ethers';
 import { render } from '@testing-library/react';
-import { providers } from 'ethers-v5';
+import { providers } from 'ethers';
 import { describe, expect, test } from 'vitest';
 
-import { EthersWeb3ConfigProvider } from '../ethers-provider';
-import { useEthersProvider } from './use-ethers-provider-v5';
+import { useEthersProvider } from './use-ethers-provider';
 
 describe('useEthersProvider(v5)', async () => {
   test('basic usage', async () => {

packages/ethers/src/hooks/use-ethers-provider-v5.ts → packages/ethers-v5/src/hooks/use-ethers-provider.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { providers } from 'ethers-v5';
+import { providers } from 'ethers';
 import type { Chain, Client, Transport } from 'viem';
 import { useClient, type Config } from 'wagmi';
 

packages/ethers/src/hooks/use-ethers-signer-v5.test.tsx → packages/ethers-v5/src/hooks/use-ethers-signer.test.tsx

@@ -1,8 +1,8 @@
+import { EthersWeb3ConfigProvider } from '@ant-design/web3-ethers';
 import { render } from '@testing-library/react';
 import { describe, expect, test } from 'vitest';
 
-import { EthersWeb3ConfigProvider } from '../ethers-provider';
-import { useEthersSigner } from './use-ethers-signer-v5';
+import { useEthersSigner } from './use-ethers-signer';
 
 describe('useEthersSigner(v5)', async () => {
   test('basic usage', async () => {

packages/ethers/src/hooks/use-ethers-signer-v5.ts → packages/ethers-v5/src/hooks/use-ethers-signer.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { providers } from 'ethers-v5';
+import { providers } from 'ethers';
 import type { Account, Chain, Client, Transport } from 'viem';
 import { useConnectorClient, type Config } from 'wagmi';
 

packages/ethers-v5/src/index.ts

@@ -0,0 +1,3 @@
+export * from './provider';
+export * from './wallets';
+export * from './hooks';

packages/ethers-v5/src/provider.ts

@@ -0,0 +1 @@
+export * from '@ant-design/web3-ethers/provider';

packages/ethers-v5/src/wagmi.ts

@@ -0,0 +1 @@
+export * from '@ant-design/web3-ethers/wagmi';

packages/ethers-v5/src/wallets.ts

@@ -0,0 +1 @@
+export * from '@ant-design/web3-ethers/wallets';

packages/ethers-v5/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "include": ["src", "global.d.ts"]
+}

packages/ethers/package.json

@@ -11,10 +11,15 @@
       "require": "./dist/lib/index.js",
       "types": "./dist/esm/index.d.ts"
     },
-    "./legacy-v5": {
-      "import": "./dist/esm/index-v5.js",
-      "require": "./dist/lib/index-v5.js",
-      "types": "./dist/esm/index-v5.d.ts"
+    "./provider": {
+      "import": "./dist/esm/ethers-provider/index.js",
+      "require": "./dist/lib/ethers-provider/index.js",
+      "types": "./dist/esm/ethers-provider/index.d.ts"
+    },
+    "./wallets": {
+      "import": "./dist/esm/wallets/index.js",
+      "require": "./dist/lib/wallets/index.js",
+      "types": "./dist/esm/wallets/index.d.ts"
     },
     "./wagmi": {
       "import": "./dist/esm/wagmi.js",
@@ -66,11 +71,10 @@
     "@types/debug": "^4.1.12",
     "father": "^4.4.0",
     "typescript": "^5.4.4",
-    "ethers-v5": "npm:ethers@^5.7.2",
-    "ethers-v6": "npm:ethers@^6.11.1"
+    "ethers": "^6.11.1"
   },
   "peerDependencies": {
-    "ethers": "^5.7.2 || ^6.11.1"
+    "ethers": "^6.11.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",

packages/ethers/src/hooks/use-ethers-provider.test.tsx

@@ -1,5 +1,5 @@
 import { render } from '@testing-library/react';
-import { JsonRpcProvider } from 'ethers-v6';
+import { JsonRpcProvider } from 'ethers';
 import { describe, expect, test } from 'vitest';
 
 import { EthersWeb3ConfigProvider } from '../ethers-provider';

packages/ethers/src/hooks/use-ethers-provider.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { FallbackProvider, JsonRpcProvider } from 'ethers-v6';
+import { FallbackProvider, JsonRpcProvider } from 'ethers';
 import type { Chain, Client, Transport } from 'viem';
 import { useClient, type Config } from 'wagmi';
 

packages/ethers/src/hooks/use-ethers-signer.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { BrowserProvider, JsonRpcSigner } from 'ethers-v6';
+import { BrowserProvider, JsonRpcSigner } from 'ethers';
 import type { Account, Chain, Client, Transport } from 'viem';
 import { useConnectorClient, type Config } from 'wagmi';
 

packages/wagmi/package.json

@@ -47,6 +47,7 @@
   },
   "devDependencies": {
     "@types/debug": "^4.1.12",
+    "@wagmi/core": "^2.9.3",
     "father": "^4.4.0",
     "typescript": "^5.4.4",
     "wagmi": "^2.8.6",

packages/wagmi/src/wagmi-provider/methods/addNameToAccount.ts

@@ -1,5 +1,6 @@
 import type { Account } from '@ant-design/web3-common';
-import { getEnsName, type Config } from '@wagmi/core';
+import { getEnsName } from '@wagmi/core';
+import type { Config } from 'wagmi';
 
 export async function addNameToAccount(
   config: Config,

packages/wagmi/src/wagmi-provider/methods/getNFTMetadata.ts

@@ -1,13 +1,14 @@
 import { fillAddressWith0x, requestWeb3Asset, type NFTMetadata } from '@ant-design/web3-common';
-import { readContract, type Config } from '@wagmi/core';
+import { readContract } from '@wagmi/core';
+import type { Config } from 'wagmi';
 
 export async function getNFTMetadata(
   config: Config,
   address: string,
   tokenId: bigint,
   chainId?: number,
 ): Promise<NFTMetadata> {
-  const tokenURI = await readContract(config, {
+  const tokenURI = await readContract(config as any, {
     address: fillAddressWith0x(address),
     args: [tokenId],
     chainId,

packages/web3/src/bitcoin/index.md

@@ -1,8 +1,9 @@
 ---
 nav: Components
+order: 1
 group:
   title: Connect Blockchains
-  order: 1
+  order: 2
 tag:
   title: New
   color: success

packages/web3/src/bitcoin/index.zh-CN.md

@@ -1,11 +1,12 @@
 ---
 nav: 组件
 subtitle: 比特币
+order: 1
 group:
   title: 连接链
-  order: 1
+  order: 2
 tag:
-  title: 新
+  title: 新增
   color: success
 ---
 

packages/web3/src/ethereum-ethersjs/index.md

@@ -0,0 +1,57 @@
+---
+nav: Components
+order: 3
+group:
+  title: Connect Blockchains
+  order: 2
+---
+
+# Ethereum (ethersjs)
+
+Developers who are familiar with `ethers` can install `@ant-design/web3-ethers` to use with the component library, most of which are consistent with the `wagmi` adapter.
+
+<NormalInstallDependencies packageNames="@ant-design/web3 @ant-design/web3-ethers ethers" save="true"></NormalInstallDependencies>
+
+### Basic usage
+
+This example shows basic usage using the `ethers` adapter. We provide two react hooks to obtain `provider` and `signer`, which you can use in components to perform on-chain operations.
+
+- `useEthersProvider`: Get the `Provider` instance of `ethers`.
+- `useEthersSigner`: Get the `Signer` instance of `ethers`.
+
+<code src="./demos/ethers-basic.tsx"></code>
+
+### Compatible with ethers legacy versions
+
+If you are a user of `ethers@5.x`, you can manually install the v5 version of ethers and modify the adapter introduction method. Versions prior to v5 are no longer supported. It is recommended to use after upgrading to the latest version:
+
+<NormalInstallDependencies packageNames="@ant-design/web3 @ant-design/web3-ethers-v5 ethers@legacy-v5" save="true"></NormalInstallDependencies>
+
+```tsx | pure
+import { EthersWeb3ConfigProvider, useEthersProvider } from '@ant-design/web3-ethers-v5'; // importing the adapter for ethers@5.x
+
+const Component = () => {
+  const provider = useEthersProvider();
+  // do something with provider
+};
+
+const App = () => {
+  return (
+    <EthersWeb3ConfigProvider>
+      <Component />
+    </EthersWeb3ConfigProvider>
+  );
+};
+```
+
+### EthersWeb3ConfigProviderProps
+
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| wallets | Wallets | [WalletFactory](#walletfactory)[] | - | - |
+| chains | Chains | [Chain](./types#chain)[] | - | - |
+| ens | Whether to display ENS | `boolean` | - | - |
+| balance | Whether to display balance | `boolean` | - | - |
+| locale | Multilingual settings | [Locale](https://github.com/ant-design/ant-design-web3/blob/main/packages/common/src/locale/en_US.ts) | - | - |
+| eip6963 | Whether to use EIP6963 protocol wallet and related configurations | `boolean` \| `EIP6963Config` | `false` |  |
+| walletConnect | Whether to use the Wallet Connect protocol | `false` \| [WalletConnectOptions](https://wagmi.sh/core/api/connectors/walletConnect#parameters) | `false` |  |