Input
Input Component
Playground
Props
| Prop | Type | Default | Value |
|---|---|---|---|
| size | selectsm | md | lg | — | |
| variant | selectdefault | error | success | — | |
| placeholder | text | — | |
| disabled | boolean | — |
Default
WithLabel
WithError
Please enter a valid email
WithHelper
Must be 3-20 characters
Disabled
Password
Search
FullWidth
Sizes
ErrorState
Username is already taken
| PROP | TYPE | DEFAULT | DESCRIPTION |
|---|---|---|---|
disabled | boolean | — | Disabled state |
placeholder | text | — | Placeholder text |
size | select | — | Input size |
variant | select | — | Validation state |
Using Inputtsx
import { Input } from '@/components/Input'
<Input
size="..."
variant="..."
placeholder="..."
disabled="..."
/>Tokens Used
No design tokens detected