Form

Form controls, wrappers, and validation support.

Architecture

zk-form                  ← <form> wrapper (CSRF, method spoofing, enctype auto-detection)
  zk-fieldset            ← <fieldset> + optional <legend>
    zk-input             ← base input — all typed inputs delegate to this
    zk-textarea          ← <textarea>
    zk-select            ← <select> with optgroup support
    zk-checkbox          ← <input type="checkbox">
    zk-switch            ← styled checkbox (delegates to zk-checkbox)
    zk-password          ← <input type="password"> with optional show/hide toggle
    zk-button            ← <button>
    zk-submit            ← <button type="submit"> (delegates to zk-button)
    zk-reset             ← <button type="reset"> (delegates to zk-button)
  zk-field               ← field wrapper (.field div + error class)
  zk-label               ← <label> with icon/prefix/suffix support
  zk-additional          ← supporting text + character counter
  zk-hidden              ← <input type="hidden"> (no field wrapper)
  zk-datalist            ← <datalist> element

Typed Input Shorthands

These components are thin wrappers around zk-input with type pre-set. They accept all zk-input props.

Component	Type	Notes
color	color
date	date
datetime	datetime-local
email	email	Adds browser-side pattern from config
file	file
month	month
multi-select	x-zk-multi-select	<select multiple>
number	number
range	range
search	search
tel	tel
time	time
url	url
week	week

All Components

Component	Alias	Description
additional	—	Supporting text and character counter
button	x-zk-button	<button> element
checkbox	x-zk-checkbox	<input type="checkbox">
color	x-zk-color	<input type="color">
datalist	x-zk-datalist	<datalist> element
date	x-zk-date	<input type="date">
datetime	x-zk-datetime	<input type="datetime-local">
email	x-zk-email	<input type="email">
field	—	Field wrapper div with error support
fieldset	x-zk-fieldset	<fieldset> + legend
file	x-zk-file	<input type="file">
form	x-zk-form	<form> with CSRF and method spoofing
hidden	x-zk-hidden	<input type="hidden">
input	x-zk-input	Base input — all types
label	—	<label> with icon/prefix/suffix
month	x-zk-month	<input type="month">
number	x-zk-number	<input type="number">
otp	x-zk-otp	One-time code field
password	x-zk-password	<input type="password"> with toggle
radio	x-zk-radio	<input type="radio">
range	x-zk-range	<input type="range">
rating-input	x-zk-rating-input	Stars to choose a rating
reset	x-zk-reset	<button type="reset">
search	x-zk-search	<input type="search">
select	x-zk-select	<select> with optgroup support
submit	x-zk-submit	<button type="submit">
switch	x-zk-switch	Styled checkbox
tel	x-zk-tel	<input type="tel">
textarea	x-zk-textarea	<textarea>
time	x-zk-time	<input type="time">
url	x-zk-url	<input type="url">
week	x-zk-week	<input type="week">