Maps

Maps transform each item of an array into a value (typically an element or elements). The template reads the current item and index through the $item and $index scoped arguments:

{
  "$map": ["foo", "bar", "baz"],
  "$each": {
    "type": "text",
    "props": { "children": { "$arg": "$item" } }
  }
}

Required

• $map (expression): The array to map over.
• $each (template): One item of the position's array. In children positions the template is one child, so nested conditionals and maps compose freely.

Behavior

The map resolves to an array holding one resolved template per source item. Maps are therefore valid only in positions that accept an array (a children prop, or a prop whose schema accepts a homogeneous array), and the template is validated as one item of that array.

Example

Transform data into elements:

{
  "type": "list",
  "props": {
    "children": {
      "$map": { "$data": "/names" },
      "$each": {
        "type": "list-item",
        "props": { "children": { "$arg": "$item" } }
      }
    }
  }
}