@zkbridge/token-bridge v2.1.1
@zkbridge/token-bridge
@zkbridge/token-bridge is an SDK project for Token Bridge on EVM similar chains
Usage
install
pnpm add @zkbridge/token-bridge
use demo
/* eslint-disable react/no-deprecated */
import { TokenBridgeWidget, BridgeProvider } from "@zkbridge/btc-token-bridge";
import { useCallback, useEffect, useState } from "react";
import ReactDOM from "react-dom";
declare global {
interface Window {
ethereum: any;
}
}
//===========================================================
// config 参考src/__tests__/lightningConfig.ts
// - 【注意】: 以下合约地址和其他配置信息只是一个举例,请不要直接在线上使用。
// (don't use the following contract address and other configuration information directly in production)
//===========================================================
const chainMap = {
oeth: {
fastBridgeContract: isProd
? "0x24bbC063DeF30Ae81AECC659B97A8b2562b2AFCd"
: "0xd19b6Edef09E3455Ef6fc1130f0E984042b0226e",
nativeToken: {
poolId: ETHPoolIdOfLightning,
shareDecimal: 18,
tokenName: "ETH",
decimal: 18,
},
erc20Tokens: {
[USDT_TOKEN_NAME]: {
tokenAddress: "0x94b008aA00579c1307B0EF2c499aD98a8ce58e58",
decimal: 6,
shareDecimal: 6,
poolId: USDTPoolIdOfLightning,
},
},
},
bnb: {
fastBridgeContract: isProd
? "0x51187757342914E7d94FFFD95cCCa4f440FE0E06"
: "0x8169E97E84A95c90FE44df038D0b79a5a2650F58",
nativeToken: {
poolId: BNBPoolIdOfLightning,
shareDecimal: 18,
decimal: 18,
tokenName: BNBTokenName,
},
erc20Tokens: {
[USDT_TOKEN_NAME]: {
tokenAddress: "0x55d398326f99059fF775485246999027B3197955",
decimal: 18,
shareDecimal: 6,
poolId: USDTPoolIdOfLightning,
},
[ETHTokenName]: {
tokenAddress: "0x2170Ed0880ac9A755fd29B2688956BD959F933F8",
decimal: 18,
poolId: ETHPoolIdOfLightning,
shareDecimal: 18,
},
},
},
opbnb_mainnet: {
fastBridgeContract: isProd
? "0x953a578c7Ce8F3A1BF625d182A8caf7181FD4BEB"
: "0x39454A5Ad76c379ec1a5281cD93e301Fed3995A4",
nativeToken: {
poolId: BNBPoolIdOfLightning,
shareDecimal: 18,
decimal: 18,
tokenName: BNBTokenName,
},
erc20Tokens: {
[ETHTokenName]: {
tokenAddress: "0xE7798f023fC62146e8Aa1b36Da45fb70855a77Ea",
decimal: 18,
shareDecimal: 18,
poolId: ETHPoolIdOfLightning,
},
[USDT_TOKEN_NAME]: {
tokenAddress: "0x9e5AAC1Ba1a2e6aEd6b32689DFcF62A509Ca96f3",
decimal: 18,
shareDecimal: 6,
poolId: USDTPoolIdOfLightning,
},
},
},
matic: {
fastBridgeContract: isProd
? "0x104bc711530554F18936a12542192F8bd36166B1"
: "0xAbb8EC70288F6470DD7c3bcCF6c68a962820a0d5",
nativeToken: undefined, //不支持native
erc20Tokens: {
[USDT_TOKEN_NAME]: {
tokenAddress: "0xc2132D05D31c914a87C6611C10748AEb04B58e8F",
decimal: 6,
shareDecimal: 6,
poolId: USDTPoolIdOfLightning,
},
},
},
} as const satisfies ChainMapForConfig;
//===========================================================
// 支持的联对
//===========================================================
const chainPair = {
bnb: {
opbnb_mainnet: [USDT_TOKEN_NAME, BNBTokenName],
matic: [USDT_TOKEN_NAME],
},
opbnb_mainnet: {
bnb: [USDT_TOKEN_NAME, BNBTokenName],
matic: [USDT_TOKEN_NAME],
},
matic: {
bnb: [USDT_TOKEN_NAME],
opbnb_mainnet: [USDT_TOKEN_NAME],
},
} as const satisfies ChainPairForConfig< typeof chainMap, TokenNameLightningType>;
const App = () => {
const [sourceAccount, setSourceAccount] = useState<string>("");
useEffect(() => {
window.ethereum
.request({ method: "eth_requestAccounts" })
.then((accounts: string[]) => {
setSourceAccount(accounts?.[0] || "");
});
const setAccount = (accounts: string[]) => {
console.log("accounts changed", accounts);
setSourceAccount(accounts?.[0] || "");
};
window.ethereum.on("accountsChanged", setAccount);
return () => {
window.ethereum.off("accountsChanged", setAccount);
};
}, []);
return (
<BridgeProvider
value={{
chainMap: chainMap,
chainPair: chainPair,
injectedProvider: window.ethereum,
sourceAccount,
// bridgeContractType: "lightning",
partnerId: "",
showHistory: true, //show tx history panel
}}
>
<TokenBridgeWidget />
</BridgeProvider>
);
};
ReactDOM.render(<App />, document.getElementById("app")!);
How to build
Pre-Requisites
This project uses PNPM to manage dependencies.
$ npm i -g pnpm
Setup
Install and build dependencies across all project folders:
$ pnpm install
Dev
Install and build dependencies across all project folders:
$ pnpm run dev #start vite dev server and css first time compile
$ pnpm run watchcss #start watch css change and recomplie it
Build:
$ pnpm run build
29 days ago
29 days ago
28 days ago
30 days ago
30 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago