@invergent/agent-chat-react 1.6.7 → 1.6.8

package/dist/index.d.cts

@@ -335,6 +335,16 @@ interface AgentChatAdapter {
         eventId?: number;
         status?: string;
     }>;
+    defineOutcome?(input: {
+        sessionId: string;
+        description: string;
+        rubric?: string;
+        maxIterations?: number;
+    }): Promise<{
+        eventId?: number;
+        outcomeId?: string;
+        processedAt?: string;
+    }>;
     pauseSession(input: {
         sessionId: string;
     }): Promise<void>;

package/dist/index.d.ts

@@ -335,6 +335,16 @@ interface AgentChatAdapter {
         eventId?: number;
         status?: string;
     }>;
+    defineOutcome?(input: {
+        sessionId: string;
+        description: string;
+        rubric?: string;
+        maxIterations?: number;
+    }): Promise<{
+        eventId?: number;
+        outcomeId?: string;
+        processedAt?: string;
+    }>;
     pauseSession(input: {
         sessionId: string;
     }): Promise<void>;

package/dist/index.js

@@ -1,6 +1,6 @@
 import { cn } from './chunk-QSC4UIVT.js';
 import { createContext, memo, useRef, useState, useEffect, useCallback, useMemo, lazy, useContext, Suspense, Children } from 'react';
-import { ChevronDownIcon, AlertTriangle, ChevronDown, ChevronRight, RefreshCw, ChevronRightIcon, GitBranchIcon, XIcon, ThumbsUpIcon, ThumbsDownIcon, ActivityIcon, Loader2Icon, EyeIcon, GlobeIcon, SearchIcon, ListTodoIcon, XCircleIcon, CheckCircle2Icon, Code, CheckIcon, CopyIcon, TerminalIcon, Trash2Icon, CircleDotIcon, CircleCheckIcon, CircleXIcon, SkullIcon, ClockIcon, CheckCircleIcon, CircleIcon, InboxIcon, CalendarClockIcon, UsersIcon, MessageSquareIcon, ZapIcon, Maximize2Icon, FolderOpenIcon, UploadIcon, RefreshCwIcon, AlertCircleIcon, ExternalLinkIcon, ClipboardCheckIcon, ShieldAlertIcon, TimerIcon, SquareIcon, ArrowDownIcon, RotateCcwIcon, MousePointer2Icon, DownloadIcon, TrashIcon, ImageIcon, FileTextIcon, FolderIcon, FileIcon, ChevronLeftIcon, MinusIcon, PlusIcon, CornerDownLeftIcon } from 'lucide-react';
+import { ChevronDownIcon, AlertTriangle, ChevronDown, ChevronRight, RefreshCw, ChevronRightIcon, GitBranchIcon, XIcon, ThumbsUpIcon, ThumbsDownIcon, ActivityIcon, Loader2Icon, EyeIcon, GlobeIcon, CheckIcon, SearchIcon, ListTodoIcon, XCircleIcon, CheckCircle2Icon, Code, CopyIcon, TerminalIcon, Trash2Icon, CircleDotIcon, CircleCheckIcon, CircleXIcon, SkullIcon, ClockIcon, CheckCircleIcon, CircleIcon, InboxIcon, CalendarClockIcon, UsersIcon, MessageSquareIcon, ZapIcon, Maximize2Icon, FolderOpenIcon, UploadIcon, RefreshCwIcon, AlertCircleIcon, ExternalLinkIcon, ClipboardCheckIcon, ShieldAlertIcon, TimerIcon, SquareIcon, ArrowDownIcon, RotateCcwIcon, MousePointer2Icon, DownloadIcon, TrashIcon, ImageIcon, FileTextIcon, FolderIcon, FileIcon, ChevronLeftIcon, MinusIcon, PlusIcon, CornerDownLeftIcon } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import { Collapsible as Collapsible$1, Slot, Dialog as Dialog$1, ScrollArea as ScrollArea$1, Tooltip as Tooltip$1, Tabs as Tabs$1, Popover as Popover$1, DropdownMenu as DropdownMenu$1, HoverCard as HoverCard$1, Progress as Progress$1 } from 'radix-ui';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -2064,10 +2064,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 ?? "";
@@ -2075,12 +2072,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__ */ jsxs("div", { className: "flex items-center gap-2 text-sm py-0.5", children: [
-    /* @__PURE__ */ jsx(GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
     /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: toolLabel2 }),
     displayText && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/70 truncate text-xs", children: displayText })
   ] });
@@ -2099,6 +2094,88 @@ function VisionAnalyzeBlock({ tc }) {
     image && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/70 truncate text-xs", children: image })
   ] });
 }
+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__ */ jsxs("div", { className: "flex items-center gap-2 text-sm py-0.5", children: [
+      /* @__PURE__ */ jsx(GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Web Fetch" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx(GlobeIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Web Fetch" }),
+      /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/70 text-xs", children: [
+        urls.length,
+        " URL",
+        urls.length !== 1 ? "s" : ""
+      ] })
+    ] }),
+    /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-center gap-2 text-xs", children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "truncate",
+              pending ? "text-muted-foreground/50" : "text-muted-foreground"
+            ),
+            children: domain(url)
+          }
+        ),
+        fetched && /* @__PURE__ */ jsx(CheckIcon, { className: "size-3 text-green-500/70 shrink-0" }),
+        failure && /* @__PURE__ */ jsx(XIcon, { className: "size-3 text-red-500/80 shrink-0" })
+      ] });
+      return /* @__PURE__ */ jsx("li", { children: failure ? /* @__PURE__ */ jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: row }),
+        /* @__PURE__ */ jsx(TooltipContent, { side: "top", children: failure })
+      ] }) : row }, `${url}-${i}`);
+    }) })
+  ] });
+}
 function splitChangeLines(change) {
   const v = change.value;
   if (v === "") return [];
@@ -2778,7 +2855,7 @@ function parseArgs2(args) {
     return { action: "unknown" };
   }
 }
-function parseResult(result) {
+function parseResult2(result) {
   if (!result) return null;
   try {
     return JSON.parse(result);
@@ -2996,7 +3073,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",
@@ -4033,6 +4110,7 @@ function ToolCallBlock({
     case "session_search":
       return /* @__PURE__ */ jsx(SessionSearchBlock, { tc });
     case "web_extract":
+      return /* @__PURE__ */ jsx(WebExtractToolBlock, { tc });
     case "web_search":
     case "web_crawl":
       return /* @__PURE__ */ jsx(WebToolBlock, { tc });
@@ -4074,6 +4152,51 @@ function ToolCallBlock({
       return /* @__PURE__ */ 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__ */ jsxs("div", { className: "flex items-center gap-2 text-xs min-w-0", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground truncate", children: query || "\u2014" }),
+    showCount && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/50 shrink-0", children: [
+      count,
+      " result",
+      count !== 1 ? "s" : ""
+    ] })
+  ] });
+}
+function WebSearchGroupBlock({ tcs }) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx(SearchIcon, { className: "size-3.5 text-muted-foreground/60 shrink-0" }),
+      /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Web Search" }),
+      /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/70 text-xs", children: [
+        tcs.length,
+        " ",
+        tcs.length === 1 ? "query" : "queries"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("ul", { className: "mt-1 ml-5 space-y-0.5", children: tcs.map((tc) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(WebSearchRow, { tc }) }, tc.id)) })
+  ] });
+}
 var ChatMessage = memo(function ChatMessage2({
   message,
   isLast,
@@ -5473,6 +5596,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" }
@@ -6296,6 +6424,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 = [];
@@ -6461,6 +6616,18 @@ function TimelineEntryItem({
       /* @__PURE__ */ jsx(TimelineContent, { children: /* @__PURE__ */ 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__ */ jsxs(TimelineItem, { step, children: [
+      /* @__PURE__ */ jsxs(TimelineHeader, { children: [
+        /* @__PURE__ */ jsx(TimelineSeparator, { style: { backgroundColor: "var(--color-border)" } }),
+        /* @__PURE__ */ jsx(TimelineIndicator, { className: cn("size-2 border-none", indicatorClass) })
+      ] }),
+      /* @__PURE__ */ jsx(TimelineContent, { children: /* @__PURE__ */ jsx(WebSearchGroupBlock, { tcs: entry.calls }) })
+    ] });
+  }
   if (entry.kind === "text") {
     return /* @__PURE__ */ jsxs(TimelineItem, { step, children: [
       /* @__PURE__ */ jsxs(TimelineHeader, { children: [
@@ -6528,6 +6695,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(
@@ -8683,11 +8851,12 @@ function useAgentChatRuntime({
   const send = 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;
@@ -8696,7 +8865,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;
@@ -8769,6 +8938,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,