🔮 Scaffold AlchemyScaffold Alchemy Components

IntegerInput

The document describes an IntegerInput component that validates integer inputs, displays an error for invalid entries, and includes a button to convert the input value to wei by multiplying it by (10^18). It also outlines the component’s import, usage, and available props.

Provides an input field for integer values, validating that user input is a valid integer, and showing error if not. Shows by default a small button to multiply input’s value * 10^18 to transform to wei.

Import

typescript
1import { IntegerInput } from "~~/components/scaffold-eth";

Usage

typescript
1const [txValue, setTxValue] = useState<string | bigint>("");
jsx
1<IntegerInput
2  value={txValue}
3  onChange={updatedTxValue => {
4    setTxValue(updatedTxValue);
5  }}
6  placeholder="value (wei)"
7/>

Props

PropTypeDefault ValueDescription
valuestringundefinedThe data that your input will show.
onChangefunctionundefinedA callback invoked when the amount in the input changes.
placeholder (optional)stringundefinedThe string that will be rendered before input data has been entered.
name (optional)stringundefinedHelps identify the data being sent if InputBase is submitted into a form.
error (optional)booleanfalseWhen set to true, changes input border to have error styling.
disabled (optional)booleanfalseWhen set to true, changes input background color and border to have disabled styling.