Group

A Group field visually is a button that will open a a collection of fields. A Group field will returned a JSON corresponding to your fields.

Group Field
{
  component: 'group',
  name: 'groupName',
  label: 'Group Field',
  description: 'A group field',
  fields: [
    {
      component: 'text',
      name: 'text-name',
      label: 'Text Field',
    },
    {
      component: 'textarea',
      name: 'textarea-name',
      label: 'Text Area Field',
    },
    {
      component: 'number',
      name: 'number-name',
      label: 'Number Field',
    },
  ]
}

Key

Type

Required

Description

component

string

yes

The name of the field component. (group)

name

string

yes

The name of the field that will be accessible by the cms prop of the component.

label

string

no

A human-readable label for the field.

description

string

no

A short description of the setting scope.

fields

Array<Field>

yes

List of fields you want in the group. All fields are supported.

An example would be if you had a group named author and inside the group, your field names are firstName, lastName, and age. The field would be returned as:

example return of group setting
{
  author: {
    firstName: 'John',
    lastName: 'Doe',
    age: 27
  }
}

Last updated