Components

Input

Native inputs with an accessible, familiar foundation.

Preview

Usage

import { Input, Label } from '@fwenthehunter/friendly-ui';

<Label htmlFor="email">Email</Label>
<Input id="email" name="email" type="email"
  autoComplete="email" placeholder="you@example.com" />

Accepts native input props, including type, name, required, disabled, and defaultValue. Pair each field with a label using matching htmlFor and id values.

For errors, set aria-invalid and connect explanatory text with aria-describedby. Placeholders do not replace labels. Controlled values and onChange callbacks belong inside a client wrapper.

Props

Components accept native HTML props, className, and style. Server-compatible primitives also forward React 19 refs; Modal manages its own dialog ref.