Composants
Formulaires
Vous venez ici pour saisir et valider des données : un champ, un choix, une date, un formulaire entier.
- Règle du responsable
- Chaque champ parle le contrat d'étiquette, d'erreur et de description de Field.
- Budget de taille
- 203.0 kB gzip pour tout le domaine ; il ne fait que baisser.
Entrées
15 entrées, dont 13 utilisées par des produits et sites en production. Les entrées expérimentales viennent en dernier : elles peuvent changer ou disparaître à toute version mineure.
- FieldA form field: a label, a hint and an error around an
Input, aTextareaor a nativeSelect.42 fichiers l'importent - CheckboxA box to check: checked, unchecked or indeterminate, with its words as one clickable label.7 fichiers l'importent
- Choice gridA 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 fichiers l'importent
- ComboboxA 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 fichiers l'importent
- Date pickerDates 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 fichiers l'importent - Filter barThe 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 fichiers l'importent
- FormA 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 fichiers l'importent
- OTP inputA one-time code in boxes over one real input: the keyboard's suggestion of the code and pasting fill every box at once.
- Radio groupOne choice among a few options, all visible: dots with their words, whole cards, tactile keys that press in, or a segmented control.9 fichiers l'importent
- Search fieldA search box: a clear button, a global ⌘K / Ctrl+K shortcut, a debounced
onSearch, Enter to submit, and suggestions with the keyboard.9 fichiers l'importent - SliderA 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 fichiers l'importent
- SwitchAn on/off setting that applies at once.19 fichiers l'importent
- Tag inputFree words as removable chips — Enter or a comma adds one, a paste adds several, suggestions complete,
normalizecleans andvalidaterefuses with a reason.1 fichiers l'importent - Tag selectorInterests, languages, a workspace's tags: toggle chips with a limit and a count — the others rest once the limit is reached. With a
markeran option is a tag with its colour;creatableadds a field where Enter takes the tag typed or creates it.4 fichiers l'importent - Schema formA 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).