Field

Label, description and error message around a form control.

FieldProps packages/core/src/form-controls.ts:117 ↗

Import

import { Field } from "@tarve/core";

Usage

Field.tsx

import { Field, Input } from "@tarve/core";

let username = "ad";

<Field
  label="Username"
  description="This is your public display name."
  error={username.length < 3 ? "Use at least 3 characters." : undefined}
  required
>
  <Input
    value={username}
    onChange={(value) => {
      username = value;
    }}
  />
</Field>

Props

Prop	Type	Default
`description`	`string`	—
`disabled`	`boolean`	—
`error`	`string`	—
`label`	`string`	—
`required`	`boolean`	—

Common props

Shared by every component. See descriptions →

childrenhighlightidkeymotionFromonHighlightonPasteonTransitionEndrovingGroupstyle