diff --git a/.changeset/friendly-weeks-applaud.md b/.changeset/friendly-weeks-applaud.md new file mode 100644 index 00000000..ee780f79 --- /dev/null +++ b/.changeset/friendly-weeks-applaud.md @@ -0,0 +1,5 @@ +--- +'@node-real/walletkit': minor +--- + +refactor: solana and evm are unified into one package diff --git a/examples/nextjs/package.json b/examples/nextjs/package.json index 8390e60e..cdd60926 100644 --- a/examples/nextjs/package.json +++ b/examples/nextjs/package.json @@ -11,12 +11,14 @@ }, "dependencies": { "@node-real/walletkit": "workspace:*", + "@tanstack/react-query": "^5", + "encoding": "^0.1.13", "next": "^14", + "pino-pretty": "^11.2.2", "react": "^18", "react-dom": "^18", "viem": "^2", - "wagmi": "^2", - "@tanstack/react-query": "^5.51.1" + "wagmi": "^2" }, "devDependencies": { "@types/node": "^20", diff --git a/examples/nextjs/pages/_app.tsx b/examples/nextjs/pages/_app.tsx index 02dfb412..2b91e0a3 100644 --- a/examples/nextjs/pages/_app.tsx +++ b/examples/nextjs/pages/_app.tsx @@ -1,62 +1,75 @@ import '@node-real/walletkit/styles.css'; import '@/styles/globals.css'; -import { bsc, mainnet, opBNB } from 'wagmi/chains'; +import { mainnet } from 'wagmi/chains'; -import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets'; +import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/evm'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { - defaultWagmiConfig, - SwitchNetworkModal, - WalletKitButton, - WalletKitOptions, WalletKitProvider, - ProfileModal, ConnectModal, + useConnectModal, + WalletKitConfig, } from '@node-real/walletkit'; -import { WagmiProvider } from 'wagmi'; import { AppProps } from 'next/app'; +import { + trustWallet as solanaTrustWallet, + phantomWallet as solanaPhantomWallet, +} from '@node-real/walletkit/solana'; const queryClient = new QueryClient(); -const config = defaultWagmiConfig({ - appName: 'WalletKit', - chains: [bsc, mainnet, opBNB], - connectors: [trustWallet(), metaMask(), walletConnect()], - - // WalletConnect 2.0 requires a projectId which you can create quickly - // and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in - walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767', -}); - -const options: WalletKitOptions = { - initialChainId: 1, +const config: WalletKitConfig = { + walletSetting: { + autoConnect: true, + evm: { + initialChainId: 1, + wallets: [metaMask(), trustWallet(), walletConnect()], + chains: [mainnet] as any[], + }, + solana: { + rpcUrl: 'https://solana-rpc.debridge.finance', + wallets: [solanaTrustWallet(), solanaPhantomWallet()], + }, + }, + appearance: { + mode: 'light', + }, + events: { + closeModalOnEsc: false, + closeModalOnOverlayClick: false, + closeModalAfterConnected: true, + }, }; export default function App({ Component, pageProps }: AppProps) { return ( - + - - - - + - + {/* */} + + - {/* + {/* Profile modal shows some basic information about the current account, If you don't need this modal, you can remove it. */} - + {/* */} - {/* + {/* 👇 Here's the SwitchNetworkModal If the user switches to a network that is not supported by our dApp, this modal will be displayed to remind the user to switch to our supported networks. */} - - + {/* */} - + ); } + +function ConnectButton() { + const { onOpen } = useConnectModal(); + + return ; +} diff --git a/examples/nextjs/pages/_document.tsx b/examples/nextjs/pages/_document.tsx index ef37a5de..f6de4d29 100644 --- a/examples/nextjs/pages/_document.tsx +++ b/examples/nextjs/pages/_document.tsx @@ -1,5 +1,5 @@ import { Html, Head, Main, NextScript } from 'next/document'; -import { EthereumScript } from '@node-real/walletkit'; +import { EthereumScript } from '@node-real/walletkit/evm'; export default function Document() { return ( diff --git a/examples/vite/package.json b/examples/vite/package.json index a8fb2855..de7d4431 100644 --- a/examples/vite/package.json +++ b/examples/vite/package.json @@ -11,11 +11,12 @@ }, "dependencies": { "@node-real/walletkit": "workspace:*", + "@particle-network/connectkit": "^2.0.0", + "@tanstack/react-query": "^5", "react": "^18", "react-dom": "^18", "viem": "^2", - "wagmi": "^2", - "@tanstack/react-query": "^5.51.1" + "wagmi": "^2" }, "devDependencies": { "@types/react": "^18", diff --git a/examples/vite/src/App.tsx b/examples/vite/src/App.tsx index 6059af0d..d22b1712 100644 --- a/examples/vite/src/App.tsx +++ b/examples/vite/src/App.tsx @@ -1,47 +1,109 @@ -import '@node-real/walletkit/styles.css'; -import './global.css'; -import { bsc, mainnet, opBNB } from 'wagmi/chains'; - -import { trustWallet, metaMask, walletConnect } from '@node-real/walletkit/wallets'; -import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { + BaseWallet, ConnectModal, - defaultWagmiConfig, - ProfileModal, - SwitchNetworkModal, - WalletKitButton, - WalletKitOptions, + useConnectModal, + useWallets, + WalletKitConfig, WalletKitProvider, } from '@node-real/walletkit'; -import { WagmiProvider } from 'wagmi'; - -const queryClient = new QueryClient(); +import VConsole from 'vconsole'; +import { metaMask, trustWallet, walletConnect } from '@node-real/walletkit/evm'; +import { + trustWallet as solanaTrustWallet, + phantomWallet as solanaPhantomWallet, +} from '@node-real/walletkit/solana'; +import { mainnet } from 'viem/chains'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -const config = defaultWagmiConfig({ - appName: 'WalletKit', - chains: [mainnet, bsc, opBNB], - connectors: [trustWallet(), metaMask(), walletConnect()], +new VConsole(); - // WalletConnect 2.0 requires a projectId which you can create quickly - // and easily for free over at WalletConnect Cloud https://cloud.walletconnect.com/sign-in - walletConnectProjectId: 'e68a1816d39726c2afabf05661a32767', -}); +const queryClient = new QueryClient(); -const options: WalletKitOptions = { - initialChainId: 1, +const config: WalletKitConfig = { + walletSetting: { + autoConnect: true, + evm: { + initialChainId: 1, + wallets: [metaMask(), trustWallet(), walletConnect()], + chains: [mainnet] as any[], + }, + solana: { + rpcUrl: 'https://solana-rpc.debridge.finance', + wallets: [solanaTrustWallet(), solanaPhantomWallet()], + }, + }, + appearance: {}, + events: { + closeModalOnEsc: false, + closeModalOnOverlayClick: false, + closeModalAfterConnected: true, + }, }; export default function App() { return ( - + - - - - - - + + - + + ); +} + +function selectWallets(wallets: BaseWallet[], include: string, exclude: string) { + const newWallets: BaseWallet[] = []; + wallets.forEach((item) => { + if (item.walletType === include) { + newWallets.push({ ...item }); + } else if (item.walletType === exclude) { + newWallets.push({ + ...item, + render: ({ wallet, onClick }) => { + return ; + }, + }); + } + }); + + newWallets.forEach((item) => { + if ( + newWallets.find( + (e) => e.walletType === include && item.walletType === exclude && e.id === item.id, + ) + ) { + item.isVisible = false; + } + }); + + newWallets.sort((a, b) => { + if (a.walletType === b.walletType) return 0; + if (a.walletType === include) return -1; + return 0; + }); + + return newWallets; +} + +function ConnectButton() { + const { onOpen } = useConnectModal(); + const { wallets, setWallets } = useWallets(); + + const onEvm = () => { + const newWallets = selectWallets(wallets, 'evm', 'solana'); + setWallets(newWallets); + }; + + const onSolana = () => { + const newWallets = selectWallets(wallets, 'solana', 'evm'); + setWallets(newWallets); + }; + + return ( + <> + + + + ); } diff --git a/package.json b/package.json index 19c4a0ca..95bfd91d 100644 --- a/package.json +++ b/package.json @@ -9,9 +9,7 @@ "scripts": { "prepare": "husky install", "lint": "pnpm eslint .", - "dev": "pnpm --F @node-real/walletkit dev", - "build": "pnpm --F @node-real/walletkit build", - "dev:docs": "pnpm --F @node-real/walletkit build:watch & pnpm --F website dev", + "build": "pnpm --F @node-real/* build", "build:docs": "pnpm build && pnpm --F website build", "ci:enter": "pnpm changeset pre enter alpha || true", "ci:exit": "pnpm changeset pre exit || true", @@ -21,7 +19,7 @@ "ci:stable-version": "pnpm ci:exit && pnpm ci:version" }, "devDependencies": { - "@changesets/cli": "^2.27.5", + "@changesets/cli": "^2.27.7", "@commitlint/cli": "^18.6.1", "@commitlint/config-conventional": "^18.6.3", "@typescript-eslint/eslint-plugin": "^5.62.0", @@ -30,7 +28,7 @@ "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-refresh": "^0.3.5", "husky": "^8.0.3", - "lint-staged": "^15.2.7", - "prettier": "^3.3.2" + "lint-staged": "^15.2.9", + "prettier": "^3.3.3" } } diff --git a/packages/walletkit/CHANGELOG.md b/packages/walletkit/CHANGELOG.md deleted file mode 100644 index f3ecfd30..00000000 --- a/packages/walletkit/CHANGELOG.md +++ /dev/null @@ -1,40 +0,0 @@ -# @node-real/walletkit - -## 2.0.3 - -### Patch Changes - -- 5b7f3f6: test: Add log -- 5b7f3f6: fix: ssr no need to wait for the provider to be ready - -## 2.0.3-alpha.0 - -### Patch Changes - -- d5437a7: test: Add log -- 90846a4: fix: ssr no need to wait for the provider to be ready - -## 2.0.2 - -### Patch Changes - -- 1fed209: feat: Upgrade wagmi & viem to 2.x -- 1fed209: fix: ssr no need to wait for the provider to be ready - -## 2.0.2-alpha.0 - -### Patch Changes - -- 90846a4: fix: ssr no need to wait for the provider to be ready - -## 2.0.1 - -### Patch Changes - -- 83c5001: feat: Upgrade wagmi & viem to 2.x - -## 2.0.1-alpha.0 - -### Patch Changes - -- 919b9ba: feat: Upgrade wagmi & viem to 2.x diff --git a/packages/walletkit/__dev__/App.tsx b/packages/walletkit/__dev__/App.tsx index 0f02686d..8e572c48 100644 --- a/packages/walletkit/__dev__/App.tsx +++ b/packages/walletkit/__dev__/App.tsx @@ -1,89 +1,110 @@ -import { useState } from 'react'; -import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -import { WagmiProvider } from 'wagmi'; -import VConsole from 'vconsole'; import { + BaseWallet, ConnectModal, - ProfileModal, - SwitchNetworkModal, - ThemeMode, - WalletKitButton, - WalletKitOptions, - WalletKitProvider, - defaultWagmiConfig, useConnectModal, - useProfileModal, - useSwitchNetworkModal, -} from '@/index'; + useWallets, + WalletKitConfig, + WalletKitProvider, +} from '@/core/index'; +import './style.css'; +import VConsole from 'vconsole'; +import { metaMask, trustWallet, walletConnect } from '@/evm/index'; import { - binanceWeb3Wallet, - bitgetWallet, - coinbaseWallet, - metaMask, - okxWallet, - tokenPocket, - trustWallet, - walletConnect, -} from '@/wallets'; -import { chains } from './chains'; - -const queryClient = new QueryClient(); + trustWallet as solanaTrustWallet, + phantomWallet as solanaPhantomWallet, +} from '@/solana/index'; +import { mainnet } from 'viem/chains'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; new VConsole(); -const config = defaultWagmiConfig({ - appName: 'WalletKit', - chains, - connectors: [ - binanceWeb3Wallet(), - bitgetWallet(), - coinbaseWallet(), - metaMask(), - okxWallet(), - tokenPocket(), - trustWallet(), - walletConnect(), - ], -}); +const queryClient = new QueryClient(); -const options: WalletKitOptions = { - initialChainId: 204, +const config: WalletKitConfig = { + walletSetting: { + autoConnect: true, + evm: { + initialChainId: 1, + wallets: [metaMask(), trustWallet(), walletConnect()], + chains: [mainnet], + }, + solana: { + rpcUrl: 'https://solana-rpc.debridge.finance', + wallets: [solanaTrustWallet(), solanaPhantomWallet()], + }, + }, + appearance: {}, + events: { + closeModalOnEsc: false, + closeModalOnOverlayClick: false, + closeModalAfterConnected: true, + }, }; export default function App() { - const [mode, setMode] = useState('light'); - const nextMode = mode === 'light' ? 'dark' : 'light'; - return ( - + - -
mode: {mode}
- -
- - - - - - - - + + - + ); } -function Example() { - const connectModal = useConnectModal(); - const profileModal = useProfileModal(); - const switchNetworkModal = useSwitchNetworkModal(); +function selectWallets(wallets: BaseWallet[], include: string, exclude: string) { + const newWallets: BaseWallet[] = []; + wallets.forEach((item) => { + if (item.walletType === include) { + newWallets.push({ ...item }); + } else if (item.walletType === exclude) { + newWallets.push({ + ...item, + render: ({ wallet, onClick }) => { + return ; + }, + }); + } + }); + + newWallets.forEach((item) => { + if ( + newWallets.find( + (e) => e.walletType === include && item.walletType === exclude && e.id === item.id, + ) + ) { + item.isVisible = false; + } + }); + + newWallets.sort((a, b) => { + if (a.walletType === b.walletType) return 0; + if (a.walletType === include) return -1; + return 0; + }); + + return newWallets; +} + +function ConnectButton() { + const { onOpen } = useConnectModal(); + const { wallets, setWallets } = useWallets(); + + const onEvm = () => { + const newWallets = selectWallets(wallets, 'evm', 'solana'); + setWallets(newWallets); + }; + + const onSolana = () => { + const newWallets = selectWallets(wallets, 'solana', 'evm'); + setWallets(newWallets); + }; return ( <> - - - + + + ); } diff --git a/packages/walletkit/__dev__/chains.ts b/packages/walletkit/__dev__/chains.ts deleted file mode 100644 index b2067fd4..00000000 --- a/packages/walletkit/__dev__/chains.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { bsc, bscTestnet, mainnet, opBNB } from 'wagmi/chains'; - -export const chains = [ - { - id: 1017, - name: 'BNB Greenfield', - nativeCurrency: { - name: 'tBNB', - symbol: 'tBNB', - decimals: 18, - }, - rpcUrls: { - default: { - http: [`https://greenfield-chain-us.bnbchain.org`], - }, - public: { - http: [`https://greenfield-chain-us.bnbchain.org`], - }, - }, - blockExplorers: { - etherscan: { name: 'Greenfield Scan', url: `https://greenfieldscan.com` }, - default: { name: 'Greenfield Scan', url: `https://greenfieldscan.com` }, - }, - }, - opBNB, - bscTestnet, - bsc, - mainnet, -]; diff --git a/packages/walletkit/__dev__/index.html b/packages/walletkit/__dev__/index.html index 07e23793..d7134589 100644 --- a/packages/walletkit/__dev__/index.html +++ b/packages/walletkit/__dev__/index.html @@ -2,7 +2,6 @@ - WalletKit Test Demo