WalletKit

WalletKit 是一个轻量级的多链钱包连接工具包，旨在帮助开发者快速集成支持多条链的钱包插件，如 MetaMask、Phantom、TronLink、Gel Wallet 等。它提供了便捷的状态管理、自定义 Hooks 和统一的 API，使 DApp 开发更简单高效。

WalletKit is a lightweight, multi-chain compatible wallet connection toolkit designed to help developers quickly integrate wallet plugins that support multiple chains, such as MetaMask, Phantom, TronLink, Gel Wallet, and more. It provides convenient state management, custom hooks, and a unified API, making DApp development simpler and more efficient.

架构 Architecture

WalletKit 由两个主要部分组成 / WalletKit consists of two main parts:

1. @web3jskit/wallethelper: 底层钱包连接库，提供统一的钱包接口和状态管理 / Core wallet connection library providing unified wallet interfaces and state management

   • 多链支持 / Multi-chain support (EVM, PUT, SOL, Tron, BTC)
   • 钱包检测和连接 / Wallet detection and connection
   • 统一的交易接口 / Unified transaction interface
   • 状态管理 / State management

2. @web3jskit/walletkit: React 组件库，提供开箱即用的 UI 组件 / React component library providing ready-to-use UI components

   • 钱包连接按钮 / Wallet connection button
   • 钱包选择模态框 / Wallet selection modal
   • 链切换组件 / Chain switching component
   • 自定义 Hooks / Custom hooks

安装 Installation

通过 npm、yarn 或 pnpm 安装 / Install via npm, yarn, or pnpm:

# npm
npm install @web3jskit/walletkit

# yarn
yarn add @web3jskit/walletkit

# pnpm
pnpm add @web3jskit/walletkit

快速开始 Quick Start

1. 导入并初始化 Import and Initialize

import { WalletKitProvider, ConnectButton } from '@web3jskit/walletkit';

function App() {
	return (
		<WalletKitProvider>
			<ConnectButton />
			{/* 其他组件 Other components */}
		</WalletKitProvider>
	);
}

2. 使用 Hooks Use Hooks

import { useWalletKit } from '@web3jskit/walletkit';

function MyComponent() {
	const { openModal, currentChainType, setChainType, currentConnector, walletAddress, getProvider } = useWalletKit();

	// 连接钱包 Connect wallet
	const handleConnect = () => {
		openModal(AppModal.ConnectModal);
	};

	// 断开连接 Disconnect
	const handleDisconnect = () => {
		currentConnector?.disconnect();
	};

	return (
		<div>
			<div>Chain: {currentChainType}</div>
			<div>Wallet: {currentConnector?.name}</div>
			<div>Address: {walletAddress}</div>
		</div>
	);
}

核心功能 Core Features

1. 钱包连接 Wallet Connection

const { currentConnector, connectStatus } = useWalletKit();

// 连接钱包 Connect wallet
await currentConnector.connect();

// 断开连接 Disconnect
await currentConnector.disconnect();

// 监听状态 Listen to status
console.log(connectStatus); // 'connected' | 'connecting' | 'disconnected'

2. 链切换 Chain Switching

const { setChainType, currentChainType } = useWalletKit();

// 切换链 Switch chain
await setChainType(ChainType.EVM);

3. 交易操作 Transaction Operations

const { currentConnector } = useWalletKit();

// 签名消息 Sign message
const signature = await currentConnector.signMessage('Hello Web3');

// 发送交易 Send transaction
const txHash = await currentConnector.sendTransaction({
 to: '0x...',
 value: '0x...',
});

// 合约调用 Contract call
const result = await currentConnector.writeContract({
 address: '0x...',
 abi: [...],
 functionName: 'transfer',
 args: [...],
});

支持的钱包 Supported Wallets

• MetaMask (EVM)
• Phantom (SOL, BTC)
• TronLink (TRON)
• Gel Wallet (EVM, PUT, SOL)
• OKX Wallet (EVM)
• Trust Wallet (EVM)
• TokenPocket (EVM)
• Bitget Wallet (EVM)
• Coinbase Wallet (EVM)

API 参考 API Reference

useWalletKit Hook

| 属性/方法 Property/Method | 描述 Description | | ------------------------- | --------------------------------------- | | currentChainType | 当前链类型 Current chain type | | setChainType | 切换链类型 Switch chain type | | currentConnector | 当前钱包连接器 Current wallet connector | | connectStatus | 连接状态 Connection status | | walletAddress | 钱包地址 Wallet address | | getProvider | 获取 Provider Get provider | | openModal | 打开模态框 Open modal | | closeModal | 关闭模态框 Close modal |

WalletConnector

| 方法 Method | 描述 Description | | ----------------------- | ------------------------- | | connect() | 连接钱包 Connect wallet | | disconnect() | 断开连接 Disconnect | | signMessage(message) | 签名消息 Sign message | | sendTransaction(tx) | 发送交易 Send transaction | | writeContract(params) | 合约写入 Write contract | | readContract(params) | 合约读取 Read contract |

贡献指南 Contributing

欢迎提交 Issues 和功能请求！贡献步骤：

We welcome issues and feature requests! Steps to contribute:

1. Fork 本仓库 Fork this repository
2. 创建功能分支 Create feature branch:

git checkout -b feature/my-feature

3. 提交更改 Commit changes:

git commit -m "Add some feature"

4. 推送分支 Push branch:

git push origin feature/my-feature

5. 提交 Pull Request Submit Pull Request

许可证 License

MIT License

联系我们 Contact Us

如有问题或建议，请通过以下方式联系我们：

For questions or suggestions, please contact us:

• GitHub Issues
• Email: [email protected]

希望你喜欢使用 WalletKit！

Hope you enjoy using WalletKit! 😊