Array


Type: array

Aliases: array, list

Array Form State:
{
  "yoArray": [],
  "robots": [],
  "listing": []
}

Associative List


Type: associative-list

Associative List Form State:
{
  "assoc-list": [
    "",
    ""
  ]
}

Boolean


Type: boolean

Aliases: boolean, bool

Boolean Form State:
{
  "likesCookies": false
}

Checkbox Array


Type: checkbox-array

Aliases: checkbox-array, checkbox-list

Checkbox Array Form State:
{
  "colors": [
    "green"
  ],
  "readonly-colors": [
    "green"
  ],
  "colors-alt": []
}

Checkbox Boolean


Type: checkbox-boolean

Aliases: checkbox-boolean, checkbox

Checkbox Boolean Form State:
{
  "readonly-checkbox-boolean": true,
  "checkbox-boolean": true,
  "checkbox": true
}

Code


Type: code

Code Form State:
{
  "code": ""
}

Copy


Type: copy

What the hey? Seriously?
Copy Form State:
{}

Extends


Type: extends

Extends Form State:
{
  "colors": [],
  "moreColors": []
}

Fields


Type: fields

Aliases: fields, fieldset

Grouped fields are the bestest!
Section 1
Section 1 is the best
Section 2
Section 2 is the best
Help for section 2 field 1
Help for section 2 field 2
Fields Form State:
{
  "folder": {
    "type": "folder",
    "name": "",
    "children": []
  },
  "groupedFieldsClassic": {
    "section1Field1": "",
    "section1Field2": "",
    "section2Field1": "",
    "section2Field2": ""
  }
}

Grouped Fields


Type: grouped-fields

Grouped fields are the best!
Section1
Section2
Grouped Fields Form State:
{
  "groupedFields": ""
}

JSON


Type: json

JSON Form State:
{
  "blob": {}
}

Object


Type: object

Aliases: object, dict

Object Form State:
{
  "mapping": {
    "key1": "value1",
    "key2": "value2"
  },
  "dict": {
    "key1": "key1",
    "key2": "key2"
  }
}

Password


Type: password

Password Form State:
{
  "password": ""
}

Pretty Boolean


Type: pretty-boolean

Pretty Boolean Form State:
{
  "likesPrettyCookies": false
}

Pretty Select


Type: pretty-select

Tres colores
Pretty Select Form State:
{
  "size": "S",
  "readonlySize": "S",
  "colors1": "",
  "colors2": "",
  "colors3": "some default value",
  "alphabet": "",
  "loading": "",
  "empty": "",
  "prettyBoolean": "",
  "no-search": "S",
  "section-select": ""
}

Pretty Text


Type: pretty-text

Aliases: pretty-text, pretty-textarea

Group
Pretty Text Form State:
{
  "prettyText": "Hi there {{firstName}} {{lastName}} {{middleName}}.",
  "integerPrettyText": 1,
  "integerPrettyTextGrouped": 1,
  "readonlyPrettyText": "Nah nah you can't edit me",
  "nestedPrettyText": "Hi there {{firstName}} {{lastName}} {{middleName}}.",
  "prettyTextDynamic": ""
}

Select


Type: select

Select Form State:
{
  "mood": ""
}

Single Line String


Type: single-line-string

Aliases: single-line-string, string

help for the single line string field
help for the required name field
Single Line String Form State:
{
  "single-line-string": "",
  "name": "Unknown",
  "readonlyName": "Bob",
  "disabledName": "Robert",
  "path": ""
}

String


Type: string

Aliases: string, text

String Form State:
{
  "string-example": "",
  "note": "",
  "groceries": ""
}

Unknown Field


Component not found for:
{
  "id": "unknown-1",
  "label": "Unknown Field Example",
  "type": "junk-field-type"
}
Unknown Field Form State:
{}