components/field

Import

Import

import * as api from "@fungi.computer/caps/components/field";

Exports

Kind	Export	Description
Ttype alias	FormFooterProps	Props accepted by FormFooter.
Ttype alias	FormProps	Props accepted by Form.
Ttype alias	FormSectionProps	Props accepted by FormSection.
Ttype alias	FieldSetProps	Props accepted by FieldSet.
Ttype alias	FieldProps	Props accepted by Field.
Ttype alias	NumberFieldProps	Props accepted by NumberField.
constconstant	Form	A form with Caps’ field rhythm. While busy, its fieldset disables every control and the form reports aria-busy; validation stays with the caller.
constconstant	FormSection	A titled group of fields; consecutive sections share one quiet rule.
constconstant	FieldSet	A legend-named group of related choices, such as a list of inline checkbox Fields. disabled disables every control inside.
constconstant	Field	A labelled form-field layout that renders caller-provided control and supporting content.
constconstant	NumberField	A number spinbutton: a native input type="number" between − and + keys, with the value as a mono readout. Field wires its label, description and error to the input. The caps-number-field-* parts are stable so a context such as a Screen can redraw them; the semantics stay here.
fnfunction	FieldError()	An announced error that takes no space when absent and collapses smoothly.
fnfunction	FormFooter()	A form’s stationary action area. Put exactly one primary Button last; every other action is ghost or outline.

FormFooterPropsTtype alias

Signature

type FormFooterProps = object & HTMLAttributes<HTMLElement>;

Props accepted by FormFooter.

Type Declaration

Name	Type	Description
error?	ReactNode	The submit-time error, announced above the actions.
layout?	"end" | "stretch"	end right-aligns actions; stretch stacks full-width actions for single-column cards.
status?	ReactNode	Quiet state opposite the actions (role=“status”), such as a Status LED reading “Saved”.
divider?	boolean	Draws the rule above the footer; short inline forms leave it off.

---

FormPropsTtype alias

Signature

type FormProps = object & FormHTMLAttributes<HTMLFormElement>;

Props accepted by Form.

Type Declaration

Name	Type	Description
busy?	boolean	Disables every control while a submission is in flight.

---

FormSectionPropsTtype alias

Signature

type FormSectionProps = object & Omit<HTMLAttributes<HTMLElement>, "title">;

Props accepted by FormSection.

Type Declaration

Name	Type	Description
title	ReactNode	-
description?	ReactNode	-
level?	2 | 3 | 4	Heading level inside the page outline.
children	ReactNode	-

---

FieldSetPropsTtype alias

Signature

type FieldSetProps = object & FieldsetHTMLAttributes<HTMLFieldSetElement>;

Props accepted by FieldSet.

Type Declaration

Name	Type	Description
legend	ReactNode	-
description?	ReactNode	-
error?	ReactNode	The group’s announced error, such as “Choose at least one right”.
children	ReactNode	-

---

FieldPropsTtype alias

Signature

type FieldProps = object & HTMLAttributes<HTMLDivElement>;

Props accepted by Field.

Type Declaration

Name	Type	Description
children	ReactNode	-
description?	ReactNode	-
error?	ReactNode	-
icon?	ReactNode	A decorative marker, such as a Sigil or App icon, before the label. It is hidden from assistive tech; the label stays the control’s name.
label?	ReactNode	-
orientation?	"horizontal" | "inline" | "vertical"	vertical stacks label, control and error; horizontal puts the control opposite its copy (settings rows); inline puts a checkbox or switch before its copy.
optional?	boolean	Marks an optional field in a mostly required form.
readout?	boolean	The child is a read-only readout, such as a Status, not a control: the label names the row and nothing is wired to the child.
required?	boolean	-

---

NumberFieldPropsTtype alias

Signature

type NumberFieldProps = object &
  Omit<
    InputHTMLAttributes<HTMLInputElement>,
    "defaultValue" | "max" | "min" | "onChange" | "step" | "type" | "value"
  >;

Props accepted by NumberField.

Type Declaration

Name	Type	Description
value?	number | null	Controlled value; null is empty.
defaultValue?	number | null	-
onValueChange()?	(value) => void	Called with each committed value, already clamped to min/max.
min?	number	-
max?	number	-
step?	number	Arrow keys and the − / + keys move by step; Page Up/Down by ten steps.
unit?	ReactNode	A short unit readout after the value, such as “min” or “GB”.
wrap?	boolean	Cycle from max back to min (and back) instead of stopping at the ends.
invalid?	boolean	-
decrementLabel?	string	Accessible names for the − / + keys.
incrementLabel?	string	-

Formconstconstant

Signature

const Form: ForwardRefExoticComponent<
  object & FormHTMLAttributes<HTMLFormElement> & RefAttributes<HTMLFormElement>
>;

A form with Caps’ field rhythm. While busy, its fieldset disables every control and the form reports aria-busy; validation stays with the caller.

---

FormSectionconstconstant

Signature

const FormSection: ForwardRefExoticComponent<
  object &
    Omit<HTMLAttributes<HTMLElement>, "title"> &
    RefAttributes<HTMLElement>
>;

A titled group of fields; consecutive sections share one quiet rule.

---

FieldSetconstconstant

Signature

const FieldSet: ForwardRefExoticComponent<
  object &
    FieldsetHTMLAttributes<HTMLFieldSetElement> &
    RefAttributes<HTMLFieldSetElement>
>;

A legend-named group of related choices, such as a list of inline checkbox Fields. disabled disables every control inside.

---

Fieldconstconstant

Signature

const Field: ForwardRefExoticComponent<
  object & HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>
>;

A labelled form-field layout that renders caller-provided control and supporting content.

---

NumberFieldconstconstant

Signature

const NumberField: ForwardRefExoticComponent<
  object &
    Omit<
      InputHTMLAttributes<HTMLInputElement>,
      "defaultValue" | "onChange" | "type" | "value" | "max" | "min" | "step"
    > &
    RefAttributes<HTMLInputElement>
>;

A number spinbutton: a native input type="number" between − and + keys, with the value as a mono readout. Field wires its label, description and error to the input. The caps-number-field-* parts are stable so a context such as a Screen can redraw them; the semantics stay here.

FieldError()fnfunction

Signature

function FieldError(__namedParameters): Element;

An announced error that takes no space when absent and collapses smoothly.

Parameters

Parameter	Type
__namedParameters	HTMLAttributes<HTMLDivElement>

Returns

Element

---

FormFooter()fnfunction

Signature

function FormFooter(__namedParameters): Element;

A form’s stationary action area. Put exactly one primary Button last; every other action is ghost or outline.

Parameters

Parameter	Type
__namedParameters	FormFooterProps

Returns

Element