@parallelworks/ui 0.83.1 → 0.83.3

package/dist/ai/ai.css

@@ -347,6 +347,22 @@
     0 10px 24px -10px rgb(0 0 0 / 0.18);
 }
 
+/* The thread scrolls under the dock and the jump pill, so they must hide it
+ * even when a theme makes the panel color translucent: a second layer of the
+ * same color leaves the thread at most a hundredth visible. */
+.chat-composer-dock,
+.chat-jump {
+  background:
+    linear-gradient(var(--theme-panel-bg, #fff), var(--theme-panel-bg, #fff)),
+    var(--theme-panel-bg, #fff);
+}
+
+.chat-jump:hover {
+  background:
+    linear-gradient(var(--theme-muted-panel-bg, #f3f4f6), var(--theme-muted-panel-bg, #f3f4f6)),
+    var(--theme-muted-panel-bg, #f3f4f6);
+}
+
 /* The thread runs under the docked composer and fades out above it, so the
  * last lines dissolve rather than cut off at the dock's edge. */
 .chat-composer-dock::before {

package/dist/ai/components/ChatInput.js

@@ -204,7 +204,7 @@ function ChatInput({ onSend, disabled = false, placeholder, conversationId, onEd
 		testId: sendTestId
 	});
 	return /* @__PURE__ */ jsxs("div", {
-		className: "chat-composer-dock relative bg-(--theme-panel-bg) px-4 pt-2 pb-5",
+		className: "chat-composer-dock relative px-4 pt-2 pb-5",
 		...attachmentsAvailable ? dragHandlers : {},
 		children: [isDragging && /* @__PURE__ */ jsx(DragOverlay, { className: "rounded-2xl" }), /* @__PURE__ */ jsxs("div", {
 			className: "mx-auto w-full max-w-[var(--chat-column,50rem)] space-y-2 sm:px-4",

package/dist/ai/components/ChatMessage.js

@@ -9,6 +9,7 @@ import { CopyButton } from "../../components/CopyButton.js";
 import { formatDuration } from "../../format.js";
 import { RelativeTime } from "../../components/relativeTime.js";
 import { useChatConfig } from "../core/config.js";
+import { useChatModelName } from "../core/ChatProvider.js";
 import Markdown from "../ui/Markdown.js";
 import { chatProseClasses } from "../ui/prose.js";
 import { Reasoning } from "./Reasoning.js";
@@ -93,11 +94,15 @@ function ChatMessage({ message, allMessages, isStreaming = false, latest = false
 	};
 	const timestamp = parseTimestamp(message.timestamp);
 	const totalTokens = message.tokensUsed?.total_tokens;
+	const modelName = useChatModelName(isUser ? void 0 : message.model);
 	const meta = (timestamp || !isUser && (message.model || totalTokens)) && /* @__PURE__ */ jsxs("span", {
 		className: cx("chat-meta flex items-center gap-2 ml-2 text-xs tabular-nums theme-muted-text transition-opacity duration-150 select-none", "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100"),
 		children: [
 			/* @__PURE__ */ jsx(RelativeTime, { value: timestamp }),
-			!isUser && message.model && /* @__PURE__ */ jsx("span", { children: message.model }),
+			!isUser && message.model && /* @__PURE__ */ jsx("span", {
+				title: modelName ? message.model : void 0,
+				children: modelName ?? message.model
+			}),
 			!isUser && totalTokens ? /* @__PURE__ */ jsx("span", {
 				title: message.tokensUsed?.prompt_tokens !== void 0 && message.tokensUsed?.completion_tokens !== void 0 ? t.tokensBreakdown(message.tokensUsed.prompt_tokens, message.tokensUsed.completion_tokens) : void 0,
 				children: t.tokens(totalTokens)

package/dist/ai/components/ChatMessageList.js

@@ -12,6 +12,8 @@ import ChatMessage_default from "./ChatMessage.js";
 import { memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/ai/components/ChatMessageList.tsx
+var READER_GROWTH_MS = 600;
+var jumpClasses = "chat-composer chat-jump rounded-full px-3 py-1.5 text-xs font-medium theme-text transition-colors";
 function ChatMessageList({ messages, allMessages, streamingMessage: streamingMessageProp, queuedMessages, onRemoveQueued, canRemoveQueued, queueDelivery = "afterReply", editingMessageId, showAuthor, currentUsername, onNavigateBranch, onEditMessage, onSaveEdit, onCancelEdit, onRegenerateMessage, onRetryMessage, onOpenReasoning, onApprovalAnswer, inputElement, isStreaming: isStreamingProp, flush, label, footer, workingIndicator = true }) {
 	const { adapter, isStreaming: providerStreaming } = useChat();
 	const { isThinking, streamingContent, streamingReasoning, streamingParts, thinkingStartTime } = useChatStream();
@@ -154,15 +156,25 @@ function ChatMessageList({ messages, allMessages, streamingMessage: streamingMes
 	useEffect(() => {
 		const content = contentRef.current;
 		if (!content || typeof ResizeObserver === "undefined") return;
+		let touchedAt = Number.NEGATIVE_INFINITY;
+		const touched = () => {
+			touchedAt = performance.now();
+		};
+		content.addEventListener("click", touched, true);
+		content.addEventListener("keydown", touched, true);
 		const observer = new ResizeObserver(() => {
 			const el = containerRef.current;
-			if (el && isNearBottomRef.current && !hasQueuedMessages) {
+			if (el && isNearBottomRef.current && !hasQueuedMessages && performance.now() - touchedAt > READER_GROWTH_MS) {
 				el.scrollTop = el.scrollHeight;
 				lastScrollTopRef.current = el.scrollTop;
 			}
 		});
 		observer.observe(content);
-		return () => observer.disconnect();
+		return () => {
+			observer.disconnect();
+			content.removeEventListener("click", touched, true);
+			content.removeEventListener("keydown", touched, true);
+		};
 	}, [hasContent, hasQueuedMessages]);
 	if (messages.length === 0 && !streamingMessage && !hasQueuedMessages) return /* @__PURE__ */ jsxs("div", {
 		className: "chat-thread flex-1 overflow-y-auto flex flex-col bg-(--theme-panel-bg)",
@@ -304,18 +316,26 @@ function ChatMessageList({ messages, allMessages, streamingMessage: streamingMes
 					/* @__PURE__ */ jsx("div", { className: "h-8" })
 				]
 			}),
-			!pinned && /* @__PURE__ */ jsx("div", {
+			!pinned && !inputElement && /* @__PURE__ */ jsx("div", {
 				className: "sticky bottom-4 z-10 flex h-0 items-start justify-center overflow-visible",
 				children: /* @__PURE__ */ jsx("button", {
 					type: "button",
 					onClick: jumpToLatest,
-					className: "chat-composer -translate-y-full rounded-full bg-(--theme-panel-bg) px-3 py-1.5 text-xs font-medium theme-text transition-colors hover:bg-(--theme-muted-panel-bg)",
+					className: cx(jumpClasses, "-translate-y-full"),
 					children: strings.chrome.jumpToLatest
 				})
 			}),
-			inputElement && /* @__PURE__ */ jsx("div", {
+			inputElement && /* @__PURE__ */ jsxs("div", {
 				className: "sticky bottom-0 z-10",
-				children: inputElement
+				children: [!pinned && /* @__PURE__ */ jsx("div", {
+					className: "pointer-events-none absolute inset-x-0 bottom-full flex justify-center pb-2",
+					children: /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: jumpToLatest,
+						className: cx(jumpClasses, "pointer-events-auto"),
+						children: strings.chrome.jumpToLatest
+					})
+				}), inputElement]
 			})
 		]
 	});

package/dist/ai/components/agent/AgentMessageParts.d.ts

@@ -19,6 +19,12 @@ type RenderItem = {
 } | {
     kind: 'rollup';
     members: RunMember[];
+} | {
+    kind: 'calls';
+    members: {
+        part: ToolCallPart;
+        index: number;
+    }[];
 };
 export declare function buildRenderItems(parts: MessagePart[], hostDrawn?: (toolName: string) => boolean): RenderItem[];
 export default function AgentMessageParts({ message, isStreaming, onApprovalAnswer, }: {

package/dist/ai/components/agent/AgentMessageParts.js

@@ -282,12 +282,16 @@ function ToolCallBlock({ part, children }) {
 					children: fullToolArgs(header.arg, part.args)
 				}), /* @__PURE__ */ jsx(ResultBody, { part })]
 			}),
+			part.status === "error" && !expanded && /* @__PURE__ */ jsx("div", {
+				className: "ml-5 mt-0.5 truncate text-[13px] text-(--theme-error-text)",
+				children: t.failedWith(summary)
+			}),
 			children && /* @__PURE__ */ jsx("div", {
 				className: "mt-1.5 min-w-0 sm:ml-5",
 				children
 			}),
-			!children && !isDiff && !expanded && part.status !== "waiting" && /* @__PURE__ */ jsx("div", {
-				className: cx("ml-5 mt-0.5 truncate text-[13px]", part.status === "error" ? "text-(--theme-error-text)" : "theme-muted-text"),
+			!children && !isDiff && !expanded && part.status !== "waiting" && part.status !== "error" && /* @__PURE__ */ jsx("div", {
+				className: "ml-5 mt-0.5 truncate text-[13px] theme-muted-text",
 				children: summary
 			}),
 			isDiff && /* @__PURE__ */ jsx("div", {
@@ -867,7 +871,36 @@ function buildRenderItems(parts, hostDrawn = () => false) {
 		});
 	});
 	flush();
-	return items;
+	return groupRepeatedCalls(items);
+}
+/** A call that can share a row with the same tool's calls beside it: never one
+*  still running, so its progress stays in view, one waiting on an answer, or
+*  one whose decision line names who answered it. */
+function foldableCall(item) {
+	return item.kind === "single" && item.part.kind === "tool_call" && (item.part.status === "ok" || item.part.status === "error") && !item.part.decision ? item.part : null;
+}
+function groupRepeatedCalls(items) {
+	const out = [];
+	let i = 0;
+	while (i < items.length) {
+		const item = items[i];
+		const first = foldableCall(item);
+		let j = i + 1;
+		while (first && j < items.length && foldableCall(items[j])?.name === first.name) j++;
+		if (j - i >= 2) out.push({
+			kind: "calls",
+			members: items.slice(i, j).map((m) => {
+				const single = m;
+				return {
+					part: single.part,
+					index: single.index
+				};
+			})
+		});
+		else out.push(item);
+		i = j;
+	}
+	return out;
 }
 function RollupGroup({ members, message }) {
 	const { strings } = useChatConfig();
@@ -894,6 +927,60 @@ function RollupGroup({ members, message }) {
 		})
 	});
 }
+/** Calls to one tool in a row, folded into one line that counts them and their
+*  failures. Folded, it still shows what a host drew for each call, such as a
+*  table, so results stay in view; calls with nothing drawn show nothing. */
+function CallGroup({ members, message }) {
+	const { strings, slots } = useChatConfig();
+	const t = strings.agentTranscript;
+	const [open, setOpen] = useState(false);
+	const name = members[0]?.part.name ?? "";
+	const Tool = slots.toolRenderers?.[name];
+	const header = toolHeaderFor(name);
+	const failed = members.filter((m) => m.part.status === "error").length;
+	const status = failed === members.length ? "error" : "ok";
+	return /* @__PURE__ */ jsxs("div", {
+		className: "py-1.5 text-sm",
+		"data-testid": "tool-call-group",
+		children: [/* @__PURE__ */ jsx(Disclosure, {
+			open,
+			onOpenChange: setOpen,
+			keepMounted: true,
+			summaryClassName: rowSummaryClasses,
+			summary: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ToolStatusDot, { part: {
+				...members[0]?.part,
+				status
+			} }), /* @__PURE__ */ jsxs("span", {
+				className: "font-mono text-[13px] leading-5 min-w-0 truncate",
+				children: [t.callGroup(header.label, members.length), failed > 0 && /* @__PURE__ */ jsxs("span", {
+					className: "text-(--theme-error-text)",
+					children: [" · ", t.failedCount(failed)]
+				})]
+			})] }),
+			panelClassName: "ml-1.5 mt-0.5 rounded-md bg-(--theme-muted-panel-bg)/40 px-2",
+			children: members.map((m) => /* @__PURE__ */ jsx(PartDispatch, {
+				part: m.part,
+				message
+			}, m.index))
+		}), !open && Tool && members.map(({ part, index }) => {
+			const args = summarizeToolArgs(header.arg, part.args);
+			return /* @__PURE__ */ jsxs("div", {
+				className: "mt-1.5 min-w-0 sm:ml-5 has-[>[data-drawing]:empty]:hidden",
+				children: [args && /* @__PURE__ */ jsx("div", {
+					className: "truncate font-mono text-xs theme-muted-text",
+					children: args
+				}), /* @__PURE__ */ jsx("div", {
+					"data-drawing": true,
+					className: "mt-1",
+					children: /* @__PURE__ */ jsx(Tool, {
+						part,
+						message
+					})
+				})]
+			}, index);
+		})]
+	});
+}
 function AgentMessageParts({ message, isStreaming, onApprovalAnswer }) {
 	const parts = message.parts ?? [];
 	const { slots } = useChatConfig();
@@ -906,6 +993,9 @@ function AgentMessageParts({ message, isStreaming, onApprovalAnswer }) {
 		children: items.map((item) => item.kind === "rollup" ? /* @__PURE__ */ jsx(RollupGroup, {
 			members: item.members,
 			message
+		}, item.members[0]?.index ?? 0) : item.kind === "calls" ? /* @__PURE__ */ jsx(CallGroup, {
+			members: item.members,
+			message
 		}, item.members[0]?.index ?? 0) : item.kind === "reasoning" ? /* @__PURE__ */ jsx(ReasoningBlock, {
 			part: mergeReasoning(item.parts),
 			isStreaming: (isStreaming ?? false) && item.index + item.parts.length - 1 === lastIndex

package/dist/ai/core/ChatProvider.d.ts

@@ -69,6 +69,9 @@ export interface ChatStream {
     streamingParts: MessagePart[];
     thinkingStartTime: number | null;
 }
+/** A model's display name by its id, when the adapter listed one; undefined
+ *  outside a ChatProvider or for a model it doesn't list. */
+export declare function useChatModelName(id: string | null | undefined): string | undefined;
 export declare function useChat(): ChatContextValue;
 /** True while the adapter lists tools of its own, which the composer's +
  *  menu offers; false outside a ChatProvider. */

package/dist/ai/core/ChatProvider.js

@@ -61,6 +61,13 @@ function historyMessages(messages, selectedProvider) {
 var NO_TOOLS = [];
 var ChatContext = createContext(void 0);
 var ChatStreamContext = createContext(void 0);
+var ChatModelsContext = createContext([]);
+/** A model's display name by its id, when the adapter listed one; undefined
+*  outside a ChatProvider or for a model it doesn't list. */
+function useChatModelName(id) {
+	const models = useContext(ChatModelsContext);
+	return id ? models.find((m) => m.id === id)?.name || void 0 : void 0;
+}
 function useChat() {
 	const context = useContext(ChatContext);
 	if (!context) throw new Error("useChat must be used within a ChatProvider");
@@ -984,13 +991,16 @@ function ChatProvider({ adapter, currentUser, navigation, activeConversationId =
 			value: reportSidebarPresentation,
 			children: /* @__PURE__ */ jsx(ChatContext.Provider, {
 				value,
-				children: /* @__PURE__ */ jsx(ChatStreamContext.Provider, {
-					value: stream,
-					children
+				children: /* @__PURE__ */ jsx(ChatModelsContext.Provider, {
+					value: state.models,
+					children: /* @__PURE__ */ jsx(ChatStreamContext.Provider, {
+						value: stream,
+						children
+					})
 				})
 			})
 		})
 	});
 }
 //#endregion
-export { ChatProvider, useChat, useChatStream, useHasChatTools };
+export { ChatProvider, useChat, useChatModelName, useChatStream, useHasChatTools };

package/dist/ai/core/parts.d.ts

@@ -7,8 +7,9 @@ import type { MessagePart } from '../types.js';
  *  rather than invented — an end without a start has nothing to render. */
 export declare function applyPartDelta(parts: MessagePart[], delta: PartDelta): MessagePart[];
 /** The wire history for an assistant turn whose tool calls the gateway ran:
- *  the calls, each result, then the answer. A turn with no finished tool
- *  calls comes back as the answer alone. */
+ *  each round's calls, with the text that came before them, and each result,
+ *  then the answer. A turn with no finished tool calls comes back as the
+ *  answer alone. */
 export declare function toolTurnMessages(parts: MessagePart[] | null | undefined, answer: CompletionMessage): CompletionMessage[];
 /** A turn can end (completed or stopped) with tool calls still marked
  *  running — the transport died before their tool_end arrived. A stored

package/dist/ai/core/parts.js

@@ -99,31 +99,54 @@ function isStreamedText(part) {
 	return part?.kind === "text" || part?.kind === "reasoning";
 }
 /** The wire history for an assistant turn whose tool calls the gateway ran:
-*  the calls, each result, then the answer. A turn with no finished tool
-*  calls comes back as the answer alone. */
+*  each round's calls, with the text that came before them, and each result,
+*  then the answer. A turn with no finished tool calls comes back as the
+*  answer alone. */
 function toolTurnMessages(parts, answer) {
-	const calls = (parts ?? []).filter((p) => p.kind === "tool_call" && p.status !== "running" && p.result !== void 0);
-	if (calls.length === 0) return answer.content || answer.tool_calls?.length ? [answer] : [];
-	return [
-		{
-			role: "assistant",
-			content: null,
-			tool_calls: calls.map((c) => ({
-				id: c.id,
-				type: "function",
-				function: {
-					name: c.name,
-					arguments: c.args
-				}
-			}))
-		},
-		...calls.map((c) => ({
-			role: "tool",
-			tool_call_id: c.id,
-			content: c.result
-		})),
-		...answer.content ? [answer] : []
-	];
+	const rounds = [];
+	let text = "";
+	let calls = [];
+	let hasText = false;
+	for (const p of parts ?? []) if (p.kind === "text") {
+		hasText = true;
+		if (calls.length > 0) {
+			rounds.push({
+				text,
+				calls
+			});
+			text = "";
+			calls = [];
+		}
+		text += p.text;
+	} else if (p.kind === "tool_call" && p.status !== "running" && p.result !== void 0) calls.push(p);
+	if (calls.length > 0) {
+		rounds.push({
+			text,
+			calls
+		});
+		text = "";
+	}
+	if (rounds.length === 0) return answer.content || answer.tool_calls?.length ? [answer] : [];
+	const final = hasText ? {
+		...answer,
+		content: text || null
+	} : answer;
+	return [...rounds.flatMap((round) => [{
+		role: "assistant",
+		content: round.text || null,
+		tool_calls: round.calls.map((c) => ({
+			id: c.id,
+			type: "function",
+			function: {
+				name: c.name,
+				arguments: c.args
+			}
+		}))
+	}, ...round.calls.map((c) => ({
+		role: "tool",
+		tool_call_id: c.id,
+		content: c.result
+	}))]), ...final.content ? [final] : []];
 }
 /** A turn can end (completed or stopped) with tool calls still marked
 *  running — the transport died before their tool_end arrived. A stored

package/dist/ai/strings.d.ts

@@ -226,6 +226,12 @@ export interface ChatStrings {
         running: string;
         done: string;
         failed: string;
+        /** A failed call's row, with the first line of its error. */
+        failedWith: (reason: string) => string;
+        /** Consecutive calls to one tool, folded into one row. */
+        callGroup: (tool: string, count: number) => string;
+        /** Beside a folded row: how many of its calls failed. */
+        failedCount: (count: number) => string;
         interrupted: string;
         noOutput: string;
         diffTruncated: string;

package/dist/ai/strings.js

@@ -241,6 +241,9 @@ var defaultChatStrings = {
 		running: "Running…",
 		done: "Done",
 		failed: "Failed",
+		failedWith: (reason) => `Failed: ${reason}`,
+		callGroup: (tool, count) => `Ran ${tool} ${countOf(count, "time", "times")}`,
+		failedCount: (count) => `${count} failed`,
 		interrupted: "Interrupted",
 		noOutput: "(no output)",
 		diffTruncated: "Diff truncated",

package/dist/components/MarkdownImpl.js

@@ -10,7 +10,7 @@ import { jsx } from "react/jsx-runtime";
 import { code } from "@streamdown/code";
 import { math } from "@streamdown/math";
 import "katex/dist/katex.min.css";
-import { Streamdown, defaultComponents, defaultRehypePlugins, useIsCodeFenceIncomplete } from "streamdown";
+import { Streamdown, defaultComponents, defaultRehypePlugins, defaultRemarkPlugins, useIsCodeFenceIncomplete } from "streamdown";
 //#region src/components/MarkdownImpl.tsx
 var basePlugins = {
 	code,
@@ -35,6 +35,7 @@ function loadMermaid() {
 	return mermaidLoad;
 }
 var rehypePlugins = [...Object.values(defaultRehypePlugins), rehypeCodeBreaks];
+var remarkPlugins = Object.entries(defaultRemarkPlugins).map(([name, plugin]) => name === "gfm" ? [Array.isArray(plugin) ? plugin[0] : plugin, { singleTilde: false }] : plugin);
 var httpsImagesRehypePlugins = [...Object.entries(defaultRehypePlugins).flatMap(([name, plugin]) => name === "harden" ? [rehypeHttpsImagesOnly, plugin] : [plugin]), rehypeCodeBreaks];
 function codeControls(controls) {
 	if (controls === false) return {
@@ -146,6 +147,7 @@ function MarkdownImpl({ children, isStreaming, controls, components, httpsImages
 			} : {},
 			...controls ? { controls } : {},
 			plugins,
+			remarkPlugins,
 			rehypePlugins: httpsImagesOnly ? httpsImagesRehypePlugins : rehypePlugins,
 			shikiTheme: CODE_THEMES,
 			components: {