Transactions
Transaction Components
The transaction component allows you to display transaction details in readable format with nice UI and initiate the transaction.
Raw Transaction Component
The MarkdownComponentRawTransaction
component displays the core details of a blockchain transaction.
Syntax
<MarkdownComponentRawTransaction
txTo="{{{ value }}}"
txGas="{{{ value }}}"
txData="{{{ value }}}"
txFrom="{{{ value }}}"
txValue="{{{ value }}}"
txGasPrice="{{{ value }}}"
chainId="{{{ value }}}"
/>
Parameters
txTo: recipient address of the transaction
txGas: gas limit for the transaction
txData: transaction data/input (typically contract function calls)
txFrom: sender address of the transaction
txValue: amount of native currency being transferred (in wei)
txGasPrice: gas price for the transaction (in wei)
chainId: blockchain network identifier
Example
<MarkdownComponentRawTransaction
txTo="0x742d35Cc6634C0532925a3b8D376dF3D9AFd8896"
txGas="21000"
txData="0x"
txFrom="0x8ba1f109551bD432803012645Hac136c8Ce3d65"
txValue="1000000000000000000"
txGasPrice="20000000000"
chainId="1"
/>
This displays a standard Ethereum transaction sending 1 ETH with basic gas parameters.
Raw Transaction with Permit Component
The MarkdownComponentRawTransactionWithPermit
component extends the basic transaction display to include ERC-20 permit details that allows to send and swap tokens.
Syntax
<MarkdownComponentRawTransactionWithPermit
txTo="{{{ value }}}"
txGas="{{{ value }}}"
txData="{{{ value }}}"
txFrom="{{{ value }}}"
txValue="{{{ value }}}"
txGasPrice="{{{ value }}}"
permitSymbol="{{{ value }}}"
permitTo="{{{ value }}}"
permitToken="{{{ value }}}"
permitValue="{{{ value }}}"
chainId="{{{ value }}}"
/>
Parameters
txTo: recipient address of the transaction
txGas: gas limit for the transaction
txData: transaction data/input
txFrom: sender address of the transaction
txValue: amount of native currency being transferred (in wei)
txGasPrice: gas price for the transaction (in wei)
permitSymbol: symbol of the token being permitted (e.g., "USDC", "DAI")
permitTo: address being granted permission to spend tokens
permitToken: contract address of the token being permitted
permitValue: amount of tokens being permitted for spending
chainId: blockchain network identifier
Example
<MarkdownComponentRawTransactionWithPermit
txTo="0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984"
txGas="150000"
txData="0xa9059cbb000000000000000000000000742d35cc6634c0532925a3b8d376df3d9afd8896000000000000000000000000000000000000000000000000016345785d8a0000"
txFrom="0x8ba1f109551bD432803012645Hac136c8Ce3d65"
txValue="0"
txGasPrice="25000000000"
permitSymbol="UNI"
permitTo="0x7a250d5630B4cF539739dF2C5dAcb4c659F2488D"
permitToken="0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984"
permitValue="100000000000000000000"
chainId="1"
/>
This displays a transaction that includes both the transaction details and permit authorization for 100 UNI tokens to be spent by a Uniswap router.
Last updated