@adecore/agents-react 0.31.12 → 0.33.0

package/dist/chat/ui/rows/SubagentRow.js

@@ -1,4 +1,4 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { useLayoutEffect, useRef, useState } from 'react';
 import clsx from 'clsx';
 import { useTranslation } from 'react-i18next';
@@ -14,94 +14,611 @@ import { RunningFor, ToggleLine, WorkLiveRow, WorkRow } from './WorkRows.js';
 import { entryTimeOf, statusWordOf, taskIdOf } from '../../subagent-list.js';
 import { useSubagentSupport } from '../../subagent-support.js';
 import { canOpenSubagent, crumbOf } from '../../subagent-view.js';
-import { useChatHost } from '../../../host.js';
+import '../../../host.js';
 import { useChatScope } from '../../../scope.js';
 import { useCurrentItem } from '../../../state/chats.js';
+import { useHostTask } from '../../../host-hooks.js';
 // The work of a long-running agent scrolls inside its row instead of pushing the thread away.
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const CHILDREN_MAX_PX = 320;
 /*
  * One step a sub-agent took, inside its parent's row. The thread's own `Row` draws the same kinds,
  * but off a timeline it has already grouped and folded, and it writes an answer at the size of a
  * message; here every step is a line and the text is the aside under it.
  */
-function ChildRow({ chatId, item }) {
-    if (item.kind === 'tool') {
-        if (isImageGeneration(item)) {
-            return _jsx(GeneratedImageRow, { chatId: chatId, tool: item });
-        }
-        return item.state === 'running' ? _jsx(WorkLiveRow, { chatId: chatId, tool: item }) : _jsx(WorkRow, { chatId: chatId, tool: item });
+function ChildRow(t0) {
+  const $ = _c(9);
+  const {
+    chatId,
+    item
+  } = t0;
+  if (item.kind === "tool") {
+    if (isImageGeneration(item)) {
+      let t1;
+      if ($[0] !== chatId || $[1] !== item) {
+        t1 = /*#__PURE__*/_jsx(GeneratedImageRow, {
+          chatId: chatId,
+          tool: item
+        });
+        $[0] = chatId;
+        $[1] = item;
+        $[2] = t1;
+      } else {
+        t1 = $[2];
+      }
+      return t1;
     }
-    if (item.kind === 'assistant') {
-        return _jsx(ChildText, { chatId: chatId, item: item });
+    let t1;
+    if ($[3] !== chatId || $[4] !== item) {
+      t1 = item.state === "running" ? /*#__PURE__*/_jsx(WorkLiveRow, {
+        chatId: chatId,
+        tool: item
+      }) : /*#__PURE__*/_jsx(WorkRow, {
+        chatId: chatId,
+        tool: item
+      });
+      $[3] = chatId;
+      $[4] = item;
+      $[5] = t1;
+    } else {
+      t1 = $[5];
     }
-    return null;
+    return t1;
+  }
+  if (item.kind === "assistant") {
+    let t1;
+    if ($[6] !== chatId || $[7] !== item) {
+      t1 = /*#__PURE__*/_jsx(ChildText, {
+        chatId: chatId,
+        item: item
+      });
+      $[6] = chatId;
+      $[7] = item;
+      $[8] = t1;
+    } else {
+      t1 = $[8];
+    }
+    return t1;
+  }
+  return null;
 }
-function ChildText({ chatId, item: derived }) {
-    const item = useCurrentItem(chatId, derived);
-    return (_jsx("div", { className: "-mx-1 px-1 pb-2 text-xs text-text-muted select-text", children: _jsx(Markdown, { text: item.text }) }));
+function ChildText(t0) {
+  const $ = _c(2);
+  const {
+    chatId,
+    item: derived
+  } = t0;
+  const item = useCurrentItem(chatId, derived);
+  let t1;
+  if ($[0] !== item.text) {
+    t1 = /*#__PURE__*/_jsx("div", {
+      className: "-mx-1 px-1 pb-2 text-xs text-text-muted select-text",
+      children: /*#__PURE__*/_jsx(Markdown, {
+        text: item.text
+      })
+    });
+    $[0] = item.text;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  return t1;
 }
-function StatusPill({ item, task }) {
-    const { t } = useTranslation('agent-chat');
-    const paused = statusWordOf(item, task) === 'paused';
-    const now = useNow(60_000, paused);
-    if (paused) {
-        return _jsx("span", { className: "shrink-0 text-xs text-text-faint tabular-nums", children: entryTimeOf(item, task, now) });
+function StatusPill(t0) {
+  const $ = _c(22);
+  const {
+    item,
+    task
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  let t1;
+  if ($[0] !== item || $[1] !== task) {
+    t1 = statusWordOf(item, task);
+    $[0] = item;
+    $[1] = task;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const paused = t1 === "paused";
+  const now = useNow(60000, paused);
+  if (paused) {
+    let t2;
+    if ($[3] !== item || $[4] !== now || $[5] !== task) {
+      t2 = entryTimeOf(item, task, now);
+      $[3] = item;
+      $[4] = now;
+      $[5] = task;
+      $[6] = t2;
+    } else {
+      t2 = $[6];
+    }
+    let t3;
+    if ($[7] !== t2) {
+      t3 = /*#__PURE__*/_jsx("span", {
+        className: "shrink-0 text-xs text-text-faint tabular-nums",
+        children: t2
+      });
+      $[7] = t2;
+      $[8] = t3;
+    } else {
+      t3 = $[8];
     }
-    if (item.status === 'running') {
-        return _jsx(RunningFor, { startedAt: item.startedAt });
+    return t3;
+  }
+  if (item.status === "running") {
+    let t2;
+    if ($[9] !== item.startedAt) {
+      t2 = /*#__PURE__*/_jsx(RunningFor, {
+        startedAt: item.startedAt
+      });
+      $[9] = item.startedAt;
+      $[10] = t2;
+    } else {
+      t2 = $[10];
     }
-    const failed = item.status === 'failed';
+    return t2;
+  }
+  const failed = item.status === "failed";
+  let t2;
+  let t3;
+  if ($[11] !== failed || $[12] !== item.finishedAt || $[13] !== item.startedAt || $[14] !== t) {
     const duration = item.finishedAt === null ? null : formatElapsedShort(item.finishedAt - item.startedAt);
-    const outcome = failed ? 'failed' : 'done';
-    return (_jsx("span", { className: clsx('shrink-0 text-xs tabular-nums', failed ? 'text-status-error' : 'text-text-faint'), children: duration === null ? t(`common.status.${outcome}`) : t(`rows.subagent.${outcome}In`, { duration }) }));
+    const outcome = failed ? "failed" : "done";
+    const t4 = failed ? "text-status-error" : "text-text-faint";
+    if ($[17] !== t4) {
+      t2 = clsx("shrink-0 text-xs tabular-nums", t4);
+      $[17] = t4;
+      $[18] = t2;
+    } else {
+      t2 = $[18];
+    }
+    t3 = duration === null ? t(`common.status.${outcome}`) : t(`rows.subagent.${outcome}In`, {
+      duration
+    });
+    $[11] = failed;
+    $[12] = item.finishedAt;
+    $[13] = item.startedAt;
+    $[14] = t;
+    $[15] = t2;
+    $[16] = t3;
+  } else {
+    t2 = $[15];
+    t3 = $[16];
+  }
+  let t4;
+  if ($[19] !== t2 || $[20] !== t3) {
+    t4 = /*#__PURE__*/_jsx("span", {
+      className: t2,
+      children: t3
+    });
+    $[19] = t2;
+    $[20] = t3;
+    $[21] = t4;
+  } else {
+    t4 = $[21];
+  }
+  return t4;
 }
 /* What the sub-agent did, live: its own tool calls and the text it wrote, as ordinary rows. */
-function SubagentWork({ chatId, item, work }) {
-    const { t } = useTranslation('agent-chat');
-    const scroller = useRef(null);
-    const running = item.status === 'running';
-    useLayoutEffect(() => {
-        // While it works, the newest line is the one worth seeing.
-        if (running && scroller.current) {
-            scroller.current.scrollTop = scroller.current.scrollHeight;
-        }
-    }, [work.length, running]);
-    if (work.length === 0) {
-        // A line inside a chat row, where the centered block of an EmptyState would outweigh the row itself.
-        return _jsx("div", { className: "ml-6 pb-1 text-xs text-text-faint", children: t('rows.subagent.nothingYet') });
+function SubagentWork(t0) {
+  const $ = _c(21);
+  const {
+    chatId,
+    item,
+    work
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  const scroller = useRef(null);
+  const running = item.status === "running";
+  let t1;
+  if ($[0] !== running) {
+    t1 = () => {
+      if (running && scroller.current) {
+        scroller.current.scrollTop = scroller.current.scrollHeight;
+      }
+    };
+    $[0] = running;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] !== running || $[3] !== work.length) {
+    t2 = [work.length, running];
+    $[2] = running;
+    $[3] = work.length;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  useLayoutEffect(t1, t2);
+  if (work.length === 0) {
+    let t3;
+    if ($[5] !== t) {
+      t3 = t("rows.subagent.nothingYet");
+      $[5] = t;
+      $[6] = t3;
+    } else {
+      t3 = $[6];
+    }
+    let t4;
+    if ($[7] !== t3) {
+      t4 = /*#__PURE__*/_jsx("div", {
+        className: "ml-6 pb-1 text-xs text-text-faint",
+        children: t3
+      });
+      $[7] = t3;
+      $[8] = t4;
+    } else {
+      t4 = $[8];
     }
-    return (_jsxs("div", { ref: scroller, className: "ml-6 overflow-y-auto", style: { maxHeight: CHILDREN_MAX_PX }, children: [item.itemsTruncated && _jsx("div", { className: "pb-1 text-xs text-text-faint", children: t('rows.subagent.truncated') }), work.map((child) => (_jsx(ChildRow, { chatId: chatId, item: child }, child.id)))] }));
+    return t4;
+  }
+  let t3;
+  if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = {
+      maxHeight: CHILDREN_MAX_PX
+    };
+    $[9] = t3;
+  } else {
+    t3 = $[9];
+  }
+  let t4;
+  if ($[10] !== item.itemsTruncated || $[11] !== t) {
+    t4 = item.itemsTruncated && /*#__PURE__*/_jsx("div", {
+      className: "pb-1 text-xs text-text-faint",
+      children: t("rows.subagent.truncated")
+    });
+    $[10] = item.itemsTruncated;
+    $[11] = t;
+    $[12] = t4;
+  } else {
+    t4 = $[12];
+  }
+  let t5;
+  if ($[13] !== chatId || $[14] !== work) {
+    let t6;
+    if ($[16] !== chatId) {
+      t6 = child => /*#__PURE__*/_jsx(ChildRow, {
+        chatId: chatId,
+        item: child
+      }, child.id);
+      $[16] = chatId;
+      $[17] = t6;
+    } else {
+      t6 = $[17];
+    }
+    t5 = work.map(t6);
+    $[13] = chatId;
+    $[14] = work;
+    $[15] = t5;
+  } else {
+    t5 = $[15];
+  }
+  let t6;
+  if ($[18] !== t4 || $[19] !== t5) {
+    t6 = /*#__PURE__*/_jsxs("div", {
+      ref: scroller,
+      className: "ml-6 overflow-y-auto",
+      style: t3,
+      children: [t4, t5]
+    });
+    $[18] = t4;
+    $[19] = t5;
+    $[20] = t6;
+  } else {
+    t6 = $[20];
+  }
+  return t6;
 }
 /* The report the sub-agent handed back, behind a fold: the row is about the work, this is the answer. */
-function SubagentResult({ itemId, result }) {
-    const { t } = useTranslation('agent-chat');
-    const [open, setOpen] = useState(false);
-    useOpenForFind(itemId, 'output', setOpen);
-    return (_jsxs("div", { className: "ml-6 pb-1", children: [_jsxs("button", { className: "flex items-center gap-1.5 text-xs text-text-muted hover:text-text", onClick: () => setOpen((o) => !o), children: [_jsx(Icon, { icon: ChevronDown, size: 12, className: clsx('transition-transform', open && 'rotate-180') }), open ? t('rows.subagent.hideResult') : t('rows.subagent.showResult')] }), open && (_jsx("div", { "data-find-field": "output", className: "mt-1 rounded-md border border-border bg-surface-raised px-3 py-2 select-text", children: _jsx(Markdown, { text: result }) }))] }));
+function SubagentResult(t0) {
+  const $ = _c(17);
+  const {
+    itemId,
+    result
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  const [open, setOpen] = useState(false);
+  useOpenForFind(itemId, "output", setOpen);
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = () => setOpen(_temp);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const t2 = open && "rotate-180";
+  let t3;
+  if ($[1] !== t2) {
+    t3 = clsx("transition-transform", t2);
+    $[1] = t2;
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  let t4;
+  if ($[3] !== t3) {
+    t4 = /*#__PURE__*/_jsx(Icon, {
+      icon: ChevronDown,
+      size: 12,
+      className: t3
+    });
+    $[3] = t3;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  let t5;
+  if ($[5] !== open || $[6] !== t) {
+    t5 = open ? t("rows.subagent.hideResult") : t("rows.subagent.showResult");
+    $[5] = open;
+    $[6] = t;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  let t6;
+  if ($[8] !== t4 || $[9] !== t5) {
+    t6 = /*#__PURE__*/_jsxs("button", {
+      className: "flex items-center gap-1.5 text-xs text-text-muted hover:text-text",
+      onClick: t1,
+      children: [t4, t5]
+    });
+    $[8] = t4;
+    $[9] = t5;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  let t7;
+  if ($[11] !== open || $[12] !== result) {
+    t7 = open && /*#__PURE__*/_jsx("div", {
+      "data-find-field": "output",
+      className: "mt-1 rounded-md border border-border bg-surface-raised px-3 py-2 select-text",
+      children: /*#__PURE__*/_jsx(Markdown, {
+        text: result
+      })
+    });
+    $[11] = open;
+    $[12] = result;
+    $[13] = t7;
+  } else {
+    t7 = $[13];
+  }
+  let t8;
+  if ($[14] !== t6 || $[15] !== t7) {
+    t8 = /*#__PURE__*/_jsxs("div", {
+      className: "ml-6 pb-1",
+      children: [t6, t7]
+    });
+    $[14] = t6;
+    $[15] = t7;
+    $[16] = t8;
+  } else {
+    t8 = $[16];
+  }
+  return t8;
 }
 /*
  * One agent the agent delegated to. The line says what it is doing and for how long; pressing it
  * opens the whole conversation in the thread's place, and where there is none to open it folds out
  * the work the thread kept and, once it settled, the report it wrote.
  */
-export function SubagentRow({ chatId, item, work, expanded, onToggle, onOpenConversation }) {
-    const host = useChatHost();
-    const { t } = useTranslation('agent-chat');
-    const { id } = useChatScope();
-    const taskId = taskIdOf(item);
-    const task = host.tasks.useTask(id, taskId);
-    // A task paused on its child's limit is still a running row on the wire, but nothing is at work.
-    const running = item.status === 'running' && statusWordOf(item, task) !== 'paused';
-    const detail = item.description || item.summary || item.subagentType || '';
-    // A row that carries no pointer on a host that already said no has nothing to open.
-    const refused = useSubagentSupport((s) => s.unsupported[id] === true);
-    const press = onOpenConversation !== undefined && canOpenSubagent(item, refused) ? onOpenConversation : onToggle;
-    return (_jsxs("div", { "data-find-item": item.id, children: [item.origin === 'ruimte' ? (_jsx(TaskRow, { item: item, task: task, open: expanded, onPress: press })) : (_jsx(ToggleLine, { icon: _jsx(Icon, { icon: Bot, size: 12 }), label: t('rows.subagent.label'), detail: detail, open: expanded, onToggle: press, failed: item.status === 'failed', live: running, trailing: _jsxs(_Fragment, { children: [item.background && _jsx("span", { className: "shrink-0 text-xs text-text-faint", children: t('rows.subagent.background') }), running && item.lastTool && _jsx("span", { className: "shrink-0 text-xs text-text-faint", children: item.lastTool }), _jsx(StatusPill, { item: item, task: task })] }) })), expanded && (_jsxs("div", { className: "mb-1", children: [_jsx(SubagentWork, { chatId: chatId, item: item, work: work }), item.result !== null && _jsx(SubagentResult, { itemId: item.id, result: item.result })] }))] }));
+function _temp(o) {
+  return !o;
+}
+export function SubagentRow(t0) {
+  const $ = _c(24);
+  const {
+    chatId,
+    item,
+    work,
+    expanded,
+    onToggle,
+    onOpenConversation
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  const {
+    id
+  } = useChatScope();
+  let t1;
+  if ($[0] !== item) {
+    t1 = taskIdOf(item);
+    $[0] = item;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const taskId = t1;
+  const task = useHostTask(id, taskId);
+  let t2;
+  if ($[2] !== item || $[3] !== task) {
+    t2 = item.status === "running" && statusWordOf(item, task) !== "paused";
+    $[2] = item;
+    $[3] = task;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  const running = t2;
+  const detail = item.description || item.summary || item.subagentType || "";
+  let t3;
+  if ($[5] !== id) {
+    t3 = s => s.unsupported[id] === true;
+    $[5] = id;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  const refused = useSubagentSupport(t3);
+  const press = onOpenConversation !== undefined && canOpenSubagent(item, refused) ? onOpenConversation : onToggle;
+  let t4;
+  if ($[7] !== detail || $[8] !== expanded || $[9] !== item || $[10] !== press || $[11] !== running || $[12] !== t || $[13] !== task) {
+    t4 = item.origin === "ruimte" ? /*#__PURE__*/_jsx(TaskRow, {
+      item: item,
+      task: task,
+      open: expanded,
+      onPress: press
+    }) : /*#__PURE__*/_jsx(ToggleLine, {
+      icon: /*#__PURE__*/_jsx(Icon, {
+        icon: Bot,
+        size: 12
+      }),
+      label: t("rows.subagent.label"),
+      detail: detail,
+      open: expanded,
+      onToggle: press,
+      failed: item.status === "failed",
+      live: running,
+      trailing: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [item.background && /*#__PURE__*/_jsx("span", {
+          className: "shrink-0 text-xs text-text-faint",
+          children: t("rows.subagent.background")
+        }), running && item.lastTool && /*#__PURE__*/_jsx("span", {
+          className: "shrink-0 text-xs text-text-faint",
+          children: item.lastTool
+        }), /*#__PURE__*/_jsx(StatusPill, {
+          item: item,
+          task: task
+        })]
+      })
+    });
+    $[7] = detail;
+    $[8] = expanded;
+    $[9] = item;
+    $[10] = press;
+    $[11] = running;
+    $[12] = t;
+    $[13] = task;
+    $[14] = t4;
+  } else {
+    t4 = $[14];
+  }
+  let t5;
+  if ($[15] !== chatId || $[16] !== expanded || $[17] !== item || $[18] !== work) {
+    t5 = expanded && /*#__PURE__*/_jsxs("div", {
+      className: "mb-1",
+      children: [/*#__PURE__*/_jsx(SubagentWork, {
+        chatId: chatId,
+        item: item,
+        work: work
+      }), item.result !== null && /*#__PURE__*/_jsx(SubagentResult, {
+        itemId: item.id,
+        result: item.result
+      })]
+    });
+    $[15] = chatId;
+    $[16] = expanded;
+    $[17] = item;
+    $[18] = work;
+    $[19] = t5;
+  } else {
+    t5 = $[19];
+  }
+  let t6;
+  if ($[20] !== item.id || $[21] !== t4 || $[22] !== t5) {
+    t6 = /*#__PURE__*/_jsxs("div", {
+      "data-find-item": item.id,
+      children: [t4, t5]
+    });
+    $[20] = item.id;
+    $[21] = t4;
+    $[22] = t5;
+    $[23] = t6;
+  } else {
+    t6 = $[23];
+  }
+  return t6;
 }
 /*
  * A sub-agent's row with the agents it opened in turn under it. Those stay in sight whether its own
  * work is folded or not, since opening the parent shows its conversation and not theirs.
  */
-export function SubagentBranchRow({ chatId, branch, onToggle, onOpenConversation }) {
-    return (_jsxs(_Fragment, { children: [_jsx(SubagentRow, { chatId: chatId, item: branch.item, work: branch.children, expanded: branch.expanded, onToggle: () => onToggle(branch.id), onOpenConversation: onOpenConversation ? () => onOpenConversation(crumbOf(branch.item)) : undefined }), branch.nested.length > 0 && (_jsx("div", { className: "ml-6", children: branch.nested.map((child) => (_jsx(SubagentBranchRow, { chatId: chatId, branch: child, onToggle: onToggle, onOpenConversation: onOpenConversation }, child.id))) }))] }));
-}
+export function SubagentBranchRow(t0) {
+  const $ = _c(21);
+  const {
+    chatId,
+    branch,
+    onToggle,
+    onOpenConversation
+  } = t0;
+  let t1;
+  if ($[0] !== branch.id || $[1] !== onToggle) {
+    t1 = () => onToggle(branch.id);
+    $[0] = branch.id;
+    $[1] = onToggle;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  let t2;
+  if ($[3] !== branch.item || $[4] !== onOpenConversation) {
+    t2 = onOpenConversation ? () => onOpenConversation(crumbOf(branch.item)) : undefined;
+    $[3] = branch.item;
+    $[4] = onOpenConversation;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[6] !== branch.children || $[7] !== branch.expanded || $[8] !== branch.item || $[9] !== chatId || $[10] !== t1 || $[11] !== t2) {
+    t3 = /*#__PURE__*/_jsx(SubagentRow, {
+      chatId: chatId,
+      item: branch.item,
+      work: branch.children,
+      expanded: branch.expanded,
+      onToggle: t1,
+      onOpenConversation: t2
+    });
+    $[6] = branch.children;
+    $[7] = branch.expanded;
+    $[8] = branch.item;
+    $[9] = chatId;
+    $[10] = t1;
+    $[11] = t2;
+    $[12] = t3;
+  } else {
+    t3 = $[12];
+  }
+  let t4;
+  if ($[13] !== branch.nested || $[14] !== chatId || $[15] !== onOpenConversation || $[16] !== onToggle) {
+    t4 = branch.nested.length > 0 && /*#__PURE__*/_jsx("div", {
+      className: "ml-6",
+      children: branch.nested.map(child => /*#__PURE__*/_jsx(SubagentBranchRow, {
+        chatId: chatId,
+        branch: child,
+        onToggle: onToggle,
+        onOpenConversation: onOpenConversation
+      }, child.id))
+    });
+    $[13] = branch.nested;
+    $[14] = chatId;
+    $[15] = onOpenConversation;
+    $[16] = onToggle;
+    $[17] = t4;
+  } else {
+    t4 = $[17];
+  }
+  let t5;
+  if ($[18] !== t3 || $[19] !== t4) {
+    t5 = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [t3, t4]
+    });
+    $[18] = t3;
+    $[19] = t4;
+    $[20] = t5;
+  } else {
+    t5 = $[20];
+  }
+  return t5;
+}