@townco/ui 0.1.51 → 0.1.53

package/dist/gui/components/SubAgentDetails.js

@@ -0,0 +1,121 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronDown, CircleDot, Loader2 } from "lucide-react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { useSubagentStream } from "../../core/hooks/use-subagent-stream.js";
+const SCROLL_THRESHOLD = 50; // px from bottom to consider "at bottom"
+/**
+ * SubAgentDetails component - displays streaming content from a sub-agent.
+ *
+ * This component:
+ * - Connects directly to the sub-agent's SSE endpoint
+ * - Displays streaming text and tool calls
+ * - Renders in a collapsible section (collapsed by default)
+ */
+export function SubAgentDetails({ port, sessionId, host, parentStatus, agentName, query, isExpanded: controlledIsExpanded, onExpandChange, }) {
+    const [internalIsExpanded, setInternalIsExpanded] = useState(false);
+    // Use controlled state if provided, otherwise use internal state
+    const isExpanded = controlledIsExpanded ?? internalIsExpanded;
+    const setIsExpanded = onExpandChange ?? setInternalIsExpanded;
+    const [isThinkingExpanded, setIsThinkingExpanded] = useState(false);
+    const [isNearBottom, setIsNearBottom] = useState(true);
+    const thinkingContainerRef = useRef(null);
+    const { messages, isStreaming: hookIsStreaming, error, } = useSubagentStream({
+        port,
+        sessionId,
+        ...(host !== undefined ? { host } : {}),
+    });
+    // Use parent status as primary indicator, fall back to hook's streaming state
+    // Parent is "in_progress" means sub-agent is definitely still running
+    const isRunning = parentStatus === "in_progress" ||
+        parentStatus === "pending" ||
+        hookIsStreaming;
+    // Get the current/latest message
+    const currentMessage = messages[messages.length - 1];
+    const hasContent = currentMessage &&
+        (currentMessage.content ||
+            (currentMessage.toolCalls && currentMessage.toolCalls.length > 0) ||
+            (currentMessage.contentBlocks &&
+                currentMessage.contentBlocks.length > 0));
+    // Auto-collapse Thinking when completed (so Output is the primary view)
+    const prevIsRunningRef = useRef(isRunning);
+    useEffect(() => {
+        if (prevIsRunningRef.current && !isRunning) {
+            // Just completed - collapse thinking to show output
+            setIsThinkingExpanded(false);
+        }
+        prevIsRunningRef.current = isRunning;
+    }, [isRunning]);
+    // Check if user is near bottom of scroll area
+    const checkScrollPosition = useCallback(() => {
+        const container = thinkingContainerRef.current;
+        if (!container)
+            return;
+        const { scrollTop, scrollHeight, clientHeight } = container;
+        const distanceFromBottom = scrollHeight - scrollTop - clientHeight;
+        setIsNearBottom(distanceFromBottom < SCROLL_THRESHOLD);
+    }, []);
+    // Scroll to bottom
+    const scrollToBottom = useCallback(() => {
+        const container = thinkingContainerRef.current;
+        if (!container)
+            return;
+        container.scrollTop = container.scrollHeight;
+    }, []);
+    // Auto-scroll when content changes and user is near bottom
+    useEffect(() => {
+        if (isNearBottom && (isRunning || hasContent)) {
+            scrollToBottom();
+        }
+    }, [
+        currentMessage?.content,
+        currentMessage?.toolCalls,
+        isNearBottom,
+        isRunning,
+        hasContent,
+        scrollToBottom,
+    ]);
+    // Set up scroll listener
+    useEffect(() => {
+        const container = thinkingContainerRef.current;
+        if (!container)
+            return;
+        const handleScroll = () => checkScrollPosition();
+        container.addEventListener("scroll", handleScroll, { passive: true });
+        checkScrollPosition(); // Check initial position
+        return () => container.removeEventListener("scroll", handleScroll);
+    }, [checkScrollPosition, isThinkingExpanded, isExpanded]);
+    // Get last line of streaming content for preview
+    const lastLine = currentMessage?.content
+        ? currentMessage.content.split("\n").filter(Boolean).pop() || ""
+        : "";
+    const previewText = lastLine.length > 100 ? `${lastLine.slice(0, 100)}...` : lastLine;
+    // Get first line of query for fallback preview
+    const queryFirstLine = query
+        ? (query.split("\n")[0] ?? "").slice(0, 100) +
+            (query.length > 100 ? "..." : "")
+        : "";
+    return (_jsxs("div", { children: [!isExpanded && (_jsx("div", { className: "w-full max-w-md", children: previewText ? (_jsx("p", { className: "text-paragraph-sm text-muted-foreground/70 truncate", children: previewText })) : queryFirstLine ? (_jsx("p", { className: "text-paragraph-sm text-muted-foreground/50 truncate", children: queryFirstLine })) : null })), isExpanded && (_jsxs("div", { className: "space-y-3", children: [(agentName || query) && (_jsxs("div", { children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Input" }), _jsxs("div", { className: "text-[11px] font-mono space-y-1", children: [agentName && (_jsxs("div", { children: [_jsx("span", { className: "text-muted-foreground", children: "agentName: " }), _jsx("span", { className: "text-foreground", children: agentName })] })), query && (_jsxs("div", { children: [_jsx("span", { className: "text-muted-foreground", children: "query: " }), _jsx("span", { className: "text-foreground", children: query })] }))] })] })), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setIsThinkingExpanded(!isThinkingExpanded), className: "flex items-center gap-2 cursor-pointer bg-transparent border-none p-0 text-left group", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider font-sans", children: "Thinking" }), _jsx(ChevronDown, { className: `h-3 w-3 text-muted-foreground/70 transition-transform duration-200 ${isThinkingExpanded ? "rotate-180" : ""}` })] }), isThinkingExpanded && (_jsxs("div", { ref: thinkingContainerRef, className: "mt-2 rounded-md overflow-hidden bg-muted/30 border border-border/50 max-h-[200px] overflow-y-auto", children: [error && (_jsxs("div", { className: "px-2 py-2 text-[11px] text-destructive", children: ["Error: ", error] })), !error && !hasContent && isRunning && (_jsx("div", { className: "px-2 py-2 text-[11px] text-muted-foreground", children: "Waiting for sub-agent response..." })), currentMessage && (_jsxs("div", { className: "px-2 py-2 space-y-2", children: [currentMessage.contentBlocks &&
+                                                currentMessage.contentBlocks.length > 0
+                                                ? // Render interleaved content blocks
+                                                    currentMessage.contentBlocks.map((block, idx) => block.type === "text" ? (_jsx("div", { className: "text-[11px] text-foreground whitespace-pre-wrap font-mono", children: block.text }, `text-${idx}`)) : (_jsx(SubagentToolCallItem, { toolCall: block.toolCall }, block.toolCall.id)))
+                                                : // Fallback to legacy content
+                                                    currentMessage.content && (_jsx("div", { className: "text-[11px] text-foreground whitespace-pre-wrap font-mono", children: currentMessage.content })), currentMessage.isStreaming && (_jsx("span", { className: "inline-block w-1.5 h-3 bg-primary/70 ml-0.5 animate-pulse" }))] }))] }))] }), !isRunning && currentMessage?.content && (_jsxs("div", { children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Output" }), _jsx("div", { className: "text-[11px] text-foreground whitespace-pre-wrap font-mono max-h-[200px] overflow-y-auto rounded-md bg-muted/30 border border-border/50 px-2 py-2", children: currentMessage.content })] }))] }))] }));
+}
+/**
+ * Simple tool call display for sub-agent tool calls
+ */
+function SubagentToolCallItem({ toolCall }) {
+    const statusIcon = {
+        pending: "...",
+        in_progress: "",
+        completed: "",
+        failed: "",
+    }[toolCall.status];
+    const statusColor = {
+        pending: "text-muted-foreground",
+        in_progress: "text-blue-500",
+        completed: "text-green-500",
+        failed: "text-destructive",
+    }[toolCall.status];
+    return (_jsxs("div", { className: "flex items-center gap-2 text-[10px] text-muted-foreground", children: [_jsx("span", { className: statusColor, children: statusIcon }), _jsx("span", { className: "font-medium", children: toolCall.prettyName || toolCall.title }), toolCall.status === "in_progress" && (_jsx(Loader2, { className: "h-2.5 w-2.5 animate-spin" }))] }));
+}

package/dist/gui/components/ToolCall.js

@@ -1,8 +1,9 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import JsonView from "@uiw/react-json-view";
-import { AlertCircle, BrainCircuit, CheckSquare, ChevronDown, ChevronRight, CircleDot, Cloud, Edit, FileText, Globe, Image, Link, Search, Wrench, } from "lucide-react";
+import { AlertCircle, CheckSquare, ChevronDown, ChevronRight, CircleDot, Cloud, Edit, FileText, Globe, Image, Link, Search, Wrench, } from "lucide-react";
 import React, { useState } from "react";
 import { ChatLayout } from "./index.js";
+import { SubAgentDetails } from "./SubAgentDetails.js";
 import { useTheme } from "./ThemeProvider.js";
 /**
  * Map of icon names to Lucide components
@@ -17,7 +18,6 @@ const ICON_MAP = {
     FileText: FileText,
     Edit: Edit,
     Wrench: Wrench,
-    BrainCircuit: BrainCircuit,
     CircleDot: CircleDot,
 };
 /**
@@ -40,12 +40,14 @@ const _kindIcons = {
  */
 export function ToolCall({ toolCall }) {
     const [isExpanded, setIsExpanded] = useState(false);
+    const [isSubagentExpanded, setIsSubagentExpanded] = useState(false);
     const { resolvedTheme } = useTheme();
-    // Detect TodoWrite tool
+    // Detect TodoWrite tool and subagent
     const isTodoWrite = toolCall.title === "todo_write";
+    const isSubagentCall = !!(toolCall.subagentPort && toolCall.subagentSessionId);
     // Safely access ChatLayout context - will be undefined if not within ChatLayout
     const layoutContext = React.useContext(ChatLayout.Context);
-    // Click handler: toggle sidepanel for TodoWrite, expand for others
+    // Click handler: toggle sidepanel for TodoWrite, subagent details for subagents, expand for others
     const handleHeaderClick = React.useCallback(() => {
         if (isTodoWrite && layoutContext) {
             // Toggle sidepanel - close if already open on todo tab, otherwise open
@@ -58,17 +60,45 @@ export function ToolCall({ toolCall }) {
                 layoutContext.setActiveTab("todo");
             }
         }
+        else if (isSubagentCall) {
+            // Toggle subagent details
+            setIsSubagentExpanded(!isSubagentExpanded);
+        }
         else {
             // Normal expand/collapse
             setIsExpanded(!isExpanded);
         }
-    }, [isTodoWrite, layoutContext, isExpanded]);
+    }, [
+        isTodoWrite,
+        layoutContext,
+        isExpanded,
+        isSubagentCall,
+        isSubagentExpanded,
+    ]);
     // Determine which icon to show
     const IconComponent = toolCall.icon && ICON_MAP[toolCall.icon]
         ? ICON_MAP[toolCall.icon]
         : CircleDot;
     // Determine display name
     const displayName = toolCall.prettyName || toolCall.title;
+    // Determine icon color based on status (especially for subagents)
+    const isSubagentRunning = isSubagentCall &&
+        (toolCall.status === "in_progress" || toolCall.status === "pending");
+    const isSubagentFailed = isSubagentCall && toolCall.status === "failed";
+    const iconColorClass = isSubagentCall
+        ? isSubagentFailed
+            ? "text-destructive"
+            : isSubagentRunning
+                ? "text-foreground animate-pulse"
+                : "text-green-500"
+        : "text-muted-foreground";
+    const statusTooltip = isSubagentCall
+        ? isSubagentFailed
+            ? "Sub-agent failed"
+            : isSubagentRunning
+                ? "Sub-agent running"
+                : "Sub-agent completed"
+        : undefined;
     // Check if there's an error
     const hasError = toolCall.status === "failed" || !!toolCall.error;
     // Check if this is a preliminary (pending) tool call without full details yet
@@ -109,9 +139,11 @@ export function ToolCall({ toolCall }) {
     if (isPreliminary) {
         return (_jsx("div", { className: "flex flex-col my-4", children: _jsxs("span", { className: "text-paragraph-sm text-muted-foreground/50", children: ["Invoking ", displayName] }) }));
     }
-    return (_jsxs("div", { className: "flex flex-col my-4", children: [_jsxs("button", { type: "button", className: "flex flex-col items-start gap-0.5 cursor-pointer bg-transparent border-none p-0 text-left group w-fit", onClick: handleHeaderClick, "aria-expanded": isTodoWrite ? undefined : isExpanded, children: [_jsxs("div", { className: "flex items-center gap-1.5 text-[11px] font-medium text-muted-foreground", children: [_jsx("div", { className: "text-muted-foreground", children: _jsx(IconComponent, { className: "h-3 w-3" }) }), _jsx("span", { className: "text-paragraph-sm text-muted-foreground", children: displayName }), hasError && _jsx(AlertCircle, { className: "h-3 w-3 text-destructive" }), isTodoWrite ? (_jsx(ChevronRight, { className: "h-3 w-3 text-muted-foreground/70" })) : (_jsx(ChevronDown, { className: `h-3 w-3 text-muted-foreground/70 transition-transform duration-200 ${isExpanded ? "rotate-180" : ""}` }))] }), toolCall.subline && (_jsx("span", { className: "text-paragraph-sm text-muted-foreground/70 pl-4.5", children: toolCall.subline }))] }), !isTodoWrite && isExpanded && (_jsxs("div", { className: "mt-2 text-sm border border-border rounded-lg bg-card overflow-hidden w-full", children: [toolCall.locations && toolCall.locations.length > 0 && (_jsxs("div", { className: "p-3 border-b border-border", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Files" }), _jsx("ul", { className: "space-y-1", children: toolCall.locations.map((loc) => (_jsxs("li", { className: "font-mono text-[11px] text-foreground bg-muted px-1.5 py-0.5 rounded w-fit", children: [loc.path, loc.line !== null &&
+    return (_jsxs("div", { className: "flex flex-col my-4", children: [_jsxs("button", { type: "button", className: "flex flex-col items-start gap-0.5 cursor-pointer bg-transparent border-none p-0 text-left group w-fit", onClick: handleHeaderClick, "aria-expanded": isTodoWrite ? undefined : isExpanded, children: [_jsxs("div", { className: "flex items-center gap-1.5 text-[11px] font-medium text-muted-foreground", children: [_jsx("div", { className: iconColorClass, title: statusTooltip, children: _jsx(IconComponent, { className: "h-3 w-3" }) }), _jsx("span", { className: "text-paragraph-sm text-muted-foreground", children: displayName }), hasError && _jsx(AlertCircle, { className: "h-3 w-3 text-destructive" }), isTodoWrite ? (_jsx(ChevronRight, { className: "h-3 w-3 text-muted-foreground/70" })) : (_jsx(ChevronDown, { className: `h-3 w-3 text-muted-foreground/70 transition-transform duration-200 ${isExpanded ? "rotate-180" : ""}` }))] }), toolCall.subline && (_jsx("span", { className: "text-paragraph-sm text-muted-foreground/70 pl-4.5", children: toolCall.subline }))] }), !isTodoWrite && isSubagentCall && (_jsx("div", { className: "pl-4.5", children: _jsx(SubAgentDetails, { port: toolCall.subagentPort, sessionId: toolCall.subagentSessionId, parentStatus: toolCall.status, agentName: toolCall.rawInput?.agentName, query: toolCall.rawInput?.query, isExpanded: isSubagentExpanded, onExpandChange: setIsSubagentExpanded }) })), !isTodoWrite && !isSubagentCall && isExpanded && (_jsxs("div", { className: "mt-2 text-sm border border-border rounded-lg bg-card overflow-hidden w-full", children: [toolCall.rawInput &&
+                        Object.keys(toolCall.rawInput).length > 0 &&
+                        !toolCall.subagentPort && (_jsxs("div", { className: "p-3 border-b border-border", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Input" }), _jsx("div", { className: "text-[11px] font-mono text-foreground", children: _jsx(JsonView, { value: toolCall.rawInput, collapsed: false, displayDataTypes: false, displayObjectSize: false, enableClipboard: true, style: jsonStyle }) })] })), toolCall.locations && toolCall.locations.length > 0 && (_jsxs("div", { className: "p-3 border-b border-border", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Files" }), _jsx("ul", { className: "space-y-1", children: toolCall.locations.map((loc) => (_jsxs("li", { className: "font-mono text-[11px] text-foreground bg-muted px-1.5 py-0.5 rounded w-fit", children: [loc.path, loc.line !== null &&
                                             loc.line !== undefined &&
-                                            `:${loc.line}`] }, `${loc.path}:${loc.line ?? ""}`))) })] })), toolCall.rawInput && Object.keys(toolCall.rawInput).length > 0 && (_jsxs("div", { className: "p-3 border-b border-border", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Input" }), _jsx("div", { className: "text-[11px] font-mono text-foreground", children: _jsx(JsonView, { value: toolCall.rawInput, collapsed: false, displayDataTypes: false, displayObjectSize: false, enableClipboard: true, style: jsonStyle }) })] })), (toolCall.content && toolCall.content.length > 0) ||
+                                            `:${loc.line}`] }, `${loc.path}:${loc.line ?? ""}`))) })] })), (toolCall.content && toolCall.content.length > 0) ||
                         toolCall.error ? (_jsxs("div", { className: "p-3 border-b border-border last:border-0", children: [_jsx("div", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1.5 font-sans", children: "Output" }), _jsxs("div", { className: "space-y-2 text-[11px] text-foreground", children: [toolCall.content?.map((block, idx) => {
                                         // Generate a stable key based on content
                                         const getBlockKey = () => {

package/dist/gui/components/index.d.ts

@@ -34,6 +34,7 @@ export { Response, type ResponseProps } from "./Response.js";
 export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, } from "./Select.js";
 export { Toaster } from "./Sonner.js";
 export { type SourceItem, SourceListItem, type SourceListItemProps, } from "./SourceListItem.js";
+export { SubAgentDetails, type SubAgentDetailsProps, } from "./SubAgentDetails.js";
 export { Tabs, TabsContent, TabsList, TabsTrigger } from "./Tabs.js";
 export { Task, type TaskItem, TaskList, type TaskListProps, type TaskProps, } from "./Task.js";
 export { Textarea, type TextareaProps, textareaVariants } from "./Textarea.js";

package/dist/gui/components/index.js

@@ -40,6 +40,7 @@ export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScro
 export { Toaster } from "./Sonner.js";
 // Toast components
 export { SourceListItem, } from "./SourceListItem.js";
+export { SubAgentDetails, } from "./SubAgentDetails.js";
 export { Tabs, TabsContent, TabsList, TabsTrigger } from "./Tabs.js";
 // Task/Todo components
 export { Task, TaskList, } from "./Task.js";

package/dist/sdk/client/acp-client.d.ts

@@ -93,6 +93,7 @@ export declare class AcpClient {
      * - tools: List of tools available to the agent
      * - mcps: List of MCP servers connected to the agent
      * - subagents: List of subagents available via Task tool
+     * - uiConfig: UI configuration for interface appearance
      */
     getAgentInfo(): {
         name?: string;
@@ -100,6 +101,9 @@ export declare class AcpClient {
         version?: string;
         description?: string;
         suggestedPrompts?: string[];
+        uiConfig?: {
+            hideTopBar?: boolean;
+        };
         tools?: Array<{
             name: string;
             description?: string;

package/dist/sdk/client/acp-client.js

@@ -245,6 +245,7 @@ export class AcpClient {
      * - tools: List of tools available to the agent
      * - mcps: List of MCP servers connected to the agent
      * - subagents: List of subagents available via Task tool
+     * - uiConfig: UI configuration for interface appearance
      */
     getAgentInfo() {
         return this.transport.getAgentInfo?.() || {};

package/dist/sdk/schemas/session.d.ts

@@ -249,6 +249,100 @@ export declare const SessionUpdate: z.ZodUnion<readonly [z.ZodObject<{
             originalTokens: z.ZodOptional<z.ZodNumber>;
             finalTokens: z.ZodOptional<z.ZodNumber>;
         }, z.core.$strip>>;
+        subagentPort: z.ZodOptional<z.ZodNumber>;
+        subagentSessionId: z.ZodOptional<z.ZodString>;
+        subagentMessages: z.ZodOptional<z.ZodArray<z.ZodObject<{
+            id: z.ZodString;
+            content: z.ZodString;
+            toolCalls: z.ZodOptional<z.ZodArray<z.ZodObject<{
+                id: z.ZodString;
+                title: z.ZodString;
+                prettyName: z.ZodOptional<z.ZodString>;
+                icon: z.ZodOptional<z.ZodString>;
+                status: z.ZodEnum<{
+                    pending: "pending";
+                    in_progress: "in_progress";
+                    completed: "completed";
+                    failed: "failed";
+                }>;
+                content: z.ZodOptional<z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
+                    type: z.ZodLiteral<"content">;
+                    content: z.ZodObject<{
+                        type: z.ZodLiteral<"text">;
+                        text: z.ZodString;
+                    }, z.core.$strip>;
+                }, z.core.$strip>, z.ZodObject<{
+                    type: z.ZodLiteral<"text">;
+                    text: z.ZodString;
+                }, z.core.$strip>, z.ZodObject<{
+                    type: z.ZodLiteral<"image">;
+                    data: z.ZodString;
+                    mimeType: z.ZodOptional<z.ZodString>;
+                    alt: z.ZodOptional<z.ZodString>;
+                }, z.core.$strip>, z.ZodObject<{
+                    type: z.ZodLiteral<"image">;
+                    url: z.ZodString;
+                    alt: z.ZodOptional<z.ZodString>;
+                }, z.core.$strip>, z.ZodObject<{
+                    type: z.ZodLiteral<"diff">;
+                    path: z.ZodString;
+                    oldText: z.ZodString;
+                    newText: z.ZodString;
+                    line: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
+                }, z.core.$strip>, z.ZodObject<{
+                    type: z.ZodLiteral<"terminal">;
+                    terminalId: z.ZodString;
+                }, z.core.$strip>], "type">>>;
+            }, z.core.$strip>>>;
+            contentBlocks: z.ZodOptional<z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
+                type: z.ZodLiteral<"text">;
+                text: z.ZodString;
+            }, z.core.$strip>, z.ZodObject<{
+                type: z.ZodLiteral<"tool_call">;
+                toolCall: z.ZodObject<{
+                    id: z.ZodString;
+                    title: z.ZodString;
+                    prettyName: z.ZodOptional<z.ZodString>;
+                    icon: z.ZodOptional<z.ZodString>;
+                    status: z.ZodEnum<{
+                        pending: "pending";
+                        in_progress: "in_progress";
+                        completed: "completed";
+                        failed: "failed";
+                    }>;
+                    content: z.ZodOptional<z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
+                        type: z.ZodLiteral<"content">;
+                        content: z.ZodObject<{
+                            type: z.ZodLiteral<"text">;
+                            text: z.ZodString;
+                        }, z.core.$strip>;
+                    }, z.core.$strip>, z.ZodObject<{
+                        type: z.ZodLiteral<"text">;
+                        text: z.ZodString;
+                    }, z.core.$strip>, z.ZodObject<{
+                        type: z.ZodLiteral<"image">;
+                        data: z.ZodString;
+                        mimeType: z.ZodOptional<z.ZodString>;
+                        alt: z.ZodOptional<z.ZodString>;
+                    }, z.core.$strip>, z.ZodObject<{
+                        type: z.ZodLiteral<"image">;
+                        url: z.ZodString;
+                        alt: z.ZodOptional<z.ZodString>;
+                    }, z.core.$strip>, z.ZodObject<{
+                        type: z.ZodLiteral<"diff">;
+                        path: z.ZodString;
+                        oldText: z.ZodString;
+                        newText: z.ZodString;
+                        line: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
+                    }, z.core.$strip>, z.ZodObject<{
+                        type: z.ZodLiteral<"terminal">;
+                        terminalId: z.ZodString;
+                    }, z.core.$strip>], "type">>>;
+                }, z.core.$strip>;
+            }, z.core.$strip>], "type">>>;
+            isStreaming: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>>>;
+        subagentStreaming: z.ZodOptional<z.ZodBoolean>;
     }, z.core.$strip>;
     messageId: z.ZodOptional<z.ZodString>;
 }, z.core.$strip>, z.ZodObject<{
@@ -363,6 +457,8 @@ export declare const SessionUpdate: z.ZodUnion<readonly [z.ZodObject<{
             outputTokens: z.ZodOptional<z.ZodNumber>;
             totalTokens: z.ZodOptional<z.ZodNumber>;
         }, z.core.$strip>>;
+        subagentPort: z.ZodOptional<z.ZodNumber>;
+        subagentSessionId: z.ZodOptional<z.ZodString>;
     }, z.core.$strip>;
     messageId: z.ZodOptional<z.ZodString>;
 }, z.core.$strip>, z.ZodObject<{

package/dist/sdk/transports/http.d.ts

@@ -49,6 +49,9 @@ export declare class HttpTransport implements Transport {
             enabled: boolean;
             content: string;
         };
+        uiConfig?: {
+            hideTopBar?: boolean;
+        };
         tools?: Array<{
             name: string;
             description?: string;

package/dist/sdk/transports/http.js

@@ -71,6 +71,12 @@ export class HttpTransport {
                     typeof meta.initialMessage === "object"
                     ? meta.initialMessage
                     : undefined;
+                const uiConfig = metaIsObject &&
+                    "uiConfig" in meta &&
+                    meta.uiConfig &&
+                    typeof meta.uiConfig === "object"
+                    ? meta.uiConfig
+                    : undefined;
                 this.agentInfo = {
                     name: initResponse.agentInfo.name,
                     // title is the ACP field for human-readable display name
@@ -81,6 +87,7 @@ export class HttpTransport {
                     ...(description ? { description } : {}),
                     ...(suggestedPrompts ? { suggestedPrompts } : {}),
                     ...(initialMessage ? { initialMessage } : {}),
+                    ...(uiConfig ? { uiConfig } : {}),
                     ...(tools ? { tools } : {}),
                     ...(mcps ? { mcps } : {}),
                     ...(subagents ? { subagents } : {}),
@@ -159,6 +166,12 @@ export class HttpTransport {
                     typeof meta.initialMessage === "object"
                     ? meta.initialMessage
                     : undefined;
+                const uiConfig = metaIsObject &&
+                    "uiConfig" in meta &&
+                    meta.uiConfig &&
+                    typeof meta.uiConfig === "object"
+                    ? meta.uiConfig
+                    : undefined;
                 this.agentInfo = {
                     name: initResponse.agentInfo.name,
                     // title is the ACP field for human-readable display name
@@ -169,6 +182,7 @@ export class HttpTransport {
                     ...(description ? { description } : {}),
                     ...(suggestedPrompts ? { suggestedPrompts } : {}),
                     ...(initialMessage ? { initialMessage } : {}),
+                    ...(uiConfig ? { uiConfig } : {}),
                     ...(tools ? { tools } : {}),
                     ...(mcps ? { mcps } : {}),
                     ...(subagents ? { subagents } : {}),
@@ -773,6 +787,28 @@ export class HttpTransport {
                 typeof update._meta.batchId === "string"
                 ? update._meta.batchId
                 : undefined;
+            // Extract subagent connection info from _meta
+            const subagentPort = update._meta &&
+                typeof update._meta === "object" &&
+                "subagentPort" in update._meta &&
+                typeof update._meta.subagentPort === "number"
+                ? update._meta.subagentPort
+                : undefined;
+            const subagentSessionId = update._meta &&
+                typeof update._meta === "object" &&
+                "subagentSessionId" in update._meta &&
+                typeof update._meta.subagentSessionId === "string"
+                ? update._meta.subagentSessionId
+                : undefined;
+            // Debug logging for subagent connection info
+            if (subagentPort || subagentSessionId) {
+                logger.info("Extracted subagent connection info from tool_call_update", {
+                    toolCallId: update.toolCallId,
+                    subagentPort,
+                    subagentSessionId,
+                    _meta: update._meta,
+                });
+            }
             // Tool call update notification
             const toolCallUpdate = {
                 id: update.toolCallId ?? "",
@@ -835,6 +871,9 @@ export class HttpTransport {
                 completedAt: update.status === "completed" || update.status === "failed"
                     ? Date.now()
                     : undefined,
+                // Sub-agent connection info for direct SSE streaming
+                subagentPort,
+                subagentSessionId,
             };
             const sessionUpdate = {
                 type: "tool_call_update",

package/dist/sdk/transports/stdio.d.ts

@@ -31,6 +31,9 @@ export declare class StdioTransport implements Transport {
         version?: string;
         description?: string;
         suggestedPrompts?: string[];
+        uiConfig?: {
+            hideTopBar?: boolean;
+        };
         tools?: Array<{
             name: string;
             description?: string;

package/dist/sdk/transports/types.d.ts

@@ -31,6 +31,13 @@ export interface AgentInitialMessage {
     /** The content of the initial message */
     content: string;
 }
+/**
+ * UI configuration for agents
+ */
+export interface AgentUiConfig {
+    /** Whether to hide the top bar (session switcher, debugger link, settings) */
+    hideTopBar?: boolean;
+}
 /**
  * Session summary for listing
  */
@@ -90,6 +97,7 @@ export interface Transport {
      * - mcps: List of MCP servers connected to the agent
      * - subagents: List of subagents available via Task tool
      * - initialMessage: Configuration for agent's initial message on session start
+     * - uiConfig: UI configuration for controlling interface appearance
      */
     getAgentInfo?(): {
         name?: string;
@@ -98,6 +106,7 @@ export interface Transport {
         description?: string;
         suggestedPrompts?: string[];
         initialMessage?: AgentInitialMessage;
+        uiConfig?: AgentUiConfig;
         tools?: AgentToolInfo[];
         mcps?: AgentMcpInfo[];
         subagents?: AgentSubagentInfo[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@townco/ui",
-  "version": "0.1.51",
+  "version": "0.1.53",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@agentclientprotocol/sdk": "^0.5.1",
-    "@townco/core": "0.0.29",
+    "@townco/core": "0.0.31",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-label": "^2.1.8",
@@ -67,7 +67,7 @@
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.1.17",
-    "@townco/tsconfig": "0.1.48",
+    "@townco/tsconfig": "0.1.50",
     "@types/node": "^24.10.0",
     "@types/react": "^19.2.2",
     "ink": "^6.4.0",