Form controls

Input

A labeled text input with built-in label, hint, and error slots. Forwards every native HTML attribute, so things like autocomplete, type="number", and min/max work.

Basic

With a hint

Password

At least 12 characters.

Error state

That email doesn't look right.

Described by text elsewhere

describedBy takes the ids of other elements that explain the input, separated by spaces. A screen reader reads them after the input's own hint or error. Use it when the explanation already sits on the page, such as a note above a form or the message a wrapping Field renders, so the text is not written twice.

The domain must point at this instance before it can be saved.

Custom domain

Without the protocol.

Required & disabled

Full name

Username

API

Prop	Type	Default	Description
`value`	`string`	`''`	Bindable input value.
`label`	`string`	no default	Floating label rendered above the input.
`type`	`string`	`'text'`	Native input type.
`placeholder`	`string`	no default	Native placeholder.
`hint`	`string`	no default	Help text shown below the input.
`error`	`string`	no default	Error message. Replaces the hint and reddens the border.
`describedBy`	`string`	no default	Ids of other elements that describe the input, separated by spaces, such as a wrapping Field's message. Read after the input's own hint or error.
`disabled`	`boolean`	`false`	Disable the input.
`required`	`boolean`	`false`	Add a red asterisk to the label.
`id`	`string`	no default	The input's id. Left out, it is a unique generated id. One passed in wins, and it is what a Label's for or a selector should aim at.
`name`	`string`	no default	The form field the value posts under.
`mono`	`boolean`	`false`	Sets the control alone in the monospace face, for a slug, a key or a locale tag.
`class`	`string`	no default	Extra classes on the wrapper.
`noAI`	`boolean`	`false`	Keep the value from an assistant: a FormAssist never reports it or fills it, and the control is marked data-no-ai for a browser agent.

Any other prop (e.g. autocomplete, min, maxlength) is forwarded to the underlying <input>.