Form / foldkit-mixins-form/recipes

Field

const · packages/mixins-form/src/recipes.ts:43

const Field: SlotRecipe<Contract<{ readonly root: UnnamedSlot<Capability<"Container", readonly [Capability<"Interactive", readonly [Capability<"Base", readonly []>]>]>, readonly EventName[], readonly AttributeName[], readonly RequirementName[], boolean>; readonly label: UnnamedSlot<Capability<"Base", readonly []>, readonly EventName[], readonly AttributeName[], readonly RequirementName[], boolean>; readonly description: UnnamedSlot<Capability<"Base", readonly []>, readonly EventName[], readonly AttributeName[], readonly RequirementName[], boolean>; readonly error: UnnamedSlot<Capability<"Base", readonly []>, readonly EventName[], readonly AttributeName[], readonly RequirementName[], boolean>; readonly checking: UnnamedSlot<Capability<"Base", readonly []>, readonly EventName[], readonly AttributeName[], readonly RequirementName[], boolean>; readonly text: UnnamedSlot<Capability<"TextInput", readonly [Capability<"Focusable", readonly [Capability<"Interactive", readonly [Capability<"Base", readonly []>]>]>]>, readonly [EventToken<"input">, EventToken<"blur">], readonly [AttrToken<"aria-invalid">, AttrToken<"aria-describedby">], readonly RequirementName[], boolean>; readonly multiline: UnnamedSlot<Capability<"TextInput", readonly [Capability<"Focusable", readonly [Capability<"Interactive", readonly [Capability<"Base", readonly []>]>]>]>, readonly [EventToken<"input">, EventToken<"blur">], readonly [AttrToken<"aria-invalid">, AttrToken<"aria-describedby">], readonly RequirementName[], boolean> …;

A field: its label over its control, then what it says about it, in a grid, which stretches a control with no width of its own and leaves a checkbox its size. A failure reads in the error's ink; a choice of many is a row a finger's height, its box beside its words.

In the guides