@copilotkit/react-core 1.79.2-canary.1792172552 → 1.80.0

package/dist/v2/index.umd.js

@@ -1,10 +1,10 @@
 "use client";
 
 (function(global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ?  factory(exports, require('./index.css'), require('@copilotkit/core'), require('@ag-ui/client'), require('react'), require('tailwind-merge'), require('lucide-react'), require('@copilotkit/shared'), require('react/jsx-runtime'), require('@radix-ui/react-slot'), require('class-variance-authority'), require('clsx'), require('@radix-ui/react-tooltip'), require('@radix-ui/react-dropdown-menu'), require('streamdown'), require('@ag-ui/core'), require('zod'), require('@copilotkit/mcp-apps-renderer/activity'), require('@copilotkit/a2ui-renderer'), require('zod-to-json-schema'), require('react-dom'), require('@tanstack/react-virtual'), require('use-stick-to-bottom'), require('@copilotkit/web-components/threads-drawer')) :
-  typeof define === 'function' && define.amd ? define(['exports', './index.css', '@copilotkit/core', '@ag-ui/client', 'react', 'tailwind-merge', 'lucide-react', '@copilotkit/shared', 'react/jsx-runtime', '@radix-ui/react-slot', 'class-variance-authority', 'clsx', '@radix-ui/react-tooltip', '@radix-ui/react-dropdown-menu', 'streamdown', '@ag-ui/core', 'zod', '@copilotkit/mcp-apps-renderer/activity', '@copilotkit/a2ui-renderer', 'zod-to-json-schema', 'react-dom', '@tanstack/react-virtual', 'use-stick-to-bottom', '@copilotkit/web-components/threads-drawer'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.CopilotKitReactCoreV2 = {}), global.src_v2_index_css,global.CopilotKitCore,global.AgUIClient,global.React,global.tailwindMerge,global.lucideReact,global.CopilotKitShared,global.ReactJsxRuntime,global.RadixReactSlot,global.classVarianceAuthority,global.clsx,global.RadixReactTooltip,global.RadixReactDropdownMenu,global.streamdown,global.AgUICore,global.Zod,global.CopilotKitMcpAppsRendererActivity,global.CopilotKitA2UIRenderer,global.zod_to_json_schema,global.ReactDOM,global._tanstack_react_virtual,global.useStickToBottom,global._copilotkit_web_components_threads_drawer));
-})(this, function(exports, src_v2_index_css, _copilotkit_core, _ag_ui_client, react, tailwind_merge, lucide_react, _copilotkit_shared, react_jsx_runtime, _radix_ui_react_slot, class_variance_authority, clsx, _radix_ui_react_tooltip, _radix_ui_react_dropdown_menu, streamdown, _ag_ui_core, zod, _copilotkit_mcp_apps_renderer_activity, _copilotkit_a2ui_renderer, zod_to_json_schema, react_dom, _tanstack_react_virtual, use_stick_to_bottom, _copilotkit_web_components_threads_drawer) {
+  typeof exports === 'object' && typeof module !== 'undefined' ?  factory(exports, require('./index.css'), require('@copilotkit/core'), require('@ag-ui/client'), require('react'), require('tailwind-merge'), require('lucide-react'), require('@copilotkit/shared'), require('react/jsx-runtime'), require('@radix-ui/react-slot'), require('class-variance-authority'), require('clsx'), require('@radix-ui/react-tooltip'), require('@radix-ui/react-dropdown-menu'), require('streamdown'), require('@ag-ui/core'), require('zod'), require('@copilotkit/mcp-apps-renderer/activity'), require('@copilotkit/a2ui-renderer'), require('zod-to-json-schema'), require('@radix-ui/react-popover'), require('react-dom'), require('@tanstack/react-virtual'), require('use-stick-to-bottom'), require('@copilotkit/web-components/threads-drawer')) :
+  typeof define === 'function' && define.amd ? define(['exports', './index.css', '@copilotkit/core', '@ag-ui/client', 'react', 'tailwind-merge', 'lucide-react', '@copilotkit/shared', 'react/jsx-runtime', '@radix-ui/react-slot', 'class-variance-authority', 'clsx', '@radix-ui/react-tooltip', '@radix-ui/react-dropdown-menu', 'streamdown', '@ag-ui/core', 'zod', '@copilotkit/mcp-apps-renderer/activity', '@copilotkit/a2ui-renderer', 'zod-to-json-schema', '@radix-ui/react-popover', 'react-dom', '@tanstack/react-virtual', 'use-stick-to-bottom', '@copilotkit/web-components/threads-drawer'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.CopilotKitReactCoreV2 = {}), global.src_v2_index_css,global.CopilotKitCore,global.AgUIClient,global.React,global.tailwindMerge,global.lucideReact,global.CopilotKitShared,global.ReactJsxRuntime,global.RadixReactSlot,global.classVarianceAuthority,global.clsx,global.RadixReactTooltip,global.RadixReactDropdownMenu,global.streamdown,global.AgUICore,global.Zod,global.CopilotKitMcpAppsRendererActivity,global.CopilotKitA2UIRenderer,global.zod_to_json_schema,global._radix_ui_react_popover,global.ReactDOM,global._tanstack_react_virtual,global.useStickToBottom,global._copilotkit_web_components_threads_drawer));
+})(this, function(exports, src_v2_index_css, _copilotkit_core, _ag_ui_client, react, tailwind_merge, lucide_react, _copilotkit_shared, react_jsx_runtime, _radix_ui_react_slot, class_variance_authority, clsx, _radix_ui_react_tooltip, _radix_ui_react_dropdown_menu, streamdown, _ag_ui_core, zod, _copilotkit_mcp_apps_renderer_activity, _copilotkit_a2ui_renderer, zod_to_json_schema, _radix_ui_react_popover, react_dom, _tanstack_react_virtual, use_stick_to_bottom, _copilotkit_web_components_threads_drawer) {
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 //#region \0rolldown/runtime.js
 	var __create = Object.create;
@@ -36,6 +36,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 react = __toESM(react);
 _radix_ui_react_tooltip = __toESM(_radix_ui_react_tooltip);
 _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
+_radix_ui_react_popover = __toESM(_radix_ui_react_popover);
 
 //#region src/v2/lib/react-core.ts
 	var CopilotKitCoreReact = class extends _copilotkit_core.CopilotKitCore {
@@ -215,6 +216,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		chatInputToolbarFinishTranscribeButtonLabel: "Finish",
 		chatInputToolbarAddButtonLabel: "Add attachments",
 		chatInputToolbarToolsButtonLabel: "Tools",
+		chatInputToolbarSendButtonLabel: "Send message",
+		chatInputToolbarStopButtonLabel: "Stop",
 		assistantMessageToolbarCopyCodeLabel: "Copy",
 		assistantMessageToolbarCopyCodeCopiedLabel: "Copied",
 		assistantMessageToolbarCopyMessageLabel: "Copy",
@@ -227,13 +230,18 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		assistantMessageToolbarInspectorHideDescription: "Until you reload this page",
 		assistantMessageToolbarThumbsUpLabel: "Good response",
 		assistantMessageToolbarThumbsDownLabel: "Bad response",
+		assistantMessageFeedbackCommentPlaceholder: "Add a comment (optional)",
+		assistantMessageFeedbackCommentSubmitLabel: "Send comment",
 		assistantMessageToolbarReadAloudLabel: "Read aloud",
 		assistantMessageToolbarRegenerateLabel: "Regenerate",
 		userMessageToolbarCopyMessageLabel: "Copy",
 		userMessageToolbarEditMessageLabel: "Edit",
+		userMessageToolbarPreviousBranchLabel: "Previous branch",
+		userMessageToolbarNextBranchLabel: "Next branch",
 		chatDisclaimerText: "AI can make mistakes. Please verify important information.",
 		chatToggleOpenLabel: "Open chat",
 		chatToggleCloseLabel: "Close chat",
+		chatScrollToBottomLabel: "Scroll to bottom",
 		modalHeaderTitle: "CopilotKit Chat",
 		welcomeMessageText: "How can I help you today?"
 	};
@@ -495,9 +503,9 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 
 //#endregion
 //#region src/v2/lib/utils.ts
-	const twMerge$10 = (0, tailwind_merge.extendTailwindMerge)({ prefix: "cpk" });
+	const twMerge$12 = (0, tailwind_merge.extendTailwindMerge)({ prefix: "cpk" });
 	function cn(...inputs) {
-		return twMerge$10((0, clsx.clsx)(inputs));
+		return twMerge$12((0, clsx.clsx)(inputs));
 	}
 
 //#endregion
@@ -945,6 +953,11 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 //#region src/v2/components/chat/CopilotChatInput.tsx
 	const SLASH_MENU_MAX_VISIBLE_ITEMS = 5;
 	const SLASH_MENU_ITEM_HEIGHT_PX = 40;
+	/**
+	* The chat composer: a text area with the add-menu, voice and send/stop
+	* buttons, and a slash-command menu that lists `toolsMenu` items once the text
+	* starts with "/".
+	*/
 	function CopilotChatInput({ mode = "input", onSubmitMessage, onStop, isRunning = false, onStartTranscribe, onCancelTranscribe, onFinishTranscribe, onFinishTranscribeWithAudio, onAddFile, onChange, value, toolsMenu, autoFocus = false, positioning = "static", keyboardHeight = 0, containerRef, showDisclaimer, bottomAnchored = false, textArea, sendButton, startTranscribeButton, cancelTranscribeButton, finishTranscribeButton, addMenuButton, audioRecorder, disclaimer, children, className, ...props }) {
 		const isControlled = value !== void 0;
 		const [internalValue, setInternalValue] = (0, react.useState)(() => value ?? "");
@@ -1164,10 +1177,12 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			send();
 		};
 		const BoundAudioRecorder = renderSlot(audioRecorder, CopilotChatAudioRecorder, { ref: audioRecorderRef });
+		const showsStop = isProcessing && canStop;
 		const BoundSendButton = renderSlot(sendButton, CopilotChatInput.SendButton, {
 			onClick: handleSendButtonClick,
 			disabled: isProcessing ? !canStop : !canSend,
-			children: isProcessing && canStop ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Square, { className: "cpk:size-[18px] cpk:fill-current" }) : void 0
+			"aria-label": showsStop ? labels.chatInputToolbarStopButtonLabel : labels.chatInputToolbarSendButtonLabel,
+			children: showsStop ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Square, { className: "cpk:size-[18px] cpk:fill-current" }) : void 0
 		});
 		const BoundStartTranscribeButton = renderSlot(startTranscribeButton, CopilotChatInput.StartTranscribeButton, { onClick: onStartTranscribe });
 		const BoundCancelTranscribeButton = renderSlot(cancelTranscribeButton, CopilotChatInput.CancelTranscribeButton, { onClick: onCancelTranscribe });
@@ -1479,18 +1494,22 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 	}
 	(function(_CopilotChatInput) {
-		_CopilotChatInput.SendButton = ({ className, children, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "cpk:mr-[10px]",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
-				type: "button",
-				"data-testid": "copilot-send-button",
-				variant: "chatInputToolbarPrimary",
-				size: "chatInputToolbarIcon",
-				className,
-				...props,
-				children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUp, { className: "cpk:size-[18px]" })
-			})
-		});
+		_CopilotChatInput.SendButton = ({ className, children, ...props }) => {
+			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "cpk:mr-[10px]",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+					type: "button",
+					"data-testid": "copilot-send-button",
+					variant: "chatInputToolbarPrimary",
+					size: "chatInputToolbarIcon",
+					className,
+					"aria-label": labels.chatInputToolbarSendButtonLabel,
+					...props,
+					children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUp, { className: "cpk:size-[18px]" })
+				})
+			});
+		};
 		const ToolbarButton = _CopilotChatInput.ToolbarButton = ({ icon, labelKey, defaultClassName, className, ...props }) => {
 			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipTrigger, {
@@ -1500,6 +1519,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 					variant: "chatInputToolbarSecondary",
 					size: "chatInputToolbarIcon",
 					className: (0, tailwind_merge.twMerge)(defaultClassName, className),
+					"aria-label": labels[labelKey],
 					...props,
 					children: icon
 				})
@@ -1570,6 +1590,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				size: "chatInputToolbarIcon",
 				className: (0, tailwind_merge.twMerge)("cpk:ml-1", className),
 				disabled: isDisabled,
+				"aria-label": labels.chatInputToolbarAddButtonLabel,
 				...props,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { className: "cpk:size-[20px]" })
 			});
@@ -1719,6 +1740,32 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		}
 	}
 	/**
+	* The tool-call renderers registered on the provider, kept current.
+	* @internal
+	*/
+	function useToolCallRenderers() {
+		const { copilotkit } = useCopilotKit();
+		return (0, react.useSyncExternalStore)((callback) => copilotkit.subscribe({ onRenderToolCallsChanged: callback }).unsubscribe, () => copilotkit.renderToolCalls, () => copilotkit.renderToolCalls);
+	}
+	/**
+	* Which tool names have a renderer of their own, whether a wildcard (`"*"`)
+	* renderer is registered, and which of them opted into grouping.
+	* @internal
+	*/
+	function useToolCallRendererNames() {
+		const renderers = useToolCallRenderers();
+		return (0, react.useMemo)(() => {
+			const named = renderers.filter((rc) => rc.name !== "*");
+			const wildcards = renderers.filter((rc) => rc.name === "*");
+			return {
+				named: new Set(named.map((rc) => rc.name)),
+				groupedNames: new Set(named.filter((rc) => rc.group).map((rc) => rc.name)),
+				wildcard: wildcards.length > 0,
+				wildcardGroups: wildcards.some((rc) => rc.group)
+			};
+		}, [renderers]);
+	}
+	/**
 	* Hook that returns a function to render tool calls based on the render functions
 	* defined in CopilotKitProvider.
 	*
@@ -1729,9 +1776,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		const agentId = useCopilotChatConfiguration()?.agentId ?? _copilotkit_shared.DEFAULT_AGENT_ID;
 		const unrenderedToolNames = (0, react.useRef)(/* @__PURE__ */ new Set());
 		const warnedToolNames = (0, react.useRef)(/* @__PURE__ */ new Set());
-		const renderToolCalls = (0, react.useSyncExternalStore)((callback) => {
-			return copilotkit.subscribe({ onRenderToolCallsChanged: callback }).unsubscribe;
-		}, () => copilotkit.renderToolCalls, () => copilotkit.renderToolCalls);
+		const renderToolCalls = useToolCallRenderers();
 		const renderToolCall = (0, react.useCallback)(({ toolCall, toolMessage }) => {
 			const exactMatches = renderToolCalls.filter((rc) => rc.name === toolCall.function.name);
 			const renderConfig = exactMatches.find((rc) => rc.agentId === agentId) || exactMatches.find((rc) => !rc.agentId) || exactMatches[0] || renderToolCalls.find((rc) => rc.name === "*");
@@ -1766,7 +1811,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 
 //#endregion
 //#region package.json
-	var version = "1.79.2-canary.1792172552";
+	var version = "1.80.0";
 
 //#endregion
 //#region src/v2/components/CopilotKitInspector.tsx
@@ -2002,7 +2047,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 	* Fetches resource content on-demand via proxied MCP requests. The React shell
 	* owns the iframe; `bindMcpApp` owns the protocol.
 	*/
-	const MCPAppsActivityRenderer = function MCPAppsActivityRenderer({ content, message, agent }) {
+	const MCPAppsActivityRenderer = function MCPAppsActivityRenderer({ content, message, agent, allowSameOriginFallback }) {
 		const { copilotkit } = useCopilotKit();
 		const messageId = message?.id;
 		const containerRef = (0, react.useRef)(null);
@@ -2052,6 +2097,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 						getAgent: () => agentRef.current,
 						host: copilotkit,
 						messageId,
+						options: { allowSameOriginFallback },
 						hooks: {
 							onResource: (resource) => {
 								if (!mounted) return;
@@ -2093,6 +2139,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			agent,
 			copilotkit,
 			messageId,
+			allowSameOriginFallback,
 			content.resourceUri,
 			content.serverHash,
 			content.serverId
@@ -3307,7 +3354,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			name: def.name,
 			args: argsSchema,
 			render: def.render,
-			...def.agentId ? { agentId: def.agentId } : {}
+			...def.agentId ? { agentId: def.agentId } : {},
+			...def.group ? { group: true } : {}
 		};
 	}
 
@@ -3427,6 +3475,11 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 - Use CSS Grid or Flexbox for layout. Ensure the UI looks good at any width.
 - Minimal transitions (150ms) for hover/focus states only. No decorative animations.
 - Keep the UI focused and dense — avoid excessive padding. Use compact spacing (8–12px gaps, 10–14px padding in controls).`;
+	/** The MCP Apps renderer with `mcpApps.allowSameOriginFallback` applied. */
+	const SameOriginMCPAppsActivityRenderer = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MCPAppsActivityRenderer, {
+		...props,
+		allowSameOriginFallback: true
+	});
 	const DEFAULT_LEARNING = Object.freeze({});
 	function toLearningConfig(learning) {
 		if (learning === true) return DEFAULT_LEARNING;
@@ -3443,7 +3496,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		}, [value, warningMessage]);
 		return value;
 	}
-	const CopilotKitProvider = ({ children, runtimeUrl, headers: headersProp = EMPTY_HEADERS, credentials, messageFilter, publicApiKey, publicLicenseKey, licenseToken, properties = EMPTY_PROPERTIES, agents__unsafe_dev_only: agents = EMPTY_AGENTS, selfManagedAgents = EMPTY_AGENTS, renderToolCalls, renderActivityMessages, renderCustomMessages, frontendTools, humanInTheLoop, openGenerativeUI, enableInspector, agentId, showIntelligenceIndicator = true, useSingleEndpoint, onError, a2ui, defaultThrottleMs, debug, learning }) => {
+	/** Provide a shared core instance and synchronize runtime, tool, and UI configuration. */
+	const CopilotKitProvider = ({ children, runtimeUrl, headers: headersProp = EMPTY_HEADERS, credentials, messageFilter, publicApiKey, publicLicenseKey, licenseToken, properties = EMPTY_PROPERTIES, agents__unsafe_dev_only: agents = EMPTY_AGENTS, selfManagedAgents = EMPTY_AGENTS, renderToolCalls, renderActivityMessages, renderCustomMessages, frontendTools, humanInTheLoop, openGenerativeUI, enableInspector, agentId, showIntelligenceIndicator = true, useSingleEndpoint, onError, a2ui, mcpApps, defaultThrottleMs, debug, learning }) => {
 		const learningConfig = (0, react.useMemo)(() => toLearningConfig(learning), [learning]);
 		const [shouldRenderInspector, setShouldRenderInspector] = (0, react.useState)(false);
 		const [inspectorVisible, setInspectorVisible] = (0, react.useState)(false);
@@ -3500,11 +3554,12 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			const core = copilotkitRef.current;
 			return (0, _copilotkit_a2ui_renderer.filterCatalog)(rawCatalog, (name) => core ? core.isCatalogComponentEnabled(name) : true);
 		}, [rawCatalog, catalogToggleVersion]);
+		const mcpAppsAllowSameOrigin = mcpApps?.allowSameOriginFallback === true;
 		const builtInActivityRenderers = (0, react.useMemo)(() => {
 			const renderers = [{
 				activityType: _copilotkit_mcp_apps_renderer_activity.MCPAppsActivityType,
 				content: _copilotkit_mcp_apps_renderer_activity.MCPAppsActivityContentSchema,
-				render: MCPAppsActivityRenderer
+				render: mcpAppsAllowSameOrigin ? SameOriginMCPAppsActivityRenderer : MCPAppsActivityRenderer
 			}];
 			if (openGenUIActive) renderers.push({
 				activityType: OpenGenerativeUIActivityType,
@@ -3522,7 +3577,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			a2uiActive,
 			openGenUIActive,
 			a2ui,
-			filteredCatalog
+			filteredCatalog,
+			mcpAppsAllowSameOrigin
 		]);
 		const allActivityRenderers = (0, react.useMemo)(() => {
 			return [...renderActivityMessagesList, ...builtInActivityRenderers];
@@ -3630,6 +3686,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				description: _copilotkit_shared.GENERATE_SANDBOXED_UI_DESCRIPTION,
 				parameters: GenerateSandboxedUiArgsSchema,
 				handler: async () => "UI generated",
+				reconnectBehavior: "resume-pending",
 				followUp: true,
 				render: OpenGenerativeUIToolRenderer
 			}];
@@ -4361,7 +4418,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 					...props,
 					parameters: props.args
 				}),
-				...config.agentId ? { agentId: config.agentId } : {}
+				...config.agentId ? { agentId: config.agentId } : {},
+				group: config.group
 			}) : defineToolCallRenderer({
 				name: config.name,
 				args: config.parameters,
@@ -4379,16 +4437,395 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 						parameters: props.args
 					});
 				},
-				...config.agentId ? { agentId: config.agentId } : {}
+				...config.agentId ? { agentId: config.agentId } : {},
+				group: config.group
 			});
 			copilotkit.addHookRenderToolCall(renderer);
 		}, [
 			config.name,
+			config.group,
 			copilotkit,
 			depsVersion
 		]);
 	}
 
+//#endregion
+//#region src/v2/components/chat/CopilotChatToolCallGroup.tsx
+/**
+	* Set by a group around the calls it shows, so CopilotKit's built-in tool card
+	* draws itself as a compact row that fits the group instead of a card.
+	* @internal
+	*/
+	const ToolCallGroupContext = (0, react.createContext)(null);
+	/**
+	* A call without a result is running only while the group is active: once
+	* the run has moved on or ended, its result is never coming.
+	*/
+	const entryStatus = ({ toolMessage }, active) => toolMessage ? toolMessage.error ? "failed" : "done" : active ? "running" : "stopped";
+	/** @internal */
+	const statusLabels = {
+		running: "Running",
+		done: "Done",
+		failed: "Failed",
+		stopped: "Stopped"
+	};
+	/** The first non-empty string argument: usually a command, path or query. */
+	function argumentPreview(parameters) {
+		if (!parameters || typeof parameters !== "object") return void 0;
+		return Object.values(parameters).find((v) => typeof v === "string" && v.trim().length > 0)?.replace(/\s+/g, " ");
+	}
+	const entryPreview = (entry) => argumentPreview((0, _copilotkit_shared.partialJSONParse)(entry.toolCall.function.arguments));
+	/** "run_command ×2, read_file" */
+	function toolNames(calls) {
+		const counts = /* @__PURE__ */ new Map();
+		for (const { toolCall } of calls) {
+			const name = toolCall.function.name;
+			counts.set(name, (counts.get(name) ?? 0) + 1);
+		}
+		return [...counts].map(([name, count]) => count > 1 ? `${name} ×${count}` : name).join(", ");
+	}
+	const pluralize = (count, noun) => `${count} ${noun}${count === 1 ? "" : "s"}`;
+	/**
+	* Height transition between closed and its content's height. Closed content
+	* stays mounted (so its state survives) but is inert.
+	* @internal
+	*/
+	function Collapsible({ open, id, className, children }) {
+		const ref = (0, react.useRef)(null);
+		(0, react.useLayoutEffect)(() => {
+			ref.current?.toggleAttribute("inert", !open);
+		}, [open]);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			ref,
+			id,
+			className: (0, tailwind_merge.twMerge)("cpk:grid cpk:transition-[grid-template-rows] cpk:duration-300 cpk:ease-[cubic-bezier(0.16,1,0.3,1)] cpk:motion-reduce:transition-none", className),
+			style: { gridTemplateRows: open ? "1fr" : "0fr" },
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "cpk:min-h-0 cpk:overflow-hidden",
+				children
+			})
+		});
+	}
+	function StatusIcon({ status, className }) {
+		const Icon = {
+			running: lucide_react.Loader2,
+			done: lucide_react.Check,
+			failed: lucide_react.X,
+			stopped: lucide_react.Circle
+		}[status];
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			"aria-hidden": "true",
+			className: (0, tailwind_merge.twMerge)("cpk:size-3.5 cpk:shrink-0 cpk:text-muted-foreground", status === "running" && "cpk:animate-spin", status === "failed" && "cpk:text-destructive", className)
+		});
+	}
+	function Chevron({ open, className }) {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, {
+			"aria-hidden": "true",
+			className: (0, tailwind_merge.twMerge)("cpk:size-3.5 cpk:shrink-0 cpk:transition-transform cpk:duration-200", open && "cpk:rotate-90", className)
+		});
+	}
+	function FailedCount({ calls }) {
+		const failed = calls.filter((call) => call.toolMessage?.error).length;
+		if (!failed) return null;
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: "cpk:shrink-0 cpk:text-destructive",
+			children: [failed, " failed"]
+		});
+	}
+	/**
+	* Guarded JSON.stringify for the payload blocks. A circular reference would
+	* otherwise crash the entire React tree on render.
+	*/
+	function stringifyPayload(value) {
+		if (typeof value === "string") return value;
+		try {
+			return JSON.stringify(value, null, 2);
+		} catch (err) {
+			console.warn("[CopilotKit] Failed to JSON.stringify tool-call payload; falling back to String():", err);
+			try {
+				return String(value);
+			} catch {
+				return "[unserializable]";
+			}
+		}
+	}
+	function Payload({ label, value }) {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "cpk:text-[11px] cpk:font-medium cpk:uppercase cpk:tracking-wide cpk:text-muted-foreground",
+			children: label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
+			className: "cpk:m-0 cpk:mt-1.5 cpk:max-h-[200px] cpk:overflow-auto cpk:rounded-lg cpk:bg-muted cpk:p-2.5 cpk:font-mono cpk:text-xs cpk:leading-relaxed cpk:text-foreground cpk:whitespace-pre-wrap cpk:break-words",
+			children: stringifyPayload(value)
+		})] });
+	}
+	/**
+	* A tool call's arguments and, once it has one, its result.
+	* @internal
+	*/
+	function ToolCallPayloads({ parameters, result, className }) {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: (0, tailwind_merge.twMerge)("cpk:grid cpk:gap-3", className),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Payload, {
+				label: "Arguments",
+				value: parameters ?? {}
+			}), result !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Payload, {
+				label: "Result",
+				value: result
+			})]
+		});
+	}
+	/**
+	* The built-in tool card drawn as a row inside a group: status, name and main
+	* argument, opening to the payloads.
+	* @internal
+	*/
+	function ToolCallRow({ name, parameters, result, status, appearance, className, ...props }) {
+		const [open, setOpen] = (0, react.useState)(false);
+		const detailsId = (0, react.useId)();
+		const preview = argumentPreview(parameters);
+		const line = appearance === "line";
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			"data-copilotkit": true,
+			className: (0, tailwind_merge.twMerge)(!line && "cpk:border-t cpk:border-border", className),
+			...props,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				"aria-expanded": open,
+				"aria-controls": detailsId,
+				onClick: () => setOpen((value) => !value),
+				className: (0, tailwind_merge.twMerge)("cpk:group/row cpk:m-0 cpk:flex cpk:min-w-0 cpk:cursor-pointer cpk:items-center cpk:gap-2 cpk:border-none cpk:bg-transparent cpk:text-left cpk:text-[13px] cpk:text-inherit cpk:transition-colors cpk:hover:bg-accent/60 cpk:focus-visible:outline-2 cpk:focus-visible:-outline-offset-2 cpk:focus-visible:outline-ring", line ? "cpk:-mx-1.5 cpk:w-[calc(100%+0.75rem)] cpk:rounded-md cpk:px-1.5 cpk:py-1" : "cpk:w-full cpk:px-3.5 cpk:py-2"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatusIcon, { status }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						"data-testid": "copilot-tool-render-name",
+						className: (0, tailwind_merge.twMerge)("cpk:shrink-0 cpk:font-mono cpk:text-[13px] cpk:font-medium cpk:text-foreground", status === "running" && "cpk-shimmer"),
+						children: name
+					}),
+					preview && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "cpk:min-w-0 cpk:truncate cpk:font-mono cpk:text-[13px] cpk:text-muted-foreground",
+						children: preview
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						"data-testid": "copilot-tool-render-status",
+						className: "cpk:sr-only",
+						children: statusLabels[status]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chevron, {
+						open,
+						className: (0, tailwind_merge.twMerge)("cpk:ml-auto cpk:text-muted-foreground", !open && "cpk:opacity-0 cpk:group-hover/row:opacity-100 cpk:group-focus-visible/row:opacity-100")
+					})
+				]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+				open,
+				id: detailsId,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallPayloads, {
+					parameters,
+					result,
+					className: line ? "cpk:mt-1 cpk:mb-2 cpk:ml-5.5" : "cpk:px-3.5 cpk:pt-1 cpk:pb-3"
+				})
+			})]
+		});
+	}
+	/**
+	* Tool calls made in a row, collapsed into one summary. While a call runs the
+	* summary names it ("Running read_file  src/app.ts"); once they're all done it
+	* reads "Used 3 tools" and opens to the calls.
+	*
+	* Each call is drawn by its registered renderer. CopilotKit's built-in card
+	* (`useDefaultRenderTool`) draws a compact row inside the card and line
+	* appearances; a custom wildcard renderer draws whatever it draws.
+	*/
+	function CopilotChatToolCallGroup({ calls, renderCall, appearance = "card", isActive = false, className, ...props }) {
+		const [open, setOpen] = (0, react.useState)(false);
+		const bodyId = (0, react.useId)();
+		const latest = calls[calls.length - 1];
+		if (!latest) return null;
+		const current = isActive ? calls.find((call) => !call.toolMessage) ?? latest : void 0;
+		const preview = current ? entryPreview(current) : void 0;
+		const done = calls.filter((call) => call.toolMessage).length;
+		const statuses = calls.map((call) => entryStatus(call, isActive));
+		const failedIds = new Set(calls.filter((_, index) => statuses[index] === "failed").map((call) => call.toolCall.id));
+		const status = current ? "running" : failedIds.size > 0 ? "failed" : statuses.includes("stopped") ? "stopped" : "done";
+		const rows = (rowAppearance) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallGroupContext.Provider, {
+			value: {
+				appearance: rowAppearance,
+				failedIds,
+				active: isActive
+			},
+			children: calls.map((call) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderCall(call) }, call.toolCall.id))
+		});
+		const groupProps = {
+			"data-copilotkit": true,
+			"data-testid": "copilot-tool-call-group",
+			"data-appearance": appearance,
+			"data-state": status,
+			...props
+		};
+		const runningLabel = current && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: "cpk:shrink-0 cpk:font-medium cpk-shimmer",
+			children: ["Running ", current.toolCall.function.name]
+		}), preview && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "cpk:min-w-0 cpk:truncate cpk:font-mono cpk:text-xs cpk:opacity-70",
+			children: preview
+		})] });
+		if (appearance === "line") {
+			if (calls.length === 1 && !current) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				...groupProps,
+				className: (0, tailwind_merge.twMerge)("cpk:my-2", className),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallGroupContext.Provider, {
+					value: {
+						appearance: "line",
+						failedIds,
+						active: isActive
+					},
+					children: renderCall(latest)
+				})
+			});
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				...groupProps,
+				className: (0, tailwind_merge.twMerge)("cpk:my-3", className),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					"aria-expanded": open,
+					"aria-controls": bodyId,
+					onClick: () => setOpen((value) => !value),
+					className: "cpk:m-0 cpk:inline-flex cpk:max-w-full cpk:min-w-0 cpk:cursor-pointer cpk:items-center cpk:gap-1.5 cpk:rounded-md cpk:border-none cpk:bg-transparent cpk:p-0 cpk:py-0.5 cpk:text-sm cpk:text-muted-foreground cpk:transition-colors cpk:hover:text-foreground cpk:focus-visible:outline-2 cpk:focus-visible:outline-ring",
+					children: [runningLabel || /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "cpk:shrink-0 cpk:font-medium",
+							children: ["Used ", pluralize(calls.length, "tool")]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "cpk:min-w-0 cpk:truncate cpk:font-mono cpk:text-xs cpk:opacity-70",
+							children: toolNames(calls)
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FailedCount, { calls })
+					] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chevron, { open })]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+					open,
+					id: bodyId,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "cpk:mt-1 cpk:ml-1 cpk:border-l-2 cpk:border-border cpk:py-0.5 cpk:pl-3",
+						children: rows("line")
+					})
+				})]
+			});
+		}
+		if (appearance === "stack") {
+			if (calls.length === 1) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				...groupProps,
+				className: (0, tailwind_merge.twMerge)("cpk:py-1", className),
+				children: renderCall(latest)
+			});
+			const behind = open ? 0 : Math.min(calls.length - 1, 2);
+			const layer = "cpk:rounded-xl cpk:border cpk:border-border cpk:bg-card cpk:text-card-foreground";
+			const latestStatus = entryStatus(latest, isActive);
+			const latestPreview = entryPreview(latest);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				...groupProps,
+				className: (0, tailwind_merge.twMerge)("cpk:my-3", className),
+				style: {
+					paddingBottom: behind * 6,
+					...props.style
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "cpk:relative cpk:isolate",
+					children: [Array.from({ length: behind }, (_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						"aria-hidden": "true",
+						className: (0, tailwind_merge.twMerge)(layer, "cpk:absolute cpk:inset-0"),
+						style: {
+							transform: `translateY(${(index + 1) * 6}px) scaleX(${1 - (index + 1) * .045})`,
+							zIndex: -1 - index,
+							opacity: 1 - (index + 1) * .28
+						}
+					}, index)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						"aria-expanded": open,
+						"aria-controls": open ? bodyId : void 0,
+						onClick: () => setOpen((value) => !value),
+						className: (0, tailwind_merge.twMerge)("cpk:relative cpk:m-0 cpk:flex cpk:min-w-0 cpk:cursor-pointer cpk:items-center cpk:text-left cpk:transition-colors cpk:focus-visible:outline-2 cpk:focus-visible:outline-ring", open ? "cpk:mb-1 cpk:gap-1.5 cpk:rounded-md cpk:border-none cpk:bg-transparent cpk:p-0 cpk:py-0.5 cpk:text-xs cpk:text-muted-foreground cpk:hover:text-foreground" : (0, tailwind_merge.twMerge)(layer, "cpk:w-full cpk:gap-2 cpk:px-3.5 cpk:py-2.5 cpk:text-[13px] cpk:shadow-[0_1px_2px_rgb(0_0_0/0.04)] cpk:hover:bg-accent")),
+						children: open ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+							pluralize(calls.length, "tool call"),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FailedCount, { calls }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chevron, {
+								open: true,
+								className: "cpk:-rotate-90"
+							}),
+							"Collapse"
+						] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "cpk:flex cpk:min-w-0 cpk:flex-1 cpk:items-center cpk:gap-2 cpk:animate-[cpk-stack-drop_260ms_cubic-bezier(0.16,1,0.3,1)] cpk:motion-reduce:animate-none",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatusIcon, { status: latestStatus }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: (0, tailwind_merge.twMerge)("cpk:shrink-0 cpk:font-mono cpk:font-medium cpk:text-foreground", latestStatus === "running" && "cpk-shimmer"),
+									children: latest.toolCall.function.name
+								}),
+								latestPreview && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "cpk:min-w-0 cpk:truncate cpk:font-mono cpk:text-muted-foreground",
+									children: latestPreview
+								})
+							]
+						}, latest.toolCall.id), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "cpk:ml-2 cpk:inline-flex cpk:shrink-0 cpk:items-center cpk:gap-2 cpk:text-xs cpk:text-muted-foreground",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FailedCount, { calls }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "cpk:tabular-nums",
+									children: pluralize(calls.length, "call")
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chevron, {
+									open: false,
+									className: "cpk:rotate-90"
+								})
+							]
+						})] })
+					})]
+				}), open && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					id: bodyId,
+					className: "cpk:[&>*]:animate-[cpk-stack-fan_300ms_cubic-bezier(0.16,1,0.3,1)_both] cpk:motion-reduce:[&>*]:animate-none",
+					children: calls.map((call) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderCall(call) }, call.toolCall.id))
+				})]
+			});
+		}
+		if (calls.length === 1) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			...groupProps,
+			className: (0, tailwind_merge.twMerge)("cpk:py-1", className),
+			children: renderCall(latest)
+		});
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			...groupProps,
+			className: (0, tailwind_merge.twMerge)("cpk:my-3 cpk:overflow-hidden cpk:rounded-xl cpk:border cpk:border-border cpk:bg-card cpk:text-card-foreground", className),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				"aria-expanded": open,
+				"aria-controls": bodyId,
+				onClick: () => setOpen((value) => !value),
+				className: "cpk:m-0 cpk:flex cpk:w-full cpk:min-w-0 cpk:cursor-pointer cpk:items-center cpk:gap-2.5 cpk:border-none cpk:bg-transparent cpk:px-3.5 cpk:py-2.5 cpk:text-left cpk:text-[13px] cpk:text-inherit cpk:transition-colors cpk:hover:bg-accent/60 cpk:focus-visible:outline-2 cpk:focus-visible:-outline-offset-2 cpk:focus-visible:outline-ring",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatusIcon, { status }),
+					runningLabel || /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "cpk:shrink-0 cpk:font-medium cpk:text-foreground",
+						children: ["Used ", pluralize(calls.length, "tool")]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "cpk:min-w-0 cpk:truncate cpk:font-mono cpk:text-xs cpk:text-muted-foreground",
+						children: toolNames(calls)
+					})] }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "cpk:ml-auto cpk:flex cpk:shrink-0 cpk:items-center cpk:gap-2 cpk:pl-2 cpk:text-xs cpk:text-muted-foreground",
+						children: [status === "failed" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FailedCount, { calls }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "cpk:tabular-nums",
+							children: status === "running" ? `${done} done` : statusLabels[status]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Chevron, { open })]
+					})
+				]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+				open,
+				id: bodyId,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: rows("card") })
+			})]
+		});
+	}
+
 //#endregion
 //#region src/v2/hooks/use-default-render-tool.tsx
 /**
@@ -4472,7 +4909,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		const userRender = config?.render;
 		useRenderTool({
 			name: "*",
-			render: userRender ? (raw) => userRender(adaptRendererProps(raw)) : (raw) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultToolCallRenderer, { ...adaptRendererProps(raw) })
+			render: userRender ? (raw) => userRender(adaptRendererProps(raw)) : (raw) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultToolCallRenderer, { ...adaptRendererProps(raw) }),
+			group: userRender ? config?.group === true : true
 		}, deps);
 	}
 	/**
@@ -4493,9 +4931,23 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		}
 	}
 	function DefaultToolCallRenderer({ name, toolCallId, parameters, status, result }) {
+		const group = (0, react.useContext)(ToolCallGroupContext);
 		const [isExpanded, setIsExpanded] = (0, react.useState)(false);
 		const isActive = status === "inProgress" || status === "executing";
 		const isComplete = status === "complete";
+		if (group) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallRow, {
+			"data-testid": "copilot-tool-render",
+			"data-tool-name": name,
+			"data-tool-call-id": toolCallId,
+			"data-status": status,
+			"data-args": safeStringifyForAttr(parameters),
+			"data-result": safeStringifyForAttr(result),
+			name,
+			parameters,
+			result,
+			status: isComplete ? group.failedIds.has(toolCallId) ? "failed" : "done" : group.active ? "running" : "stopped",
+			appearance: group.appearance
+		});
 		const statusLabel = isActive ? "Running" : isComplete ? "Done" : status;
 		const dotClassName = isActive ? "cpk:bg-amber-500" : isComplete ? "cpk:bg-emerald-500" : "cpk:bg-zinc-400";
 		const badgeClassName = isActive ? "cpk:bg-amber-100 cpk:text-amber-800 cpk:dark:bg-amber-500/15 cpk:dark:text-amber-400" : isComplete ? "cpk:bg-emerald-100 cpk:text-emerald-800 cpk:dark:bg-emerald-500/15 cpk:dark:text-emerald-400" : "cpk:bg-zinc-100 cpk:text-zinc-800 cpk:dark:bg-zinc-700/40 cpk:dark:text-zinc-300";
@@ -6192,38 +6644,227 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 	}
 
+//#endregion
+//#region src/v2/components/chat/tool-call-display-context.ts
+/** @internal */
+	const ToolCallDisplayContext = (0, react.createContext)(null);
+
+//#endregion
+//#region src/v2/components/chat/tool-call-layout.ts
+	function contentLength(content) {
+		return typeof content === "string" ? content.length : JSON.stringify(content ?? "").length;
+	}
+	const entrySignature = ({ toolCall, toolMessage }) => [
+		toolCall.id,
+		toolCall.function.name,
+		toolCall.function.arguments.length,
+		toolMessage ? `${contentLength(toolMessage.content)}${toolMessage.error ? "!" : ""}` : "-"
+	].join(":");
+	function signatureOf(segments) {
+		return segments.map((segment) => segment.kind === "call" ? `c(${entrySignature(segment.call)})` : `g${segment.trailing ? "*" : ""}(${segment.calls.map(entrySignature).join(",")})`).join("|");
+	}
+	/** Index of tool results by the call they answer. */
+	function getToolResults(messages) {
+		const results = /* @__PURE__ */ new Map();
+		for (const message of messages) if (message.role === "tool") results.set(message.toolCallId, message);
+		return results;
+	}
+	/**
+	* Lays out the tool calls of every assistant message in `rendered`.
+	*
+	* Calls drawn by a renderer that opted into grouping join the group that's
+	* open; anything else that shows between them closes it: assistant text, a
+	* user, reasoning or activity message, or a call drawn by any other renderer. A group belongs to
+	* the message where it starts, so later messages whose calls joined it render
+	* no tool calls themselves.
+	*
+	* @param rendered - The messages as the chat renders them, in order.
+	* @param all - Every message, for finding tool results (a transform may hide them).
+	* @param renderers - The registered renderers.
+	*/
+	function getToolCallLayouts(rendered, all, renderers) {
+		const results = getToolResults(all);
+		const layouts = /* @__PURE__ */ new Map();
+		let open;
+		for (const message of rendered) {
+			if (message.role === "tool") continue;
+			if (message.role !== "assistant") {
+				open = void 0;
+				continue;
+			}
+			if (typeof message.content === "string" && message.content.trim()) open = void 0;
+			const segments = [];
+			layouts.set(message.id, segments);
+			const toolCalls = /* @__PURE__ */ new Map();
+			for (const toolCall of message.toolCalls ?? []) toolCalls.set(toolCall.id, toolCall);
+			for (const toolCall of toolCalls.values()) {
+				const entry = {
+					toolCall,
+					toolMessage: results.get(toolCall.id)
+				};
+				const name = toolCall.function.name;
+				const named = renderers.named.has(name);
+				const rendered = named || renderers.wildcard;
+				const groups = named ? renderers.groupedNames.has(name) : renderers.wildcardGroups;
+				if (!rendered || !groups) {
+					if (rendered) open = void 0;
+					segments.push({
+						kind: "call",
+						id: toolCall.id,
+						call: entry,
+						rendered
+					});
+				} else if (open) open.calls.push(entry);
+				else {
+					open = {
+						kind: "group",
+						id: toolCall.id,
+						calls: [entry],
+						trailing: false
+					};
+					segments.push(open);
+				}
+			}
+		}
+		if (open) open.trailing = true;
+		const layout = /* @__PURE__ */ new Map();
+		for (const [id, segments] of layouts) layout.set(id, {
+			segments,
+			signature: signatureOf(segments)
+		});
+		return layout;
+	}
+	/**
+	* Finds the working phase of every reply in `rendered`: its messages up to the
+	* last one that calls a tool. Text in there was narration; what follows is the
+	* reply itself. Replies that called no tools are omitted, except the latest,
+	* which may be about to.
+	*/
+	function getTurnWork(rendered, layouts) {
+		const turns = /* @__PURE__ */ new Map();
+		let start = 0;
+		while (start < rendered.length) {
+			let end = start;
+			while (end < rendered.length && rendered[end].role !== "user") end++;
+			const key = start > 0 ? rendered[start - 1].id : "start";
+			const visible = rendered.slice(start, end).filter((message) => message.role !== "tool");
+			const isLatest = end === rendered.length;
+			const calls = [];
+			for (const message of visible) for (const segment of layouts.get(message.id)?.segments ?? []) if (segment.kind === "group") calls.push(...segment.calls);
+			else if (segment.rendered) calls.push(segment.call);
+			const shown = new Set(calls.map((entry) => entry.toolCall.id));
+			let lastWork = -1;
+			visible.forEach((message, index) => {
+				if (message.role === "assistant" && message.toolCalls?.some((call) => shown.has(call.id))) lastWork = index;
+			});
+			const first = visible[0];
+			if (first && (calls.length > 0 || isLatest)) {
+				let lastAssistant = -1;
+				visible.forEach((message, index) => {
+					if (message.role === "assistant") lastAssistant = index;
+				});
+				const replyText = visible[lastAssistant]?.content;
+				const endsWithWork = lastAssistant >= 0 && lastAssistant <= lastWork && typeof replyText === "string" && replyText.trim().length > 0;
+				turns.set(key, {
+					key,
+					firstMessageId: first.id,
+					workMessageIds: new Set(visible.slice(0, lastWork + 1).map((message) => message.id)),
+					replyTextMessageId: endsWithWork ? visible[lastAssistant].id : void 0,
+					calls,
+					isLatest
+				});
+			}
+			start = end + 1;
+		}
+		return turns;
+	}
+
 //#endregion
 //#region src/v2/components/chat/CopilotChatToolCallsView.tsx
-	function CopilotChatToolCallsView({ message, messages = [] }) {
+	const appearances = {
+		grouped: "card",
+		line: "line",
+		stacked: "stack"
+	};
+	function CopilotChatToolCallsView({ message, messages = [], display: displayProp, group }) {
 		const renderToolCall = useRenderToolCall();
+		const rendererNames = useToolCallRendererNames();
 		const { copilotkit } = useCopilotKit();
 		const subscribe = (0, react.useCallback)((onChange) => copilotkit.ɵsubscribeToLearningConfigured(onChange), [copilotkit]);
 		const getSnapshot = () => copilotkit.ɵlearningConfigured;
 		const learningConfigured = (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+		const context = (0, react.useContext)(ToolCallDisplayContext);
+		const display = displayProp ?? context?.display ?? "grouped";
+		const viewLayout = context?.layouts.get(message.id);
+		const layout = (0, react.useMemo)(() => {
+			if (display === "separate") return void 0;
+			return viewLayout ?? getToolCallLayouts([message], messages, rendererNames).get(message.id);
+		}, [
+			display,
+			viewLayout,
+			message,
+			messages,
+			rendererNames
+		]);
 		if (!message.toolCalls || message.toolCalls.length === 0) return null;
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: message.toolCalls.map((toolCall) => {
+		const renderCall = (entry) => {
 			const rendered = renderToolCall({
-				toolCall,
-				toolMessage: messages.find((m) => m.role === "tool" && m.toolCallId === toolCall.id)
+				toolCall: entry.toolCall,
+				toolMessage: entry.toolMessage
 			});
-			if (rendered === null) return null;
-			if (!learningConfigured) return rendered;
+			if (rendered === null || !learningConfigured) return rendered;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				"data-tool-call-id": toolCall.id,
+				"data-tool-call-id": entry.toolCall.id,
 				style: { display: "contents" },
 				children: rendered
-			}, toolCall.id);
+			});
+		};
+		if (!layout) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: message.toolCalls.map((toolCall) => {
+			const toolMessage = messages.find((m) => m.role === "tool" && m.toolCallId === toolCall.id);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderCall({
+				toolCall,
+				toolMessage
+			}) }, toolCall.id);
+		}) });
+		const workOpen = context?.workOpen.get(message.id);
+		const groupActive = (trailing) => trailing && (context ? context.isRunning : true);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: layout.segments.map((segment) => {
+			if (segment.kind === "call") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderCall(segment.call) }, segment.id);
+			if (display === "turn") {
+				const failedIds = new Set(segment.calls.filter((call) => call.toolMessage?.error).map((call) => call.toolCall.id));
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+					open: workOpen ?? true,
+					className: "cpk:-mx-2",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "cpk:px-2 cpk:py-1.5",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallGroupContext.Provider, {
+							value: {
+								appearance: "line",
+								failedIds,
+								active: groupActive(segment.trailing)
+							},
+							children: segment.calls.map((call) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderCall(call) }, call.toolCall.id))
+						})
+					})
+				}, segment.id);
+			}
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderSlot(group, CopilotChatToolCallGroup, {
+				calls: segment.calls,
+				renderCall,
+				appearance: appearances[display] ?? "card",
+				isActive: groupActive(segment.trailing)
+			}) }, segment.id);
 		}) });
 	}
 
 //#endregion
 //#region src/v2/components/chat/CopilotChatInspectorButton.tsx
 	let shortcutsHidden = false;
-	const listeners = /* @__PURE__ */ new Set();
+	const listeners$1 = /* @__PURE__ */ new Set();
 	const subscribe = (listener) => {
-		listeners.add(listener);
+		listeners$1.add(listener);
 		return () => {
-			listeners.delete(listener);
+			listeners$1.delete(listener);
 		};
 	};
 	const getSnapshot = () => shortcutsHidden;
@@ -6233,7 +6874,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 	}
 	function hideShortcuts() {
 		shortcutsHidden = true;
-		listeners.forEach((listener) => listener());
+		listeners$1.forEach((listener) => listener());
 	}
 	function InspectorKiteIcon({ className, ...props }) {
 		const id = (0, react.useId)();
@@ -6499,9 +7140,321 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 	}
 
+//#endregion
+//#region src/v2/components/ui/popover.tsx
+	function Popover({ ...props }) {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Root, {
+			"data-slot": "popover",
+			...props
+		});
+	}
+	function PopoverAnchor({ ...props }) {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Anchor, {
+			"data-slot": "popover-anchor",
+			...props
+		});
+	}
+	/**
+	* Popover content in a portal, so it floats over the page instead of taking
+	* room in the layout, with the CopilotKit style scope on it.
+	*/
+	const PopoverContent = react.forwardRef(({ className, align = "start", sideOffset = 6, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Content, {
+		ref,
+		"data-copilotkit": true,
+		"data-copilotkit-popover": true,
+		"data-slot": "popover-content",
+		align,
+		sideOffset,
+		className: cn("cpk:z-50 cpk:outline-none cpk:data-[state=open]:animate-in cpk:data-[state=open]:fade-in-0 cpk:data-[state=open]:zoom-in-95 cpk:data-[side=bottom]:slide-in-from-top-1 cpk:data-[side=top]:slide-in-from-bottom-1", className),
+		...props
+	}) }));
+	PopoverContent.displayName = "PopoverContent";
+
+//#endregion
+//#region src/v2/lib/message-feedback.ts
+/** Trajectory event name for a rating of one assistant message. */
+	const MESSAGE_FEEDBACK_EVENT_NAME = "message.feedback";
+	/** Longest comment kept, in characters; the rest is cut so the event stays small. */
+	const MESSAGE_FEEDBACK_MAX_COMMENT_LENGTH = 1e3;
+	/** Longest excerpt of the rated response sent with the rating, in characters. */
+	const RESPONSE_EXCERPT_LENGTH = 500;
+	const ratings = /* @__PURE__ */ new Map();
+	const listeners = /* @__PURE__ */ new Map();
+	const threadKey = (agentId, threadId) => JSON.stringify([agentId, threadId]);
+	const messageKey = (agentId, threadId, messageId) => JSON.stringify([
+		agentId,
+		threadId,
+		messageId
+	]);
+	/** Cuts `text` to `max` characters without splitting a surrogate pair. */
+	const clip = (text, max) => {
+		const characters = Array.from(text);
+		return characters.length > max ? characters.slice(0, max).join("") : text;
+	};
+	/** The comment as kept and sent: trimmed and capped, or none. */
+	const normalizeComment = (comment) => {
+		if (typeof comment !== "string") return void 0;
+		const text = clip(comment.trim(), MESSAGE_FEEDBACK_MAX_COMMENT_LENGTH);
+		return text === "" ? void 0 : text;
+	};
+	/** The rating this page gave one message, if any. */
+	function getMessageFeedback(agentId, threadId, messageId) {
+		return ratings.get(messageKey(agentId, threadId, messageId));
+	}
+	/** Calls `listener` whenever a rating in this Thread changes. */
+	function subscribeToMessageFeedback(agentId, threadId, listener) {
+		const key = threadKey(agentId, threadId);
+		let set = listeners.get(key);
+		if (set === void 0) {
+			set = /* @__PURE__ */ new Set();
+			listeners.set(key, set);
+		}
+		set.add(listener);
+		return () => {
+			set.delete(listener);
+			if (set.size === 0) listeners.delete(key);
+		};
+	}
+	/**
+	* Sets (or, with `null`, clears) this page's rating of one message and sends
+	* it to the active Trajectory. Every change is a new event; the newest event
+	* for a `feedbackId` is the current one. Like any Trajectory event, a change
+	* made while no Trajectory captures, for example during a reconnect, is not
+	* sent; the page still shows it.
+	*/
+	function setMessageFeedback(params) {
+		const { copilotkit, agentId, threadId, message } = params;
+		const comment = normalizeComment(params.feedback?.comment);
+		const feedback = params.feedback && {
+			rating: params.feedback.rating,
+			...comment ? { comment } : {}
+		};
+		const key = messageKey(agentId, threadId, message.id);
+		if (feedback) ratings.set(key, feedback);
+		else ratings.delete(key);
+		for (const listener of listeners.get(threadKey(agentId, threadId)) ?? []) listener();
+		const runId = copilotkit.getRunIdForMessage(agentId, threadId, message.id);
+		copilotkit.emitTrajectoryEvent(MESSAGE_FEEDBACK_EVENT_NAME, {
+			feedbackId: `${threadId}:${message.id}`,
+			threadId,
+			messageId: message.id,
+			agentId,
+			...runId ? { runId } : {},
+			rating: feedback?.rating ?? null,
+			...feedback?.comment ? { comment: feedback.comment } : {},
+			...copilotkit.ɵlearningCapturesAgentText ? { response: clip(message.content ?? "", RESPONSE_EXCERPT_LENGTH) } : {}
+		});
+	}
+
+//#endregion
+//#region src/v2/components/chat/message-feedback.tsx
+/**
+	* Set by the message view while Learning is on for this chat. Assistant
+	* messages without it show thumbs only when the app passes its own handlers
+	* or thumb slots.
+	*/
+	const MessageFeedbackScopeContext = (0, react.createContext)(null);
+	const capturedCores = /* @__PURE__ */ new WeakSet();
+	const rememberCapture = (copilotkit) => {
+		if (capturedCores.has(copilotkit)) return;
+		capturedCores.add(copilotkit);
+		const unsubscribe = copilotkit.ɵsubscribeToLearningConfigured(() => {
+			if (copilotkit.ɵlearningConfigured) return;
+			capturedCores.delete(copilotkit);
+			unsubscribe();
+		});
+	};
+	/**
+	* Whether the thumbs record feedback for Learning. True once a Trajectory of
+	* this Core has started and as long as Learning stays configured, also while
+	* capture reconnects or is stopped, so the buttons do not flicker. Ratings
+	* given meanwhile still show but, like any Trajectory event, are not
+	* sent. A capture that never starts (for example without a license) leaves it
+	* false.
+	*/
+	function useLearningFeedbackEnabled(copilotkit) {
+		const configured = (0, react.useSyncExternalStore)((0, react.useCallback)((onChange) => copilotkit.ɵsubscribeToLearningConfigured(onChange), [copilotkit]), () => copilotkit.ɵlearningConfigured, () => false);
+		const capturing = (0, react.useSyncExternalStore)((0, react.useCallback)((onChange) => copilotkit.subscribe({ onTrajectoryChanged: onChange }).unsubscribe, [copilotkit]), () => copilotkit.trajectoryId !== null, () => false);
+		(0, react.useEffect)(() => {
+			if (capturing) rememberCapture(copilotkit);
+		}, [capturing, copilotkit]);
+		return configured && (capturing || capturedCores.has(copilotkit));
+	}
+	const noSubscription = () => () => {};
+	/** Feedback controls for `message`, or `null` when this chat collects none. */
+	function useMessageFeedback(message) {
+		const scope = (0, react.useContext)(MessageFeedbackScopeContext);
+		const subscribe = (0, react.useCallback)((onChange) => scope ? subscribeToMessageFeedback(scope.agentId, scope.threadId, onChange) : noSubscription(), [scope]);
+		const getSnapshot = () => scope ? getMessageFeedback(scope.agentId, scope.threadId, message.id) : void 0;
+		const feedback = (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+		if (!scope) return null;
+		const save = (next) => setMessageFeedback({
+			...scope,
+			message,
+			feedback: next
+		});
+		return {
+			feedback,
+			rate: (rating) => {
+				if (feedback?.rating !== rating) save({ rating });
+			},
+			clear: () => {
+				if (feedback) save(null);
+			},
+			comment: (comment) => {
+				if (feedback) save({
+					rating: feedback.rating,
+					comment
+				});
+			}
+		};
+	}
+	/**
+	* How long the pointer may be away from the rating and its comment before the
+	* comment closes: enough to cross the gap between them, short enough that
+	* passing over a rating does not leave it open.
+	*/
+	const FEEDBACK_COMMENT_CLOSE_DELAY_MS = 150;
+	/**
+	* Drives the comment popover of a rated message.
+	*
+	* It opens when a rating is given and whenever the pointer or keyboard focus
+	* reaches the chosen thumb, with the saved comment in the field. It closes by
+	* itself shortly after the pointer leaves the thumb and the popover, unless
+	* focus is in the field: then it stays until focus moves away, Enter, or
+	* Escape. Closing saves a changed comment; Escape, a click on a thumb, and
+	* removing the rating discard it.
+	*/
+	function useFeedbackComment(controls) {
+		const [open, setOpen] = (0, react.useState)(false);
+		const [draft, setDraft] = (0, react.useState)("");
+		const [focusRequest, setFocusRequest] = (0, react.useState)(0);
+		const inputRef = (0, react.useRef)(null);
+		const timer = (0, react.useRef)(void 0);
+		const editing = (0, react.useRef)(false);
+		const focusWaiting = (0, react.useRef)(false);
+		const pointerOver = (0, react.useRef)(false);
+		const returning = (0, react.useRef)(false);
+		const latest = (0, react.useRef)({
+			controls,
+			draft,
+			open
+		});
+		latest.current = {
+			...latest.current,
+			controls,
+			draft,
+			open
+		};
+		const takeFocusRequest = (0, react.useCallback)(() => {
+			const waiting = focusWaiting.current;
+			focusWaiting.current = false;
+			return waiting;
+		}, []);
+		const cancelClose = (0, react.useCallback)(() => {
+			if (timer.current === void 0) return;
+			clearTimeout(timer.current);
+			timer.current = void 0;
+		}, []);
+		(0, react.useEffect)(() => cancelClose, [cancelClose]);
+		const savedComment = (0, react.useCallback)(() => latest.current.controls?.feedback?.comment ?? "", []);
+		(0, react.useEffect)(() => () => {
+			const { open: wasOpen, controls: current, draft: text } = latest.current;
+			if (wasOpen && current?.feedback && text.trim() !== savedComment()) current.comment(text);
+		}, []);
+		const close = (0, react.useCallback)(({ save = true } = {}) => {
+			cancelClose();
+			focusWaiting.current = false;
+			pointerOver.current = false;
+			if (!latest.current.open) return;
+			const current = latest.current.controls;
+			if (save && current?.feedback && latest.current.draft.trim() !== savedComment()) current.comment(latest.current.draft);
+			editing.current = false;
+			latest.current = {
+				...latest.current,
+				open: false
+			};
+			setOpen(false);
+		}, [cancelClose, savedComment]);
+		const show = ({ comment, focus }) => {
+			cancelClose();
+			latest.current = {
+				...latest.current,
+				open: true,
+				draft: comment
+			};
+			setDraft(comment);
+			if (focus) {
+				focusWaiting.current = true;
+				setFocusRequest((request) => request + 1);
+			}
+			setOpen(true);
+		};
+		return {
+			open,
+			draft,
+			setDraft,
+			focusRequest,
+			takeFocusRequest,
+			inputRef,
+			show,
+			enter: (via = "focus") => {
+				cancelClose();
+				if (via === "pointer") pointerOver.current = true;
+				if (returning.current) return;
+				if (!latest.current.open && latest.current.controls?.feedback) show({
+					comment: savedComment(),
+					focus: false
+				});
+			},
+			leave: (via = "focus") => {
+				if (via === "pointer") pointerOver.current = false;
+				else if (pointerOver.current) return;
+				cancelClose();
+				timer.current = setTimeout(() => {
+					timer.current = void 0;
+					if (!editing.current) close();
+				}, FEEDBACK_COMMENT_CLOSE_DELAY_MS);
+			},
+			setEditing: (value) => {
+				editing.current = value;
+			},
+			close,
+			returnFocus: (target) => {
+				returning.current = true;
+				try {
+					target?.focus();
+				} finally {
+					returning.current = false;
+				}
+			}
+		};
+	}
+
 //#endregion
 //#region src/v2/components/chat/CopilotChatAssistantMessage.tsx
 /**
+	* In the `"turn"` tool-call display, text in a reply's working phase was
+	* narration: it fades to muted once a call follows it, and folds away with the
+	* rest of the work when the reply is done. The wrapper is there for every
+	* message in that display, so text that turns into narration keeps its node
+	* (and its place) rather than remounting.
+	*/
+	function WorkText({ messageId, children }) {
+		const context = (0, react.useContext)(ToolCallDisplayContext);
+		if (context?.display !== "turn") return children;
+		const open = context.workTextOpen.get(messageId);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+			open: open ?? true,
+			className: "cpk:-mx-2",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "cpk:px-2",
+				"data-work-text": open === void 0 ? "reply" : "narration",
+				children
+			})
+		});
+	}
+	/**
 	* Binds the Inspector action to the active chat without making the full
 	* assistant message subscribe to chat configuration changes.
 	*/
@@ -6516,31 +7469,216 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			})
 		});
 	}
-	function CopilotChatAssistantMessage({ message, messages, isRunning, isLatest, onThumbsUp, onThumbsDown, onReadAloud, onRegenerate, additionalToolbarItems, toolbarVisible = true, markdownRenderer, toolbar, copyButton, inspectorButton, thumbsUpButton, thumbsDownButton, readAloudButton, regenerateButton, toolCallsView, children, className, ...props }) {
+	/** Whether focus came from the keyboard; a pointer click also focuses buttons. */
+	function isFocusVisible(element) {
+		try {
+			return element.matches(":focus-visible");
+		} catch {
+			return false;
+		}
+	}
+	const HIDDEN_TOO = {
+		checkVisibilityCSS: true,
+		visibilityProperty: true
+	};
+	const FOCUSABLE = [
+		"a[href]",
+		"button:not([disabled])",
+		"input:not([disabled])",
+		"select:not([disabled])",
+		"textarea:not([disabled])",
+		"[tabindex]"
+	].map((selector) => `${selector}:not([tabindex="-1"]):not([data-radix-focus-guard])`).join(", ");
+	/** Approximately the element Tab reaches after `element`, outside `skip`. */
+	function nextFocusable(element, skip) {
+		const all = Array.from(element.ownerDocument.querySelectorAll(FOCUSABLE)).filter((candidate) => candidate === element || !skip?.contains(candidate) && !candidate.closest("[hidden], [inert]"));
+		const index = all.indexOf(element);
+		return index === -1 ? null : all[index + 1] ?? null;
+	}
+	/**
+	* The comment popover of a rated message, pointing at the chosen thumb. Kept
+	* apart so only it, not the whole message, follows chat configuration.
+	*
+	* The popover lives in a portal, so it keeps keyboard order by hand: Shift+Tab
+	* from its start returns to the thumb, Tab from its end moves on to the
+	* control after the thumb, and Enter or Escape inside it returns to the thumb.
+	*/
+	function FeedbackCommentPopover({ feedbackComment, comment, savedComment, rating, anchor, messageId }) {
+		const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
+		const contentRef = (0, react.useRef)(null);
+		const focusInside = () => contentRef.current?.contains(document.activeElement) ?? false;
+		const { focusRequest, takeFocusRequest, inputRef } = comment;
+		const focusField = (0, react.useCallback)(() => {
+			if (inputRef.current && takeFocusRequest()) inputRef.current.focus();
+		}, [inputRef, takeFocusRequest]);
+		(0, react.useEffect)(() => focusField(), [focusRequest, focusField]);
+		/** Whether `target` is a thumb of this message, whose click decides itself. */
+		const isOwnThumb = (target) => {
+			return (target instanceof Element ? target.closest("[data-copilotkit-rating]") : null)?.closest("[data-message-id]")?.getAttribute("data-message-id") === messageId;
+		};
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Popover, {
+			open: comment.open,
+			onOpenChange: (open) => {
+				if (!open) comment.close();
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverAnchor, { virtualRef: anchor }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverContent, {
+				ref: contentRef,
+				side: "bottom",
+				collisionPadding: 8,
+				hideWhenDetached: true,
+				"aria-label": labels.assistantMessageFeedbackCommentPlaceholder,
+				"data-copilotkit-ignore": true,
+				onOpenAutoFocus: (event) => {
+					event.preventDefault();
+					focusField();
+				},
+				onCloseAutoFocus: (event) => event.preventDefault(),
+				onInteractOutside: (event) => {
+					if (isOwnThumb(event.target)) event.preventDefault();
+				},
+				onEscapeKeyDown: (event) => {
+					const returnFocus = focusInside();
+					if (returnFocus) event.stopPropagation();
+					comment.close({ save: false });
+					if (returnFocus) comment.returnFocus(anchor.current);
+				},
+				onKeyDown: (event) => {
+					if (event.key !== "Tab") return;
+					const focusables = Array.from(contentRef.current?.querySelectorAll(FOCUSABLE) ?? []);
+					if (!(event.shiftKey ? document.activeElement === focusables[0] : document.activeElement === focusables[focusables.length - 1]) || !anchor.current?.isConnected) return;
+					event.preventDefault();
+					const target = event.shiftKey ? anchor.current : nextFocusable(anchor.current, contentRef.current) ?? anchor.current;
+					comment.close();
+					if (target === anchor.current) comment.returnFocus(target);
+					else target.focus();
+				},
+				onPointerEnter: () => comment.enter("pointer"),
+				onPointerLeave: () => comment.leave("pointer"),
+				className: "cpk:z-[1300]",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: renderSlot(feedbackComment, CopilotChatAssistantMessage.FeedbackComment, {
+					value: comment.draft,
+					savedComment,
+					inputRef: comment.inputRef,
+					onChange: comment.setDraft,
+					onSubmit: () => {
+						comment.close();
+						comment.returnFocus(anchor.current);
+					},
+					onEditingChange: comment.setEditing,
+					onLeave: (next) => {
+						if (next && (contentRef.current?.contains(next) || isOwnThumb(next))) return;
+						comment.leave();
+					}
+				}) }, rating)
+			})]
+		});
+	}
+	function CopilotChatAssistantMessage({ message, messages, isRunning, isLatest, onThumbsUp, onThumbsDown, onReadAloud, onRegenerate, additionalToolbarItems, toolbarVisible = true, markdownRenderer, toolbar, copyButton, inspectorButton, thumbsUpButton, thumbsDownButton, readAloudButton, regenerateButton, feedbackComment: feedbackCommentSlot, toolCallsView, children, className, ...props }) {
 		useKatexStyles();
 		const { isInspectorEnabled, openInspector } = useCopilotKitInspector();
 		const shortcutsHidden = useInspectorShortcutsHidden();
 		const showInspectorShortcut = isInspectorEnabled && !shortcutsHidden;
+		const feedback = useMessageFeedback(message);
+		const comment = useFeedbackComment(feedback);
+		const rating = feedback?.feedback?.rating;
+		const root = (0, react.useRef)(null);
+		const commentAnchor = (0, react.useRef)(null);
+		const commentRating = (0, react.useRef)(rating);
+		(0, react.useLayoutEffect)(() => {
+			if (comment.open && !commentAnchor.current?.isConnected && rating) commentAnchor.current = root.current?.querySelector(`[data-copilotkit-rating="${rating}"]`) ?? root.current?.querySelector("button[aria-pressed=\"true\"]") ?? null;
+		});
+		/**
+		* Thumbs are toggles: a new rating is saved and opens its comment, and
+		* clicking the chosen thumb again removes the rating. A keyboard click
+		* (`detail` 0) moves focus into the comment, as there is no pointer.
+		* Custom thumb slots may call `onClick` without an event.
+		*
+		* @returns Whether the app's handler should run: true for a new rating and
+		* whenever this chat does not record ratings, false when one is removed.
+		*/
+		const rate = (value, event) => {
+			if (!feedback) return true;
+			if (rating === value) {
+				comment.close({ save: false });
+				feedback.clear();
+				return false;
+			}
+			feedback.rate(value);
+			commentRating.current = value;
+			commentAnchor.current = event?.currentTarget ?? null;
+			comment.show({
+				comment: "",
+				focus: event?.detail === 0
+			});
+			return true;
+		};
+		/** Props that let the chosen thumb open and point at its comment. */
+		const thumbFeedbackProps = (value) => {
+			if (!feedback) return {};
+			const thumb = { "data-copilotkit-rating": value };
+			if (rating !== value) return {
+				...thumb,
+				"aria-pressed": false
+			};
+			const enter = (target, via) => {
+				if (!comment.open) commentRating.current = value;
+				commentAnchor.current = target;
+				comment.enter(via);
+			};
+			return {
+				...thumb,
+				"aria-pressed": true,
+				"aria-haspopup": "dialog",
+				"aria-expanded": comment.open,
+				onPointerEnter: (event) => {
+					if (event.pointerType !== "touch") enter(event.currentTarget, "pointer");
+				},
+				onPointerLeave: (event) => {
+					if (event.pointerType !== "touch") comment.leave("pointer");
+				},
+				onFocus: (event) => {
+					if (isFocusVisible(event.currentTarget)) enter(event.currentTarget, "focus");
+				},
+				onBlur: () => comment.leave(),
+				onKeyDown: (event) => {
+					const input = comment.inputRef.current;
+					if (event.key === "Tab" && !event.shiftKey && comment.open && input && input.checkVisibility?.(HIDDEN_TOO) !== false) {
+						event.preventDefault();
+						input.focus();
+					}
+				}
+			};
+		};
 		const boundMarkdownRenderer = renderSlot(markdownRenderer, CopilotChatAssistantMessage.MarkdownRenderer, { content: message.content || "" });
 		const boundCopyButton = renderSlot(copyButton, CopilotChatAssistantMessage.CopyButton, { onClick: async () => {
 			if (message.content) return await (0, _copilotkit_shared.copyToClipboard)(message.content);
 			return false;
 		} });
-		const boundThumbsUpButton = renderSlot(thumbsUpButton, CopilotChatAssistantMessage.ThumbsUpButton, { onClick: onThumbsUp ? () => onThumbsUp(message) : void 0 });
+		const boundThumbsUpButton = renderSlot(thumbsUpButton, CopilotChatAssistantMessage.ThumbsUpButton, {
+			onClick: onThumbsUp || feedback ? (event) => {
+				if (rate("up", event)) onThumbsUp?.(message);
+			} : void 0,
+			...thumbFeedbackProps("up")
+		});
 		const boundInspectorButton = showInspectorShortcut ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BoundInspectorButton, {
 			inspectorButton,
 			messageId: message.id,
 			openInspector
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, {});
-		const boundThumbsDownButton = renderSlot(thumbsDownButton, CopilotChatAssistantMessage.ThumbsDownButton, { onClick: onThumbsDown ? () => onThumbsDown(message) : void 0 });
+		const boundThumbsDownButton = renderSlot(thumbsDownButton, CopilotChatAssistantMessage.ThumbsDownButton, {
+			onClick: onThumbsDown || feedback ? (event) => {
+				if (rate("down", event)) onThumbsDown?.(message);
+			} : void 0,
+			...thumbFeedbackProps("down")
+		});
 		const boundReadAloudButton = renderSlot(readAloudButton, CopilotChatAssistantMessage.ReadAloudButton, { onClick: onReadAloud ? () => onReadAloud(message) : void 0 });
 		const boundRegenerateButton = renderSlot(regenerateButton, CopilotChatAssistantMessage.RegenerateButton, { onClick: onRegenerate ? () => onRegenerate(message) : void 0 });
 		const boundToolbar = renderSlot(toolbar, CopilotChatAssistantMessage.Toolbar, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "cpk:flex cpk:w-full cpk:items-center cpk:gap-1",
 			children: [
 				boundCopyButton,
-				(onThumbsUp || thumbsUpButton) && boundThumbsUpButton,
-				(onThumbsDown || thumbsDownButton) && boundThumbsDownButton,
+				(onThumbsUp || thumbsUpButton || feedback) && boundThumbsUpButton,
+				(onThumbsDown || thumbsDownButton || feedback) && boundThumbsDownButton,
 				(onReadAloud || readAloudButton) && boundReadAloudButton,
 				(onRegenerate || regenerateButton) && boundRegenerateButton,
 				additionalToolbarItems,
@@ -6554,11 +7692,31 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		const hasContent = !!(message.content && message.content.trim().length > 0);
 		const isLatestAssistantMessage = message.role === "assistant" && (isLatest ?? messages?.[messages.length - 1]?.id === message.id);
 		const shouldShowToolbar = toolbarVisible && (hasContent || showInspectorShortcut) && !(isRunning && isLatestAssistantMessage);
-		if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		const { open: commentOpen, close: closeComment } = comment;
+		(0, react.useEffect)(() => {
+			if (!commentOpen) return;
+			if (rating !== commentRating.current) closeComment({ save: false });
+			else if (!shouldShowToolbar) closeComment();
+		}, [
+			commentOpen,
+			shouldShowToolbar,
+			rating,
+			closeComment
+		]);
+		const feedbackComment = feedback?.feedback && shouldShowToolbar && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FeedbackCommentPopover, {
+			feedbackComment: feedbackCommentSlot,
+			comment,
+			savedComment: feedback.feedback.comment ?? "",
+			rating: feedback.feedback.rating,
+			anchor: commentAnchor,
+			messageId: message.id
+		});
+		if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			ref: root,
 			"data-copilotkit": true,
 			"data-message-id": message.id,
 			style: { display: "contents" },
-			children: children({
+			children: [children({
 				markdownRenderer: boundMarkdownRenderer,
 				toolbar: boundToolbar,
 				toolCallsView: boundToolCallsView,
@@ -6577,21 +7735,26 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				onRegenerate,
 				additionalToolbarItems,
 				toolbarVisible: shouldShowToolbar
-			})
+			}), feedbackComment]
 		});
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			ref: root,
 			"data-copilotkit": true,
 			"data-testid": "copilot-assistant-message",
 			className: (0, tailwind_merge.twMerge)("copilotKitMessage copilotKitAssistantMessage", className),
 			...props,
 			"data-message-id": message.id,
 			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "cpk:prose cpk:max-w-full cpk:break-words cpk:dark:prose-invert",
-					children: boundMarkdownRenderer
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkText, {
+					messageId: message.id,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "cpk:prose cpk:max-w-full cpk:break-words cpk:dark:prose-invert",
+						children: boundMarkdownRenderer
+					})
 				}),
 				boundToolCallsView,
-				shouldShowToolbar && boundToolbar
+				shouldShowToolbar && boundToolbar,
+				feedbackComment
 			]
 		});
 	}
@@ -6607,20 +7770,27 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			...props
 		});
 		const ToolbarButton = _CopilotChatAssistantMessage.ToolbarButton = ({ title, tooltip, tooltipClassName, children, ...props }) => {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipTrigger, {
-				asChild: true,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
-					type: "button",
-					variant: "assistantMessageToolbarButton",
-					"aria-label": title,
-					...props,
-					children
-				})
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContent, {
-				side: "bottom",
-				className: tooltipClassName,
-				children: tooltip ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: title })
-			})] });
+			const [tooltipOpen, setTooltipOpen] = (0, react.useState)(false);
+			const popupOpen = props["aria-expanded"] === true;
+			if (popupOpen && tooltipOpen) setTooltipOpen(false);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Tooltip, {
+				open: tooltipOpen && !popupOpen,
+				onOpenChange: (open) => setTooltipOpen(open && !popupOpen),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+						type: "button",
+						variant: "assistantMessageToolbarButton",
+						"aria-label": title,
+						...props,
+						children
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContent, {
+					side: "bottom",
+					className: tooltipClassName,
+					children: tooltip ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: title })
+				})]
+			});
 		};
 		_CopilotChatAssistantMessage.CopyButton = ({ className, title, onClick, ...props }) => {
 			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
@@ -6659,7 +7829,10 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				"data-testid": "copilot-thumbs-up-button",
 				title: title || labels.assistantMessageToolbarThumbsUpLabel,
 				...props,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ThumbsUp, { className: "cpk:size-[18px]" })
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ThumbsUp, {
+					className: "cpk:size-[18px]",
+					fill: props["aria-pressed"] === true ? "currentColor" : "none"
+				})
 			});
 		};
 		_CopilotChatAssistantMessage.ThumbsDownButton = ({ title, ...props }) => {
@@ -6668,7 +7841,45 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				"data-testid": "copilot-thumbs-down-button",
 				title: title || labels.assistantMessageToolbarThumbsDownLabel,
 				...props,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ThumbsDown, { className: "cpk:size-[18px]" })
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ThumbsDown, {
+					className: "cpk:size-[18px]",
+					fill: props["aria-pressed"] === true ? "currentColor" : "none"
+				})
+			});
+		};
+		_CopilotChatAssistantMessage.FeedbackComment = ({ value, savedComment, inputRef, onChange, onSubmit, onEditingChange, onLeave, className }) => {
+			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
+			const changed = value.trim() !== savedComment;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+				"data-testid": "copilot-feedback-comment",
+				className: (0, tailwind_merge.twMerge)("cpk:flex cpk:w-80 cpk:max-w-[calc(100vw-1rem)] cpk:items-center cpk:gap-1 cpk:rounded-full cpk:border cpk:border-border cpk:bg-background cpk:py-0.5 cpk:pl-3 cpk:pr-0.5 cpk:text-sm cpk:shadow-md", className),
+				onSubmit: (event) => {
+					event.preventDefault();
+					onSubmit();
+				},
+				onFocus: () => onEditingChange?.(true),
+				onBlur: (event) => {
+					const next = event.relatedTarget instanceof Element ? event.relatedTarget : null;
+					if (event.currentTarget.contains(next)) return;
+					if (typeof document !== "undefined" && !document.hasFocus()) return;
+					onEditingChange?.(false);
+					onLeave?.(next);
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					ref: inputRef,
+					value,
+					maxLength: MESSAGE_FEEDBACK_MAX_COMMENT_LENGTH,
+					onChange: (event) => onChange(event.target.value),
+					placeholder: labels.assistantMessageFeedbackCommentPlaceholder,
+					"aria-label": labels.assistantMessageFeedbackCommentPlaceholder,
+					className: "cpk:min-w-0 cpk:flex-1 cpk:bg-transparent cpk:py-1 cpk:text-foreground cpk:outline-none cpk:placeholder:text-muted-foreground"
+				}), changed && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+					type: "submit",
+					variant: "assistantMessageToolbarButton",
+					"aria-label": labels.assistantMessageFeedbackCommentSubmitLabel,
+					title: labels.assistantMessageFeedbackCommentSubmitLabel,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUp, { className: "cpk:size-[16px]" })
+				})]
 			});
 		};
 		_CopilotChatAssistantMessage.ReadAloudButton = ({ title, ...props }) => {
@@ -6696,6 +7907,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 	CopilotChatAssistantMessage.InspectorButton.displayName = "CopilotChatAssistantMessage.InspectorButton";
 	CopilotChatAssistantMessage.ThumbsUpButton.displayName = "CopilotChatAssistantMessage.ThumbsUpButton";
 	CopilotChatAssistantMessage.ThumbsDownButton.displayName = "CopilotChatAssistantMessage.ThumbsDownButton";
+	CopilotChatAssistantMessage.FeedbackComment.displayName = "CopilotChatAssistantMessage.FeedbackComment";
 	CopilotChatAssistantMessage.ReadAloudButton.displayName = "CopilotChatAssistantMessage.ReadAloudButton";
 	CopilotChatAssistantMessage.RegenerateButton.displayName = "CopilotChatAssistantMessage.RegenerateButton";
 	var CopilotChatAssistantMessage_default = CopilotChatAssistantMessage;
@@ -7001,6 +8213,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			});
 		};
 		_CopilotChatUserMessage.BranchNavigation = ({ className, currentBranch = 0, numberOfBranches = 1, onSwitchToBranch, message, ...props }) => {
+			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
 			if (!numberOfBranches || numberOfBranches <= 1 || !onSwitchToBranch) return null;
 			const canGoPrev = currentBranch > 0;
 			const canGoNext = currentBranch < numberOfBranches - 1;
@@ -7019,6 +8232,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 						}),
 						disabled: !canGoPrev,
 						className: "cpk:h-6 cpk:w-6 cpk:p-0",
+						"aria-label": labels.userMessageToolbarPreviousBranchLabel,
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeft, { className: "cpk:size-[20px]" })
 					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
@@ -7039,6 +8253,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 						}),
 						disabled: !canGoNext,
 						className: "cpk:h-6 cpk:w-6 cpk:p-0",
+						"aria-label": labels.userMessageToolbarNextBranchLabel,
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, { className: "cpk:size-[20px]" })
 					})
 				]
@@ -7059,7 +8274,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 /**
 	* Formats an elapsed duration (in seconds) to a human-readable string.
 	*/
-	function formatDuration(seconds) {
+	function formatDuration$1(seconds) {
 		if (seconds < 1) return "a few seconds";
 		if (seconds < 60) return `${Math.round(seconds)} seconds`;
 		const mins = Math.floor(seconds / 60);
@@ -7097,7 +8312,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			userToggledRef.current = true;
 			setIsOpen((prev) => !prev);
 		} : void 0;
-		const label = isStreaming ? "Thinking…" : `Thought for ${formatDuration(elapsed)}`;
+		const label = isStreaming ? "Thinking…" : `Thought for ${formatDuration$1(elapsed)}`;
 		const boundHeader = renderSlot(header, CopilotChatReasoningMessage.Header, {
 			isOpen,
 			label,
@@ -7319,6 +8534,71 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 	*/
 	const ScrollPinnedContext = react.default.createContext(false);
 
+//#endregion
+//#region src/v2/components/chat/CopilotChatWorkSummary.tsx
+/** "45s", "1m 5s", "2m". Used for the live timer and the final duration. */
+	function formatDuration(ms) {
+		const seconds = Math.max(0, Math.floor(ms / 1e3));
+		if (seconds < 60) return `${seconds}s`;
+		const minutes = Math.floor(seconds / 60);
+		const rest = seconds % 60;
+		return rest ? `${minutes}m ${rest}s` : `${minutes}m`;
+	}
+	/** Re-renders every second while `active`, returning the current time. */
+	function useNow(active) {
+		const [now, setNow] = (0, react.useState)(() => Date.now());
+		(0, react.useEffect)(() => {
+			if (!active) return;
+			setNow(Date.now());
+			const timer = setInterval(() => setNow(Date.now()), 1e3);
+			return () => clearInterval(timer);
+		}, [active]);
+		return now;
+	}
+	/**
+	* The line at the top of a reply in the `"turn"` tool-call display. While the
+	* agent works it reads "Working 4s"; once the reply is done it reads "Worked
+	* for 9s · 7 tools" and toggles the work it folded away.
+	*/
+	function CopilotChatWorkSummary({ isWorking, isOpen, calls, elapsedMs, workingSince, className, ...props }) {
+		const now = useNow(isWorking);
+		const failed = calls.filter((call) => call.toolMessage?.error).length;
+		const liveMs = elapsedMs !== void 0 && workingSince !== void 0 ? elapsedMs + Math.max(0, now - workingSince) : void 0;
+		const duration = elapsedMs !== void 0 ? formatDuration(Math.max(1e3, elapsedMs)) : void 0;
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+			type: "button",
+			"data-copilotkit": true,
+			"data-testid": "copilot-work-summary",
+			"data-state": isWorking ? "working" : "done",
+			"aria-expanded": isOpen,
+			className: (0, tailwind_merge.twMerge)("cpk:m-0 cpk:inline-flex cpk:max-w-full cpk:cursor-pointer cpk:items-center cpk:gap-1.5 cpk:rounded-md cpk:border-none cpk:bg-transparent cpk:p-0 cpk:py-0.5 cpk:text-sm cpk:text-muted-foreground cpk:transition-colors cpk:hover:text-foreground cpk:focus-visible:outline-2 cpk:focus-visible:outline-ring", className),
+			...props,
+			children: [isWorking ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "cpk:font-medium cpk-shimmer",
+				children: "Working"
+			}), liveMs !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "cpk:text-xs cpk:tabular-nums cpk:opacity-70",
+				children: formatDuration(liveMs)
+			})] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "cpk:font-medium",
+					children: duration ? `Worked for ${duration}` : `Used ${pluralize(calls.length, "tool")}`
+				}),
+				duration && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "cpk:text-xs cpk:opacity-70",
+					children: pluralize(calls.length, "tool")
+				}),
+				failed > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "cpk:text-destructive",
+					children: [failed, " failed"]
+				})
+			] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, {
+				"aria-hidden": "true",
+				className: (0, tailwind_merge.twMerge)("cpk:size-3.5 cpk:shrink-0 cpk:transition-transform cpk:duration-200", isOpen && "cpk:rotate-90")
+			})]
+		});
+	}
+
 //#endregion
 //#region src/v2/components/intelligence-indicator/IntelligenceIndicatorView.tsx
 /**
@@ -7805,7 +9085,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 	}
 	const GROUP_ROW_KEY_PREFIX = "copilotkit-group:";
 	const VIRTUALIZE_THRESHOLD = 50;
-	function CopilotChatMessageView({ messages = [], assistantMessage, userMessage, reasoningMessage, cursor, intelligenceIndicator, isRunning = false, transformMessages, groupMessages, children, className, ...props }) {
+	function CopilotChatMessageView({ messages = [], assistantMessage, userMessage, reasoningMessage, cursor, intelligenceIndicator, workSummary, isRunning = false, transformMessages, groupMessages, messageFeedback = true, toolCallDisplay = "grouped", children, className, ...props }) {
 		const isPinnedToBottom = (0, react.useContext)(ScrollPinnedContext);
 		const renderCustomMessage = useRenderCustomMessages();
 		const { renderActivityMessage } = useRenderActivityMessage();
@@ -7846,6 +9126,100 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			transformedMessages
 		]);
 		const latestRenderedId = renderedMessages[renderedMessages.length - 1]?.id;
+		const rendererNames = useToolCallRendererNames();
+		const toolCallLayouts = (0, react.useMemo)(() => toolCallDisplay === "separate" ? /* @__PURE__ */ new Map() : getToolCallLayouts(renderedMessages, messages, rendererNames), [
+			toolCallDisplay,
+			renderedMessages,
+			messages,
+			rendererNames
+		]);
+		const turnWork = (0, react.useMemo)(() => toolCallDisplay === "turn" ? getTurnWork(renderedMessages, toolCallLayouts) : void 0, [
+			toolCallDisplay,
+			renderedMessages,
+			toolCallLayouts
+		]);
+		const turnByFirstMessage = (0, react.useMemo)(() => {
+			const byFirst = /* @__PURE__ */ new Map();
+			for (const turn of turnWork?.values() ?? []) byFirst.set(turn.firstMessageId, turn);
+			return byFirst;
+		}, [turnWork]);
+		let latestTurnKey = "start";
+		for (let i = renderedMessages.length - 1; i >= 0; i--) if (renderedMessages[i].role === "user") {
+			latestTurnKey = renderedMessages[i].id;
+			break;
+		}
+		const isWorkingOn = (turnKey) => isRunning && turnKey === latestTurnKey;
+		const [toggledTurns, setToggledTurns] = (0, react.useState)(() => /* @__PURE__ */ new Map());
+		const isWorkOpen = (turnKey) => toggledTurns.get(turnKey) ?? isWorkingOn(turnKey);
+		const workTimesRef = (0, react.useRef)(/* @__PURE__ */ new Map());
+		if (toolCallDisplay === "turn") {
+			const now = Date.now();
+			const workTimes = workTimesRef.current;
+			if (isRunning) {
+				const times = workTimes.get(latestTurnKey);
+				if (times) times.workingSince ?? (times.workingSince = now);
+				else if (renderedMessages[renderedMessages.length - 1]?.role === "user") workTimes.set(latestTurnKey, {
+					elapsedMs: 0,
+					workingSince: now
+				});
+			} else for (const times of workTimes.values()) {
+				if (times.workingSince === void 0) continue;
+				times.elapsedMs += now - times.workingSince;
+				times.workingSince = void 0;
+			}
+		}
+		const { workOpen, workTextOpen } = (0, react.useMemo)(() => {
+			const open = /* @__PURE__ */ new Map();
+			const textOpen = /* @__PURE__ */ new Map();
+			for (const turn of turnWork?.values() ?? []) {
+				const turnOpen = toggledTurns.get(turn.key) ?? (isRunning && turn.key === latestTurnKey);
+				for (const id of turn.workMessageIds) {
+					open.set(id, turnOpen);
+					if (id !== turn.replyTextMessageId) textOpen.set(id, turnOpen);
+				}
+			}
+			return {
+				workOpen: open,
+				workTextOpen: textOpen
+			};
+		}, [
+			turnWork,
+			toggledTurns,
+			isRunning,
+			latestTurnKey
+		]);
+		const toolCallDisplayContext = (0, react.useMemo)(() => ({
+			display: toolCallDisplay,
+			isRunning,
+			layouts: toolCallLayouts,
+			workOpen,
+			workTextOpen
+		}), [
+			toolCallDisplay,
+			isRunning,
+			toolCallLayouts,
+			workOpen,
+			workTextOpen
+		]);
+		const renderWorkSummary = (turnKey, calls) => {
+			const working = isWorkingOn(turnKey);
+			const open = isWorkOpen(turnKey);
+			const times = workTimesRef.current.get(turnKey);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+				open: working || calls.length > 0,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "cpk:pt-1 cpk:pb-2",
+					children: renderSlot(workSummary, CopilotChatWorkSummary, {
+						isWorking: working,
+						isOpen: open,
+						calls,
+						elapsedMs: times?.elapsedMs,
+						workingSince: times?.workingSince,
+						onClick: () => setToggledTurns((toggled) => new Map(toggled).set(turnKey, !open))
+					})
+				})
+			}, `work-summary-${turnKey}`);
+		};
 		const transformDuplicateId = (0, react.useMemo)(() => {
 			if (process.env.NODE_ENV === "production" || !transformMessages && !groupMessages) return;
 			const seen = /* @__PURE__ */ new Set();
@@ -7883,8 +9257,6 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			(0, _copilotkit_shared.commitRowKeyStore)(rowKeyStore, renderedMessages);
 		}, [rowKeyStore, renderedMessages]);
 		const stableGroupKey = (key) => rowRenderKeys.get(key) ?? key;
-		const rowKey = (row) => row.type === "group" ? `${GROUP_ROW_KEY_PREFIX}${stableGroupKey(row.key)}` : rowRenderKeys.get(row.message.id) ?? row.message.id;
-		const rowKeys = (0, react.useMemo)(() => rows.map(rowKey), [rows, rowRenderKeys]);
 		const groupStateRef = (0, react.useRef)(/* @__PURE__ */ new Map());
 		const groupSettersRef = (0, react.useRef)(/* @__PURE__ */ new Map());
 		const groupStateThreadRef = (0, react.useRef)(config?.threadId);
@@ -7913,6 +9285,18 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		const { Component: AssistantComponent, slotProps: assistantSlotProps } = (0, react.useMemo)(() => resolveSlotComponent(assistantMessage, CopilotChatAssistantMessage_default), [assistantMessage]);
 		const agentId = config?.agentId;
 		const threadId = config?.threadId;
+		const learningFeedbackEnabled = useLearningFeedbackEnabled(copilotkit);
+		const feedbackScope = (0, react.useMemo)(() => messageFeedback && learningFeedbackEnabled && agentId !== void 0 && threadId !== void 0 ? {
+			copilotkit,
+			agentId,
+			threadId
+		} : null, [
+			messageFeedback,
+			learningFeedbackEnabled,
+			copilotkit,
+			agentId,
+			threadId
+		]);
 		const assistantSlotPropsWithFeedback = (0, react.useMemo)(() => {
 			const onThumbsUp = assistantSlotProps?.onThumbsUp;
 			const onThumbsDown = assistantSlotProps?.onThumbsDown;
@@ -7958,8 +9342,6 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			total: 0,
 			sizes: /* @__PURE__ */ new Map()
 		});
-		const rowKeysRef = react.default.useRef(rowKeys);
-		rowKeysRef.current = rowKeys;
 		const firstMessageId = deduplicatedMessages[0]?.id;
 		const measuredThreadRef = react.default.useRef(firstMessageId);
 		if (measuredThreadRef.current !== firstMessageId) {
@@ -7969,16 +9351,6 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				sizes: /* @__PURE__ */ new Map()
 			};
 		}
-		const measuredKeysRef = react.default.useRef(rowKeys);
-		if (measuredKeysRef.current !== rowKeys) {
-			measuredKeysRef.current = rowKeys;
-			const live = new Set(rowKeys);
-			const measured = measuredRef.current;
-			for (const [key, height] of measured.sizes) if (!live.has(key)) {
-				measured.sizes.delete(key);
-				measured.total -= height;
-			}
-		}
 		const estimateRowSize = react.default.useCallback(() => {
 			const { total, sizes } = measuredRef.current;
 			return sizes.size > 0 ? Math.max(1, Math.round(total / sizes.size)) : 100;
@@ -7986,15 +9358,13 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		const measureRowElement = react.default.useCallback((el) => {
 			const height = el?.getBoundingClientRect().height ?? 0;
 			const index = Number(el?.dataset?.index);
-			const key = Number.isInteger(index) ? rowKeysRef.current[index] : void 0;
-			if (height > 0 && key !== void 0) {
+			if (height > 0 && Number.isInteger(index)) {
 				const { total, sizes } = measuredRef.current;
-				measuredRef.current.total = total - (sizes.get(key) ?? 0) + height;
-				sizes.set(key, height);
+				measuredRef.current.total = total - (sizes.get(index) ?? 0) + height;
+				sizes.set(index, height);
 			}
-			return height;
+			return height > 0 ? height : measuredRef.current.sizes.get(index) ?? 100;
 		}, []);
-		const getRowKey = react.default.useCallback((index) => rowKeys[index] ?? index, [rowKeys]);
 		const isPinnedToBottomRef = react.default.useRef(isPinnedToBottom);
 		const shouldAdjustScrollOnResize = react.default.useCallback((item, _delta, instance) => {
 			if (isPinnedToBottomRef.current) return false;
@@ -8003,9 +9373,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		}, []);
 		const virtualizer = (0, _tanstack_react_virtual.useVirtualizer)({
 			count: shouldVirtualize ? rows.length : 0,
-			getScrollElement: () => scrollElement,
+			getScrollElement: () => shouldVirtualize ? scrollElement : null,
 			estimateSize: estimateRowSize,
-			getItemKey: getRowKey,
 			overscan: 5,
 			measureElement: measureRowElement,
 			initialRect: {
@@ -8015,8 +9384,11 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 		isPinnedToBottomRef.current = isPinnedToBottom;
 		virtualizer.shouldAdjustScrollPositionOnItemSizeChange = shouldAdjustScrollOnResize;
+		const lastEndAlignedFirstMessageRef = react.default.useRef(void 0);
 		(0, react.useLayoutEffect)(() => {
 			if (!shouldVirtualize || !rows.length) return;
+			if (lastEndAlignedFirstMessageRef.current === firstMessageId) return;
+			lastEndAlignedFirstMessageRef.current = firstMessageId;
 			virtualizer.scrollToIndex(rows.length - 1, { align: "end" });
 		}, [shouldVirtualize, firstMessageId]);
 		const intelligenceTurnAnchors = (0, react.useMemo)(() => getIntelligenceTurnAnchors(deduplicatedMessages, renderedMessages), [deduplicatedMessages, renderedMessages]);
@@ -8024,6 +9396,8 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			const elements = [];
 			const stateSnapshot = renderCustomMessage ? getStateSnapshotForMessage(message.id) : void 0;
 			const rowKey = rowRenderKeys.get(message.id) ?? message.id;
+			const turn = turnByFirstMessage.get(message.id);
+			if (turn) elements.push(renderWorkSummary(turn.key, turn.calls));
 			if (renderCustomMessage) elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoizedCustomMessage, {
 				message,
 				position: "before",
@@ -8047,14 +9421,20 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				message,
 				renderActivityMessage
 			}, rowKey));
-			else if (message.role === "reasoning") elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoizedReasoningMessage, {
-				message,
-				messages,
-				isRunning,
-				isLatest: message.id === latestRenderedId,
-				ReasoningMessageComponent: ReasoningComponent,
-				slotProps: reasoningSlotProps
-			}, rowKey));
+			else if (message.role === "reasoning") {
+				const reasoning = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoizedReasoningMessage, {
+					message,
+					messages,
+					isRunning,
+					isLatest: message.id === latestRenderedId,
+					ReasoningMessageComponent: ReasoningComponent,
+					slotProps: reasoningSlotProps
+				}, rowKey);
+				elements.push(toolCallDisplay === "turn" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Collapsible, {
+					open: workOpen.get(message.id) ?? true,
+					children: reasoning
+				}, rowKey) : reasoning);
+			}
 			if (renderCustomMessage) elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoizedCustomMessage, {
 				message,
 				position: "after",
@@ -8069,6 +9449,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 			}, `intelligence-${intelligenceTurnId}`));
 			return elements.filter(Boolean);
 		};
+		const rowKey = (row) => row.type === "group" ? `${GROUP_ROW_KEY_PREFIX}${stableGroupKey(row.key)}` : rowRenderKeys.get(row.message.id) ?? row.message.id;
 		const renderRow = (row) => {
 			if (row.type === "message") return renderMessageBlock(row.message);
 			const Wrapper = row.wrapper;
@@ -8081,52 +9462,157 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				children: row.messages.flatMap(renderMessageBlock)
 			}, rowKey(row))];
 		};
+		const rowKeysRef = (0, react.useRef)([]);
+		rowKeysRef.current = rows.map(rowKey);
+		const virtualModeRef = (0, react.useRef)(shouldVirtualize);
+		virtualModeRef.current = shouldVirtualize;
+		(0, react.useEffect)(() => {
+			const element = scrollElementFromCtx;
+			if (!element) return;
+			let anchor = null;
+			let suspended = false;
+			let frame = 0;
+			const visibleRows = () => Array.from(element.querySelectorAll("[data-scroll-anchor]"));
+			const remember = () => {
+				if (suspended || element.clientHeight === 0 || !virtualModeRef.current) return;
+				if (isPinnedToBottomRef.current) {
+					anchor = null;
+					return;
+				}
+				const viewport = element.getBoundingClientRect();
+				const row = visibleRows().find((row) => {
+					const bounds = row.getBoundingClientRect();
+					return bounds.bottom > viewport.top && bounds.top < viewport.bottom;
+				});
+				if (row) anchor = {
+					key: row.dataset.scrollAnchor,
+					offset: row.getBoundingClientRect().top - viewport.top
+				};
+			};
+			const observer = new ResizeObserver(() => {
+				if (element.clientHeight === 0) {
+					suspended = true;
+					cancelAnimationFrame(frame);
+					return;
+				}
+				if (!suspended || !anchor) {
+					suspended = false;
+					remember();
+					return;
+				}
+				let attempts = 0;
+				let stableFrames = 0;
+				const restore = () => {
+					if (!anchor || element.clientHeight === 0) return;
+					const index = rowKeysRef.current.indexOf(anchor.key);
+					if (index < 0) {
+						anchor = null;
+						suspended = false;
+						return;
+					}
+					const row = visibleRows().find((row) => row.dataset.scrollAnchor === anchor.key);
+					if (row) {
+						const delta = row.getBoundingClientRect().top - element.getBoundingClientRect().top - anchor.offset;
+						element.scrollTop += delta;
+						stableFrames = Math.abs(delta) < 1 ? stableFrames + 1 : 0;
+					} else {
+						const offset = virtualizer.getOffsetForIndex(index, "start")?.[0];
+						if (offset !== void 0) virtualizer.scrollToOffset(offset - anchor.offset);
+						stableFrames = 0;
+					}
+					if (++attempts < 60 && stableFrames < 3) frame = requestAnimationFrame(restore);
+					else {
+						suspended = false;
+						remember();
+					}
+				};
+				frame = requestAnimationFrame(restore);
+			});
+			const interrupt = () => {
+				cancelAnimationFrame(frame);
+				anchor = null;
+				suspended = false;
+			};
+			element.addEventListener("scroll", remember, { passive: true });
+			element.addEventListener("wheel", interrupt, { passive: true });
+			element.addEventListener("touchstart", interrupt, { passive: true });
+			element.addEventListener("keydown", interrupt);
+			observer.observe(element);
+			remember();
+			return () => {
+				cancelAnimationFrame(frame);
+				observer.disconnect();
+				element.removeEventListener("scroll", remember);
+				element.removeEventListener("wheel", interrupt);
+				element.removeEventListener("touchstart", interrupt);
+				element.removeEventListener("keydown", interrupt);
+			};
+		}, [
+			scrollElementFromCtx,
+			virtualizer,
+			firstMessageId
+		]);
 		const messageElements = shouldVirtualize ? [] : rows.flatMap(renderRow);
-		if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			"data-copilotkit": true,
-			style: { display: "contents" },
-			children: children({
-				messageElements,
-				messages,
-				isRunning,
-				interruptElement
+		if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MessageFeedbackScopeContext.Provider, {
+			value: feedbackScope,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallDisplayContext.Provider, {
+				value: toolCallDisplayContext,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					"data-copilotkit": true,
+					style: { display: "contents" },
+					children: children({
+						messageElements,
+						messages,
+						isRunning,
+						interruptElement
+					})
+				})
 			})
 		});
 		const lastMessage = renderedMessages[renderedMessages.length - 1];
-		const showCursor = isRunning && lastMessage?.role !== "reasoning";
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			"data-copilotkit": true,
-			"data-testid": "copilot-message-list",
-			className: (0, tailwind_merge.twMerge)("copilotKitMessages cpk:flex cpk:flex-col", className),
-			...props,
-			children: [
-				shouldVirtualize ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					style: {
-						height: virtualizer.getTotalSize(),
-						position: "relative"
-					},
-					children: virtualizer.getVirtualItems().map((virtualItem) => {
-						const row = rows[virtualItem.index];
-						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							"data-index": virtualItem.index,
-							ref: virtualizer.measureElement,
+		const showCursor = isRunning && lastMessage?.role !== "reasoning" && toolCallDisplay !== "turn";
+		const pendingWorkSummary = toolCallDisplay === "turn" && isRunning && lastMessage?.role === "user";
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MessageFeedbackScopeContext.Provider, {
+			value: feedbackScope,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallDisplayContext.Provider, {
+				value: toolCallDisplayContext,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					"data-copilotkit": true,
+					"data-testid": "copilot-message-list",
+					className: (0, tailwind_merge.twMerge)("copilotKitMessages cpk:flex cpk:flex-col", className),
+					...props,
+					children: [
+						shouldVirtualize ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							style: {
-								position: "absolute",
-								top: 0,
-								left: 0,
-								width: "100%",
-								transform: `translateY(${virtualItem.start}px)`
+								height: virtualizer.getTotalSize(),
+								position: "relative"
 							},
-							children: renderRow(row)
-						}, rowKey(row));
-					})
-				}) : messageElements,
-				interruptElement,
-				showCursor && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "cpk:mt-2",
-					children: renderSlot(cursor, CopilotChatMessageView.Cursor, {})
+							children: virtualizer.getVirtualItems().map((virtualItem) => {
+								const row = rows[virtualItem.index];
+								return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									"data-index": virtualItem.index,
+									"data-scroll-anchor": rowKey(row),
+									ref: virtualizer.measureElement,
+									style: {
+										position: "absolute",
+										top: 0,
+										left: 0,
+										width: "100%",
+										transform: `translateY(${virtualItem.start}px)`
+									},
+									children: renderRow(row)
+								}, rowKey(row));
+							})
+						}) : messageElements,
+						interruptElement,
+						pendingWorkSummary && renderWorkSummary(latestTurnKey, []),
+						showCursor && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "cpk:mt-2",
+							children: renderSlot(cursor, CopilotChatMessageView.Cursor, {})
+						})
+					]
 				})
-			]
+			})
 		});
 	}
 	CopilotChatMessageView.Cursor = function Cursor({ className, ...props }) {
@@ -8511,6 +9997,16 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 	}
 	function CopilotChatView({ messageView, input, scrollView, suggestionView, welcomeScreen, messages = [], autoScroll = true, isRunning = false, suggestions, suggestionLoadingIndexes, onSelectSuggestion, onSubmitMessage, onStop, inputMode, inputValue, onInputChange, onStartTranscribe, onCancelTranscribe, onFinishTranscribe, onFinishTranscribeWithAudio, attachments, onRemoveAttachment, onAddFile, dragOver, onDragOver, onDragLeave, onDrop, isConnecting = false, hasExplicitThreadId = false, disclaimer, intelligenceIndicator, children, className, ...props }) {
+		const configuredThreadId = useCopilotChatConfiguration()?.threadId;
+		const [fallbackThreadId, setFallbackThreadId] = (0, react.useState)(messages[0]?.id);
+		const previousMessageIds = (0, react.useRef)(/* @__PURE__ */ new Set());
+		(0, react.useEffect)(() => {
+			if (messages.length === 0) return;
+			const overlaps = messages.some((message) => previousMessageIds.current.has(message.id));
+			previousMessageIds.current = new Set(messages.map((message) => message.id));
+			if (!overlaps) setFallbackThreadId(messages[0].id);
+		}, [messages]);
+		const scrollThreadId = configuredThreadId ?? fallbackThreadId;
 		const [inputContainerEl, setInputContainerEl] = (0, react.useState)(null);
 		const [inputContainerHeight, setInputContainerHeight] = (0, react.useState)(0);
 		const [isResizing, setIsResizing] = (0, react.useState)(false);
@@ -8577,6 +10073,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		}) : null;
 		const BoundScrollView = renderSlot(scrollView, CopilotChatView.ScrollView, {
 			autoScroll,
+			scrollThreadId,
 			inputContainerHeight,
 			isResizing,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -8672,12 +10169,102 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 		});
 	}
 	(function(_CopilotChatView) {
-		const ScrollContent = ({ children, scrollToBottomButton, feather, inputContainerHeight, isResizing }) => {
-			const { isAtBottom, scrollToBottom, scrollRef, state } = (0, use_stick_to_bottom.useStickToBottomContext)();
+		const ScrollContent = ({ children, scrollToBottomButton, feather, inputContainerHeight, isResizing, scrollThreadId }) => {
+			const { isAtBottom, scrollToBottom, stopScroll, scrollRef, state } = (0, use_stick_to_bottom.useStickToBottomContext)();
 			const [scrollEl, setScrollEl] = (0, react.useState)(null);
+			const readingOffsetRef = (0, react.useRef)(null);
+			const pinIntentRef = (0, react.useRef)(false);
+			const stateRef = (0, react.useRef)(state);
+			stateRef.current = state;
 			(0, react.useLayoutEffect)(() => {
 				setScrollEl(scrollRef.current ?? null);
 			}, []);
+			(0, react.useEffect)(() => {
+				if (!scrollEl) return;
+				let hidden = false;
+				let resumeBottom = false;
+				let pendingFrame = 0;
+				let resumeFrame = 0;
+				let settleFrame = 0;
+				readingOffsetRef.current = null;
+				const rememberScroll = () => {
+					if (hidden || scrollEl.clientHeight === 0) return;
+					if (resumeBottom) {
+						readingOffsetRef.current = null;
+						return;
+					}
+					if (pinIntentRef.current) if (stateRef.current.escapedFromLock) pinIntentRef.current = false;
+					else {
+						readingOffsetRef.current = null;
+						if (!stateRef.current.isNearBottom) return;
+						pinIntentRef.current = false;
+					}
+					readingOffsetRef.current = !stateRef.current.isAtBottom && (stateRef.current.escapedFromLock || !stateRef.current.isNearBottom) ? scrollEl.scrollTop : null;
+				};
+				const onScroll = () => {
+					rememberScroll();
+					cancelAnimationFrame(pendingFrame);
+					pendingFrame = requestAnimationFrame(rememberScroll);
+				};
+				const onWheel = (event) => {
+					if (event.deltaY < 0) {
+						pinIntentRef.current = false;
+						resumeBottom = false;
+					}
+				};
+				const resizeObserver = new ResizeObserver(() => {
+					if (scrollEl.clientHeight === 0) {
+						hidden = true;
+						resumeBottom = pinIntentRef.current || readingOffsetRef.current === null;
+						if (!resumeBottom) stopScroll();
+					} else if (hidden) {
+						hidden = false;
+						if (resumeBottom) {
+							stopScroll();
+							resumeFrame = requestAnimationFrame(() => {
+								settleFrame = requestAnimationFrame(() => {
+									if (scrollEl.clientHeight > 0 && resumeBottom) {
+										resumeBottom = false;
+										pinIntentRef.current = true;
+										scrollToBottom({ animation: "instant" });
+									}
+								});
+							});
+						} else if (readingOffsetRef.current !== null) {
+							stopScroll();
+							scrollEl.scrollTop = readingOffsetRef.current;
+						}
+					}
+				});
+				rememberScroll();
+				scrollEl.addEventListener("scroll", onScroll);
+				scrollEl.addEventListener("wheel", onWheel, { passive: true });
+				resizeObserver.observe(scrollEl);
+				return () => {
+					scrollEl.removeEventListener("scroll", onScroll);
+					scrollEl.removeEventListener("wheel", onWheel);
+					cancelAnimationFrame(pendingFrame);
+					cancelAnimationFrame(resumeFrame);
+					cancelAnimationFrame(settleFrame);
+					resizeObserver.disconnect();
+				};
+			}, [
+				scrollEl,
+				scrollToBottom,
+				stopScroll,
+				scrollThreadId
+			]);
+			const startBottomPin = (0, react.useCallback)((instant = false) => {
+				readingOffsetRef.current = null;
+				pinIntentRef.current = true;
+				scrollToBottom(instant ? { animation: "instant" } : void 0);
+			}, [scrollToBottom]);
+			const previousScrollThreadId = (0, react.useRef)(scrollThreadId);
+			(0, react.useEffect)(() => {
+				if (previousScrollThreadId.current === scrollThreadId) return;
+				previousScrollThreadId.current = scrollThreadId;
+				startBottomPin(true);
+			}, [scrollThreadId, startBottomPin]);
 			const BoundFeather = renderSlot(feather, CopilotChatView.Feather, {});
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollElementContext.Provider, {
 				value: scrollEl,
@@ -8699,7 +10286,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 						!isAtBottom && !isResizing && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "cpk:absolute cpk:inset-x-0 cpk:flex cpk:justify-center cpk:z-30 cpk:pointer-events-none",
 							style: { bottom: `${inputContainerHeight + SCROLL_BUTTON_OFFSET}px` },
-							children: renderSlot(scrollToBottomButton, CopilotChatView.ScrollToBottomButton, { onClick: () => scrollToBottom() })
+							children: renderSlot(scrollToBottomButton, CopilotChatView.ScrollToBottomButton, { onClick: () => startBottomPin() })
 						})
 					] })
 				})
@@ -8747,7 +10334,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				})
 			});
 		};
-		_CopilotChatView.ScrollView = ({ children, autoScroll = "pin-to-bottom", scrollToBottomButton, feather, inputContainerHeight = 0, isResizing = false, className, ...props }) => {
+		_CopilotChatView.ScrollView = ({ children, autoScroll = "pin-to-bottom", scrollThreadId, scrollToBottomButton, feather, inputContainerHeight = 0, isResizing = false, className, ...props }) => {
 			const mode = normalizeAutoScroll(autoScroll);
 			const [hasMounted, setHasMounted] = (0, react.useState)(false);
 			const scrollRef = (0, react.useRef)(null);
@@ -8836,6 +10423,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				initial: "smooth",
 				...props,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollContent, {
+					scrollThreadId,
 					scrollToBottomButton,
 					feather,
 					inputContainerHeight,
@@ -8844,14 +10432,18 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				})
 			});
 		};
-		_CopilotChatView.ScrollToBottomButton = ({ className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
-			"data-testid": "copilot-scroll-to-bottom",
-			variant: "outline",
-			size: "sm",
-			className: (0, tailwind_merge.twMerge)("cpk:rounded-full cpk:w-10 cpk:h-10 cpk:p-0 cpk:pointer-events-auto", "cpk:bg-white cpk:dark:bg-gray-900", "cpk:shadow-lg cpk:border cpk:border-gray-200 cpk:dark:border-gray-700", "cpk:hover:bg-gray-50 cpk:dark:hover:bg-gray-800", "cpk:flex cpk:items-center cpk:justify-center cpk:cursor-pointer", className),
-			...props,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, { className: "cpk:w-4 cpk:h-4 cpk:text-gray-600 cpk:dark:text-white" })
-		});
+		_CopilotChatView.ScrollToBottomButton = ({ className, ...props }) => {
+			const labels = useCopilotChatConfiguration()?.labels ?? CopilotChatDefaultLabels;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+				"data-testid": "copilot-scroll-to-bottom",
+				variant: "outline",
+				size: "sm",
+				className: (0, tailwind_merge.twMerge)("cpk:rounded-full cpk:w-10 cpk:h-10 cpk:p-0 cpk:pointer-events-auto", "cpk:bg-white cpk:dark:bg-gray-900", "cpk:shadow-lg cpk:border cpk:border-gray-200 cpk:dark:border-gray-700", "cpk:hover:bg-gray-50 cpk:dark:hover:bg-gray-800", "cpk:flex cpk:items-center cpk:justify-center cpk:cursor-pointer", className),
+				"aria-label": labels.chatScrollToBottomLabel,
+				...props,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, { className: "cpk:w-4 cpk:h-4 cpk:text-gray-600 cpk:dark:text-white" })
+			});
+		};
 		_CopilotChatView.Feather = ({ className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className,
 			...props
@@ -10234,6 +11826,7 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 				if (containerRef.current?.contains(target)) return;
 				const toggleButton = document.querySelector("[data-slot='chat-toggle-button']");
 				if (toggleButton && toggleButton.contains(target)) return;
+				if (target instanceof Element && target.closest("[data-copilotkit-popover]")) return;
 				setModalOpen?.(false);
 			};
 			document.addEventListener("pointerdown", handlePointerDown);
@@ -10744,62 +12337,14 @@ _radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
 
 //#endregion
 //#region src/v2/components/WildcardToolCallRender.tsx
+/**
+	* Catch-all (`"*"`) tool-call renderer that shows CopilotKit's default
+	* tool-call card for any tool without a dedicated renderer.
+	*/
 	const WildcardToolCallRender = defineToolCallRenderer({
 		name: "*",
-		render: ({ args, result, name, status }) => {
-			const [isExpanded, setIsExpanded] = (0, react.useState)(false);
-			const statusString = String(status);
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "cpk:mt-2 cpk:pb-2",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: "cpk:rounded-xl cpk:border cpk:border-zinc-200/60 cpk:dark:border-zinc-800/60 cpk:bg-white/70 cpk:dark:bg-zinc-900/50 cpk:shadow-sm cpk:backdrop-blur cpk:p-4",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: "cpk:flex cpk:items-center cpk:justify-between cpk:gap-3 cpk:cursor-pointer",
-						onClick: () => setIsExpanded(!isExpanded),
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: "cpk:flex cpk:items-center cpk:gap-2 cpk:min-w-0",
-							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-									className: `cpk:h-4 cpk:w-4 cpk:text-zinc-500 cpk:dark:text-zinc-400 cpk:transition-transform ${isExpanded ? "cpk:rotate-90" : ""}`,
-									fill: "none",
-									viewBox: "0 0 24 24",
-									strokeWidth: 2,
-									stroke: "currentColor",
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
-										strokeLinecap: "round",
-										strokeLinejoin: "round",
-										d: "M8.25 4.5l7.5 7.5-7.5 7.5"
-									})
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "cpk:inline-block cpk:h-2 cpk:w-2 cpk:rounded-full cpk:bg-blue-500" }),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									className: "cpk:truncate cpk:text-sm cpk:font-medium cpk:text-zinc-900 cpk:dark:text-zinc-100",
-									children: name
-								})
-							]
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: `cpk:inline-flex cpk:items-center cpk:rounded-full cpk:px-2 cpk:py-1 cpk:text-xs cpk:font-medium ${statusString === "inProgress" || statusString === "executing" ? "cpk:bg-amber-100 cpk:text-amber-800 cpk:dark:bg-amber-500/15 cpk:dark:text-amber-400" : statusString === "complete" ? "cpk:bg-emerald-100 cpk:text-emerald-800 cpk:dark:bg-emerald-500/15 cpk:dark:text-emerald-400" : "cpk:bg-zinc-100 cpk:text-zinc-800 cpk:dark:bg-zinc-700/40 cpk:dark:text-zinc-300"}`,
-							children: String(status)
-						})]
-					}), isExpanded && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: "cpk:mt-3 cpk:grid cpk:gap-4",
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: "cpk:text-xs cpk:uppercase cpk:tracking-wide cpk:text-zinc-500 cpk:dark:text-zinc-400",
-							children: "Arguments"
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
-							className: "cpk:mt-2 cpk:max-h-64 cpk:overflow-auto cpk:rounded-md cpk:bg-zinc-50 cpk:dark:bg-zinc-800/60 cpk:p-3 cpk:text-xs cpk:leading-relaxed cpk:text-zinc-800 cpk:dark:text-zinc-200 cpk:whitespace-pre-wrap cpk:break-words",
-							children: JSON.stringify(args ?? {}, null, 2)
-						})] }), result !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: "cpk:text-xs cpk:uppercase cpk:tracking-wide cpk:text-zinc-500 cpk:dark:text-zinc-400",
-							children: "Result"
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
-							className: "cpk:mt-2 cpk:max-h-64 cpk:overflow-auto cpk:rounded-md cpk:bg-zinc-50 cpk:dark:bg-zinc-800/60 cpk:p-3 cpk:text-xs cpk:leading-relaxed cpk:text-zinc-800 cpk:dark:text-zinc-200 cpk:whitespace-pre-wrap cpk:break-words",
-							children: typeof result === "string" ? result : JSON.stringify(result, null, 2)
-						})] })]
-					})]
-				})
-			});
-		}
+		group: true,
+		render: (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultToolCallRenderer, { ...adaptRendererProps(props) })
 	});
 
 //#endregion
@@ -13044,9 +14589,11 @@ exports.CopilotChatSuggestionView = CopilotChatSuggestionView;
 exports.CopilotChatToggleButton = CopilotChatToggleButton;
 exports.CopilotChatToggleButtonCloseIcon = DefaultCloseIcon;
 exports.CopilotChatToggleButtonOpenIcon = DefaultOpenIcon;
+exports.CopilotChatToolCallGroup = CopilotChatToolCallGroup;
 exports.CopilotChatToolCallsView = CopilotChatToolCallsView;
 exports.CopilotChatUserMessage = CopilotChatUserMessage_default;
 exports.CopilotChatView = CopilotChatView_default;
+exports.CopilotChatWorkSummary = CopilotChatWorkSummary;
 exports.CopilotKit = CopilotKit;
 Object.defineProperty(exports, 'CopilotKitCore', {
   enumerable: true,
@@ -13275,12 +14822,6 @@ Object.defineProperty(exports, 'IntelligenceAgent', {
 });
 exports.IntelligenceIndicator = IntelligenceIndicator;
 exports.IntelligenceIndicatorView = IntelligenceIndicatorView;
-Object.defineProperty(exports, 'IntelligenceReplayFailedError', {
-  enumerable: true,
-  get: function () {
-    return _copilotkit_core.IntelligenceReplayFailedError;
-  }
-});
 Object.defineProperty(exports, 'InterruptSchema', {
   enumerable: true,
   get: function () {