@invergent/agent-chat-react 1.6.7 → 1.6.9

package/dist/index.cjs

@@ -908,8 +908,7 @@ var useReasoning = () => {
   }
   return context;
 };
-var AUTO_CLOSE_DELAY = 1e3;
-var AUTO_OPEN_DELAY = 100;
+var MIN_DURATION_MS = 100;
 var MS_IN_S = 1e3;
 var Reasoning = react.memo(
   ({
@@ -923,7 +922,6 @@ var Reasoning = react.memo(
     ...props
   }) => {
     const resolvedDefaultOpen = defaultOpen ?? false;
-    const isExplicitlyClosed = defaultOpen === false;
     const [isOpen, setIsOpen] = reactUseControllableState.useControllableState({
       defaultProp: resolvedDefaultOpen,
       onChange: onOpenChange,
@@ -933,8 +931,6 @@ var Reasoning = react.memo(
       defaultProp: void 0,
       prop: durationProp
     });
-    const hasEverStreamedRef = react.useRef(false);
-    const [hasAutoClosed, setHasAutoClosed] = react.useState(false);
     const startTimeRef = react.useRef(null);
     react.useEffect(() => {
       if (isStreaming) {
@@ -944,29 +940,11 @@ var Reasoning = react.memo(
       } else if (startTimeRef.current !== null) {
         const elapsed = Date.now() - startTimeRef.current;
         startTimeRef.current = null;
-        if (elapsed >= AUTO_OPEN_DELAY) {
-          hasEverStreamedRef.current = true;
+        if (elapsed >= MIN_DURATION_MS) {
           setDuration(Math.ceil(elapsed / MS_IN_S));
         }
       }
     }, [isStreaming, setDuration]);
-    react.useEffect(() => {
-      if (!isStreaming || isOpen || isExplicitlyClosed) return;
-      const timer = setTimeout(() => {
-        hasEverStreamedRef.current = true;
-        setIsOpen(true);
-      }, AUTO_OPEN_DELAY);
-      return () => clearTimeout(timer);
-    }, [isStreaming, isOpen, setIsOpen, isExplicitlyClosed]);
-    react.useEffect(() => {
-      if (hasEverStreamedRef.current && !isStreaming && isOpen && !hasAutoClosed) {
-        const timer = setTimeout(() => {
-          setIsOpen(false);
-          setHasAutoClosed(true);
-        }, AUTO_CLOSE_DELAY);
-        return () => clearTimeout(timer);
-      }
-    }, [isStreaming, isOpen, setIsOpen, hasAutoClosed]);
     const handleOpenChange = react.useCallback(
       (newOpen) => {
         setIsOpen(newOpen);
@@ -1392,7 +1370,7 @@ function TerminalCollapsible({ command, output, isRunning, hasError }) {
       className: "not-prose w-full",
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs(CollapsibleTrigger, { className: "group/trigger flex w-fit items-center gap-2 text-sm transition-colors", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-left", children: isRunning ? /* @__PURE__ */ jsxRuntime.jsx(Shimmer, { as: "span", duration: 1, children: "Running command..." }) : hasError ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-destructive", children: "Command failed" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-foreground", children: "Command result" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-left", children: isRunning ? /* @__PURE__ */ jsxRuntime.jsx(Shimmer, { as: "span", duration: 1, children: "Running command..." }) : hasError ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-destructive", children: "Command failed" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-foreground", children: "Command" }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             lucideReact.ChevronDownIcon,
             {
@@ -1443,14 +1421,16 @@ function TerminalToolBlock({ tc }) {
   const isRunning = tc.status === "running";
   const result = parseTerminalResult(tc.result, tc.args);
   if (result) {
-    const output = result.output || result.error || "";
+    const hasError = result.exit_code !== 0 || Boolean(result.error);
+    if (hasError) return null;
+    const output = result.output || "";
     return /* @__PURE__ */ jsxRuntime.jsx(
       TerminalCollapsible,
       {
         command: result.command,
         output,
         isRunning,
-        hasError: result.exit_code !== 0 || Boolean(result.error)
+        hasError: false
       }
     );
   }
@@ -2291,10 +2271,7 @@ function WebToolBlock({ tc }) {
   let displayText = "";
   try {
     const args = JSON.parse(tc.args);
-    if (tc.toolName === "web_extract") {
-      const urls = args.urls ?? [];
-      displayText = urls[0] ?? "";
-    } else if (tc.toolName === "web_search") {
+    if (tc.toolName === "web_search") {
       displayText = args.query ?? "";
     } else if (tc.toolName === "web_crawl") {
       displayText = args.url ?? "";
@@ -2302,12 +2279,10 @@ function WebToolBlock({ tc }) {
   } catch {
   }
   const toolLabel2 = {
-    web_extract: "Web Fetch",
     web_search: "Web Search",
     web_crawl: "Web Crawl"
   }[tc.toolName] ?? tc.toolName;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm py-0.5", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: toolLabel2 }),
     displayText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/70 truncate text-xs", children: displayText })
   ] });
@@ -2327,6 +2302,89 @@ function VisionAnalyzeBlock({ tc }) {
   ] });
 }
 init_utils();
+function parseUrls(rawArgs) {
+  try {
+    const args = JSON.parse(rawArgs);
+    if (Array.isArray(args.urls)) {
+      return args.urls.filter((u) => typeof u === "string");
+    }
+  } catch {
+  }
+  return [];
+}
+function parseResult(rawResult) {
+  const byUrl = /* @__PURE__ */ new Map();
+  if (!rawResult) return { byUrl, toolError: null };
+  try {
+    const parsed = JSON.parse(rawResult);
+    const entries = Array.isArray(parsed?.results) ? parsed.results : [];
+    for (const entry of entries) {
+      if (entry && typeof entry.url === "string") {
+        byUrl.set(entry.url, entry);
+      }
+    }
+    if (byUrl.size === 0 && typeof parsed?.error === "string") {
+      return { byUrl, toolError: parsed.error };
+    }
+  } catch {
+  }
+  return { byUrl, toolError: null };
+}
+function domain(url) {
+  try {
+    return new URL(url).hostname.replace(/^www\./, "");
+  } catch {
+    return url;
+  }
+}
+function WebExtractToolBlock({ tc }) {
+  const urls = parseUrls(tc.args);
+  const { byUrl, toolError } = parseResult(tc.result);
+  const isComplete = tc.status === "complete" || tc.status === "error";
+  if (urls.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm py-0.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: "Web Fetch" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: "Web Fetch" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/70 text-xs", children: [
+        urls.length,
+        " URL",
+        urls.length !== 1 ? "s" : ""
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-1 ml-5 space-y-0.5", children: urls.map((url, i) => {
+      const entry = byUrl.get(url);
+      const perUrlError = entry?.error;
+      const failure = perUrlError ?? (isComplete && !entry ? toolError : null);
+      const fetched = entry && !perUrlError;
+      const pending = !isComplete && !entry;
+      const row = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-xs", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              "truncate",
+              pending ? "text-muted-foreground/50" : "text-muted-foreground"
+            ),
+            children: domain(url)
+          }
+        ),
+        fetched && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "size-3 text-green-500/70 shrink-0" }),
+        failure && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "size-3 text-red-500/80 shrink-0" })
+      ] });
+      return /* @__PURE__ */ jsxRuntime.jsx("li", { children: failure ? /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: row }),
+        /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "top", children: failure })
+      ] }) : row }, `${url}-${i}`);
+    }) })
+  ] });
+}
+init_utils();
 
 // src/components/chat/diff-viewer.tsx
 init_utils();
@@ -3015,7 +3073,7 @@ function parseArgs2(args) {
     return { action: "unknown" };
   }
 }
-function parseResult(result) {
+function parseResult2(result) {
   if (!result) return null;
   try {
     return JSON.parse(result);
@@ -3233,7 +3291,7 @@ function OutputPreview({ output }) {
 function ProcessToolBlock({ tc }) {
   const isRunning = tc.status === "running";
   const args = parseArgs2(tc.args);
-  const result = parseResult(tc.result);
+  const result = parseResult2(tc.result);
   const action = args.action || "unknown";
   const actionLabel = {
     list: "Process List",
@@ -4289,6 +4347,7 @@ function ToolCallBlock({
     case "session_search":
       return /* @__PURE__ */ jsxRuntime.jsx(SessionSearchBlock, { tc });
     case "web_extract":
+      return /* @__PURE__ */ jsxRuntime.jsx(WebExtractToolBlock, { tc });
     case "web_search":
     case "web_crawl":
       return /* @__PURE__ */ jsxRuntime.jsx(WebToolBlock, { tc });
@@ -4330,6 +4389,51 @@ function ToolCallBlock({
       return /* @__PURE__ */ jsxRuntime.jsx(DefaultToolBlock, { tc });
   }
 }
+function parseQuery(rawArgs) {
+  try {
+    const args = JSON.parse(rawArgs);
+    return typeof args.query === "string" ? args.query : "";
+  } catch {
+    return "";
+  }
+}
+function parseResultCount2(rawResult) {
+  if (!rawResult) return null;
+  try {
+    const parsed = JSON.parse(rawResult);
+    if (Array.isArray(parsed?.data?.web)) return parsed.data.web.length;
+    if (Array.isArray(parsed?.results)) return parsed.results.length;
+  } catch {
+  }
+  return null;
+}
+function WebSearchRow({ tc }) {
+  const query = parseQuery(tc.args);
+  const count = parseResultCount2(tc.result);
+  const showCount = count !== null && tc.status === "complete";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-xs min-w-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground truncate", children: query || "\u2014" }),
+    showCount && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/50 shrink-0", children: [
+      count,
+      " result",
+      count !== 1 ? "s" : ""
+    ] })
+  ] });
+}
+function WebSearchGroupBlock({ tcs }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: "Web Search" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/70 text-xs", children: [
+        tcs.length,
+        " ",
+        tcs.length === 1 ? "query" : "queries"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-1 ml-5 space-y-0.5", children: tcs.map((tc) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(WebSearchRow, { tc }) }, tc.id)) })
+  ] });
+}
 var ChatMessage = react.memo(function ChatMessage2({
   message,
   isLast,
@@ -5756,6 +5860,11 @@ function ChatComposerInner({
     const builtin = [
       { value: "/clear", label: "/clear", description: "Clear conversation" },
       { value: "/compress", label: "/compress", description: "Compress context" },
+      { value: "/goal", label: "/goal", description: "Define an outcome goal" },
+      { value: "/goal status", label: "/goal status", description: "Show outcome goal status" },
+      { value: "/goal pause", label: "/goal pause", description: "Pause automatic goal continuation" },
+      { value: "/goal resume", label: "/goal resume", description: "Resume a paused goal" },
+      { value: "/goal clear", label: "/goal clear", description: "Clear the current goal" },
       { value: "/loop", label: "/loop", description: "Schedule recurring prompt" },
       { value: "/loop list", label: "/loop list", description: "List active loops" },
       { value: "/loop cancel", label: "/loop cancel", description: "Cancel a loop by ID" }
@@ -6549,6 +6658,10 @@ function messageToEntries(msg, isLast, artifactFallbacks) {
         });
         continue;
       }
+      if (tc.toolName === "terminal" && tc.status !== "running") {
+        const parsed = parseTerminalResult(tc.result, tc.args);
+        if (parsed && (parsed.exit_code !== 0 || parsed.error)) continue;
+      }
       entries.push({ kind: "tool", key: tc.id, tc });
     }
   }
@@ -6589,6 +6702,33 @@ function groupBrowserActivityEntries(entries) {
 function isBrowserToolCall(call) {
   return call.toolName.startsWith("browser_");
 }
+function groupWebSearchEntries(entries) {
+  const grouped = [];
+  let buffer = [];
+  const flush = () => {
+    if (buffer.length === 0) return;
+    if (buffer.length === 1) {
+      grouped.push({ kind: "tool", key: buffer[0].id, tc: buffer[0] });
+    } else {
+      grouped.push({
+        kind: "web_search_group",
+        key: `web-search-${buffer[0].id}-${buffer[buffer.length - 1].id}`,
+        calls: buffer
+      });
+    }
+    buffer = [];
+  };
+  for (const entry of entries) {
+    if (entry.kind === "tool" && entry.tc.toolName === "web_search") {
+      buffer.push(entry.tc);
+      continue;
+    }
+    flush();
+    grouped.push(entry);
+  }
+  flush();
+  return grouped;
+}
 function groupMessages(messages) {
   const groups = [];
   let pendingSystem = [];
@@ -6754,6 +6894,18 @@ function TimelineEntryItem({
       /* @__PURE__ */ jsxRuntime.jsx(TimelineContent, { children: /* @__PURE__ */ jsxRuntime.jsx(BrowserActivityGroup, { calls: entry.calls }) })
     ] });
   }
+  if (entry.kind === "web_search_group") {
+    const allComplete = entry.calls.every((tc) => tc.status === "complete");
+    const anyRunning = entry.calls.some((tc) => tc.status === "running");
+    const indicatorClass = anyRunning ? "bg-emerald-500 animate-pulse" : allComplete ? "bg-emerald-500" : "bg-red-500";
+    return /* @__PURE__ */ jsxRuntime.jsxs(TimelineItem, { step, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(TimelineHeader, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(TimelineSeparator, { style: { backgroundColor: "var(--color-border)" } }),
+        /* @__PURE__ */ jsxRuntime.jsx(TimelineIndicator, { className: cn("size-2 border-none", indicatorClass) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(TimelineContent, { children: /* @__PURE__ */ jsxRuntime.jsx(WebSearchGroupBlock, { tcs: entry.calls }) })
+    ] });
+  }
   if (entry.kind === "text") {
     return /* @__PURE__ */ jsxRuntime.jsxs(TimelineItem, { step, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(TimelineHeader, { children: [
@@ -6821,6 +6973,7 @@ function AssistantGroup({
     entries.push(...messageToEntries(messages[i], isLast, artifactFallbacks));
   }
   entries = groupBrowserActivityEntries(entries);
+  entries = groupWebSearchEntries(entries);
   const isTailGroup = lastGlobalIndex === totalMessages - 1;
   const lastEntry = entries[entries.length - 1];
   const hasRunningTool = entries.some(
@@ -8985,11 +9138,12 @@ function useAgentChatRuntime({
   const send = react.useCallback(
     async (content, images) => {
       markSending(content, images);
+      const goal = images?.length ? null : parseGoalDefinition(content);
       if (!sessionId) {
         try {
           const session2 = await adapter.createSession({ agentId });
           onSessionChange?.(session2.id);
-          await adapter.sendMessage({ sessionId: session2.id, content, images });
+          await sendTurn(adapter, session2.id, content, images, goal);
         } catch (error) {
           markSendError(error instanceof Error ? error.message : "send failed");
           throw error;
@@ -8998,7 +9152,7 @@ function useAgentChatRuntime({
       }
       try {
         ensureStreamForNewTurn(sessionId);
-        await adapter.sendMessage({ sessionId, content, images });
+        await sendTurn(adapter, sessionId, content, images, goal);
       } catch (error) {
         markSendError(error instanceof Error ? error.message : "send failed");
         throw error;
@@ -9071,6 +9225,30 @@ function findLastAssistantIndex2(messages) {
   }
   return -1;
 }
+var GOAL_RUBRIC_RE = /\n\s*(?:rubric|criteria)\s*:\s*\n/i;
+var GOAL_CONTROL_COMMANDS = /* @__PURE__ */ new Set(["", "status", "pause", "resume", "clear"]);
+async function sendTurn(adapter, sessionId, content, images, goal) {
+  if (goal && adapter.defineOutcome) {
+    await adapter.defineOutcome({
+      sessionId,
+      description: goal.description,
+      rubric: goal.rubric
+    });
+    return;
+  }
+  await adapter.sendMessage({ sessionId, content, images });
+}
+function parseGoalDefinition(content) {
+  const text = content.trim();
+  if (text !== "/goal" && !text.startsWith("/goal ")) return null;
+  const args = text.slice("/goal".length).trim();
+  if (GOAL_CONTROL_COMMANDS.has(args.toLowerCase())) return null;
+  const match = GOAL_RUBRIC_RE.exec(args);
+  const description = (match ? args.slice(0, match.index) : args).trim();
+  if (!description) return null;
+  const rubric = match ? args.slice(match.index + match[0].length).trim() : "";
+  return rubric ? { description, rubric } : { description };
+}
 function AgentChat({
   adapter,
   agentId,
@@ -9168,7 +9346,7 @@ function AgentChat({
                     "div",
                     {
                       "data-testid": "workspace-panel-frame",
-                      className: hasBrowserPanel ? "h-1/2 min-h-0 w-full overflow-hidden" : "min-h-0",
+                      className: hasBrowserPanel ? "h-1/2 min-h-0 w-full overflow-hidden" : "min-h-0 h-full",
                       children: /* @__PURE__ */ jsxRuntime.jsx(
                         WorkspacePanel,
                         {
@@ -9887,10 +10065,11 @@ function formatKind(value) {
   if (!value) return "Scheduled";
   return value.split(/[_-]+/).filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
 }
-function formatRelative2(value, label) {
+function formatRelative2(value, label, future = false) {
   if (!value) return null;
   const date = new Date(value);
   if (Number.isNaN(date.getTime())) return null;
+  if (future && date.getTime() <= Date.now()) return `${label} due now`;
   return `${label} ${dateFns.formatDistanceToNow(date, { addSuffix: true })}`;
 }
 function formatRuns(count) {
@@ -9937,10 +10116,10 @@ function ScheduledWorkRow({
   const lastSessionId = item.lastSessionId ?? null;
   const meta = [
     scheduleDisplay(item),
-    formatRelative2(item.nextRunAt, "Next"),
+    formatRelative2(item.nextRunAt, "Next", true),
     formatRelative2(item.lastRunAt, "Last"),
     formatRuns(item.runCount),
-    item.expiresAt ? formatRelative2(item.expiresAt, "Expires") : null
+    item.expiresAt ? formatRelative2(item.expiresAt, "Expires", true) : null
   ].filter(Boolean);
   const openLastRun = () => {
     if (lastSessionId) onOpenLastRun(lastSessionId);
@@ -10292,8 +10471,7 @@ function TreeNodeRow({
   const title = entry.title ?? fallbackSessionTitle(entry);
   const subtitle = [
     formatRunKind(entry.runKind),
-    entry.agentType,
-    entry.model ?? "default",
+    entry.model ?? entry.agentType,
     formatSessionTime(entry.updatedAt)
   ].filter(Boolean).join(" \xB7 ");
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -10348,7 +10526,10 @@ function TreeNodeRow({
             "button",
             {
               type: "button",
-              className: "p-1 rounded opacity-0 group-hover:opacity-100 focus-visible:opacity-100 hover:bg-destructive/10 hover:text-destructive disabled:pointer-events-none disabled:opacity-50 transition-all",
+              className: cn(
+                "p-1 rounded hover:bg-destructive/10 hover:text-destructive disabled:pointer-events-none transition-all",
+                deletingSessionId === entry.id ? "opacity-100" : "opacity-0 group-hover:opacity-100 focus-visible:opacity-100"
+              ),
               onClick: (e) => {
                 e.stopPropagation();
                 onDelete(entry.id);
@@ -10356,7 +10537,7 @@ function TreeNodeRow({
               "aria-label": "Delete session",
               title: "Delete session",
               disabled: deletingSessionId === entry.id,
-              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2Icon, { className: "w-3 h-3" })
+              children: deletingSessionId === entry.id ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2Icon, { className: "w-3 h-3 animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2Icon, { className: "w-3 h-3" })
             }
           )
         ]