TextInput

TextInput

Default

Search

import { TextInput } from '@eekodigital/raster';

<TextInput name="query" placeholder="Search…" />

Error state

Email address

<TextInput name="email" type="email" hasError placeholder="name@example.com" />

Disabled

Reference number

<TextInput name="ref" defaultValue="INV-0042" disabled />

TextInputField

Default

Project name

import { TextInputField } from '@eekodigital/raster';

<TextInputField label="Project name" name="name" />

With hint

Project nameUse a short, memorable name.

<TextInputField label="Project name" name="name" hint="Use a short, memorable name." />

With error

EmailError: Please enter a valid email address.

<TextInputField label="Email" name="email" type="email" error="Please enter a valid email address." />

Props

TextInput

Prop	Type	Default	Description
hasError	boolean	false	Applies error styling.
…props	InputHTMLAttributes	—	All native <input> attributes.

TextInputField

Prop	Type	Description
label	string	Visible label text.
hint	string	Optional hint text below the label.
error	string	Validation error message.
…props	InputHTMLAttributes	All native input attributes.