edbnedbn/ui
Get Started
WelcomeWhy We're DifferentChoosing a VariantChangelogLicense
Components
OverviewAlert DialogCheckboxCollapsibleDialogField
InputMenuNumber FieldPopoverProgressRadioScroll AreaSelectSeparatorSliderSwitchTabsToggleTooltip
Shared Components
InputTextareaCardAvatarTableAlertBreadcrumbPagination
0installs
Components
Maps
GitHub stars
HomeDocsComponentsStaticField

On this page

Field

A form field component with label, description, and error handling. Built on Base UI Field primitives.

We'll never share your email.

Usage

import {
  FieldRoot,
  FieldLabel,
  FieldControl,
  FieldDescription,
  FieldError,
} from "@/components/ui/static/field"
<FieldRoot>
  <FieldLabel>Email</FieldLabel>
  <FieldControl type="email" placeholder="Enter your email" />
  <FieldDescription>We'll never share your email.</FieldDescription>
  <FieldError>Please enter a valid email.</FieldError>
</FieldRoot>

Installation

Install dependencies

TypeScript
npm install @base-ui/react

Examples

With Error State

Registration Form

Create Account

This will be your username.

Must be at least 8 characters.

States

API Reference

namestring

The name of the field for form submission.

invalidboolean
=false

Whether the field is in an invalid state.

disabledboolean
=false

Whether the field is disabled.

requiredboolean
=false

Whether the field is required.