Forms

What works like native fields

• name puts the value into FormData. Components with several values (kern-select multiple, kern-file-input multiple) add one entry per value.
• required blocks submitting while empty; form.reset() restores the initial value; a disabled <fieldset> disables the fields until it is enabled again, without changing their own disabled.
• kern-button type="submit" / type="reset" submit or reset the surrounding form.
• Enter in a single-line field submits the surrounding form (implicit submission).

Enter submits

The native input of a Kern field sits in the shadow DOM and belongs to no form, so the field submits the form itself on Enter, as the browser does for native fields. This applies to kern-input, kern-ip-input, kern-mac-input, kern-step-input, kern-date-picker, kern-date-range-picker, kern-time-picker and kern-color-picker.

• Typed fields first apply the text (192.168.1.10 - 50 → 192.168.1.10-192.168.1.50), so the form gets the current value and validity.
• Like the browser, the field clicks the form's first submit button in document order (also <input type="image"> and buttons tied to the form with form="…"), or calls requestSubmit() when there is none. Validation runs and submit fires; a disabled or busy submit button blocks it.
• No submit with a modifier key (Shift, Ctrl, Alt, Meta), when the field is disabled or readonly, outside a form, or when a keydown listener called preventDefault(). The submit is the default action of the key, so a listener on the field, the form or the document can still stop it.
• With an open list (kern-input suggestions, a picker's popover) Enter takes the suggestion or closes the list; the next Enter submits.
• no-implicit-submit turns it off for one field, e.g. when the field uses Enter itself. kern-textarea keeps Enter for a new line.

Errors

Set error to show a message. A field with error is invalid and blocks submitting until the message is removed. Typed fields (dates, IPs, MACs, numbers, colours) also report their own problems, e.g. «Not a valid IPv4 address».

kern-input passes the native checks to the form: required, type="email" / "url", pattern, maxlength and min / max / step for numbers. An invalid value blocks submitting. Like :user-invalid, the browser's message («Please enter an email address») shows only after the value was changed or a submit failed; correcting the value removes it and form.reset() hides it again. error wins over native problems.

Events

• kernChange with { value }: the value was applied. For typed fields this is on Enter or when leaving the field; for controls on every change.
• kernInput: on every keystroke or while dragging (where offered).

Normalised values

Typed fields accept several notations and store one: kern-ip-input («192.168.1.10 - 50» → 192.168.1.10-192.168.1.50), kern-mac-input (any notation → C8:2B:96:1A:3F:00), kern-date-picker (locale text → ISO 2026-10-19), kern-color-picker (#3CC → #33cccc).

Angular

The generated value accessors connect ngModel and reactive forms: text accessor for most fields, number accessor for kern-rating and kern-step-input, boolean accessor for kern-switch and kern-checkbox. kern-file-input has none; use (kernChange).