FormsFree

Field

Labelling and validation for a single form control — label, description, and error message.

Usage

Email

We'll never share your email.

bash

npm install @wunderui/react

Then import what you need:

tsx

import {
  Field,
  FieldControl,
  FieldDescription,
  FieldError,
  FieldLabel,
  Fieldset,
  FieldsetLegend,
} from "@wunderui/react"

The form primitives — label, field with description / error, fieldset with legend, submit.

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

A labeled field with a hint that turns into an error as soon as the address has characters it can’t use.

Workspace settings

Workspace address

Your team opens the workspace at app.wunderui.com/wunderui.

Prop	Type	Default
FieldControl render	ReactElement	—
FieldError	shown when the field is invalid	—