@mcp-b/react-components 0.6.4 → 0.7.0

package/dist/components/ThinkChatActivity.d.ts

@@ -0,0 +1,73 @@
+import { AgentChatProps, AgentChatRenderPartContext } from "./AgentChat.js";
+import { _ as isThinkChatActivityPart, s as ThinkChatPart } from "../ThinkChatToolParts-DnUiZgCC.js";
+import * as React from "react";
+import { DynamicToolUIPart, ToolUIPart, UIMessage } from "ai";
+
+//#region src/components/ThinkChatActivity.d.ts
+/**
+ * Bespoke rendering for one tool inside the activity log. Both hooks fall
+ * through to the built-in families when they return `undefined`, so an
+ * override can adjust just the label or just the panel.
+ */
+interface ThinkChatToolRenderer {
+  /** One-line step label. `null` hides the step from the log. */
+  describe?: (part: ToolUIPart | DynamicToolUIPart) => string | null | undefined;
+  /** Expanded detail under the step. `null` keeps the step a plain row. */
+  panel?: (part: ToolUIPart | DynamicToolUIPart) => React.ReactNode;
+}
+type ThinkChatToolRenderers = Record<string, ThinkChatToolRenderer>;
+interface ThinkChatActivityRendererOptions {
+  /**
+   * Tool names to keep out of activity folding entirely — the run splits
+   * around them and they fall through to your own renderPart / AgentChat's
+   * generic standalone activity row. For tools that should stay in the log
+   * with custom UI, use `toolRenderers` instead.
+   */
+  excludeTools?: readonly string[];
+  /** Per-tool label/panel overrides inside the activity log, keyed by tool name. */
+  toolRenderers?: ThinkChatToolRenderers;
+}
+/**
+ * One-line natural-language label for an activity part ("Ran vp test",
+ * "Fetched developers.cloudflare.com/agents/"); `null` for boundaries that
+ * aren't steps (step-start). Exported so a custom `renderPart` can reuse the
+ * built-in labels for tools it doesn't override.
+ */
+declare function describeThinkChatActivityPart(part: ThinkChatPart, toolRenderers?: ThinkChatToolRenderers): string | null;
+interface ThinkChatActivityProps {
+  /** Render with the log expanded. */
+  defaultOpen?: boolean;
+  parts: readonly ThinkChatPart[];
+  /** Defaults to deriving from part states (reasoning streaming, tool awaiting output). */
+  isStreaming?: boolean;
+  /** Per-tool label/panel overrides, keyed by tool name. */
+  toolRenderers?: ThinkChatToolRenderers;
+}
+/**
+ * One run of agent work as a collapsed Activity block: while streaming the
+ * label shimmers with the live step; settled, it becomes a short summary
+ * ("Thought, read 2 files and ran a command") over an expandable step log
+ * with per-tool panels. Normally reached through `ThinkChat.Messages`;
+ * exported for apps that lay out messages themselves.
+ */
+declare function ThinkChatActivity({
+  parts,
+  defaultOpen,
+  isStreaming,
+  toolRenderers
+}: ThinkChatActivityProps): React.JSX.Element | null;
+/**
+ * Builds a renderPart handler that folds every run of consecutive activity
+ * parts (reasoning + tool calls) into one collapsed Activity box. Everything
+ * is derived from the UIMessage stream: part order, tool states, reasoning
+ * state. Excluded tools split the run and return undefined so your own
+ * renderPart (or AgentChat's generic activity row) takes over for them.
+ */
+declare function createThinkChatActivityRenderer({
+  excludeTools,
+  toolRenderers
+}?: ThinkChatActivityRendererOptions): NonNullable<AgentChatProps["renderPart"]>;
+/** Default activity renderer — `createThinkChatActivityRenderer()` with no overrides. */
+declare const renderThinkChatActivityPart: (context: AgentChatRenderPartContext<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>) => React.ReactNode | undefined;
+//#endregion
+export { ThinkChatActivity, ThinkChatActivityProps, ThinkChatActivityRendererOptions, ThinkChatToolRenderer, ThinkChatToolRenderers, createThinkChatActivityRenderer, describeThinkChatActivityPart, isThinkChatActivityPart, renderThinkChatActivityPart };

package/dist/components/ThinkChatActivity.js

@@ -0,0 +1,429 @@
+import { M as TerminalIcon, N as WarningIcon, P as WrenchIcon, S as MonitorIcon, T as PencilIcon, k as SearchIcon, m as FileIcon, v as InfoIcon, y as LinkIcon } from "../icons-BCNawx-T.js";
+import { Activity, ActivityContent, ActivityItem, ActivityItemGroup, ActivityText, ActivityTrigger } from "./Activity.js";
+import { ThinkChatContext } from "./ThinkChatContext.js";
+import { displayUrl, isBrowserToolPart, isExecuteToolPart, isFetchToolPart, isPartFailed, isPartWorking, isSkillToolPart, isThinkChatActivityPart, isWorkspaceToolPart } from "./ThinkChatToolParts.js";
+import { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel } from "./ThinkChatToolPanels.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { getToolName, isReasoningUIPart, isToolUIPart } from "ai";
+//#region src/components/ThinkChatActivity.tsx
+function summarizeToolInput(input) {
+	if (!input || typeof input !== "object") return null;
+	for (const value of Object.values(input)) if (typeof value === "string" && value.trim()) {
+		const line = value.trim().split("\n", 1)[0] ?? "";
+		return line.length > 64 ? `${line.slice(0, 64)}…` : line;
+	}
+	return null;
+}
+const HTTP_URL_PATTERN = /https?:\/\/[^\s"'<>)}\]]+/i;
+function firstHttpUrl(value) {
+	const text = typeof value === "string" ? value : JSON.stringify(value) ?? "";
+	const raw = HTTP_URL_PATTERN.exec(text)?.[0]?.replace(/[.,;:!?]+$/, "");
+	if (!raw) return null;
+	try {
+		return new URL(raw).href;
+	} catch {
+		return null;
+	}
+}
+function ActivityFavicon({ url }) {
+	const src = faviconHref(url);
+	const [failed, setFailed] = React.useState(false);
+	React.useEffect(() => setFailed(false), [src]);
+	if (!src || failed) return /* @__PURE__ */ jsx(LinkIcon, {});
+	return /* @__PURE__ */ jsx("img", {
+		className: "activity__favicon",
+		src,
+		alt: "",
+		loading: "lazy",
+		decoding: "async",
+		onError: () => setFailed(true)
+	});
+}
+function faviconHref(url) {
+	try {
+		return new URL("/favicon.ico", url).href;
+	} catch {
+		return null;
+	}
+}
+function ActivityKindIcon({ kind }) {
+	switch (kind) {
+		case "thought": return /* @__PURE__ */ jsx(InfoIcon, {});
+		case "read": return /* @__PURE__ */ jsx(FileIcon, {});
+		case "edit": return /* @__PURE__ */ jsx(PencilIcon, {});
+		case "search": return /* @__PURE__ */ jsx(SearchIcon, {});
+		case "web": return /* @__PURE__ */ jsx(LinkIcon, {});
+		case "command": return /* @__PURE__ */ jsx(TerminalIcon, {});
+		case "browser": return /* @__PURE__ */ jsx(MonitorIcon, {});
+		case "tool": return /* @__PURE__ */ jsx(WrenchIcon, {});
+	}
+}
+function genericToolLabels(name, hasUrl) {
+	const normalized = name.toLowerCase();
+	if (normalized.includes("grep") || normalized.includes("find") || normalized.includes("code")) return {
+		working: "Searching code",
+		done: "Searched code",
+		failed: "Code search failed",
+		summary: "searched code",
+		icon: "search"
+	};
+	if (normalized.includes("search") || normalized.includes("web") || normalized.includes("browser") || normalized.includes("google")) return {
+		working: "Searching the web",
+		done: "Searched the web",
+		failed: "Web search failed",
+		summary: "searched the web",
+		icon: "web"
+	};
+	if (hasUrl || normalized.includes("fetch") || normalized.includes("http") || normalized.includes("url")) return {
+		working: "Reading a URL",
+		done: "Read a URL",
+		failed: "URL read failed",
+		summary: "read a URL",
+		icon: "web"
+	};
+	if (normalized.includes("edit") || normalized.includes("write") || normalized.includes("delete") || normalized.includes("patch") || normalized.includes("apply") || normalized.includes("create") || normalized.includes("update")) return {
+		working: "Editing files",
+		done: "Edited files",
+		failed: "Edit failed",
+		summary: "edited files",
+		icon: "edit"
+	};
+	if (normalized.includes("exec") || normalized.includes("bash") || normalized.includes("shell") || normalized.includes("terminal") || normalized.includes("command")) return {
+		working: "Running a command",
+		done: "Ran a command",
+		failed: "Command failed",
+		summary: "ran a command",
+		icon: "command"
+	};
+	if (normalized.includes("read") || normalized.includes("open") || normalized.includes("list") || normalized.includes("file")) return {
+		working: "Reading files",
+		done: "Read files",
+		failed: "Read failed",
+		summary: "read files",
+		icon: "read"
+	};
+	return {
+		working: "Using a tool",
+		done: "Used a tool",
+		failed: "Tool failed",
+		summary: "used a tool",
+		icon: "tool"
+	};
+}
+function describeGenericToolPart(part) {
+	const labels = genericToolLabels(getToolName(part), activityPartUrl(part) !== null);
+	const label = isPartFailed(part) ? labels.failed : isPartWorking(part) ? labels.working : labels.done;
+	const detail = summarizeToolInput(part.input);
+	return detail ? `${label} · ${detail}` : label;
+}
+function activityPartUrl(part) {
+	if (isFetchToolPart(part)) return firstHttpUrl(part.input?.url ?? part.input?.path);
+	if (isBrowserToolPart(part) && part.type !== "tool-browser_execute") return firstHttpUrl(part.input?.url);
+	if (isToolUIPart(part) && !isExecuteToolPart(part)) return firstHttpUrl(part.input) ?? (part.state === "output-available" ? firstHttpUrl(part.output) : null);
+	return null;
+}
+function activityPartIconKind(part) {
+	if (isReasoningUIPart(part)) return "thought";
+	if (isWorkspaceToolPart(part)) switch (part.type) {
+		case "tool-read":
+		case "tool-list": return "read";
+		case "tool-write":
+		case "tool-edit":
+		case "tool-delete": return "edit";
+		case "tool-find":
+		case "tool-grep": return "search";
+		case "tool-bash": return "command";
+	}
+	if (isSkillToolPart(part)) return "tool";
+	if (isFetchToolPart(part)) return "web";
+	if (isBrowserToolPart(part)) return part.type === "tool-browser_execute" ? "browser" : "web";
+	if (isExecuteToolPart(part)) return "command";
+	if (isToolUIPart(part)) return genericToolLabels(getToolName(part), activityPartUrl(part) !== null).icon;
+	return "tool";
+}
+function activityPartIcon(part) {
+	const url = activityPartUrl(part);
+	return url ? /* @__PURE__ */ jsx(ActivityFavicon, { url }) : /* @__PURE__ */ jsx(ActivityKindIcon, { kind: activityPartIconKind(part) });
+}
+function activitySummaryIcon(parts) {
+	if (parts.find((part) => isToolUIPart(part) && isPartFailed(part))) return /* @__PURE__ */ jsx(WarningIcon, {});
+	const representative = parts.find((part) => activityPartIconKind(part) === "edit") ?? parts.find((part) => activityPartUrl(part)) ?? parts.find((part) => describeThinkChatActivityPart(part));
+	return representative ? activityPartIcon(representative) : /* @__PURE__ */ jsx(ActivityKindIcon, { kind: "tool" });
+}
+/**
+* One-line natural-language label for an activity part ("Ran vp test",
+* "Fetched developers.cloudflare.com/agents/"); `null` for boundaries that
+* aren't steps (step-start). Exported so a custom `renderPart` can reuse the
+* built-in labels for tools it doesn't override.
+*/
+function describeThinkChatActivityPart(part, toolRenderers) {
+	if (isToolUIPart(part)) {
+		const custom = toolRenderers?.[getToolName(part)]?.describe?.(part);
+		if (custom !== void 0) return custom;
+	}
+	if (isReasoningUIPart(part)) {
+		const snippet = summarizeToolInput({ text: part.text });
+		const label = part.state === "streaming" ? "Thinking…" : "Thought";
+		return snippet ? `${label} · ${snippet}` : label;
+	}
+	if (isWorkspaceToolPart(part)) return describeWorkspaceToolPart(part);
+	if (isSkillToolPart(part)) return describeSkillToolPart(part);
+	if (isFetchToolPart(part)) return describeFetchToolPart(part);
+	if (isBrowserToolPart(part)) return describeBrowserToolPart(part);
+	if (isExecuteToolPart(part)) return describeExecuteToolPart(part);
+	if (isToolUIPart(part)) return describeGenericToolPart(part);
+	return null;
+}
+function basename(path) {
+	return path?.split("/").filter(Boolean).at(-1) ?? null;
+}
+function describeWorkspaceToolPart(part) {
+	const working = isPartWorking(part);
+	const failed = isPartFailed(part);
+	if (part.type === "tool-bash") {
+		const command = part.input?.script?.trim() ?? "";
+		if (failed) return command ? `Command failed · ${command}` : "Command failed";
+		const verb = working ? "Running" : "Ran";
+		return command ? `${verb} ${command}` : `${verb} a command`;
+	}
+	const label = (() => {
+		switch (part.type) {
+			case "tool-read": return `${working ? "Reading" : "Read"} ${basename(part.input?.path) ?? "a file"}`;
+			case "tool-write": return `${working ? "Writing" : "Wrote"} ${basename(part.input?.path) ?? "a file"}`;
+			case "tool-edit": return `${working ? "Editing" : "Edited"} ${basename(part.input?.path) ?? "a file"}`;
+			case "tool-delete": return `${working ? "Deleting" : "Deleted"} ${part.input?.path || "a file"}`;
+			case "tool-list": {
+				const path = part.input?.path;
+				return `${working ? "Listing" : "Listed"} ${path && path !== "/" ? path : "files"}`;
+			}
+			case "tool-find": return `${working ? "Searching" : "Searched"} for ${part.input?.pattern || "files"}`;
+			case "tool-grep": return `${working ? "Searching" : "Searched"} for ${part.input?.query || "text"}`;
+		}
+	})();
+	return failed ? `${label} · failed` : label;
+}
+function describeSkillToolPart(part) {
+	const working = isPartWorking(part);
+	const failed = isPartFailed(part);
+	const label = (() => {
+		switch (part.type) {
+			case "tool-activate_skill": {
+				const name = part.input?.name;
+				return `${working ? "Using" : "Used"} ${name ? `the ${name} skill` : "a skill"}`;
+			}
+			case "tool-read_skill_resource": return `${working ? "Reading" : "Read"} ${part.input?.path ?? "a skill resource"}`;
+			case "tool-run_skill_script": return `${working ? "Running" : "Ran"} ${part.input?.path ?? "a skill script"}`;
+		}
+	})();
+	return failed ? `${label} · failed` : label;
+}
+function describeBrowserToolPart(part) {
+	const working = isPartWorking(part);
+	const failed = isPartFailed(part);
+	if (part.type === "tool-browser_execute") {
+		const output = part.state === "output-available" ? part.output : void 0;
+		if (failed || output?.status === "error") return "Browser automation failed";
+		if (output?.status === "paused") return "Browser waiting for approval";
+		return working ? "Using the browser" : "Used the browser";
+	}
+	const page = displayUrl(part.input?.url) || "a page";
+	const label = (() => {
+		switch (part.type) {
+			case "tool-browser_extract": return `${working ? "Extracting" : "Extracted"} data from ${page}`;
+			case "tool-browser_links": return `${working ? "Listing" : "Listed"} links on ${page}`;
+			case "tool-browser_scrape": return `${working ? "Scraping" : "Scraped"} ${page}`;
+			default: return `${working ? "Browsing" : "Browsed"} ${page}`;
+		}
+	})();
+	return failed ? `${label} · failed` : label;
+}
+function describeExecuteToolPart(part) {
+	const output = part.state === "output-available" ? part.output : void 0;
+	if (isPartFailed(part) || output?.status === "error") return "Code failed";
+	if (output?.status === "paused") return "Code waiting for approval";
+	const label = isPartWorking(part) ? "Running code" : "Ran code";
+	const snippet = summarizeToolInput(part.input);
+	return snippet ? `${label} · ${snippet}` : label;
+}
+function describeFetchToolPart(part) {
+	const target = part.input?.url ?? part.input?.path ?? "";
+	const output = part.state === "output-available" ? part.output : void 0;
+	if (isPartFailed(part) || output?.ok === false) return target ? `Fetch failed · ${target}` : "Fetch failed";
+	const verb = isPartWorking(part) ? "Fetching" : "Fetched";
+	return target ? `${verb} ${target}` : `${verb} a URL`;
+}
+function summarizeActivitySteps(parts) {
+	const byTool = /* @__PURE__ */ new Map();
+	const genericSegments = /* @__PURE__ */ new Set();
+	const skillNames = /* @__PURE__ */ new Set();
+	let thoughts = 0;
+	let skillParts = 0;
+	let fetches = 0;
+	let browses = 0;
+	let codeRuns = 0;
+	for (const part of parts) if (isReasoningUIPart(part)) thoughts++;
+	else if (isWorkspaceToolPart(part)) {
+		const name = getToolName(part);
+		byTool.set(name, (byTool.get(name) ?? 0) + 1);
+	} else if (isSkillToolPart(part)) {
+		skillParts++;
+		if (typeof part.input?.name === "string") skillNames.add(part.input.name);
+	} else if (isFetchToolPart(part)) fetches++;
+	else if (isBrowserToolPart(part)) browses++;
+	else if (isExecuteToolPart(part)) codeRuns++;
+	else if (isToolUIPart(part)) genericSegments.add(genericToolLabels(getToolName(part), activityPartUrl(part) !== null).summary);
+	const count = (name) => byTool.get(name) ?? 0;
+	const files = (n) => n === 1 ? "a file" : `${n} files`;
+	const reads = count("read");
+	const edits = count("edit") + count("write");
+	const deletes = count("delete");
+	const commands = count("bash");
+	const segments = [];
+	if (thoughts > 0) segments.push("thought");
+	if (skillParts > 0) segments.push(skillNames.size === 1 ? `used the ${[...skillNames][0]} skill` : skillNames.size > 1 ? `used ${skillNames.size} skills` : "used a skill");
+	if (reads > 0) segments.push(`read ${files(reads)}`);
+	if (edits > 0) segments.push(`edited ${files(edits)}`);
+	if (deletes > 0) segments.push(`deleted ${files(deletes)}`);
+	if (count("find") + count("grep") > 0) segments.push("searched code");
+	if (count("list") > 0) segments.push("listed files");
+	if (fetches > 0) segments.push(fetches === 1 ? "fetched a URL" : `fetched ${fetches} URLs`);
+	if (browses > 0) segments.push("used the browser");
+	if (codeRuns > 0) segments.push("ran code");
+	if (commands > 0) segments.push(commands === 1 ? "ran a command" : `ran ${commands} commands`);
+	for (const segment of [
+		"edited files",
+		"searched code",
+		"searched the web",
+		"read a URL",
+		"ran a command",
+		"read files",
+		"used a tool"
+	]) if (genericSegments.has(segment)) segments.push(segment);
+	if (segments.length === 0) return "Worked";
+	const top = segments.slice(0, 3);
+	const joined = top.length === 1 ? top[0] : `${top.slice(0, -1).join(", ")} and ${top.at(-1)}`;
+	return joined.charAt(0).toUpperCase() + joined.slice(1);
+}
+/**
+* One run of agent work as a collapsed Activity block: while streaming the
+* label shimmers with the live step; settled, it becomes a short summary
+* ("Thought, read 2 files and ran a command") over an expandable step log
+* with per-tool panels. Normally reached through `ThinkChat.Messages`;
+* exported for apps that lay out messages themselves.
+*/
+function ThinkChatActivity({ parts, defaultOpen, isStreaming, toolRenderers }) {
+	const steps = parts.flatMap((part, index) => {
+		const text = describeThinkChatActivityPart(part, toolRenderers);
+		if (!text) return [];
+		return [{
+			key: isToolUIPart(part) ? part.toolCallId : `${part.type}-${index}`,
+			text,
+			part
+		}];
+	});
+	if (steps.length === 0) return null;
+	const streaming = isStreaming ?? parts.some(isPartWorking);
+	const settledLabel = summarizeActivitySteps(parts);
+	const latest = steps.at(-1);
+	return /* @__PURE__ */ jsxs(Activity, {
+		isStreaming: streaming,
+		defaultOpen,
+		children: [/* @__PURE__ */ jsx(ActivityTrigger, {
+			icon: streaming && latest ? activityPartIcon(latest.part) : activitySummaryIcon(parts),
+			label: streaming && latest ? latest.text : settledLabel
+		}), /* @__PURE__ */ jsx(ActivityContent, { children: steps.map((step) => /* @__PURE__ */ jsx(ThinkChatActivityStep, {
+			text: step.text,
+			part: step.part,
+			toolRenderers
+		}, step.key)) })]
+	});
+}
+function ThinkChatActivityStep({ text, part, toolRenderers }) {
+	const icon = activityPartIcon(part);
+	if (isToolUIPart(part)) {
+		const customPanel = toolRenderers?.[getToolName(part)]?.panel?.(part);
+		if (customPanel === null) return /* @__PURE__ */ jsx(ActivityItem, {
+			icon,
+			children: text
+		});
+		if (customPanel !== void 0) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+			label: text,
+			icon,
+			children: customPanel
+		});
+	}
+	if (isReasoningUIPart(part) && part.text.trim()) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ActivityText, { children: part.text })
+	});
+	if (isWorkspaceToolPart(part) && part.type !== "tool-delete") return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ThinkChatWorkspacePanel, { part })
+	});
+	if (isSkillToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ThinkChatSkillPanel, { part })
+	});
+	if (isFetchToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ThinkChatFetchPanel, { part })
+	});
+	if (isBrowserToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ThinkChatBrowserPanel, { part })
+	});
+	if (isExecuteToolPart(part)) return /* @__PURE__ */ jsx(ActivityItemGroup, {
+		label: text,
+		icon,
+		children: /* @__PURE__ */ jsx(ThinkChatExecutePanel, { part })
+	});
+	return /* @__PURE__ */ jsx(ActivityItem, {
+		icon,
+		children: text
+	});
+}
+function ThinkChatActivityGroup({ message, parts, isTrailing, toolRenderers }) {
+	const chat = React.useContext(ThinkChatContext);
+	const chatStillWorking = isTrailing && Boolean(chat?.isStreaming) && chat?.messages.at(-1)?.id === message.id;
+	return /* @__PURE__ */ jsx(ThinkChatActivity, {
+		parts,
+		isStreaming: parts.some(isPartWorking) || chatStillWorking,
+		toolRenderers
+	});
+}
+/**
+* Builds a renderPart handler that folds every run of consecutive activity
+* parts (reasoning + tool calls) into one collapsed Activity box. Everything
+* is derived from the UIMessage stream: part order, tool states, reasoning
+* state. Excluded tools split the run and return undefined so your own
+* renderPart (or AgentChat's generic activity row) takes over for them.
+*/
+function createThinkChatActivityRenderer({ excludeTools, toolRenderers } = {}) {
+	const excluded = excludeTools?.length ? new Set(excludeTools) : void 0;
+	const isActivity = (part) => isThinkChatActivityPart(part, excluded);
+	return (context) => {
+		const { message, part, partIndex } = context;
+		if (!isActivity(part)) return void 0;
+		let start = partIndex;
+		while (start > 0 && isActivity(message.parts[start - 1])) start--;
+		if (partIndex !== start) return null;
+		let end = partIndex;
+		while (end + 1 < message.parts.length && isActivity(message.parts[end + 1])) end++;
+		return /* @__PURE__ */ jsx(ThinkChatActivityGroup, {
+			message,
+			parts: message.parts.slice(start, end + 1),
+			isTrailing: end === message.parts.length - 1,
+			toolRenderers
+		});
+	};
+}
+/** Default activity renderer — `createThinkChatActivityRenderer()` with no overrides. */
+const renderThinkChatActivityPart = createThinkChatActivityRenderer();
+//#endregion
+export { ThinkChatActivity, createThinkChatActivityRenderer, describeThinkChatActivityPart, isThinkChatActivityPart, renderThinkChatActivityPart };

package/dist/components/ThinkChatContext.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { UIMessage } from "ai";
+import { useAgentChat } from "@cloudflare/think/react";
+
+//#region src/components/ThinkChatContext.d.ts
+type ThinkChatValue = ReturnType<typeof useAgentChat<unknown, UIMessage>>;
+declare const ThinkChatContext: React.Context<(Omit<import("@ai-sdk/react").UseChatHelpers<UIMessage<unknown, import("ai").UIDataTypes, import("ai").UITools>>, "addToolOutput"> & {
+  clearHistory: () => void;
+  addToolOutput: (opts: {
+    toolCallId: string;
+    toolName?: string;
+    output?: unknown;
+    state?: "output-available" | "output-error";
+    errorText?: string;
+  }) => void;
+  isServerStreaming: boolean;
+  isStreaming: boolean;
+  isRecovering: boolean;
+  isToolContinuation: boolean;
+  connectionError: (Error & {
+    code: number;
+    reason: string;
+    wasClean: boolean;
+  }) | null;
+}) | null>;
+declare function useThinkChatContext(component: string): ThinkChatValue;
+//#endregion
+export { ThinkChatContext, ThinkChatValue, useThinkChatContext };

package/dist/components/ThinkChatContext.js

@@ -0,0 +1,10 @@
+import * as React from "react";
+//#region src/components/ThinkChatContext.ts
+const ThinkChatContext = React.createContext(null);
+function useThinkChatContext(component) {
+	const context = React.useContext(ThinkChatContext);
+	if (!context) throw new Error(`${component} must be used inside <ThinkChat.Provider> or <ThinkChat.Root>.`);
+	return context;
+}
+//#endregion
+export { ThinkChatContext, useThinkChatContext };

package/dist/components/ThinkChatToolPanels.d.ts

@@ -0,0 +1,39 @@
+import { i as SkillToolPart, l as WorkspaceToolPart, n as ExecuteToolPart, r as FetchToolPart, t as BrowserToolPart } from "../ThinkChatToolParts-DnUiZgCC.js";
+import * as React from "react";
+
+//#region src/components/ThinkChatToolPanels.d.ts
+/** Default panels for the Think workspace tools, Claude Code-style: read/write
+    show the file with line numbers, edit shows a mini diff, list/find/grep
+    show their result lists, bash gets the shell panel. Everything is typed by
+    the upstream tool contract. */
+declare function ThinkChatWorkspacePanel({
+  part
+}: {
+  part: WorkspaceToolPart;
+}): React.JSX.Element | null;
+/** Skill panels show what the model actually received: the activated skill's
+    body, the resource text, or the script result. */
+declare function ThinkChatSkillPanel({
+  part
+}: {
+  part: SkillToolPart;
+}): React.JSX.Element;
+declare function ThinkChatFetchPanel({
+  part
+}: {
+  part: FetchToolPart;
+}): React.JSX.Element;
+/** The codemode execute tool as an activity panel: highlighted TypeScript
+    plus logs, result, and the paused pending-approval list. */
+declare function ThinkChatExecutePanel({
+  part
+}: {
+  part: ExecuteToolPart;
+}): React.JSX.Element;
+declare function ThinkChatBrowserPanel({
+  part
+}: {
+  part: BrowserToolPart;
+}): React.JSX.Element;
+//#endregion
+export { ThinkChatBrowserPanel, ThinkChatExecutePanel, ThinkChatFetchPanel, ThinkChatSkillPanel, ThinkChatWorkspacePanel };