🔗 Данные и привязки

Разметка виджета не статична: текст, изображения и кнопки привязаны к данным. Структуру данных задаёт схема, а значения передаёт агент или ваш API.

📐 Схема

Схема — это контракт в формате JSON Schema. Она управляет тремя вещами:

• какие поля агент заполняет для функции Показать виджет;
• какие пути подсказываются при написании кода;
• проверкой данных (обязательные поля, типы, enum).

{
  "type": "object",
  "properties": {
    "customer": { "type": "string" },
    "orders": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "title":  { "type": "string" },
          "total":  { "type": "number" },
          "status": { "type": "string", "enum": ["new", "shipping", "done"] }
        }
      }
    }
  },
  "required": ["orders"]
}

🧷 Синтаксис привязки

В JSX привязка — обычное выражение, в сохранённом дереве — путь в двойных фигурных скобках:

• value={customer} → "{{customer}}"
• value={order.total} → "{{order.total}}" — путь через точку.
• label={orders[0].status} — обращение по индексу.
• value={orders.length} — длина массива.

Если свойство состоит только из привязки, сохраняется тип значения (массив остаётся массивом). При смешивании с текстом результат становится строкой:

<Title value={order.title} />        → "{{order.title}}"
<Text value={"$" + order.total} />    → "${{order.total}}"

🔁 Перебор массивов

Списки пишутся через .map() и превращаются в узел Repeat:

<Card gap={2}>
  {orders.map(order => (
    <Row align="center" gap={2}>
      <Text value={order.title} />
      <Spacer />
      <Badge label={order.status} />
    </Row>
  ))}
</Card>

• Элемент доступен под выбранным именем — order.
• Позиция элемента — orderIndex (имя элемента + Index).
• Чтобы вернуть несколько узлов, используйте <>…</>.

🧮 Откуда берутся данные

ответ API  >  данные функции (действия)  >  пример Default  >  пустые значения из схемы

• При действии Показать виджет данные заполняет агент по схеме.
• При Вызов API + виджет данные берутся из ответа эндпоинта и при необходимости перекладываются через сопоставление ответа.
• Поля формы (Input, Select …) пишут в те же данные по ключу name.
• Функция set_variables тоже меняет эти данные — только в браузере.

⚠️ Важно знать

• Отсутствующий путь отображается пустым — виджет не ломается.
• Default не перекрывает живые данные; он нужен только редактору.
• Введённое посетителем остаётся в браузере. Чтобы отправить это на сервер, добавьте поле в дополнительные входы функции.