primitives/@mihcm/ui·v0.21.0·stable
Form
Full-featured form system integrated with TanStack React Form v1. Field wrappers include input, search, textarea, checkbox, switch, select, combobox, radio, radio cards, date, date range, checkbox grid, dropzone, field arrays, subscriptions, effects, and actions.
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';