A inputgroup component that wraps checkboxes or radios and handles their state changes as one aggregate.

Parameters:
NameTypeDescription
propsobject

Component props.

Properties
NameTypeDescription
childrenJSX.Element

React element children.

childrenBelowboolean

Render children below or above group if found?

customAttributesobject

Custom attributes for the component.

customClassesstring | Array | object

Custom classes for the component.

dataArray

The data for the inputs.

idstring

The id of the input group.

initialValuestring

The initial value of the input group if input type is radio.

inputTypestring

The input type, one of radio or checkbox.

onChangefunction

On change function handler.

spacingstring | number | Array | object

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

tagNamestring

Tagname for the container.

useWrapperboolean

Whether to use a wrapper around the inputs or not.

wrapperAttributesobject

Custom attributes for the wrapper component.

wrapperTagNamestring

Tagname for the wrapper.

refobject | null

Ref to the component.

Since
  • 1.1.15
Returns:

The InputGroup component.

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

return (
     <InputGroup
         id="setup-wizard-form-types"
         data={ [ { ...input1Data }, { ...input2Data } ] }
         onChange={ () => { handleInputChange(); } }
         useWrapper={ true }
     />
);