@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/agents/components/chat/SandboxPanel.js

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { Input, Button } from "@ai-matrx/design-system/controls";
 import {
@@ -131,7 +132,7 @@ function SandboxPanel({ conversationId }) {
   const canShareAcrossSurface = !!sourceFeature && !sandboxBlocked;
   const effectiveShareAcrossSurface = shareAcrossSurface && canShareAcrossSurface;
   if (sandboxBlocked) {
-    return /* @__PURE__ */ React.createElement("div", { className: "px-3 py-3" }, /* @__PURE__ */ React.createElement("p", { className: "text-xs text-muted-foreground" }, "Sandbox unavailable in incognito mode."));
+    return /* @__PURE__ */ jsx("div", { className: "px-3 py-3", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Sandbox unavailable in incognito mode." }) });
   }
   const applyRef = (ref) => {
     if (ref?.rowId) clearSandboxBindingCache(ref.rowId);
@@ -205,157 +206,212 @@ function SandboxPanel({ conversationId }) {
       setCreating(false);
     }
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col" }, !resolved ? /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 border-b border-border px-3 py-2" }, /* @__PURE__ */ React.createElement("span", { className: "h-1.5 w-1.5 shrink-0 rounded-full bg-muted-foreground/40" }), /* @__PURE__ */ React.createElement("span", { className: "text-xs text-muted-foreground" }, "No sandbox bound")) : boundView ? /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: `flex items-center justify-between gap-2 border-b border-border px-3 py-2 ${boundView.state === "gone" ? "bg-amber-500/10" : "bg-muted/40"}`
-    },
-    /* @__PURE__ */ React.createElement("span", { className: "flex min-w-0 items-center gap-2" }, boundView.state === "checking" ? /* @__PURE__ */ React.createElement(Loader2, { className: "h-3 w-3 shrink-0 animate-spin text-muted-foreground" }) : boundView.state === "gone" ? /* @__PURE__ */ React.createElement(AlertTriangle, { className: "h-3.5 w-3.5 shrink-0 text-amber-500" }) : /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        className: `h-1.5 w-1.5 shrink-0 rounded-full ${boundView.state === "online" ? "bg-emerald-500" : "bg-muted-foreground/50"}`
-      }
-    ), /* @__PURE__ */ React.createElement("span", { className: "truncate text-xs font-medium text-foreground" }, boundInstance ? sandboxDisplayName(boundInstance) : boundView.name), /* @__PURE__ */ React.createElement("span", { className: "shrink-0 rounded bg-muted px-1 py-px text-[9px] uppercase tracking-wide text-muted-foreground" }, resolvedSource === "override" ? "this chat" : "this surface"), boundState && boundView.state !== "online" ? /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        className: "shrink-0 text-[10px] text-muted-foreground",
-        title: boundState.remedy ?? void 0
-      },
-      boundState.label,
-      boundState.remedy ? ` \u2014 ${boundState.remedy}` : ""
-    ) : null),
-    /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 items-center gap-2" }, /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: /* @__PURE__ */ React.createElement(GitBranch, null), onClick: () => setCloneOpen(true), title: "Clone a git repo into this box" }, "Clone"), /* @__PURE__ */ React.createElement(Button, { variant: "quiet", removes: true, icon: /* @__PURE__ */ React.createElement(X, null), onClick: () => applyRef(null), title: "Detach" }, "Detach"))
-  ) : null, localPcs.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "border-b border-border" }, /* @__PURE__ */ React.createElement("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground" }, "Your computers"), /* @__PURE__ */ React.createElement("div", { className: "max-h-32 overflow-y-auto pb-1" }, localPcs.map((pc) => {
-    const isBound = resolved?.rowId === pc.id || resolved?.kind === "local-pc" && resolved.rowId === pc.id;
-    return /* @__PURE__ */ React.createElement(
-      "button",
-      {
-        key: pc.id,
-        onClick: () => handlePickLocalPc(pc),
-        className: "flex w-full items-center justify-between gap-2 px-3 py-1.5 text-left hover:bg-accent/60 transition-colors",
-        title: pc.is_online ? "Online" : "Offline \u2014 start matrx-local on this device"
-      },
-      /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex items-center gap-2" }, isBound && /* @__PURE__ */ React.createElement(Check, { className: "h-3 w-3 text-emerald-500 shrink-0" }), /* @__PURE__ */ React.createElement(
-        "span",
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+      !resolved ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b border-border px-3 py-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 shrink-0 rounded-full bg-muted-foreground/40" }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "No sandbox bound" })
+      ] }) : boundView ? /* @__PURE__ */ jsxs(
+        "div",
         {
-          className: `inline-block h-1.5 w-1.5 shrink-0 rounded-full ${pc.is_online ? "bg-emerald-500" : "bg-muted-foreground/40"}`
+          className: `flex items-center justify-between gap-2 border-b border-border px-3 py-2 ${boundView.state === "gone" ? "bg-amber-500/10" : "bg-muted/40"}`,
+          children: [
+            /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
+              boundView.state === "checking" ? /* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 shrink-0 animate-spin text-muted-foreground" }) : boundView.state === "gone" ? /* @__PURE__ */ jsx(AlertTriangle, { className: "h-3.5 w-3.5 shrink-0 text-amber-500" }) : /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: `h-1.5 w-1.5 shrink-0 rounded-full ${boundView.state === "online" ? "bg-emerald-500" : "bg-muted-foreground/50"}`
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-medium text-foreground", children: boundInstance ? sandboxDisplayName(boundInstance) : boundView.name }),
+              /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded bg-muted px-1 py-px text-[9px] uppercase tracking-wide text-muted-foreground", children: resolvedSource === "override" ? "this chat" : "this surface" }),
+              boundState && boundView.state !== "online" ? /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: "shrink-0 text-[10px] text-muted-foreground",
+                  title: boundState.remedy ?? void 0,
+                  children: [
+                    boundState.label,
+                    boundState.remedy ? ` \u2014 ${boundState.remedy}` : ""
+                  ]
+                }
+              ) : null
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: /* @__PURE__ */ jsx(GitBranch, {}), onClick: () => setCloneOpen(true), title: "Clone a git repo into this box", children: "Clone" }),
+              /* @__PURE__ */ jsx(Button, { variant: "quiet", removes: true, icon: /* @__PURE__ */ jsx(X, {}), onClick: () => applyRef(null), title: "Detach", children: "Detach" })
+            ] })
+          ]
         }
-      ), /* @__PURE__ */ React.createElement(Monitor, { className: "h-3 w-3 shrink-0 text-muted-foreground" }), /* @__PURE__ */ React.createElement("span", { className: "text-xs text-foreground truncate" }, pc.name)),
-      /* @__PURE__ */ React.createElement("span", { className: "shrink-0 text-[10px] uppercase tracking-wide text-muted-foreground" }, pc.status)
-    );
-  }))), localPcs.length > 0 && /* @__PURE__ */ React.createElement("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground" }, "Sandboxes"), /* @__PURE__ */ React.createElement("div", { className: "max-h-56 overflow-y-auto py-1" }, loading && runningInstances.length === 0 ? /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 px-3 py-3 text-xs text-muted-foreground" }, /* @__PURE__ */ React.createElement(Loader2, { className: "h-3.5 w-3.5 animate-spin" }), "Loading sandboxes\u2026") : runningInstances.length === 0 ? /* @__PURE__ */ React.createElement("p", { className: "px-3 py-3 text-xs text-muted-foreground" }, "No running sandboxes. Create one below.") : runningInstances.map((inst) => {
-    const isBound = resolved?.rowId === inst.id;
-    const status = getEffectiveStatus(inst);
-    return /* @__PURE__ */ React.createElement("div", { key: inst.id, className: "px-3 py-1" }, editingId === inst.id ? /* @__PURE__ */ React.createElement(
-      "form",
-      {
-        onSubmit: (event) => {
-          event.preventDefault();
-          void saveName();
-        },
-        onKeyDown: (event) => {
-          if (event.key === "Escape") {
-            event.preventDefault();
-            event.stopPropagation();
-            if (!savingName) setEditingId(null);
+      ) : null,
+      localPcs.length > 0 && /* @__PURE__ */ jsxs("div", { className: "border-b border-border", children: [
+        /* @__PURE__ */ jsx("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Your computers" }),
+        /* @__PURE__ */ jsx("div", { className: "max-h-32 overflow-y-auto pb-1", children: localPcs.map((pc) => {
+          const isBound = resolved?.rowId === pc.id || resolved?.kind === "local-pc" && resolved.rowId === pc.id;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => handlePickLocalPc(pc),
+              className: "flex w-full items-center justify-between gap-2 px-3 py-1.5 text-left hover:bg-accent/60 transition-colors",
+              title: pc.is_online ? "Online" : "Offline \u2014 start matrx-local on this device",
+              children: [
+                /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex items-center gap-2", children: [
+                  isBound && /* @__PURE__ */ jsx(Check, { className: "h-3 w-3 text-emerald-500 shrink-0" }),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: `inline-block h-1.5 w-1.5 shrink-0 rounded-full ${pc.is_online ? "bg-emerald-500" : "bg-muted-foreground/40"}`
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Monitor, { className: "h-3 w-3 shrink-0 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-xs text-foreground truncate", children: pc.name })
+                ] }),
+                /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[10px] uppercase tracking-wide text-muted-foreground", children: pc.status })
+              ]
+            },
+            pc.id
+          );
+        }) })
+      ] }),
+      localPcs.length > 0 && /* @__PURE__ */ jsx("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Sandboxes" }),
+      /* @__PURE__ */ jsx("div", { className: "max-h-56 overflow-y-auto py-1", children: loading && runningInstances.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-3 text-xs text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" }),
+        "Loading sandboxes\u2026"
+      ] }) : runningInstances.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-3 py-3 text-xs text-muted-foreground", children: "No running sandboxes. Create one below." }) : runningInstances.map((inst) => {
+        const isBound = resolved?.rowId === inst.id;
+        const status = getEffectiveStatus(inst);
+        return /* @__PURE__ */ jsx("div", { className: "px-3 py-1", children: editingId === inst.id ? /* @__PURE__ */ jsxs(
+          "form",
+          {
+            onSubmit: (event) => {
+              event.preventDefault();
+              void saveName();
+            },
+            onKeyDown: (event) => {
+              if (event.key === "Escape") {
+                event.preventDefault();
+                event.stopPropagation();
+                if (!savingName) setEditingId(null);
+              }
+            },
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    autoFocus: true,
+                    "aria-label": `Label for ${inst.sandbox_id}`,
+                    placeholder: "Sandbox label",
+                    value: nameDraft,
+                    maxLength: 100,
+                    disabled: savingName,
+                    onChange: (event) => {
+                      setNameDraft(event.target.value);
+                      setNameError(null);
+                    },
+                    className: "min-w-0 flex-1"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  CheckTapButton,
+                  {
+                    variant: "transparent",
+                    ariaLabel: "Save sandbox label",
+                    tooltip: "Save label",
+                    disabled: savingName || !nameDraft.trim(),
+                    onClick: () => void saveName()
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  XTapButton,
+                  {
+                    variant: "transparent",
+                    ariaLabel: "Cancel sandbox label",
+                    tooltip: "Cancel",
+                    disabled: savingName,
+                    onClick: () => setEditingId(null)
+                  }
+                )
+              ] }),
+              nameError && /* @__PURE__ */ jsx(ErrorNotice, { size: "inline", className: "mt-1 text-xs", message: sandboxError || nameError })
+            ]
           }
-        }
-      },
-      /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 items-center gap-1" }, /* @__PURE__ */ React.createElement(
-        Input,
-        {
-          autoFocus: true,
-          "aria-label": `Label for ${inst.sandbox_id}`,
-          placeholder: "Sandbox label",
-          value: nameDraft,
-          maxLength: 100,
-          disabled: savingName,
-          onChange: (event) => {
-            setNameDraft(event.target.value);
-            setNameError(null);
-          },
-          className: "min-w-0 flex-1"
-        }
-      ), /* @__PURE__ */ React.createElement(
-        CheckTapButton,
-        {
-          variant: "transparent",
-          ariaLabel: "Save sandbox label",
-          tooltip: "Save label",
-          disabled: savingName || !nameDraft.trim(),
-          onClick: () => void saveName()
-        }
-      ), /* @__PURE__ */ React.createElement(
-        XTapButton,
-        {
-          variant: "transparent",
-          ariaLabel: "Cancel sandbox label",
-          tooltip: "Cancel",
-          disabled: savingName,
-          onClick: () => setEditingId(null)
-        }
-      )),
-      nameError && /* @__PURE__ */ React.createElement(ErrorNotice, { size: "inline", className: "mt-1 text-xs", message: sandboxError || nameError })
-    ) : /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 items-center gap-1" }, /* @__PURE__ */ React.createElement(
-      "button",
+        ) : /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => inst.proxy_url && applyRef({
+                rowId: inst.id,
+                proxyUrl: inst.proxy_url,
+                tier: inst.tier ?? void 0,
+                name: sandboxDisplayName(inst)
+              }),
+              disabled: !inst.proxy_url,
+              title: [sandboxDisplayName(inst), inst.sandbox_id, inst.template, inst.tier].filter(Boolean).join(" \xB7 "),
+              className: "flex min-h-10 min-w-0 flex-1 items-center gap-2 rounded text-left transition-colors hover:bg-accent/60 disabled:opacity-50 sm:min-h-7",
+              children: [
+                isBound && /* @__PURE__ */ jsx(Check, { className: "h-3 w-3 shrink-0 text-emerald-500" }),
+                /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-xs text-foreground", children: sandboxDisplayName(inst) }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: `shrink-0 rounded px-1.5 py-0.5 text-[10px] font-medium ${statusPillClasses(status)}`,
+                    children: STATUS_LABELS[status]
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            PencilTapButton,
+            {
+              variant: "transparent",
+              ariaLabel: `Rename ${sandboxDisplayName(inst)}`,
+              tooltip: inst.name?.trim() ? "Rename" : "Name this sandbox",
+              onClick: () => {
+                setEditingId(inst.id);
+                setNameDraft(inst.name ?? "");
+                setNameError(null);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ExternalLinkTapButton,
+            {
+              variant: "transparent",
+              ariaLabel: `Open files in ${sandboxDisplayName(inst)} in a new tab`,
+              tooltip: "Open in Code \xB7 new tab",
+              href: `/code?sandbox=${encodeURIComponent(inst.id)}`,
+              target: "_blank",
+              rel: "noopener noreferrer"
+            }
+          )
+        ] }) }, inst.id);
+      }) }),
+      /* @__PURE__ */ jsxs("div", { className: "border-t border-border p-2 space-y-1.5", children: [
+        /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: creating ? /* @__PURE__ */ jsx(Loader2, { className: "animate-spin" }) : /* @__PURE__ */ jsx(Plus, {}), onClick: handleClaimNew, disabled: creating, className: "w-full", children: creating ? "Creating sandbox\u2026" : "New sandbox" }),
+        canShareAcrossSurface && /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2 px-2 py-1 text-[11px] text-muted-foreground", children: [
+          /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              checked: shareAcrossSurface,
+              onCheckedChange: (v) => setShareAcrossSurface(v === true)
+            }
+          ),
+          "Also use for every new chat here"
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      CloneRepoDialog,
       {
-        type: "button",
-        onClick: () => inst.proxy_url && applyRef({
-          rowId: inst.id,
-          proxyUrl: inst.proxy_url,
-          tier: inst.tier ?? void 0,
-          name: sandboxDisplayName(inst)
-        }),
-        disabled: !inst.proxy_url,
-        title: [sandboxDisplayName(inst), inst.sandbox_id, inst.template, inst.tier].filter(Boolean).join(" \xB7 "),
-        className: "flex min-h-10 min-w-0 flex-1 items-center gap-2 rounded text-left transition-colors hover:bg-accent/60 disabled:opacity-50 sm:min-h-7"
-      },
-      isBound && /* @__PURE__ */ React.createElement(Check, { className: "h-3 w-3 shrink-0 text-emerald-500" }),
-      /* @__PURE__ */ React.createElement("span", { className: "min-w-0 flex-1 truncate text-xs text-foreground" }, sandboxDisplayName(inst)),
-      /* @__PURE__ */ React.createElement(
-        "span",
-        {
-          className: `shrink-0 rounded px-1.5 py-0.5 text-[10px] font-medium ${statusPillClasses(status)}`
-        },
-        STATUS_LABELS[status]
-      )
-    ), /* @__PURE__ */ React.createElement(
-      PencilTapButton,
-      {
-        variant: "transparent",
-        ariaLabel: `Rename ${sandboxDisplayName(inst)}`,
-        tooltip: inst.name?.trim() ? "Rename" : "Name this sandbox",
-        onClick: () => {
-          setEditingId(inst.id);
-          setNameDraft(inst.name ?? "");
-          setNameError(null);
-        }
+        instanceId: resolved?.rowId ?? null,
+        open: cloneOpen,
+        onOpenChange: setCloneOpen
       }
-    ), /* @__PURE__ */ React.createElement(
-      ExternalLinkTapButton,
-      {
-        variant: "transparent",
-        ariaLabel: `Open files in ${sandboxDisplayName(inst)} in a new tab`,
-        tooltip: "Open in Code \xB7 new tab",
-        href: `/code?sandbox=${encodeURIComponent(inst.id)}`,
-        target: "_blank",
-        rel: "noopener noreferrer"
-      }
-    )));
-  })), /* @__PURE__ */ React.createElement("div", { className: "border-t border-border p-2 space-y-1.5" }, /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: creating ? /* @__PURE__ */ React.createElement(Loader2, { className: "animate-spin" }) : /* @__PURE__ */ React.createElement(Plus, null), onClick: handleClaimNew, disabled: creating, className: "w-full" }, creating ? "Creating sandbox\u2026" : "New sandbox"), canShareAcrossSurface && /* @__PURE__ */ React.createElement("label", { className: "flex cursor-pointer items-center gap-2 px-2 py-1 text-[11px] text-muted-foreground" }, /* @__PURE__ */ React.createElement(
-    Checkbox,
-    {
-      checked: shareAcrossSurface,
-      onCheckedChange: (v) => setShareAcrossSurface(v === true)
-    }
-  ), "Also use for every new chat here"))), /* @__PURE__ */ React.createElement(
-    CloneRepoDialog,
-    {
-      instanceId: resolved?.rowId ?? null,
-      open: cloneOpen,
-      onOpenChange: setCloneOpen
-    }
-  ));
+    )
+  ] });
 }
 export {
   SandboxPanel

package/dist/agents/components/chat/sandbox-insight/SandboxActivityFeed.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { formatDurationMs } from "@ai-matrx/kit/format";
 import React from "react";
 import { AlertTriangle, ChevronRight, Loader2, Terminal } from "lucide-react";
@@ -20,46 +21,72 @@ const ActivityRow = ({ row }) => {
   const duration = formatDuration(row.durationMs);
   const body = row.output ?? row.errorMessage;
   const failed = row.status === "failed";
-  return /* @__PURE__ */ React.createElement("div", { className: "border-b border-border/40 last:border-b-0" }, /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: () => setOpen((v) => !v),
-      "aria-expanded": open,
-      className: "flex w-full items-start gap-2 px-3 py-2 text-left hover:bg-accent/40"
-    },
-    /* @__PURE__ */ React.createElement(
-      ChevronRight,
+  return /* @__PURE__ */ jsxs("div", { className: "border-b border-border/40 last:border-b-0", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
       {
-        className: cn(
-          "mt-0.5 size-3 shrink-0 text-muted-foreground transition-transform",
-          open && "rotate-90"
-        )
+        type: "button",
+        onClick: () => setOpen((v) => !v),
+        "aria-expanded": open,
+        className: "flex w-full items-start gap-2 px-3 py-2 text-left hover:bg-accent/40",
+        children: [
+          /* @__PURE__ */ jsx(
+            ChevronRight,
+            {
+              className: cn(
+                "mt-0.5 size-3 shrink-0 text-muted-foreground transition-transform",
+                open && "rotate-90"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx("p", { className: "truncate font-mono text-xs text-foreground", children: row.subject ?? row.toolName }),
+            /* @__PURE__ */ jsxs("p", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 text-[11px] text-muted-foreground", children: [
+              /* @__PURE__ */ jsx("span", { children: getToolDisplayName(row.toolName) }),
+              row.exitCode !== null && /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  "data-testid": "activity-exit-code",
+                  className: cn(
+                    "tabular-nums",
+                    failed && "font-medium text-red-600 dark:text-red-400"
+                  ),
+                  children: [
+                    "exit ",
+                    row.exitCode
+                  ]
+                }
+              ),
+              row.status === "running" && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
+                /* @__PURE__ */ jsx(Loader2, { className: "size-3 animate-spin" }),
+                "running"
+              ] }),
+              failed && row.exitCode === null && /* @__PURE__ */ jsxs("span", { className: "font-medium text-red-600 dark:text-red-400", children: [
+                "failed",
+                /* @__PURE__ */ jsx(ErrorAlchemyMenu, {})
+              ] }),
+              duration && /* @__PURE__ */ jsx("span", { className: "tabular-nums", children: duration }),
+              row.backend && row.backend !== "durable_vfs" && /* @__PURE__ */ jsx("span", { children: row.backend })
+            ] }),
+            row.backend === "durable_vfs" && /* @__PURE__ */ jsxs(
+              ErrorBox,
+              {
+                className: "mt-1 flex items-start gap-1 text-[11px] font-medium text-red-600 dark:text-red-400",
+                message: DURABLE_VFS_BADGE_TEXT,
+                operation: "Run a sandbox command",
+                origin: "chat/SandboxActivityFeed",
+                children: [
+                  /* @__PURE__ */ jsx(AlertTriangle, { className: "mt-px size-3 shrink-0" }),
+                  DURABLE_VFS_BADGE_TEXT
+                ]
+              }
+            )
+          ] })
+        ]
       }
     ),
-    /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("p", { className: "truncate font-mono text-xs text-foreground" }, row.subject ?? row.toolName), /* @__PURE__ */ React.createElement("p", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 text-[11px] text-muted-foreground" }, /* @__PURE__ */ React.createElement("span", null, getToolDisplayName(row.toolName)), row.exitCode !== null && /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        "data-testid": "activity-exit-code",
-        className: cn(
-          "tabular-nums",
-          failed && "font-medium text-red-600 dark:text-red-400"
-        )
-      },
-      "exit ",
-      row.exitCode
-    ), row.status === "running" && /* @__PURE__ */ React.createElement("span", { className: "flex items-center gap-1" }, /* @__PURE__ */ React.createElement(Loader2, { className: "size-3 animate-spin" }), "running"), failed && row.exitCode === null && /* @__PURE__ */ React.createElement("span", { className: "font-medium text-red-600 dark:text-red-400" }, "failed", /* @__PURE__ */ React.createElement(ErrorAlchemyMenu, null)), duration && /* @__PURE__ */ React.createElement("span", { className: "tabular-nums" }, duration), row.backend && row.backend !== "durable_vfs" && /* @__PURE__ */ React.createElement("span", null, row.backend)), row.backend === "durable_vfs" && /* @__PURE__ */ React.createElement(
-      ErrorBox,
-      {
-        className: "mt-1 flex items-start gap-1 text-[11px] font-medium text-red-600 dark:text-red-400",
-        message: DURABLE_VFS_BADGE_TEXT,
-        operation: "Run a sandbox command",
-        origin: "chat/SandboxActivityFeed"
-      },
-      /* @__PURE__ */ React.createElement(AlertTriangle, { className: "mt-px size-3 shrink-0" }),
-      DURABLE_VFS_BADGE_TEXT
-    ))
-  ), open && /* @__PURE__ */ React.createElement("pre", { className: "max-h-64 overflow-auto whitespace-pre border-t border-border/30 bg-muted/30 px-3 py-2 font-mono text-[11px] leading-relaxed text-foreground" }, body && body.trim() !== "" ? body : "No output."));
+    open && /* @__PURE__ */ jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre border-t border-border/30 bg-muted/30 px-3 py-2 font-mono text-[11px] leading-relaxed text-foreground", children: body && body.trim() !== "" ? body : "No output." })
+  ] });
 };
 function SandboxActivityFeed({
   conversationId
@@ -76,9 +103,13 @@ function SandboxActivityFeed({
   const live = useAppSelector(liveSelector);
   const rows = buildSandboxActivity(records, live);
   if (rows.length === 0) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex h-full flex-col items-center justify-center gap-2 p-6 text-center" }, /* @__PURE__ */ React.createElement(Terminal, { className: "size-5 text-muted-foreground/60" }), /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-foreground" }, "No sandbox work yet"), /* @__PURE__ */ React.createElement("p", { className: "max-w-xs text-xs text-muted-foreground" }, "Every command the agent runs and every file it reads or writes in this box will appear here as it happens."));
+    return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-2 p-6 text-center", children: [
+      /* @__PURE__ */ jsx(Terminal, { className: "size-5 text-muted-foreground/60" }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: "No sandbox work yet" }),
+      /* @__PURE__ */ jsx("p", { className: "max-w-xs text-xs text-muted-foreground", children: "Every command the agent runs and every file it reads or writes in this box will appear here as it happens." })
+    ] });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "h-full overflow-y-auto", "data-testid": "sandbox-activity-feed" }, rows.map((row) => /* @__PURE__ */ React.createElement(ActivityRow, { key: row.callId, row })));
+  return /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-auto", "data-testid": "sandbox-activity-feed", children: rows.map((row) => /* @__PURE__ */ jsx(ActivityRow, { row }, row.callId)) });
 }
 export {
   SandboxActivityFeed