Table Input

Table input for arbitrary or structured two-dimensional tabular data.

{
  input: {
    type: 'table', 
    columns: {
      name: 'Name',
      email: 'Email'
    }
  }
}

Input Options

Option	Values	Default	Description
inputType	'text' | 'textarea' | 'visualtext'	'text'	Edit method of the individual cells: single-line plain text, multi-line plain text or WYSIWYG editor.
rows	RowOrColumn	[0, 1000]	How table rows behave.
columns	RowOrColumn	[0, 1000]	How table columns behave.
clearLabel	string	"Tabelle leeren"	The label for the clearing button.

with

type RowOrColumn =
  // Arbitrary number of rows/columns
  | undefined

  // Fixed number of rows/columns
  | number

  // Arbitrary number of rows/columns
  | [lower: number, upper: number]

  // Fixed number of rows/columns referenced by unique keys
  | string[]

  // Fixed number of rows/columns referenced by unique keys and accompanied by user-facing labels in the editor
  | Record<string, string>

Example Configurations and Results

Below are examples of configurations and according outcomes. Results are formatted in a JSON-like way for better readability, "value" being a placeholder for the string held by the cell:

---

Fixed Number of Rows, Fixed Number of Columns

rows: 2

columns: 1

Excerpt of possible results:

• 2x1 table: Nested array, exactly two rows with one cell per row (the only possible result structure):

  [
    ["value"],
    ["value"]
  ]

---

Arbitrary Number of Rows, Restricted Number of Columns

rows: –

columns: [1, 5]

Excerpt of possible results:

• 2x1 table: Nested array, two rows with one cell per row:

  [
    ["value"],
    ["value"]
  ]

• 4x2 table: Nested array, four rows with two cells each:

  [
    ["value", "value"],
    ["value", "value"],
    ["value", "value"],
    ["value", "value"]
  ]

• No table: Empty array, zero rows:

  []

---

Arbitrary Number of Rows, Keyed Columns

rows: –

columns: ['name', 'email', 'address]

Excerpt of possible results:

• 2x3 table: Two rows with a fixed object structure for each:

  [
    {
      name: "value",
      email: "value",
      address: "value"
    },
    {
      name: "value",
      email: "value",
      address: "value"
    }
  ]

---

Arbitrary Number of Rows, Keyed & Labeled Columns

rows: –

columns: { name: 'Name', email: 'Email', address: 'Post address' }

Excerpt of possible results:

• 2x3 table: Two rows with a fixed object structure for each (possible results are exactly the same as for the previous example):

  [
    {
      name: "value",
      email: "value",
      address: "value"
    },
    {
      name: "value",
      email: "value",
      address: "value"
    }
  ]

---

Keyed Rows, Arbitrary Number of Columns

rows: ['primary', 'secondary']

columns: –

Excerpt of possible results:

• 2x3 table: A fixed object structure with an array of three cells for each property:

  {
    primary: ["value", "value", "value"],
    secondary: ["value", "value", "value"]
  }

---

Keyed Rows, Keyed Columns

rows: ['primary', 'secondary']

columns: ['zip', 'city']

Excerpt of possible results:

• 2x2 table: A fixed object (the only possible result structure):

  {
    primary: {
      zip: "value",
      city: "value"
    },
    secondary: {
      zip: "value",
      city: "value"
    }
  }

Conditions

The table input type supports the following conditions for dynamic visibility:

Condition	Payload	Description
hasDimensions	boolean defaults to true	Checks whether the table already has its dimensions selected.