update sendTransaction; add prepareSendTransaction and waitForTransaction

Author: kolirt

README.md

@@ -32,7 +32,9 @@ Simple WalletConnect Web3Modal v2 integration package for Vue3 apps.
     - [FetchBlockNumber](#fetchblocknumber)
     - [FetchTransaction](#fetchtransaction)
     - [FetchTransactionReceipt](#fetchtransactionreceipt)
+    - [PrepareSendTransaction](#preparesendtransaction)
     - [SendTransaction](#sendtransaction)
+    - [WaitForTransaction](#waitfortransaction)
     - [SignMessage](#signmessage)
     - [Multicall](#multicall)
     - [FetchBalance](#fetchbalance)
@@ -205,10 +207,10 @@ import { selectChain } from '@kolirt/vue-web3-auth'
 
 ### FetchGasPrice
 
-```js
+```ts
 import { fetchGasPrice } from '@kolirt/vue-web3-auth'
 
-let data = await fetchGasPrice()
+const data = await fetchGasPrice()
 
 /**
  * Result in data
@@ -224,10 +226,10 @@ let data = await fetchGasPrice()
 
 ### FetchBlockNumber
 
-```js
+```ts
 import { fetchBlockNumber } from '@kolirt/vue-web3-auth'
 
-let data = await fetchBlockNumber()
+const data = await fetchBlockNumber()
 
 /**
  * Result in data
@@ -238,38 +240,59 @@ let data = await fetchBlockNumber()
 
 ### FetchTransaction
 
-```js
+```ts
 import { fetchTransaction } from '@kolirt/vue-web3-auth'
 
-let transaction = await fetchTransaction({
+const transaction = await fetchTransaction({
   hash: '0x7ed8dc64f54ae43f4d53173e95aa929c52de44ec5cea8c28246989914ed7f4fb'
 })
 ```
 
-### fetchTransactionReceipt
+### FetchTransactionReceipt
 
-```js
+```ts
 import { fetchTransactionReceipt } from '@kolirt/vue-web3-auth'
 
-let transactionReceipt = await fetchTransactionReceipt({
+const transactionReceipt = await fetchTransactionReceipt({
   hash: '0x7ed8dc64f54ae43f4d53173e95aa929c52de44ec5cea8c28246989914ed7f4fb'
 })
 ```
 
+### PrepareSendTransaction
+
+```ts
+import { prepareSendTransaction } from '@kolirt/vue-web3-auth'
+
+const preparedTxn = await prepareSendTransaction({
+  to: '0x2D4C407BBe49438ED859fe965b140dcF1aaB71a9',
+  value: 1n
+})
+```
+
 ### SendTransaction
 
-```js
+```ts
 import { sendTransaction } from '@kolirt/vue-web3-auth'
 
-let txn = await sendTransaction({
+const txn = await sendTransaction({
   to: '0x2D4C407BBe49438ED859fe965b140dcF1aaB71a9',
   value: 1n
 })
 ```
 
+### WaitForTransaction
+
+```ts
+import { waitForTransaction } from '@kolirt/vue-web3-auth'
+
+const transactionReceipt = await waitForTransaction({
+  hash: '0x7ed8dc64f54ae43f4d53173e95aa929c52de44ec5cea8c28246989914ed7f4fb',
+})
+```
+
 ### SignMessage
 
-```js
+```ts
 import { signMessage } from '@kolirt/vue-web3-auth'
 
 const signature = await signMessage('test message')
@@ -307,7 +330,7 @@ let data = await multicall({
 
 ### FetchBalance
 
-```js
+```ts
 import { fetchBalance } from '@kolirt/vue-web3-auth'
 
 let bnbBalance = await fetchBalance({
@@ -344,7 +367,7 @@ let tokenBalance = await fetchBalance({
 
 ### FetchToken
 
-```js
+```ts
 import { fetchToken } from '@kolirt/vue-web3-auth'
 
 let data = await fetchToken({
@@ -420,7 +443,7 @@ const gas = await estimateWriteContractGas({
 
 ### ParseEvents
 
-```js
+```ts
 import { erc20ABI, fetchTransactionReceipt, parseEvents } from '@kolirt/vue-web3-auth'
 
 const transactionReceipt = await fetchTransactionReceipt({
@@ -446,7 +469,7 @@ const events = parseEvents({ abi: erc20ABI }, transactionReceipt)
 
 ### WatchContractEvent
 
-```js
+```ts
 import { erc20ABI, watchContractEvent } from '@kolirt/vue-web3-auth'
 
 const unwatch = watchContractEvent(
@@ -463,7 +486,7 @@ const unwatch = watchContractEvent(
 
 ### WatchAsset
 
-```js
+```ts
 import { watchAsset } from '@kolirt/vue-web3-auth'
 
 const result = watchAsset({
@@ -477,7 +500,7 @@ const result = watchAsset({
 
 ### UseFetchBalance
 
-```js
+```ts
 import { useFetchBalance } from '@kolirt/vue-web3-auth'
 
 // use `fetch` for manual init when `disableAutoFetch` is `true`

lib/account.ts

@@ -11,7 +11,7 @@ export const state = reactive<AccountState>({
   currentAccount: null
 })
 
- const accountState = reactive<ConnectedAccount>({
+const accountState = reactive<ConnectedAccount>({
   connected: false,
   address: undefined,
   shortAddress: undefined,

lib/actions/index.ts

@@ -16,4 +16,10 @@ export { multicall } from './multicall'
 
 export { fetchToken } from './token'
 
-export { fetchTransaction, fetchTransactionReceipt, sendTransaction } from './transaction'
+export {
+  fetchTransaction,
+  fetchTransactionReceipt,
+  prepareSendTransaction,
+  sendTransaction,
+  waitForTransaction
+} from './transaction'

lib/actions/transaction.ts

@@ -1,12 +1,19 @@
 import {
   getPublicClient,
   fetchTransaction as masterFetchTransaction,
+  prepareSendTransaction as masterPrepareSendTransaction,
   sendTransaction as masterSendTransaction,
-  waitForTransaction
+  waitForTransaction as masterWaitForTransaction
 } from '@wagmi/core'
 
 import { chain } from '../chain'
-import type { FetchTransaction, FetchTransactionReceipt, SendTransaction } from '../types'
+import type {
+  FetchTransaction,
+  FetchTransactionReceipt,
+  PrepareSendTransaction,
+  SendTransaction,
+  WaitTransaction
+} from '../types'
 
 export function fetchTransaction(data: FetchTransaction) {
   return masterFetchTransaction({
@@ -23,22 +30,23 @@ export function fetchTransactionReceipt(data: FetchTransactionReceipt) {
   })
 }
 
-export async function sendTransaction(data: SendTransaction) {
-  const { hash } = await masterSendTransaction({
+export function prepareSendTransaction(data: PrepareSendTransaction) {
+  return masterPrepareSendTransaction({
     chainId: data.chainId || chain.value.id,
-    to: data.to,
-    account: data.account,
-    gas: data.gas,
-    gasPrice: data.gasPrice,
-    maxFeePerGas: data.maxFeePerGas,
-    maxPriorityFeePerGas: data.maxPriorityFeePerGas,
-    nonce: data.nonce,
-    value: data.value
+    ...data
   })
+}
+
+export function sendTransaction(data: SendTransaction) {
+  return masterSendTransaction({
+    chainId: data.chainId || chain.value.id,
+    ...data
+  })
+}
 
-  return waitForTransaction({
+export function waitForTransaction(data: WaitTransaction) {
+  return masterWaitForTransaction({
     chainId: data.chainId || chain.value.id,
-    hash,
-    confirmations: data.confirmations || 1
+    ...data
   })
 }

lib/types.ts

@@ -1,4 +1,11 @@
-import type { Chain, GetAccountResult, Unit } from '@wagmi/core'
+import type {
+  Chain,
+  GetAccountResult,
+  PrepareSendTransactionArgs,
+  SendTransactionArgs,
+  Unit,
+  WaitForTransactionArgs
+} from '@wagmi/core'
 import type { ThemeCtrlState } from '@web3modal/core'
 import type { EthereumClient } from '@web3modal/ethereum'
 import type { WatchAssetParams } from 'viem/src/types/eip1193'
@@ -171,15 +178,12 @@ export type FetchTransactionReceipt = {
   hash: `0x${string}`
 }
 
-export type SendTransaction = {
-  chainId?: number
-  to: string
-  account?: `0x${string}`
-  gas?: bigint
-  gasPrice?: bigint
-  maxFeePerGas?: bigint
-  maxPriorityFeePerGas?: bigint
-  nonce?: number
+export type PrepareSendTransaction = Omit<PrepareSendTransactionArgs, 'walletClient'> & {
+  value?: bigint
+}
+
+export type SendTransaction = SendTransactionArgs & {
   value?: bigint
-  confirmations?: number
 }
+
+export type WaitTransaction = WaitForTransactionArgs

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolirt/vue-web3-auth",
-  "version": "2.1.1",
+  "version": "2.2.1",
   "description": "Web3 authentication for Vue3 apps based on WalletConnect Web3Modal v2",
   "author": "kolirt",
   "license": "MIT",