Primitives
Input
Text input field with label, hint, error state, and left/right slots for icons.
Installation
npm install @trinkui/reactVariants
States
We'll never share your email.
Password must be at least 8 characters.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
variant | "default" | "filled" | "ghost" | "default" | Visual style variant of the input |
size | "sm" | "md" | "lg" | "md" | Size of the input |
label | string | — | Label text shown above the input |
hint | string | — | Helper text shown below the input |
error | string | — | Error message shown below the input; also applies error styling |
leftSlot | ReactNode | — | Icon or element rendered on the left side of the input |
rightSlot | ReactNode | — | Icon or element rendered on the right side of the input |
fullWidth | boolean | true | Stretch input to fill its container width |
disabled | boolean | — | Disable the input |
className | string | — | Additional CSS classes |