Krizaka UI
Krizaka UI
Components

Forms

You come here to enter and validate data: a field, a choice, a date, a whole form.

Owner rule
Every field speaks the label, error and description contract of Field.
Size budget
203.0 kB gzip for the whole domain; it only goes down.

Entries

15 entries, 13 used by live products and sites. Experimental entries come last: they may change or go in any minor version.

  • FieldA form field: a label, a hint and an error around an Input, a Textarea or a native Select.42 files import it
  • CheckboxBetaA box to check: checked, unchecked or indeterminate, with its words as one clickable label.7 files import it
  • Choice gridBetaA line-up of choices as tiles — a visual, a name, a line: a radio group with roving focus when selectable, a named showcase otherwise; sober by default, a select screen in the arcade flavour.1 files import it
  • ComboboxBetaA text field that suggests and completes — one value or several as chips, from a static list or a server, with values created from what was typed.1 files import it
  • Date pickerBetaDates and times chosen the way the task asks — a calendar, a period with presets, a strip of days, wheels, time slots, a month, a date of birth — as ISO values (2026-10-11, 2026-10, 18:30) the form, the address and the API share, in the locale's own words.2 files import it
  • Filter barBetaThe bar above a list: its saved views, the controls that narrow it, the filters in force as removable chips, “Clear filters”, and the count of results — the state kept by the app, in the address.6 files import it
  • FormBetaA form = a schema (zod 4) + the package's fields, on TanStack Form v1: each error shows once the field is left and goes as soon as it is fixed, in the person's language (i18n keys, never the engine's English), a value can be checked on the server as it is typed, and the server's refusals land under their fields — web and React Native, the same schema.51 files import it
  • OTP inputBetaA one-time code in boxes over one real input: the keyboard's suggestion of the code and pasting fill every box at once.
  • Radio groupBetaOne choice among a few options, all visible: dots with their words, whole cards, tactile keys that press in, or a segmented control.9 files import it
  • Search fieldBetaA search box: a clear button, a global ⌘K / Ctrl+K shortcut, a debounced onSearch, Enter to submit, and suggestions with the keyboard.9 files import it
  • SliderBetaA value or a range chosen by dragging a thumb along a track — steps you can see, the value floating over the thumb, the brand’s gradient, horizontal or vertical — with arrows and Page keys.5 files import it
  • SwitchBetaAn on/off setting that applies at once.19 files import it
  • Tag inputBetaFree words as removable chips — Enter or a comma adds one, a paste adds several, suggestions complete, normalize cleans and validate refuses with a reason.1 files import it
  • Tag selectorBetaInterests, languages, a workspace's tags: toggle chips with a limit and a count — the others rest once the limit is reached. With a marker an option is a tag with its colour; creatable adds a field where Enter takes the tag typed or creates it.4 files import it
  • Schema formExperimentalA form drawn from a JSON Schema: typed fields, the schema's own rules, the words of the language (x-i18n) and the rarely needed fields folded (x-advanced).

On this page