Vite App

Example 1: Basic example

todo: some description

String 1*

Number 1

Yes-no 1YES

Yes-no 2NO

Select 1

Text 1

{
  "number1": 99,
  "boolean1": true,
  "boolean2": false
}

Example 2: String input

todo: some description

string1

With title set

With require*

With placeholder

With default

With value passed

With values combo

{
  "string6": "sample value exists",
  "string7": "sample 3",
  "string5": "TODO"
}

Example 3: Numeric input

todo: some description

number1

With title set

With require*

With placeholder

With default

With value passed

With min/max/step

{
  "number6": 123,
  "number5": 99,
  "number7": 20
}

Example 4: boolean input (checkbox)

todo: some description

boolean1NO

With titleNO

With defaultYES

With valueYES

{
  "boolean4": true,
  "boolean1": false,
  "boolean2": false,
  "boolean3": true
}

Example 5: text input (textarea)

todo: some description

text1

With title

With require*

With placeholder

With default

With value passed

{
  "text6": "Excepteur do ut amet duis duis officia incididunt commodo exercitation laborum qui. Do adipisicing tempor sint voluptate pariatur tempor. Dolore amet irure ut quis aliqua eiusmod. Ullamco occaecat elit incididunt aliquip consectetur veniam deserunt ad nisi excepteur consectetur consequat.",
  "text5": "Some preset text"
}

Example 6: select

todo: some description

select1

With title

With required*

With placeholder

With default

With value passed

With includeBlank

Collection [text, value]

Collection {text, value}

Conflict value

Blank collection

Single item

{
  "select6": "4",
  "select10": "-1",
  "select5": "3",
  "select8": "5"
}

[Hash] Example 1: nested object

todo: some desc

String 1*

Object 1

Nseted Title

Nested Counter

Some CheckYES

{
  "object1": {
    "count": 5,
    "is_visible": true
  }
}

[Hash] Example 2: typed object

Should allow to select object type

Simple line*

{
  "type": "line"
}

[Hash] Example 3: typed object with value & defaults

TODO: some description

Title*

Count

Is shownYES

{
  "type": "combo",
  "title": "lorem ipsum dolor sit amet",
  "count": "123456789",
  "is_visible": true
}

[List] Example 1: simple list

todo: some description

List 1

Title

count

Is VisibleYES

Title

count

Is VisibleNO

{
  "list1": [
    {
      "title": "Some title",
      "count": 1,
      "is_visible": true
    },
    {
      "title": "Some other title",
      "count": 999,
      "is_visible": false
    }
  ]
}

[List] Example 2: fixed simple list

todo: some description

List 1

Title

count

Is VisibleYES

Title

count

Is VisibleNO

{
  "list1": [
    {
      "title": "Some default title",
      "count": 5,
      "is_visible": true
    },
    {
      "count": -99,
      "is_visible": false
    }
  ]
}

[List] Example 3: deep nesting

todo: some description

object

text

level2

text

level3

text

{
  "object": [
    {
      "level2": [
        {
          "level3": [
            {
              "text": "item 1"
            },
            {
              "text": "item 2"
            }
          ]
        }
      ]
    }
  ]
}

[List] Example 4: typed list

todo: some description

items

Simple line*

Combo 2

Title*

Description

Combo 2

Title*

Description

{
  "items": [
    {
      "value": "Some predefined line",
      "type": "line"
    },
    {
      "title": "Some predefined line 1",
      "description": "Example description",
      "type": "combo2"
    },
    {
      "title": "Some predefined line",
      "type": "combo2"
    }
  ]
}

[Complex] Example: 1

Witch multiple objects & lists & with existing value

String 1*

Number 1

Yes-no 1NO

Yes-no 2YES

Select 1

Select 2

Select 3

Text 1

Text 2

Object 1

title

count

is_visibleYES

List 1

List 2

title

count

is_visibleYES

Title

List 3

value

title

count

is_visibleYES

title

count

is_visibleYES

title

count

is_visibleNO

{
  "string1": "dsadsadas",
  "number1": "12",
  "boolean1": false,
  "boolean2": true,
  "select2": "2-2",
  "select3": "3-2",
  "text1": "todo",
  "text2": "some",
  "object1": {
    "title": "obobobobobo!!!",
    "count": "4",
    "is_visible": true
  },
  "list2": [
    {
      "title": "dsasdadsa",
      "count": 10,
      "is_visible": true,
      "type": "hash"
    },
    {
      "value": "SOme else",
      "type": "title"
    }
  ],
  "list3": [
    {
      "value": "Some Title 1",
      "type": "textline"
    },
    {
      "value": "Some Description 2",
      "type": "textline"
    },
    {
      "title": "Item 123456789",
      "count": 555555,
      "is_visible": true,
      "type": "item"
    },
    {
      "title": "Item 2",
      "count": "99",
      "is_visible": true,
      "type": "item"
    },
    {
      "title": "Item 3",
      "count": 5,
      "is_visible": false,
      "type": "item"
    }
  ]
}