FieldSet
Group related form elements
import { FieldSet } from '@kalidao/reality'
name | type | default |
---|---|---|
description | ReactNode | - |
disabled | boolean | - |
form | string | - |
legend* Required | string | - |
name | string | - |
size | "medium" | "small" | - |
space | ConditionalStyle<Values<MapLeafNodes<{ '0': string; px: string; '0.5': string; '1': string; '1.5': string; '2': string; '2.5': string; '3': string; '3.5': string; '4': string; '5': string; '6': string; '7': string; '8': string; '9': string; '10': string; '11': string; '12': string; ... 28 more ...; none: string; }, ... | 4 |
status | "required" | "optional" | "pending" | "complete" | { name: string; tone: "blue" | "green" | "orange" | "pink" | "purple" | "red" | "violet" | "accent" | "secondary"; } | - |
Uses native fieldset[disabled]
to automatically disable form elements inside.
Notice how the field styles also change inside the FieldSet
depending on the size
.