Input

Three sizes, plus search and file types.

Installation

npx @noarka/cli add input

tsx

import { Input } from "@noarka/ui";

tsx

<Input type="email" placeholder="you@example.com" />

Sizes

Small, default, and large heights.

Search type with native cancel styling.

File upload

File type with a styled picker button.

Disabled and invalid

Dimmed when disabled, red ring when aria-invalid.

Input

Prop	Type	Default
`size` Height preset, or a number passed to the native width attribute.	`"sm" \| "default" \| "lg" \| number`	`"default"`
`unstyled` Render without the container frame styles.	`boolean`	`false`
`type` Native input type. "search" and "file" get dedicated styling.	`string`	`-`
`placeholder` Hint text shown while empty.	`string`	`-`
`disabled` Disable interaction. Renders dimmed.	`boolean`	`false`
`readOnly` Show value without allowing edits.	`boolean`	`false`
`defaultValue` Initial value when uncontrolled.	`string`	`-`
`value` Controlled value. Use with onChange.	`string`	`-`
`onChange` Called when the value changes.	`(event) => void`	`-`