Field

Composable form field wrapper combining a label, input, and validation message.

Examples

A simple form field with label and input.

Full name

Field marked as required with an asterisk indicator.

Email address

Field with inline validation error message.

Username

Username must be at least 3 characters.

Field with helper description text below the input.

API Key

Your API key is stored encrypted and never shared.

pnpm add @rokle/components @rokle/tokens

Installs with the default Rokle brand. Generate a custom brand on rokle.app to use your own colours and personality.

import { Field } from "@rokle/components";

import { Field } from "@rokle/components";

export function Example() {
  return <Field />;
}

Prop	Type	Default	Description
label	string	-	Field label text.
error	string	-	Validation error message.
required	boolean	false	Show required indicator on label.
children	ReactNode	-	The input element.