ObjectField

Form field component to handle object type values.

Props

PropTypeDefaultDescription
namerequiredTNameThe field name
childrenstring | number | bigint | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | Promise<...>
columnsResponsiveValue<number>
direction"row" | "column"Whether the label is positioned vertically or horizontally
helpstringField help text
hideLabelbooleanHide the field label
isDisabledbooleanfalseIf true, the form control will be disabled. This has 2 side effects: - The FormLabel will have `data-disabled` attribute - The form element (e.g, Input) will be disabled
isInvalidbooleanfalseIf true, the form control will be invalid. This has 2 side effects: - The FormLabel and FormErrorIcon will have `data-invalid` set to true - The form element (e.g, Input) will have `aria-invalid` set to true
isReadOnlybooleanfalseIf true, the form control will be readonly
isRequiredbooleanfalseIf true, the form control will be required. This has 2 side effects: - The FormLabel will show a required indicator - The form element (e.g, Input) will have `aria-required` set to true
labelstringThe field label
placeholderstringThe input placeholder
rulesOmit< RegisterOptions<FieldValues, string>, "disabled" | "setValueAs" | "valueAsDate" | "valueAsNumber" >React hook form rules
spacingResponsiveValue<string | number>
typestringBuild-in types: text, number, password, textarea, select, native-select, checkbox, radio, switch, pin Will default to a text field if there is no matching type.

Was this helpful?