TextInput primitive

Lower-level text input primitive with optional adornments.

Use TextInput when you need the styled input control without the label, description, and error slots from TextField.

import { TextInput } from '@luke-ui/react/text-field/primitive';

<TextInput aria-label="Search" placeholder="Search" />;

Adornments

Use adornmentStart and adornmentEnd for non-editable content inside the input chrome.

<TextInput aria-label="Amount" adornmentStart="$" inputMode="decimal" />

Adornments accept any ReactNode. If an adornment is interactive, you are responsible for its semantics and focus behaviour.

Styling hooks

Pass className to style the outer group wrapper. Pass inputClassName to style the input element.

Props