@kortix/ui 0.14.12 → 0.14.14

package/dist/session/agents/held-messages.js

@@ -0,0 +1,50 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../primitives/button.js';
+import { SessionDotMatrix } from '../../primitives/dot-matrix/session-dot-matrix.js';
+import { errorToast } from '../../primitives/toast.js';
+import { useTranslations } from '../../i18n/index.js';
+import { ChatCircleDotsIcon } from '@phosphor-icons/react';
+import { peerHandleLabel } from '../../_vendor/kortix-shared.js';
+import { usePeerMessages } from '@kortix/sdk/react';
+/**
+ * Messages from other sessions that wait for the person (`inbound: hold`, or a
+ * session the person asked to approve first). Claude Code opens an approval
+ * dialog with the sender and a preview; Kortix shows one card per message above
+ * the agent strip. "Approve message" delivers it, "Deny" drops it. A message
+ * nobody decides expires after 5 minutes on the server.
+ */
+/** The preview line: the sender's summary, else the message's first line. */
+export function heldPreview(message) {
+    const summary = message.summary?.trim();
+    if (summary)
+        return summary;
+    const first = message.message.trim().split('\n')[0] ?? '';
+    return first.length > 200 ? `${first.slice(0, 200)}…` : first;
+}
+export function HeldMessageCard({ message, pending, onApprove, onDeny }) {
+    const t = useTranslations('multiAgent.held');
+    const kind = message.type === 'shutdown_request' ? 'titleShutdown' : 'title';
+    return (_jsxs("div", { "data-held-message": message.id, className: "bg-popover flex items-start gap-2.5 rounded-md border px-3 py-2.5 text-xs", children: [_jsx(ChatCircleDotsIcon, { "aria-hidden": true, className: "text-muted-foreground mt-0.5 size-4 shrink-0" }), _jsxs("div", { className: "min-w-0 flex-1 space-y-0.5", children: [_jsx("p", { className: "text-foreground text-sm font-medium", children: t(kind, { from: peerHandleLabel(message.from_handle) }) }), _jsx("p", { className: "text-foreground line-clamp-2 wrap-break-word", children: heldPreview(message) }), _jsx("p", { className: "text-muted-foreground", children: t('waiting') })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1.5", children: [_jsxs(Button, { type: "button", size: "xs", variant: "outline-ghost", disabled: pending !== null, onClick: onDeny, children: [pending === 'deny' ? _jsx(SessionDotMatrix, { size: 14, className: "shrink-0" }) : null, t('deny')] }), _jsxs(Button, { type: "button", size: "xs", disabled: pending !== null, onClick: onApprove, children: [pending === 'approve' ? _jsx(SessionDotMatrix, { size: 14, className: "shrink-0" }) : null, t('approve')] })] })] }));
+}
+/** The held messages of `usePeerMessages(…, 'in')`, one card each; nothing when none waits. */
+export function HeldMessageList({ messages, approve, deny, }) {
+    const t = useTranslations('multiAgent.held');
+    const held = heldMessages(messages);
+    if (held.length === 0)
+        return null;
+    const pendingFor = (id) => approve.isPending && approve.variables === id ? 'approve' : deny.isPending && deny.variables === id ? 'deny' : null;
+    const fail = (key) => (error) => errorToast(t(key), { description: error instanceof Error ? error.message : undefined });
+    return (_jsx("div", { "aria-label": t('label'), role: "group", className: "space-y-1.5", children: held.map((message) => (_jsx(HeldMessageCard, { message: message, pending: pendingFor(message.id), onApprove: () => approve.mutate(message.id, { onError: fail('approveFailed') }), onDeny: () => deny.mutate(message.id, { onError: fail('denyFailed') }) }, message.id))) }));
+}
+/** The messages that wait for the person, oldest first (the order they arrived). */
+export function heldMessages(messages) {
+    return (messages ?? [])
+        .filter((message) => message.status === 'held')
+        .sort((a, b) => Date.parse(a.created_at) - Date.parse(b.created_at));
+}
+/** A session's held messages, read on their own (for a host without the agent strip). */
+export function HeldMessages({ projectId, sessionId }) {
+    const { data, approve, deny } = usePeerMessages(projectId, sessionId, 'in');
+    return _jsx(HeldMessageList, { messages: data, approve: approve, deny: deny });
+}

package/dist/session/agents/legacy-subagent-chat.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The body of a sub-agent that is not a Kortix session of its own: an
+ * in-process child (`session: "same"`) or an old OpenCode subagent, whose
+ * transcript lives in its lead's computer and saved history. It mounts the
+ * read-only `SessionChat` of that child under the lead's saved-history scope,
+ * so it paints while the computer is off. Every child that is its own project
+ * session reads `SessionPeek` instead (`subagent-dialog-content.tsx`).
+ */
+export declare function LegacySubagentChat({ sessionId }: {
+    sessionId: string;
+}): import("react").JSX.Element;

package/dist/session/agents/legacy-subagent-chat.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SessionChat } from '../thread/session-chat.js';
+import { useSessionIds } from '../../providers/session-ids.js';
+/**
+ * The body of a sub-agent that is not a Kortix session of its own: an
+ * in-process child (`session: "same"`) or an old OpenCode subagent, whose
+ * transcript lives in its lead's computer and saved history. It mounts the
+ * read-only `SessionChat` of that child under the lead's saved-history scope,
+ * so it paints while the computer is off. Every child that is its own project
+ * session reads `SessionPeek` instead (`subagent-dialog-content.tsx`).
+ */
+export function LegacySubagentChat({ sessionId }) {
+    // The session page this sub-agent runs under. Its saved history holds the
+    // sub-agent's transcript too.
+    const ids = useSessionIds();
+    const savedHistoryScope = ids.projectId && ids.sessionId ? `${ids.projectId}/${ids.sessionId}` : undefined;
+    return _jsx(SessionChat, { sessionId: sessionId, hideHeader: true, readOnly: true, initialScrollTop: true, savedHistoryScope: savedHistoryScope });
+}

package/dist/session/agents/session-peek.d.ts

@@ -0,0 +1,20 @@
+import '../tool/tools/register.js';
+/**
+ * The transcript of another session, read-only, from the API alone
+ * (`useSessionView`): its log and its stream. It never starts the session and
+ * never points the app's runtime at the session's box, so it can sit beside
+ * the session page that owns the runtime: a sub-agent's dialog over its lead's
+ * chat, the board's preview. Never blank: a skeleton while the log loads, an
+ * error with "Try again", "Nothing yet" for a session with no message.
+ */
+export declare function SessionPeek({ projectId, sessionId, working, onActivity, density, className, }: {
+    projectId: string;
+    sessionId: string;
+    /** The session works now: its last turn shows the agent's busy row. */
+    working?: boolean;
+    /** Called when a message arrives or changes count: the host re-reads the session's state. */
+    onActivity?: () => void;
+    /** `compact`: the narrow gutters of a side sheet, as `SessionThread`'s density. */
+    density?: 'default' | 'compact';
+    className?: string;
+}): import("react").JSX.Element;

package/dist/session/agents/session-peek.js

@@ -0,0 +1,67 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { sessionLogTurns } from '@kortix/sdk';
+import { useSessionView } from '@kortix/sdk/react';
+import { ChatsCircleIcon } from '@phosphor-icons/react';
+import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
+import { useTranslations } from '../../i18n/index.js';
+import { ProjectScope } from '../../internal/project-scope.js';
+import { cn } from '../../lib/utils.js';
+import { Button } from '../../primitives/button.js';
+import { EmptyState } from '../../primitives/empty-state.js';
+import { ErrorState } from '../../primitives/error-state.js';
+import Loading from '../../primitives/loading.js';
+import { Skeleton } from '../../primitives/skeleton.js';
+import { SessionTurn } from '../thread/transcript.js';
+import { SESSION_TRANSCRIPT_CLASS } from '../thread/session-transcript-class.js';
+import '../tool/tools/register.js';
+/** The live thread is read at most once per this window while a turn streams. */
+const PEEK_THROTTLE_MS = 100;
+const NO_REQUESTS = [];
+const noop = () => { };
+const noopAsync = async () => { };
+/** A view rewinds nothing: every turn's history control stays off. */
+const TURN_OUTCOME = {};
+/**
+ * The transcript of another session, read-only, from the API alone
+ * (`useSessionView`): its log and its stream. It never starts the session and
+ * never points the app's runtime at the session's box, so it can sit beside
+ * the session page that owns the runtime: a sub-agent's dialog over its lead's
+ * chat, the board's preview. Never blank: a skeleton while the log loads, an
+ * error with "Try again", "Nothing yet" for a session with no message.
+ */
+export function SessionPeek({ projectId, sessionId, working = false, onActivity, density = 'default', className, }) {
+    const t = useTranslations('multiAgent.subagent');
+    const view = useSessionView(projectId, sessionId, { throttleMs: PEEK_THROTTLE_MS });
+    const turns = useMemo(() => (view.thread ? sessionLogTurns(view.thread, { foldCompactions: true, busy: working }) : []), [view.thread, working]);
+    const scrollRef = useRef(null);
+    const pinned = useRef(true);
+    // Open at the newest message, and follow new ones while the reader sits at the bottom.
+    useLayoutEffect(() => {
+        const node = scrollRef.current;
+        if (node && pinned.current)
+            node.scrollTop = node.scrollHeight;
+    }, [turns]);
+    useEffect(() => {
+        pinned.current = true;
+    }, [sessionId]);
+    const count = view.thread?.messages.length ?? 0;
+    const activity = useRef(onActivity);
+    useEffect(() => {
+        activity.current = onActivity;
+    });
+    useEffect(() => {
+        if (count > 0)
+            activity.current?.();
+    }, [count]);
+    return (_jsx("div", { "data-testid": "session-peek", "data-status": view.status, "data-density": density, className: cn('group/thread flex min-h-0 flex-1 flex-col', className), children: view.status === 'loading' ? (_jsxs("div", { className: cn(SESSION_TRANSCRIPT_CLASS, 'space-y-4'), "aria-busy": "true", children: [_jsx(Skeleton, { className: "ml-auto h-9 w-2/5 rounded-xl" }), _jsx(Skeleton, { className: "h-4 w-4/5" }), _jsx(Skeleton, { className: "h-4 w-3/5" }), _jsx(Skeleton, { className: "h-4 w-2/3" })] })) : view.status === 'error' ? (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsx(ErrorState, { size: "sm", title: t('loadFailed'), action: _jsx(Button, { variant: "outline", size: "sm", onClick: view.retry, children: t('retry') }) }) })) : view.status === 'empty' ? (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsx(EmptyState, { size: "sm", icon: ChatsCircleIcon, title: t('emptyTitle'), description: t('emptyDescription') }) })) : (_jsx(ProjectScope, { projectId: projectId, sessionId: sessionId, children: _jsx("div", { ref: scrollRef, onScroll: (event) => {
+                    const node = event.currentTarget;
+                    pinned.current = node.scrollHeight - node.scrollTop - node.clientHeight < 48;
+                }, className: "min-h-0 flex-1 overflow-y-auto", children: _jsxs("div", { className: cn(SESSION_TRANSCRIPT_CLASS, 'pb-6'), children: [view.hasOlder && (_jsx("div", { className: "mb-4 flex justify-center", children: _jsxs(Button, { variant: "ghost", size: "xs", disabled: view.isLoadingOlder, onClick: () => {
+                                    pinned.current = false;
+                                    void view.loadOlder();
+                                }, className: "text-muted-foreground", children: [view.isLoadingOlder && _jsx(Loading, { className: "size-3 shrink-0" }), t('loadOlder')] }) })), _jsx("div", { className: "space-y-6", children: turns.map((turn, index) => {
+                                const last = index === turns.length - 1;
+                                return (_jsx(SessionTurn, { turn: turn, turnOutcome: TURN_OUTCOME, sessionId: view.thread?.thread_id ?? sessionId, sessionStatus: undefined, isLast: last, ownsPlan: false, permissions: NO_REQUESTS, questions: NO_REQUESTS, isFirstTurn: index === 0, sessionWorking: working, isWorkingTurn: last && working, suppressBusyIndicator: false, awaitingUser: false, pending: false, disableToolNavigation: true, onPermissionReply: noopAsync, onRewind: noop, rewindDisabled: true }, turn.id));
+                            }) })] }) }) })) }));
+}

package/dist/session/agents/session-prompt.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Send a prompt into the open session from a control that is not the composer
+ * ("Save as workflow"). The session chat provides its own send path, so the
+ * prompt goes out exactly as a typed one: a running turn is steered, an idle
+ * session starts a turn, and the composer's draft is left alone.
+ */
+export type SessionPromptSend = (text: string) => unknown;
+export declare const SessionPromptContext: import("react").Context<SessionPromptSend | null>;
+/**
+ * The session's own send, or, outside a session chat, the composer prefill: the
+ * text lands in the composer of `sessionId` for the person to send.
+ */
+export declare function useSessionPromptSend(sessionId: string | undefined): SessionPromptSend | null;

package/dist/session/agents/session-prompt.js

@@ -0,0 +1,18 @@
+'use client';
+import { createContext, useCallback, useContext } from 'react';
+import { useSessionComposerPrefillStore } from '../composer/stores/session-composer-prefill-store.js';
+export const SessionPromptContext = createContext(null);
+/**
+ * The session's own send, or, outside a session chat, the composer prefill: the
+ * text lands in the composer of `sessionId` for the person to send.
+ */
+export function useSessionPromptSend(sessionId) {
+    const send = useContext(SessionPromptContext);
+    const prefill = useCallback((text) => {
+        if (sessionId)
+            useSessionComposerPrefillStore.getState().setPrefill(sessionId, text);
+    }, [sessionId]);
+    if (send)
+        return send;
+    return sessionId ? prefill : null;
+}

package/dist/session/agents/steer-session.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Send a message to another session through the API's prompt route, as a steer:
+ * a running turn reads it at its next step, an idle session starts a turn. It
+ * needs no runtime of its own, so a host can message a sub-agent or a board row
+ * from beside the session that owns the app's runtime.
+ */
+export declare function useSteerSession(projectId: string | undefined, options?: {
+    onSent?: () => void;
+    onError?: (error: unknown) => void;
+}): import("@tanstack/react-query").UseMutationResult<import("@kortix/sdk").CreateSessionPromptResult, Error, {
+    sessionId: string;
+    text: string;
+}, unknown>;

package/dist/session/agents/steer-session.js

@@ -0,0 +1,29 @@
+'use client';
+import { createSessionPrompt, mintWireMessageId } from '@kortix/sdk';
+import { useMutation } from '@tanstack/react-query';
+/**
+ * Send a message to another session through the API's prompt route, as a steer:
+ * a running turn reads it at its next step, an idle session starts a turn. It
+ * needs no runtime of its own, so a host can message a sub-agent or a board row
+ * from beside the session that owns the app's runtime.
+ */
+export function useSteerSession(projectId, options = {}) {
+    return useMutation({
+        mutationFn: async ({ sessionId, text }) => {
+            if (!projectId)
+                throw new Error('No project');
+            // Minted with no transcript to place it against: the server places it at delivery.
+            const messageId = mintWireMessageId();
+            return createSessionPrompt(projectId, sessionId, {
+                clientMessageId: messageId,
+                messageId,
+                remintOnDelivery: true,
+                delivery: 'steer',
+                parts: [{ type: 'text', text }],
+                clientSentAtMs: Date.now(),
+            });
+        },
+        onSuccess: () => options.onSent?.(),
+        onError: (error) => options.onError?.(error),
+    });
+}

package/dist/session/agents/subagent-dialog-content.d.ts

@@ -0,0 +1,11 @@
+export interface SubagentDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    /** The child session: a Kortix project session, or an in-process child's runtime id. */
+    sessionId: string;
+    /** What the opener calls it; the session's own handle wins once its row loads. */
+    title?: string;
+    /** The project; default: the project of the session page the dialog opens over. */
+    projectId?: string;
+}
+export declare function SubagentDialogContent({ open, onOpenChange, sessionId, title, projectId: projectIdProp }: SubagentDialogProps): import("react").JSX.Element;

package/dist/session/agents/subagent-dialog-content.js

@@ -0,0 +1,115 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { stopProjectSession } from '@kortix/sdk';
+import { qk, useProjectSession } from '@kortix/sdk/react';
+import { ArrowSquareOutIcon, CheckIcon, PaperPlaneRightIcon, SquareIcon, XIcon } from '@phosphor-icons/react';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { useState } from 'react';
+import { useTranslations } from '../../i18n/index.js';
+import { agentDisplayName } from '../../internal/components/agent-mark.js';
+import { uiRoutes } from '../../lib/routes.js';
+import { cn } from '../../lib/utils.js';
+import { Button } from '../../primitives/button.js';
+import { ErrorState } from '../../primitives/error-state.js';
+import { Hint } from '../../primitives/hint.js';
+import { Input } from '../../primitives/input.js';
+import Loading from '../../primitives/loading.js';
+import { Modal, ModalContent, ModalDescription, ModalTitle } from '../../primitives/modal.js';
+import { Skeleton } from '../../primitives/skeleton.js';
+import { StatusDot } from '../../primitives/status.js';
+import { errorToast, successToast } from '../../primitives/toast.js';
+import { UiLink } from '../../providers/ui-provider.js';
+import { useSessionIds } from '../../providers/session-ids.js';
+import { agentRowOf, isActive, shortElapsed } from './agent-model.js';
+import { LegacySubagentChat } from './legacy-subagent-chat.js';
+import { SessionPeek } from './session-peek.js';
+import { useSteerSession } from './steer-session.js';
+import { useNow } from './workflow-run-controls.js';
+const DOT_TONE = {
+    working: 'success',
+    needs_input: 'warning',
+    failed: 'destructive',
+    stopped: 'neutral',
+};
+/** The same state mark as the agents line: live dot, attention dot, check once its turn ended. */
+function StateMark({ state }) {
+    return state === 'idle' || state === 'completed' ? (_jsx(CheckIcon, { "aria-hidden": true, weight: "bold", className: "text-kortix-green size-3 shrink-0" })) : (_jsx(StatusDot, { tone: DOT_TONE[state], pulse: state === 'working', className: "motion-reduce:animate-none" }));
+}
+/**
+ * Which body a child gets. A child that is its own project session (every
+ * sub-agent, teammate and workflow agent since each runs on its own computer)
+ * answers `GET /projects/:pid/sessions/:child` and reads its own log
+ * (`SessionPeek`). A child that answers 404 or 400 there is not a project
+ * session (an in-process `session: "same"` child, an old OpenCode subagent):
+ * its transcript lives in the lead's computer, so it keeps the legacy chat.
+ * Any other failure is a failed read of a real child: the dialog says so.
+ */
+function bodyKind(row, projectId) {
+    if (!projectId)
+        return 'legacy';
+    if (row.data)
+        return 'peek';
+    if (row.isError) {
+        const status = row.error?.status;
+        return status === 404 || status === 400 ? 'legacy' : 'error';
+    }
+    return 'loading';
+}
+export function SubagentDialogContent({ open, onOpenChange, sessionId, title, projectId: projectIdProp }) {
+    const t = useTranslations('multiAgent.subagent');
+    const tStrip = useTranslations('multiAgent.strip');
+    const ids = useSessionIds();
+    const projectId = projectIdProp ?? ids.projectId ?? undefined;
+    const row = useProjectSession(projectId, sessionId, { enabled: open && !!projectId });
+    const kind = bodyKind(row, projectId);
+    const agent = row.data ? agentRowOf(row.data) : null;
+    const name = agent?.named ? agent.handle : title || agent?.handle || t('fallbackTitle');
+    const working = agent?.state === 'working';
+    const now = useNow(open && working);
+    const queryClient = useQueryClient();
+    // The header's state follows the transcript: a new message re-reads the row.
+    const refreshRow = () => projectId && void queryClient.invalidateQueries({ queryKey: qk.project.session(projectId, sessionId) });
+    const stop = useMutation({
+        mutationFn: () => stopProjectSession(projectId, sessionId),
+        onSettled: refreshRow,
+        onError: (error) => errorToast(tStrip('stopAgentFailed', { name }), { description: error instanceof Error ? error.message : undefined }),
+    });
+    const state = agent
+        ? agent.state === 'working' && agent.workingSinceMs !== null
+            ? tStrip('workingFor', { elapsed: shortElapsed(now - agent.workingSinceMs) })
+            : tStrip(`state.${agent.state}`)
+        : null;
+    return (_jsx(Modal, { open: open, onOpenChange: onOpenChange, children: _jsxs(ModalContent, { variant: "base", showCloseButton: false, "data-testid": "subagent-dialog", "data-body": kind, className: cn('flex flex-col gap-0 space-y-0 overflow-hidden p-0', 
+            // lg:max-w-* is required: the base modal sets lg:max-w-lg, which
+            // tailwind-merge does not strip for an unprefixed override.
+            'h-[80vh] max-h-[840px] lg:h-[80vh] lg:max-w-6xl', 
+            // A small window gets the whole screen: no sheet edge to aim at.
+            'max-[720px]:inset-0 max-[720px]:h-dvh max-[720px]:max-h-none max-[720px]:rounded-none'), children: [_jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b py-2 pr-2 pl-4", children: [agent && _jsx(StateMark, { state: agent.state }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex min-w-0 items-baseline gap-2", children: [_jsx(ModalTitle, { className: "min-w-0 truncate text-sm font-medium", children: name }), state && _jsx("span", { className: "text-muted-foreground shrink-0 text-xs tabular-nums", children: state })] }), _jsx(ModalDescription, { className: "text-muted-foreground truncate text-xs", children: agent?.agent && agent.named ? tStrip('runsAs', { agent: agentDisplayName(agent.agent) }) : null })] }), projectId && kind === 'peek' && (_jsx(Button, { asChild: true, variant: "ghost", size: "xs", className: "text-muted-foreground hover:text-foreground shrink-0", children: _jsxs(UiLink, { href: uiRoutes().session(projectId, sessionId), onClick: () => onOpenChange(false), children: [_jsx(ArrowSquareOutIcon, { className: "size-3.5 shrink-0" }), t('openPage')] }) })), agent && isActive(agent.state) && (_jsx(Hint, { label: tStrip('stopHint'), side: "bottom", children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", "aria-label": tStrip('stopAgent', { name }), disabled: stop.isPending, onClick: () => stop.mutate(), className: "text-muted-foreground hover:text-foreground", children: stop.isPending ? _jsx(Loading, { className: "size-3" }) : _jsx(SquareIcon, { weight: "fill", className: "size-2.5" }) }) })), _jsx(Button, { type: "button", variant: "ghost", size: "icon-xs", "aria-label": t('close'), onClick: () => onOpenChange(false), className: "text-muted-foreground hover:text-foreground hit-area-2 shrink-0", children: _jsx(XIcon, { className: "size-3.5" }) })] }), _jsx("div", { className: "flex min-h-0 flex-1 flex-col", children: kind === 'peek' && projectId ? (_jsx(SessionPeek, { projectId: projectId, sessionId: sessionId, working: working, onActivity: refreshRow })) : kind === 'legacy' ? (_jsx(LegacySubagentChat, { sessionId: sessionId })) : kind === 'error' ? (_jsx(SessionPeekRowError, { onRetry: () => void row.refetch() })) : (_jsxs("div", { className: "mx-auto w-full max-w-3xl space-y-4 px-7 pt-6", "aria-busy": "true", children: [_jsx(Skeleton, { className: "ml-auto h-9 w-2/5 rounded-xl" }), _jsx(Skeleton, { className: "h-4 w-4/5" }), _jsx(Skeleton, { className: "h-4 w-3/5" })] })) }), kind === 'peek' && projectId && _jsx(SubagentMessageBox, { projectId: projectId, sessionId: sessionId, name: name, onSent: refreshRow }, sessionId)] }) }));
+}
+function SessionPeekRowError({ onRetry }) {
+    const t = useTranslations('multiAgent.subagent');
+    return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsx(ErrorState, { size: "sm", title: t('loadFailed'), action: _jsx(Button, { variant: "outline", size: "sm", onClick: onRetry, children: t('retry') }) }) }));
+}
+/** One line under the transcript: a message to the child, as a steer. */
+function SubagentMessageBox({ projectId, sessionId, name, onSent }) {
+    const t = useTranslations('multiAgent.subagent');
+    const [text, setText] = useState('');
+    const send = useSteerSession(projectId, {
+        onSent: () => {
+            setText('');
+            successToast(t('sent'));
+            onSent();
+        },
+        onError: (error) => errorToast(t('sendFailed'), { description: error instanceof Error ? error.message : undefined }),
+    });
+    const submit = () => {
+        const message = text.trim();
+        if (!message || send.isPending)
+            return;
+        send.mutate({ sessionId, text: message });
+    };
+    return (_jsxs("form", { className: "flex shrink-0 items-center gap-2 border-t px-4 py-3", onSubmit: (event) => {
+            event.preventDefault();
+            submit();
+        }, children: [_jsx(Input, { "data-testid": "subagent-dialog-message", value: text, onChange: (event) => setText(event.target.value), placeholder: t('messagePlaceholder', { name }), "aria-label": t('messageLabel', { name }), disabled: send.isPending, className: "min-w-0 flex-1" }), _jsxs(Button, { type: "submit", size: "sm", className: "shrink-0 gap-1.5", disabled: !text.trim() || send.isPending, children: [send.isPending ? _jsx(Loading, { className: "size-3.5 shrink-0" }) : _jsx(PaperPlaneRightIcon, { className: "size-3.5 shrink-0" }), t('send')] })] }));
+}

package/dist/session/agents/subagent-view.d.ts

@@ -0,0 +1,8 @@
+import type { SubagentDialogProps } from './subagent-dialog-content.js';
+export type { SubagentDialogProps } from './subagent-dialog-content.js';
+/**
+ * THE dialog of a session another session started: a sub-agent, a teammate, a
+ * workflow agent or runner. Every entry point opens this one (the agents line,
+ * notice rows, the agent and workflow tool cards, the worker report card).
+ */
+export declare function SubagentDialog(props: SubagentDialogProps): import("react").JSX.Element | null;

package/dist/session/agents/subagent-view.js

@@ -0,0 +1,18 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useOpenedOnce } from '../../internal/hooks/use-opened-once.js';
+import { lazyClient } from '../../lib/lazy-client.js';
+// Tool rows, notices and the agents line render this dialog closed on every
+// transcript (the marketing home demo too), so its body loads on first open.
+const SubagentDialogContent = lazyClient(() => import('./subagent-dialog-content.js').then((mod) => mod.SubagentDialogContent));
+/**
+ * THE dialog of a session another session started: a sub-agent, a teammate, a
+ * workflow agent or runner. Every entry point opens this one (the agents line,
+ * notice rows, the agent and workflow tool cards, the worker report card).
+ */
+export function SubagentDialog(props) {
+    const opened = useOpenedOnce(props.open);
+    if (!opened)
+        return null;
+    return _jsx(SubagentDialogContent, { ...props });
+}

package/dist/session/agents/tasks-panel.d.ts

@@ -0,0 +1,13 @@
+import type { SessionTask, SessionTaskStatus } from '@kortix/sdk';
+/**
+ * A team's shared task list (flag `agent_teams`), Claude Code's Ctrl+T task
+ * list: pending, in progress and completed, each task with its number, the
+ * teammate that owns it and the tasks it waits for. A blocked task says so;
+ * teammates do not claim it until those tasks complete.
+ */
+export declare const TASK_GROUPS: readonly SessionTaskStatus[];
+export declare function groupTasks(tasks: readonly SessionTask[]): Record<SessionTaskStatus, SessionTask[]>;
+export declare function TasksPanel({ tasks, id }: {
+    tasks: readonly SessionTask[];
+    id?: string;
+}): import("react").JSX.Element;

package/dist/session/agents/tasks-panel.js

@@ -0,0 +1,41 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from '../../primitives/badge.js';
+import { CountBadge } from '../../primitives/count-badge.js';
+import { useTranslations } from '../../i18n/index.js';
+import { cn } from '../../lib/utils.js';
+import { CheckIcon, CircleDashedIcon, CircleHalfIcon, LockSimpleIcon } from '@phosphor-icons/react';
+/**
+ * A team's shared task list (flag `agent_teams`), Claude Code's Ctrl+T task
+ * list: pending, in progress and completed, each task with its number, the
+ * teammate that owns it and the tasks it waits for. A blocked task says so;
+ * teammates do not claim it until those tasks complete.
+ */
+export const TASK_GROUPS = ['pending', 'in_progress', 'completed'];
+export function groupTasks(tasks) {
+    const groups = { pending: [], in_progress: [], completed: [] };
+    for (const task of tasks)
+        groups[task.status]?.push(task);
+    for (const list of Object.values(groups))
+        list.sort((a, b) => a.seq - b.seq);
+    return groups;
+}
+function TaskGlyph({ task }) {
+    if (task.status === 'completed')
+        return _jsx(CheckIcon, { "aria-hidden": true, className: "text-kortix-green size-3 shrink-0" });
+    if (task.status === 'in_progress')
+        return _jsx(CircleHalfIcon, { "aria-hidden": true, className: "text-foreground size-3 shrink-0" });
+    if (task.blocked)
+        return _jsx(LockSimpleIcon, { "aria-hidden": true, className: "text-muted-foreground size-3 shrink-0" });
+    return _jsx(CircleDashedIcon, { "aria-hidden": true, className: "text-muted-foreground size-3 shrink-0" });
+}
+function TaskRow({ task }) {
+    const t = useTranslations('multiAgent.tasks');
+    const done = task.status === 'completed';
+    return (_jsxs("li", { "data-task-seq": task.seq, className: "flex min-w-0 items-center gap-2 rounded-sm px-2 py-1 text-xs", children: [_jsx(TaskGlyph, { task: task }), _jsxs("span", { className: "text-muted-foreground shrink-0 tabular-nums", children: ["#", task.seq] }), _jsx("span", { className: cn('min-w-0 flex-1 truncate', done ? 'text-muted-foreground line-through' : 'text-foreground'), title: task.description || task.subject, children: task.subject }), task.blocked && !done && task.blocked_by.length > 0 && (_jsx("span", { className: "text-muted-foreground shrink-0 tabular-nums", children: t('blockedBy', { tasks: task.blocked_by.map((seq) => `#${seq}`).join(', ') }) })), task.owner_handle ? (_jsxs(Badge, { variant: "outline", size: "sm", className: "max-w-32 shrink-0 truncate", children: ["@", task.owner_handle] })) : (!done && (_jsx(Badge, { variant: "muted", size: "sm", className: "shrink-0", children: t('unowned') })))] }));
+}
+export function TasksPanel({ tasks, id }) {
+    const t = useTranslations('multiAgent.tasks');
+    const groups = groupTasks(tasks);
+    return (_jsx("section", { id: id, "aria-label": t('label'), className: "space-y-1", children: tasks.length === 0 ? (_jsx("p", { className: "text-muted-foreground px-2 py-1 text-xs", children: t('empty') })) : (TASK_GROUPS.map((status) => groups[status].length === 0 ? null : (_jsxs("div", { children: [_jsxs("div", { className: "text-muted-foreground flex items-center gap-1.5 px-2 pt-1 text-xs font-medium", children: [t(`group.${status}`), _jsx(CountBadge, { count: groups[status].length })] }), _jsx("ul", { children: groups[status].map((task) => (_jsx(TaskRow, { task: task }, task.seq))) })] }, status)))) }));
+}

package/dist/session/agents/workflow-run-controls.d.ts

@@ -0,0 +1,43 @@
+import { type WorkflowRun, type WorkflowRunAgent } from '../tool/tools/workflow-run.js';
+/**
+ * One workflow run's controls, for the run card in the chat and the strip's
+ * "Workflows" group: Claude Code's `/workflows` keys as buttons. Pause or
+ * resume (`p`), stop the run (`x`), save its script as a workflow (`s`), and,
+ * per agent row, restart (`r`). Every control goes to the box that runs the
+ * run: the session that called `workflow`, or a background run's runner.
+ */
+/** A run's large-run warning: more agents than Claude Code's "Large workflow" threshold, or the run says so. */
+export declare function isLargeRun(run: Pick<WorkflowRun, 'agents' | 'large' | 'maxAgents'>): boolean;
+/** The file name a run saves as: its saved name, else its title in kebab case. */
+export declare function workflowFileName(run: Pick<WorkflowRun, 'name' | 'title'>): string;
+/**
+ * The live copy of a run: a background run's progress lives on its runner's box,
+ * so it is read from there (`useSessionWorkflows(project, runner)`, polled while it
+ * runs) and keeps updating after this session's turn ended. A foreground run is the
+ * card's own metadata. `controlSessionId` is the session whose box takes the controls.
+ */
+export declare function useLiveWorkflowRun(projectId: string | undefined, sessionId: string | undefined, run: WorkflowRun | null): {
+    run: WorkflowRun | null;
+    controlSessionId: string | undefined;
+    fromRunner: boolean;
+};
+/** The current time, every second while `active`: a live run's elapsed labels tick. */
+export declare function useNow(active: boolean): number;
+/** The prompt "Save" sends to the session that owns the run. */
+export declare function useSaveWorkflowPrompt(): (run: WorkflowRun) => string;
+export declare function LargeRunBadge(): import("react").JSX.Element;
+export interface WorkflowRunControlsProps {
+    projectId: string | undefined;
+    /** The box that runs the run (the runner of a background run). */
+    controlSessionId: string | undefined;
+    /** The session the "Save as workflow" prompt goes to: the one that started the run. */
+    ownerSessionId: string | undefined;
+    run: WorkflowRun;
+}
+export declare function WorkflowRunControls({ projectId, controlSessionId, ownerSessionId, run }: WorkflowRunControlsProps): import("react").JSX.Element | null;
+/** `restart_agent` for one agent row of a run, on the box that runs it. */
+export declare function useRestartAgent(projectId: string | undefined, controlSessionId: string | undefined, run: WorkflowRun | null): {
+    enabled: boolean;
+    restarting: string | undefined;
+    restart: (agent: WorkflowRunAgent) => void;
+};