@sodax/wallet-sdk
A comprehensive wallet SDK for the Sodax ecosystem that provides unified wallet connectivity across multiple blockchain networks.
Features
Seamless wallet connectivity for all supported wallets in the Sodax network
EVM Wallets: All browser extensions that support EIP-6963 (Hana Wallet, MetaMask, Phantom, etc.) β
Sui Wallets: β Coming soon
Solana Wallets: β Coming soon
Stellar Wallets: β Coming soon
Injective Wallets: β Coming soon
Havah Wallets: β Coming soon
ICON Wallets: β Coming soon
Address and connection state management
EVM (Arbitrum, Avalanche, Base, BSC, Optimism, Polygon) β
Sui β Coming soon
Solana β Coming soon
Stellar β Coming soon
Injective β Coming soon
Havah β Coming soon
ICON β Coming soon
Installation
# Using npm
npm install @sodax/wallet-sdk
# Using yarn
yarn add @sodax/wallet-sdk
# Using pnpm
pnpm add @sodax/wallet-sdk
Peer Dependencies
This package requires the following peer dependencies:
{
"react": ">=19",
"@tanstack/react-query": "latest"
}
Quick Start
import { XWagmiProviders, useXConnectors, useXConnect, useXAccount } from '@sodax/wallet-sdk';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
// Create a QueryClient instance
const queryClient = new QueryClient();
// Your wagmi configuration
const wagmiConfig = {
// ... your wagmi config
};
function App() {
return (
<QueryClientProvider client={queryClient}>
<XWagmiProviders
config={{
EVM: {
wagmiConfig: wagmiConfig,
},
SUI: {
isMainnet: true,
},
SOLANA: {
endpoint: 'https://your-rpc-endpoint',
},
}}
>
<WalletConnect />
</XWagmiProviders>
</QueryClientProvider>
);
}
function WalletConnect() {
// Get available connectors for EVM chain
const connectors = useXConnectors('EVM');
// Get connect mutation
const { mutateAsync: connect } = useXConnect();
// Get connected account info
const account = useXAccount('EVM');
return (
<div className="space-y-4">
{/* Display connected wallet address if connected */}
{account?.address && (
<div className="p-4 bg-gray-100 rounded-lg">
<p className="text-sm text-gray-600">Connected Wallet:</p>
<p className="font-mono">{account.address}</p>
</div>
)}
{/* Display available connectors */}
<div className="space-y-2">
{connectors.map((connector) => (
<button
key={connector.id}
onClick={() => connect(connector)}
className="flex items-center gap-2 p-2 border rounded-lg hover:bg-gray-50"
>
<img
src={connector.icon}
alt={connector.name}
width={24}
height={24}
className="rounded-md"
/>
<span>Connect {connector.name}</span>
</button>
))}
</div>
</div>
);
}
This example demonstrates:
Setting up the required providers (
QueryClientProvider
andXWagmiProviders
)Using
useXConnectors
to get available wallet connectorsUsing
useXConnect
to handle wallet connectionsUsing
useXAccount
to display the connected wallet addressA basic UI to display and connect to available wallets
Requirements
Node.js >= 18.0.0
React >= 19
TypeScript
API Reference
Components
XWagmiProviders
- Main provider component for wallet connectivity
Hooks
Core Wallet Hooks
useXConnectors
- Get available wallet connectorsuseXConnect
- Connect to a walletuseXAccount
- Get account informationuseXDisconnect
- Disconnect from a wallet
Chain-Specific Hooks
useEvmSwitchChain
- Switch between EVM chains
Balance Hooks
useXBalances
- Fetch token balances
Service Hooks
useXService
- Access chain-specific service
Types
Core Types
XAccount
- Wallet account typeXConnection
- Wallet connection typeXConnector
- Wallet connector typeXToken
- Cross-chain token type
Classes
XConnector
XConnector
- Base class for wallet connectorsEvmXConnector
- EVM wallet connectorSolanaXConnector
- Solana wallet connectorSuiXConnector
- Sui wallet connectorStellarXConnector
- Stellar wallet connectorInjectiveMetamaskXConnector
- Injective MetaMask connectorInjectiveKelprXConnector
- Injective Keplr connectorHavahXConnector
- Havah wallet connectorIconXConnector
- ICON wallet connector
Contributing
We welcome contributions! Please see our Contributing Guide for details.
Development
# Install dependencies
pnpm install
# Build the package
pnpm build
# Run in development mode
pnpm dev
# Run type checking
pnpm checkTs
# Format code
pnpm pretty
# Lint code
pnpm lint
License
MIT
Support
Last updated