An accessible fieldset component that groups related form controls with a legend and optional help text. Uses the Label component with tagName="legend" for consistent styling and HelpText for accessible descriptions via aria-describedby.

Parameters:
NameTypeDescription
propsobject

Component props.

Properties
NameTypeDescription
childrenJSX.Element

React element children (form controls).

customAttributesobject

Custom attributes for the fieldset element.

customClassesstring | Array | object

Custom classes for the fieldset element.

disabledboolean

Whether the fieldset is disabled.

helpTextAttributesobject

Attributes for the optional HelpText component.

helpTextCustomClassesstring | Array | object

Custom classes for the HelpText component.

helpTextPositionstring

The position of the help text, 'above' or 'below' (default: 'below').

idstring

Id for the fieldset, auto-generated if not provided.

legendAttributesobject

Attributes for the legend (uses Label component props except htmlFor).

legendCustomClassesstring | Array | object

Custom classes for the legend element.

spacingstring | number | Array | object

The spacing for the component, as a string, number, array, or object.

refobject | null

Ref to the component.

Since
  • 6.1.0
Source
Returns:

The Fieldset component.

Type: 
JSX.Element
Example
import Fieldset from '@gravityforms/components/react/admin/modules/Fieldset';

return (
    <Fieldset
        legendAttributes={ { label: 'Contact Information' } }
        helpTextAttributes={ { content: 'Please fill out all required fields.' } }
    >
        <Input label="First Name" />
        <Input label="Last Name" />
    </Fieldset>
);