Input

A text input field with multiple sizes and validation states.

Import


import { Input } from '@grannyshot/ui'


<Input placeholder="Enter your name" />


<Input size="sm" placeholder="Small" />
<Input size="md" placeholder="Medium" />
<Input size="lg" placeholder="Large" />


<Input state="error" placeholder="Error state" />
<Input state="success" placeholder="Success state" />


<Input disabled placeholder="Disabled input" />

Prop	Type	Default	Description
`size`	`'sm' \| 'md' \| 'lg'`	`'md'`	Input size
`state`	`'default' \| 'error' \| 'success'`	`'default'`	Validation state
`placeholder`	`string`	—	Placeholder text
`disabled`	`boolean`	`false`	Disabled state
`className`	`string`	—	Additional CSS classes

Extends all native <input> HTML attributes.