@hachej/boring-agent 0.1.92 → 0.1.94

package/dist/front/index.js

@@ -68,7 +68,7 @@ function rawWorkspaceFileUrl(path, opts) {
 }
 
 // src/front/chat/PiChatPanel.tsx
-import { lazy, Suspense, useCallback as useCallback18, useEffect as useEffect21, useMemo as useMemo13, useRef as useRef17, useState as useState20 } from "react";
+import { lazy, Suspense, useCallback as useCallback18, useEffect as useEffect21, useMemo as useMemo16, useRef as useRef18, useState as useState20 } from "react";
 
 // src/front/ArtifactOpenContext.tsx
 import { createContext, useContext } from "react";
@@ -279,6 +279,7 @@ var builtinCommands = [
   {
     name: "reload",
     description: "Reload agent plugins",
+    clickBehavior: "execute",
     handler(_, ctx) {
       if (ctx.pluginUpdate) return ctx.pluginUpdate.run();
       return ctx.reloadAgentPlugins();
@@ -345,7 +346,7 @@ var lineClass = {
   " ": ""
 };
 var prefixMap = { "+": "+", "-": "-", " ": " " };
-function DiffView({ oldString, newString, path, replaceAll }) {
+function DiffView({ oldString, newString, path, replaceAll, actions }) {
   const [expanded, setExpanded] = useState(false);
   if (oldString === newString) {
     return /* @__PURE__ */ jsx3("div", { "data-testid": "diff-no-change", className: "py-2 italic opacity-60", children: "No changes" });
@@ -355,9 +356,12 @@ function DiffView({ oldString, newString, path, replaceAll }) {
   const collapsed = !expanded && lines.length > COLLAPSE_THRESHOLD;
   const visible = collapsed ? lines.slice(0, COLLAPSE_THRESHOLD) : lines;
   return /* @__PURE__ */ jsxs2("div", { "data-testid": "diff-view", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "px-3 py-1.5 font-[family-name:var(--boring-agent-font-mono,monospace)] text-xs opacity-70", children: [
-      path,
-      replaceAll ? " (replace all)" : ""
+    /* @__PURE__ */ jsxs2("div", { className: "flex min-h-7 items-center justify-between gap-2 px-2 py-0.5 font-[family-name:var(--boring-agent-font-mono,monospace)] text-xs opacity-70", children: [
+      /* @__PURE__ */ jsxs2("span", { className: "min-w-0 truncate", children: [
+        path,
+        replaceAll ? " (replace all)" : ""
+      ] }),
+      actions ? /* @__PURE__ */ jsx3("span", { className: "flex shrink-0 items-center gap-0.5", children: actions }) : null
     ] }),
     /* @__PURE__ */ jsx3("pre", { className: "m-0 overflow-auto py-2 font-[family-name:var(--boring-agent-font-mono,monospace)] text-[0.8125rem] leading-relaxed", children: visible.map((line, i) => /* @__PURE__ */ jsxs2("div", { className: cn("px-3", lineClass[line.type]), children: [
       /* @__PURE__ */ jsx3("span", { className: "inline-block w-[1.5ch] select-none opacity-50", children: prefixMap[line.type] }),
@@ -1263,9 +1267,9 @@ var statusIcons = {
   "output-error": /* @__PURE__ */ jsx9(XCircleIcon, { className: "size-4 text-destructive" }),
   aborted: /* @__PURE__ */ jsx9(XCircleIcon, { className: "size-4 text-muted-foreground" })
 };
-var getStatusBadge = (status) => /* @__PURE__ */ jsxs8(Badge, { className: "shrink-0 gap-1.5 rounded-full text-xs", variant: "secondary", children: [
+var getStatusBadge = (status, label = statusLabels[status]) => /* @__PURE__ */ jsxs8(Badge, { className: "shrink-0 gap-1.5 rounded-full text-xs", variant: "secondary", children: [
   statusIcons[status],
-  statusLabels[status]
+  label
 ] });
 var ToolHeader = ({
   className,
@@ -1274,6 +1278,7 @@ var ToolHeader = ({
   state,
   icon,
   toolName,
+  statusLabel,
   ...props
 }) => {
   const derivedName = type === "dynamic-tool" || type === "tool-call" ? toolName : type.split("-").slice(1).join("-");
@@ -1290,7 +1295,7 @@ var ToolHeader = ({
         /* @__PURE__ */ jsxs8("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
           icon ?? /* @__PURE__ */ jsx9(WrenchIcon, { className: "size-4 shrink-0 text-muted-foreground" }),
           /* @__PURE__ */ jsx9("span", { "data-boring-agent-part": "tool-title", className: "min-w-0 flex-1 truncate text-sm font-medium", children: title ?? derivedName }),
-          getStatusBadge(state)
+          getStatusBadge(state, statusLabel)
         ] }),
         /* @__PURE__ */ jsx9(
           ChevronDownIcon,
@@ -1356,7 +1361,7 @@ var ToolOutput = ({
 
 // src/front/toolRenderers.tsx
 import { CollapsibleTrigger as CollapsibleTrigger2 } from "@hachej/boring-ui-kit";
-import { ChevronDownIcon as ChevronDownIcon2, ExternalLinkIcon, FileDiffIcon, FilePlus2Icon, FileTextIcon, SearchIcon, SquareTerminalIcon, ZapIcon } from "lucide-react";
+import { ChevronDownIcon as ChevronDownIcon2, CopyIcon as CopyIcon2, DownloadIcon, ExternalLinkIcon, FileDiffIcon, FilePlus2Icon, FileTextIcon, SearchIcon, SquareTerminalIcon, ZapIcon } from "lucide-react";
 
 // src/front/primitives/artifact.tsx
 import { Button as Button6 } from "@hachej/boring-ui-kit";
@@ -1368,44 +1373,6 @@ import {
 } from "@hachej/boring-ui-kit";
 import { XIcon } from "lucide-react";
 import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
-var Artifact = ({ className, ...props }) => /* @__PURE__ */ jsx10(
-  "div",
-  {
-    className: cn(
-      "flex flex-col overflow-hidden rounded-lg border bg-background shadow-sm",
-      className
-    ),
-    ...props
-  }
-);
-var ArtifactHeader = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx10(
-  "div",
-  {
-    className: cn(
-      "flex items-center justify-between border-b bg-muted/50 px-4 py-3",
-      className
-    ),
-    ...props
-  }
-);
-var ArtifactTitle = ({ className, ...props }) => /* @__PURE__ */ jsx10(
-  "p",
-  {
-    className: cn("font-medium text-foreground text-sm", className),
-    ...props
-  }
-);
-var ArtifactDescription = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx10("p", { className: cn("text-muted-foreground text-sm", className), ...props });
-var ArtifactActions = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx10("div", { className: cn("flex items-center gap-1", className), ...props });
 var ArtifactAction = ({
   tooltip,
   label,
@@ -1441,13 +1408,6 @@ var ArtifactAction = ({
   }
   return button;
 };
-var ArtifactContent = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx10("div", { className: cn("flex-1 overflow-auto p-4", className), ...props });
-
-// src/front/toolRenderers.tsx
-import { CopyIcon as CopyIcon2, DownloadIcon } from "lucide-react";
 
 // src/front/runtimeReadinessStatus.ts
 var COPY = {
@@ -1513,7 +1473,7 @@ function getWorkspaceNotReadyStatus(output) {
 }
 
 // src/front/toolRenderers.tsx
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 function asRecord2(value) {
   return typeof value === "object" && value !== null ? value : {};
 }
@@ -1671,59 +1631,44 @@ function renderWrite2(part) {
   const path = typeof input.path === "string" ? input.path : "";
   const filesystem = typeof input.filesystem === "string" ? input.filesystem : void 0;
   const content = typeof input.content === "string" ? input.content : "";
-  const bytes = content.length;
-  const lang = langFromPath(path);
-  return /* @__PURE__ */ jsxs10(Tool2, { children: [
-    /* @__PURE__ */ jsx11(ToolHeader, { icon: /* @__PURE__ */ jsx11(FilePlus2Icon, { className: "size-4 text-muted-foreground" }), title: pathTitle("write", path, filesystem), ...toHeaderProps(part) }),
-    /* @__PURE__ */ jsx11(ToolContent, { children: /* @__PURE__ */ jsxs10(Artifact, { className: "rounded-none border-0 bg-transparent shadow-none", children: [
-      /* @__PURE__ */ jsxs10(ArtifactHeader, { className: "border-0 px-0 pt-0 pb-2", children: [
-        /* @__PURE__ */ jsxs10("div", { children: [
-          /* @__PURE__ */ jsx11(ArtifactTitle, { children: path || "untitled" }),
-          /* @__PURE__ */ jsxs10(ArtifactDescription, { children: [
-            bytes.toLocaleString(),
-            " ",
-            bytes === 1 ? "byte" : "bytes",
-            lang ? ` \xB7 ${lang}` : ""
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs10(ArtifactActions, { children: [
-          /* @__PURE__ */ jsx11(
-            ArtifactAction,
-            {
-              icon: CopyIcon2,
-              tooltip: "Copy contents",
-              label: "Copy",
-              onClick: () => {
-                void copyTextToClipboard(content);
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx11(
-            ArtifactAction,
-            {
-              icon: DownloadIcon,
-              tooltip: "Download file",
-              label: "Download",
-              onClick: () => {
-                try {
+  return /* @__PURE__ */ jsxs10(Tool2, { defaultOpen: part.state === "output-available", children: [
+    /* @__PURE__ */ jsx11(ToolHeader, { className: "p-2", icon: /* @__PURE__ */ jsx11(FilePlus2Icon, { className: "size-4 shrink-0 text-muted-foreground" }), title: pathTitle("write", path, filesystem), ...toHeaderProps(part) }),
+    /* @__PURE__ */ jsxs10(ToolContent, { className: "p-1.5", children: [
+      /* @__PURE__ */ jsx11("div", { className: "max-h-80 overflow-auto overscroll-contain rounded-sm", children: content ? /* @__PURE__ */ jsx11(
+        DiffView,
+        {
+          oldString: "",
+          newString: content,
+          path,
+          actions: /* @__PURE__ */ jsxs10(Fragment3, { children: [
+            /* @__PURE__ */ jsx11(ArtifactAction, { className: "size-6", icon: CopyIcon2, tooltip: "Copy contents", label: "Copy", onClick: () => {
+              void copyTextToClipboard(content);
+            } }),
+            /* @__PURE__ */ jsx11(
+              ArtifactAction,
+              {
+                className: "size-6",
+                icon: DownloadIcon,
+                tooltip: "Download file",
+                label: "Download",
+                onClick: () => {
                   const blob = new Blob([content], { type: "text/plain" });
                   const url = URL.createObjectURL(blob);
-                  const a = document.createElement("a");
-                  a.href = url;
-                  a.download = path.split("/").pop() || "artifact.txt";
-                  document.body.appendChild(a);
-                  a.click();
-                  a.remove();
+                  const anchor = document.createElement("a");
+                  anchor.href = url;
+                  anchor.download = path.split("/").pop() || "artifact.txt";
+                  document.body.appendChild(anchor);
+                  anchor.click();
+                  anchor.remove();
                   URL.revokeObjectURL(url);
-                } catch {
                 }
               }
-            }
-          )
-        ] })
-      ] }),
-      content && /* @__PURE__ */ jsx11(ArtifactContent, { className: "p-0", children: /* @__PURE__ */ jsx11(CodeBlock2, { code: content, language: lang ?? "text", showLineNumbers: true }) })
-    ] }) })
+            )
+          ] })
+        }
+      ) : /* @__PURE__ */ jsx11("p", { className: "px-2 py-1 text-[12px] text-muted-foreground", children: "No file content was included with this tool call." }) }),
+      part.errorText || part.state === "output-error" || part.state === "output-denied" ? /* @__PURE__ */ jsx11(ToolOutput, { output: part.output, errorText: part.errorText }) : null
+    ] })
   ] });
 }
 function renderEdit2(part) {
@@ -1732,25 +1677,26 @@ function renderEdit2(part) {
   const input = asRecord2(part.input);
   const path = typeof input.path === "string" ? input.path : "";
   const filesystem = typeof input.filesystem === "string" ? input.filesystem : void 0;
-  const oldString = typeof input.oldString === "string" ? input.oldString : "";
-  const newString = typeof input.newString === "string" ? input.newString : "";
-  return /* @__PURE__ */ jsxs10(Tool2, { children: [
-    /* @__PURE__ */ jsx11(ToolHeader, { icon: /* @__PURE__ */ jsx11(FileDiffIcon, { className: "size-4 text-muted-foreground" }), title: pathTitle("edit", path, filesystem), ...toHeaderProps(part) }),
-    /* @__PURE__ */ jsxs10(ToolContent, { children: [
-      /* @__PURE__ */ jsxs10("section", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx11("h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: "Diff" }),
-        /* @__PURE__ */ jsxs10("div", { className: "overflow-hidden rounded-sm border border-input/60 bg-muted/30 font-mono text-[13px] leading-relaxed", children: [
-          oldString && /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-[auto_1fr] gap-2 border-b border-input/40 bg-destructive/5 px-3 py-2", children: [
-            /* @__PURE__ */ jsx11("span", { className: "select-none text-destructive/70", children: "-" }),
-            /* @__PURE__ */ jsx11("span", { className: cn("whitespace-pre-wrap break-all text-destructive/90"), children: oldString })
-          ] }),
-          newString && /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-[auto_1fr] gap-2 bg-accent/5 px-3 py-2", children: [
-            /* @__PURE__ */ jsx11("span", { className: "select-none text-accent/80", children: "+" }),
-            /* @__PURE__ */ jsx11("span", { className: "whitespace-pre-wrap break-all text-accent", children: newString })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx11(ToolOutput, { output: part.output, errorText: part.errorText })
+  const edits = Array.isArray(input.edits) ? input.edits.flatMap((value) => {
+    const edit = asRecord2(value);
+    const oldText = typeof edit.oldText === "string" ? edit.oldText : "";
+    const newText = typeof edit.newText === "string" ? edit.newText : "";
+    return oldText || newText ? [{ oldText, newText }] : [];
+  }) : [];
+  const legacyOldText = typeof input.oldString === "string" ? input.oldString : typeof input.oldText === "string" ? input.oldText : "";
+  const legacyNewText = typeof input.newString === "string" ? input.newString : typeof input.newText === "string" ? input.newText : "";
+  const visibleEdits = edits.length > 0 ? edits : legacyOldText || legacyNewText ? [{ oldText: legacyOldText, newText: legacyNewText }] : [];
+  return /* @__PURE__ */ jsxs10(Tool2, { defaultOpen: part.state === "output-available", children: [
+    /* @__PURE__ */ jsx11(ToolHeader, { className: "p-2", icon: /* @__PURE__ */ jsx11(FileDiffIcon, { className: "size-4 shrink-0 text-muted-foreground" }), title: pathTitle("edit", path, filesystem), ...toHeaderProps(part) }),
+    /* @__PURE__ */ jsxs10(ToolContent, { className: "space-y-2 p-2", children: [
+      /* @__PURE__ */ jsx11("div", { className: "max-h-80 space-y-2 overflow-auto overscroll-contain rounded-sm", children: visibleEdits.length > 0 ? visibleEdits.map((edit, index) => /* @__PURE__ */ jsxs10("div", { children: [
+        visibleEdits.length > 1 ? /* @__PURE__ */ jsxs10("div", { className: "mb-1 px-1 text-[11px] text-muted-foreground", children: [
+          "Change ",
+          index + 1
+        ] }) : null,
+        /* @__PURE__ */ jsx11(DiffView, { oldString: edit.oldText, newString: edit.newText, path })
+      ] }, `${index}:${edit.oldText.length}:${edit.newText.length}`)) : /* @__PURE__ */ jsx11("p", { className: "px-2 py-1 text-[12px] text-muted-foreground", children: "Diff details were not included with this tool call." }) }),
+      part.errorText || part.state === "output-error" || part.state === "output-denied" ? /* @__PURE__ */ jsx11(ToolOutput, { output: part.output, errorText: part.errorText }) : null
     ] })
   ] });
 }
@@ -2026,7 +1972,7 @@ function usePickerKeyboard({
 }
 
 // src/front/primitives/mention-picker.tsx
-import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var mentionSearchGlob = toFileSearchGlob;
 function highlight(text, query) {
   if (!query) return null;
@@ -2089,7 +2035,7 @@ function MentionPicker({
           onSelect(path);
         },
         children: [
-          /* @__PURE__ */ jsx12("span", { className: "font-medium", children: hl ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
+          /* @__PURE__ */ jsx12("span", { className: "font-medium", children: hl ? /* @__PURE__ */ jsxs11(Fragment4, { children: [
             hl.before,
             /* @__PURE__ */ jsx12("mark", { className: "bg-transparent text-[color:var(--accent)]", children: hl.match }),
             hl.after
@@ -2495,10 +2441,11 @@ var PiComposerPolicyController = class {
     }));
   }
   async runLocalCommand(commandName, args) {
-    if (isPiChatBusy(this.options.session.getState().status)) {
+    const command = this.options.registry.get(commandName);
+    if (isPiChatBusy(this.options.session.getState().status) && command?.allowWhileBusy?.(args) !== true) {
       return this.block("busy-slash-command", "Slash commands are not queued while the agent is responding.");
     }
-    const result = await Promise.resolve(this.options.registry.get(commandName)?.handler(args, this.options.slashContext));
+    const result = await Promise.resolve(command?.handler(args, this.options.slashContext));
     const message = typeof result === "string" ? result : result && typeof result === "object" ? result.message : void 0;
     const preserveDraft = Boolean(result && typeof result === "object" && result.preserveDraft === true);
     if (message) this.options.onCommandResult?.(message);
@@ -2911,6 +2858,25 @@ function composerNoticeForRuntimeDependencies(status) {
   return null;
 }
 
+// src/front/chat/composerContributions.tsx
+import { createContext as createContext3, useContext as useContext3, useMemo as useMemo3 } from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var ComposerContributionContext = createContext3([]);
+function ComposerContributionProvider({
+  contribution,
+  children
+}) {
+  const parent = useContext3(ComposerContributionContext);
+  const contributions = useMemo3(
+    () => [contribution, ...parent.filter((entry) => entry.id !== contribution.id)],
+    [contribution, parent]
+  );
+  return /* @__PURE__ */ jsx13(ComposerContributionContext.Provider, { value: contributions, children });
+}
+function useComposerContributions() {
+  return useContext3(ComposerContributionContext);
+}
+
 // src/front/chat/pi/piChatMessageMetadata.ts
 function earliestCreatedAt(left, right) {
   if (!left) return right;
@@ -5158,7 +5124,7 @@ function resolveStorage2(storage) {
 }
 
 // src/front/chat/session/usePiSessions.ts
-import { useCallback as useCallback7, useEffect as useEffect8, useMemo as useMemo3, useRef as useRef8, useState as useState10 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect8, useMemo as useMemo4, useRef as useRef8, useState as useState10 } from "react";
 var DEFAULT_SESSIONS_API_PATH = "/api/v1/agent/pi-chat/sessions";
 var SESSION_PAGE_SIZE = 50;
 var DEFAULT_MAX_RETRIES = 60;
@@ -5179,16 +5145,16 @@ function usePiSessions(options = {}) {
   const addressed = typeof options.agentTypeId === "string" && options.agentTypeId.length > 0;
   const sessionsApiPath = options.sessionsApiPath ?? (addressed ? `/api/v1/agents/${encodeURIComponent(options.agentTypeId)}/sessions` : DEFAULT_SESSIONS_API_PATH);
   const storageScope = options.storageScope ?? "default";
-  const fetchImpl = useMemo3(() => options.fetch ?? globalThis.fetch.bind(globalThis), [options.fetch]);
+  const fetchImpl = useMemo4(() => options.fetch ?? globalThis.fetch.bind(globalThis), [options.fetch]);
   const createRemoteSession = options.createRemoteSession ?? createRemotePiSession;
   const connectActiveSession = options.connectActiveSession ?? true;
   const retryMaxRetries = options.retry?.maxRetries ?? DEFAULT_MAX_RETRIES;
   const retryBaseMs = options.retry?.baseMs ?? DEFAULT_RETRY_BASE_MS;
   const retryMaxMs = options.retry?.maxMs ?? DEFAULT_RETRY_MAX_MS;
-  const headersKey = useMemo3(() => headersScopeKey(options.requestHeaders, storageScope), [options.requestHeaders, storageScope]);
-  const normalizedHeaders = useMemo3(() => buildRequestHeaders(options.requestHeaders, storageScope), [headersKey, storageScope]);
-  const requestScopeKey = useMemo3(() => requestScopeIdentity(apiBaseUrl, sessionsApiPath, storageScope, headersKey), [apiBaseUrl, headersKey, sessionsApiPath, storageScope]);
-  const dataSourceKey = useMemo3(() => dataSourceIdentity(apiBaseUrl, sessionsApiPath, storageScope), [apiBaseUrl, sessionsApiPath, storageScope]);
+  const headersKey = useMemo4(() => headersScopeKey(options.requestHeaders, storageScope), [options.requestHeaders, storageScope]);
+  const normalizedHeaders = useMemo4(() => buildRequestHeaders(options.requestHeaders, storageScope), [headersKey, storageScope]);
+  const requestScopeKey = useMemo4(() => requestScopeIdentity(apiBaseUrl, sessionsApiPath, storageScope, headersKey), [apiBaseUrl, headersKey, sessionsApiPath, storageScope]);
+  const dataSourceKey = useMemo4(() => dataSourceIdentity(apiBaseUrl, sessionsApiPath, storageScope), [apiBaseUrl, sessionsApiPath, storageScope]);
   const [sessions, setSessions] = useState10([]);
   const [dataStorageScope, setDataStorageScope] = useState10(storageScope);
   const [activeSessionId, setActiveSessionId] = useState10(() => options.initialActiveSessionId ?? readActiveSessionId({ storageScope, storage: options.storage }));
@@ -5215,7 +5181,7 @@ function usePiSessions(options = {}) {
   requestScopeRef.current = requestScopeKey;
   const remoteSessionOptionsRef = useRef8(options.remoteSessionOptions);
   remoteSessionOptionsRef.current = options.remoteSessionOptions;
-  const remoteSessionOptionsKey = useMemo3(
+  const remoteSessionOptionsKey = useMemo4(
     () => remoteSessionOptionsIdentity(options.remoteSessionOptions),
     [options.remoteSessionOptions]
   );
@@ -5657,10 +5623,10 @@ function clearRetryTimer(ref) {
 }
 
 // src/front/chat/session/SessionList.tsx
-import { useMemo as useMemo4 } from "react";
+import { useMemo as useMemo5 } from "react";
 import { ChevronLeftIcon, PlusIcon, Trash2Icon } from "lucide-react";
 import { IconButton } from "@hachej/boring-ui-kit";
-import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
 var DAY_MS = 24 * 60 * 60 * 1e3;
 function SessionList({
   sessions,
@@ -5675,7 +5641,7 @@ function SessionList({
   onClose,
   className
 }) {
-  const groups = useMemo4(() => groupSessions(sessions), [sessions]);
+  const groups = useMemo5(() => groupSessions(sessions), [sessions]);
   return /* @__PURE__ */ jsxs12(
     "div",
     {
@@ -5686,26 +5652,26 @@ function SessionList({
       "aria-busy": loading ? "true" : void 0,
       children: [
         /* @__PURE__ */ jsxs12("div", { className: "flex h-11 items-center justify-between border-b border-border/60 px-3.5", children: [
-          /* @__PURE__ */ jsx13("span", { className: "text-[12px] font-medium tracking-tight text-foreground/70", children: "Sessions" }),
+          /* @__PURE__ */ jsx14("span", { className: "text-[12px] font-medium tracking-tight text-foreground/70", children: "Sessions" }),
           /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-0.5", children: [
-            onCreate ? /* @__PURE__ */ jsx13(IconButton, { type: "button", variant: "ghost", size: "icon-xs", onClick: onCreate, "aria-label": "New session", title: "New chat", children: /* @__PURE__ */ jsx13(PlusIcon, { className: "h-3.5 w-3.5", strokeWidth: 1.75 }) }) : null,
-            onClose ? /* @__PURE__ */ jsx13(IconButton, { type: "button", variant: "ghost", size: "icon-xs", onClick: onClose, "aria-label": "Close sessions", title: "Close sessions", children: /* @__PURE__ */ jsx13(ChevronLeftIcon, { className: "h-4 w-4", strokeWidth: 1.75 }) }) : null
+            onCreate ? /* @__PURE__ */ jsx14(IconButton, { type: "button", variant: "ghost", size: "icon-xs", onClick: onCreate, "aria-label": "New session", title: "New chat", children: /* @__PURE__ */ jsx14(PlusIcon, { className: "h-3.5 w-3.5", strokeWidth: 1.75 }) }) : null,
+            onClose ? /* @__PURE__ */ jsx14(IconButton, { type: "button", variant: "ghost", size: "icon-xs", onClick: onClose, "aria-label": "Close sessions", title: "Close sessions", children: /* @__PURE__ */ jsx14(ChevronLeftIcon, { className: "h-4 w-4", strokeWidth: 1.75 }) }) : null
           ] })
         ] }),
         /* @__PURE__ */ jsxs12("div", { className: "flex-1 overflow-y-auto py-2.5", children: [
           sessions.length === 0 ? /* @__PURE__ */ jsxs12("div", { "data-boring-agent-part": "session-list-empty", className: "px-3 py-8 text-center text-[13px] text-muted-foreground", children: [
             loading ? "Loading sessions\u2026" : "No sessions yet.",
-            !loading ? /* @__PURE__ */ jsxs12(Fragment4, { children: [
-              /* @__PURE__ */ jsx13("br", {}),
+            !loading ? /* @__PURE__ */ jsxs12(Fragment5, { children: [
+              /* @__PURE__ */ jsx14("br", {}),
               "Start a new chat to begin."
             ] }) : null
           ] }) : null,
           groups.map((group, index) => /* @__PURE__ */ jsxs12("section", { className: cn(index > 0 && "mt-4"), children: [
             /* @__PURE__ */ jsxs12("div", { className: "flex items-baseline justify-between gap-2 px-3.5 pb-2 pt-2 text-[11px] font-medium tracking-tight text-muted-foreground/75", children: [
-              /* @__PURE__ */ jsx13("span", { children: group.label }),
-              /* @__PURE__ */ jsx13("span", { "aria-hidden": "true", className: "text-[10.5px] tabular-nums text-muted-foreground/40", children: group.items.length })
+              /* @__PURE__ */ jsx14("span", { children: group.label }),
+              /* @__PURE__ */ jsx14("span", { "aria-hidden": "true", className: "text-[10.5px] tabular-nums text-muted-foreground/40", children: group.items.length })
             ] }),
-            /* @__PURE__ */ jsx13("ul", { role: "list", className: "flex flex-col", children: group.items.map((session) => /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx14("ul", { role: "list", className: "flex flex-col", children: group.items.map((session) => /* @__PURE__ */ jsx14(
               SessionRow,
               {
                 session,
@@ -5716,7 +5682,7 @@ function SessionList({
               session.id
             )) })
           ] }, group.key)),
-          hasMore && onLoadMore ? /* @__PURE__ */ jsx13("div", { className: "px-3 py-3", children: /* @__PURE__ */ jsx13(
+          hasMore && onLoadMore ? /* @__PURE__ */ jsx14("div", { className: "px-3 py-3", children: /* @__PURE__ */ jsx14(
             "button",
             {
               type: "button",
@@ -5748,10 +5714,10 @@ function SessionRow({ session, active, onSwitch, onDelete }) {
       onClick: () => onSwitch?.(session.id),
       children: [
         /* @__PURE__ */ jsxs12("span", { className: "min-w-0 flex-1 truncate leading-5", title: session.title, children: [
-          /* @__PURE__ */ jsx13("span", { className: cn(active ? "font-medium text-foreground" : "text-foreground/90"), children: session.title || "Untitled" }),
-          time ? /* @__PURE__ */ jsx13("span", { className: cn("ml-1.5 tabular-nums text-[11px]", active ? "text-[color:var(--accent)]" : "text-muted-foreground/60"), children: time }) : null
+          /* @__PURE__ */ jsx14("span", { className: cn(active ? "font-medium text-foreground" : "text-foreground/90"), children: session.title || "Untitled" }),
+          time ? /* @__PURE__ */ jsx14("span", { className: cn("ml-1.5 tabular-nums text-[11px]", active ? "text-[color:var(--accent)]" : "text-muted-foreground/60"), children: time }) : null
         ] }),
-        onDelete ? /* @__PURE__ */ jsx13(
+        onDelete ? /* @__PURE__ */ jsx14(
           IconButton,
           {
             type: "button",
@@ -5763,7 +5729,7 @@ function SessionRow({ session, active, onSwitch, onDelete }) {
               onDelete(session.id);
             },
             "aria-label": `Delete ${session.title || "session"}`,
-            children: /* @__PURE__ */ jsx13(Trash2Icon, { className: "h-3 w-3" })
+            children: /* @__PURE__ */ jsx14(Trash2Icon, { className: "h-3 w-3" })
           }
         ) : null
       ]
@@ -6010,7 +5976,7 @@ function searchPiSessions(sessions, query, options = {}) {
 
 // src/front/chat/components/PiConversationSurface.tsx
 import { Loader2 as Loader22 } from "lucide-react";
-import { useCallback as useCallback14, useEffect as useEffect14, useLayoutEffect, useRef as useRef10, useState as useState15 } from "react";
+import { useCallback as useCallback14, useEffect as useEffect14, useLayoutEffect, useRef as useRef11, useState as useState15 } from "react";
 import { useStickToBottomContext as useStickToBottomContext2 } from "use-stick-to-bottom";
 
 // src/front/primitives/conversation.tsx
@@ -6018,7 +5984,7 @@ import { Button as Button7 } from "@hachej/boring-ui-kit";
 import { ArrowDownIcon, DownloadIcon as DownloadIcon2 } from "lucide-react";
 import { useCallback as useCallback8, useEffect as useEffect9 } from "react";
 import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
-import { Fragment as Fragment5, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
 var ConversationScrollController = ({
   onScrollToBottomReady
 }) => {
@@ -6044,7 +6010,7 @@ var Conversation = ({
     role: "log",
     ...props,
     children: [
-      /* @__PURE__ */ jsx14(ConversationScrollController, { onScrollToBottomReady }),
+      /* @__PURE__ */ jsx15(ConversationScrollController, { onScrollToBottomReady }),
       children
     ]
   }
@@ -6052,7 +6018,7 @@ var Conversation = ({
 var ConversationContent = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx14(
+}) => /* @__PURE__ */ jsx15(
   StickToBottom.Content,
   {
     className: cn("flex flex-col gap-8 p-4", className),
@@ -6067,7 +6033,7 @@ var ConversationScrollButton = ({
   const handleScrollToBottom = useCallback8(() => {
     scrollToBottom();
   }, [scrollToBottom]);
-  return !isAtBottom && /* @__PURE__ */ jsx14(
+  return !isAtBottom && /* @__PURE__ */ jsx15(
     Button7,
     {
       className: cn(
@@ -6080,7 +6046,7 @@ var ConversationScrollButton = ({
       variant: "outline",
       "aria-label": "Scroll to latest message",
       ...props,
-      children: /* @__PURE__ */ jsx14(ArrowDownIcon, { className: "size-4" })
+      children: /* @__PURE__ */ jsx15(ArrowDownIcon, { className: "size-4" })
     }
   );
 };
@@ -6116,16 +6082,16 @@ function noticeTextClass(className) {
 import { memo as memo2 } from "react";
 import { AlertTriangleIcon, InfoIcon, Loader2Icon, PlugZapIcon, RefreshCwIcon, XIcon as XIcon2 } from "lucide-react";
 import { Button as Button8 } from "@hachej/boring-ui-kit";
-import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
 var RuntimeNotices = memo2(({ notices, onDismiss, onAction, renderAction, className, ...props }) => {
   if (notices.length === 0) return null;
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-boring-agent-part": "runtime-notices",
       className: cn("flex flex-col gap-2 px-4 py-2", className),
       ...props,
-      children: notices.map((notice) => /* @__PURE__ */ jsx15(RuntimeNoticeRow, { notice, onDismiss, onAction, renderAction }, notice.id))
+      children: notices.map((notice) => /* @__PURE__ */ jsx16(RuntimeNoticeRow, { notice, onDismiss, onAction, renderAction }, notice.id))
     }
   );
 });
@@ -6149,11 +6115,11 @@ function RuntimeNoticeRow({ notice, onDismiss, onAction, renderAction }) {
         "flex items-start gap-2.5 motion-reduce:transition-none"
       ),
       children: [
-        /* @__PURE__ */ jsx15(Icon, { className: cn(noticeIconClass(notice.level), kind === "retry" && "animate-spin motion-reduce:animate-none"), "aria-hidden": "true" }),
-        /* @__PURE__ */ jsx15("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx15("p", { className: noticeTextClass(), children: notice.text }) }),
+        /* @__PURE__ */ jsx16(Icon, { className: cn(noticeIconClass(notice.level), kind === "retry" && "animate-spin motion-reduce:animate-none"), "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx16("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx16("p", { className: noticeTextClass(), children: notice.text }) }),
         hostAction ?? null,
-        actionLabel && onAction ? /* @__PURE__ */ jsx15(Button8, { type: "button", variant: "ghost", size: "sm", onClick: () => onAction(notice.id), children: actionLabel }) : null,
-        notice.dismissible && onDismiss ? /* @__PURE__ */ jsx15(
+        actionLabel && onAction ? /* @__PURE__ */ jsx16(Button8, { type: "button", variant: "ghost", size: "sm", onClick: () => onAction(notice.id), children: actionLabel }) : null,
+        notice.dismissible && onDismiss ? /* @__PURE__ */ jsx16(
           Button8,
           {
             type: "button",
@@ -6162,7 +6128,7 @@ function RuntimeNoticeRow({ notice, onDismiss, onAction, renderAction }) {
             "aria-label": "Dismiss notice",
             onClick: () => onDismiss(notice.id),
             className: "-mr-1 -mt-1 shrink-0 text-muted-foreground/70 hover:bg-muted hover:text-foreground",
-            children: /* @__PURE__ */ jsx15(XIcon2, { className: "size-3" })
+            children: /* @__PURE__ */ jsx16(XIcon2, { className: "size-3" })
           }
         ) : null
       ]
@@ -6191,7 +6157,7 @@ function defaultActionLabel(kind) {
 }
 
 // src/front/chat/components/ChatNotices.tsx
-import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 function RuntimeNoticeMessages({
   notices,
   onDismiss,
@@ -6201,7 +6167,7 @@ function RuntimeNoticeMessages({
     (notice) => notice.level === "error" || notice.level === "warning" || notice.id === "connection-reconnecting" || notice.id === "auto-retry" || notice.id === "large-state-warning" || notice.id.startsWith("command:") || notice.id.startsWith("composer-warning:")
   );
   if (visible.length === 0) return null;
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     RuntimeNotices,
     {
       notices: visible,
@@ -6213,7 +6179,7 @@ function RuntimeNoticeMessages({
 }
 function ComposerRuntimeNotice({ notice }) {
   const level = notice.code === ErrorCode.enum.AGENT_RUNTIME_NOT_READY ? "info" : "error";
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     "div",
     {
       "data-testid": "chat-composer-runtime-notice",
@@ -6221,17 +6187,17 @@ function ComposerRuntimeNotice({ notice }) {
       "aria-live": "polite",
       className: noticeSurfaceClass(level, "mx-auto mb-2 w-full max-w-3xl text-xs"),
       children: /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-2", children: [
-        notice.code === ErrorCode.enum.AGENT_RUNTIME_NOT_READY ? /* @__PURE__ */ jsx16(Loader2, { "aria-hidden": "true", className: "mt-0.5 size-3.5 shrink-0 animate-spin text-muted-foreground" }) : /* @__PURE__ */ jsx16(AlertCircleIcon, { "aria-hidden": "true", className: "mt-0.5 size-3.5 shrink-0 text-destructive" }),
+        notice.code === ErrorCode.enum.AGENT_RUNTIME_NOT_READY ? /* @__PURE__ */ jsx17(Loader2, { "aria-hidden": "true", className: "mt-0.5 size-3.5 shrink-0 animate-spin text-muted-foreground" }) : /* @__PURE__ */ jsx17(AlertCircleIcon, { "aria-hidden": "true", className: "mt-0.5 size-3.5 shrink-0 text-destructive" }),
         /* @__PURE__ */ jsxs15("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsx16("div", { className: "font-medium", children: notice.title }),
-          notice.detail ? /* @__PURE__ */ jsx16(NoticeText, { className: "mt-0.5 text-muted-foreground", children: notice.detail }) : null
+          /* @__PURE__ */ jsx17("div", { className: "font-medium", children: notice.title }),
+          notice.detail ? /* @__PURE__ */ jsx17(NoticeText, { className: "mt-0.5 text-muted-foreground", children: notice.detail }) : null
         ] })
       ] })
     }
   );
 }
 function NoticeText({ className, children }) {
-  return /* @__PURE__ */ jsx16("div", { className: noticeTextClass(className), children });
+  return /* @__PURE__ */ jsx17("div", { className: noticeTextClass(className), children });
 }
 function ComposerBlockerNotice({
   blocker,
@@ -6245,10 +6211,10 @@ function ComposerBlockerNotice({
       "aria-live": "polite",
       className: noticeSurfaceClass("info", "relative z-20 mx-auto mb-2 w-full max-w-3xl text-xs"),
       children: [
-        /* @__PURE__ */ jsx16("span", { children: label }),
+        /* @__PURE__ */ jsx17("span", { children: label }),
         blocker?.actions?.map((action) => {
           const icon = composerBlockerActionIcon(action.id);
-          return icon ? /* @__PURE__ */ jsx16(
+          return icon ? /* @__PURE__ */ jsx17(
             IconButton2,
             {
               type: "button",
@@ -6261,7 +6227,7 @@ function ComposerBlockerNotice({
               children: icon
             },
             action.id
-          ) : /* @__PURE__ */ jsx16(
+          ) : /* @__PURE__ */ jsx17(
             "button",
             {
               type: "button",
@@ -6277,8 +6243,8 @@ function ComposerBlockerNotice({
   );
 }
 function composerBlockerActionIcon(actionId) {
-  if (actionId === "open") return /* @__PURE__ */ jsx16(ExternalLinkIcon2, { className: "size-3.5", "aria-hidden": "true" });
-  if (actionId === "cancel") return /* @__PURE__ */ jsx16(XIcon3, { className: "size-3.5", "aria-hidden": "true" });
+  if (actionId === "open") return /* @__PURE__ */ jsx17(ExternalLinkIcon2, { className: "size-3.5", "aria-hidden": "true" });
+  if (actionId === "cancel") return /* @__PURE__ */ jsx17(XIcon3, { className: "size-3.5", "aria-hidden": "true" });
   return null;
 }
 function QueuedComposerNotice({ followUps, onEdit }) {
@@ -6297,9 +6263,9 @@ function QueuedComposerNotice({ followUps, onEdit }) {
             " queued follow-up",
             followUps.length === 1 ? "" : "s"
           ] }),
-          /* @__PURE__ */ jsx16("div", { className: "truncate text-[color:var(--muted-foreground)]", "data-boring-agent-part": "composer-queue-preview-text", children: followUps.map((followUp) => followUp.displayText).join(" - ") })
+          /* @__PURE__ */ jsx17("div", { className: "truncate text-[color:var(--muted-foreground)]", "data-boring-agent-part": "composer-queue-preview-text", children: followUps.map((followUp) => followUp.displayText).join(" - ") })
         ] }),
-        /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx17(
           IconButton2,
           {
             type: "button",
@@ -6309,7 +6275,7 @@ function QueuedComposerNotice({ followUps, onEdit }) {
             className: "shrink-0 text-[color:var(--muted-foreground)] hover:bg-[color:var(--muted)] hover:text-[color:var(--foreground)]",
             "aria-label": "Edit queued follow-ups",
             title: "Edit queued follow-ups",
-            children: /* @__PURE__ */ jsx16(ListRestartIcon, { className: "size-3.5", "aria-hidden": "true" })
+            children: /* @__PURE__ */ jsx17(ListRestartIcon, { className: "size-3.5", "aria-hidden": "true" })
           }
         )
       ]
@@ -6318,7 +6284,7 @@ function QueuedComposerNotice({ followUps, onEdit }) {
 }
 
 // src/front/chat/components/PiTimelineMessage.tsx
-import { useCallback as useCallback13, useEffect as useEffect13, useState as useState14 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect13, useMemo as useMemo12, useRef as useRef10, useState as useState14 } from "react";
 import { CheckIcon as CheckIcon2, CopyIcon as CopyIcon3 } from "lucide-react";
 import { Button as Button11 } from "@hachej/boring-ui-kit";
 
@@ -6333,8 +6299,8 @@ import {
   VideoIcon,
   XIcon as XIcon4
 } from "lucide-react";
-import { createContext as createContext3, useCallback as useCallback9, useContext as useContext3, useMemo as useMemo5 } from "react";
-import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
+import { createContext as createContext4, useCallback as useCallback9, useContext as useContext4, useMemo as useMemo6 } from "react";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 var mediaCategoryIcons = {
   audio: Music2Icon,
   document: FileTextIcon2,
@@ -6369,7 +6335,7 @@ var getAttachmentLabel = (data) => {
   const category = getMediaCategory(data);
   return data.filename || (category === "image" ? "Image" : "Attachment");
 };
-var renderAttachmentImage = (url, filename, isGrid) => isGrid ? /* @__PURE__ */ jsx17(
+var renderAttachmentImage = (url, filename, isGrid) => isGrid ? /* @__PURE__ */ jsx18(
   "img",
   {
     alt: filename || "Image",
@@ -6378,7 +6344,7 @@ var renderAttachmentImage = (url, filename, isGrid) => isGrid ? /* @__PURE__ */
     src: url,
     width: 96
   }
-) : /* @__PURE__ */ jsx17(
+) : /* @__PURE__ */ jsx18(
   "img",
   {
     alt: filename || "Image",
@@ -6388,11 +6354,11 @@ var renderAttachmentImage = (url, filename, isGrid) => isGrid ? /* @__PURE__ */
     width: 20
   }
 );
-var AttachmentsContext = createContext3(null);
-var AttachmentContext = createContext3(null);
-var useAttachmentsContext = () => useContext3(AttachmentsContext) ?? { variant: "grid" };
+var AttachmentsContext = createContext4(null);
+var AttachmentContext = createContext4(null);
+var useAttachmentsContext = () => useContext4(AttachmentsContext) ?? { variant: "grid" };
 var useAttachmentContext = () => {
-  const ctx = useContext3(AttachmentContext);
+  const ctx = useContext4(AttachmentContext);
   if (!ctx) {
     throw new Error("Attachment components must be used within <Attachment>");
   }
@@ -6404,8 +6370,8 @@ var Attachments = ({
   children,
   ...props
 }) => {
-  const contextValue = useMemo5(() => ({ variant }), [variant]);
-  return /* @__PURE__ */ jsx17(AttachmentsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx17(
+  const contextValue = useMemo6(() => ({ variant }), [variant]);
+  return /* @__PURE__ */ jsx18(AttachmentsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx18(
     "div",
     {
       className: cn(
@@ -6428,11 +6394,11 @@ var Attachment = ({
 }) => {
   const { variant } = useAttachmentsContext();
   const mediaCategory = getMediaCategory(data);
-  const contextValue = useMemo5(
+  const contextValue = useMemo6(
     () => ({ data, mediaCategory, onRemove, variant }),
     [data, mediaCategory, onRemove, variant]
   );
-  return /* @__PURE__ */ jsx17(AttachmentContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(AttachmentContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx18(
     "div",
     {
       className: cn(
@@ -6462,18 +6428,18 @@ var AttachmentPreview = ({
 }) => {
   const { data, mediaCategory, variant } = useAttachmentContext();
   const iconSize = variant === "inline" ? "size-3" : "size-4";
-  const renderIcon = (Icon) => /* @__PURE__ */ jsx17(Icon, { className: cn(iconSize, "text-muted-foreground") });
+  const renderIcon = (Icon) => /* @__PURE__ */ jsx18(Icon, { className: cn(iconSize, "text-muted-foreground") });
   const renderContent = () => {
     if (mediaCategory === "image" && data.type === "file" && data.url) {
       return renderAttachmentImage(data.url, data.filename, variant === "grid");
     }
     if (mediaCategory === "video" && data.type === "file" && data.url) {
-      return /* @__PURE__ */ jsx17("video", { className: "size-full object-cover", muted: true, src: data.url });
+      return /* @__PURE__ */ jsx18("video", { className: "size-full object-cover", muted: true, src: data.url });
     }
     const Icon = mediaCategoryIcons[mediaCategory];
     return fallbackIcon ?? renderIcon(Icon);
   };
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     "div",
     {
       className: cn(
@@ -6499,8 +6465,8 @@ var AttachmentInfo = ({
     return null;
   }
   return /* @__PURE__ */ jsxs16("div", { className: cn("min-w-0 flex-1", className), ...props, children: [
-    /* @__PURE__ */ jsx17("span", { className: "block truncate", children: label }),
-    showMediaType && data.mediaType && /* @__PURE__ */ jsx17("span", { className: "block truncate text-muted-foreground text-xs", children: data.mediaType })
+    /* @__PURE__ */ jsx18("span", { className: "block truncate", children: label }),
+    showMediaType && data.mediaType && /* @__PURE__ */ jsx18("span", { className: "block truncate text-muted-foreground text-xs", children: data.mediaType })
   ] });
 };
 var AttachmentRemove = ({
@@ -6545,8 +6511,8 @@ var AttachmentRemove = ({
       variant: "ghost",
       ...props,
       children: [
-        children ?? /* @__PURE__ */ jsx17(XIcon4, {}),
-        /* @__PURE__ */ jsx17("span", { className: "sr-only", children: label })
+        children ?? /* @__PURE__ */ jsx18(XIcon4, {}),
+        /* @__PURE__ */ jsx18("span", { className: "sr-only", children: label })
       ]
     }
   );
@@ -6560,28 +6526,33 @@ import {
   TooltipProvider as TooltipProvider2,
   TooltipTrigger as TooltipTrigger2
 } from "@hachej/boring-ui-kit";
+
+// src/front/primitives/markdownStyles.ts
+var INLINE_CODE_CLASS_NAME = "rounded-[0.3em] bg-muted/55 px-[0.32em] py-[0.08em] font-mono text-[0.9em] font-medium text-foreground/90";
+
+// src/front/primitives/message.tsx
 import { cjk } from "@streamdown/cjk";
 import { code } from "@streamdown/code";
 import { math } from "@streamdown/math";
 import { mermaid } from "@streamdown/mermaid";
 import { ChevronLeftIcon as ChevronLeftIcon2, ChevronRightIcon } from "lucide-react";
 import {
-  createContext as createContext4,
+  createContext as createContext5,
   memo as memo3,
   useCallback as useCallback10,
-  useContext as useContext4,
+  useContext as useContext5,
   useEffect as useEffect10,
-  useMemo as useMemo6,
+  useMemo as useMemo7,
   useState as useState11
 } from "react";
 import { Streamdown } from "streamdown";
-import { jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
-var Message = ({ className, from, ...props }) => /* @__PURE__ */ jsx18(
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
+var Message = ({ className, from, ...props }) => /* @__PURE__ */ jsx19(
   "div",
   {
     "data-boring-agent-message-role": from,
     className: cn(
-      "group flex w-full max-w-[95%] flex-col gap-2",
+      "group flex w-full max-w-full flex-col gap-1.5",
       from === "user" ? "is-user ml-auto justify-end" : "is-assistant",
       className
     ),
@@ -6592,13 +6563,13 @@ var MessageContent = ({
   children,
   className,
   ...props
-}) => /* @__PURE__ */ jsx18(
+}) => /* @__PURE__ */ jsx19(
   "div",
   {
     className: cn(
-      "is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm",
-      "group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground",
-      "group-[.is-assistant]:text-foreground",
+      "is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-visible text-[13px] leading-5",
+      "group-[.is-user]:ml-auto group-[.is-user]:max-w-[80%] group-[.is-user]:rounded-[var(--radius-lg)] group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-2.5 group-[.is-user]:text-foreground",
+      "group-[.is-assistant]:w-full group-[.is-assistant]:max-w-[40.5rem] group-[.is-assistant]:bg-transparent group-[.is-assistant]:p-0 group-[.is-assistant]:text-foreground",
       className
     ),
     ...props,
@@ -6609,7 +6580,7 @@ var MessageActions = ({
   className,
   children,
   ...props
-}) => /* @__PURE__ */ jsx18("div", { className: cn("flex items-center gap-1", className), ...props, children });
+}) => /* @__PURE__ */ jsx19("div", { className: cn("flex items-center gap-1", className), ...props, children });
 var MessageAction = ({
   tooltip,
   children,
@@ -6620,17 +6591,17 @@ var MessageAction = ({
 }) => {
   const button = /* @__PURE__ */ jsxs17(Button10, { size, type: "button", variant, ...props, children: [
     children,
-    /* @__PURE__ */ jsx18("span", { className: "sr-only", children: label || tooltip })
+    /* @__PURE__ */ jsx19("span", { className: "sr-only", children: label || tooltip })
   ] });
   if (tooltip) {
-    return /* @__PURE__ */ jsx18(TooltipProvider2, { children: /* @__PURE__ */ jsxs17(Tooltip2, { children: [
-      /* @__PURE__ */ jsx18(TooltipTrigger2, { asChild: true, children: button }),
-      /* @__PURE__ */ jsx18(TooltipContent2, { children: /* @__PURE__ */ jsx18("p", { children: tooltip }) })
+    return /* @__PURE__ */ jsx19(TooltipProvider2, { children: /* @__PURE__ */ jsxs17(Tooltip2, { children: [
+      /* @__PURE__ */ jsx19(TooltipTrigger2, { asChild: true, children: button }),
+      /* @__PURE__ */ jsx19(TooltipContent2, { children: /* @__PURE__ */ jsx19("p", { children: tooltip }) })
     ] }) });
   }
   return button;
 };
-var MessageBranchContext = createContext4(
+var MessageBranchContext = createContext5(
   null
 );
 var streamdownPlugins = { cjk, code, math, mermaid };
@@ -6666,9 +6637,9 @@ function extractCodeBlockText(children) {
 var MarkdownPre = ({ children }) => {
   const code3 = extractCodeBlockText(children).replace(/\n$/, "");
   const language = extractCodeBlockLanguage(children);
-  return /* @__PURE__ */ jsx18(CodeBlock2, { code: code3, language: language ?? "text", className: "my-3", children: /* @__PURE__ */ jsxs17(CodeBlockHeader, { children: [
-    /* @__PURE__ */ jsx18(CodeBlockTitle, { children: /* @__PURE__ */ jsx18(CodeBlockFilename, { children: language ?? "text" }) }),
-    /* @__PURE__ */ jsx18(CodeBlockCopyButton, {})
+  return /* @__PURE__ */ jsx19(CodeBlock2, { code: code3, language: language ?? "text", className: "my-3", children: /* @__PURE__ */ jsxs17(CodeBlockHeader, { children: [
+    /* @__PURE__ */ jsx19(CodeBlockTitle, { children: /* @__PURE__ */ jsx19(CodeBlockFilename, { children: language ?? "text" }) }),
+    /* @__PURE__ */ jsx19(CodeBlockCopyButton, {})
   ] }) });
 };
 var MarkdownCode = ({
@@ -6678,14 +6649,13 @@ var MarkdownCode = ({
   ...props
 }) => {
   if (inline === false) {
-    return /* @__PURE__ */ jsx18("code", { className, ...props, children });
+    return /* @__PURE__ */ jsx19("code", { className, ...props, children });
   }
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx19(
     "code",
     {
       className: cn(
-        "rounded-[0.3em] bg-muted/55 px-[0.32em] py-[0.08em]",
-        "font-mono text-[0.9em] font-medium text-foreground/90",
+        INLINE_CODE_CLASS_NAME,
         className
       ),
       ...props,
@@ -6698,7 +6668,7 @@ var markdownComponents = {
   code: MarkdownCode
 };
 var MessageResponse = memo3(
-  ({ className, shikiTheme, components, ...props }) => /* @__PURE__ */ jsx18(
+  ({ className, shikiTheme, components, ...props }) => /* @__PURE__ */ jsx19(
     Streamdown,
     {
       className: cn(
@@ -6711,7 +6681,7 @@ var MessageResponse = memo3(
       ...props
     }
   ),
-  (prevProps, nextProps) => prevProps.children === nextProps.children && nextProps.isAnimating === prevProps.isAnimating
+  (prevProps, nextProps) => prevProps.children === nextProps.children && nextProps.isAnimating === prevProps.isAnimating && nextProps.components === prevProps.components
 );
 MessageResponse.displayName = "MessageResponse";
 
@@ -6728,12 +6698,12 @@ import { math as math2 } from "@streamdown/math";
 import { mermaid as mermaid2 } from "@streamdown/mermaid";
 import { BrainIcon, ChevronDownIcon as ChevronDownIcon3 } from "lucide-react";
 import {
-  createContext as createContext5,
+  createContext as createContext6,
   memo as memo5,
   useCallback as useCallback11,
-  useContext as useContext5,
+  useContext as useContext6,
   useEffect as useEffect11,
-  useMemo as useMemo8,
+  useMemo as useMemo9,
   useRef as useRef9,
   useState as useState12
 } from "react";
@@ -6741,8 +6711,8 @@ import { Streamdown as Streamdown2 } from "streamdown";
 
 // src/front/primitives/shimmer.tsx
 import { motion } from "motion/react";
-import { memo as memo4, useMemo as useMemo7 } from "react";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { memo as memo4, useMemo as useMemo8 } from "react";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var motionComponentCache = /* @__PURE__ */ new Map();
 var getMotionComponent = (element) => {
   let component = motionComponentCache.get(element);
@@ -6762,11 +6732,11 @@ var ShimmerComponent = ({
   const MotionComponent = getMotionComponent(
     Component
   );
-  const dynamicSpread = useMemo7(
+  const dynamicSpread = useMemo8(
     () => (children?.length ?? 0) * spread,
     [children, spread]
   );
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx20(
     MotionComponent,
     {
       animate: { backgroundPosition: "0% center" },
@@ -6792,10 +6762,10 @@ var ShimmerComponent = ({
 var Shimmer = memo4(ShimmerComponent);
 
 // src/front/primitives/reasoning.tsx
-import { Fragment as Fragment6, jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
-var ReasoningContext = createContext5(null);
+import { Fragment as Fragment7, jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
+var ReasoningContext = createContext6(null);
 var useReasoning = () => {
-  const context = useContext5(ReasoningContext);
+  const context = useContext6(ReasoningContext);
   if (!context) {
     throw new Error("Reasoning components must be used within Reasoning");
   }
@@ -6860,11 +6830,11 @@ var Reasoning = memo5(
       },
       [setIsOpen]
     );
-    const contextValue = useMemo8(
+    const contextValue = useMemo9(
       () => ({ duration, isOpen, isStreaming, setIsOpen }),
       [duration, isOpen, isStreaming, setIsOpen]
     );
-    return /* @__PURE__ */ jsx20(ReasoningContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx20(
+    return /* @__PURE__ */ jsx21(ReasoningContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx21(
       Collapsible2,
       {
         className: cn("not-prose mb-2", className),
@@ -6878,10 +6848,10 @@ var Reasoning = memo5(
 );
 var defaultGetThinkingMessage = (isStreaming, duration) => {
   if (isStreaming || duration === 0) {
-    return /* @__PURE__ */ jsx20(Shimmer, { duration: 1, children: "thinking" });
+    return /* @__PURE__ */ jsx21(Shimmer, { duration: 1, children: "thinking" });
   }
   if (duration === void 0) {
-    return /* @__PURE__ */ jsx20("span", { children: "thoughts" });
+    return /* @__PURE__ */ jsx21("span", { children: "thoughts" });
   }
   return /* @__PURE__ */ jsxs18("span", { children: [
     "thoughts \xB7 ",
@@ -6897,7 +6867,7 @@ var ReasoningTrigger = memo5(
     ...props
   }) => {
     const { isStreaming, isOpen, duration } = useReasoning();
-    return /* @__PURE__ */ jsx20(
+    return /* @__PURE__ */ jsx21(
       CollapsibleTrigger3,
       {
         className: cn(
@@ -6905,10 +6875,10 @@ var ReasoningTrigger = memo5(
           className
         ),
         ...props,
-        children: children ?? /* @__PURE__ */ jsxs18(Fragment6, { children: [
-          /* @__PURE__ */ jsx20(BrainIcon, { className: "size-3" }),
+        children: children ?? /* @__PURE__ */ jsxs18(Fragment7, { children: [
+          /* @__PURE__ */ jsx21(BrainIcon, { className: "size-3" }),
           getThinkingMessage(isStreaming, duration),
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx21(
             ChevronDownIcon3,
             {
               className: cn(
@@ -6924,7 +6894,7 @@ var ReasoningTrigger = memo5(
 );
 var streamdownPlugins2 = { cjk: cjk2, code: code2, math: math2, mermaid: mermaid2 };
 var ReasoningContent = memo5(
-  ({ className, children, ...props }) => /* @__PURE__ */ jsx20(
+  ({ className, children, ...props }) => /* @__PURE__ */ jsx21(
     CollapsibleContent2,
     {
       className: cn(
@@ -6933,7 +6903,7 @@ var ReasoningContent = memo5(
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx20(Streamdown2, { plugins: streamdownPlugins2, children })
+      children: /* @__PURE__ */ jsx21(Streamdown2, { plugins: streamdownPlugins2, children })
     }
   )
 );
@@ -6943,7 +6913,7 @@ ReasoningContent.displayName = "ReasoningContent";
 
 // src/front/primitives/tool-call-group.tsx
 import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
-import { memo as memo6, useCallback as useCallback12, useEffect as useEffect12, useMemo as useMemo9, useState as useState13 } from "react";
+import { memo as memo6, useCallback as useCallback12, useEffect as useEffect12, useMemo as useMemo10, useState as useState13 } from "react";
 import { Collapsible as Collapsible3, CollapsibleContent as CollapsibleContent3, CollapsibleTrigger as CollapsibleTrigger4 } from "@hachej/boring-ui-kit";
 
 // src/front/primitives/tool-call-group-state.ts
@@ -6982,10 +6952,7 @@ var TOOL_GROUP_VISUAL_PRESENTATION = {
 };
 
 // src/front/primitives/tool-call-group.tsx
-import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
-function isSettledState(state) {
-  return state === "output-available" || state === "output-error" || state === "output-denied" || state === "approval-responded" || state === "aborted";
-}
+import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
 function isInputRunningState(state) {
   return state === "input-streaming" || state === "input-available";
 }
@@ -7035,11 +7002,10 @@ function resolveVisualState({
   return "settled";
 }
 var ToolCallGroup = memo6(({ tools, mergedToolRenderers }) => {
-  const toolParts = useMemo9(() => tools.map(({ part, key }) => {
+  const toolParts = useMemo10(() => tools.map(({ part, key }) => {
     const toolPart = toToolPart(part);
     return toolPart ? { part: toolPart, key } : null;
   }).filter((entry) => Boolean(entry)), [tools]);
-  const isSettled = toolParts.every(({ part }) => isSettledState(part.state));
   const workspaceNotReady = toolParts.map(({ part }) => getWorkspaceNotReadyStatus(part.output)).find(Boolean);
   const hasError = toolParts.some(({ part }) => part.state === "output-error") && !workspaceNotReady;
   const hasAborted = toolParts.some(({ part }) => part.state === "aborted") && !workspaceNotReady;
@@ -7056,7 +7022,7 @@ var ToolCallGroup = memo6(({ tools, mergedToolRenderers }) => {
   });
   const isRunning = visualState === RUNNING_TOOL_GROUP_VISUAL_STATE;
   const [elapsedSeconds, setElapsedSeconds] = useState13(0);
-  const title = useMemo9(() => buildTitle(toolParts.map(({ part }) => part), visualState), [toolParts, visualState]);
+  const title = useMemo10(() => buildTitle(toolParts.map(({ part }) => part), visualState), [toolParts, visualState]);
   const elapsedLabel = isRunning ? `Running ${formatElapsed(elapsedSeconds)}` : null;
   useEffect12(() => {
     if (!isRunning) {
@@ -7084,50 +7050,48 @@ var ToolCallGroup = memo6(({ tools, mergedToolRenderers }) => {
           {
             "aria-label": `Tool calls: ${title}`,
             className: cn(
-              "group/trigger flex w-fit items-center gap-1.5 rounded-md px-2.5 py-1 text-[12px] font-medium transition-colors motion-reduce:transition-none",
-              "border border-border/40 bg-card/40 text-muted-foreground/70",
-              "hover:border-border/70 hover:bg-card/70 hover:text-muted-foreground",
+              "group/trigger flex min-h-10 w-full items-center gap-2 rounded-[var(--radius-md)] px-2 py-1 text-[13px] font-normal",
+              "border border-border/60 bg-muted/45 text-muted-foreground",
+              "transition-colors hover:bg-muted/70 hover:text-foreground motion-reduce:transition-none",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
               TOOL_GROUP_VISUAL_PRESENTATION[visualState].triggerClassName
             ),
             children: [
-              /* @__PURE__ */ jsx21(
+              /* @__PURE__ */ jsx22("span", { className: "flex size-4 shrink-0 items-center justify-center", "aria-hidden": "true", children: /* @__PURE__ */ jsx22(
                 "span",
                 {
                   "data-boring-agent-part": "tool-group-state-dot",
                   className: cn(
-                    "size-1.5 shrink-0 rounded-full",
+                    "size-1.5 rounded-full",
                     TOOL_GROUP_VISUAL_PRESENTATION[visualState].dotClassName
                   )
                 }
-              ),
-              /* @__PURE__ */ jsx21(
+              ) }),
+              /* @__PURE__ */ jsx22("span", { "data-boring-agent-part": "tool-group-title", children: workspaceNotReady ? workspaceNotReady.message : title }),
+              elapsedLabel ? /* @__PURE__ */ jsx22("span", { className: "ml-1 shrink-0 tabular-nums text-[12px] text-muted-foreground/70", children: elapsedLabel }) : null,
+              /* @__PURE__ */ jsx22("span", { className: "ml-1 shrink-0 tabular-nums text-[12px] text-muted-foreground/70", children: toolParts.length }),
+              /* @__PURE__ */ jsx22(
                 ChevronDownIcon4,
                 {
                   className: cn(
-                    "size-3 shrink-0 transition-transform duration-150",
+                    "ml-auto size-4 shrink-0 transition-transform duration-150 motion-reduce:transition-none",
                     isOpen && "rotate-180"
                   )
                 }
-              ),
-              workspaceNotReady ? /* @__PURE__ */ jsx21("span", { "data-boring-agent-part": "tool-group-title", children: workspaceNotReady.message }) : !isSettled ? /* @__PURE__ */ jsx21("span", { "data-boring-agent-part": "tool-group-title", children: /* @__PURE__ */ jsx21(Shimmer, { as: "span", duration: 1.5, children: title }) }) : /* @__PURE__ */ jsx21("span", { "data-boring-agent-part": "tool-group-title", children: title }),
-              elapsedLabel ? /* @__PURE__ */ jsx21("span", { className: "ml-1 shrink-0 tabular-nums text-[10px] text-muted-foreground/50", children: elapsedLabel }) : null,
-              /* @__PURE__ */ jsx21("span", { className: cn(
-                "ml-1 shrink-0 rounded-sm border border-border/40 px-1 tabular-nums",
-                "text-[10px] text-muted-foreground/50"
-              ), children: toolParts.length })
+              )
             ]
           }
         ),
-        /* @__PURE__ */ jsx21(CollapsibleContent3, { className: "overflow-hidden data-[state=closed]:animate-[boring-collapse-close_200ms_ease] data-[state=open]:animate-[boring-collapse-open_200ms_ease]", children: /* @__PURE__ */ jsxs19(
+        /* @__PURE__ */ jsx22(CollapsibleContent3, { className: "overflow-hidden data-[state=closed]:animate-[boring-collapse-close_200ms_ease] data-[state=open]:animate-[boring-collapse-open_200ms_ease]", children: /* @__PURE__ */ jsxs19(
           "div",
           {
             "data-boring-agent-part": "tool-group-details",
             className: "relative mt-1.5 w-full max-w-2xl pl-[18px]",
             children: [
-              /* @__PURE__ */ jsx21("div", { className: "absolute left-[5px] top-0 bottom-2 w-px bg-border/35" }),
-              /* @__PURE__ */ jsx21("div", { className: "flex min-w-0 flex-col gap-1.5 [&_[data-boring-agent-part=tool-card]]:!my-0", children: toolParts.map(({ part, key }) => {
+              /* @__PURE__ */ jsx22("div", { className: "absolute left-[5px] top-0 bottom-2 w-px bg-border/35" }),
+              /* @__PURE__ */ jsx22("div", { className: "flex min-w-0 flex-col gap-1.5 [&_[data-boring-agent-part=tool-card]]:!my-0", children: toolParts.map(({ part, key }) => {
                 const { renderer, part: resolvedPart, resolution } = resolveToolRendererForPart(part, mergedToolRenderers);
-                return /* @__PURE__ */ jsx21(
+                return /* @__PURE__ */ jsx22(
                   "div",
                   {
                     className: "min-w-0",
@@ -7148,8 +7112,237 @@ var ToolCallGroup = memo6(({ tools, mergedToolRenderers }) => {
 });
 ToolCallGroup.displayName = "ToolCallGroup";
 
+// src/front/chat/messageContributions.tsx
+import { createContext as createContext7, createElement, useContext as useContext7, useMemo as useMemo11 } from "react";
+import { jsx as jsx23 } from "react/jsx-runtime";
+var ChatMessageContributionContext = createContext7([]);
+function ChatMessageContributionProvider({
+  contribution,
+  children
+}) {
+  const parent = useContext7(ChatMessageContributionContext);
+  const contributions = useMemo11(
+    () => [contribution, ...parent.filter((entry) => entry.id !== contribution.id)],
+    [contribution, parent]
+  );
+  return /* @__PURE__ */ jsx23(ChatMessageContributionContext.Provider, { value: contributions, children });
+}
+function useCustomChatMessage(message) {
+  const contributions = useContext7(ChatMessageContributionContext);
+  const contribution = contributions.find((entry) => entry.matches(message));
+  return contribution ? createElement(contribution.Component, { message }) : void 0;
+}
+function ChatMessageContributionBoundary({
+  message,
+  children
+}) {
+  const customMessage = useCustomChatMessage(message);
+  return customMessage !== void 0 ? customMessage : children;
+}
+
+// src/front/chat/components/MessageMentions.tsx
+import { Children, cloneElement, isValidElement as isValidElement2 } from "react";
+import { Fragment as Fragment8, jsx as jsx24 } from "react/jsx-runtime";
+var TERMINAL_BOUNDARY = String.raw`(?=$|\s|[.,;!?)}\]"'”’]+(?=$|\s))`;
+var PREFIX_BOUNDARY = String.raw`(^|[\s(\[{"'“‘])`;
+function escapeRegExp2(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function registeredNamePattern(names) {
+  const safeNames = [...new Set(names)].filter((name) => /^\w[\w-]*$/.test(name)).sort((a, b) => b.length - a.length);
+  return safeNames.length > 0 ? safeNames.map(escapeRegExp2).join("|") : void 0;
+}
+function addRegisteredCandidates(text, prefix, names, createMention, candidates) {
+  const namesPattern = registeredNamePattern(names);
+  if (!namesPattern || !text.includes(prefix)) return;
+  const pattern = new RegExp(`${PREFIX_BOUNDARY}\\${prefix}(${namesPattern})${TERMINAL_BOUNDARY}`, "g");
+  for (const match of text.matchAll(pattern)) {
+    if (match.index === void 0) continue;
+    const boundary = match[1] ?? "";
+    const name = match[2];
+    const mention = createMention(name);
+    if (!mention) continue;
+    const start = match.index + boundary.length;
+    candidates.push({ start, end: start + name.length + 1, mention });
+  }
+}
+function isSafeWorkspaceMentionPath(path) {
+  if (!path || path.startsWith("/") || path.includes("\\") || path.includes("://")) return false;
+  const segments = path.split("/");
+  if (!segments.every((segment) => segment.length > 0 && segment !== "." && segment !== "..")) return false;
+  const basename = segments.at(-1) ?? "";
+  return basename.startsWith(".") || /\.[A-Za-z0-9]{1,12}$/.test(basename);
+}
+function addFileCandidates(text, candidates) {
+  if (!text.includes("@")) return;
+  const pattern = new RegExp(`${PREFIX_BOUNDARY}@([A-Za-z0-9_.-]+(?:/[A-Za-z0-9_.-]+)*)${TERMINAL_BOUNDARY}`, "g");
+  for (const match of text.matchAll(pattern)) {
+    if (match.index === void 0) continue;
+    const boundary = match[1] ?? "";
+    const path = match[2].replace(/[.,;!?]+$/, "");
+    if (!isSafeWorkspaceMentionPath(path)) continue;
+    const start = match.index + boundary.length;
+    const label = `@${path}`;
+    candidates.push({ start, end: start + label.length, mention: { kind: "file", path, label } });
+  }
+}
+function collectMessageMentionCandidates(text, catalog) {
+  const candidates = [];
+  const commandsByName = new Map(catalog.commands.map((command) => [command.name, command]));
+  addRegisteredCandidates(text, "/", [...commandsByName.keys()], (name) => {
+    const command = commandsByName.get(name);
+    return command ? { kind: "command", name, label: `/${name}`, behavior: command.clickBehavior } : void 0;
+  }, candidates);
+  const skillsByName = new Map(catalog.skills.map((skill) => [skill.name, skill]));
+  addRegisteredCandidates(text, "!", [...skillsByName.keys()], (name) => {
+    const skill = skillsByName.get(name);
+    return skill ? { kind: "skill", name, commandName: skill.commandName, label: `!${name}` } : void 0;
+  }, candidates);
+  if (catalog.files) addFileCandidates(text, candidates);
+  return candidates;
+}
+function splitMessageMentions(text, catalog, context = {}) {
+  const before = context.before ?? "";
+  const after = context.after ?? "";
+  const source = `${before}${text}${after}`;
+  const contentStart = before.length;
+  const contentEnd = contentStart + text.length;
+  const candidates = collectMessageMentionCandidates(source, catalog).filter((candidate) => candidate.start >= contentStart && candidate.end <= contentEnd).map((candidate) => ({ ...candidate, start: candidate.start - contentStart, end: candidate.end - contentStart })).sort((a, b) => a.start - b.start || b.end - a.end);
+  const segments = [];
+  let cursor = 0;
+  for (const candidate of candidates) {
+    if (candidate.start < cursor) continue;
+    if (candidate.start > cursor) segments.push({ text: text.slice(cursor, candidate.start) });
+    segments.push({ text: candidate.mention.label, mention: candidate.mention });
+    cursor = candidate.end;
+  }
+  if (cursor < text.length) segments.push({ text: text.slice(cursor) });
+  return segments.length > 0 ? segments : [{ text }];
+}
+function mentionActionLabel(mention) {
+  if (mention.kind === "command") return mention.behavior === "execute" ? `Run ${mention.label} command` : `Insert ${mention.label} command`;
+  if (mention.kind === "skill") return `Insert ${mention.label} skill`;
+  return `Open ${mention.path}`;
+}
+function visibleText(node) {
+  if (typeof node === "string" || typeof node === "number") return String(node);
+  if (!isValidElement2(node)) return "";
+  const element = node;
+  return Children.toArray(element.props.children).map(visibleText).join("");
+}
+function MessageMentions({
+  children,
+  catalog,
+  onActivate,
+  before = "",
+  after = ""
+}) {
+  const nodes = Children.toArray(children);
+  const boundaryText = (index, direction) => {
+    const sibling = nodes[index + direction];
+    if (sibling !== void 0) return visibleText(sibling);
+    return direction === -1 ? before : after;
+  };
+  const decorate = (child, index) => {
+    if (typeof child === "string") {
+      return splitMessageMentions(child, catalog, {
+        before: boundaryText(index, -1),
+        after: boundaryText(index, 1)
+      }).map((segment, segmentIndex) => {
+        if (!segment.mention) return segment.text;
+        const actionLabel = mentionActionLabel(segment.mention);
+        return /* @__PURE__ */ jsx24(
+          "button",
+          {
+            type: "button",
+            "aria-label": actionLabel,
+            title: actionLabel,
+            "data-message-mention-kind": segment.mention.kind,
+            className: cn(
+              "mx-0.5 inline-flex items-center rounded-[var(--radius-sm)] border border-border/70 bg-muted/55 px-1.5 py-0.5",
+              "font-mono text-[0.9em] font-medium leading-none text-foreground underline-offset-2",
+              "hover:bg-muted hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1"
+            ),
+            onClick: () => onActivate(segment.mention),
+            children: segment.text
+          },
+          `${index}:${segmentIndex}`
+        );
+      });
+    }
+    if (isValidElement2(child)) {
+      const element = child;
+      const tagName = element.props.node?.tagName;
+      if (tagName === "strong" || tagName === "em" || tagName === "del" || element.type === "em" || element.type === "del") {
+        return cloneElement(
+          element,
+          void 0,
+          /* @__PURE__ */ jsx24(
+            MessageMentions,
+            {
+              catalog,
+              onActivate,
+              before: boundaryText(index, -1),
+              after: boundaryText(index, 1),
+              children: element.props.children
+            }
+          )
+        );
+      }
+    }
+    return child;
+  };
+  return nodes.map(decorate);
+}
+function createMessageMentionMarkdownComponents(catalog, onActivate) {
+  const decorate = (children) => /* @__PURE__ */ jsx24(MessageMentions, { catalog, onActivate, children });
+  const paragraph = ({ node: _node, children, ...props }) => {
+    const content = Children.toArray(children).filter((child) => child !== null && child !== "");
+    if (content.length === 1 && isValidElement2(content[0])) {
+      const child = content[0];
+      if (child.props.node?.tagName === "img") return /* @__PURE__ */ jsx24(Fragment8, { children });
+      if (child.props.node?.tagName === "code" && "data-block" in child.props) return /* @__PURE__ */ jsx24(Fragment8, { children });
+    }
+    return /* @__PURE__ */ jsx24("p", { ...props, children: decorate(children) });
+  };
+  const tableHeader = ({ node: _node, children, className, ...props }) => /* @__PURE__ */ jsx24("th", { ...props, "data-streamdown": "table-header-cell", className: cn("whitespace-nowrap px-4 py-2 text-left font-semibold text-sm", className), children: decorate(children) });
+  const tableCell = ({ node: _node, children, className, ...props }) => /* @__PURE__ */ jsx24("td", { ...props, "data-streamdown": "table-cell", className: cn("px-4 py-2 text-sm", className), children: decorate(children) });
+  const listItem = ({ node: _node, children, className, ...props }) => /* @__PURE__ */ jsx24("li", { ...props, "data-streamdown": "list-item", className: cn("py-1 [&>p]:inline", className), children: decorate(children) });
+  const headingClasses = {
+    h1: "text-3xl",
+    h2: "text-2xl",
+    h3: "text-xl",
+    h4: "text-lg",
+    h5: "text-base",
+    h6: "text-sm"
+  };
+  const heading = (Tag) => ({ node: _node, children, className, ...props }) => /* @__PURE__ */ jsx24(Tag, { ...props, "data-streamdown": `heading-${Tag.slice(1)}`, className: cn("mt-6 mb-2 font-semibold", headingClasses[Tag], className), children: decorate(children) });
+  const inlineCode = ({ node: _node, children, className, ...props }) => /* @__PURE__ */ jsx24(
+    "code",
+    {
+      ...props,
+      className: cn(INLINE_CODE_CLASS_NAME, className),
+      children
+    }
+  );
+  return {
+    p: paragraph,
+    th: tableHeader,
+    td: tableCell,
+    li: listItem,
+    h1: heading("h1"),
+    h2: heading("h2"),
+    h3: heading("h3"),
+    h4: heading("h4"),
+    h5: heading("h5"),
+    h6: heading("h6"),
+    inlineCode
+  };
+}
+
 // src/front/chat/components/PiTimelineMessage.tsx
-import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
+var EMPTY_MENTION_CATALOG = { commands: [], skills: [], files: false };
 var COLLAPSIBLE_TOOL_NAMES = /* @__PURE__ */ new Set([
   "read",
   "ls",
@@ -7163,7 +7356,10 @@ var COLLAPSIBLE_TOOL_NAMES = /* @__PURE__ */ new Set([
 function isCollapsibleTool(part) {
   return part.type === "tool-call" && COLLAPSIBLE_TOOL_NAMES.has(part.toolName);
 }
-function PiTimelineMessage({ message, isLast, isStreaming, showThoughts, toolRenderers }) {
+function PiTimelineMessage(props) {
+  return /* @__PURE__ */ jsx25(ChatMessageContributionBoundary, { message: props.message, children: /* @__PURE__ */ jsx25(DefaultPiTimelineMessage, { ...props }) });
+}
+function DefaultPiTimelineMessage({ message, isLast, isStreaming, showThoughts, toolRenderers, mentionCatalog = EMPTY_MENTION_CATALOG, onMentionActivate }) {
   const role = message.role;
   const isAssistant = role === "assistant";
   const textParts = message.parts.filter((part) => part.type === "text");
@@ -7171,6 +7367,31 @@ function PiTimelineMessage({ message, isLast, isStreaming, showThoughts, toolRen
   const finalParts = groupRenderableParts(message);
   const attachmentSummaryPaths = role === "user" ? attachmentPathsFromTextParts(textParts) : [];
   const openArtifact = useOpenArtifact();
+  const effectiveMentionCatalog = useMemo12(() => ({
+    commands: mentionCatalog.commands,
+    skills: mentionCatalog.skills,
+    files: mentionCatalog.files && Boolean(openArtifact)
+  }), [mentionCatalog, openArtifact]);
+  const mentionSignature = [
+    ...effectiveMentionCatalog.commands.map((command) => `command:${command.name}:${command.clickBehavior}`),
+    ...effectiveMentionCatalog.skills.map((skill) => `skill:${skill.name}:${skill.commandName}`),
+    effectiveMentionCatalog.files ? "files:enabled" : "files:disabled"
+  ].join("|");
+  const mentionActivateRef = useRef10(onMentionActivate);
+  mentionActivateRef.current = onMentionActivate;
+  const activateCurrentMention = useCallback13((mention) => {
+    if (mention.kind === "file") {
+      openArtifact?.(mention.path);
+      return;
+    }
+    mentionActivateRef.current?.(mention);
+  }, [openArtifact]);
+  const hasMentions = effectiveMentionCatalog.files || effectiveMentionCatalog.commands.length > 0 || effectiveMentionCatalog.skills.length > 0;
+  const mentionsEnabled = Boolean(isAssistant && !(isStreaming && isLast) && hasMentions);
+  const mentionMarkdownComponents = useMemo12(
+    () => mentionsEnabled ? createMessageMentionMarkdownComponents(effectiveMentionCatalog, activateCurrentMention) : void 0,
+    [activateCurrentMention, effectiveMentionCatalog, mentionSignature, mentionsEnabled]
+  );
   const shouldReserveStreamingActions = isStreaming && isAssistant && isLast;
   return /* @__PURE__ */ jsxs20(
     Message,
@@ -7180,118 +7401,93 @@ function PiTimelineMessage({ message, isLast, isStreaming, showThoughts, toolRen
       "data-boring-agent-message-id": message.id,
       "data-boring-agent-message-role": role,
       "data-boring-agent-message-status": message.status,
-      className: "!max-w-full !gap-1.5",
       children: [
-        /* @__PURE__ */ jsxs20(
-          MessageContent,
-          {
-            className: cn(
-              "!overflow-visible text-[13px] leading-relaxed text-foreground",
-              role === "user" ? cn(
-                "!ml-auto !max-w-[80%] !rounded-[var(--radius-lg)]",
-                "!px-4 !py-2.5",
-                "!bg-secondary !text-secondary-foreground"
-              ) : "!w-full !bg-transparent !p-0"
-            ),
-            children: [
-              fileParts.length > 0 ? /* @__PURE__ */ jsx22(
-                Attachments,
-                {
-                  variant: role === "user" ? "inline" : "list",
-                  className: cn(
-                    role === "user" ? "mb-2 w-full gap-2" : "gap-1.5",
-                    role === "user" ? "[&>div]:max-w-full [&>div]:border-input/60 [&>div]:bg-background/35 [&>div]:px-1.5 [&>div]:text-secondary-foreground [&>div:hover]:bg-background/45" : void 0
-                  ),
-                  children: fileParts.map((file, index) => {
-                    const openPath = file.path ?? attachmentSummaryPaths[index];
-                    const openUrl = file.url && !openPath ? file.url : void 0;
-                    const canOpen = Boolean(openArtifact && openPath || openUrl);
-                    const openAttachment = () => {
-                      if (openPath) {
-                        if (file.filesystem) openArtifact?.(openPath, { filesystem: file.filesystem });
-                        else openArtifact?.(openPath);
-                        return;
-                      }
-                      if (openUrl) window.open(openUrl, "_blank", "noopener,noreferrer");
-                    };
-                    const openAttachmentFromKeyboard = (event) => {
-                      if (event.key !== "Enter" && event.key !== " ") return;
-                      event.preventDefault();
-                      openAttachment();
-                    };
-                    return /* @__PURE__ */ jsxs20(
-                      Attachment,
-                      {
-                        data: toAttachmentData(file, `file-${message.id}-${index}`),
-                        ...canOpen ? {
-                          role: "button",
-                          tabIndex: 0,
-                          title: openPath ? `Open ${openPath} in workspace` : `Open ${file.filename ?? "attachment"}`,
-                          "aria-label": openPath ? `Open ${file.filename ?? openPath} in workspace` : `Open ${file.filename ?? "attachment"}`,
-                          ...openPath ? { "data-workspace-path": openPath } : {},
-                          onClick: openAttachment,
-                          onKeyDown: openAttachmentFromKeyboard
-                        } : void 0,
-                        children: [
-                          /* @__PURE__ */ jsx22(AttachmentPreview, { className: role === "user" ? "!size-5 shrink-0 rounded-[var(--radius-sm)]" : "size-10 shrink-0 rounded-[var(--radius-md)]" }),
-                          /* @__PURE__ */ jsx22(AttachmentInfo, { className: role === "user" ? "min-w-0 max-w-[220px] flex-1 text-[12px]" : "min-w-0 flex-1" })
-                        ]
-                      },
-                      `file-${message.id}-${index}`
-                    );
-                  })
-                }
-              ) : null,
-              finalParts.map((item) => {
-                if (item.kind === "reasoning") {
-                  return /* @__PURE__ */ jsx22(
-                    TimelineReasoningPart,
-                    {
-                      item,
-                      showThoughts
-                    },
-                    item.key
-                  );
-                }
-                if (item.kind === "tool-group") {
-                  return /* @__PURE__ */ jsx22("div", { "data-boring-agent-part": "message-tools", children: /* @__PURE__ */ jsx22(ToolCallGroup, { tools: item.tools, mergedToolRenderers: toolRenderers }) }, item.key);
-                }
-                if (item.kind === "tool-plain") {
-                  return /* @__PURE__ */ jsx22("div", { "data-boring-agent-part": "message-tools", children: /* @__PURE__ */ jsx22(PlainToolCard, { part: item.part, renderers: toolRenderers }) }, item.key);
-                }
-                if (item.part.type === "text") {
-                  const text = textForMessageDisplay(item.part.text, role);
-                  if (!text) return null;
-                  return /* @__PURE__ */ jsx22("div", { "data-boring-agent-part": "message-text", children: /* @__PURE__ */ jsx22(
-                    MessageResponse,
-                    {
-                      className: cn(
-                        "max-w-none",
-                        "prose prose-invert prose-neutral",
-                        "prose-p:my-3 prose-p:leading-[1.7] prose-p:text-[13px]",
-                        "prose-headings:mt-5 prose-headings:mb-2 prose-headings:font-semibold prose-headings:tracking-[-0.01em]",
-                        "prose-ul:my-3 prose-ul:pl-6 prose-ol:my-3 prose-ol:pl-6",
-                        "prose-li:my-1.5 prose-li:leading-[1.7] prose-li:pl-1 prose-li:marker:text-muted-foreground/70",
-                        "prose-strong:font-semibold prose-strong:text-foreground",
-                        "prose-em:text-foreground/90",
-                        "prose-a:text-[color:var(--accent)] prose-a:underline-offset-4 hover:prose-a:underline",
-                        "prose-code:before:content-none prose-code:after:content-none",
-                        "prose-pre:my-0 prose-pre:rounded-none prose-pre:border-0",
-                        "prose-pre:bg-transparent prose-pre:p-0"
-                      ),
-                      children: text
-                    }
-                  ) }, item.key);
-                }
-                if (item.part.type === "notice") {
-                  return /* @__PURE__ */ jsx22(NoticeBubble, { level: item.part.level, text: item.part.text }, item.key);
-                }
-                return null;
+        /* @__PURE__ */ jsxs20(MessageContent, { children: [
+          fileParts.length > 0 ? /* @__PURE__ */ jsx25(
+            Attachments,
+            {
+              variant: role === "user" ? "inline" : "list",
+              className: cn(
+                role === "user" ? "mb-2 w-full gap-2" : "gap-1.5",
+                role === "user" ? "[&>div]:max-w-full [&>div]:border-input/60 [&>div]:bg-background/35 [&>div]:px-1.5 [&>div]:text-secondary-foreground [&>div:hover]:bg-background/45" : void 0
+              ),
+              children: fileParts.map((file, index) => {
+                const openPath = file.path ?? attachmentSummaryPaths[index];
+                const openUrl = file.url && !openPath ? file.url : void 0;
+                const canOpen = Boolean(openArtifact && openPath || openUrl);
+                const openAttachment = () => {
+                  if (openPath) {
+                    if (file.filesystem) openArtifact?.(openPath, { filesystem: file.filesystem });
+                    else openArtifact?.(openPath);
+                    return;
+                  }
+                  if (openUrl) window.open(openUrl, "_blank", "noopener,noreferrer");
+                };
+                const openAttachmentFromKeyboard = (event) => {
+                  if (event.key !== "Enter" && event.key !== " ") return;
+                  event.preventDefault();
+                  openAttachment();
+                };
+                return /* @__PURE__ */ jsxs20(
+                  Attachment,
+                  {
+                    data: toAttachmentData(file, `file-${message.id}-${index}`),
+                    ...canOpen ? {
+                      role: "button",
+                      tabIndex: 0,
+                      title: openPath ? `Open ${openPath} in workspace` : `Open ${file.filename ?? "attachment"}`,
+                      "aria-label": openPath ? `Open ${file.filename ?? openPath} in workspace` : `Open ${file.filename ?? "attachment"}`,
+                      ...openPath ? { "data-workspace-path": openPath } : {},
+                      onClick: openAttachment,
+                      onKeyDown: openAttachmentFromKeyboard
+                    } : void 0,
+                    children: [
+                      /* @__PURE__ */ jsx25(AttachmentPreview, { className: role === "user" ? "!size-5 shrink-0 rounded-[var(--radius-sm)]" : "size-10 shrink-0 rounded-[var(--radius-md)]" }),
+                      /* @__PURE__ */ jsx25(AttachmentInfo, { className: role === "user" ? "min-w-0 max-w-[220px] flex-1 text-[12px]" : "min-w-0 flex-1" })
+                    ]
+                  },
+                  `file-${message.id}-${index}`
+                );
               })
-            ]
-          }
-        ),
-        isAssistant && (textParts.length > 0 || shouldReserveStreamingActions) ? /* @__PURE__ */ jsx22(
+            }
+          ) : null,
+          finalParts.map((item) => {
+            if (item.kind === "reasoning") {
+              return /* @__PURE__ */ jsx25(
+                TimelineReasoningPart,
+                {
+                  item,
+                  showThoughts
+                },
+                item.key
+              );
+            }
+            if (item.kind === "tool-group") {
+              return /* @__PURE__ */ jsx25("div", { "data-boring-agent-part": "message-tools", children: /* @__PURE__ */ jsx25(ToolCallGroup, { tools: item.tools, mergedToolRenderers: toolRenderers }) }, item.key);
+            }
+            if (item.kind === "tool-plain") {
+              return /* @__PURE__ */ jsx25("div", { "data-boring-agent-part": "message-tools", children: /* @__PURE__ */ jsx25(PlainToolCard, { part: item.part, renderers: toolRenderers }) }, item.key);
+            }
+            if (item.part.type === "text") {
+              const text = textForMessageDisplay(item.part.text, role);
+              if (!text) return null;
+              return /* @__PURE__ */ jsx25("div", { "data-boring-agent-part": "message-text", children: /* @__PURE__ */ jsx25(
+                MessageResponse,
+                {
+                  components: mentionMarkdownComponents,
+                  className: "boring-agent-markdown max-w-none",
+                  children: text
+                },
+                `${mentionSignature || "no-message-mentions"}:${mentionsEnabled ? "enabled" : "static"}`
+              ) }, item.key);
+            }
+            if (item.part.type === "notice") {
+              return /* @__PURE__ */ jsx25(NoticeBubble, { level: item.part.level, text: item.part.text }, item.key);
+            }
+            return null;
+          })
+        ] }),
+        isAssistant && (textParts.length > 0 || shouldReserveStreamingActions) ? /* @__PURE__ */ jsx25(
           MessageActionsBar,
           {
             text: textParts.map((part) => part.text).join("\n\n"),
@@ -7326,15 +7522,15 @@ function TimelineReasoningPart({ item, showThoughts }) {
       onOpenChange: handleOpenChange,
       autoClose: false,
       children: [
-        /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx25(
           ReasoningTrigger,
           {
             className: "mb-1 w-fit rounded-[var(--radius-sm)] px-0 py-0 !text-xs !font-normal !text-muted-foreground/75 hover:bg-transparent hover:!text-muted-foreground/75 [&_svg]:!text-muted-foreground/75",
-            getThinkingMessage: (streaming) => /* @__PURE__ */ jsx22("span", { children: streaming ? "thinking" : "thoughts" }),
+            getThinkingMessage: (streaming) => /* @__PURE__ */ jsx25("span", { children: streaming ? "thinking" : "thoughts" }),
             onClick: toggleManualOpen
           }
         ),
-        /* @__PURE__ */ jsx22(ReasoningContent, { children: item.text })
+        /* @__PURE__ */ jsx25(ReasoningContent, { children: item.text })
       ]
     }
   );
@@ -7343,7 +7539,7 @@ function PlainToolCard({ part, renderers }) {
   const toolPart = toToolPart(part);
   if (!toolPart) return null;
   const { renderer, part: resolved, resolution } = resolveToolRendererForPart(toolPart, renderers);
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "data-tool-call-id": resolved.toolCallId,
@@ -7392,13 +7588,13 @@ ${part.text}`;
   return grouped;
 }
 function NoticeBubble({ level, text }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "data-boring-agent-part": "message-notice",
       "data-notice-level": level,
       className: noticeSurfaceClass(level, "text-xs"),
-      children: /* @__PURE__ */ jsx22("div", { className: noticeTextClass(), children: text })
+      children: /* @__PURE__ */ jsx25("div", { className: noticeTextClass(), children: text })
     }
   );
 }
@@ -7477,7 +7673,7 @@ function MessageActionsBar({
     "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-[color:var(--accent)]/40"
   );
   const hiddenActionProps = visible ? {} : { tabIndex: -1 };
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "aria-hidden": !visible,
@@ -7485,7 +7681,7 @@ function MessageActionsBar({
         "flex min-h-6 items-center gap-0.5 -mt-1 transition-opacity duration-200",
         visible ? "opacity-100" : "pointer-events-none opacity-0"
       ),
-      children: /* @__PURE__ */ jsx22(
+      children: /* @__PURE__ */ jsx25(
         Button11,
         {
           type: "button",
@@ -7496,7 +7692,7 @@ function MessageActionsBar({
           "aria-label": copied ? "Copied" : "Copy message",
           title: copied ? "Copied" : "Copy",
           ...hiddenActionProps,
-          children: copied ? /* @__PURE__ */ jsx22(CheckIcon2, { className: "h-3.5 w-3.5 text-[color:var(--accent)]" }) : /* @__PURE__ */ jsx22(CopyIcon3, { className: "h-3.5 w-3.5" })
+          children: copied ? /* @__PURE__ */ jsx25(CheckIcon2, { className: "h-3.5 w-3.5 text-[color:var(--accent)]" }) : /* @__PURE__ */ jsx25(CopyIcon3, { className: "h-3.5 w-3.5" })
         }
       )
     }
@@ -7517,7 +7713,7 @@ function partKey(messageId, part, index) {
 }
 
 // src/front/chat/components/PiConversationSurface.tsx
-import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
 var TRANSCRIPT_WINDOW = 60;
 var TRANSCRIPT_WINDOW_STEP = 40;
 var LOAD_OLDER_THRESHOLD_PX = 320;
@@ -7531,6 +7727,8 @@ function PiConversationSurface({
   isStreaming,
   showThoughts,
   toolRenderers,
+  mentionCatalog,
+  onMentionActivate,
   runtimeNotices,
   onDismissNotice,
   renderNoticeAction,
@@ -7565,10 +7763,10 @@ function PiConversationSurface({
           emptyHero && "py-4 text-center"
         ), children: [
           messages.length === 0 && emptyStateHydrating ? /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2 rounded-xl border border-border bg-card/70 px-4 py-3 text-sm text-muted-foreground", children: [
-            /* @__PURE__ */ jsx23(Loader22, { className: "h-4 w-4 animate-spin" }),
+            /* @__PURE__ */ jsx26(Loader22, { className: "h-4 w-4 animate-spin" }),
             "Loading chat history\u2026"
           ] }) : null,
-          messages.length === 0 && !emptyStateHydrating ? /* @__PURE__ */ jsx23(
+          messages.length === 0 && !emptyStateHydrating ? /* @__PURE__ */ jsx26(
             ChatEmptyState,
             {
               eyebrow: emptyState?.eyebrow,
@@ -7586,29 +7784,31 @@ function PiConversationSurface({
               }
             }
           ) : null,
-          hasOlder ? /* @__PURE__ */ jsx23(TranscriptHistoryLoader, { olderCount, onLoadOlder: loadOlder }) : null,
-          visibleItems.map(({ message, key }, index) => /* @__PURE__ */ jsx23(
+          hasOlder ? /* @__PURE__ */ jsx26(TranscriptHistoryLoader, { olderCount, onLoadOlder: loadOlder }) : null,
+          visibleItems.map(({ message, key }, index) => /* @__PURE__ */ jsx26(
             PiTimelineMessage,
             {
               message,
               isLast: index === visibleItems.length - 1,
               isStreaming,
               showThoughts,
-              toolRenderers
+              toolRenderers,
+              mentionCatalog,
+              onMentionActivate
             },
             key
           )),
-          /* @__PURE__ */ jsx23(RuntimeNoticeMessages, { notices: runtimeNotices, onDismiss: onDismissNotice, renderAction: renderNoticeAction })
+          /* @__PURE__ */ jsx26(RuntimeNoticeMessages, { notices: runtimeNotices, onDismiss: onDismissNotice, renderAction: renderNoticeAction })
         ] }),
-        /* @__PURE__ */ jsx23(ConversationScrollButton, {})
+        /* @__PURE__ */ jsx26(ConversationScrollButton, {})
       ]
     }
   );
 }
 function TranscriptHistoryLoader({ olderCount, onLoadOlder }) {
   const { scrollRef } = useStickToBottomContext2();
-  const pendingAnchor = useRef10(null);
-  const armed = useRef10(true);
+  const pendingAnchor = useRef11(null);
+  const armed = useRef11(true);
   useEffect14(() => {
     const el = scrollRef.current;
     if (!el) return;
@@ -7632,7 +7832,7 @@ function TranscriptHistoryLoader({ olderCount, onLoadOlder }) {
     }
     if (el.scrollTop > LOAD_OLDER_THRESHOLD_PX) armed.current = true;
   });
-  return /* @__PURE__ */ jsx23("div", { className: "flex justify-center", "data-boring-agent-part": "transcript-load-older", children: /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsx26("div", { className: "flex justify-center", "data-boring-agent-part": "transcript-load-older", children: /* @__PURE__ */ jsxs21(
     "button",
     {
       type: "button",
@@ -7673,10 +7873,10 @@ import { useCallback as useCallback16, useLayoutEffect as useLayoutEffect2 } fro
 import { motion as motion2 } from "motion/react";
 
 // src/front/composer/PluginUpdateStatus.tsx
-import { useEffect as useEffect15, useRef as useRef11 } from "react";
+import { useEffect as useEffect15, useRef as useRef12 } from "react";
 
 // src/front/composer/ComposerStatusBanner.tsx
-import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
 function ComposerStatusBanner({
   tone,
   dataAttribute,
@@ -7705,8 +7905,8 @@ function ComposerStatusBanner({
           maxWidthClassName
         ),
         children: [
-          /* @__PURE__ */ jsx24("span", { className: "inline-block h-2 w-2 animate-pulse rounded-full bg-accent", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx24("span", { children: runningContent })
+          /* @__PURE__ */ jsx27("span", { className: "inline-block h-2 w-2 animate-pulse rounded-full bg-accent", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx27("span", { children: runningContent })
         ]
       }
     );
@@ -7725,12 +7925,12 @@ function ComposerStatusBanner({
         ),
         children: [
           /* @__PURE__ */ jsxs22("div", { className: "flex items-start gap-2", children: [
-            /* @__PURE__ */ jsx24("span", { className: "mt-0.5 text-[oklch(0.45_0.13_148)]", "aria-hidden": "true", children: "\u2713" }),
+            /* @__PURE__ */ jsx27("span", { className: "mt-0.5 text-[oklch(0.45_0.13_148)]", "aria-hidden": "true", children: "\u2713" }),
             /* @__PURE__ */ jsxs22("span", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsx24("span", { className: "block font-medium leading-5", children: title }),
-              detail ? /* @__PURE__ */ jsx24("span", { className: "block leading-4 text-muted-foreground", children: detail }) : null
+              /* @__PURE__ */ jsx27("span", { className: "block font-medium leading-5", children: title }),
+              detail ? /* @__PURE__ */ jsx27("span", { className: "block leading-4 text-muted-foreground", children: detail }) : null
             ] }),
-            onDismiss ? /* @__PURE__ */ jsx24(
+            onDismiss ? /* @__PURE__ */ jsx27(
               "button",
               {
                 type: "button",
@@ -7759,9 +7959,9 @@ function ComposerStatusBanner({
       ),
       children: [
         /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx24("span", { className: "text-destructive", "aria-hidden": "true", children: "\u26A0" }),
-          /* @__PURE__ */ jsx24("span", { className: "flex-1 font-medium", children: title }),
-          onRetry ? /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx27("span", { className: "text-destructive", "aria-hidden": "true", children: "\u26A0" }),
+          /* @__PURE__ */ jsx27("span", { className: "flex-1 font-medium", children: title }),
+          onRetry ? /* @__PURE__ */ jsx27(
             "button",
             {
               type: "button",
@@ -7770,7 +7970,7 @@ function ComposerStatusBanner({
               children: retryLabel
             }
           ) : null,
-          onDismiss ? /* @__PURE__ */ jsx24(
+          onDismiss ? /* @__PURE__ */ jsx27(
             "button",
             {
               type: "button",
@@ -7781,14 +7981,14 @@ function ComposerStatusBanner({
             }
           ) : null
         ] }),
-        message ? /* @__PURE__ */ jsx24("pre", { className: "mt-2 whitespace-pre-wrap break-words text-[11px] text-destructive/90", children: message }) : null
+        message ? /* @__PURE__ */ jsx27("pre", { className: "mt-2 whitespace-pre-wrap break-words text-[11px] text-destructive/90", children: message }) : null
       ]
     }
   );
 }
 
 // src/front/composer/PluginUpdateStatus.tsx
-import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
 function PluginUpdateStatus({
   state,
   onDismiss,
@@ -7796,7 +7996,7 @@ function PluginUpdateStatus({
   successAutoDismissMs = 1400,
   maxWidthClassName = "max-w-3xl"
 }) {
-  const onDismissRef = useRef11(onDismiss);
+  const onDismissRef = useRef12(onDismiss);
   useEffect15(() => {
     onDismissRef.current = onDismiss;
   }, [onDismiss]);
@@ -7810,7 +8010,7 @@ function PluginUpdateStatus({
   }, [state?.kind, successDismissKey, successAutoDismissMs]);
   if (!state) return null;
   if (state.kind === "running") {
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx28(
       ComposerStatusBanner,
       {
         tone: "running",
@@ -7848,7 +8048,7 @@ function PluginUpdateStatus({
               ),
               children: [
                 /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-1.5 font-medium text-[oklch(0.48_0.15_60)]", children: [
-                  /* @__PURE__ */ jsx25("span", { "aria-hidden": "true", children: "\u26A0" }),
+                  /* @__PURE__ */ jsx28("span", { "aria-hidden": "true", children: "\u26A0" }),
                   /* @__PURE__ */ jsxs23("span", { children: [
                     "Reload diagnostics for ",
                     diagnostics.length,
@@ -7856,8 +8056,8 @@ function PluginUpdateStatus({
                     diagnostics.length === 1 ? "" : "s"
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx25("ul", { className: "mt-1 ml-4 list-disc text-foreground/85", children: diagnostics.map((diagnostic, index) => /* @__PURE__ */ jsxs23("li", { children: [
-                  /* @__PURE__ */ jsx25("code", { className: "font-mono text-[10.5px]", children: diagnostic.pluginId ?? diagnostic.source ?? "plugin" }),
+                /* @__PURE__ */ jsx28("ul", { className: "mt-1 ml-4 list-disc text-foreground/85", children: diagnostics.map((diagnostic, index) => /* @__PURE__ */ jsxs23("li", { children: [
+                  /* @__PURE__ */ jsx28("code", { className: "font-mono text-[10.5px]", children: diagnostic.pluginId ?? diagnostic.source ?? "plugin" }),
                   " \u2014 ",
                   diagnostic.message ?? "reload diagnostic"
                 ] }, `${diagnostic.pluginId ?? diagnostic.source ?? "plugin"}-${index}`)) })
@@ -7874,7 +8074,7 @@ function PluginUpdateStatus({
               ),
               children: [
                 /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-1.5 font-medium text-[oklch(0.48_0.15_60)]", children: [
-                  /* @__PURE__ */ jsx25("span", { "aria-hidden": "true", children: "\u26A0" }),
+                  /* @__PURE__ */ jsx28("span", { "aria-hidden": "true", children: "\u26A0" }),
                   /* @__PURE__ */ jsxs23("span", { children: [
                     "Restart needed for ",
                     warnings.length,
@@ -7882,12 +8082,12 @@ function PluginUpdateStatus({
                     warnings.length === 1 ? "" : "s"
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx25("ul", { className: "mt-1 ml-4 list-disc text-foreground/85", children: warnings.map((w) => /* @__PURE__ */ jsxs23("li", { children: [
-                  /* @__PURE__ */ jsx25("code", { className: "font-mono text-[10.5px]", children: w.id }),
+                /* @__PURE__ */ jsx28("ul", { className: "mt-1 ml-4 list-disc text-foreground/85", children: warnings.map((w) => /* @__PURE__ */ jsxs23("li", { children: [
+                  /* @__PURE__ */ jsx28("code", { className: "font-mono text-[10.5px]", children: w.id }),
                   " \u2014 ",
                   w.surfaces.join(" + ")
                 ] }, w.id)) }),
-                /* @__PURE__ */ jsx25("p", { className: "mt-1 text-foreground/70", children: "The interface reloaded successfully, but routes and tools were wired at boot. Restart the workspace process to pick up the new code." })
+                /* @__PURE__ */ jsx28("p", { className: "mt-1 text-foreground/70", children: "The interface reloaded successfully, but routes and tools were wired at boot. Restart the workspace process to pick up the new code." })
               ]
             }
           ) : null
@@ -7895,7 +8095,7 @@ function PluginUpdateStatus({
       }
     );
   }
-  return /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsx28(
     ComposerStatusBanner,
     {
       tone: "error",
@@ -7912,15 +8112,15 @@ function PluginUpdateStatus({
 }
 
 // src/front/composer/CommandRunStatus.tsx
-import { useEffect as useEffect16, useRef as useRef12 } from "react";
-import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
+import { useEffect as useEffect16, useRef as useRef13 } from "react";
+import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
 function CommandRunStatus({
   state,
   onDismiss,
   successAutoDismissMs = 1400,
   maxWidthClassName = "max-w-3xl"
 }) {
-  const onDismissRef = useRef12(onDismiss);
+  const onDismissRef = useRef13(onDismiss);
   useEffect16(() => {
     onDismissRef.current = onDismiss;
   }, [onDismiss]);
@@ -7932,13 +8132,13 @@ function CommandRunStatus({
   }, [state?.kind, successKey, successAutoDismissMs]);
   if (!state) return null;
   if (state.kind === "running") {
-    return /* @__PURE__ */ jsx26(
+    return /* @__PURE__ */ jsx29(
       ComposerStatusBanner,
       {
         tone: "running",
         dataAttribute: "data-boring-command-run",
         maxWidthClassName,
-        runningContent: state.command ? /* @__PURE__ */ jsxs24(Fragment7, { children: [
+        runningContent: state.command ? /* @__PURE__ */ jsxs24(Fragment9, { children: [
           " Running ",
           /* @__PURE__ */ jsxs24("code", { className: "font-mono", children: [
             "/",
@@ -7950,13 +8150,13 @@ function CommandRunStatus({
     );
   }
   if (state.kind === "success") {
-    return /* @__PURE__ */ jsx26(
+    return /* @__PURE__ */ jsx29(
       ComposerStatusBanner,
       {
         tone: "success",
         dataAttribute: "data-boring-command-run",
         maxWidthClassName,
-        title: state.command ? /* @__PURE__ */ jsxs24(Fragment7, { children: [
+        title: state.command ? /* @__PURE__ */ jsxs24(Fragment9, { children: [
           " Ran ",
           /* @__PURE__ */ jsxs24("code", { className: "font-mono", children: [
             "/",
@@ -7970,13 +8170,13 @@ function CommandRunStatus({
       }
     );
   }
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx29(
     ComposerStatusBanner,
     {
       tone: "error",
       dataAttribute: "data-boring-command-run",
       maxWidthClassName,
-      title: state.command ? /* @__PURE__ */ jsxs24(Fragment7, { children: [
+      title: state.command ? /* @__PURE__ */ jsxs24(Fragment9, { children: [
         " ",
         /* @__PURE__ */ jsxs24("code", { className: "font-mono", children: [
           "/",
@@ -7992,7 +8192,7 @@ function CommandRunStatus({
 }
 
 // src/front/chatPanelComposerControls.tsx
-import { forwardRef, useEffect as useEffect17, useRef as useRef13, useState as useState16 } from "react";
+import { forwardRef, useEffect as useEffect17, useRef as useRef14, useState as useState16 } from "react";
 import { CheckIcon as CheckIcon3, ChevronDownIcon as ChevronDownIcon5 } from "lucide-react";
 import {
   Command,
@@ -8026,7 +8226,7 @@ function displayProviderLabel(provider) {
 }
 
 // src/front/chatPanelComposerControls.tsx
-import { Fragment as Fragment8, jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
 var composerActionClass = cn(
   "inline-flex h-8 items-center justify-center gap-1.5 rounded-[var(--radius-md)] border-0 bg-transparent",
   "text-muted-foreground shadow-none transition",
@@ -8094,7 +8294,7 @@ function useDismissOnOutsidePointer(ref, onClose) {
 }
 function ThinkingLevelGlyph({ level }) {
   const lit = level === "off" ? 0 : level === "low" ? 1 : level === "medium" ? 2 : 3;
-  return /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx30(
     "svg",
     {
       "aria-hidden": "true",
@@ -8103,7 +8303,7 @@ function ThinkingLevelGlyph({ level }) {
       viewBox: "0 0 14 14",
       fill: "none",
       className: "shrink-0",
-      children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx27(
+      children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx30(
         "rect",
         {
           x: 2 + i * 4,
@@ -8149,7 +8349,7 @@ var ModelSelectTrigger = forwardRef(function ModelSelectTrigger2({
 }, ref) {
   const triggerLabel = modelTriggerLabel(value, options, emptyLabel);
   const triggerDisplay = value ? `${triggerLabel} (${displayProviderLabel(value.provider)})` : triggerLabel;
-  return /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx30(
     "button",
     {
       ref,
@@ -8167,12 +8367,12 @@ var ModelSelectTrigger = forwardRef(function ModelSelectTrigger2({
         className
       ),
       ...props,
-      children: trigger === "slash" ? /* @__PURE__ */ jsxs25(Fragment8, { children: [
-        /* @__PURE__ */ jsx27("span", { className: "text-muted-foreground", children: "/model: " }),
-        /* @__PURE__ */ jsx27("span", { className: "text-foreground", children: triggerDisplay })
-      ] }) : /* @__PURE__ */ jsxs25(Fragment8, { children: [
-        /* @__PURE__ */ jsx27("span", { className: "min-w-0 truncate", children: triggerDisplay }),
-        /* @__PURE__ */ jsx27(ChevronDownIcon5, { className: "h-3 w-3 shrink-0 text-muted-foreground/50", "aria-hidden": "true" })
+      children: trigger === "slash" ? /* @__PURE__ */ jsxs25(Fragment10, { children: [
+        /* @__PURE__ */ jsx30("span", { className: "text-muted-foreground", children: "/model: " }),
+        /* @__PURE__ */ jsx30("span", { className: "text-foreground", children: triggerDisplay })
+      ] }) : /* @__PURE__ */ jsxs25(Fragment10, { children: [
+        /* @__PURE__ */ jsx30("span", { className: "min-w-0 truncate", children: triggerDisplay }),
+        /* @__PURE__ */ jsx30(ChevronDownIcon5, { className: "h-3 w-3 shrink-0 text-muted-foreground/50", "aria-hidden": "true" })
       ] })
     }
   );
@@ -8193,8 +8393,8 @@ function ModelPickerMenu({
   const keyboardOptions = hideDefaultOption ? groupedOptions : [null, ...groupedOptions];
   const selectedIndex = currentKey ? Math.max(0, keyboardOptions.findIndex((option) => option && encodeModelKey(option) === currentKey)) : 0;
   const [activeIndex, setActiveIndex] = useState16(selectedIndex);
-  const activeIndexRef = useRef13(selectedIndex);
-  const menuRef = useRef13(null);
+  const activeIndexRef = useRef14(selectedIndex);
+  const menuRef = useRef14(null);
   useDismissOnOutsidePointer(menuRef, onClose);
   const setKeyboardActiveIndex = (next) => {
     const resolved = typeof next === "function" ? next(activeIndexRef.current) : next;
@@ -8229,8 +8429,8 @@ function ModelPickerMenu({
   }, [activeIndex, disabled, keyboardOptions, onChange, onClose]);
   const optionIndexOffset = hideDefaultOption ? 0 : 1;
   const optionIndexes = new Map(groupedOptions.map((option, index) => [encodeModelKey(option), index + optionIndexOffset]));
-  return /* @__PURE__ */ jsx27("div", { ref: menuRef, "data-boring-agent": "", "data-boring-agent-part": "model-picker-menu", className: cn(composerPickerMenuClass, className), children: /* @__PURE__ */ jsxs25(Command, { className: "bg-transparent text-[color:var(--popover-foreground)]", children: [
-    menuOptions.length > 8 && /* @__PURE__ */ jsx27("div", { className: "border-b border-border/60 px-2", children: /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx30("div", { ref: menuRef, "data-boring-agent": "", "data-boring-agent-part": "model-picker-menu", className: cn(composerPickerMenuClass, className), children: /* @__PURE__ */ jsxs25(Command, { className: "bg-transparent text-[color:var(--popover-foreground)]", children: [
+    menuOptions.length > 8 && /* @__PURE__ */ jsx30("div", { className: "border-b border-border/60 px-2", children: /* @__PURE__ */ jsx30(
       CommandInput,
       {
         placeholder: "Search models\u2026",
@@ -8239,8 +8439,8 @@ function ModelPickerMenu({
       }
     ) }),
     /* @__PURE__ */ jsxs25(CommandList, { className: "max-h-[300px] p-0.5", children: [
-      /* @__PURE__ */ jsx27(CommandEmpty, { className: "py-4 text-center text-[13px] text-muted-foreground", children: "No models found" }),
-      !hideDefaultOption ? /* @__PURE__ */ jsx27(CommandGroup, { children: /* @__PURE__ */ jsxs25(
+      /* @__PURE__ */ jsx30(CommandEmpty, { className: "py-4 text-center text-[13px] text-muted-foreground", children: "No models found" }),
+      !hideDefaultOption ? /* @__PURE__ */ jsx30(CommandGroup, { children: /* @__PURE__ */ jsxs25(
         CommandItem,
         {
           value: "Default model automatic auto",
@@ -8251,7 +8451,7 @@ function ModelPickerMenu({
           },
           className: selectorItemClass(!value || activeIndex === 0),
           children: [
-            /* @__PURE__ */ jsx27(
+            /* @__PURE__ */ jsx30(
               CheckIcon3,
               {
                 className: cn(
@@ -8260,12 +8460,12 @@ function ModelPickerMenu({
                 )
               }
             ),
-            /* @__PURE__ */ jsx27("span", { className: "truncate", children: "Default model" }),
-            /* @__PURE__ */ jsx27("span", { className: "ml-auto shrink-0 text-[10px] text-muted-foreground/60", children: "auto" })
+            /* @__PURE__ */ jsx30("span", { className: "truncate", children: "Default model" }),
+            /* @__PURE__ */ jsx30("span", { className: "ml-auto shrink-0 text-[10px] text-muted-foreground/60", children: "auto" })
           ]
         }
       ) }) : null,
-      [...groups.entries()].map(([provider, list]) => /* @__PURE__ */ jsx27(
+      [...groups.entries()].map(([provider, list]) => /* @__PURE__ */ jsx30(
         CommandGroup,
         {
           heading: displayProviderLabel(provider),
@@ -8285,7 +8485,7 @@ function ModelPickerMenu({
                 },
                 className: cn(selectorItemClass(key === currentKey || activeIndex === itemIndex)),
                 children: [
-                  /* @__PURE__ */ jsx27(
+                  /* @__PURE__ */ jsx30(
                     CheckIcon3,
                     {
                       className: cn(
@@ -8294,8 +8494,8 @@ function ModelPickerMenu({
                       )
                     }
                   ),
-                  /* @__PURE__ */ jsx27("span", { className: "min-w-0 flex-1 truncate whitespace-nowrap", children: label }),
-                  /* @__PURE__ */ jsx27("span", { className: "ml-auto max-w-[45%] shrink-0 truncate whitespace-nowrap text-right text-[10px] text-muted-foreground/60", children: m.id })
+                  /* @__PURE__ */ jsx30("span", { className: "min-w-0 flex-1 truncate whitespace-nowrap", children: label }),
+                  /* @__PURE__ */ jsx30("span", { className: "ml-auto max-w-[45%] shrink-0 truncate whitespace-nowrap text-right text-[10px] text-muted-foreground/60", children: m.id })
                 ]
               },
               key
@@ -8321,7 +8521,7 @@ function ModelSelect({
   hideDefaultOption = false
 }) {
   const [open, setOpen] = useState16(false);
-  const previousOpenSignalRef = useRef13(openSignal);
+  const previousOpenSignalRef = useRef14(openSignal);
   useEffect17(() => {
     if (disabled) setOpen(false);
   }, [disabled]);
@@ -8334,7 +8534,7 @@ function ModelSelect({
     previousOpenSignalRef.current = openSignal;
   }, [disabled, openSignal]);
   return /* @__PURE__ */ jsxs25(Popover, { open, onOpenChange: disabled ? void 0 : setOpen, children: [
-    /* @__PURE__ */ jsx27(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx30(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx30(
       ModelSelectTrigger,
       {
         value,
@@ -8348,7 +8548,7 @@ function ModelSelect({
         "aria-describedby": ariaDescribedBy
       }
     ) }),
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx30(
       PopoverContent,
       {
         align: trigger === "slash" ? "center" : "start",
@@ -8357,7 +8557,7 @@ function ModelSelect({
         collisionPadding: 12,
         "data-boring-agent": "",
         className: cn("w-[min(92vw,340px)]", selectorContentClass),
-        children: /* @__PURE__ */ jsx27(
+        children: /* @__PURE__ */ jsx30(
           ModelPickerMenu,
           {
             value,
@@ -8382,7 +8582,7 @@ function ThinkingSelect({
   className
 }) {
   const [open, setOpen] = useState16(false);
-  const previousOpenSignalRef = useRef13(openSignal);
+  const previousOpenSignalRef = useRef14(openSignal);
   useEffect17(() => {
     if (disabled) setOpen(false);
   }, [disabled]);
@@ -8395,7 +8595,7 @@ function ThinkingSelect({
     previousOpenSignalRef.current = openSignal;
   }, [disabled, openSignal]);
   return /* @__PURE__ */ jsxs25(Popover, { open, onOpenChange: disabled ? void 0 : setOpen, children: [
-    /* @__PURE__ */ jsx27(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx30(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx30(
       ThinkingSelectTrigger,
       {
         value,
@@ -8405,7 +8605,7 @@ function ThinkingSelect({
         className
       }
     ) }),
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx30(
       PopoverContent,
       {
         align: trigger === "slash" ? "center" : "end",
@@ -8414,7 +8614,7 @@ function ThinkingSelect({
         collisionPadding: 12,
         "data-boring-agent": "",
         className: cn("w-[min(92vw,240px)]", selectorContentClass),
-        children: /* @__PURE__ */ jsx27(
+        children: /* @__PURE__ */ jsx30(
           ThinkingPickerMenu,
           {
             value,
@@ -8458,13 +8658,13 @@ var ThinkingSelectTrigger = forwardRef(function ThinkingSelectTrigger2({
       onClick,
       ...props,
       children: [
-        trigger === "button" ? /* @__PURE__ */ jsx27(ThinkingLevelGlyph, { level: value }) : null,
-        trigger === "slash" ? /* @__PURE__ */ jsxs25(Fragment8, { children: [
-          /* @__PURE__ */ jsx27("span", { className: "text-muted-foreground", children: "/thinking: " }),
-          /* @__PURE__ */ jsx27("span", { className: "text-foreground", children: THINKING_LEVEL_STATUS_LABELS[value] })
-        ] }) : /* @__PURE__ */ jsxs25(Fragment8, { children: [
-          /* @__PURE__ */ jsx27("span", { children: THINKING_LEVEL_LABELS[value] }),
-          /* @__PURE__ */ jsx27(ChevronDownIcon5, { className: "h-3 w-3 shrink-0 text-muted-foreground/50", "aria-hidden": "true" })
+        trigger === "button" ? /* @__PURE__ */ jsx30(ThinkingLevelGlyph, { level: value }) : null,
+        trigger === "slash" ? /* @__PURE__ */ jsxs25(Fragment10, { children: [
+          /* @__PURE__ */ jsx30("span", { className: "text-muted-foreground", children: "/thinking: " }),
+          /* @__PURE__ */ jsx30("span", { className: "text-foreground", children: THINKING_LEVEL_STATUS_LABELS[value] })
+        ] }) : /* @__PURE__ */ jsxs25(Fragment10, { children: [
+          /* @__PURE__ */ jsx30("span", { children: THINKING_LEVEL_LABELS[value] }),
+          /* @__PURE__ */ jsx30(ChevronDownIcon5, { className: "h-3 w-3 shrink-0 text-muted-foreground/50", "aria-hidden": "true" })
         ] })
       ]
     }
@@ -8479,8 +8679,8 @@ function ThinkingPickerMenu({
 }) {
   const selectedIndex = Math.max(0, THINKING_LEVELS.indexOf(value));
   const [activeIndex, setActiveIndex] = useState16(selectedIndex);
-  const activeIndexRef = useRef13(selectedIndex);
-  const menuRef = useRef13(null);
+  const activeIndexRef = useRef14(selectedIndex);
+  const menuRef = useRef14(null);
   useDismissOnOutsidePointer(menuRef, onClose);
   const setKeyboardActiveIndex = (next) => {
     const resolved = typeof next === "function" ? next(activeIndexRef.current) : next;
@@ -8513,7 +8713,7 @@ function ThinkingPickerMenu({
     window.addEventListener("keydown", handler, { capture: true });
     return () => window.removeEventListener("keydown", handler, { capture: true });
   }, [activeIndex, disabled, onChange, onClose]);
-  return /* @__PURE__ */ jsx27("div", { ref: menuRef, "data-boring-agent": "", "data-boring-agent-part": "thinking-picker-menu", className: cn(composerPickerMenuClass, className), children: /* @__PURE__ */ jsx27(Command, { className: "bg-transparent text-[color:var(--popover-foreground)]", children: /* @__PURE__ */ jsx27(CommandList, { className: "max-h-[300px] p-0.5", children: THINKING_LEVELS.map((level, index) => /* @__PURE__ */ jsxs25(
+  return /* @__PURE__ */ jsx30("div", { ref: menuRef, "data-boring-agent": "", "data-boring-agent-part": "thinking-picker-menu", className: cn(composerPickerMenuClass, className), children: /* @__PURE__ */ jsx30(Command, { className: "bg-transparent text-[color:var(--popover-foreground)]", children: /* @__PURE__ */ jsx30(CommandList, { className: "max-h-[300px] p-0.5", children: THINKING_LEVELS.map((level, index) => /* @__PURE__ */ jsxs25(
     CommandItem,
     {
       value: `Thinking ${THINKING_LEVEL_LABELS[level]} ${THINKING_LEVEL_DETAILS[level]}`,
@@ -8524,7 +8724,7 @@ function ThinkingPickerMenu({
       },
       className: selectorItemClass(level === value || index === activeIndex),
       children: [
-        /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx30(
           CheckIcon3,
           {
             className: cn(
@@ -8533,9 +8733,9 @@ function ThinkingPickerMenu({
             )
           }
         ),
-        /* @__PURE__ */ jsx27(ThinkingLevelGlyph, { level }),
-        /* @__PURE__ */ jsx27("span", { className: "font-medium", children: THINKING_LEVEL_LABELS[level] }),
-        /* @__PURE__ */ jsx27("span", { className: "ml-auto text-[11px] text-muted-foreground/65", children: THINKING_LEVEL_DETAILS[level] })
+        /* @__PURE__ */ jsx30(ThinkingLevelGlyph, { level }),
+        /* @__PURE__ */ jsx30("span", { className: "font-medium", children: THINKING_LEVEL_LABELS[level] }),
+        /* @__PURE__ */ jsx30("span", { className: "ml-auto text-[11px] text-muted-foreground/65", children: THINKING_LEVEL_DETAILS[level] })
       ]
     },
     level
@@ -8576,22 +8776,22 @@ import {
   XIcon as XIcon5
 } from "lucide-react";
 import { nanoid } from "nanoid";
-import { useCallback as useCallback15, useEffect as useEffect18, useMemo as useMemo10, useRef as useRef14, useState as useState17 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect18, useMemo as useMemo13, useRef as useRef15, useState as useState17 } from "react";
 
 // src/front/primitives/prompt-input-context.ts
-import { createContext as createContext6, useContext as useContext6 } from "react";
-var PromptInputController = createContext6(
+import { createContext as createContext8, useContext as useContext8 } from "react";
+var PromptInputController = createContext8(
   null
 );
-var ProviderAttachmentsContext = createContext6(
+var ProviderAttachmentsContext = createContext8(
   null
 );
-var useOptionalPromptInputController = () => useContext6(PromptInputController);
-var useOptionalProviderAttachments = () => useContext6(ProviderAttachmentsContext);
-var LocalAttachmentsContext = createContext6(null);
+var useOptionalPromptInputController = () => useContext8(PromptInputController);
+var useOptionalProviderAttachments = () => useContext8(ProviderAttachmentsContext);
+var LocalAttachmentsContext = createContext8(null);
 var usePromptInputAttachments = () => {
   const provider = useOptionalProviderAttachments();
-  const local = useContext6(LocalAttachmentsContext);
+  const local = useContext8(LocalAttachmentsContext);
   const context = local ?? provider;
   if (!context) {
     throw new Error(
@@ -8600,7 +8800,7 @@ var usePromptInputAttachments = () => {
   }
   return context;
 };
-var LocalReferencedSourcesContext = createContext6(null);
+var LocalReferencedSourcesContext = createContext8(null);
 
 // src/front/primitives/prompt-input-wrappers.tsx
 import {
@@ -8610,13 +8810,13 @@ import {
   TooltipContent as TooltipContent3,
   TooltipTrigger as TooltipTrigger3
 } from "@hachej/boring-ui-kit";
-import { Children } from "react";
-import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
+import { Children as Children2 } from "react";
+import { jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
 var PromptInputFooter = ({
   align = "block-end",
   className,
   ...props
-}) => /* @__PURE__ */ jsx28(
+}) => /* @__PURE__ */ jsx31(
   InputGroupAddon,
   {
     align,
@@ -8626,7 +8826,7 @@ var PromptInputFooter = ({
 );
 
 // src/front/primitives/prompt-input.tsx
-import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
 var PromptInput = ({
   className,
   accept,
@@ -8643,12 +8843,12 @@ var PromptInput = ({
 }) => {
   const controller = useOptionalPromptInputController();
   const usingProvider = !!controller;
-  const providerTextValueRef = useRef14("");
+  const providerTextValueRef = useRef15("");
   if (usingProvider) {
     providerTextValueRef.current = controller.textInput.value;
   }
-  const inputRef = useRef14(null);
-  const formRef = useRef14(null);
+  const inputRef = useRef15(null);
+  const formRef = useRef15(null);
   const [items, setItems] = useState17([]);
   const setFileUrlLocal = useCallback15((id, url, status, path) => {
     setItems((prev) => prev.map((f) => {
@@ -8659,7 +8859,7 @@ var PromptInput = ({
   }, []);
   const files = usingProvider ? controller.attachments.files : items;
   const [referencedSources, setReferencedSources] = useState17([]);
-  const filesRef = useRef14(files);
+  const filesRef = useRef15(files);
   useEffect18(() => {
     filesRef.current = files;
   }, [files]);
@@ -8881,7 +9081,7 @@ var PromptInput = ({
     [add]
   );
   const setFileUrl = usingProvider ? controller.attachments.setFileUrl : setFileUrlLocal;
-  const attachmentsCtx = useMemo10(
+  const attachmentsCtx = useMemo13(
     () => ({
       add,
       clear: clearAttachments,
@@ -8893,7 +9093,7 @@ var PromptInput = ({
     }),
     [files, add, remove, clearAttachments, openFileDialog, setFileUrl]
   );
-  const refsCtx = useMemo10(
+  const refsCtx = useMemo13(
     () => ({
       add: (incoming) => {
         const array = Array.isArray(incoming) ? incoming : [incoming];
@@ -8969,8 +9169,8 @@ var PromptInput = ({
     },
     [usingProvider, controller, files, onSubmit, clear]
   );
-  const inner = /* @__PURE__ */ jsxs27(Fragment9, { children: [
-    /* @__PURE__ */ jsx29(
+  const inner = /* @__PURE__ */ jsxs27(Fragment11, { children: [
+    /* @__PURE__ */ jsx32(
       Input,
       {
         accept,
@@ -8983,7 +9183,7 @@ var PromptInput = ({
         type: "file"
       }
     ),
-    /* @__PURE__ */ jsx29(
+    /* @__PURE__ */ jsx32(
       "form",
       {
         "data-boring-agent-part": "composer",
@@ -8991,12 +9191,12 @@ var PromptInput = ({
         onSubmit: handleSubmit,
         ref: formRef,
         ...props,
-        children: /* @__PURE__ */ jsx29(InputGroup, { className: "overflow-hidden", children })
+        children: /* @__PURE__ */ jsx32(InputGroup, { className: "overflow-hidden", children })
       }
     )
   ] });
-  const withReferencedSources = /* @__PURE__ */ jsx29(LocalReferencedSourcesContext.Provider, { value: refsCtx, children: inner });
-  return /* @__PURE__ */ jsx29(LocalAttachmentsContext.Provider, { value: attachmentsCtx, children: withReferencedSources });
+  const withReferencedSources = /* @__PURE__ */ jsx32(LocalReferencedSourcesContext.Provider, { value: refsCtx, children: inner });
+  return /* @__PURE__ */ jsx32(LocalAttachmentsContext.Provider, { value: attachmentsCtx, children: withReferencedSources });
 };
 var PromptInputTextarea = ({
   onChange,
@@ -9074,7 +9274,7 @@ var PromptInputTextarea = ({
   } : {
     onChange
   };
-  return /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsx32(
     InputGroupTextarea,
     {
       "data-boring-agent-part": "composer-input",
@@ -9101,13 +9301,13 @@ var PromptInputSubmit = ({
   ...props
 }) => {
   const isGenerating = status === "submitted" || status === "streaming";
-  let Icon = /* @__PURE__ */ jsx29(CornerDownLeftIcon, { className: "size-4" });
+  let Icon = /* @__PURE__ */ jsx32(CornerDownLeftIcon, { className: "size-4" });
   if (status === "submitted") {
-    Icon = /* @__PURE__ */ jsx29(Spinner, {});
+    Icon = /* @__PURE__ */ jsx32(Spinner, {});
   } else if (status === "streaming") {
-    Icon = /* @__PURE__ */ jsx29(SquareIcon, { className: "size-4" });
+    Icon = /* @__PURE__ */ jsx32(SquareIcon, { className: "size-4" });
   } else if (status === "error") {
-    Icon = /* @__PURE__ */ jsx29(XIcon5, { className: "size-4" });
+    Icon = /* @__PURE__ */ jsx32(XIcon5, { className: "size-4" });
   }
   const handleClick = useCallback15(
     (e) => {
@@ -9120,7 +9320,7 @@ var PromptInputSubmit = ({
     },
     [isGenerating, onStop, onClick]
   );
-  return /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsx32(
     InputGroupButton2,
     {
       "aria-label": isGenerating ? "Stop" : "Submit",
@@ -9137,8 +9337,8 @@ var PromptInputSubmit = ({
 };
 
 // src/front/primitives/slash-command-picker.tsx
-import { useEffect as useEffect19, useMemo as useMemo11, useRef as useRef15, useState as useState18 } from "react";
-import { Fragment as Fragment10, jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
+import { useEffect as useEffect19, useMemo as useMemo14, useRef as useRef16, useState as useState18 } from "react";
+import { Fragment as Fragment12, jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
 var ALL_PLUGINS = "__all__";
 function commandGroup(cmd) {
   if (cmd.source === "skill") return "skills";
@@ -9149,17 +9349,17 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
   const [plugin, setPlugin] = useState18(ALL_PLUGINS);
   const [searchQuery, setSearchQuery] = useState18(query);
   const [activeIdx, setActiveIdx] = useState18(0);
-  const containerRef = useRef15(null);
-  const listRef = useRef15(null);
-  const inputRef = useRef15(null);
+  const containerRef = useRef16(null);
+  const listRef = useRef16(null);
+  const inputRef = useRef16(null);
   useEffect19(() => {
     setSearchQuery(query);
   }, [query]);
-  const groups = useMemo11(() => {
+  const groups = useMemo14(() => {
     const set = new Set(commands.map(commandGroup));
     return Array.from(set).sort((a, b) => a.localeCompare(b));
   }, [commands]);
-  const filtered = useMemo11(() => {
+  const filtered = useMemo14(() => {
     const q = searchQuery.trim().toLowerCase();
     return commands.filter((c) => {
       if (plugin !== ALL_PLUGINS && commandGroup(c) !== plugin) return false;
@@ -9190,7 +9390,7 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
     onDismiss
   });
   return /* @__PURE__ */ jsxs28("div", { ref: containerRef, className: "mb-1 w-full overflow-hidden rounded-lg border border-border/60 bg-popover shadow-lg", children: [
-    /* @__PURE__ */ jsx30(
+    /* @__PURE__ */ jsx33(
       "input",
       {
         ref: inputRef,
@@ -9205,9 +9405,9 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
         autoComplete: "off"
       }
     ),
-    /* @__PURE__ */ jsx30("div", { className: "flex flex-wrap gap-1 border-b border-border/50 px-2 py-1.5", role: "tablist", "aria-label": "Filter by plugin", children: [ALL_PLUGINS, ...groups].map((g) => {
+    /* @__PURE__ */ jsx33("div", { className: "flex flex-wrap gap-1 border-b border-border/50 px-2 py-1.5", role: "tablist", "aria-label": "Filter by plugin", children: [ALL_PLUGINS, ...groups].map((g) => {
       const selected = plugin === g;
-      return /* @__PURE__ */ jsx30(
+      return /* @__PURE__ */ jsx33(
         "button",
         {
           type: "button",
@@ -9227,7 +9427,7 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
         g
       );
     }) }),
-    filtered.length === 0 ? /* @__PURE__ */ jsx30("div", { className: "px-3 py-2 text-[11px] text-muted-foreground", children: "No matching commands." }) : /* @__PURE__ */ jsx30("ul", { ref: listRef, className: "max-h-80 overflow-y-auto py-1", role: "listbox", "aria-label": "Commands", children: filtered.map((cmd, i) => /* @__PURE__ */ jsxs28(
+    filtered.length === 0 ? /* @__PURE__ */ jsx33("div", { className: "px-3 py-2 text-[11px] text-muted-foreground", children: "No matching commands." }) : /* @__PURE__ */ jsx33("ul", { ref: listRef, className: "max-h-80 overflow-y-auto py-1", role: "listbox", "aria-label": "Commands", children: filtered.map((cmd, i) => /* @__PURE__ */ jsxs28(
       "li",
       {
         role: "option",
@@ -9250,15 +9450,15 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
               "/",
               cmd.name
             ] }),
-            cmd.source === "skill" ? /* @__PURE__ */ jsxs28(Fragment10, { children: [
-              /* @__PURE__ */ jsx30("span", { className: "rounded-sm bg-accent/15 px-1 py-px text-[9px] font-medium uppercase tracking-wide text-accent-foreground", children: "skill" }),
-              cmd.sourcePlugin ? /* @__PURE__ */ jsx30("span", { className: "rounded-sm bg-muted px-1 py-px text-[9px] font-medium text-muted-foreground", children: cmd.sourcePlugin }) : null
+            cmd.source === "skill" ? /* @__PURE__ */ jsxs28(Fragment12, { children: [
+              /* @__PURE__ */ jsx33("span", { className: "rounded-sm bg-accent/15 px-1 py-px text-[9px] font-medium uppercase tracking-wide text-accent-foreground", children: "skill" }),
+              cmd.sourcePlugin ? /* @__PURE__ */ jsx33("span", { className: "rounded-sm bg-muted px-1 py-px text-[9px] font-medium text-muted-foreground", children: cmd.sourcePlugin }) : null
             ] }) : cmd.sourcePlugin ? (
               // Originating plugin/package for non-skill commands.
-              /* @__PURE__ */ jsx30("span", { className: "rounded-sm bg-muted px-1 py-px text-[9px] font-medium text-muted-foreground", children: cmd.sourcePlugin })
+              /* @__PURE__ */ jsx33("span", { className: "rounded-sm bg-muted px-1 py-px text-[9px] font-medium text-muted-foreground", children: cmd.sourcePlugin })
             ) : null
           ] }),
-          /* @__PURE__ */ jsx30("span", { className: "truncate text-[11px] opacity-50", children: cmd.description })
+          /* @__PURE__ */ jsx33("span", { className: "truncate text-[11px] opacity-50", children: cmd.description })
         ]
       },
       cmd.name
@@ -9269,10 +9469,10 @@ function SlashCommandPicker({ query, commands, onSelect, onDismiss }) {
 // src/front/chat/components/ComposerAttachments.tsx
 import { AlertCircleIcon as AlertCircleIcon2, Loader2 as Loader23, PaperclipIcon as PaperclipIcon2 } from "lucide-react";
 import { IconButton as IconButton3 } from "@hachej/boring-ui-kit";
-import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
 function AttachmentButton({ disabled, className }) {
   const attachments = usePromptInputAttachments();
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx34(
     IconButton3,
     {
       type: "button",
@@ -9285,14 +9485,14 @@ function AttachmentButton({ disabled, className }) {
       className: cn(composerActionClass, "w-8", className),
       "aria-label": "Attach files",
       title: disabled ? "Attachments are available when the composer is ready." : "Attach files",
-      children: /* @__PURE__ */ jsx31(PaperclipIcon2, { className: "h-3.5 w-3.5", strokeWidth: 1.75 })
+      children: /* @__PURE__ */ jsx34(PaperclipIcon2, { className: "h-3.5 w-3.5", strokeWidth: 1.75 })
     }
   );
 }
 function AttachmentsList() {
   const attachments = usePromptInputAttachments();
   if (attachments.files.length === 0) return null;
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx34(
     Attachments,
     {
       "data-boring-agent-part": "composer-attachment-row",
@@ -9311,12 +9511,12 @@ function AttachmentsList() {
           ),
           children: [
             /* @__PURE__ */ jsxs29("div", { className: "relative shrink-0", children: [
-              /* @__PURE__ */ jsx31(AttachmentPreview, { className: "!size-7 overflow-hidden !rounded-full bg-background/60" }),
-              file.status === "uploading" ? /* @__PURE__ */ jsx31("div", { className: "absolute inset-0 flex items-center justify-center rounded-full bg-background/70", children: /* @__PURE__ */ jsx31(Loader23, { className: "size-3.5 animate-spin text-muted-foreground" }) }) : null,
-              file.status === "error" ? /* @__PURE__ */ jsx31("div", { className: "absolute inset-0 flex items-center justify-center rounded-full bg-destructive/20", children: /* @__PURE__ */ jsx31(AlertCircleIcon2, { className: "size-3.5 text-destructive" }) }) : null
+              /* @__PURE__ */ jsx34(AttachmentPreview, { className: "!size-7 overflow-hidden !rounded-full bg-background/60" }),
+              file.status === "uploading" ? /* @__PURE__ */ jsx34("div", { className: "absolute inset-0 flex items-center justify-center rounded-full bg-background/70", children: /* @__PURE__ */ jsx34(Loader23, { className: "size-3.5 animate-spin text-muted-foreground" }) }) : null,
+              file.status === "error" ? /* @__PURE__ */ jsx34("div", { className: "absolute inset-0 flex items-center justify-center rounded-full bg-destructive/20", children: /* @__PURE__ */ jsx34(AlertCircleIcon2, { className: "size-3.5 text-destructive" }) }) : null
             ] }),
-            /* @__PURE__ */ jsx31(AttachmentInfo, { className: "min-w-0 !max-w-[180px] truncate text-[13px] font-medium" }),
-            /* @__PURE__ */ jsx31(AttachmentRemove, { className: "!size-5 !rounded-full !opacity-100 text-muted-foreground/80 hover:text-foreground" })
+            /* @__PURE__ */ jsx34(AttachmentInfo, { className: "min-w-0 !max-w-[180px] truncate text-[13px] font-medium" }),
+            /* @__PURE__ */ jsx34(AttachmentRemove, { className: "!size-5 !rounded-full !opacity-100 text-muted-foreground/80 hover:text-foreground" })
           ]
         },
         file.id
@@ -9326,7 +9526,7 @@ function AttachmentsList() {
 }
 
 // src/front/chat/components/PiChatComposerSurface.tsx
-import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
 var MAX_PROMPT_ATTACHMENTS = 2;
 var MAX_PROMPT_ATTACHMENT_BYTES = 4 * 1024 * 1024;
 var COMPOSER_INPUT_GROUP_MIN_HEIGHT = 56;
@@ -9403,10 +9603,12 @@ function PiChatComposerSurface({
   textareaRef,
   onTextareaChange,
   onTextareaKeyDown,
+  updateDraft,
   onSubmitMessage,
   onStop
 }) {
   const workspaceRequestId = getHeaderValue(requestHeaders, "x-boring-workspace-id");
+  const composerContributions = useComposerContributions();
   const uploadAttachment = useCallback16((file) => uploadFile(file, {
     apiBaseUrl,
     workspaceRequestId,
@@ -9438,7 +9640,7 @@ function PiChatComposerSurface({
     resizeTextarea(textareaRef.current);
   }, [draft, resizeTextarea, textareaRef]);
   return /* @__PURE__ */ jsxs30("div", { className: cn("relative z-20", chrome ? "px-4 pb-4 pt-2 sm:px-6 sm:pb-5" : "px-3 pb-2 pt-1"), children: [
-    /* @__PURE__ */ jsx32(
+    /* @__PURE__ */ jsx35(
       "div",
       {
         "data-boring-agent-part": "chat-working-slot",
@@ -9456,7 +9658,7 @@ function PiChatComposerSurface({
             "aria-live": isStreaming ? "polite" : void 0,
             className: "inline-flex items-center gap-2 rounded-full border border-border/50 bg-background/85 px-2.5 py-1 text-[12px] text-muted-foreground/75 shadow-sm backdrop-blur",
             children: [
-              /* @__PURE__ */ jsx32(
+              /* @__PURE__ */ jsx35(
                 motion2.span,
                 {
                   "aria-hidden": "true",
@@ -9465,14 +9667,14 @@ function PiChatComposerSurface({
                   transition: { duration: 1.2, repeat: Infinity, ease: "easeInOut" }
                 }
               ),
-              /* @__PURE__ */ jsx32("span", { children: "Working\u2026" })
+              /* @__PURE__ */ jsx35("span", { children: "Working\u2026" })
             ]
           }
         )
       }
     ),
-    composerStatusNotice ? /* @__PURE__ */ jsx32(ComposerRuntimeNotice, { notice: composerStatusNotice }) : null,
-    composerBlocked && !workspaceWarmupBlocked ? /* @__PURE__ */ jsx32(
+    composerStatusNotice ? /* @__PURE__ */ jsx35(ComposerRuntimeNotice, { notice: composerStatusNotice }) : null,
+    composerBlocked && !workspaceWarmupBlocked ? /* @__PURE__ */ jsx35(
       ComposerBlockerNotice,
       {
         blocker: primaryComposerBlocker,
@@ -9480,8 +9682,8 @@ function PiChatComposerSurface({
         onAction: onComposerBlockerAction
       }
     ) : null,
-    queuePreview.length > 0 ? /* @__PURE__ */ jsx32(QueuedComposerNotice, { followUps: queuePreview, onEdit: onEditQueued }) : null,
-    hotReloadEnabled ? /* @__PURE__ */ jsx32(
+    queuePreview.length > 0 ? /* @__PURE__ */ jsx35(QueuedComposerNotice, { followUps: queuePreview, onEdit: onEditQueued }) : null,
+    hotReloadEnabled ? /* @__PURE__ */ jsx35(
       PluginUpdateStatus,
       {
         state: pluginUpdateState,
@@ -9489,14 +9691,14 @@ function PiChatComposerSurface({
         onRetry: onRunPluginUpdate
       }
     ) : null,
-    /* @__PURE__ */ jsx32(
+    /* @__PURE__ */ jsx35(
       CommandRunStatus,
       {
         state: commandNotifyState,
         onDismiss: onDismissCommandNotify
       }
     ),
-    attachmentNotice ? /* @__PURE__ */ jsx32(
+    attachmentNotice ? /* @__PURE__ */ jsx35(
       "div",
       {
         role: "status",
@@ -9506,7 +9708,7 @@ function PiChatComposerSurface({
       }
     ) : null,
     /* @__PURE__ */ jsxs30("div", { className: cn("mx-auto w-full", chrome ? "max-w-3xl" : "max-w-[680px]"), children: [
-      mentionState ? /* @__PURE__ */ jsx32(
+      mentionState ? /* @__PURE__ */ jsx35(
         MentionPicker,
         {
           mention: mentionState,
@@ -9518,7 +9720,7 @@ function PiChatComposerSurface({
           onDismiss: onDismissMention
         }
       ) : null,
-      slashQuery !== null ? /* @__PURE__ */ jsx32(
+      slashQuery !== null ? /* @__PURE__ */ jsx35(
         SlashCommandPicker,
         {
           query: slashQuery,
@@ -9527,7 +9729,7 @@ function PiChatComposerSurface({
           onDismiss: onDismissSlash
         }
       ) : null,
-      mentionState === null && slashQuery === null && modelPickerOpen ? /* @__PURE__ */ jsx32(
+      mentionState === null && slashQuery === null && modelPickerOpen ? /* @__PURE__ */ jsx35(
         ModelPickerMenu,
         {
           value: selectedModel,
@@ -9538,7 +9740,7 @@ function PiChatComposerSurface({
           onClose: () => onSetModelPickerOpen(false)
         }
       ) : null,
-      mentionState === null && slashQuery === null && thinkingPickerOpen ? /* @__PURE__ */ jsx32(
+      mentionState === null && slashQuery === null && thinkingPickerOpen ? /* @__PURE__ */ jsx35(
         ThinkingPickerMenu,
         {
           value: selectedThinking,
@@ -9548,7 +9750,17 @@ function PiChatComposerSurface({
         }
       ) : null
     ] }),
-    /* @__PURE__ */ jsx32(
+    composerContributions.map(({ id, Top }) => Top ? /* @__PURE__ */ jsx35(
+      "div",
+      {
+        "data-boring-agent-part": "composer-contribution-top",
+        "data-boring-agent-contribution-id": id,
+        className: cn("mx-auto mb-2 w-full empty:hidden", chrome ? "max-w-3xl" : "max-w-[680px]"),
+        children: /* @__PURE__ */ jsx35(Top, {})
+      },
+      id
+    ) : null),
+    /* @__PURE__ */ jsx35(
       "div",
       {
         "data-boring-agent-part": "composer-rail",
@@ -9583,15 +9795,15 @@ function PiChatComposerSurface({
               else onAttachmentNotice(err.message || "Attachment rejected.");
             },
             children: [
-              /* @__PURE__ */ jsx32(AttachmentsList, {}),
+              /* @__PURE__ */ jsx35(AttachmentsList, {}),
               /* @__PURE__ */ jsxs30(
                 "div",
                 {
                   "data-boring-agent-part": "composer-input-row",
                   className: "flex min-h-[var(--composer-input-group-height)] w-full items-center",
                   children: [
-                    /* @__PURE__ */ jsx32("div", { className: "flex h-14 shrink-0 items-center pl-2", children: /* @__PURE__ */ jsx32(AttachmentButton, { disabled: disabled || isStreaming }) }),
-                    /* @__PURE__ */ jsx32(
+                    /* @__PURE__ */ jsx35("div", { className: "flex h-14 shrink-0 items-center pl-2", children: /* @__PURE__ */ jsx35(AttachmentButton, { disabled: disabled || isStreaming }) }),
+                    /* @__PURE__ */ jsx35(
                       PromptInputTextarea,
                       {
                         value: draft,
@@ -9615,32 +9827,44 @@ function PiChatComposerSurface({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsx32(
+                    /* @__PURE__ */ jsx35(
                       PromptInputFooter,
                       {
                         align: "inline-end",
                         "data-boring-agent-part": "composer-submit-addon",
                         className: "!order-none !w-auto shrink-0 self-center justify-between border-0 bg-transparent !px-2 !py-0",
-                        children: /* @__PURE__ */ jsx32("div", { className: "ml-auto flex items-center gap-1.5", children: /* @__PURE__ */ jsx32(
-                          PromptInputSubmit,
-                          {
-                            "data-boring-agent-part": "composer-submit",
-                            status: submitStatus,
-                            onStop,
-                            disabled: submitDisabled,
-                            className: cn(
-                              "h-8 w-8 shrink-0 rounded-full",
-                              "bg-foreground",
-                              "text-background",
-                              "transition-all duration-150 ease-[cubic-bezier(0.22,1,0.36,1)]",
-                              "hover:bg-foreground/90 hover:shadow-[0_0_0_3px_oklch(from_var(--foreground)_l_c_h/0.12)] hover:scale-[1.04]",
-                              "active:scale-[0.93] active:brightness-95",
-                              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/20",
-                              "disabled:pointer-events-none disabled:opacity-40",
-                              "[&>svg]:size-3.5"
-                            )
-                          }
-                        ) })
+                        children: /* @__PURE__ */ jsxs30("div", { className: "ml-auto flex items-center gap-1.5", children: [
+                          composerContributions.map(({ id, Action }) => Action ? /* @__PURE__ */ jsx35(
+                            "span",
+                            {
+                              "data-boring-agent-part": "composer-contribution-action",
+                              "data-boring-agent-contribution-id": id,
+                              className: "contents",
+                              children: /* @__PURE__ */ jsx35(Action, { updateDraft })
+                            },
+                            id
+                          ) : null),
+                          /* @__PURE__ */ jsx35(
+                            PromptInputSubmit,
+                            {
+                              "data-boring-agent-part": "composer-submit",
+                              status: submitStatus,
+                              onStop,
+                              disabled: submitDisabled,
+                              className: cn(
+                                "h-8 w-8 shrink-0 rounded-full",
+                                "bg-foreground",
+                                "text-background",
+                                "transition-all duration-150 ease-[cubic-bezier(0.22,1,0.36,1)]",
+                                "hover:bg-foreground/90 hover:shadow-[0_0_0_3px_oklch(from_var(--foreground)_l_c_h/0.12)] hover:scale-[1.04]",
+                                "active:scale-[0.93] active:brightness-95",
+                                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/20",
+                                "disabled:pointer-events-none disabled:opacity-40",
+                                "[&>svg]:size-3.5"
+                              )
+                            }
+                          )
+                        ] })
                       }
                     )
                   ]
@@ -9660,7 +9884,7 @@ function PiChatComposerSurface({
           chrome ? "max-w-3xl" : "max-w-[680px]"
         ),
         children: [
-          /* @__PURE__ */ jsx32(
+          /* @__PURE__ */ jsx35(
             ModelSelectTrigger,
             {
               value: selectedModel,
@@ -9677,7 +9901,7 @@ function PiChatComposerSurface({
               }
             }
           ),
-          thinkingControl ? /* @__PURE__ */ jsx32(
+          thinkingControl ? /* @__PURE__ */ jsx35(
             ThinkingSelectTrigger,
             {
               value: selectedThinking,
@@ -9704,7 +9928,7 @@ function getHeaderValue(headers, name) {
 }
 
 // src/front/chat/piChatPanelHooks.ts
-import { useCallback as useCallback17, useEffect as useEffect20, useMemo as useMemo12, useRef as useRef16, useState as useState19, useSyncExternalStore } from "react";
+import { useCallback as useCallback17, useEffect as useEffect20, useMemo as useMemo15, useRef as useRef17, useState as useState19, useSyncExternalStore } from "react";
 function useExternalRemotePiSession({
   sessionId,
   agentTypeId,
@@ -9717,9 +9941,9 @@ function useExternalRemotePiSession({
   remoteSessionOptions
 }) {
   const [session, setSession] = useState19();
-  const remoteSessionOptionsRef = useRef16(remoteSessionOptions);
+  const remoteSessionOptionsRef = useRef17(remoteSessionOptions);
   remoteSessionOptionsRef.current = remoteSessionOptions;
-  const remoteSessionOptionsKey = useMemo12(
+  const remoteSessionOptionsKey = useMemo15(
     () => remoteSessionOptionsIdentity2(remoteSessionOptions),
     [remoteSessionOptions]
   );
@@ -9892,7 +10116,7 @@ function errorMessage2(error, fallback) {
 }
 
 // src/front/chat/PiChatPanel.tsx
-import { jsx as jsx33, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
 var DebugDrawer2 = lazy(() => import("../DebugDrawer-RYEBQ6CO.js").then((m) => ({ default: m.DebugDrawer })));
 var EMPTY_COMMANDS = [];
 var EMPTY_COMMAND_NAMES = [];
@@ -9964,14 +10188,14 @@ function PiChatPanel({
 }) {
   const externalSessionId = sessionId?.trim() || void 0;
   const showSessionSidebar = showSessions ?? externalSessionId === void 0;
-  const onDataRef = useRef17(onData);
+  const onDataRef = useRef18(onData);
   onDataRef.current = onData;
-  const onTurnCompleteRef = useRef17(onTurnComplete);
+  const onTurnCompleteRef = useRef18(onTurnComplete);
   onTurnCompleteRef.current = onTurnComplete;
-  const sessionListRefreshRef = useRef17(void 0);
-  const requestHeadersKey = useMemo13(() => headersContentKey(requestHeaders), [requestHeaders]);
-  const normalizedRequestHeaders = useMemo13(() => normalizedHeadersFromContentKey(requestHeadersKey), [requestHeadersKey]);
-  const remoteSessionOptionsWithEvents = useMemo13(() => ({
+  const sessionListRefreshRef = useRef18(void 0);
+  const requestHeadersKey = useMemo16(() => headersContentKey(requestHeaders), [requestHeaders]);
+  const normalizedRequestHeaders = useMemo16(() => normalizedHeadersFromContentKey(requestHeadersKey), [requestHeadersKey]);
+  const remoteSessionOptionsWithEvents = useMemo16(() => ({
     ...remoteSessionOptions,
     ...hydrateMessages ? {} : { autoStart: false },
     onEvent: (event) => {
@@ -10038,7 +10262,7 @@ function PiChatPanel({
     enabled: modelDiscoveryEnabled
   });
   const selectedModel = model === void 0 ? modelDiscovery.model : model;
-  const modelOptions = useMemo13(
+  const modelOptions = useMemo16(
     () => modelOptionsForSelection(availableModels ?? modelDiscovery.availableModels, selectedModel),
     [availableModels, modelDiscovery.availableModels, selectedModel]
   );
@@ -10076,13 +10300,13 @@ function PiChatPanel({
   const [modelPickerOpen, setModelPickerOpen] = useState20(false);
   const [thinkingPickerOpen, setThinkingPickerOpen] = useState20(false);
   const [draft, setDraft] = useState20(() => initialDraft ?? "");
-  const draftRef = useRef17(draft);
+  const draftRef = useRef18(draft);
   draftRef.current = draft;
-  const initialDraftGuard = useRef17(new InitialDraftAutoSubmitGuard());
-  const pendingAutoSubmitSettleRef = useRef17(void 0);
-  const acceptedAutoSubmitSettleRef = useRef17(void 0);
-  const resetInProgressRef = useRef17(false);
-  const autoCreateInFlightRef = useRef17(false);
+  const initialDraftGuard = useRef18(new InitialDraftAutoSubmitGuard());
+  const pendingAutoSubmitSettleRef = useRef18(void 0);
+  const acceptedAutoSubmitSettleRef = useRef18(void 0);
+  const resetInProgressRef = useRef18(false);
+  const autoCreateInFlightRef = useRef18(false);
   const settlePendingAutoSubmit = useCallback18((sessionId2) => {
     const pendingSessionId = pendingAutoSubmitSettleRef.current;
     if (!pendingSessionId || sessionId2 && pendingSessionId !== sessionId2) return false;
@@ -10091,20 +10315,25 @@ function PiChatPanel({
     onAutoSubmitInitialDraftSettled?.();
     return true;
   }, [onAutoSubmitInitialDraftSettled]);
-  const prevStatusRef = useRef17("idle");
-  const statusRef = useRef17("idle");
-  const scrollToBottomRef = useRef17(() => {
+  const prevStatusRef = useRef18("idle");
+  const statusRef = useRef18("idle");
+  const scrollToBottomRef = useRef18(() => {
   });
-  const textareaRef = useRef17(null);
+  const textareaRef = useRef18(null);
   const [localNotices, setLocalNotices] = useState20([]);
   const [dismissedNoticeIds, setDismissedNoticeIds] = useState20(() => /* @__PURE__ */ new Set());
   const [pluginUpdateState, setPluginUpdateState] = useState20(null);
   const [commandNotifyState, setCommandNotifyState] = useState20(null);
-  const commandRunIdRef = useRef17(0);
+  const commandRunIdRef = useRef18(0);
   const [serverSkillsRefreshKey, setServerSkillsRefreshKey] = useState20(0);
   const [localSubmittedSessionId, setLocalSubmittedSessionId] = useState20();
-  const localSubmittedSessionRef = useRef17(void 0);
+  const localSubmittedSessionRef = useRef18(void 0);
   const { attachmentNotice, setAttachmentNotice } = useAttachmentNotice();
+  const composerContributions = useComposerContributions();
+  const contributedCommands = useMemo16(
+    () => composerContributions.flatMap((contribution) => contribution.commands ?? []),
+    [composerContributions]
+  );
   const markLocalSubmitted = useCallback18((sessionId2) => {
     localSubmittedSessionRef.current = sessionId2;
     setLocalSubmittedSessionId(sessionId2);
@@ -10114,7 +10343,7 @@ function PiChatPanel({
     localSubmittedSessionRef.current = void 0;
     setLocalSubmittedSessionId(void 0);
   }, []);
-  const registry = useMemo13(() => {
+  const registry = useMemo16(() => {
     const excludedBuiltins = new Set(excludeBuiltinCommands);
     const effectiveBuiltins = builtinCommands.filter((command) => {
       if (!hotReloadEnabled && command.name === "reload") return false;
@@ -10122,9 +10351,10 @@ function PiChatPanel({
     });
     const next = createCommandRegistry(effectiveBuiltins);
     for (const command of extraCommands ?? []) next.register(command);
+    for (const command of contributedCommands) next.register(command);
     for (const command of commands) next.register(command);
     return next;
-  }, [apiBaseUrl, commands, excludeBuiltinCommands, extraCommands, hotReloadEnabled, normalizedRequestHeaders, serverResourcesEnabled, serverSkillsRefreshKey, storageScope]);
+  }, [apiBaseUrl, commands, contributedCommands, excludeBuiltinCommands, extraCommands, hotReloadEnabled, normalizedRequestHeaders, serverResourcesEnabled, serverSkillsRefreshKey, storageScope]);
   const commandsStamp = useServerCommands({
     registry,
     requestHeaders: normalizedRequestHeaders,
@@ -10135,12 +10365,16 @@ function PiChatPanel({
     refreshKey: serverSkillsRefreshKey,
     enabled: serverResourcesEnabled
   });
-  const allCommands = useMemo13(() => registry.list(), [registry, commandsStamp]);
+  const allCommands = useMemo16(() => registry.list(), [registry, commandsStamp]);
+  const actionableSlashCommands = useMemo16(
+    () => allCommands.flatMap((command) => command.clickBehavior === "execute" || command.clickBehavior === "insert" ? [{ name: command.name, clickBehavior: command.clickBehavior }] : []),
+    [allCommands]
+  );
   const activeChatSessionId = selectedChatState?.sessionId;
   const warmupNotice = composerNoticeForWarmup(workspaceWarmupStatus);
   const runtimeDependenciesNotice = composerNoticeForRuntimeDependencies(workspaceWarmupStatus);
   const workspaceWarmupBlocked = Boolean(warmupNotice);
-  const activeBlockers = useMemo13(
+  const activeBlockers = useMemo16(
     // A missing active session id means a single/sessionless chat host. In that
     // mode, keep scoped blockers visible instead of hiding the only attention UI.
     // Multi-session hosts should pass a session id so unrelated blockers filter out.
@@ -10150,7 +10384,7 @@ function PiChatPanel({
   const canonicalMessages = selectedChatState ? selectMessagesForRender(selectedChatState) : [];
   const queuePreview = selectedChatState ? selectQueuePreview(selectedChatState) : [];
   const messages = canonicalMessages;
-  const userHistory = useMemo13(() => selectComposerHistoryFromCanonicalUsers(canonicalMessages), [canonicalMessages]);
+  const userHistory = useMemo16(() => selectComposerHistoryFromCanonicalUsers(canonicalMessages), [canonicalMessages]);
   const emptyStateHydrating = statusForState(selectedChatState, sessionsLoading || chatStatePending || selectedSessionPending) === "hydrating";
   const emptyHero = emptyPlacement === "hero" && messages.length === 0 && queuePreview.length === 0 && !emptyStateHydrating;
   const debugState = selectedPiSession?.getDebugState();
@@ -10158,7 +10392,7 @@ function PiChatPanel({
   const primaryComposerBlocker = activeBlockers[0];
   const composerBlockerLabel = workspaceWarmupBlocked ? warmupNotice?.title ?? "Preparing workspace..." : primaryComposerBlocker?.label ?? primaryComposerBlocker?.reason ?? "Complete the pending workspace action to continue.";
   const composerStatusNotice = warmupNotice ?? runtimeDependenciesNotice;
-  const runtimeNotices = useMemo13(() => {
+  const runtimeNotices = useMemo16(() => {
     const fromState = selectedChatState ? selectRuntimeNotices(selectedChatState) : [];
     const sessionNotice = sessionsError ? [{ id: "session-navigation-error", level: "error", text: sessionsError.message, dismissible: true }] : [];
     const largeStateNotice = debug && debugState?.largeStateWarning ? [{
@@ -10372,7 +10606,7 @@ function PiChatPanel({
     }
     insertSlashCommand(name);
   }, [dismissSlash, insertSlashCommand, openModelPicker, openThinkingPicker, setComposerDraft]);
-  const policy = useMemo13(() => {
+  const policy = useMemo16(() => {
     if (!selectedPiSession || !activeChatSessionId || !serverModelSelectionReady) return void 0;
     const policySession = {
       getState: () => {
@@ -10450,16 +10684,16 @@ function PiChatPanel({
       ...errorCode ? { errorCode } : {}
     });
   }, [addLocalNotice, dropLocalNotice]);
-  const sendComposerMessage = useCallback18(async ({ text, files, source = "composer" }) => {
+  const sendComposerMessage = useCallback18(async ({ text, files, source = "composer", preserveExistingDraft = false }) => {
     if (!policy) {
       addLocalNotice({ id: "composer-no-session", level: "warning", text: "Create or select a chat session before sending.", dismissible: true });
       return false;
     }
     const submittedDraft = text;
     const restoreSubmittedDraft = () => {
-      if (draftRef.current === "") setComposerDraft(submittedDraft);
+      if (!preserveExistingDraft && draftRef.current === "") setComposerDraft(submittedDraft);
     };
-    setComposerDraft("", false);
+    if (!preserveExistingDraft) setComposerDraft("", false);
     scrollToBottomRef.current();
     try {
       const result = await policy.submit({ text, files, source });
@@ -10483,6 +10717,53 @@ function PiChatPanel({
       return false;
     }
   }, [activeChatSessionId, clearLocalSubmitted, dropLocalNotice, markLocalSubmitted, onPromptSubmitStarted, policy, selectedPiSession, setComposerDraft, surfaceRunRejected]);
+  const availableAssistantSlashCommands = useMemo16(
+    () => policy ? actionableSlashCommands : actionableSlashCommands.filter((command) => command.clickBehavior === "insert"),
+    [actionableSlashCommands, policy]
+  );
+  const assistantMentionCatalog = useMemo16(() => {
+    const skills = /* @__PURE__ */ new Map();
+    for (const command of allCommands) {
+      if (command.source !== "skill" && command.kind !== "skill") continue;
+      const name = command.name.replace(/^skill:/, "");
+      if (!name) continue;
+      const priority = command.kind === "skill" ? 2 : 1;
+      const existing = skills.get(name);
+      if (!existing || priority > existing.priority) skills.set(name, { name, commandName: command.name, priority });
+    }
+    return {
+      commands: availableAssistantSlashCommands,
+      skills: [...skills.values()].map(({ name, commandName }) => ({ name, commandName })),
+      files: true
+    };
+  }, [allCommands, availableAssistantSlashCommands]);
+  const insertMentionDraft = useCallback18((invocation) => {
+    const currentDraft = draftRef.current;
+    const separator = currentDraft && !/\s$/.test(invocation) ? "\n" : "";
+    setComposerDraft(`${invocation}${separator}${currentDraft}`, true);
+  }, [setComposerDraft]);
+  const activateAssistantMention = useCallback18((mention) => {
+    const command = registry.get(mention.kind === "skill" ? mention.commandName : mention.name);
+    if (mention.kind === "skill") {
+      if (command?.source !== "skill" && command?.kind !== "skill") return;
+      const invocation = command.kind === "skill" && !mention.commandName.includes(":") ? `/${mention.commandName} ` : `skill: ${mention.name}
+
+`;
+      insertMentionDraft(invocation);
+      return;
+    }
+    if (command?.clickBehavior === "insert") {
+      insertMentionDraft(`/${mention.name} `);
+      return;
+    }
+    if (command?.clickBehavior !== "execute" || !policy) return;
+    void sendComposerMessage({
+      text: `/${mention.name}`,
+      files: [],
+      source: "composer",
+      preserveExistingDraft: true
+    });
+  }, [insertMentionDraft, policy, registry, sendComposerMessage]);
   const editQueued = useCallback18(() => {
     if (!policy) return;
     void policy.editQueued().then((result) => {
@@ -10589,8 +10870,8 @@ function PiChatPanel({
   const isStreaming = isPiBusyStatus(status);
   const submitStatus = initialHydrationPromptAllowed ? "ready" : toPromptSubmitStatus(status);
   const submitDisabled = !policy || sessionsLoading || modelSelectionBlocked || composerBlocked && !isStreaming;
-  const mergedToolRenderers = useMemo13(() => mergeShadcnToolRenderers(toolRenderers), [toolRenderers]);
-  const debugMessages = useMemo13(() => messages.map(toDebugUiMessage), [messages]);
+  const mergedToolRenderers = useMemo16(() => mergeShadcnToolRenderers(toolRenderers), [toolRenderers]);
+  const debugMessages = useMemo16(() => messages.map(toDebugUiMessage), [messages]);
   const onTextareaChange = useCallback18((event) => {
     setModelPickerOpen(false);
     setThinkingPickerOpen(false);
@@ -10624,7 +10905,7 @@ function PiChatPanel({
     }
     handleComposerKeyDown(event);
   }, [handleComposerKeyDown, interrupt, isStreaming, mentionState, slashQuery]);
-  return /* @__PURE__ */ jsx33(ArtifactOpenProvider, { onOpenArtifact, children: /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsx36(ArtifactOpenProvider, { onOpenArtifact, children: /* @__PURE__ */ jsxs31(
     "div",
     {
       "data-boring-agent": "",
@@ -10641,7 +10922,7 @@ function PiChatPanel({
       role: "region",
       "aria-label": "Agent assistant",
       children: [
-        showSessionSidebar ? /* @__PURE__ */ jsx33("aside", { "data-boring-agent-part": "pi-chat-session-sidebar", className: "min-h-0 w-64 shrink-0 border-r border-border/60", children: /* @__PURE__ */ jsx33(
+        showSessionSidebar ? /* @__PURE__ */ jsx36("aside", { "data-boring-agent-part": "pi-chat-session-sidebar", className: "min-h-0 w-64 shrink-0 border-r border-border/60", children: /* @__PURE__ */ jsx36(
           SessionList,
           {
             sessions: sessionList,
@@ -10655,7 +10936,7 @@ function PiChatPanel({
             loadingMore: sessions.loadingMore
           }
         ) }) : null,
-        /* @__PURE__ */ jsx33("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: /* @__PURE__ */ jsxs31(
+        /* @__PURE__ */ jsx36("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: /* @__PURE__ */ jsxs31(
           "div",
           {
             className: cn(
@@ -10664,7 +10945,7 @@ function PiChatPanel({
               chrome && "mx-3 my-3 rounded-xl bg-[color:var(--surface-chat)] shadow-[0_1px_0_oklch(0_0_0/0.02),0_1px_2px_-1px_oklch(0_0_0/0.04),inset_0_0_0_1px_oklch(from_var(--border)_l_c_h/0.6)]"
             ),
             children: [
-              /* @__PURE__ */ jsx33(
+              /* @__PURE__ */ jsx36(
                 PiConversationSurface,
                 {
                   chrome,
@@ -10676,6 +10957,8 @@ function PiChatPanel({
                   isStreaming,
                   showThoughts,
                   toolRenderers: mergedToolRenderers,
+                  mentionCatalog: assistantMentionCatalog,
+                  onMentionActivate: activateAssistantMention,
                   runtimeNotices,
                   onDismissNotice: clearLocalNotice,
                   renderNoticeAction,
@@ -10687,7 +10970,7 @@ function PiChatPanel({
                   windowResetKey: activeSessionId
                 }
               ),
-              /* @__PURE__ */ jsx33(
+              /* @__PURE__ */ jsx36(
                 PiChatComposerSurface,
                 {
                   chrome,
@@ -10744,6 +11027,9 @@ function PiChatPanel({
                   textareaRef,
                   onTextareaChange,
                   onTextareaKeyDown,
+                  updateDraft: (update, options) => {
+                    setComposerDraft(update(draftRef.current), options?.focus ?? true);
+                  },
                   onSubmitMessage: ({ text, files }) => sendComposerMessage({ text, files }),
                   onStop: stop
                 }
@@ -10751,7 +11037,7 @@ function PiChatPanel({
             ]
           }
         ) }),
-        debug ? /* @__PURE__ */ jsx33(Suspense, { fallback: null, children: /* @__PURE__ */ jsx33("div", { "aria-label": "Chat debug metadata", className: "contents", role: "region", children: /* @__PURE__ */ jsx33(
+        debug ? /* @__PURE__ */ jsx36(Suspense, { fallback: null, children: /* @__PURE__ */ jsx36("div", { "aria-label": "Chat debug metadata", className: "contents", role: "region", children: /* @__PURE__ */ jsx36(
           DebugDrawer2,
           {
             apiBaseUrl,
@@ -10807,8 +11093,10 @@ function getAgentCommands(options = {}) {
 export {
   ArtifactOpenProvider,
   ChatEmptyState,
+  ChatMessageContributionProvider,
   PiChatPanel as ChatPanel,
   CodeBlock2 as CodeBlock,
+  ComposerContributionProvider,
   Conversation,
   ConversationContent,
   ConversationScrollButton,
@@ -10832,7 +11120,10 @@ export {
   ReasoningContent,
   ReasoningTrigger,
   ThinkingSelect,
+  Tool2 as Tool,
   ToolCallGroup,
+  ToolContent,
+  ToolHeader,
   activeSessionStorageKey,
   builtinCommands,
   clearActiveSessionId,