shadcn.io is not affiliated with official shadcn/ui
Function Call Web3 Block for Solid
A contract call builder: pick a read or write function of a demo token, fill typed arguments with address and amount checks, and see the encoded calldata, a gas estimate for writes, and a typed read result or a simulated write.
Installation
Overview
Show what a call looks like on the wire before anyone signs it, with this call builder for Solid with Ark UI. It's the tool of Callmoor, which builds calls for a demo token contract. A hairline frame with a plus mark on each corner starts with a Native Select of five functions, two reads and three writes, with a Badge that says which. Its arguments become fields generated from the typed ABI: an address field that wants 0x and 40 hex digits, an amount field with up to 18 decimals and a note of the base units, and a true or false select for a flag. Under it the encoded calldata builds as you type, the 4-byte selector and then one padded 32-byte word per argument, with a Copy Button; an invalid argument is marked in its word. A write adds a gas estimate from a typed formula, and a result row shows what a read returned or a sample hash. The action is one Shine Button: Read answers at once, Simulate write waits a moment and says it was simulated. For wallet tools, developer docs and any app that builds a contract call.
FAQ
How is the calldata built?
The selector is typed in FUNCTIONS. Each argument is turned into a 64-digit word: an address is its 40 digits padded with zeros at the start, an amount is multiplied by 10 to the power of 18 and written in hex, and a flag is 0 or 1. The words are joined after the selector. Fields that don't validate leave their word empty, so the pane says which argument to fix and the copy button stays hidden until the call is whole.
Where does the gas estimate come from?
From a typed formula, not a node: 21,000 for any transaction, 16 for each non-zero calldata byte and 4 for each zero byte, plus what the function itself spends (a typed number per write). It is labelled a sample formula. In your app ask the node (an estimateGas call) with the real sender and block.
What stays local, and how do I wire it?
All of it. Read returns a typed answer from a few invented holders, and Simulate write waits 800 ms in a timer and shows a sample hash that is made up from the call; nothing is signed or sent. In your app replace the read with your provider's call and the timer in run with the wallet's send, and show the real transaction hash.
What do the fields check?
An address must start with 0x and have exactly 40 hex digits; the demo doesn't verify the mixed-case checksum. An amount takes digits with an optional decimal part of at most 18 places and commas are ignored. Empty fields stay quiet until you press the action, then the first invalid one takes focus and the status line says to fix it.
Is it accessible from the keyboard?
Yes. Every field has a label with its type, notes are tied to their fields, the calldata is a named list, the copy button is a real button, and the one polite status line reports each result. The action's busy state keeps its size and the layout does not move when the function changes, because the argument area and the calldata pane hold their height.