Form — Design System

Props

The full prop API for Form. Same surface in web and React Native — bundlers pick the right variant via the react-native export condition.

Prop	Type	Default	Description	Since
`form`	`FormApi`	—	Return value of useForm(). Required for all integrated fields.	0.6.0
`name`	`string`	—	Field name matching defaultValues keys. Required.	0.6.0
`label`	`string`	—	Visible label text. Required.	0.6.0
`description`	`string`	—	Helper text rendered below the control.	0.6.0
`required`	`boolean`	`false`	Renders asterisk and sets aria-required.	0.6.0
`disabled`	`boolean`	`false`	Disables the control.	0.6.0
`validators`	`FormFieldValidators`	—	onChange, onBlur, and onChangeAsync validators.	0.6.0
`placeholder`	`string`	—	Placeholder text for FormInput, FormSearchField, FormTextarea, FormSelect, FormCombobox, FormDatePicker, and FormDateRangePicker.	0.6.0
`options`	`FormSelectOption[] \| ComboboxOption[] \| RadioCardOption[]`	—	Option arrays for FormSelect, FormCombobox, and FormRadioCardGroup.	0.13.0
`items`	`readonly string[]`	—	CheckboxGrid item list. FormCheckboxGrid only.	0.13.0
`triggerWidth`	`'auto' \| 'full'`	—	Date range trigger width. FormDateRangePicker only.	0.13.0
`monthsShown / calendarProps`	`number \| CalendarProps`	—	Multi-month and DayPicker pass-through controls for FormDateRangePicker, including defaultMonth, captionLayout, and numberOfMonths.	0.13.0
`accept / maxFiles / maxSize / validator`	`Dropzone props`	—	File acceptance and validation controls. FormDropzone only.	0.13.0
`renderField`	`(props: { index, total, remove }) => ReactNode`	—	Render function for each array item. FormFieldArray only.	0.6.0
`selector`	`(state: FormState) => TSelected`	—	State selector function. FormSubscribe only.	0.6.0
`listeners`	`{ onChange?, onBlur? }`	—	Side-effect listeners for dependent fields. FormListenEffect only.	0.6.0
`submitLabel`	`string`	`'Submit'`	Submit button label. FormActions only.	0.6.0
`showReset`	`boolean`	`true`	Show reset button. FormActions only.	0.6.0
`className`	`string`	—	Additional Tailwind classes on the FormItem wrapper.	0.6.0

Import

import { useForm, FormInput, FormSelect, FormActions } from '@mihcm/ui/Form';