@overmux/pi 0.0.1

package/dist/react.js

@@ -0,0 +1,796 @@
+import "./styles.css";
+import { PierrePatchDiff } from "@overmux/git/react";
+import { ChevronRight, Send, Square } from "lucide-react";
+import { useCallback, useEffect, useId, useLayoutEffect, useRef, useState } from "react";
+import ReactMarkdown from "react-markdown";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/react.tsx
+const contextWindowOverrides = /* @__PURE__ */ new Map([
+	["openai-codex/gpt-5.6-luna", 372e3],
+	["openai-codex/gpt-5.6-sol", 372e3],
+	["openai-codex/gpt-5.6-terra", 372e3]
+]);
+const formatTokenCount = (tokens) => tokens < 1e3 ? `${tokens}` : `${(tokens / 1e3).toFixed(1)}k`;
+const contextUsageLabel = ({ contextUsage, model }) => {
+	if (!contextUsage) return;
+	const contextWindow = contextWindowOverrides.get(`${model?.provider}/${model?.id}`) ?? contextUsage.contextWindow;
+	return `ctx ${formatTokenCount(contextUsage.tokens)}/${formatTokenCount(contextWindow)} ${(contextUsage.tokens / contextWindow * 100).toFixed(1)}%`;
+};
+const thinkingLevels = [
+	"off",
+	"minimal",
+	"low",
+	"medium",
+	"high",
+	"xhigh",
+	"max"
+];
+const PiConversationMetadata = ({ busy, metadata, setModel, setThinkingLevel }) => {
+	const [changing, setChanging] = useState(false);
+	const [error, setError] = useState("");
+	const update = async (action) => {
+		setChanging(true);
+		try {
+			await action();
+			setError("");
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			setChanging(false);
+		}
+	};
+	const disabled = busy || changing;
+	const currentModel = metadata.model;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "om-pi-conversation-metadata om-pi-muted",
+		children: [
+			currentModel && metadata.modelOptions?.length && setModel ? /* @__PURE__ */ jsx("select", {
+				"aria-label": "Pi model",
+				className: "om-pi-metadata-select",
+				disabled,
+				onChange: (event) => void update(() => setModel(JSON.parse(event.target.value))),
+				value: JSON.stringify({
+					provider: currentModel.provider,
+					id: currentModel.id
+				}),
+				children: metadata.modelOptions.map((model) => /* @__PURE__ */ jsx("option", {
+					value: JSON.stringify({
+						provider: model.provider,
+						id: model.id
+					}),
+					children: model.id
+				}, `${model.provider}\0${model.id}`))
+			}) : /* @__PURE__ */ jsx("span", { children: currentModel?.id ?? "no-model" }),
+			/* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				children: " · "
+			}),
+			setThinkingLevel ? /* @__PURE__ */ jsx("select", {
+				"aria-label": "Pi thinking level",
+				className: "om-pi-metadata-select",
+				disabled,
+				onChange: (event) => void update(() => setThinkingLevel(event.target.value)),
+				value: metadata.thinkingLevel,
+				children: thinkingLevels.map((level) => /* @__PURE__ */ jsx("option", {
+					value: level,
+					children: level
+				}, level))
+			}) : /* @__PURE__ */ jsx("span", { children: metadata.thinkingLevel }),
+			contextUsageLabel(metadata) ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				children: " · "
+			}), /* @__PURE__ */ jsx("span", { children: contextUsageLabel(metadata) })] }) : null,
+			error ? /* @__PURE__ */ jsx("span", {
+				className: "om-pi-metadata-error",
+				role: "alert",
+				children: error
+			}) : null
+		]
+	});
+};
+const languageLoaders = {
+	bash: () => import("@shikijs/langs/bash"),
+	css: () => import("@shikijs/langs/css"),
+	diff: () => import("@shikijs/langs/diff"),
+	html: () => import("@shikijs/langs/html"),
+	javascript: () => import("@shikijs/langs/javascript"),
+	json: () => import("@shikijs/langs/json"),
+	markdown: () => import("@shikijs/langs/markdown"),
+	nix: () => import("@shikijs/langs/nix"),
+	typescript: () => import("@shikijs/langs/typescript"),
+	tsx: () => import("@shikijs/langs/tsx"),
+	yaml: () => import("@shikijs/langs/yaml")
+};
+const languageAliases = {
+	js: "javascript",
+	md: "markdown",
+	sh: "bash",
+	shell: "bash",
+	ts: "typescript",
+	yml: "yaml"
+};
+const maxHighlightedCodeEntries = 64;
+let highlighterPromise;
+const highlightedCode = /* @__PURE__ */ new Map();
+const loadHighlighter = () => {
+	if (!highlighterPromise) highlighterPromise = Promise.all([
+		import("shiki/core"),
+		import("shiki/engine/javascript"),
+		import("@shikijs/themes/tokyo-night")
+	]).then(async ([core, engine, theme]) => core.createHighlighterCore({
+		engine: engine.createJavaScriptRegexEngine(),
+		langs: await Promise.all(Object.values(languageLoaders).map(async (loadLanguage) => loadLanguage())),
+		themes: [theme.default]
+	}));
+	return highlighterPromise;
+};
+loadHighlighter();
+const highlighted = (code, language) => {
+	const key = `${language}\u0000${code}`;
+	const cached = highlightedCode.get(key);
+	if (cached) return cached;
+	const next = loadHighlighter().then((highlighter) => highlighter.codeToTokens(code, {
+		lang: language,
+		theme: "tokyo-night"
+	}).tokens);
+	highlightedCode.set(key, next);
+	if (highlightedCode.size > maxHighlightedCodeEntries) {
+		const oldest = highlightedCode.keys().next().value;
+		if (oldest) highlightedCode.delete(oldest);
+	}
+	return next;
+};
+const textOf = (block) => block.text ?? block.thinking ?? (typeof block.data === "string" ? block.data : "");
+const formatted = (value) => {
+	if (typeof value === "string") try {
+		return JSON.stringify(JSON.parse(value), null, 2);
+	} catch {
+		return value;
+	}
+	try {
+		return JSON.stringify(value, null, 2) ?? "";
+	} catch {
+		return String(value);
+	}
+};
+const codeLanguage = (className) => {
+	const language = /language-([^\s]+)/.exec(className ?? "")?.[1]?.toLowerCase();
+	if (!language) return;
+	const normalized = languageAliases[language] ?? language;
+	return Object.hasOwn(languageLoaders, normalized) ? normalized : void 0;
+};
+const FencedCode = ({ children, className, node: _node, ...props }) => {
+	const code = String(children).replace(/\n$/, "");
+	const language = codeLanguage(className);
+	const highlightKey = language ? `${language}\u0000${code}` : void 0;
+	const [highlightedState, setHighlightedState] = useState();
+	const lines = highlightedState && highlightedState.key === highlightKey ? highlightedState.lines : void 0;
+	useEffect(() => {
+		if (!language || !highlightKey) return;
+		let active = true;
+		highlighted(code, language).then((value) => {
+			if (active) setHighlightedState({
+				key: highlightKey,
+				lines: value
+			});
+		});
+		return () => {
+			active = false;
+		};
+	}, [
+		code,
+		highlightKey,
+		language
+	]);
+	if (!language || !lines) return /* @__PURE__ */ jsx("code", {
+		className,
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsx("code", {
+		className: "om-pi-code-highlighted",
+		...props,
+		children: lines.map((line, index) => /* @__PURE__ */ jsxs("span", {
+			className: "om-pi-code-line",
+			children: [line.map((token, tokenIndex) => /* @__PURE__ */ jsx("span", {
+				style: { color: token.color },
+				children: token.content
+			}, tokenIndex)), index < lines.length - 1 ? "\n" : null]
+		}, index))
+	});
+};
+const markdownComponents = { code: FencedCode };
+const MarkdownPart = ({ block, subdued = false }) => /* @__PURE__ */ jsx("div", {
+	className: ["om-pi-markdown", subdued && "om-pi-muted"].filter(Boolean).join(" "),
+	children: /* @__PURE__ */ jsx(ReactMarkdown, {
+		components: markdownComponents,
+		children: textOf(block)
+	})
+});
+const preview = (value, maxLength = 120) => value.length > maxLength ? `${value.slice(0, maxLength - 1)}…` : value;
+const bounded = (value, maxLines = 200, maxLength = 2e4) => {
+	const lines = value.split("\n").slice(0, maxLines).join("\n");
+	return lines.length > maxLength ? `${lines.slice(0, maxLength - 1)}…` : lines;
+};
+const detailsRecord = (details) => typeof details === "object" && details !== null ? details : void 0;
+const resultText = (result) => result?.content.map((block) => block.text ?? block.thinking ?? block.data ?? "").filter(Boolean).join("\n") ?? "";
+const truncationSummary = (details) => {
+	const truncation = detailsRecord(details)?.truncation;
+	const record = detailsRecord(truncation);
+	if (!record?.truncated) return;
+	const totalLines = typeof record.totalLines === "number" ? record.totalLines : void 0;
+	const outputLines = typeof record.outputLines === "number" ? record.outputLines : void 0;
+	return totalLines && outputLines ? `${totalLines - outputLines} lines omitted` : "Output truncated";
+};
+const ToolDisclosure = ({ children, collapsible = true, indicator, label, status }) => {
+	const [open, setOpen] = useState(status !== "success");
+	const explicit = useRef(false);
+	useEffect(() => {
+		if (!explicit.current) setOpen(status !== "success");
+	}, [status]);
+	const header = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+		className: `om-pi-tool-status${indicator ? " om-pi-tool-status-label" : ""}`,
+		"aria-label": `Tool ${status}`,
+		children: indicator ?? (status === "success" ? "✓" : status === "error" ? "×" : "●")
+	}), label] });
+	if (!collapsible) return /* @__PURE__ */ jsxs("div", {
+		className: "om-pi-tool-details",
+		"data-om-tool-status": status,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-summary",
+			children: header
+		}), children ? /* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-body",
+			children
+		}) : null]
+	});
+	return /* @__PURE__ */ jsxs("details", {
+		className: "om-pi-tool-details",
+		"data-om-tool-status": status,
+		onToggle: (event) => setOpen(event.currentTarget.open),
+		open,
+		children: [/* @__PURE__ */ jsx("summary", {
+			onClick: () => {
+				explicit.current = true;
+			},
+			children: header
+		}), children ? /* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-body",
+			children
+		}) : null]
+	});
+};
+const ThinkingPart = ({ block, status }) => {
+	const thinking = textOf(block);
+	const [open, setOpen] = useState(status === "pending");
+	const explicit = useRef(false);
+	useEffect(() => {
+		if (!explicit.current) setOpen(status === "pending");
+	}, [status]);
+	return /* @__PURE__ */ jsxs("details", {
+		className: "om-pi-thinking",
+		onToggle: (event) => setOpen(event.currentTarget.open),
+		open,
+		children: [/* @__PURE__ */ jsx("summary", {
+			onClick: () => {
+				explicit.current = true;
+			},
+			children: status === "pending" && thinking ? preview(thinking) : "Thinking…"
+		}), /* @__PURE__ */ jsx("div", {
+			className: "om-pi-content-block",
+			children: /* @__PURE__ */ jsx(MarkdownPart, {
+				block,
+				subdued: true
+			})
+		})]
+	});
+};
+const ImagePart = ({ block }) => /* @__PURE__ */ jsxs("p", {
+	className: "om-pi-muted",
+	children: ["Image attachment ", block.mimeType ?? ""]
+});
+const toolStatus = (tool) => tool.result?.isError ? "error" : tool.result ? "success" : tool.status;
+const argumentsRecord = (arguments_) => typeof arguments_ === "object" && arguments_ !== null ? arguments_ : void 0;
+const stringArgument = (arguments_, name) => {
+	const value = argumentsRecord(arguments_)?.[name];
+	return typeof value === "string" ? value : void 0;
+};
+const numberArgument = (arguments_, name) => {
+	const value = argumentsRecord(arguments_)?.[name];
+	return typeof value === "number" ? value : void 0;
+};
+const Output = ({ result }) => {
+	const content = resultText(result);
+	if (!content && !result?.isError) return null;
+	return /* @__PURE__ */ jsx("pre", {
+		className: result?.isError ? "om-pi-tool-error" : "om-pi-tool-output",
+		children: bounded(content || formatted(result?.details))
+	});
+};
+const toolFrame = ({ result, status }, label, children) => /* @__PURE__ */ jsxs(ToolDisclosure, {
+	label,
+	status,
+	children: [children, /* @__PURE__ */ jsx(Output, { result })]
+});
+const ToolSection = ({ children, defaultOpen, label, status }) => {
+	const shouldOpen = defaultOpen ?? status !== "success";
+	const [open, setOpen] = useState(shouldOpen);
+	const explicit = useRef(false);
+	useEffect(() => {
+		if (!explicit.current) setOpen(shouldOpen);
+	}, [shouldOpen]);
+	return /* @__PURE__ */ jsxs("details", {
+		className: "om-pi-tool-section",
+		"data-om-tool-status": status,
+		onToggle: (event) => setOpen(event.currentTarget.open),
+		open,
+		children: [/* @__PURE__ */ jsxs("summary", {
+			onClick: () => {
+				explicit.current = true;
+			},
+			children: [/* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", { children: label })]
+		}), children ? /* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-body",
+			children
+		}) : null]
+	});
+};
+const BashToolRenderer = (input) => {
+	const command = stringArgument(input.arguments, "command");
+	const truncation = truncationSummary(input.result?.details);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "om-pi-tool-details",
+		"data-om-tool-status": input.status,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "om-pi-tool-kind",
+				children: /* @__PURE__ */ jsx("span", {
+					className: "om-pi-tool-status om-pi-tool-status-label",
+					"aria-label": `Tool ${input.status}`,
+					children: "bash"
+				})
+			}),
+			/* @__PURE__ */ jsx("pre", {
+				className: "om-pi-tool-command",
+				children: /* @__PURE__ */ jsxs("code", { children: ["$ ", command ?? "bash"] })
+			}),
+			/* @__PURE__ */ jsxs(ToolSection, {
+				label: "Logs",
+				status: input.status,
+				children: [truncation ? /* @__PURE__ */ jsx("p", {
+					className: "om-pi-tool-field",
+					children: truncation
+				}) : null, /* @__PURE__ */ jsx(Output, { result: input.result })]
+			})
+		]
+	});
+};
+const BashProcessToolRenderer = (input) => {
+	const action = stringArgument(input.arguments, "action") ?? "bash_process";
+	const pgid = numberArgument(input.arguments, "pgid") ?? stringArgument(input.arguments, "pgid");
+	return toolFrame(input, `${action}${pgid === void 0 ? "" : ` · ${pgid}`}`);
+};
+const languageForPath = (path) => {
+	const extension = path?.split(".").at(-1)?.toLowerCase();
+	return extension ? languageAliases[extension] ?? extension : "";
+};
+const ReadToolRenderer = (input) => {
+	const path = stringArgument(input.arguments, "path");
+	const offset = numberArgument(input.arguments, "offset") ?? 1;
+	const limit = numberArgument(input.arguments, "limit");
+	const range = limit === void 0 ? `:${offset}` : `:${offset}-${offset + limit - 1}`;
+	const content = resultText(input.result);
+	const language = languageForPath(path);
+	return /* @__PURE__ */ jsxs(ToolDisclosure, {
+		indicator: "read",
+		label: `${path ?? "read"}${range}`,
+		status: input.status,
+		children: [input.result?.isError ? /* @__PURE__ */ jsx(Output, { result: input.result }) : null, content && !input.result?.isError ? /* @__PURE__ */ jsx(MarkdownPart, {
+			block: {
+				text: `\`\`\`${language}\n${bounded(content)}\n\`\`\``,
+				type: "text"
+			},
+			subdued: true
+		}) : null]
+	});
+};
+const editResultDetails = (details) => {
+	const record = detailsRecord(details);
+	return typeof record?.diff === "string" ? {
+		diff: record.diff,
+		patch: typeof record.patch === "string" ? record.patch : void 0
+	} : void 0;
+};
+const EditToolRenderer = (input) => {
+	const details = editResultDetails(input.result?.details);
+	const diff = details?.diff;
+	const label = /* @__PURE__ */ jsx("code", {
+		className: "om-pi-tool-path",
+		children: stringArgument(input.arguments, "path") ?? "edit"
+	});
+	return /* @__PURE__ */ jsxs(ToolDisclosure, {
+		collapsible: false,
+		indicator: "edit",
+		label,
+		status: input.status,
+		children: [diff ? /* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-diff",
+			children: details?.patch ? /* @__PURE__ */ jsx(PierrePatchDiff, {
+				options: { hunkSeparators: "simple" },
+				patch: details.patch
+			}) : /* @__PURE__ */ jsx("pre", { children: bounded(diff) })
+		}) : null, input.result?.isError ? /* @__PURE__ */ jsx(ToolSection, {
+			defaultOpen: false,
+			label: "Error",
+			status: input.status,
+			children: /* @__PURE__ */ jsx(Output, { result: input.result })
+		}) : null]
+	});
+};
+const newFilePatch = (path, content) => {
+	const safePath = path.replace(/[\r\n]/g, "_");
+	const displayed = bounded(content);
+	const hasTrailingNewline = displayed.endsWith("\n");
+	const lines = displayed ? displayed.split("\n") : [];
+	const additions = hasTrailingNewline ? lines.slice(0, -1) : lines;
+	return `diff --git a/${safePath} b/${safePath}\nnew file mode 100644\n--- /dev/null\n+++ b/${safePath}\n${additions.length ? `@@ -0,0 +1,${additions.length} @@\n${additions.map((line) => `+${line}`).join("\n")}${hasTrailingNewline ? "\n" : ""}` : ""}`;
+};
+const WriteToolRenderer = (input) => {
+	const path = stringArgument(input.arguments, "path") ?? "write";
+	const content = stringArgument(input.arguments, "content");
+	return /* @__PURE__ */ jsxs(ToolDisclosure, {
+		collapsible: false,
+		indicator: "write",
+		label: /* @__PURE__ */ jsx("code", {
+			className: "om-pi-tool-path",
+			children: path
+		}),
+		status: input.status,
+		children: [content === void 0 ? null : /* @__PURE__ */ jsx("div", {
+			className: "om-pi-tool-diff",
+			"data-patch": newFilePatch(path, content),
+			children: /* @__PURE__ */ jsx(PierrePatchDiff, {
+				options: { hunkSeparators: "simple" },
+				patch: newFilePatch(path, content)
+			})
+		}), input.result?.isError ? /* @__PURE__ */ jsx(ToolSection, {
+			defaultOpen: false,
+			label: "Error",
+			status: input.status,
+			children: /* @__PURE__ */ jsx(Output, { result: input.result })
+		}) : null]
+	});
+};
+const GenericToolRenderer = (input) => toolFrame(input, input.toolName, input.arguments === void 0 ? null : /* @__PURE__ */ jsx("pre", {
+	className: "om-pi-tool-input",
+	children: formatted(input.arguments)
+}));
+const defaultToolRenderers = {
+	bash: BashToolRenderer,
+	bash_process: BashProcessToolRenderer,
+	edit: EditToolRenderer,
+	read: ReadToolRenderer,
+	write: WriteToolRenderer
+};
+const ToolPart = ({ block, entry, renderers }) => {
+	const knownToolName = block.name ?? entry.toolName;
+	const tool = block.tool ?? { status: "pending" };
+	if (!knownToolName && tool.status === "pending") return /* @__PURE__ */ jsx("p", {
+		className: "om-pi-muted",
+		role: "status",
+		children: "Running tool…"
+	});
+	const toolName = knownToolName ?? "Tool call";
+	return /* @__PURE__ */ jsx(renderers[toolName] ?? GenericToolRenderer, {
+		arguments: block.arguments,
+		result: tool.result,
+		status: toolStatus(tool),
+		toolName
+	});
+};
+const MessagePart = ({ block, entry, renderers }) => {
+	if (block.type === "thinking") return /* @__PURE__ */ jsx(ThinkingPart, {
+		block,
+		status: entry.status
+	});
+	if (block.type === "toolCall") return /* @__PURE__ */ jsx(ToolPart, {
+		block,
+		entry,
+		renderers
+	});
+	if (block.type === "image") return /* @__PURE__ */ jsx(ImagePart, { block });
+	return /* @__PURE__ */ jsx(MarkdownPart, { block });
+};
+const roleName = (entry) => {
+	if (entry.role === "toolResult") return entry.toolName ? `${entry.toolName} result` : "Tool result";
+	return entry.role === "user" ? "You" : "Pi";
+};
+const PiConversationMessage = ({ className, entry, renderBlock, renderers }) => /* @__PURE__ */ jsxs("article", {
+	"aria-label": `${roleName(entry)} message`,
+	className: ["om-pi-conversation-entry", className].filter(Boolean).join(" "),
+	"data-om-role": entry.role,
+	"data-om-source": entry.source,
+	"data-om-status": entry.status,
+	children: [
+		entry.role === "user" || entry.status !== "complete" ? /* @__PURE__ */ jsxs("header", {
+			className: "om-pi-muted",
+			children: [
+				entry.role === "user" ? /* @__PURE__ */ jsx("span", { children: "You" }) : null,
+				entry.status === "pending" ? /* @__PURE__ */ jsx("span", {
+					role: "status",
+					children: "Streaming…"
+				}) : null,
+				entry.status === "error" ? /* @__PURE__ */ jsx("span", {
+					className: "om-pi-tool-error",
+					children: "Error"
+				}) : null
+			]
+		}) : null,
+		/* @__PURE__ */ jsxs("div", {
+			className: "om-pi-content-block",
+			children: [entry.content.map((block, index) => /* @__PURE__ */ jsx("div", { children: renderBlock?.({
+				block,
+				entry,
+				index
+			}) ?? /* @__PURE__ */ jsx(MessagePart, {
+				block,
+				entry,
+				renderers
+			}) }, `${block.type}:${block.id ?? index}`)), !entry.content.length && entry.status === "pending" ? /* @__PURE__ */ jsx("p", {
+				className: "om-pi-muted",
+				role: "status",
+				children: "Waiting for output…"
+			}) : null]
+		}),
+		entry.errorMessage ? /* @__PURE__ */ jsx("p", {
+			className: "om-pi-conversation-error",
+			role: "alert",
+			children: entry.errorMessage
+		}) : null
+	]
+});
+const statusLabel = (status) => {
+	if (status === "busy") return "Pi is working";
+	if (status === "degraded") return "Pi updates are degraded";
+	if (status === "idle") return "Pi is ready";
+	return "Pi is offline";
+};
+const PiMessageComposer = ({ autoFocus = false, available, busy = false, className, sendMessage, stop, style }) => {
+	const messageId = useId();
+	const textareaRef = useRef(null);
+	const [draft, setDraft] = useState("");
+	const [error, setError] = useState("");
+	const [focused, setFocused] = useState(false);
+	const [sending, setSending] = useState();
+	const [stopping, setStopping] = useState(false);
+	const actionsVisible = focused || Boolean(draft);
+	useLayoutEffect(() => {
+		const textarea = textareaRef.current;
+		if (!textarea) return;
+		textarea.style.height = "auto";
+		textarea.style.height = `${Math.min(textarea.scrollHeight, 192)}px`;
+	}, [draft]);
+	useLayoutEffect(() => {
+		if (autoFocus && available) textareaRef.current?.focus();
+	}, [autoFocus, available]);
+	const submit = async (deliverAs) => {
+		const message = draft.trim();
+		if (!message || !available || sending || stopping) return;
+		setSending(deliverAs);
+		try {
+			await sendMessage({
+				deliverAs,
+				message
+			});
+			setDraft("");
+			setError("");
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			setSending(void 0);
+		}
+	};
+	const abort = async () => {
+		if (!available || !busy || !stop || sending || stopping) return;
+		setStopping(true);
+		try {
+			await stop();
+			setError("");
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			setStopping(false);
+		}
+	};
+	const onSubmit = (event) => {
+		event.preventDefault();
+		submit("steer");
+	};
+	const onKeyDown = (event) => {
+		if (event.key !== "Enter" || !event.metaKey && !event.ctrlKey) return;
+		event.preventDefault();
+		submit(busy && event.shiftKey ? "followUp" : "steer");
+	};
+	return /* @__PURE__ */ jsxs("form", {
+		className: ["om-pi-composer", className].filter(Boolean).join(" "),
+		"data-om-pi-composer": true,
+		onSubmit,
+		style,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "om-pi-composer-box",
+			children: [
+				/* @__PURE__ */ jsx("label", {
+					className: "om-pi-visually-hidden",
+					htmlFor: messageId,
+					children: "Message Pi"
+				}),
+				/* @__PURE__ */ jsx("textarea", {
+					className: ["om-pi-composer-textarea", busy && !actionsVisible ? "om-pi-composer-textarea-with-stop" : void 0].filter(Boolean).join(" "),
+					disabled: !available || Boolean(sending) || stopping,
+					id: messageId,
+					onBlur: () => setFocused(false),
+					onChange: (event) => setDraft(event.target.value),
+					onFocus: () => setFocused(true),
+					onKeyDown,
+					placeholder: available ? "Message Pi…" : "Pi is offline",
+					ref: textareaRef,
+					rows: 1,
+					value: draft
+				}),
+				busy && !actionsVisible ? /* @__PURE__ */ jsx("button", {
+					"aria-label": stopping ? "Stopping Pi" : "Stop Pi",
+					className: "om-pi-composer-stop om-pi-composer-stop-inline",
+					disabled: !available || !stop || Boolean(sending) || stopping,
+					onClick: () => void abort(),
+					title: "Stop Pi",
+					type: "button",
+					children: /* @__PURE__ */ jsx(Square, { "aria-hidden": "true" })
+				}) : null,
+				/* @__PURE__ */ jsxs("div", {
+					className: "om-pi-composer-actions",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "om-pi-muted",
+							children: "Ctrl/⌘ Enter · Shift queues"
+						}),
+						busy ? /* @__PURE__ */ jsxs(Fragment, { children: [actionsVisible ? /* @__PURE__ */ jsx("button", {
+							"aria-label": stopping ? "Stopping Pi" : "Stop Pi",
+							className: "om-pi-composer-stop",
+							disabled: !available || !stop || Boolean(sending) || stopping,
+							onClick: () => void abort(),
+							title: "Stop Pi",
+							type: "button",
+							children: /* @__PURE__ */ jsx(Square, { "aria-hidden": "true" })
+						}) : null, /* @__PURE__ */ jsx("button", {
+							"aria-label": "Follow up after the current turn",
+							className: "om-pi-composer-follow-up",
+							disabled: !available || !draft.trim() || Boolean(sending) || stopping,
+							onClick: () => void submit("followUp"),
+							type: "button",
+							children: sending === "followUp" ? "Queueing…" : "Follow up"
+						})] }) : null,
+						/* @__PURE__ */ jsxs("button", {
+							className: "om-pi-composer-send",
+							disabled: !available || !draft.trim() || Boolean(sending) || stopping,
+							type: "submit",
+							children: [/* @__PURE__ */ jsx(Send, { "aria-hidden": "true" }), sending === "steer" ? "Sending…" : "Send"]
+						})
+					]
+				})
+			]
+		}), error ? /* @__PURE__ */ jsx("p", {
+			className: "om-pi-conversation-error",
+			role: "alert",
+			children: error
+		}) : null]
+	});
+};
+const PiConversation = ({ autoFocus = false, conversation, className, classNames = {}, emptyState, renderBlock, renderers, sendMessage, setModel, setThinkingLevel, stop, style }) => {
+	const [snapshot, setSnapshot] = useState();
+	useLayoutEffect(() => conversation.subscribe(setSnapshot), [conversation]);
+	const error = conversation.error?.message;
+	const status = snapshot?.status ?? "offline";
+	const scrollerRef = useRef(null);
+	const followingRef = useRef(true);
+	const [following, setFollowing] = useState(true);
+	const toolRenderers = {
+		...defaultToolRenderers,
+		...renderers
+	};
+	const scrollToLatest = useCallback(() => {
+		const scroller = scrollerRef.current;
+		if (!scroller) return;
+		followingRef.current = true;
+		setFollowing(true);
+		scroller.scrollTop = scroller.scrollHeight;
+	}, []);
+	const updateFollowing = useCallback(() => {
+		const scroller = scrollerRef.current;
+		if (!scroller) return;
+		const next = scroller.scrollHeight - scroller.scrollTop - scroller.clientHeight < 48;
+		followingRef.current = next;
+		setFollowing(next);
+	}, []);
+	useLayoutEffect(() => {
+		if (followingRef.current) scrollToLatest();
+	}, [scrollToLatest, snapshot]);
+	return /* @__PURE__ */ jsxs("section", {
+		"aria-label": "Pi conversation",
+		className: [
+			"om-pi-conversation",
+			className,
+			classNames.root
+		].filter(Boolean).join(" "),
+		"data-om-agent-status": status,
+		"data-om-pi-conversation": true,
+		style,
+		children: [
+			/* @__PURE__ */ jsx("header", {
+				className: ["om-pi-conversation-status", classNames.status].filter(Boolean).join(" "),
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "om-pi-conversation-status-row",
+					children: [/* @__PURE__ */ jsx("strong", { children: "Pi conversation" }), /* @__PURE__ */ jsx("span", {
+						"aria-live": "polite",
+						className: "om-pi-muted",
+						role: "status",
+						children: !snapshot && !error ? "Connecting to Pi…" : statusLabel(status)
+					})]
+				})
+			}),
+			error ? /* @__PURE__ */ jsx("p", {
+				className: "om-pi-conversation-error",
+				role: "alert",
+				children: error
+			}) : null,
+			/* @__PURE__ */ jsx("div", {
+				className: ["om-pi-conversation-scroller", classNames.scroller].filter(Boolean).join(" "),
+				onScroll: updateFollowing,
+				ref: scrollerRef,
+				tabIndex: 0,
+				children: /* @__PURE__ */ jsxs("div", {
+					className: ["om-pi-conversation-content", classNames.content].filter(Boolean).join(" "),
+					children: [
+						snapshot?.entries.map((entry) => /* @__PURE__ */ jsx(PiConversationMessage, {
+							className: ["om-pi-conversation-entry", classNames.entry].filter(Boolean).join(" "),
+							entry,
+							renderBlock,
+							renderers: toolRenderers
+						}, entry.id)),
+						snapshot && !snapshot.entries.length ? emptyState ?? /* @__PURE__ */ jsx("p", {
+							className: "om-pi-muted",
+							children: "No conversation yet."
+						}) : null,
+						!snapshot && error ? /* @__PURE__ */ jsx("p", {
+							className: "om-pi-muted",
+							children: "Conversation unavailable while Pi is offline."
+						}) : null
+					]
+				})
+			}),
+			!following ? /* @__PURE__ */ jsx("button", {
+				className: "om-pi-conversation-jump",
+				onClick: scrollToLatest,
+				type: "button",
+				children: "Jump to latest"
+			}) : null,
+			/* @__PURE__ */ jsx(PiMessageComposer, {
+				autoFocus,
+				available: snapshot?.agentAvailable === true,
+				busy: status === "busy",
+				className: classNames.composer,
+				sendMessage,
+				stop
+			}),
+			snapshot?.sessionMetadata ? /* @__PURE__ */ jsx(PiConversationMetadata, {
+				busy: status === "busy",
+				metadata: snapshot.sessionMetadata,
+				setModel,
+				setThinkingLevel
+			}) : null
+		]
+	});
+};
+//#endregion
+export { PiConversation, PiMessageComposer, defaultToolRenderers };
+
+//# sourceMappingURL=react.js.map