diff --git a/.changeset/moody-planes-hammer.md b/.changeset/moody-planes-hammer.md
new file mode 100644
index 000000000..7a5876db3
--- /dev/null
+++ b/.changeset/moody-planes-hammer.md
@@ -0,0 +1,7 @@
+---
+'@ant-design/web3-assets': minor
+'@ant-design/web3-icons': minor
+'@ant-design/web3-wagmi': minor
+---
+
+feat: Add OKX wallet info
diff --git a/.dumi/theme/builtins/IconSearch/fields.ts b/.dumi/theme/builtins/IconSearch/fields.ts
index c63f866dc..c96773c76 100644
--- a/.dumi/theme/builtins/IconSearch/fields.ts
+++ b/.dumi/theme/builtins/IconSearch/fields.ts
@@ -35,6 +35,7 @@ const tool = [
'PancakeSwap',
'SushiSwap',
'Phantom',
+ 'OkxWallet',
];
const datum = [...chain, ...token, ...tool];
diff --git a/packages/assets/src/wallets/index.ts b/packages/assets/src/wallets/index.ts
index 9293c9b33..212f8aa74 100644
--- a/packages/assets/src/wallets/index.ts
+++ b/packages/assets/src/wallets/index.ts
@@ -3,3 +3,4 @@ export * from './wallet-connect';
export * from './coinbase-wallet';
export * from './token-pocket';
export * from './safeheron';
+export * from './okx-wallet';
diff --git a/packages/assets/src/wallets/okx-wallet.tsx b/packages/assets/src/wallets/okx-wallet.tsx
new file mode 100644
index 000000000..9cd6a5014
--- /dev/null
+++ b/packages/assets/src/wallets/okx-wallet.tsx
@@ -0,0 +1,20 @@
+import type { WalletMetadata } from '@ant-design/web3-common';
+import { ChromeCircleColorful, OkxWalletColorful } from '@ant-design/web3-icons';
+
+export const metadata_OkxWallet: WalletMetadata = {
+ icon: ,
+ name: 'OkxWallet',
+ remark: 'Okx Wallet',
+ app: {
+ link: 'https://www.okx.com/download',
+ },
+ extensions: [
+ {
+ key: 'Chrome',
+ browserIcon: ,
+ browserName: 'Chrome',
+ link: 'https://chromewebstore.google.com/detail/mcohilncbfahbmgdjkbpemcciiolgcge',
+ description: 'Access your wallet right from your favorite web browser.',
+ },
+ ],
+};
diff --git a/packages/icons/src/__tests__/__snapshots__/index.test.tsx.snap b/packages/icons/src/__tests__/__snapshots__/index.test.tsx.snap
index 516089182..cbf46bc3b 100644
--- a/packages/icons/src/__tests__/__snapshots__/index.test.tsx.snap
+++ b/packages/icons/src/__tests__/__snapshots__/index.test.tsx.snap
@@ -1345,6 +1345,65 @@ exports[`Test Icons > should render all icons 30`] = `
`;
exports[`Test Icons > should render all icons 31`] = `
+
+
+
+`;
+
+exports[`Test Icons > should render all icons 32`] = `
should render all icons 31`] = `
`;
-exports[`Test Icons > should render all icons 32`] = `
+exports[`Test Icons > should render all icons 33`] = `
should render all icons 32`] = `
`;
-exports[`Test Icons > should render all icons 33`] = `
+exports[`Test Icons > should render all icons 34`] = `
should render all icons 33`] = `
`;
-exports[`Test Icons > should render all icons 34`] = `
+exports[`Test Icons > should render all icons 35`] = `
should render all icons 34`] = `
`;
-exports[`Test Icons > should render all icons 35`] = `
+exports[`Test Icons > should render all icons 36`] = `
should render all icons 35`] = `
`;
-exports[`Test Icons > should render all icons 36`] = `
+exports[`Test Icons > should render all icons 37`] = `
should render all icons 36`] = `
`;
-exports[`Test Icons > should render all icons 37`] = `
+exports[`Test Icons > should render all icons 38`] = `
should render all icons 37`] = `
`;
-exports[`Test Icons > should render all icons 38`] = `
+exports[`Test Icons > should render all icons 39`] = `
should render all icons 38`] = `
`;
-exports[`Test Icons > should render all icons 39`] = `
+exports[`Test Icons > should render all icons 40`] = `
should render all icons 39`] = `
`;
-exports[`Test Icons > should render all icons 40`] = `
+exports[`Test Icons > should render all icons 41`] = `
should render all icons 40`] = `
`;
-exports[`Test Icons > should render all icons 41`] = `
+exports[`Test Icons > should render all icons 42`] = `
should render all icons 41`] = `
`;
-exports[`Test Icons > should render all icons 42`] = `
+exports[`Test Icons > should render all icons 43`] = `
should render all icons 42`] = `
`;
-exports[`Test Icons > should render all icons 43`] = `
+exports[`Test Icons > should render all icons 44`] = `
should render all icons 43`] = `
`;
-exports[`Test Icons > should render all icons 44`] = `
+exports[`Test Icons > should render all icons 45`] = `
should render all icons 44`] = `
`;
-exports[`Test Icons > should render all icons 45`] = `
+exports[`Test Icons > should render all icons 46`] = `
should render all icons 45`] = `
`;
-exports[`Test Icons > should render all icons 46`] = `
+exports[`Test Icons > should render all icons 47`] = `
should render all icons 46`] = `
`;
-exports[`Test Icons > should render all icons 47`] = `
+exports[`Test Icons > should render all icons 48`] = `
should render all icons 47`] = `
`;
-exports[`Test Icons > should render all icons 48`] = `
+exports[`Test Icons > should render all icons 49`] = `
should render all icons 48`] = `
`;
-exports[`Test Icons > should render all icons 49`] = `
+exports[`Test Icons > should render all icons 50`] = `
should render all icons 49`] = `
`;
-exports[`Test Icons > should render all icons 50`] = `
+exports[`Test Icons > should render all icons 51`] = `
should render all icons 50`] = `
`;
-exports[`Test Icons > should render all icons 51`] = `
+exports[`Test Icons > should render all icons 52`] = `
should render all icons 51`] = `
`;
-exports[`Test Icons > should render all icons 52`] = `
+exports[`Test Icons > should render all icons 53`] = `
((props, ref) => {
+ const { getPrefixCls } = React.useContext(ConfigProvider.ConfigContext);
+ const prefixCls = getPrefixCls('web3-icon-okx-colorful');
+ return (
+
+ );
+});
+OkxWalletColorful.displayName = 'OkxWalletColorful';
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index c7105a30f..cd877ae2f 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -41,6 +41,7 @@ export * from './components/fantom-circle-colorful';
export * from './components/chrome-circle-colorful';
export * from './components/tokenpocket-colorful';
+export * from './components/okx-colorful';
export * from './components/cronos-colorful';
export * from './components/wbtc-circle-colorful';
diff --git a/packages/icons/src/svgs/okx-colorful.svg b/packages/icons/src/svgs/okx-colorful.svg
new file mode 100644
index 000000000..efd0a046b
--- /dev/null
+++ b/packages/icons/src/svgs/okx-colorful.svg
@@ -0,0 +1,19 @@
+
+
diff --git a/packages/wagmi/src/wallets/__tests__/okx-wallet.test.tsx b/packages/wagmi/src/wallets/__tests__/okx-wallet.test.tsx
new file mode 100644
index 000000000..6f9d9d3fd
--- /dev/null
+++ b/packages/wagmi/src/wallets/__tests__/okx-wallet.test.tsx
@@ -0,0 +1,54 @@
+import { OkxWallet } from '@ant-design/web3-wagmi';
+import { mainnet } from 'viem/chains';
+import { describe, expect, it } from 'vitest';
+import { createConfig, http } from 'wagmi';
+import { injected, walletConnect } from 'wagmi/connectors';
+
+describe('OkxWallet', () => {
+ const config = createConfig({
+ chains: [mainnet],
+ transports: {
+ [mainnet.id]: http(),
+ },
+ connectors: [
+ walletConnect({
+ showQrModal: false,
+ projectId: 'YOUR_WALLET_CONNET_PROJECT_ID',
+ }),
+ injected({
+ target() {
+ return {
+ id: 'okxwallet',
+ name: 'OkxWallet',
+ // @ts-ignore
+ provider: window.okxwallet,
+ };
+ },
+ }),
+ ],
+ });
+
+ const wallet = OkxWallet().create(config.connectors);
+
+ it('name', async () => {
+ expect(wallet.name).toBe('OkxWallet');
+ });
+
+ it('always return true for hasWalletReady', async () => {
+ const install = await wallet.hasWalletReady?.();
+ expect(install).toBe(true);
+ });
+
+ it('should create a wallet with the correct properties', () => {
+ for (const key in wallet) {
+ expect(wallet).toHaveProperty(key);
+ }
+ });
+
+ it('custom metadata', () => {
+ const customWallet = OkxWallet({
+ group: 'TestGroup',
+ }).create(config.connectors);
+ expect(customWallet.group).toBe('TestGroup');
+ });
+});
diff --git a/packages/wagmi/src/wallets/index.ts b/packages/wagmi/src/wallets/index.ts
index 68e08388e..3e4767fed 100644
--- a/packages/wagmi/src/wallets/index.ts
+++ b/packages/wagmi/src/wallets/index.ts
@@ -4,3 +4,4 @@ export * from './coinbase-wallet';
export * from './token-pocket';
export * from './safeheron';
export * from './universal-wallet';
+export * from './okx-wallet';
diff --git a/packages/wagmi/src/wallets/okx-wallet.tsx b/packages/wagmi/src/wallets/okx-wallet.tsx
new file mode 100644
index 000000000..cea1164ad
--- /dev/null
+++ b/packages/wagmi/src/wallets/okx-wallet.tsx
@@ -0,0 +1,11 @@
+import { metadata_OkxWallet } from '@ant-design/web3-assets';
+
+import { EthereumWallet } from '../interface';
+import { UniversalWallet } from './universal-wallet';
+
+export const OkxWallet: EthereumWallet = (metadata) => {
+ return new UniversalWallet({
+ ...metadata_OkxWallet,
+ ...metadata,
+ });
+};
diff --git a/packages/web3/src/wagmi/demos/more-wallets.tsx b/packages/web3/src/wagmi/demos/more-wallets.tsx
index 2d8382359..42b0cc8d6 100644
--- a/packages/web3/src/wagmi/demos/more-wallets.tsx
+++ b/packages/web3/src/wagmi/demos/more-wallets.tsx
@@ -2,6 +2,7 @@ import { ConnectButton, Connector } from '@ant-design/web3';
import {
CoinbaseWallet,
MetaMask,
+ OkxWallet,
SafeheronWallet,
TokenPocket,
WagmiWeb3ConfigProvider,
@@ -41,6 +42,9 @@ const config = createConfig({
injected({
target: 'tokenPocket',
}),
+ injected({
+ target: 'okxWallet',
+ }),
],
});
@@ -55,6 +59,7 @@ const App: React.FC = () => {
}),
CoinbaseWallet(),
SafeheronWallet(),
+ OkxWallet(),
]}
config={config}
>