wallet-ux
v0.1.0
Published
Universal Web3 Wallet UX state machine for EIP-1193 providers.
Downloads
99
Maintainers
Readme
⚡ wallet-ux
Universal Web3 Wallet UX State Machine (EIP-1193 Compatible)
wallet-ux is a tiny, zero-dependency TypeScript library that normalizes user-facing wallet behavior across all EIP-1193 providers.
It gives developers a consistent set of UX states like:
connectingconnectedwaitingForSignaturependingTransactionuserRejectedtransactionSuccesstransactionErrorswitchingNetworkdisconnectederror
Something no existing library (wagmi, viem, ethers.js, web3.js) provides.
🚀 Features
- ⚡ Universal UX state machine for all wallets
- 🔌 Works with MetaMask, Coinbase, Rabby, Frame, WalletConnect, Brave, OKX
- 🧩 Zero dependencies
- 🟦 Full TypeScript support
- 🌍 Framework-agnostic (React/Vue/Svelte wrappers optional)
- 📦 Lightweight (< 5 KB)
- 🔁 Consistent behavior across all wallets
📦 Installation
npm install wallet-ux📝 Usage
import { createWalletUX } from 'wallet-ux';
const wallet = createWalletUX({
provider: window.ethereum,
});
wallet.onStateChange(state => {
console.log('UX State:', state);
});
await wallet.connect();
await wallet.sendTransaction({
to: '0x...',
value: '0x1',
});🎛 Available UX States
idle
connecting
connected
waitingForSignature
waitingForTransaction
pendingTransaction
transactionSuccess
transactionError
switchingNetwork
userRejected
error
disconnectedThese states eliminate hundreds of lines of custom wallet-handling logic.
🔧 API Overview
createWalletUX({ provider })
Returns:
{
getState(): WalletUXState;
onStateChange(cb: (state) => void): void;
connect(): Promise<string>;
sendTransaction(tx): Promise<any>;
switchNetwork(chainId: number): Promise<void>;
reset(): void;
}⚛ React Hook (optional)
Install:
npm install wallet-ux-reactUsage:
const { state, connect } = useWalletUX(window.ethereum);📚 Examples
See the /examples folder in the repo:
basic.js– minimal integration example- More framework examples coming soon
🤝 Contributing
PRs are welcome!
If this project helps you, please ⭐ star the repo — it helps visibility and adoption.
📄 License
MIT License
© 2025
