@kortix/ui 0.14.12 → 0.14.13

package/dist/session/tool/tools/multi-agent-tool-data.js

@@ -0,0 +1,118 @@
+/**
+ * The `data` of a multi-agent tool result, parsed defensively for its card body.
+ *
+ * The shapes are in `packages/api-contract/src/multi-agent.ts` (`PeerMessageSendResult`,
+ * `ReachableAgents`, `SessionTask`). `@kortix/ui` does not depend on that package, so
+ * only the fields a card draws are mirrored here, and every one is checked. A value
+ * that does not parse is `null`: the card then draws its own rows, as every platform
+ * card does.
+ */
+const PEER_STATUSES = new Set(['delivered', 'held', 'refused', 'denied', 'expired', 'dropped']);
+const BOARD_STATES = new Set(['working', 'needs_input', 'idle', 'completed', 'failed', 'stopped']);
+const TASK_STATUSES = new Set(['pending', 'in_progress', 'completed']);
+/** A card body is a short list; a longer one is the tool's mistake, not a page to render. */
+const MAX_ROWS = 50;
+const isObject = (value) => typeof value === 'object' && value !== null && !Array.isArray(value);
+const text = (value) => (typeof value === 'string' && value.trim() ? value.trim() : null);
+const positiveInt = (value) => typeof value === 'number' && Number.isInteger(value) && value > 0 ? value : null;
+const handle = (value) => text(value)?.replace(/^@/, '') ?? null;
+/** `send_message`: `PeerMessageSendResult`. */
+export function parsePeerSend(data) {
+    if (!isObject(data) || !PEER_STATUSES.has(data.status))
+        return null;
+    const message = isObject(data.message) ? data.message : null;
+    const to = isObject(data.to) ? handle(data.to.handle) : null;
+    return {
+        status: data.status,
+        to: to ?? (message ? handle(message.to_handle) : null),
+        message: message ? text(message.message) : null,
+        summary: message ? text(message.summary) : null,
+        note: text(data.note),
+    };
+}
+function agentRow(value) {
+    if (!isObject(value))
+        return null;
+    const name = handle(value.handle);
+    const sessionId = text(value.session_id);
+    if (!name || !sessionId)
+        return null;
+    return {
+        handle: name,
+        sessionId,
+        title: text(value.title),
+        agentName: text(value.agent_name),
+        relation: text(value.relation) ?? 'session',
+        state: BOARD_STATES.has(value.state) ? value.state : null,
+        canReceive: value.can_receive !== false,
+    };
+}
+/** `list_agents`: `ReachableAgents` (the asking session itself is left out). */
+export function parseReachable(data) {
+    if (!isObject(data) || !Array.isArray(data.agents))
+        return null;
+    const rows = [];
+    for (const entry of data.agents.slice(0, MAX_ROWS)) {
+        const row = agentRow(entry);
+        if (row && row.relation !== 'self')
+            rows.push(row);
+    }
+    return rows;
+}
+function taskRow(value) {
+    if (!isObject(value))
+        return null;
+    const seq = positiveInt(value.seq);
+    const subject = text(value.subject);
+    if (seq === null || !subject || !TASK_STATUSES.has(value.status))
+        return null;
+    const blockedBy = Array.isArray(value.blocked_by)
+        ? value.blocked_by.map(positiveInt).filter((n) => n !== null)
+        : [];
+    return {
+        seq,
+        subject,
+        status: value.status,
+        owner: handle(value.owner_handle),
+        blockedBy,
+        blocked: value.blocked === true,
+    };
+}
+/** `task_*`: one `SessionTask`, or `{ tasks: SessionTask[] }`. */
+export function parseTasks(data) {
+    if (!isObject(data))
+        return null;
+    if (Array.isArray(data.tasks)) {
+        return data.tasks
+            .slice(0, MAX_ROWS)
+            .map(taskRow)
+            .filter((row) => row !== null);
+    }
+    if (isObject(data.task)) {
+        const row = taskRow(data.task);
+        return row ? [row] : null;
+    }
+    const row = taskRow(data);
+    return row ? [row] : null;
+}
+/** `task_stop`: the child it stopped, or null. */
+export function parseStoppedChild(data) {
+    if (!isObject(data) || typeof data.stopped !== 'boolean')
+        return null;
+    const sessionId = text(data.sessionId);
+    if (!sessionId)
+        return null;
+    return { sessionId, handle: handle(data.handle), title: text(data.title), stopped: data.stopped };
+}
+/**
+ * True when a running call's input has the shape of pi's `task_*` tools
+ * (apps/kortix-sandbox-agent-server/src/harness/pi/extensions/team-tasks.ts):
+ * `task_create { subject, … }`, `task_get { seq }`, `task_update { seq, … }`.
+ * The older plugin tools that share these names take neither. pi's
+ * `task_list {}` has no input to tell: its output decides once it settles.
+ */
+export function looksLikeTeamTaskInput(input) {
+    if (!isObject(input))
+        return false;
+    return typeof input.subject === 'string' || typeof input.seq === 'number';
+}

package/dist/session/tool/tools/multi-agent-tools.d.ts

@@ -0,0 +1,9 @@
+import type { ToolProps } from '../shared/types.js';
+/**
+ * `task_create`, `task_list`, `task_get` and `task_update` name two tools: pi's
+ * team task tools (flag `agent_teams`), which answer with a `KortixToolResult`
+ * card, and the older plugin tools of a transcript from before pi, which render
+ * their own rows. The output decides; a call still running decides by its input
+ * (pi's take a `subject`, a task number, a status or an owner).
+ */
+export declare function isTeamTaskCall(call: ToolProps['call']): boolean;

package/dist/session/tool/tools/multi-agent-tools.js

@@ -0,0 +1,38 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { partError, partInput, partRawOutput, partStatus } from '../shared/infrastructure.js';
+import { ToolRegistry } from '../shared/registry.js';
+import { AgentSpawnTool } from './agent-spawn-tool.js';
+import { AgentTaskUpdateTool } from './agent-task-update-tool.js';
+import { KortixActionTool } from './kortix-action-tool.js';
+import { parseKortixToolResult } from './kortix-tool-card.js';
+import { looksLikeTeamTaskInput } from './multi-agent-tool-data.js';
+import { TaskListTool } from './task-list-tool.js';
+/**
+ * `task_create`, `task_list`, `task_get` and `task_update` name two tools: pi's
+ * team task tools (flag `agent_teams`), which answer with a `KortixToolResult`
+ * card, and the older plugin tools of a transcript from before pi, which render
+ * their own rows. The output decides; a call still running decides by its input
+ * (pi's take a `subject`, a task number, a status or an owner).
+ */
+export function isTeamTaskCall(call) {
+    const status = partStatus(call);
+    if (status === 'completed' || status === 'error') {
+        const raw = status === 'error' ? (partError(call) ?? '') : partRawOutput(call);
+        return parseKortixToolResult(raw, call.name) !== null;
+    }
+    return looksLikeTeamTaskInput(partInput(call));
+}
+function teamTaskTool(legacy) {
+    function TeamTaskTool(props) {
+        const Component = isTeamTaskCall(props.call) ? KortixActionTool : legacy;
+        return _jsx(Component, { ...props });
+    }
+    TeamTaskTool.displayName = `TeamTaskTool(${legacy.displayName ?? legacy.name})`;
+    return TeamTaskTool;
+}
+// Registered after the older tools (`register.ts` imports this file last), so these win their keys.
+ToolRegistry.register('task-create', teamTaskTool(AgentSpawnTool));
+ToolRegistry.register('task-update', teamTaskTool(AgentTaskUpdateTool));
+ToolRegistry.register('task-list', teamTaskTool(TaskListTool));
+ToolRegistry.register('task-get', teamTaskTool(TaskListTool));

package/dist/session/tool/tools/question-tool.js

@@ -23,7 +23,7 @@ function AnswerText({ answers, options, }) {
 }
 function QuestionAnswerBlock({ question, index, answers, }) {
     const fallback = question.header?.trim() || `Question ${index + 1}`;
-    return (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: cn('text-foreground/80 text-xs text-pretty', MD_FLUSH_CLASSES), children: _jsx(UnifiedMarkdown, { content: question.question || question.header || fallback, trust: "agent" }) }), _jsx(AnswerText, { answers: answers, options: question.options })] }));
+    return (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: cn('text-foreground text-xs text-pretty [&_p]:whitespace-pre-line', MD_FLUSH_CLASSES), children: _jsx(UnifiedMarkdown, { content: question.question || question.header || fallback, trust: "agent" }) }), _jsx(AnswerText, { answers: answers, options: question.options })] }));
 }
 export function QuestionTool({ call, defaultOpen, forceOpen, locked, hasActiveQuestion, }) {
     const tI18nHardcoded = useTranslations('hardcodedUi');

package/dist/session/tool/tools/register.d.ts

@@ -16,6 +16,7 @@ import './glob-tool.js';
 import './grep-tool.js';
 import './image-gen-tool.js';
 import './image-search-tool.js';
+import './kortix-action-tool.js';
 import './list-tool.js';
 import './memory-search-tool.js';
 import './memory-tool.js';
@@ -52,4 +53,6 @@ import './triggers-tool.js';
 import './video-gen-tool.js';
 import './web-fetch-tool.js';
 import './web-search-tool.js';
+import './workflow-tool.js';
 import './write-tool.js';
+import './multi-agent-tools.js';

package/dist/session/tool/tools/register.js

@@ -16,6 +16,7 @@ import './glob-tool.js';
 import './grep-tool.js';
 import './image-gen-tool.js';
 import './image-search-tool.js';
+import './kortix-action-tool.js';
 import './list-tool.js';
 import './memory-search-tool.js';
 import './memory-tool.js';
@@ -52,4 +53,6 @@ import './triggers-tool.js';
 import './video-gen-tool.js';
 import './web-fetch-tool.js';
 import './web-search-tool.js';
+import './workflow-tool.js';
 import './write-tool.js';
+import './multi-agent-tools.js';

package/dist/session/tool/tools/session-spawn-tool.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Button } from '../../../primitives/button.js';
-import { SubSessionModal } from '../../thread/sub-session-modal.js';
+import { SubagentDialog } from '../../agents/subagent-view.js';
 import { partInput, partStatus } from '../shared/infrastructure.js';
 import { ToolRegistry } from '../shared/registry.js';
 import { SubAgentActivity, SubAgentStatusBanner, useSubAgentThread, } from '../shared/sub-agent.js';
@@ -49,7 +49,7 @@ export function SessionSpawnTool({ call, forceOpen }) {
         if (hasPreview)
             setModalOpen(true);
     };
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-component": "tool-trigger", className: cn('group text-muted-foreground/70 flex max-w-full items-center gap-1.5 py-0.5 text-xs transition-colors select-none', '[&>span:first-child>svg]:text-muted-foreground/50 [&>span:first-child>svg]:size-3.5'), children: [_jsx("span", { className: "shrink-0", children: _jsx(Cpu, {}) }), _jsxs("button", { type: "button", disabled: !hasPreview, onClick: openPreview, className: cn('flex min-w-0 flex-1 items-center gap-1.5 overflow-hidden text-left', hasPreview ? 'cursor-pointer' : 'cursor-default'), children: [_jsxs("span", { className: "shrink-0 whitespace-nowrap", children: [tI18nComplete.raw('text2ee7054bf895'), " ", agentName] }), subtitle && (_jsx("span", { className: "text-muted-foreground min-w-0 truncate font-mono text-xs", children: subtitle })), isRunning && (_jsx("span", { className: "ml-auto size-2 shrink-0 animate-pulse rounded-full bg-current opacity-50" })), isCompleted && childCalls.length > 0 && (_jsxs("span", { className: "text-muted-foreground/60 ml-auto shrink-0 font-mono text-xs whitespace-nowrap", children: [childCalls.length, " ", tI18nComplete.raw('textb7595e2a8639')] }))] }), childHref && (_jsx(Button, { asChild: true, variant: "ghost", size: "xs", className: "h-6 shrink-0 gap-1 px-1.5 text-xs", children: _jsxs(Link, { href: childHref, prefetch: true, children: [tI18nComplete.raw('textb205bb47f81a'), _jsx(ExternalLink, { className: "size-3" })] }) }))] }), forceOpen && childCalls.length > 0 && (_jsx(SubAgentActivity, { childSessionId: childSessionId, calls: childCalls })), _jsx(SubAgentStatusBanner, { childSessionId: childSessionId, childThread: childThread }), childSessionId && (_jsx(SubSessionModal, { open: modalOpen, onOpenChange: setModalOpen, sessionId: childSessionId, title: tI18nComplete('textc65feb0006ea', {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-component": "tool-trigger", className: cn('group text-muted-foreground/70 flex max-w-full items-center gap-1.5 py-0.5 text-xs transition-colors select-none', '[&>span:first-child>svg]:text-muted-foreground/50 [&>span:first-child>svg]:size-3.5'), children: [_jsx("span", { className: "shrink-0", children: _jsx(Cpu, {}) }), _jsxs("button", { type: "button", disabled: !hasPreview, onClick: openPreview, className: cn('flex min-w-0 flex-1 items-center gap-1.5 overflow-hidden text-left', hasPreview ? 'cursor-pointer' : 'cursor-default'), children: [_jsxs("span", { className: "shrink-0 whitespace-nowrap", children: [tI18nComplete.raw('text2ee7054bf895'), " ", agentName] }), subtitle && (_jsx("span", { className: "text-muted-foreground min-w-0 truncate font-mono text-xs", children: subtitle })), isRunning && (_jsx("span", { className: "ml-auto size-2 shrink-0 animate-pulse rounded-full bg-current opacity-50" })), isCompleted && childCalls.length > 0 && (_jsxs("span", { className: "text-muted-foreground/60 ml-auto shrink-0 font-mono text-xs whitespace-nowrap", children: [childCalls.length, " ", tI18nComplete.raw('textb7595e2a8639')] }))] }), childHref && (_jsx(Button, { asChild: true, variant: "ghost", size: "xs", className: "h-6 shrink-0 gap-1 px-1.5 text-xs", children: _jsxs(Link, { href: childHref, prefetch: true, children: [tI18nComplete.raw('textb205bb47f81a'), _jsx(ExternalLink, { className: "size-3" })] }) }))] }), forceOpen && childCalls.length > 0 && (_jsx(SubAgentActivity, { childSessionId: childSessionId, calls: childCalls })), _jsx(SubAgentStatusBanner, { childSessionId: childSessionId, childThread: childThread }), childSessionId && (_jsx(SubagentDialog, { open: modalOpen, onOpenChange: setModalOpen, sessionId: childSessionId, title: tI18nComplete('textc65feb0006ea', {
                     value0: agentName,
                     value1: label ? tI18nComplete('textb581fd88ea24', { value0: label }) : '',
                 }) }))] }));

package/dist/session/tool/tools/task-tool.d.ts

@@ -2,7 +2,7 @@ import type { ToolProps } from '../shared/types.js';
 /**
  * A task call is a disclosure row: what the sub-agent is doing, in place.
  *
- * This row used to be a plain button that opened `SubSessionModal` on any
+ * This row used to be a plain button that opened `SubagentDialog` on any
  * click. That put the only view of a running sub-agent behind a modal — the
  * reader had to leave the transcript to learn what the agent they just
  * dispatched was up to, and had to close it again to get back — while the

package/dist/session/tool/tools/task-tool.js

@@ -1,59 +1,35 @@
 'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { SubSessionModal } from '../../thread/sub-session-modal.js';
-import { BasicTool, firstMeaningfulLine, partInput, partStatus, partError, } from '../shared/infrastructure.js';
+import { SubagentDialog } from '../../agents/subagent-view.js';
+import { BasicTool, firstMeaningfulLine, partInput, partMetadata, partStatus, partError, } from '../shared/infrastructure.js';
 import { ToolRegistry } from '../shared/registry.js';
 import { SubAgentActivity, SubAgentStatusBanner, useSubAgentThread, } from '../shared/sub-agent.js';
 import { ToolError } from '../tool-error.js';
+import { FullViewAction } from '../shared/full-view-action.js';
 import { useTranslations } from '../../../i18n/index.js';
-import { cn } from '../../../lib/utils.js';
 import { getChildSessionId, getToolInfo } from '../../../internal/session-types/index.js';
 import { KanbanIcon as SquareKanban } from '@phosphor-icons/react';
 import { useCallback, useMemo, useState } from 'react';
 import { subAgentCalls } from '@kortix/sdk';
+import { useSessionStateStore } from '@kortix/sdk/react';
 /**
- * The way into the sub-agent's own session, pinned to the right edge of the row.
- *
- * It used to be a ghost `Button` at the BOTTOM of the disclosure body, and that
- * was wrong twice over. It sat at the body's left margin — the chain's icon
- * gutter — so it read as one more step in the sub-agent's list rather than as
- * an action on the agent. And it was reachable only by expanding the row, which
- * is backwards for a sub-agent that has not produced a step yet: that is the
- * one moment the full view is the ONLY thing there is to look at.
- *
- * A `span role="button"`, not a `<button>`. This node renders inside the
- * disclosure's trigger, and `DisclosureTrigger` clones that trigger into its own
- * `role="button"` element — a button nested in a button is invalid HTML. The
- * subtitle link in `InlineTriggerTitle` is the same shape for the same reason.
- * Both activation paths `stopPropagation` so reaching the full view does not
- * also toggle the row underneath it.
- *
- * Visible label "Full view", accessible name "Open full view". The row already
- * carries a title plus a live subtitle that has to truncate, so the right edge
- * gets the two words that matter; the longer name rides on `aria-label` and
- * `title`, and it CONTAINS the visible text, so WCAG 2.5.3 (Label in Name)
- * holds.
- *
- * Always visible, never hover-revealed: a hover-only affordance does not exist
- * on touch, and this is the only route to a running sub-agent's full transcript.
+ * Whether a background hand-off's child still works. The child's status is
+ * known while this tab streams it; without it, a child whose last reply has
+ * completed is not working, and any other child is taken as still at work.
  */
-function FullViewAction({ onOpen }) {
-    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
-    return (_jsx("span", { role: "button", tabIndex: 0, "aria-label": tI18nComplete.raw('text229fbeec6b2f'), title: tI18nComplete.raw('text229fbeec6b2f'), onClick: (e) => {
-            e.stopPropagation();
-            onOpen();
-        }, onKeyDown: (e) => {
-            if (e.key !== 'Enter' && e.key !== ' ')
-                return;
-            e.preventDefault();
-            e.stopPropagation();
-            onOpen();
-        }, className: cn('text-muted-foreground/60 hover:text-foreground', 'flex cursor-pointer items-center gap-1 whitespace-nowrap', 'underline-offset-2 transition-colors hover:underline'), children: tI18nComplete.raw('textdcc839a4015c') }));
+function useBackgroundWorking(childSessionId, childThread) {
+    const childStatus = useSessionStateStore((s) => (childSessionId ? s.sessionStatus[childSessionId] : undefined));
+    if (childStatus?.type === 'busy' || childStatus?.type === 'retry')
+        return true;
+    if (childStatus?.type === 'idle')
+        return false;
+    const last = childThread?.messages.findLast((m) => m.role === 'assistant');
+    return !last || last.completed_at === null;
 }
 /**
  * A task call is a disclosure row: what the sub-agent is doing, in place.
  *
- * This row used to be a plain button that opened `SubSessionModal` on any
+ * This row used to be a plain button that opened `SubagentDialog` on any
  * click. That put the only view of a running sub-agent behind a modal — the
  * reader had to leave the transcript to learn what the agent they just
  * dispatched was up to, and had to close it again to get back — while the
@@ -74,6 +50,7 @@ function FullViewAction({ onOpen }) {
  */
 export function TaskTool({ call, defaultOpen, forceOpen, locked }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const tAgent = useTranslations('tools.agent');
     const input = partInput(call);
     const status = partStatus(call);
     const subagentType = input.subagent_type || 'general';
@@ -88,6 +65,10 @@ export function TaskTool({ call, defaultOpen, forceOpen, locked }) {
     const childSessionId = useMemo(() => getChildSessionId(call), [call]);
     const childThread = useSubAgentThread(childSessionId);
     const childCalls = useMemo(() => subAgentCalls(childThread), [childThread]);
+    // `agent(…, { background: true })` returns as soon as the child exists. The call is
+    // over; the work goes on in the child's own session, and the row says so.
+    const background = partMetadata(call).background === true;
+    const backgroundWorking = useBackgroundWorking(background ? childSessionId : undefined, childThread);
     const [modalOpen, setModalOpen] = useState(false);
     const openModal = useCallback(() => setModalOpen(true), []);
     const isRunning = status === 'running' || status === 'pending';
@@ -105,6 +86,11 @@ export function TaskTool({ call, defaultOpen, forceOpen, locked }) {
         return info.title + (info.subtitle ? ` · ${info.subtitle}` : '');
     }, [childCalls]);
     const subtitle = isRunning ? (lastActivity ?? description) : description || undefined;
+    const backgroundLabel = background && childSessionId && !errorText
+        ? backgroundWorking
+            ? tAgent('backgroundWorking')
+            : tAgent('backgroundSession')
+        : undefined;
     /**
      * Whether this row can show the sub-agent's work WITHOUT leaving the
      * transcript.
@@ -121,6 +107,7 @@ export function TaskTool({ call, defaultOpen, forceOpen, locked }) {
     return (_jsxs(_Fragment, { children: [_jsx(BasicTool, { icon: _jsx(SquareKanban, { className: "size-3.5 shrink-0" }), trigger: {
                     title: tI18nComplete('text9471197a871a', { value0: subagentType }),
                     subtitle,
+                    args: backgroundLabel ? [backgroundLabel] : undefined,
                 }, defaultOpen: defaultOpen, forceOpen: forceOpen, locked: locked, badge: isCompleted && childCalls.length > 0 ? `${childCalls.length} steps` : undefined, triggerAction: childSessionId ? _jsx(FullViewAction, { onOpen: openModal }) : undefined, 
                 // A click on an agent row always leads somewhere. With steps in hand
                 // the row is a disclosure and opens them in place; with the child
@@ -132,9 +119,10 @@ export function TaskTool({ call, defaultOpen, forceOpen, locked }) {
                 // failure reason, which `ClickableToolRow` would drop, and the reason
                 // must stay readable on the row exactly as the generic error card
                 // showed it (KRTX-1746). The child thread stays one `View` away.
-                onClick: childSessionId && !hasInlineSteps && !errorText ? openModal : undefined, children: (errorText || hasInlineSteps) ? (_jsxs(_Fragment, { children: [errorText ? _jsx(ToolError, { error: errorText, toolName: call.name }) : undefined, hasInlineSteps ? (_jsx(SubAgentActivity, { childSessionId: childSessionId, calls: childCalls })) : undefined] })) : undefined }), _jsx(SubAgentStatusBanner, { childSessionId: childSessionId, childThread: childThread }), childSessionId && (_jsx(SubSessionModal, { open: modalOpen, onOpenChange: setModalOpen, sessionId: childSessionId, title: tI18nComplete('text7decbfdbacee', {
+                onClick: childSessionId && !hasInlineSteps && !errorText ? openModal : undefined, children: (errorText || hasInlineSteps) ? (_jsxs(_Fragment, { children: [errorText ? _jsx(ToolError, { error: errorText, toolName: call.name }) : undefined, hasInlineSteps ? (_jsx(SubAgentActivity, { childSessionId: childSessionId, calls: childCalls })) : undefined] })) : undefined }), _jsx(SubAgentStatusBanner, { childSessionId: childSessionId, childThread: childThread }), childSessionId && (_jsx(SubagentDialog, { open: modalOpen, onOpenChange: setModalOpen, sessionId: childSessionId, title: tI18nComplete('text7decbfdbacee', {
                     value0: subagentType,
                     value1: description ? tI18nComplete('textb581fd88ea24', { value0: description }) : '',
                 }) }))] }));
 }
+// pi's `agent` (`task` is its deprecated alias) reaches this row through its kind (`toolKind`).
 ToolRegistry.register('task', TaskTool);

package/dist/session/tool/tools/workflow-progress.d.ts

@@ -0,0 +1,34 @@
+import { type WorkflowAgentStatus, type WorkflowPhaseStatus, type WorkflowRun, type WorkflowRunAgent } from './workflow-run.js';
+/**
+ * One status mark for a run, a phase or an agent: a spinner while it works, else the
+ * outcome. The glyph is decoration; the word beside it is for a screen reader.
+ */
+export declare function StateMark({ status, label, }: {
+    status: WorkflowPhaseStatus | WorkflowAgentStatus;
+    label: string;
+}): import("react").JSX.Element;
+/** The script's newest `log()` lines, muted, above the phases. */
+export declare function WorkflowLogs({ logs }: {
+    logs: string[];
+}): import("react").JSX.Element | null;
+export interface AgentStopState {
+    /** Whether a row's agent can be stopped from here at all (a project, a live run). */
+    enabled: boolean;
+    /** Session ids whose stop is in flight. */
+    pending: ReadonlySet<string>;
+    stop: (agent: WorkflowRunAgent) => void;
+    /** Claude Code's `r`: stop a running agent and start it again with the same prompt. Absent: no Restart. */
+    restart?: {
+        /** The agent session whose restart is in flight. */
+        pending?: string;
+        run: (agent: WorkflowRunAgent) => void;
+    };
+}
+export declare function WorkflowProgress({ run, live, now, onOpen, stop, }: {
+    run: WorkflowRun;
+    /** The run is under way in this call: elapsed time ticks and running rows can be stopped. */
+    live: boolean;
+    now: number;
+    onOpen: (agent: WorkflowRunAgent) => void;
+    stop: AgentStopState;
+}): import("react").JSX.Element | null;

package/dist/session/tool/tools/workflow-progress.js

@@ -0,0 +1,186 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../primitives/button.js';
+import { CountBadge } from '../../../primitives/count-badge.js';
+import { Hint } from '../../../primitives/hint.js';
+import Loading from '../../../primitives/loading.js';
+import { Tabs, TabsListCompact, TabsTriggerCompact } from '../../../primitives/tabs.js';
+import { useToolIndent } from '../shared/infrastructure.js';
+import { OutputBlock } from '../shared/output-block.js';
+import { ToolResultCard } from '../shared/result-card.js';
+import { useTranslations } from '../../../i18n/index.js';
+import { cn } from '../../../lib/utils.js';
+import { ArrowClockwiseIcon, CaretRightIcon, CheckIcon, CircleDashedIcon, MinusIcon, SquareIcon, WarningIcon, } from '@phosphor-icons/react';
+import { useCallback, useId, useMemo, useState } from 'react';
+import { AGENT_FILTERS, agentMatches, countAgents, elapsedMs, formatElapsed, groupAgents, structuredSummary, } from './workflow-run.js';
+/**
+ * The body of a workflow card: Claude Code's `/workflows` progress view, in the chat.
+ *
+ * The script's newest `log()` lines, then one group per phase with its agent count
+ * and state (a phase the script declared but has not reached is listed, greyed), and
+ * under each phase one dense row per agent. More than {@link FILTER_FROM} agents get a
+ * status filter (`f` cycles it, as in Claude Code); ↑ and ↓ move between rows, Enter
+ * opens the focused agent's session. A phase longer than {@link CAP_FROM} rows shows its
+ * first {@link GROUP_CAP} and a "Show all" button, inside one scroll container for the run.
+ *
+ * Nothing moves while the run updates: rows append in start order, every number is
+ * `tabular-nums`, the elapsed column and the Stop slot keep a fixed width.
+ */
+/** More agents than this get the status filter. */
+const FILTER_FROM = 8;
+/** A group with more rows than this (Claude Code's "Large workflow" line) is capped… */
+const CAP_FROM = 25;
+/** …to this many rows and a "Show all" button. */
+const GROUP_CAP = 20;
+/**
+ * One status mark for a run, a phase or an agent: a spinner while it works, else the
+ * outcome. The glyph is decoration; the word beside it is for a screen reader.
+ */
+export function StateMark({ status, label, }) {
+    return (_jsxs(_Fragment, { children: [status === 'starting' || status === 'running' ? (
+            // `Loading` paints itself `text-background` inside a button; an agent row is one.
+            _jsx(Loading, { className: "text-muted-foreground in-[button]:text-muted-foreground size-3 shrink-0" })) : status === 'done' ? (_jsx(CheckIcon, { "aria-hidden": true, className: "text-kortix-green size-3 shrink-0" })) : status === 'failed' ? (_jsx(WarningIcon, { weight: "fill", "aria-hidden": true, className: "text-kortix-red size-3 shrink-0" })) : status === 'pending' ? (_jsx(CircleDashedIcon, { "aria-hidden": true, className: "text-muted-foreground size-3 shrink-0" })) : (_jsx(MinusIcon, { "aria-hidden": true, className: "text-muted-foreground size-3 shrink-0" })), _jsx("span", { className: "sr-only", children: label })] }));
+}
+/** The script's newest `log()` lines, muted, above the phases. */
+export function WorkflowLogs({ logs }) {
+    const t = useTranslations('tools.workflow');
+    const indent = useToolIndent();
+    if (logs.length === 0)
+        return null;
+    return (_jsx("ol", { "aria-label": t('logLabel'), className: cn('text-muted-foreground space-y-0.5 text-xs text-pretty wrap-anywhere', indent && 'mt-1.5', indent), children: logs.map((line, index) => (
+        // Lines repeat and carry no id; the list is the newest 5, replaced whole.
+        _jsx("li", { children: line }, `${index}:${line}`))) }));
+}
+export function WorkflowProgress({ run, live, now, onOpen, stop, }) {
+    const t = useTranslations('tools.workflow');
+    const [filter, setFilter] = useState('all');
+    const [collapsed, setCollapsed] = useState(() => new Set());
+    const [uncapped, setUncapped] = useState(() => new Set());
+    const groups = useMemo(() => groupAgents(run), [run]);
+    const counts = useMemo(() => countAgents(run.agents), [run.agents]);
+    const showFilter = run.agents.length > FILTER_FROM;
+    const active = showFilter ? filter : 'all';
+    // The elapsed column exists only when some agent reports when it started.
+    const timed = run.agents.some((agent) => agent.startedAt !== undefined);
+    const toggle = useCallback((setter, key) => setter((previous) => {
+        const next = new Set(previous);
+        if (next.has(key))
+            next.delete(key);
+        else
+            next.add(key);
+        return next;
+    }), []);
+    const cycleFilter = useCallback((step) => {
+        setFilter((current) => {
+            const index = AGENT_FILTERS.indexOf(current);
+            return AGENT_FILTERS[(index + step + AGENT_FILTERS.length) % AGENT_FILTERS.length];
+        });
+    }, []);
+    const onKeyDown = useCallback((event) => {
+        if (event.defaultPrevented || event.altKey || event.ctrlKey || event.metaKey)
+            return;
+        const target = event.target;
+        if (target.closest('input, textarea, [contenteditable="true"]'))
+            return;
+        if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+            const rows = Array.from(event.currentTarget.querySelectorAll('[data-workflow-row]'));
+            const index = rows.indexOf(target.closest('[data-workflow-row]'));
+            if (index === -1)
+                return;
+            const next = rows[index + (event.key === 'ArrowDown' ? 1 : -1)];
+            if (!next)
+                return;
+            event.preventDefault();
+            next.focus();
+        }
+        else if ((event.key === 'f' || event.key === 'F') && showFilter) {
+            event.preventDefault();
+            cycleFilter(event.shiftKey ? -1 : 1);
+        }
+    }, [showFilter, cycleFilter]);
+    const visible = groups
+        .map((group) => ({ group, agents: group.agents.filter((agent) => agentMatches(agent, active)) }))
+        // Under a filter, a group with no matching agent (a pending phase included) is left out.
+        .filter(({ agents }) => active === 'all' || agents.length > 0);
+    const nothing = active !== 'all' && visible.every(({ agents }) => agents.length === 0);
+    if (groups.length === 0)
+        return null;
+    return (_jsxs("div", { role: "group", "aria-label": t('agentsLabel'), onKeyDown: onKeyDown, children: [showFilter && (_jsx(FilterBar, { filter: active, counts: counts, onChange: setFilter })), _jsx(ToolResultCard, { bodyClassName: "py-0.5", children: nothing ? (_jsx("p", { className: "text-muted-foreground px-2 py-1 text-xs", children: t(`filterEmpty.${active}`) })) : (_jsx("ul", { children: visible.map(({ group, agents }) => {
+                        const key = group.phase?.title ?? '';
+                        const rows = (_jsx(AgentRows, { agents: agents, capped: agents.length > CAP_FROM && !uncapped.has(key), onShowAll: () => toggle(setUncapped, key), live: live, now: now, timed: timed, onOpen: onOpen, stop: stop }));
+                        if (!group.phase)
+                            return _jsx("li", { children: rows }, "loose");
+                        const open = !collapsed.has(key);
+                        return (_jsxs("li", { children: [_jsx(PhaseHeader, { group: group, shown: agents.length, filtered: active !== 'all', open: open, onToggle: () => toggle(setCollapsed, key) }), open && agents.length > 0 && _jsx("div", { className: "pl-5", children: rows })] }, `phase:${key}`));
+                    }) })) })] }));
+}
+function FilterBar({ filter, counts, onChange, }) {
+    const t = useTranslations('tools.workflow');
+    const indent = useToolIndent();
+    const tally = {
+        all: counts.total,
+        running: counts.running,
+        failed: counts.failed,
+        done: counts.done,
+    };
+    return (_jsx(Tabs, { value: filter, onValueChange: (value) => onChange(value), className: cn(indent && 'mt-1.5', indent), children: _jsx(TabsListCompact, { "aria-label": t('filter.label'), children: AGENT_FILTERS.map((value) => (_jsxs(TabsTriggerCompact, { value: value, className: "gap-1.5", children: [t(`filter.${value}`), _jsx(CountBadge, { count: tally[value] })] }, value))) }) }));
+}
+function PhaseHeader({ group, shown, filtered, open, onToggle, }) {
+    const t = useTranslations('tools.workflow');
+    const phase = group.phase;
+    const pending = phase.status === 'pending';
+    const tally = countAgents(group.agents);
+    const detail = pending
+        ? t('status.pending')
+        : group.agents.length === 0
+            ? undefined
+            : filtered
+                ? t('agents', { count: shown })
+                : [
+                    phase.status === 'running' ? t('progress', { done: tally.done, total: tally.total }) : t('agents', { count: tally.total }),
+                    tally.failed > 0 ? t('failedSuffix', { count: tally.failed }) : undefined,
+                ]
+                    .filter(Boolean)
+                    .join(' · ');
+    const body = (_jsxs(_Fragment, { children: [_jsx(StateMark, { status: phase.status, label: t(`status.${phase.status}`) }), _jsx("span", { className: cn('min-w-0 truncate font-medium', pending ? 'text-muted-foreground' : 'text-foreground'), title: phase.title, children: phase.title }), detail && _jsx("span", { className: "text-muted-foreground shrink-0 tabular-nums", children: detail })] }));
+    const rowClass = 'flex w-full min-w-0 items-center gap-2 rounded-sm px-2 py-1 text-left text-xs';
+    // A phase with no rows has nothing to fold: a plain line, not a control.
+    if (group.agents.length === 0)
+        return _jsx("div", { className: rowClass, children: body });
+    return (_jsxs("button", { type: "button", "data-workflow-row": true, "aria-expanded": open, onClick: onToggle, className: cn(rowClass, 'hover:bg-muted/40 cursor-pointer'), children: [body, _jsx(CaretRightIcon, { "aria-hidden": true, className: cn('text-muted-foreground ml-auto size-3 shrink-0 transition-transform motion-reduce:transition-none', open && 'rotate-90') })] }));
+}
+function AgentRows({ agents, capped, onShowAll, ...row }) {
+    const t = useTranslations('tools.workflow');
+    const shown = capped ? agents.slice(0, GROUP_CAP) : agents;
+    return (_jsxs("ul", { children: [shown.map((agent) => (_jsx(AgentRow, { agent: agent, ...row }, agent.id))), capped && (_jsx("li", { children: _jsx("button", { type: "button", "data-workflow-row": true, onClick: onShowAll, className: "text-muted-foreground hover:text-foreground w-full cursor-pointer rounded-sm px-2 py-1 text-left text-xs", children: t('showAll', { count: agents.length }) }) }))] }));
+}
+/** `kortix/claude-sonnet-4.6` reads `claude-sonnet-4.6`; the row's title keeps the whole id. */
+function shortModel(model) {
+    return model.slice(model.lastIndexOf('/') + 1) || model;
+}
+function AgentRow({ agent, live, now, timed, onOpen, stop, }) {
+    const t = useTranslations('tools.workflow');
+    const tm = useTranslations('multiAgent.workflow');
+    const describedBy = useId();
+    const [jsonOpen, setJsonOpen] = useState(false);
+    const statusLabel = t(`status.${agent.status}`);
+    const working = agent.status === 'starting' || agent.status === 'running';
+    const structured = agent.structured && agent.summary ? structuredSummary(agent.summary) : undefined;
+    const meta = [
+        agent.agent,
+        agent.model ? shortModel(agent.model) : undefined,
+        agent.attempt && agent.attempt > 1 ? t('retry', { count: agent.attempt - 1 }) : undefined,
+        agent.cached ? t('cached') : undefined,
+    ].filter((part) => !!part);
+    const elapsed = elapsedMs(agent, live && working, now);
+    const summary = agent.summary ?? (agent.status === 'running' ? '' : statusLabel);
+    const head = (_jsxs(_Fragment, { children: [_jsx(StateMark, { status: agent.status, label: statusLabel }), _jsx("span", { className: "text-foreground min-w-0 shrink truncate", title: agent.label, children: agent.label }), meta.length > 0 && (_jsx("span", { className: "text-muted-foreground max-w-[40%] shrink-0 truncate", title: agent.model ? [agent.agent, agent.model].filter(Boolean).join(' · ') : undefined, children: meta.join(' · ') })), _jsx("span", { id: describedBy, className: "text-muted-foreground min-w-0 flex-1 truncate", title: structured ? undefined : agent.summary, children: structured ? _jsx("span", { className: "sr-only", children: statusLabel }) : summary })] }));
+    const headClass = 'flex min-w-0 flex-1 items-center gap-2 rounded-sm px-2 py-1 text-left';
+    const canStop = stop.enabled && live && working && !!agent.sessionId;
+    const stopping = !!agent.sessionId && stop.pending.has(agent.sessionId);
+    return (_jsxs("li", { children: [_jsxs("div", { className: cn('flex min-w-0 items-center gap-1 rounded-sm text-xs', agent.sessionId && 'hover:bg-muted/40'), children: [agent.sessionId ? (_jsx("button", { type: "button", "data-workflow-row": true, "aria-label": t('openAgent', { label: agent.label }), "aria-describedby": describedBy, onClick: () => onOpen(agent), className: cn(headClass, 'cursor-pointer'), children: head })) : (_jsx("div", { className: headClass, children: head })), structured && (_jsxs("button", { type: "button", "data-workflow-row": true, "aria-expanded": jsonOpen, onClick: () => setJsonOpen((open) => !open), className: "text-muted-foreground hover:text-foreground flex shrink-0 cursor-pointer items-center gap-1 rounded-sm px-1 py-1 tabular-nums", children: [structured.kind === 'object'
+                                ? t('jsonKeys', { count: structured.keys })
+                                : structured.kind === 'array'
+                                    ? t('jsonItems', { count: structured.items })
+                                    : t('json'), _jsx(CaretRightIcon, { "aria-hidden": true, className: cn('size-3 shrink-0 transition-transform motion-reduce:transition-none', jsonOpen && 'rotate-90') })] })), timed && (_jsx("span", { className: "text-muted-foreground min-w-12 shrink-0 pr-1 text-right tabular-nums", children: elapsed !== undefined ? formatElapsed(elapsed) : '' })), live && stop.enabled && stop.restart && (_jsx("span", { className: "flex size-6 shrink-0 items-center justify-center", children: stop.restart.pending && stop.restart.pending === agent.sessionId ? (_jsx(Loading, { className: "text-muted-foreground size-3" })) : canStop && !stopping ? (_jsx(Hint, { label: tm('restartHint'), side: "top", sideOffset: 4, alignOffset: 0, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", "aria-label": tm('restartAgent', { label: agent.label }), onClick: () => stop.restart?.run(agent), className: "text-muted-foreground hover:text-foreground", children: _jsx(ArrowClockwiseIcon, { className: "size-3" }) }) })) : null })), live && stop.enabled && (_jsx("span", { className: "flex size-6 shrink-0 items-center justify-center", children: stopping && working ? (_jsx(Loading, { className: "text-muted-foreground size-3" })) : canStop ? (_jsx(Hint, { label: t('stopHint'), side: "top", sideOffset: 4, alignOffset: 0, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", "aria-label": t('stopAgent', { label: agent.label }), onClick: () => stop.stop(agent), className: "text-muted-foreground hover:text-foreground", children: _jsx(SquareIcon, { weight: "fill", className: "size-2.5" }) }) })) : null }))] }), structured && jsonOpen && (_jsx("div", { className: "pr-1 pb-1 pl-7", children: _jsx(OutputBlock, { text: structured.pretty }) }))] }));
+}