ngx-wagmi v0.0.5
ngx-wagmi
ngx-wagmi is a wagmi-compatible library for Angular 18, built entirely with Signal. It empowers Angular developers to seamlessly integrate Web3 functionality into their applications. With ngx-wagmi, you get a powerful suite of tools to interact with wallets, contracts, and blockchain networksβall optimized for Angular's reactive architecture.
π Features
ngx-wagmi supports a comprehensive set of Web3 functions, enabling robust blockchain interactions:
π Account Management
account.ts
β Get the current account details.accountEffect.ts
β Reactively handle account changes.switchAccount.ts
β Switch between connected accounts.disconnect.ts
β Disconnect the wallet.
π’ Balances & Transactions
balance.ts
β Fetch the balance of an account.transaction.ts
β Retrieve transaction details.transactionCount.ts
β Get the number of transactions from an account.transactionConfirmations.ts
β Check the number of confirmations for a transaction.sendTransaction.ts
β Send a transaction.waitForTransactionReceipt.ts
β Wait for a transaction receipt.
π Blockchain Data
block.ts
β Fetch block details.blockTransactionCount.ts
β Get the transaction count for a block.feeHistory.ts
β Retrieve historical fee data.gasPrice.ts
β Get the current gas price.estimateGas.ts
β Estimate gas usage for a transaction.
π¦ Contracts
deployContract.ts
β Deploy a smart contract.readContract.ts
β Read from a smart contract.readContracts.ts
β Read multiple smart contracts in a single call.simulateContract.ts
β Simulate a contract interaction.writeContract.ts
β Write data to a smart contract.
π§βπ€ ENS (Ethereum Name Service)
ensAddress.ts
β Resolve an ENS name to an address.ensName.ts
β Get the ENS name for an address.ensAvatar.ts
β Fetch the avatar for an ENS profile.ensResolver.ts
β Get the resolver for an ENS name.ensText.ts
β Retrieve ENS text records.
π οΈ Utility Functions
bytecode.ts
β Retrieve contract bytecode.storageAt.ts
β Read raw storage data at a given position.prepareTransactionRequest.ts
β Prepare a transaction request.proof.ts
β Generate a proof for a Merkle tree.
π Verification
verifyMessage.ts
β Verify a signed message.verifyTypedData.ts
β Verify typed data signatures.
π Reactivity
watchBlockNumber.ts
β Watch for new block numbers.watchBlocks.ts
β Watch for new blocks.watchPendingTransactions.ts
β Watch for pending transactions.watchContractEvent.ts
β Listen to contract events.
π‘οΈ Chain & Wallet Management
chains.ts
β Access supported chains.switchChain.ts
β Switch to a different chain.connect.ts
β Connect to a wallet.connections.ts
β Manage multiple connections.connectorClient.ts
β Access the connector client.walletClient.ts
β Use the wallet client.watchAsset.ts
β Add a token to the wallet.
π¦ Installation
Install ngx-wagmi via npm:
npm install ngx-wagmi
π οΈ Usage
1. Setup injection tokens
Highly recommended setup with ngx-seedkit
for ready-to-use ConnectWallet supports widely-known wallets
In your app.config.ts
. Check advanced example from demo page
import { http, createConfig } from '@wagmi/core'
import { mainnet, sepolia } from '@wagmi/core/chains'
import { provideTanStackQuery, QueryClient, withDevtools } from '@tanstack/angular-query-experimental';
import { provideWagmiConfig } from 'ngx-wagmi';
const config = createConfig({
chains: [mainnet, sepolia],
transports: {
[mainnet.id]: http(),
[sepolia.id]: http(),
},
})
export const appConfig: ApplicationConfig = {
providers: [
...
provideTanStackQuery(new QueryClient(), withDevtools()),
provideWagmiConfig(config),
...
]
}
2. Import ngx-wagmi and start using its functionalities in your Angular application:
import { injectConnect } from 'ngx-wagmi';
...
// Example: Connect to a wallet
connectM = injectConnect()
constructor() {
connectM.connect()
// or
await connectM.connectAsync()
}...
π Documentation
WIP
π€ Contributing
Contributions are welcome! Feel free to open issues or submit pull requests on GitHub.
π License
This library is released under the MIT License.