09 Ful Form associated elements

<ful-input>

The <ful-input> component encapsulates a standard operational input wrapper capable of managing single-line data vectors or paragraph summaries (textarea). It sets formAssociated = true and binds form element internals (attachInternals) to ensure native visibility and accessibility within parent ful-form boundaries.

🧩 Component slots

Slot	Description
default	Populates the text content inside the primary label descriptor component.
info	Container slot next to the label for auxiliary validation information, tooltips, or symbols.
ibefore / iafter	Form group prefix / suffix block wrapped within bootstrap-style .input-group-text containers.
before / after	Unstyled raw injection container position sitting explicitly before / after the input control.

⚙️ Attributes:

Attribute	Type	Default	Description
type	"text" / "texarea"	"text"	Determines the underlying control variant. If explicit string "textarea" is supplied, a textarea tag renders; otherwise, an input type="..." pattern is deployed.
value	String	null	Evaluated observed value tracking attribute. Returns null when underlying fields are blank.
readonly	Presence	false	Toggles the native readOnly parameter on internal form inputs and reflects state configurations visually onto the host component.
required	Presence	false	Attaches structural validation markers using the aria-required context property mapping layer and reflects state variables on the host.
mask	String	undefined	A global regular expression character pattern. On input interactions, matches are stripped globally (using a global RegExp configuration) to filter character streams dynamically while preserving cursor placement ranges.

✨ Events

Name	change
Type	sync
Trigger	Fires immediately when the internal input or textarea element experiences a native modification commit.
Detail	{ value: String | null }
Cancelable	no

<ful-input-local-date>

⚙️ Attributes

Attribute	Type	Default	Description
value	String (iso local date)
readonly	Presence	false	Toggles the native readOnly parameter on internal form inputs and reflects state configurations visually onto the host component.
required	Presence	false	Attaches structural validation markers using the aria-required context property mapping layer and reflects state variables on the host.
min	String (iso local date) / offset	null	the min selectable LocalDate
max	String (iso local date) / offset	null	the max selectable LocalDate
step	int	null	Proxies native input step sizing rules

Offsets

The min and max property setters accept absolute ISO strings (YYYY-MM-DD) or offsets from now using the format sign-offset-unit:

• "now" : Resolves dynamically to the client browser's current date.
• "+2d" / "-5d" : Shifts the calculated boundary limit forward or backward by X days.
• "+1m" / "-3m" : Shifts the boundary parameter relative to calendar months.
• "+1y" / "-10y" : Alters the initialization thresholds relative to calendar years.

<ful-input-local-time>

<ful-input-instant>

⚙️ Attributes

Attribute	Type	Default	Description
value	String (iso instant)
readonly	Presence	false	Toggles the native readOnly parameter on internal form inputs and reflects state configurations visually onto the host component.
required	Presence	false	Attaches structural validation markers using the aria-required context property mapping layer and reflects state variables on the host.
min	String (iso instant)	null	the min selectable Instant
max	String (iso instant)	null	the max selectable Instant
step	int	null	Proxies native input step sizing rules

<ful-input-file>

🧩 Component slots

Slot	Description
default	Populates the main outer field descriptor label.
info	Renders metadata markup properties adjacent to the primary field label.
ibefore / iafter	Standard layout elements forwarded directly to surround the file selection group.
before / after	Standard layout elements forwarded directly to surround the file selection group.
dropzone	Optional custom layout overlay for the drag-and-drop area. If this slot is completely empty, the element automatically injects a default-dropzone container using the translated text corresponding to 'dropzonelabel'.

⚙️ Attributes

Attribute	Type	Default	Description
value	String		The evaluated field representation.
readonly	Presence	false	Toggles the element's user interactivity state.
required	Presence	false	Applies standard validation requirements to the field control.
accept	CSV	null	A comma-separated string filtering valid file extensions. Setters internally assign this parameter directly down onto native input structures.
multiple	Presence	false	Enables selecting multiple files concurrently.
itemlist	Presence	false	Toggles the display list tracking nodes underneath active selectors.
dropzone	Presence	false	Toggles the presence of the drag-and-drop area.
maxfiles	Number	null	The maximum number of files allowed in the collection.
maxfilesize	Number	null	The maximum byte limit allowed for an individual file.
maxtotalsize	Number	null	The cumulative maximum byte limit allowed across all attached files combined.

<ful-radio-group>

🧩 Component slots

Slot	Description
default	The main workspace slot area. It should contain one or more placeholder tags. The text content inside each element is extracted as its visible text label, while the attributes on are applied directly onto the corresponding native radio button. The text content of the primary label is injected inside a native at the top.
header	An optional layout template region injected within a native block positioned directly below the legend.
footer	An optional layout template region injected within a native block positioned at the absolute bottom of the fieldset container.

⚙️ Attributes

Attribute	Type	Default	Description
value	String	null	The initialized value or matching state selector configuration string.
readonly	Presence	false	Toggles the read-only behavior of the group.
required	Presence	false	Flags the group requirement parameters to the wrapping fieldset layout.
type	String	null	If this attribute is explicitly configured as "boolean", the selection value is cast directly into a true JavaScript boolean type upon extraction instead of standard text string outputs.

<ful-checkbox>

🧩 Component slots

Slot	Description
default	Populates the text description inside the field's interactive element.
info	An optional markup slot positioned directly next to the default label text for tooltips, icons, or secondary descriptions.

⚙️ Attributes

Attribute	Type	Default	Description
type	"switch" / "check"	"check"	Controls the visual rendering style of the component
value	bool	false	Observed attribute that maps directly to the checkbox's binary check state. The library's compiler evaluates and parses this parameter as a true JavaScript boolean type.
readonly	Presence	false	Observed presence attribute that freezes user toggle interactions.
required	Presence	false	Observed presence attribute that denotes form constraint requirements.