Input
Text, password, search and file fields in four sizes.
Installation
npx yolkui add inputSizes
The same four heights as Button, so a field and a button line up.
xs
sm
default
lg
Pill
shape="pill", the same as the pill Button, with more end padding.
xs
sm
default
lg
States
Rest, filled, invalid, disabled and read-only. Pair an invalid field with FieldError: red is never the only signal.
Web form fields
The fields a sign-up or checkout form needs, with labels, hints, units and inline actions.
We won’t spam you, we promise :)
We won’t spam you, we promise :)
That’s not a valid email address
File
Our own translatable text over the native input: pick, drop a file on it, or remove it. Text, sizes, shape and right to left are props.
0 files in state