@contractspec/module.ai-chat 4.0.3 → 4.1.2

package/dist/node/presentation/index.js

@@ -5,12 +5,13 @@ var __require = /* @__PURE__ */ createRequire(import.meta.url);
 import * as React from "react";
 import { ScrollArea } from "@contractspec/lib.ui-kit-web/ui/scroll-area";
 import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
-import { jsxDEV } from "react/jsx-dev-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 "use client";
 function ChatContainer({
   children,
   className,
-  showScrollButton = true
+  showScrollButton = true,
+  headerContent
 }) {
   const scrollRef = React.useRef(null);
   const [showScrollDown, setShowScrollDown] = React.useState(false);
@@ -37,24 +38,28 @@ function ChatContainer({
       });
     }
   }, []);
-  return /* @__PURE__ */ jsxDEV("div", {
+  return /* @__PURE__ */ jsxs("div", {
     className: cn("relative flex flex-1 flex-col", className),
     children: [
-      /* @__PURE__ */ jsxDEV(ScrollArea, {
+      headerContent && /* @__PURE__ */ jsx("div", {
+        className: "border-border flex shrink-0 items-center justify-end gap-2 border-b px-4 py-2",
+        children: headerContent
+      }),
+      /* @__PURE__ */ jsx(ScrollArea, {
         ref: scrollRef,
         className: "flex-1",
         onScroll: handleScroll,
-        children: /* @__PURE__ */ jsxDEV("div", {
+        children: /* @__PURE__ */ jsx("div", {
           className: "flex flex-col gap-4 p-4",
           children
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this),
-      showScrollButton && showScrollDown && /* @__PURE__ */ jsxDEV("button", {
+        })
+      }),
+      showScrollButton && showScrollDown && /* @__PURE__ */ jsxs("button", {
         onClick: scrollToBottom,
         className: cn("absolute bottom-4 left-1/2 -translate-x-1/2", "bg-primary text-primary-foreground", "rounded-full px-3 py-1.5 text-sm font-medium shadow-lg", "hover:bg-primary/90 transition-colors", "flex items-center gap-1.5"),
         "aria-label": "Scroll to bottom",
         children: [
-          /* @__PURE__ */ jsxDEV("svg", {
+          /* @__PURE__ */ jsx("svg", {
             xmlns: "http://www.w3.org/2000/svg",
             width: "16",
             height: "16",
@@ -64,15 +69,15 @@ function ChatContainer({
             strokeWidth: "2",
             strokeLinecap: "round",
             strokeLinejoin: "round",
-            children: /* @__PURE__ */ jsxDEV("path", {
+            children: /* @__PURE__ */ jsx("path", {
               d: "m6 9 6 6 6-6"
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this),
+            })
+          }),
           "New messages"
         ]
-      }, undefined, true, undefined, this)
+      })
     ]
-  }, undefined, true, undefined, this);
+  });
 }
 // src/presentation/components/ChatMessage.tsx
 import * as React3 from "react";
@@ -86,16 +91,19 @@ import {
   Copy as Copy2,
   Check as Check2,
   ExternalLink,
-  Wrench
+  Wrench,
+  Pencil,
+  X
 } from "lucide-react";
 import { Button as Button2 } from "@contractspec/lib.design-system";
+import { Checkbox } from "@contractspec/lib.ui-kit-web/ui/checkbox";
 
 // src/presentation/components/CodePreview.tsx
 import * as React2 from "react";
 import { cn as cn2 } from "@contractspec/lib.ui-kit-web/ui/utils";
 import { Button } from "@contractspec/lib.design-system";
 import { Copy, Check, Play, Download } from "lucide-react";
-import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 "use client";
 var LANGUAGE_NAMES = {
   ts: "TypeScript",
@@ -148,93 +156,147 @@ function CodePreview({
     document.body.removeChild(a);
     URL.revokeObjectURL(url);
   }, [code, filename, language]);
-  return /* @__PURE__ */ jsxDEV2("div", {
+  return /* @__PURE__ */ jsxs2("div", {
     className: cn2("overflow-hidden rounded-lg border", "bg-muted/50", className),
     children: [
-      /* @__PURE__ */ jsxDEV2("div", {
+      /* @__PURE__ */ jsxs2("div", {
         className: cn2("flex items-center justify-between px-3 py-1.5", "bg-muted/80 border-b"),
         children: [
-          /* @__PURE__ */ jsxDEV2("div", {
+          /* @__PURE__ */ jsxs2("div", {
             className: "flex items-center gap-2 text-sm",
             children: [
-              filename && /* @__PURE__ */ jsxDEV2("span", {
+              filename && /* @__PURE__ */ jsx2("span", {
                 className: "text-foreground font-mono",
                 children: filename
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("span", {
+              }),
+              /* @__PURE__ */ jsx2("span", {
                 className: "text-muted-foreground",
                 children: displayLanguage
-              }, undefined, false, undefined, this)
+              })
             ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV2("div", {
+          }),
+          /* @__PURE__ */ jsxs2("div", {
             className: "flex items-center gap-1",
             children: [
-              showExecute && onExecute && /* @__PURE__ */ jsxDEV2(Button, {
+              showExecute && onExecute && /* @__PURE__ */ jsx2(Button, {
                 variant: "ghost",
                 size: "sm",
                 onPress: () => onExecute(code),
                 className: "h-7 w-7 p-0",
                 "aria-label": "Execute code",
-                children: /* @__PURE__ */ jsxDEV2(Play, {
+                children: /* @__PURE__ */ jsx2(Play, {
                   className: "h-3.5 w-3.5"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this),
-              showDownload && /* @__PURE__ */ jsxDEV2(Button, {
+                })
+              }),
+              showDownload && /* @__PURE__ */ jsx2(Button, {
                 variant: "ghost",
                 size: "sm",
                 onPress: handleDownload,
                 className: "h-7 w-7 p-0",
                 "aria-label": "Download code",
-                children: /* @__PURE__ */ jsxDEV2(Download, {
+                children: /* @__PURE__ */ jsx2(Download, {
                   className: "h-3.5 w-3.5"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this),
-              showCopy && /* @__PURE__ */ jsxDEV2(Button, {
+                })
+              }),
+              showCopy && /* @__PURE__ */ jsx2(Button, {
                 variant: "ghost",
                 size: "sm",
                 onPress: handleCopy,
                 className: "h-7 w-7 p-0",
                 "aria-label": copied ? "Copied" : "Copy code",
-                children: copied ? /* @__PURE__ */ jsxDEV2(Check, {
+                children: copied ? /* @__PURE__ */ jsx2(Check, {
                   className: "h-3.5 w-3.5 text-green-500"
-                }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV2(Copy, {
+                }) : /* @__PURE__ */ jsx2(Copy, {
                   className: "h-3.5 w-3.5"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this)
+                })
+              })
             ]
-          }, undefined, true, undefined, this)
+          })
         ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV2("div", {
+      }),
+      /* @__PURE__ */ jsx2("div", {
         className: "overflow-auto",
         style: { maxHeight },
-        children: /* @__PURE__ */ jsxDEV2("pre", {
+        children: /* @__PURE__ */ jsx2("pre", {
           className: "p-3",
-          children: /* @__PURE__ */ jsxDEV2("code", {
+          children: /* @__PURE__ */ jsx2("code", {
             className: "text-sm",
-            children: lines.map((line, i) => /* @__PURE__ */ jsxDEV2("div", {
+            children: lines.map((line, i) => /* @__PURE__ */ jsxs2("div", {
               className: "flex",
               children: [
-                /* @__PURE__ */ jsxDEV2("span", {
+                /* @__PURE__ */ jsx2("span", {
                   className: "text-muted-foreground mr-4 w-8 text-right select-none",
                   children: i + 1
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV2("span", {
+                }),
+                /* @__PURE__ */ jsx2("span", {
                   className: "flex-1",
                   children: line || " "
-                }, undefined, false, undefined, this)
+                })
               ]
-            }, i, true, undefined, this))
-          }, undefined, false, undefined, this)
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
+            }, i))
+          })
+        })
+      })
+    ]
+  });
+}
+
+// src/presentation/components/ToolResultRenderer.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+"use client";
+function isPresentationToolResult(result) {
+  return typeof result === "object" && result !== null && "presentationKey" in result && typeof result.presentationKey === "string";
+}
+function isFormToolResult(result) {
+  return typeof result === "object" && result !== null && "formKey" in result && typeof result.formKey === "string";
+}
+function ToolResultRenderer({
+  toolName,
+  result,
+  presentationRenderer,
+  formRenderer,
+  showRawFallback = true
+}) {
+  if (result === undefined || result === null) {
+    return null;
+  }
+  if (isPresentationToolResult(result) && presentationRenderer) {
+    const rendered = presentationRenderer(result.presentationKey, result.data);
+    if (rendered != null) {
+      return /* @__PURE__ */ jsx3("div", {
+        className: "border-border bg-background/50 mt-2 rounded-md border p-3",
+        children: rendered
+      });
+    }
+  }
+  if (isFormToolResult(result) && formRenderer) {
+    const rendered = formRenderer(result.formKey, result.defaultValues);
+    if (rendered != null) {
+      return /* @__PURE__ */ jsx3("div", {
+        className: "border-border bg-background/50 mt-2 rounded-md border p-3",
+        children: rendered
+      });
+    }
+  }
+  if (!showRawFallback) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs3("div", {
+    children: [
+      /* @__PURE__ */ jsx3("span", {
+        className: "text-muted-foreground font-medium",
+        children: "Output:"
+      }),
+      /* @__PURE__ */ jsx3("pre", {
+        className: "bg-background mt-1 overflow-x-auto rounded p-2 text-xs",
+        children: typeof result === "object" ? JSON.stringify(result, null, 2) : String(result)
+      })
     ]
-  }, undefined, true, undefined, this);
+  });
 }
 
 // src/presentation/components/ChatMessage.tsx
-import { jsxDEV as jsxDEV3, Fragment } from "react/jsx-dev-runtime";
+import { jsx as jsx4, jsxs as jsxs4, Fragment } from "react/jsx-runtime";
 "use client";
 function extractCodeBlocks(content) {
   const codeBlockRegex = /```(\w+)?\n([\s\S]*?)```/g;
@@ -257,33 +319,33 @@ function renderInlineMarkdown(text) {
   let key = 0;
   while ((match = linkRegex.exec(text)) !== null) {
     if (match.index > lastIndex) {
-      parts.push(/* @__PURE__ */ jsxDEV3("span", {
+      parts.push(/* @__PURE__ */ jsx4("span", {
         children: text.slice(lastIndex, match.index)
-      }, key++, false, undefined, this));
+      }, key++));
     }
-    parts.push(/* @__PURE__ */ jsxDEV3("a", {
+    parts.push(/* @__PURE__ */ jsx4("a", {
       href: match[2],
       target: "_blank",
       rel: "noopener noreferrer",
       className: "text-primary underline hover:no-underline",
       children: match[1]
-    }, key++, false, undefined, this));
+    }, key++));
     lastIndex = match.index + match[0].length;
   }
   if (lastIndex < text.length) {
-    parts.push(/* @__PURE__ */ jsxDEV3("span", {
+    parts.push(/* @__PURE__ */ jsx4("span", {
       children: text.slice(lastIndex)
-    }, key++, false, undefined, this));
+    }, key++));
   }
   return parts.length > 0 ? parts : [text];
 }
 function MessageContent({ content }) {
   const codeBlocks = extractCodeBlocks(content);
   if (codeBlocks.length === 0) {
-    return /* @__PURE__ */ jsxDEV3("p", {
+    return /* @__PURE__ */ jsx4("p", {
       className: "whitespace-pre-wrap",
       children: renderInlineMarkdown(content)
-    }, undefined, false, undefined, this);
+    });
   }
   let remaining = content;
   const parts = [];
@@ -291,33 +353,40 @@ function MessageContent({ content }) {
   for (const block of codeBlocks) {
     const [before, after] = remaining.split(block.raw);
     if (before) {
-      parts.push(/* @__PURE__ */ jsxDEV3("p", {
+      parts.push(/* @__PURE__ */ jsx4("p", {
         className: "whitespace-pre-wrap",
         children: renderInlineMarkdown(before.trim())
-      }, key++, false, undefined, this));
+      }, key++));
     }
-    parts.push(/* @__PURE__ */ jsxDEV3(CodePreview, {
+    parts.push(/* @__PURE__ */ jsx4(CodePreview, {
       code: block.code,
       language: block.language,
       className: "my-2"
-    }, key++, false, undefined, this));
+    }, key++));
     remaining = after ?? "";
   }
   if (remaining.trim()) {
-    parts.push(/* @__PURE__ */ jsxDEV3("p", {
+    parts.push(/* @__PURE__ */ jsx4("p", {
       className: "whitespace-pre-wrap",
       children: renderInlineMarkdown(remaining.trim())
-    }, key++, false, undefined, this));
+    }, key++));
   }
-  return /* @__PURE__ */ jsxDEV3(Fragment, {
+  return /* @__PURE__ */ jsx4(Fragment, {
     children: parts
-  }, undefined, false, undefined, this);
+  });
 }
 function ChatMessage({
   message,
   className,
   showCopy = true,
-  showAvatar = true
+  showAvatar = true,
+  selectable = false,
+  selected = false,
+  onSelect,
+  editable = false,
+  onEdit,
+  presentationRenderer,
+  formRenderer
 }) {
   const [copied, setCopied] = React3.useState(false);
   const isUser = message.role === "user";
@@ -328,185 +397,262 @@ function ChatMessage({
     setCopied(true);
     setTimeout(() => setCopied(false), 2000);
   }, [message.content]);
-  return /* @__PURE__ */ jsxDEV3("div", {
+  const handleSelectChange = React3.useCallback((checked) => {
+    if (checked !== "indeterminate")
+      onSelect?.(message.id);
+  }, [message.id, onSelect]);
+  const [isEditing, setIsEditing] = React3.useState(false);
+  const [editContent, setEditContent] = React3.useState(message.content);
+  React3.useEffect(() => {
+    setEditContent(message.content);
+  }, [message.content]);
+  const handleStartEdit = React3.useCallback(() => {
+    setEditContent(message.content);
+    setIsEditing(true);
+  }, [message.content]);
+  const handleSaveEdit = React3.useCallback(async () => {
+    const trimmed = editContent.trim();
+    if (trimmed !== message.content) {
+      await onEdit?.(message.id, trimmed);
+    }
+    setIsEditing(false);
+  }, [editContent, message.id, message.content, onEdit]);
+  const handleCancelEdit = React3.useCallback(() => {
+    setEditContent(message.content);
+    setIsEditing(false);
+  }, [message.content]);
+  return /* @__PURE__ */ jsxs4("div", {
     className: cn3("group flex gap-3", isUser && "flex-row-reverse", className),
     children: [
-      showAvatar && /* @__PURE__ */ jsxDEV3(Avatar, {
+      selectable && /* @__PURE__ */ jsx4("div", {
+        className: cn3("flex shrink-0 items-start pt-1", "opacity-0 transition-opacity group-hover:opacity-100"),
+        children: /* @__PURE__ */ jsx4(Checkbox, {
+          checked: selected,
+          onCheckedChange: handleSelectChange,
+          "aria-label": selected ? "Deselect message" : "Select message"
+        })
+      }),
+      showAvatar && /* @__PURE__ */ jsx4(Avatar, {
         className: "h-8 w-8 shrink-0",
-        children: /* @__PURE__ */ jsxDEV3(AvatarFallback, {
+        children: /* @__PURE__ */ jsx4(AvatarFallback, {
           className: cn3(isUser ? "bg-primary text-primary-foreground" : "bg-muted"),
-          children: isUser ? /* @__PURE__ */ jsxDEV3(User, {
+          children: isUser ? /* @__PURE__ */ jsx4(User, {
             className: "h-4 w-4"
-          }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV3(Bot, {
+          }) : /* @__PURE__ */ jsx4(Bot, {
             className: "h-4 w-4"
-          }, undefined, false, undefined, this)
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV3("div", {
+          })
+        })
+      }),
+      /* @__PURE__ */ jsxs4("div", {
         className: cn3("flex max-w-[80%] flex-col gap-1", isUser && "items-end"),
         children: [
-          /* @__PURE__ */ jsxDEV3("div", {
+          /* @__PURE__ */ jsx4("div", {
             className: cn3("rounded-2xl px-4 py-2", isUser ? "bg-primary text-primary-foreground" : "bg-muted text-foreground", isError && "border-destructive bg-destructive/10 border"),
-            children: isError && message.error ? /* @__PURE__ */ jsxDEV3("div", {
+            children: isError && message.error ? /* @__PURE__ */ jsxs4("div", {
               className: "flex items-start gap-2",
               children: [
-                /* @__PURE__ */ jsxDEV3(AlertCircle, {
+                /* @__PURE__ */ jsx4(AlertCircle, {
                   className: "text-destructive mt-0.5 h-4 w-4 shrink-0"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV3("div", {
+                }),
+                /* @__PURE__ */ jsxs4("div", {
                   children: [
-                    /* @__PURE__ */ jsxDEV3("p", {
+                    /* @__PURE__ */ jsx4("p", {
                       className: "text-destructive font-medium",
                       children: message.error.code
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV3("p", {
+                    }),
+                    /* @__PURE__ */ jsx4("p", {
                       className: "text-muted-foreground text-sm",
                       children: message.error.message
-                    }, undefined, false, undefined, this)
+                    })
+                  ]
+                })
+              ]
+            }) : isEditing ? /* @__PURE__ */ jsxs4("div", {
+              className: "flex flex-col gap-2",
+              children: [
+                /* @__PURE__ */ jsx4("textarea", {
+                  value: editContent,
+                  onChange: (e) => setEditContent(e.target.value),
+                  className: "bg-background/50 min-h-[80px] w-full resize-y rounded-md border px-3 py-2 text-sm",
+                  rows: 4,
+                  autoFocus: true
+                }),
+                /* @__PURE__ */ jsxs4("div", {
+                  className: "flex gap-2",
+                  children: [
+                    /* @__PURE__ */ jsxs4(Button2, {
+                      variant: "default",
+                      size: "sm",
+                      onPress: handleSaveEdit,
+                      "aria-label": "Save edit",
+                      children: [
+                        /* @__PURE__ */ jsx4(Check2, {
+                          className: "h-3 w-3"
+                        }),
+                        "Save"
+                      ]
+                    }),
+                    /* @__PURE__ */ jsxs4(Button2, {
+                      variant: "ghost",
+                      size: "sm",
+                      onPress: handleCancelEdit,
+                      "aria-label": "Cancel edit",
+                      children: [
+                        /* @__PURE__ */ jsx4(X, {
+                          className: "h-3 w-3"
+                        }),
+                        "Cancel"
+                      ]
+                    })
                   ]
-                }, undefined, true, undefined, this)
+                })
               ]
-            }, undefined, true, undefined, this) : isStreaming && !message.content ? /* @__PURE__ */ jsxDEV3("div", {
+            }) : isStreaming && !message.content ? /* @__PURE__ */ jsxs4("div", {
               className: "flex flex-col gap-2",
               children: [
-                /* @__PURE__ */ jsxDEV3(Skeleton, {
+                /* @__PURE__ */ jsx4(Skeleton, {
                   className: "h-4 w-48"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV3(Skeleton, {
+                }),
+                /* @__PURE__ */ jsx4(Skeleton, {
                   className: "h-4 w-32"
-                }, undefined, false, undefined, this)
+                })
               ]
-            }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV3(MessageContent, {
+            }) : /* @__PURE__ */ jsx4(MessageContent, {
               content: message.content
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV3("div", {
+            })
+          }),
+          /* @__PURE__ */ jsxs4("div", {
             className: cn3("flex items-center gap-2 text-xs", "text-muted-foreground opacity-0 transition-opacity", "group-hover:opacity-100"),
             children: [
-              /* @__PURE__ */ jsxDEV3("span", {
+              /* @__PURE__ */ jsx4("span", {
                 children: new Date(message.createdAt).toLocaleTimeString([], {
                   hour: "2-digit",
                   minute: "2-digit"
                 })
-              }, undefined, false, undefined, this),
-              message.usage && /* @__PURE__ */ jsxDEV3("span", {
+              }),
+              message.usage && /* @__PURE__ */ jsxs4("span", {
                 children: [
                   message.usage.inputTokens + message.usage.outputTokens,
                   " tokens"
                 ]
-              }, undefined, true, undefined, this),
-              showCopy && !isUser && message.content && /* @__PURE__ */ jsxDEV3(Button2, {
+              }),
+              showCopy && !isUser && message.content && /* @__PURE__ */ jsx4(Button2, {
                 variant: "ghost",
                 size: "sm",
                 className: "h-6 w-6 p-0",
                 onPress: handleCopy,
                 "aria-label": copied ? "Copied" : "Copy message",
-                children: copied ? /* @__PURE__ */ jsxDEV3(Check2, {
+                children: copied ? /* @__PURE__ */ jsx4(Check2, {
+                  className: "h-3 w-3"
+                }) : /* @__PURE__ */ jsx4(Copy2, {
                   className: "h-3 w-3"
-                }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV3(Copy2, {
+                })
+              }),
+              editable && isUser && !isEditing && /* @__PURE__ */ jsx4(Button2, {
+                variant: "ghost",
+                size: "sm",
+                className: "h-6 w-6 p-0",
+                onPress: handleStartEdit,
+                "aria-label": "Edit message",
+                children: /* @__PURE__ */ jsx4(Pencil, {
                   className: "h-3 w-3"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this)
+                })
+              })
             ]
-          }, undefined, true, undefined, this),
-          message.reasoning && /* @__PURE__ */ jsxDEV3("details", {
+          }),
+          message.reasoning && /* @__PURE__ */ jsxs4("details", {
             className: "text-muted-foreground mt-2 text-sm",
             children: [
-              /* @__PURE__ */ jsxDEV3("summary", {
+              /* @__PURE__ */ jsx4("summary", {
                 className: "cursor-pointer hover:underline",
                 children: "View reasoning"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV3("div", {
+              }),
+              /* @__PURE__ */ jsx4("div", {
                 className: "bg-muted mt-1 rounded-md p-2",
-                children: /* @__PURE__ */ jsxDEV3("p", {
+                children: /* @__PURE__ */ jsx4("p", {
                   className: "whitespace-pre-wrap",
                   children: message.reasoning
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this)
+                })
+              })
             ]
-          }, undefined, true, undefined, this),
-          message.sources && message.sources.length > 0 && /* @__PURE__ */ jsxDEV3("div", {
+          }),
+          message.sources && message.sources.length > 0 && /* @__PURE__ */ jsx4("div", {
             className: "mt-2 flex flex-wrap gap-2",
-            children: message.sources.map((source) => /* @__PURE__ */ jsxDEV3("a", {
+            children: message.sources.map((source) => /* @__PURE__ */ jsxs4("a", {
               href: source.url ?? "#",
               target: "_blank",
               rel: "noopener noreferrer",
               className: "text-muted-foreground hover:text-foreground bg-muted inline-flex items-center gap-1 rounded-md px-2 py-1 text-xs transition-colors",
               children: [
-                /* @__PURE__ */ jsxDEV3(ExternalLink, {
+                /* @__PURE__ */ jsx4(ExternalLink, {
                   className: "h-3 w-3"
-                }, undefined, false, undefined, this),
+                }),
                 source.title || source.url || source.id
               ]
-            }, source.id, true, undefined, this))
-          }, undefined, false, undefined, this),
-          message.toolCalls && message.toolCalls.length > 0 && /* @__PURE__ */ jsxDEV3("div", {
+            }, source.id))
+          }),
+          message.toolCalls && message.toolCalls.length > 0 && /* @__PURE__ */ jsx4("div", {
             className: "mt-2 space-y-2",
-            children: message.toolCalls.map((tc) => /* @__PURE__ */ jsxDEV3("details", {
+            children: message.toolCalls.map((tc) => /* @__PURE__ */ jsxs4("details", {
               className: "bg-muted border-border rounded-md border",
               children: [
-                /* @__PURE__ */ jsxDEV3("summary", {
+                /* @__PURE__ */ jsxs4("summary", {
                   className: "flex cursor-pointer items-center gap-2 px-3 py-2 text-sm font-medium",
                   children: [
-                    /* @__PURE__ */ jsxDEV3(Wrench, {
+                    /* @__PURE__ */ jsx4(Wrench, {
                       className: "text-muted-foreground h-4 w-4"
-                    }, undefined, false, undefined, this),
+                    }),
                     tc.name,
-                    /* @__PURE__ */ jsxDEV3("span", {
+                    /* @__PURE__ */ jsx4("span", {
                       className: cn3("ml-auto rounded px-1.5 py-0.5 text-xs", tc.status === "completed" && "bg-green-500/20 text-green-700 dark:text-green-400", tc.status === "error" && "bg-destructive/20 text-destructive", tc.status === "running" && "bg-blue-500/20 text-blue-700 dark:text-blue-400"),
                       children: tc.status
-                    }, undefined, false, undefined, this)
+                    })
                   ]
-                }, undefined, true, undefined, this),
-                /* @__PURE__ */ jsxDEV3("div", {
+                }),
+                /* @__PURE__ */ jsxs4("div", {
                   className: "border-border border-t px-3 py-2 text-xs",
                   children: [
-                    Object.keys(tc.args).length > 0 && /* @__PURE__ */ jsxDEV3("div", {
+                    Object.keys(tc.args).length > 0 && /* @__PURE__ */ jsxs4("div", {
                       className: "mb-2",
                       children: [
-                        /* @__PURE__ */ jsxDEV3("span", {
+                        /* @__PURE__ */ jsx4("span", {
                           className: "text-muted-foreground font-medium",
                           children: "Input:"
-                        }, undefined, false, undefined, this),
-                        /* @__PURE__ */ jsxDEV3("pre", {
+                        }),
+                        /* @__PURE__ */ jsx4("pre", {
                           className: "bg-background mt-1 overflow-x-auto rounded p-2",
                           children: JSON.stringify(tc.args, null, 2)
-                        }, undefined, false, undefined, this)
-                      ]
-                    }, undefined, true, undefined, this),
-                    tc.result !== undefined && /* @__PURE__ */ jsxDEV3("div", {
-                      children: [
-                        /* @__PURE__ */ jsxDEV3("span", {
-                          className: "text-muted-foreground font-medium",
-                          children: "Output:"
-                        }, undefined, false, undefined, this),
-                        /* @__PURE__ */ jsxDEV3("pre", {
-                          className: "bg-background mt-1 overflow-x-auto rounded p-2",
-                          children: typeof tc.result === "object" ? JSON.stringify(tc.result, null, 2) : String(tc.result)
-                        }, undefined, false, undefined, this)
+                        })
                       ]
-                    }, undefined, true, undefined, this),
-                    tc.error && /* @__PURE__ */ jsxDEV3("p", {
+                    }),
+                    tc.result !== undefined && /* @__PURE__ */ jsx4(ToolResultRenderer, {
+                      toolName: tc.name,
+                      result: tc.result,
+                      presentationRenderer,
+                      formRenderer,
+                      showRawFallback: true
+                    }),
+                    tc.error && /* @__PURE__ */ jsx4("p", {
                       className: "text-destructive mt-1",
                       children: tc.error
-                    }, undefined, false, undefined, this)
+                    })
                   ]
-                }, undefined, true, undefined, this)
+                })
               ]
-            }, tc.id, true, undefined, this))
-          }, undefined, false, undefined, this)
+            }, tc.id))
+          })
         ]
-      }, undefined, true, undefined, this)
+      })
     ]
-  }, undefined, true, undefined, this);
+  });
 }
 // src/presentation/components/ChatInput.tsx
 import * as React4 from "react";
 import { cn as cn4 } from "@contractspec/lib.ui-kit-web/ui/utils";
 import { Textarea } from "@contractspec/lib.design-system";
 import { Button as Button3 } from "@contractspec/lib.design-system";
-import { Send, Paperclip, X, Loader2, FileText, Code } from "lucide-react";
-import { jsxDEV as jsxDEV4, Fragment as Fragment2 } from "react/jsx-dev-runtime";
+import { Send, Paperclip, X as X2, Loader2, FileText, Code } from "lucide-react";
+import { jsx as jsx5, jsxs as jsxs5, Fragment as Fragment2 } from "react/jsx-runtime";
 "use client";
 function ChatInput({
   onSend,
@@ -572,42 +718,42 @@ function ChatInput({
   const removeAttachment = React4.useCallback((id) => {
     setAttachments((prev) => prev.filter((a) => a.id !== id));
   }, []);
-  return /* @__PURE__ */ jsxDEV4("div", {
+  return /* @__PURE__ */ jsxs5("div", {
     className: cn4("flex flex-col gap-2", className),
     children: [
-      attachments.length > 0 && /* @__PURE__ */ jsxDEV4("div", {
+      attachments.length > 0 && /* @__PURE__ */ jsx5("div", {
         className: "flex flex-wrap gap-2",
-        children: attachments.map((attachment) => /* @__PURE__ */ jsxDEV4("div", {
+        children: attachments.map((attachment) => /* @__PURE__ */ jsxs5("div", {
           className: cn4("flex items-center gap-1.5 rounded-md px-2 py-1", "bg-muted text-muted-foreground text-sm"),
           children: [
-            attachment.type === "code" ? /* @__PURE__ */ jsxDEV4(Code, {
+            attachment.type === "code" ? /* @__PURE__ */ jsx5(Code, {
               className: "h-3.5 w-3.5"
-            }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV4(FileText, {
+            }) : /* @__PURE__ */ jsx5(FileText, {
               className: "h-3.5 w-3.5"
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV4("span", {
+            }),
+            /* @__PURE__ */ jsx5("span", {
               className: "max-w-[150px] truncate",
               children: attachment.name
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV4("button", {
+            }),
+            /* @__PURE__ */ jsx5("button", {
               type: "button",
               onClick: () => removeAttachment(attachment.id),
               className: "hover:text-foreground",
               "aria-label": `Remove ${attachment.name}`,
-              children: /* @__PURE__ */ jsxDEV4(X, {
+              children: /* @__PURE__ */ jsx5(X2, {
                 className: "h-3.5 w-3.5"
-              }, undefined, false, undefined, this)
-            }, undefined, false, undefined, this)
+              })
+            })
           ]
-        }, attachment.id, true, undefined, this))
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV4("form", {
+        }, attachment.id))
+      }),
+      /* @__PURE__ */ jsxs5("form", {
         onSubmit: handleSubmit,
         className: "flex items-end gap-2",
         children: [
-          showAttachments && /* @__PURE__ */ jsxDEV4(Fragment2, {
+          showAttachments && /* @__PURE__ */ jsxs5(Fragment2, {
             children: [
-              /* @__PURE__ */ jsxDEV4("input", {
+              /* @__PURE__ */ jsx5("input", {
                 ref: fileInputRef,
                 type: "file",
                 multiple: true,
@@ -615,23 +761,23 @@ function ChatInput({
                 onChange: handleFileSelect,
                 className: "hidden",
                 "aria-label": "Attach files"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV4(Button3, {
+              }),
+              /* @__PURE__ */ jsx5(Button3, {
                 type: "button",
                 variant: "ghost",
                 size: "sm",
                 onPress: () => fileInputRef.current?.click(),
                 disabled: disabled || attachments.length >= maxAttachments,
                 "aria-label": "Attach files",
-                children: /* @__PURE__ */ jsxDEV4(Paperclip, {
+                children: /* @__PURE__ */ jsx5(Paperclip, {
                   className: "h-4 w-4"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this)
+                })
+              })
             ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV4("div", {
+          }),
+          /* @__PURE__ */ jsx5("div", {
             className: "relative flex-1",
-            children: /* @__PURE__ */ jsxDEV4(Textarea, {
+            children: /* @__PURE__ */ jsx5(Textarea, {
               value: content,
               onChange: (e) => setContent(e.target.value),
               onKeyDown: handleKeyDown,
@@ -640,32 +786,418 @@ function ChatInput({
               className: cn4("max-h-[200px] min-h-[44px] resize-none pr-12", "focus-visible:ring-1"),
               rows: 1,
               "aria-label": "Chat message"
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV4(Button3, {
+            })
+          }),
+          /* @__PURE__ */ jsx5(Button3, {
             type: "submit",
             disabled: !canSend || disabled || isLoading,
             size: "sm",
             "aria-label": isLoading ? "Sending..." : "Send message",
-            children: isLoading ? /* @__PURE__ */ jsxDEV4(Loader2, {
+            children: isLoading ? /* @__PURE__ */ jsx5(Loader2, {
               className: "h-4 w-4 animate-spin"
-            }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV4(Send, {
+            }) : /* @__PURE__ */ jsx5(Send, {
               className: "h-4 w-4"
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this)
+            })
+          })
         ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV4("p", {
+      }),
+      /* @__PURE__ */ jsx5("p", {
         className: "text-muted-foreground text-xs",
         children: "Press Enter to send, Shift+Enter for new line"
-      }, undefined, false, undefined, this)
+      })
     ]
-  }, undefined, true, undefined, this);
+  });
 }
-// src/presentation/components/ModelPicker.tsx
+// src/presentation/components/ChatExportToolbar.tsx
 import * as React5 from "react";
-import { cn as cn5 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { Download as Download2, FileText as FileText2, Copy as Copy3, Check as Check3, Plus, GitFork } from "lucide-react";
 import { Button as Button4 } from "@contractspec/lib.design-system";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from "@contractspec/lib.ui-kit-web/ui/dropdown-menu";
+
+// src/core/export-formatters.ts
+function formatTimestamp(date) {
+  return date.toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function toIsoString(date) {
+  return date.toISOString();
+}
+function messageToJsonSerializable(msg) {
+  return {
+    id: msg.id,
+    conversationId: msg.conversationId,
+    role: msg.role,
+    content: msg.content,
+    status: msg.status,
+    createdAt: toIsoString(msg.createdAt),
+    updatedAt: toIsoString(msg.updatedAt),
+    ...msg.attachments && { attachments: msg.attachments },
+    ...msg.codeBlocks && { codeBlocks: msg.codeBlocks },
+    ...msg.toolCalls && { toolCalls: msg.toolCalls },
+    ...msg.sources && { sources: msg.sources },
+    ...msg.reasoning && { reasoning: msg.reasoning },
+    ...msg.usage && { usage: msg.usage },
+    ...msg.error && { error: msg.error },
+    ...msg.metadata && { metadata: msg.metadata }
+  };
+}
+function formatSourcesMarkdown(sources) {
+  if (sources.length === 0)
+    return "";
+  return `
+
+**Sources:**
+` + sources.map((s) => `- [${s.title}](${s.url ?? "#"})`).join(`
+`);
+}
+function formatSourcesTxt(sources) {
+  if (sources.length === 0)
+    return "";
+  return `
+
+Sources:
+` + sources.map((s) => `- ${s.title}${s.url ? ` - ${s.url}` : ""}`).join(`
+`);
+}
+function formatToolCallsMarkdown(toolCalls) {
+  if (toolCalls.length === 0)
+    return "";
+  return `
+
+**Tool calls:**
+` + toolCalls.map((tc) => `**${tc.name}** (${tc.status})
+\`\`\`json
+${JSON.stringify(tc.args, null, 2)}
+\`\`\`` + (tc.result !== undefined ? `
+Output:
+\`\`\`json
+${typeof tc.result === "object" ? JSON.stringify(tc.result, null, 2) : String(tc.result)}
+\`\`\`` : "") + (tc.error ? `
+Error: ${tc.error}` : "")).join(`
+
+`);
+}
+function formatToolCallsTxt(toolCalls) {
+  if (toolCalls.length === 0)
+    return "";
+  return `
+
+Tool calls:
+` + toolCalls.map((tc) => `- ${tc.name} (${tc.status}): ${JSON.stringify(tc.args)}` + (tc.result !== undefined ? ` -> ${typeof tc.result === "object" ? JSON.stringify(tc.result) : String(tc.result)}` : "") + (tc.error ? ` [Error: ${tc.error}]` : "")).join(`
+`);
+}
+function formatUsage(usage) {
+  const total = usage.inputTokens + usage.outputTokens;
+  return ` (${total} tokens)`;
+}
+function formatMessagesAsMarkdown(messages) {
+  const parts = [];
+  for (const msg of messages) {
+    const roleLabel = msg.role === "user" ? "User" : msg.role === "assistant" ? "Assistant" : "System";
+    const header = `## ${roleLabel}`;
+    const timestamp = `*${formatTimestamp(msg.createdAt)}*`;
+    const usageSuffix = msg.usage ? formatUsage(msg.usage) : "";
+    const meta = `${timestamp}${usageSuffix}
+
+`;
+    let body = msg.content;
+    if (msg.error) {
+      body += `
+
+**Error:** ${msg.error.code} - ${msg.error.message}`;
+    }
+    if (msg.reasoning) {
+      body += `
+
+> **Reasoning:**
+> ${msg.reasoning.replace(/\n/g, `
+> `)}`;
+    }
+    body += formatSourcesMarkdown(msg.sources ?? []);
+    body += formatToolCallsMarkdown(msg.toolCalls ?? []);
+    parts.push(`${header}
+
+${meta}${body}`);
+  }
+  return parts.join(`
+
+---
+
+`);
+}
+function formatMessagesAsTxt(messages) {
+  const parts = [];
+  for (const msg of messages) {
+    const roleLabel = msg.role === "user" ? "User" : msg.role === "assistant" ? "Assistant" : "System";
+    const timestamp = `(${formatTimestamp(msg.createdAt)})`;
+    const usageSuffix = msg.usage ? formatUsage(msg.usage) : "";
+    const header = `[${roleLabel}] ${timestamp}${usageSuffix}
+
+`;
+    let body = msg.content;
+    if (msg.error) {
+      body += `
+
+Error: ${msg.error.code} - ${msg.error.message}`;
+    }
+    if (msg.reasoning) {
+      body += `
+
+Reasoning: ${msg.reasoning}`;
+    }
+    body += formatSourcesTxt(msg.sources ?? []);
+    body += formatToolCallsTxt(msg.toolCalls ?? []);
+    parts.push(`${header}${body}`);
+  }
+  return parts.join(`
+
+---
+
+`);
+}
+function formatMessagesAsJson(messages, conversation) {
+  const payload = {
+    messages: messages.map(messageToJsonSerializable)
+  };
+  if (conversation) {
+    payload.conversation = {
+      id: conversation.id,
+      title: conversation.title,
+      status: conversation.status,
+      createdAt: toIsoString(conversation.createdAt),
+      updatedAt: toIsoString(conversation.updatedAt),
+      provider: conversation.provider,
+      model: conversation.model,
+      workspacePath: conversation.workspacePath,
+      contextFiles: conversation.contextFiles,
+      summary: conversation.summary,
+      metadata: conversation.metadata
+    };
+  }
+  return JSON.stringify(payload, null, 2);
+}
+function getExportFilename(format, conversation) {
+  const timestamp = new Date().toISOString().replace(/[:.]/g, "-").slice(0, 19);
+  const base = conversation?.title ? conversation.title.replace(/[^a-zA-Z0-9-_]/g, "_").slice(0, 40) : "chat-export";
+  const ext = format === "markdown" ? "md" : format === "txt" ? "txt" : "json";
+  return `${base}-${timestamp}.${ext}`;
+}
+var MIME_TYPES = {
+  markdown: "text/markdown",
+  txt: "text/plain",
+  json: "application/json"
+};
+function downloadAsFile(content, filename, mimeType) {
+  const blob = new Blob([content], { type: mimeType });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+}
+function exportToFile(messages, format, conversation) {
+  let content;
+  if (format === "markdown") {
+    content = formatMessagesAsMarkdown(messages);
+  } else if (format === "txt") {
+    content = formatMessagesAsTxt(messages);
+  } else {
+    content = formatMessagesAsJson(messages, conversation);
+  }
+  const filename = getExportFilename(format, conversation);
+  const mimeType = MIME_TYPES[format];
+  downloadAsFile(content, filename, mimeType);
+}
+
+// src/presentation/components/ChatExportToolbar.tsx
+import { jsx as jsx6, jsxs as jsxs6, Fragment as Fragment3 } from "react/jsx-runtime";
+"use client";
+function ChatExportToolbar({
+  messages,
+  conversation,
+  selectedIds,
+  onExported,
+  showSelectionSummary = true,
+  onSelectAll,
+  onClearSelection,
+  selectedCount = selectedIds.size,
+  totalCount = messages.length,
+  onCreateNew,
+  onFork
+}) {
+  const [copied, setCopied] = React5.useState(false);
+  const toExport = React5.useMemo(() => {
+    if (selectedIds.size > 0) {
+      const idSet = selectedIds;
+      return messages.filter((m) => idSet.has(m.id));
+    }
+    return messages;
+  }, [messages, selectedIds]);
+  const handleExport = React5.useCallback((format) => {
+    exportToFile(toExport, format, conversation);
+    onExported?.(format, toExport.length);
+  }, [toExport, conversation, onExported]);
+  const handleCopy = React5.useCallback(async () => {
+    const content = formatMessagesAsMarkdown(toExport);
+    await navigator.clipboard.writeText(content);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2000);
+    onExported?.("markdown", toExport.length);
+  }, [toExport, onExported]);
+  const disabled = messages.length === 0;
+  const [forking, setForking] = React5.useState(false);
+  const handleFork = React5.useCallback(async (upToMessageId) => {
+    if (!onFork)
+      return;
+    setForking(true);
+    try {
+      await onFork(upToMessageId);
+    } finally {
+      setForking(false);
+    }
+  }, [onFork]);
+  return /* @__PURE__ */ jsxs6("div", {
+    className: "flex items-center gap-2",
+    children: [
+      onCreateNew && /* @__PURE__ */ jsxs6(Button4, {
+        variant: "outline",
+        size: "sm",
+        onPress: onCreateNew,
+        "aria-label": "New conversation",
+        children: [
+          /* @__PURE__ */ jsx6(Plus, {
+            className: "h-4 w-4"
+          }),
+          "New"
+        ]
+      }),
+      onFork && messages.length > 0 && /* @__PURE__ */ jsxs6(Button4, {
+        variant: "outline",
+        size: "sm",
+        disabled: forking,
+        onPress: () => handleFork(),
+        "aria-label": "Fork conversation",
+        children: [
+          /* @__PURE__ */ jsx6(GitFork, {
+            className: "h-4 w-4"
+          }),
+          "Fork"
+        ]
+      }),
+      showSelectionSummary && selectedCount > 0 && /* @__PURE__ */ jsxs6("span", {
+        className: "text-muted-foreground text-sm",
+        children: [
+          selectedCount,
+          " message",
+          selectedCount !== 1 ? "s" : "",
+          " selected"
+        ]
+      }),
+      onSelectAll && onClearSelection && totalCount > 0 && /* @__PURE__ */ jsxs6(Fragment3, {
+        children: [
+          /* @__PURE__ */ jsx6(Button4, {
+            variant: "ghost",
+            size: "sm",
+            onPress: onSelectAll,
+            className: "text-xs",
+            children: "Select all"
+          }),
+          selectedCount > 0 && /* @__PURE__ */ jsx6(Button4, {
+            variant: "ghost",
+            size: "sm",
+            onPress: onClearSelection,
+            className: "text-xs",
+            children: "Clear"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs6(DropdownMenu, {
+        children: [
+          /* @__PURE__ */ jsx6(DropdownMenuTrigger, {
+            asChild: true,
+            children: /* @__PURE__ */ jsxs6(Button4, {
+              variant: "outline",
+              size: "sm",
+              disabled,
+              "aria-label": selectedCount > 0 ? "Export selected messages" : "Export conversation",
+              children: [
+                /* @__PURE__ */ jsx6(Download2, {
+                  className: "h-4 w-4"
+                }),
+                "Export"
+              ]
+            })
+          }),
+          /* @__PURE__ */ jsxs6(DropdownMenuContent, {
+            align: "end",
+            children: [
+              /* @__PURE__ */ jsxs6(DropdownMenuItem, {
+                onSelect: () => handleExport("markdown"),
+                disabled,
+                children: [
+                  /* @__PURE__ */ jsx6(FileText2, {
+                    className: "h-4 w-4"
+                  }),
+                  "Export as Markdown (.md)"
+                ]
+              }),
+              /* @__PURE__ */ jsxs6(DropdownMenuItem, {
+                onSelect: () => handleExport("txt"),
+                disabled,
+                children: [
+                  /* @__PURE__ */ jsx6(FileText2, {
+                    className: "h-4 w-4"
+                  }),
+                  "Export as Plain Text (.txt)"
+                ]
+              }),
+              /* @__PURE__ */ jsxs6(DropdownMenuItem, {
+                onSelect: () => handleExport("json"),
+                disabled,
+                children: [
+                  /* @__PURE__ */ jsx6(FileText2, {
+                    className: "h-4 w-4"
+                  }),
+                  "Export as JSON (.json)"
+                ]
+              }),
+              /* @__PURE__ */ jsx6(DropdownMenuSeparator, {}),
+              /* @__PURE__ */ jsxs6(DropdownMenuItem, {
+                onSelect: () => handleCopy(),
+                disabled,
+                children: [
+                  copied ? /* @__PURE__ */ jsx6(Check3, {
+                    className: "h-4 w-4 text-green-500"
+                  }) : /* @__PURE__ */ jsx6(Copy3, {
+                    className: "h-4 w-4"
+                  }),
+                  copied ? "Copied to clipboard" : "Copy to clipboard"
+                ]
+              })
+            ]
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/presentation/components/ChatWithExport.tsx
+import * as React8 from "react";
+
+// src/presentation/components/ThinkingLevelPicker.tsx
+import * as React6 from "react";
+import { cn as cn5 } from "@contractspec/lib.ui-kit-web/ui/utils";
 import {
   Select,
   SelectContent,
@@ -673,402 +1205,487 @@ import {
   SelectTrigger,
   SelectValue
 } from "@contractspec/lib.ui-kit-web/ui/select";
-import { Badge } from "@contractspec/lib.ui-kit-web/ui/badge";
 import { Label } from "@contractspec/lib.ui-kit-web/ui/label";
-import { Bot as Bot2, Cloud, Cpu, Sparkles } from "lucide-react";
-import {
-  getModelsForProvider
-} from "@contractspec/lib.ai-providers";
-import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
-"use client";
-var PROVIDER_ICONS = {
-  ollama: /* @__PURE__ */ jsxDEV5(Cpu, {
-    className: "h-4 w-4"
-  }, undefined, false, undefined, this),
-  openai: /* @__PURE__ */ jsxDEV5(Bot2, {
-    className: "h-4 w-4"
-  }, undefined, false, undefined, this),
-  anthropic: /* @__PURE__ */ jsxDEV5(Sparkles, {
-    className: "h-4 w-4"
-  }, undefined, false, undefined, this),
-  mistral: /* @__PURE__ */ jsxDEV5(Cloud, {
-    className: "h-4 w-4"
-  }, undefined, false, undefined, this),
-  gemini: /* @__PURE__ */ jsxDEV5(Sparkles, {
-    className: "h-4 w-4"
-  }, undefined, false, undefined, this)
-};
-var PROVIDER_NAMES = {
-  ollama: "Ollama (Local)",
-  openai: "OpenAI",
-  anthropic: "Anthropic",
-  mistral: "Mistral",
-  gemini: "Google Gemini"
+
+// src/core/thinking-levels.ts
+var THINKING_LEVEL_LABELS = {
+  instant: "Instant",
+  thinking: "Thinking",
+  extra_thinking: "Extra Thinking",
+  max: "Max"
 };
-var MODE_BADGES = {
-  local: { label: "Local", variant: "secondary" },
-  byok: { label: "BYOK", variant: "outline" },
-  managed: { label: "Managed", variant: "default" }
+var THINKING_LEVEL_DESCRIPTIONS = {
+  instant: "Fast responses, minimal reasoning",
+  thinking: "Standard reasoning depth",
+  extra_thinking: "More thorough reasoning",
+  max: "Maximum reasoning depth"
 };
-function ModelPicker({
+function getProviderOptions(level, providerName) {
+  if (!level || level === "instant") {
+    return {};
+  }
+  switch (providerName) {
+    case "anthropic": {
+      const budgetMap = {
+        thinking: 8000,
+        extra_thinking: 16000,
+        max: 32000
+      };
+      return {
+        anthropic: {
+          thinking: { type: "enabled", budgetTokens: budgetMap[level] }
+        }
+      };
+    }
+    case "openai": {
+      const effortMap = {
+        thinking: "low",
+        extra_thinking: "medium",
+        max: "high"
+      };
+      return {
+        openai: {
+          reasoningEffort: effortMap[level]
+        }
+      };
+    }
+    case "ollama":
+    case "mistral":
+    case "gemini":
+      return {};
+    default:
+      return {};
+  }
+}
+
+// src/presentation/components/ThinkingLevelPicker.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+"use client";
+var THINKING_LEVELS = [
+  "instant",
+  "thinking",
+  "extra_thinking",
+  "max"
+];
+function ThinkingLevelPicker({
   value,
   onChange,
-  availableProviders,
   className,
   compact = false
 }) {
-  const providers = availableProviders ?? [
-    { provider: "ollama", available: true, mode: "local" },
-    { provider: "openai", available: true, mode: "byok" },
-    { provider: "anthropic", available: true, mode: "byok" },
-    { provider: "mistral", available: true, mode: "byok" },
-    { provider: "gemini", available: true, mode: "byok" }
-  ];
-  const models = getModelsForProvider(value.provider);
-  const selectedModel = models.find((m) => m.id === value.model);
-  const handleProviderChange = React5.useCallback((providerName) => {
-    const provider = providerName;
-    const providerInfo = providers.find((p) => p.provider === provider);
-    const providerModels = getModelsForProvider(provider);
-    const defaultModel = providerModels[0]?.id ?? "";
-    onChange({
-      provider,
-      model: defaultModel,
-      mode: providerInfo?.mode ?? "byok"
-    });
-  }, [onChange, providers]);
-  const handleModelChange = React5.useCallback((modelId) => {
-    onChange({
-      ...value,
-      model: modelId
-    });
-  }, [onChange, value]);
+  const handleChange = React6.useCallback((v) => {
+    onChange(v);
+  }, [onChange]);
   if (compact) {
-    return /* @__PURE__ */ jsxDEV5("div", {
-      className: cn5("flex items-center gap-2", className),
+    return /* @__PURE__ */ jsxs7(Select, {
+      value,
+      onValueChange: handleChange,
       children: [
-        /* @__PURE__ */ jsxDEV5(Select, {
-          value: value.provider,
-          onValueChange: handleProviderChange,
-          children: [
-            /* @__PURE__ */ jsxDEV5(SelectTrigger, {
-              className: "w-[140px]",
-              children: /* @__PURE__ */ jsxDEV5(SelectValue, {}, undefined, false, undefined, this)
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV5(SelectContent, {
-              children: providers.map((p) => /* @__PURE__ */ jsxDEV5(SelectItem, {
-                value: p.provider,
-                disabled: !p.available,
-                children: /* @__PURE__ */ jsxDEV5("div", {
-                  className: "flex items-center gap-2",
-                  children: [
-                    PROVIDER_ICONS[p.provider],
-                    /* @__PURE__ */ jsxDEV5("span", {
-                      children: PROVIDER_NAMES[p.provider]
-                    }, undefined, false, undefined, this)
-                  ]
-                }, undefined, true, undefined, this)
-              }, p.provider, false, undefined, this))
-            }, undefined, false, undefined, this)
-          ]
-        }, undefined, true, undefined, this),
-        /* @__PURE__ */ jsxDEV5(Select, {
-          value: value.model,
-          onValueChange: handleModelChange,
-          children: [
-            /* @__PURE__ */ jsxDEV5(SelectTrigger, {
-              className: "w-[160px]",
-              children: /* @__PURE__ */ jsxDEV5(SelectValue, {}, undefined, false, undefined, this)
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV5(SelectContent, {
-              children: models.map((m) => /* @__PURE__ */ jsxDEV5(SelectItem, {
-                value: m.id,
-                children: m.name
-              }, m.id, false, undefined, this))
-            }, undefined, false, undefined, this)
-          ]
-        }, undefined, true, undefined, this)
+        /* @__PURE__ */ jsx7(SelectTrigger, {
+          className: cn5("w-[140px]", className),
+          children: /* @__PURE__ */ jsx7(SelectValue, {})
+        }),
+        /* @__PURE__ */ jsx7(SelectContent, {
+          children: THINKING_LEVELS.map((level) => /* @__PURE__ */ jsx7(SelectItem, {
+            value: level,
+            children: THINKING_LEVEL_LABELS[level]
+          }, level))
+        })
       ]
-    }, undefined, true, undefined, this);
+    });
   }
-  return /* @__PURE__ */ jsxDEV5("div", {
-    className: cn5("flex flex-col gap-3", className),
+  return /* @__PURE__ */ jsxs7("div", {
+    className: cn5("flex flex-col gap-1.5", className),
     children: [
-      /* @__PURE__ */ jsxDEV5("div", {
-        className: "flex flex-col gap-1.5",
+      /* @__PURE__ */ jsx7(Label, {
+        htmlFor: "thinking-level-picker",
+        className: "text-sm font-medium",
+        children: "Thinking Level"
+      }),
+      /* @__PURE__ */ jsxs7(Select, {
+        name: "thinking-level-picker",
+        value,
+        onValueChange: handleChange,
         children: [
-          /* @__PURE__ */ jsxDEV5(Label, {
-            htmlFor: "provider-selection",
-            className: "text-sm font-medium",
-            children: "Provider"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV5("div", {
-            className: "flex flex-wrap gap-2",
-            id: "provider-selection",
-            children: providers.map((p) => /* @__PURE__ */ jsxDEV5(Button4, {
-              variant: value.provider === p.provider ? "default" : "outline",
-              size: "sm",
-              onPress: () => p.available && handleProviderChange(p.provider),
-              disabled: !p.available,
-              className: cn5(!p.available && "opacity-50"),
-              children: [
-                PROVIDER_ICONS[p.provider],
-                /* @__PURE__ */ jsxDEV5("span", {
-                  children: PROVIDER_NAMES[p.provider]
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV5(Badge, {
-                  variant: MODE_BADGES[p.mode].variant,
-                  className: "ml-1",
-                  children: MODE_BADGES[p.mode].label
-                }, undefined, false, undefined, this)
-              ]
-            }, p.provider, true, undefined, this))
-          }, undefined, false, undefined, this)
+          /* @__PURE__ */ jsx7(SelectTrigger, {
+            children: /* @__PURE__ */ jsx7(SelectValue, {
+              placeholder: "Select thinking level"
+            })
+          }),
+          /* @__PURE__ */ jsx7(SelectContent, {
+            children: THINKING_LEVELS.map((level) => /* @__PURE__ */ jsx7(SelectItem, {
+              value: level,
+              title: THINKING_LEVEL_DESCRIPTIONS[level],
+              children: THINKING_LEVEL_LABELS[level]
+            }, level))
+          })
         ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV5("div", {
-        className: "flex flex-col gap-1.5",
-        children: [
-          /* @__PURE__ */ jsxDEV5(Label, {
-            htmlFor: "model-picker",
-            className: "text-sm font-medium",
-            children: "Model"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV5(Select, {
-            name: "model-picker",
-            value: value.model,
-            onValueChange: handleModelChange,
-            children: [
-              /* @__PURE__ */ jsxDEV5(SelectTrigger, {
-                children: /* @__PURE__ */ jsxDEV5(SelectValue, {
-                  placeholder: "Select a model"
-                }, undefined, false, undefined, this)
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV5(SelectContent, {
-                children: models.map((m) => /* @__PURE__ */ jsxDEV5(SelectItem, {
-                  value: m.id,
-                  children: /* @__PURE__ */ jsxDEV5("div", {
-                    className: "flex items-center gap-2",
-                    children: [
-                      /* @__PURE__ */ jsxDEV5("span", {
-                        children: m.name
-                      }, undefined, false, undefined, this),
-                      /* @__PURE__ */ jsxDEV5("span", {
-                        className: "text-muted-foreground text-xs",
-                        children: [
-                          Math.round(m.contextWindow / 1000),
-                          "K"
-                        ]
-                      }, undefined, true, undefined, this),
-                      m.capabilities.vision && /* @__PURE__ */ jsxDEV5(Badge, {
-                        variant: "outline",
-                        className: "text-xs",
-                        children: "Vision"
-                      }, undefined, false, undefined, this),
-                      m.capabilities.reasoning && /* @__PURE__ */ jsxDEV5(Badge, {
-                        variant: "outline",
-                        className: "text-xs",
-                        children: "Reasoning"
-                      }, undefined, false, undefined, this)
-                    ]
-                  }, undefined, true, undefined, this)
-                }, m.id, false, undefined, this))
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      selectedModel && /* @__PURE__ */ jsxDEV5("div", {
-        className: "text-muted-foreground flex flex-wrap gap-2 text-xs",
-        children: [
-          /* @__PURE__ */ jsxDEV5("span", {
-            children: [
-              "Context: ",
-              Math.round(selectedModel.contextWindow / 1000),
-              "K tokens"
-            ]
-          }, undefined, true, undefined, this),
-          selectedModel.capabilities.vision && /* @__PURE__ */ jsxDEV5("span", {
-            children: "• Vision"
-          }, undefined, false, undefined, this),
-          selectedModel.capabilities.tools && /* @__PURE__ */ jsxDEV5("span", {
-            children: "• Tools"
-          }, undefined, false, undefined, this),
-          selectedModel.capabilities.reasoning && /* @__PURE__ */ jsxDEV5("span", {
-            children: "• Reasoning"
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
+      })
     ]
-  }, undefined, true, undefined, this);
+  });
 }
-// src/presentation/components/ContextIndicator.tsx
-import { cn as cn6 } from "@contractspec/lib.ui-kit-web/ui/utils";
-import { Badge as Badge2 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger
-} from "@contractspec/lib.ui-kit-web/ui/tooltip";
-import { FolderOpen, FileCode, Zap, Info } from "lucide-react";
-import { jsxDEV as jsxDEV6, Fragment as Fragment3 } from "react/jsx-dev-runtime";
+
+// src/presentation/hooks/useMessageSelection.ts
+import * as React7 from "react";
 "use client";
-function ContextIndicator({
-  summary,
-  active = false,
+function useMessageSelection(messageIds) {
+  const [selectedIds, setSelectedIds] = React7.useState(() => new Set);
+  const idSet = React7.useMemo(() => new Set(messageIds), [messageIds.join(",")]);
+  React7.useEffect(() => {
+    setSelectedIds((prev) => {
+      const next = new Set;
+      for (const id of prev) {
+        if (idSet.has(id))
+          next.add(id);
+      }
+      return next.size === prev.size ? prev : next;
+    });
+  }, [idSet]);
+  const toggle = React7.useCallback((id) => {
+    setSelectedIds((prev) => {
+      const next = new Set(prev);
+      if (next.has(id))
+        next.delete(id);
+      else
+        next.add(id);
+      return next;
+    });
+  }, []);
+  const selectAll = React7.useCallback(() => {
+    setSelectedIds(new Set(messageIds));
+  }, [messageIds.join(",")]);
+  const clearSelection = React7.useCallback(() => {
+    setSelectedIds(new Set);
+  }, []);
+  const isSelected = React7.useCallback((id) => selectedIds.has(id), [selectedIds]);
+  const selectedCount = selectedIds.size;
+  return {
+    selectedIds,
+    toggle,
+    selectAll,
+    clearSelection,
+    isSelected,
+    selectedCount
+  };
+}
+
+// src/presentation/components/ChatWithExport.tsx
+import { jsx as jsx8, jsxs as jsxs8, Fragment as Fragment4 } from "react/jsx-runtime";
+"use client";
+function ChatWithExport({
+  messages,
+  conversation,
+  children,
   className,
-  showDetails = true
+  showExport = true,
+  showMessageSelection = true,
+  showScrollButton = true,
+  onCreateNew,
+  onFork,
+  onEditMessage,
+  thinkingLevel = "thinking",
+  onThinkingLevelChange,
+  presentationRenderer,
+  formRenderer
 }) {
-  if (!summary && !active) {
-    return /* @__PURE__ */ jsxDEV6("div", {
-      className: cn6("flex items-center gap-1.5 text-sm", "text-muted-foreground", className),
-      children: [
-        /* @__PURE__ */ jsxDEV6(Info, {
-          className: "h-4 w-4"
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV6("span", {
-          children: "No workspace context"
-        }, undefined, false, undefined, this)
-      ]
-    }, undefined, true, undefined, this);
+  const messageIds = React8.useMemo(() => messages.map((m) => m.id), [messages]);
+  const selection = useMessageSelection(messageIds);
+  const hasToolbar = showExport || showMessageSelection;
+  const hasPicker = Boolean(onThinkingLevelChange);
+  const headerContent = hasPicker || hasToolbar ? /* @__PURE__ */ jsxs8(Fragment4, {
+    children: [
+      hasPicker && /* @__PURE__ */ jsx8(ThinkingLevelPicker, {
+        value: thinkingLevel,
+        onChange: onThinkingLevelChange,
+        compact: true
+      }),
+      hasToolbar && /* @__PURE__ */ jsx8(ChatExportToolbar, {
+        messages,
+        conversation,
+        selectedIds: selection.selectedIds,
+        showSelectionSummary: showMessageSelection,
+        onSelectAll: showMessageSelection ? selection.selectAll : undefined,
+        onClearSelection: showMessageSelection ? selection.clearSelection : undefined,
+        selectedCount: selection.selectedCount,
+        totalCount: messages.length,
+        onCreateNew,
+        onFork
+      })
+    ]
+  }) : null;
+  return /* @__PURE__ */ jsxs8(ChatContainer, {
+    className,
+    headerContent,
+    showScrollButton,
+    children: [
+      messages.map((msg) => /* @__PURE__ */ jsx8(ChatMessage, {
+        message: msg,
+        selectable: showMessageSelection,
+        selected: selection.isSelected(msg.id),
+        onSelect: showMessageSelection ? selection.toggle : undefined,
+        editable: msg.role === "user" && !!onEditMessage,
+        onEdit: onEditMessage,
+        presentationRenderer,
+        formRenderer
+      }, msg.id)),
+      children
+    ]
+  });
+}
+// src/presentation/components/ChatSidebar.tsx
+import * as React10 from "react";
+import { Plus as Plus2, Trash2, MessageSquare } from "lucide-react";
+import { Button as Button5 } from "@contractspec/lib.design-system";
+import { cn as cn6 } from "@contractspec/lib.ui-kit-web/ui/utils";
+
+// src/presentation/hooks/useConversations.ts
+import * as React9 from "react";
+"use client";
+function useConversations(options) {
+  const { store, projectId, tags, limit = 50 } = options;
+  const [conversations, setConversations] = React9.useState([]);
+  const [isLoading, setIsLoading] = React9.useState(true);
+  const refresh = React9.useCallback(async () => {
+    setIsLoading(true);
+    try {
+      const list = await store.list({
+        status: "active",
+        projectId,
+        tags,
+        limit
+      });
+      setConversations(list);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [store, projectId, tags, limit]);
+  React9.useEffect(() => {
+    refresh();
+  }, [refresh]);
+  const deleteConversation = React9.useCallback(async (id) => {
+    const ok = await store.delete(id);
+    if (ok) {
+      setConversations((prev) => prev.filter((c) => c.id !== id));
+    }
+    return ok;
+  }, [store]);
+  return {
+    conversations,
+    isLoading,
+    refresh,
+    deleteConversation
+  };
+}
+
+// src/presentation/components/ChatSidebar.tsx
+import { jsx as jsx9, jsxs as jsxs9, Fragment as Fragment5 } from "react/jsx-runtime";
+"use client";
+function formatDate(date) {
+  const d = new Date(date);
+  const now = new Date;
+  const diff = now.getTime() - d.getTime();
+  if (diff < 86400000) {
+    return d.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
   }
-  const content = /* @__PURE__ */ jsxDEV6("div", {
-    className: cn6("flex items-center gap-2", active ? "text-foreground" : "text-muted-foreground", className),
+  if (diff < 604800000) {
+    return d.toLocaleDateString([], { weekday: "short" });
+  }
+  return d.toLocaleDateString([], { month: "short", day: "numeric" });
+}
+function ConversationItem({
+  conversation,
+  selected,
+  onSelect,
+  onDelete
+}) {
+  const title = conversation.title ?? conversation.messages[0]?.content?.slice(0, 50) ?? "New chat";
+  const displayTitle = title.length > 40 ? `${title.slice(0, 40)}…` : title;
+  return /* @__PURE__ */ jsxs9("div", {
+    role: "button",
+    tabIndex: 0,
+    onClick: onSelect,
+    onKeyDown: (e) => {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        onSelect();
+      }
+    },
+    className: cn6("group flex cursor-pointer items-center gap-2 rounded-md px-3 py-2 text-sm transition-colors", selected ? "bg-accent text-accent-foreground" : "hover:bg-accent/50"),
     children: [
-      /* @__PURE__ */ jsxDEV6(Badge2, {
-        variant: active ? "default" : "secondary",
-        className: "flex items-center gap-1",
-        children: [
-          /* @__PURE__ */ jsxDEV6(Zap, {
-            className: "h-3 w-3"
-          }, undefined, false, undefined, this),
-          "Context"
-        ]
-      }, undefined, true, undefined, this),
-      summary && showDetails && /* @__PURE__ */ jsxDEV6(Fragment3, {
+      /* @__PURE__ */ jsx9(MessageSquare, {
+        className: "text-muted-foreground h-4 w-4 shrink-0"
+      }),
+      /* @__PURE__ */ jsxs9("div", {
+        className: "min-w-0 flex-1",
         children: [
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex items-center gap-1 text-xs",
-            children: [
-              /* @__PURE__ */ jsxDEV6(FolderOpen, {
-                className: "h-3.5 w-3.5"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("span", {
-                children: summary.name
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex items-center gap-1 text-xs",
+          /* @__PURE__ */ jsx9("p", {
+            className: "truncate",
+            children: displayTitle
+          }),
+          /* @__PURE__ */ jsxs9("p", {
+            className: "text-muted-foreground text-xs",
             children: [
-              /* @__PURE__ */ jsxDEV6(FileCode, {
-                className: "h-3.5 w-3.5"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("span", {
+              formatDate(conversation.updatedAt),
+              conversation.projectName && ` · ${conversation.projectName}`,
+              conversation.tags && conversation.tags.length > 0 && /* @__PURE__ */ jsxs9(Fragment5, {
                 children: [
-                  summary.specs.total,
-                  " specs"
+                  " · ",
+                  conversation.tags.slice(0, 2).join(", ")
                 ]
-              }, undefined, true, undefined, this)
+              })
             ]
-          }, undefined, true, undefined, this)
+          })
         ]
-      }, undefined, true, undefined, this)
+      }),
+      /* @__PURE__ */ jsx9("span", {
+        onClick: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ jsx9(Button5, {
+          variant: "ghost",
+          size: "sm",
+          className: "h-6 w-6 shrink-0 p-0 opacity-0 group-hover:opacity-100",
+          onPress: onDelete,
+          "aria-label": "Delete conversation",
+          children: /* @__PURE__ */ jsx9(Trash2, {
+            className: "h-3 w-3"
+          })
+        })
+      })
     ]
-  }, undefined, true, undefined, this);
-  if (!summary) {
-    return content;
-  }
-  return /* @__PURE__ */ jsxDEV6(TooltipProvider, {
-    children: /* @__PURE__ */ jsxDEV6(Tooltip, {
-      children: [
-        /* @__PURE__ */ jsxDEV6(TooltipTrigger, {
-          asChild: true,
-          children: content
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV6(TooltipContent, {
-          side: "bottom",
-          className: "max-w-[300px]",
-          children: /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex flex-col gap-2 text-sm",
-            children: [
-              /* @__PURE__ */ jsxDEV6("div", {
-                className: "font-medium",
-                children: summary.name
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("div", {
-                className: "text-muted-foreground text-xs",
-                children: summary.path
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("div", {
-                className: "border-t pt-2",
-                children: /* @__PURE__ */ jsxDEV6("div", {
-                  className: "grid grid-cols-2 gap-1 text-xs",
-                  children: [
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      children: "Commands:"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      className: "text-right",
-                      children: summary.specs.commands
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      children: "Queries:"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      className: "text-right",
-                      children: summary.specs.queries
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      children: "Events:"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      className: "text-right",
-                      children: summary.specs.events
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      children: "Presentations:"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      className: "text-right",
-                      children: summary.specs.presentations
-                    }, undefined, false, undefined, this)
-                  ]
-                }, undefined, true, undefined, this)
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("div", {
-                className: "border-t pt-2 text-xs",
-                children: [
-                  /* @__PURE__ */ jsxDEV6("span", {
-                    children: [
-                      summary.files.total,
-                      " files"
-                    ]
-                  }, undefined, true, undefined, this),
-                  /* @__PURE__ */ jsxDEV6("span", {
-                    className: "mx-1",
-                    children: "•"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV6("span", {
-                    children: [
-                      summary.files.specFiles,
-                      " spec files"
-                    ]
-                  }, undefined, true, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        }, undefined, false, undefined, this)
-      ]
-    }, undefined, true, undefined, this)
-  }, undefined, false, undefined, this);
+  });
+}
+function ChatSidebar({
+  store,
+  selectedConversationId,
+  onSelectConversation,
+  onCreateNew,
+  projectId,
+  tags,
+  limit = 50,
+  className,
+  collapsed = false,
+  onUpdateConversation,
+  selectedConversation
+}) {
+  const { conversations, isLoading, refresh, deleteConversation } = useConversations({ store, projectId, tags, limit });
+  const handleDelete = React10.useCallback(async (id) => {
+    const ok = await deleteConversation(id);
+    if (ok && selectedConversationId === id) {
+      onSelectConversation(null);
+    }
+  }, [deleteConversation, selectedConversationId, onSelectConversation]);
+  if (collapsed)
+    return null;
+  return /* @__PURE__ */ jsxs9("div", {
+    className: cn6("border-border flex w-64 shrink-0 flex-col border-r", className),
+    children: [
+      /* @__PURE__ */ jsxs9("div", {
+        className: "border-border flex shrink-0 items-center justify-between border-b p-2",
+        children: [
+          /* @__PURE__ */ jsx9("span", {
+            className: "text-muted-foreground text-sm font-medium",
+            children: "Conversations"
+          }),
+          /* @__PURE__ */ jsx9(Button5, {
+            variant: "ghost",
+            size: "sm",
+            className: "h-8 w-8 p-0",
+            onPress: onCreateNew,
+            "aria-label": "New conversation",
+            children: /* @__PURE__ */ jsx9(Plus2, {
+              className: "h-4 w-4"
+            })
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx9("div", {
+        className: "flex-1 overflow-y-auto p-2",
+        children: isLoading ? /* @__PURE__ */ jsx9("div", {
+          className: "text-muted-foreground py-4 text-center text-sm",
+          children: "Loading…"
+        }) : conversations.length === 0 ? /* @__PURE__ */ jsx9("div", {
+          className: "text-muted-foreground py-4 text-center text-sm",
+          children: "No conversations yet"
+        }) : /* @__PURE__ */ jsx9("div", {
+          className: "flex flex-col gap-1",
+          children: conversations.map((conv) => /* @__PURE__ */ jsx9(ConversationItem, {
+            conversation: conv,
+            selected: conv.id === selectedConversationId,
+            onSelect: () => onSelectConversation(conv.id),
+            onDelete: () => handleDelete(conv.id)
+          }, conv.id))
+        })
+      }),
+      selectedConversation && onUpdateConversation && /* @__PURE__ */ jsx9(ConversationMeta, {
+        conversation: selectedConversation,
+        onUpdate: onUpdateConversation
+      })
+    ]
+  });
+}
+function ConversationMeta({
+  conversation,
+  onUpdate
+}) {
+  const [projectName, setProjectName] = React10.useState(conversation.projectName ?? "");
+  const [tagsStr, setTagsStr] = React10.useState(conversation.tags?.join(", ") ?? "");
+  React10.useEffect(() => {
+    setProjectName(conversation.projectName ?? "");
+    setTagsStr(conversation.tags?.join(", ") ?? "");
+  }, [conversation.id, conversation.projectName, conversation.tags]);
+  const handleBlur = React10.useCallback(() => {
+    const tags = tagsStr.split(",").map((t) => t.trim()).filter(Boolean);
+    if (projectName !== (conversation.projectName ?? "") || JSON.stringify(tags) !== JSON.stringify(conversation.tags ?? [])) {
+      onUpdate(conversation.id, {
+        projectName: projectName || undefined,
+        projectId: projectName ? projectName.replace(/\s+/g, "-") : undefined,
+        tags: tags.length > 0 ? tags : undefined
+      });
+    }
+  }, [
+    conversation.id,
+    conversation.projectName,
+    conversation.tags,
+    projectName,
+    tagsStr,
+    onUpdate
+  ]);
+  return /* @__PURE__ */ jsxs9("div", {
+    className: "border-border shrink-0 border-t p-2",
+    children: [
+      /* @__PURE__ */ jsx9("p", {
+        className: "text-muted-foreground mb-1 text-xs font-medium",
+        children: "Project"
+      }),
+      /* @__PURE__ */ jsx9("input", {
+        type: "text",
+        value: projectName,
+        onChange: (e) => setProjectName(e.target.value),
+        onBlur: handleBlur,
+        placeholder: "Project name",
+        className: "border-input bg-background mb-2 w-full rounded px-2 py-1 text-xs"
+      }),
+      /* @__PURE__ */ jsx9("p", {
+        className: "text-muted-foreground mb-1 text-xs font-medium",
+        children: "Tags"
+      }),
+      /* @__PURE__ */ jsx9("input", {
+        type: "text",
+        value: tagsStr,
+        onChange: (e) => setTagsStr(e.target.value),
+        onBlur: handleBlur,
+        placeholder: "tag1, tag2",
+        className: "border-input bg-background w-full rounded px-2 py-1 text-xs"
+      })
+    ]
+  });
 }
+// src/presentation/components/ChatWithSidebar.tsx
+import * as React12 from "react";
+
 // src/presentation/hooks/useChat.tsx
-import * as React6 from "react";
-import { tool } from "ai";
-import { z } from "zod";
+import * as React11 from "react";
+import { tool as tool4 } from "ai";
+import { z as z4 } from "zod";
 
 // src/core/chat-service.ts
 import { generateText, streamText } from "ai";
@@ -1150,11 +1767,65 @@ class InMemoryConversationStore {
     if (options?.status) {
       results = results.filter((c) => c.status === options.status);
     }
+    if (options?.projectId) {
+      results = results.filter((c) => c.projectId === options.projectId);
+    }
+    if (options?.tags && options.tags.length > 0) {
+      const tagSet = new Set(options.tags);
+      results = results.filter((c) => c.tags && c.tags.some((t) => tagSet.has(t)));
+    }
     results.sort((a, b) => b.updatedAt.getTime() - a.updatedAt.getTime());
     const offset = options?.offset ?? 0;
     const limit = options?.limit ?? 100;
     return results.slice(offset, offset + limit);
   }
+  async fork(conversationId, upToMessageId) {
+    const source = this.conversations.get(conversationId);
+    if (!source) {
+      throw new Error(`Conversation ${conversationId} not found`);
+    }
+    let messagesToCopy = source.messages;
+    if (upToMessageId) {
+      const idx = source.messages.findIndex((m) => m.id === upToMessageId);
+      if (idx === -1) {
+        throw new Error(`Message ${upToMessageId} not found`);
+      }
+      messagesToCopy = source.messages.slice(0, idx + 1);
+    }
+    const now = new Date;
+    const forkedMessages = messagesToCopy.map((m) => ({
+      ...m,
+      id: generateId("msg"),
+      conversationId: "",
+      createdAt: new Date(m.createdAt),
+      updatedAt: new Date(m.updatedAt)
+    }));
+    const forked = {
+      ...source,
+      id: generateId("conv"),
+      title: source.title ? `${source.title} (fork)` : undefined,
+      forkedFromId: source.id,
+      createdAt: now,
+      updatedAt: now,
+      messages: forkedMessages
+    };
+    for (const m of forked.messages) {
+      m.conversationId = forked.id;
+    }
+    this.conversations.set(forked.id, forked);
+    return forked;
+  }
+  async truncateAfter(conversationId, messageId) {
+    const conv = this.conversations.get(conversationId);
+    if (!conv)
+      return null;
+    const idx = conv.messages.findIndex((m) => m.id === messageId);
+    if (idx === -1)
+      return null;
+    conv.messages = conv.messages.slice(0, idx + 1);
+    conv.updatedAt = new Date;
+    return conv;
+  }
   async search(query, limit = 20) {
     const lowerQuery = query.toLowerCase();
     const results = [];
@@ -1180,43 +1851,571 @@ function createInMemoryConversationStore() {
   return new InMemoryConversationStore;
 }
 
-// src/core/chat-service.ts
-var DEFAULT_SYSTEM_PROMPT = `You are ContractSpec AI, an expert coding assistant specialized in ContractSpec development.
+// src/core/workflow-tools.ts
+import { tool } from "ai";
+import { z } from "zod";
+import {
+  WorkflowComposer,
+  validateExtension
+} from "@contractspec/lib.workflow-composer";
+var StepTypeSchema = z.enum(["human", "automation", "decision"]);
+var StepActionSchema = z.object({
+  operation: z.object({
+    name: z.string(),
+    version: z.number()
+  }).optional(),
+  form: z.object({
+    key: z.string(),
+    version: z.number()
+  }).optional()
+}).optional();
+var StepSchema = z.object({
+  id: z.string(),
+  type: StepTypeSchema,
+  label: z.string(),
+  description: z.string().optional(),
+  action: StepActionSchema
+});
+var StepInjectionSchema = z.object({
+  after: z.string().optional(),
+  before: z.string().optional(),
+  inject: StepSchema,
+  transitionTo: z.string().optional(),
+  transitionFrom: z.string().optional(),
+  when: z.string().optional()
+});
+var WorkflowExtensionInputSchema = z.object({
+  workflow: z.string(),
+  tenantId: z.string().optional(),
+  role: z.string().optional(),
+  priority: z.number().optional(),
+  customSteps: z.array(StepInjectionSchema).optional(),
+  hiddenSteps: z.array(z.string()).optional()
+});
+function createWorkflowTools(config) {
+  const { baseWorkflows, composer } = config;
+  const baseByKey = new Map(baseWorkflows.map((b) => [b.meta.key, b]));
+  const createWorkflowExtensionTool = tool({
+    description: "Create or validate a workflow extension. Use when the user asks to add steps, modify a workflow, or create a tenant-specific extension. The extension targets an existing base workflow.",
+    inputSchema: WorkflowExtensionInputSchema,
+    execute: async (input) => {
+      const extension = {
+        workflow: input.workflow,
+        tenantId: input.tenantId,
+        role: input.role,
+        priority: input.priority,
+        customSteps: input.customSteps,
+        hiddenSteps: input.hiddenSteps
+      };
+      const base = baseByKey.get(input.workflow);
+      if (!base) {
+        return {
+          success: false,
+          error: `Base workflow "${input.workflow}" not found. Available: ${Array.from(baseByKey.keys()).join(", ")}`,
+          extension
+        };
+      }
+      try {
+        validateExtension(extension, base);
+        return {
+          success: true,
+          message: "Extension validated successfully",
+          extension
+        };
+      } catch (err) {
+        return {
+          success: false,
+          error: err instanceof Error ? err.message : String(err),
+          extension
+        };
+      }
+    }
+  });
+  const composeWorkflowInputSchema = z.object({
+    workflowKey: z.string().describe("Base workflow meta.key"),
+    tenantId: z.string().optional(),
+    role: z.string().optional(),
+    extensions: z.array(WorkflowExtensionInputSchema).optional().describe("Extensions to register before composing")
+  });
+  const composeWorkflowTool = tool({
+    description: "Compose a workflow by applying registered extensions to a base workflow. Returns the composed WorkflowSpec.",
+    inputSchema: composeWorkflowInputSchema,
+    execute: async (input) => {
+      const base = baseByKey.get(input.workflowKey);
+      if (!base) {
+        return {
+          success: false,
+          error: `Base workflow "${input.workflowKey}" not found. Available: ${Array.from(baseByKey.keys()).join(", ")}`
+        };
+      }
+      const comp = composer ?? new WorkflowComposer;
+      if (input.extensions?.length) {
+        for (const ext of input.extensions) {
+          comp.register({
+            workflow: ext.workflow,
+            tenantId: ext.tenantId,
+            role: ext.role,
+            priority: ext.priority,
+            customSteps: ext.customSteps,
+            hiddenSteps: ext.hiddenSteps
+          });
+        }
+      }
+      try {
+        const composed = comp.compose({
+          base,
+          tenantId: input.tenantId,
+          role: input.role
+        });
+        return {
+          success: true,
+          workflow: composed,
+          meta: composed.meta,
+          stepIds: composed.definition.steps.map((s) => s.id)
+        };
+      } catch (err) {
+        return {
+          success: false,
+          error: err instanceof Error ? err.message : String(err)
+        };
+      }
+    }
+  });
+  const generateWorkflowSpecCodeInputSchema = z.object({
+    workflowKey: z.string().describe("Workflow meta.key"),
+    composedSteps: z.array(z.object({
+      id: z.string(),
+      type: z.enum(["human", "automation", "decision"]),
+      label: z.string(),
+      description: z.string().optional()
+    })).optional().describe("Steps to include; if omitted, uses the base workflow")
+  });
+  const generateWorkflowSpecCodeTool = tool({
+    description: "Generate TypeScript code for a workflow spec. Use after composing a workflow to output the spec as code the user can save.",
+    inputSchema: generateWorkflowSpecCodeInputSchema,
+    execute: async (input) => {
+      const base = baseByKey.get(input.workflowKey);
+      if (!base) {
+        return {
+          success: false,
+          error: `Base workflow "${input.workflowKey}" not found. Available: ${Array.from(baseByKey.keys()).join(", ")}`,
+          code: null
+        };
+      }
+      const steps = input.composedSteps ?? base.definition.steps;
+      const specVarName = toPascalCase((base.meta.key.split(".").pop() ?? "Workflow") + "") + "Workflow";
+      const stepsCode = steps.map((s) => `    {
+      id: '${s.id}',
+      type: '${s.type}',
+      label: '${escapeString(s.label)}',${s.description ? `
+      description: '${escapeString(s.description)}',` : ""}
+    }`).join(`,
+`);
+      const meta = base.meta;
+      const transitionsJson = JSON.stringify(base.definition.transitions, null, 6);
+      const code = `import type { WorkflowSpec } from '@contractspec/lib.contracts-spec/workflow';
 
-Your capabilities:
-- Help users create, modify, and understand ContractSpec specifications
-- Generate code that follows ContractSpec patterns and best practices
-- Explain concepts from the ContractSpec documentation
-- Suggest improvements and identify issues in specs and implementations
+/**
+ * Workflow: ${base.meta.key}
+ * Generated via AI chat workflow tools.
+ */
+export const ${specVarName}: WorkflowSpec = {
+  meta: {
+    key: '${base.meta.key}',
+    version: '${String(base.meta.version)}',
+    title: '${escapeString(meta.title ?? base.meta.key)}',
+    description: '${escapeString(meta.description ?? "")}',
+  },
+  definition: {
+    entryStepId: '${base.definition.entryStepId ?? base.definition.steps[0]?.id ?? ""}',
+    steps: [
+${stepsCode}
+    ],
+    transitions: ${transitionsJson},
+  },
+};
+`;
+      return {
+        success: true,
+        code,
+        workflowKey: input.workflowKey
+      };
+    }
+  });
+  return {
+    create_workflow_extension: createWorkflowExtensionTool,
+    compose_workflow: composeWorkflowTool,
+    generate_workflow_spec_code: generateWorkflowSpecCodeTool
+  };
+}
+function toPascalCase(value) {
+  return value.split(/[-_.]/).filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
+}
+function escapeString(value) {
+  return value.replace(/\\/g, "\\\\").replace(/'/g, "\\'");
+}
 
-Guidelines:
-- Be concise but thorough
-- Provide code examples when helpful
-- Reference relevant ContractSpec concepts and patterns
-- Ask clarifying questions when the user's intent is unclear
-- When suggesting code changes, explain the rationale`;
+// src/core/contracts-context.ts
+function buildContractsContextPrompt(config) {
+  const parts = [];
+  if (!config.agentSpecs?.length && !config.dataViewSpecs?.length && !config.formSpecs?.length && !config.presentationSpecs?.length && !config.operationRefs?.length) {
+    return "";
+  }
+  parts.push(`
 
-class ChatService {
-  provider;
-  context;
-  store;
-  systemPrompt;
-  maxHistoryMessages;
-  onUsage;
-  tools;
-  sendReasoning;
-  sendSources;
-  constructor(config) {
-    this.provider = config.provider;
+## Available resources`);
+  if (config.agentSpecs?.length) {
+    parts.push(`
+### Agent tools`);
+    for (const agent of config.agentSpecs) {
+      const toolNames = agent.tools?.map((t) => t.name).join(", ") ?? "none";
+      parts.push(`- **${agent.key}**: tools: ${toolNames}`);
+    }
+  }
+  if (config.dataViewSpecs?.length) {
+    parts.push(`
+### Data views`);
+    for (const dv of config.dataViewSpecs) {
+      parts.push(`- **${dv.key}**: ${dv.meta.title ?? dv.key}`);
+    }
+  }
+  if (config.formSpecs?.length) {
+    parts.push(`
+### Forms`);
+    for (const form of config.formSpecs) {
+      parts.push(`- **${form.key}**: ${form.meta.title ?? form.key}`);
+    }
+  }
+  if (config.presentationSpecs?.length) {
+    parts.push(`
+### Presentations`);
+    for (const pres of config.presentationSpecs) {
+      parts.push(`- **${pres.key}**: ${pres.meta.title ?? pres.key} (targets: ${pres.targets?.join(", ") ?? "react"})`);
+    }
+  }
+  if (config.operationRefs?.length) {
+    parts.push(`
+### Operations`);
+    for (const op of config.operationRefs) {
+      parts.push(`- **${op.key}@${op.version}**`);
+    }
+  }
+  parts.push(`
+Use the available tools to invoke operations, query data views, or propose surface changes when appropriate.`);
+  return parts.join(`
+`);
+}
+
+// src/core/agent-tools-adapter.ts
+import { tool as tool2 } from "ai";
+import { z as z2 } from "zod";
+function getInputSchema(_schema) {
+  return z2.object({}).passthrough();
+}
+function agentToolConfigsToToolSet(configs, handlers) {
+  const result = {};
+  for (const config of configs) {
+    const handler = handlers?.[config.name];
+    const inputSchema = getInputSchema(config.schema);
+    result[config.name] = tool2({
+      description: config.description ?? config.name,
+      inputSchema,
+      execute: async (input) => {
+        if (!handler) {
+          return {
+            status: "unimplemented",
+            message: "Wire handler in host",
+            toolName: config.name
+          };
+        }
+        try {
+          const output = await Promise.resolve(handler(input));
+          return typeof output === "string" ? output : output;
+        } catch (err) {
+          return {
+            status: "error",
+            error: err instanceof Error ? err.message : String(err),
+            toolName: config.name
+          };
+        }
+      }
+    });
+  }
+  return result;
+}
+
+// src/core/surface-planner-tools.ts
+import { tool as tool3 } from "ai";
+import { z as z3 } from "zod";
+import {
+  validatePatchProposal
+} from "@contractspec/lib.surface-runtime/spec/validate-surface-patch";
+import { buildSurfacePatchProposal } from "@contractspec/lib.surface-runtime/runtime/planner-tools";
+var VALID_OPS = [
+  "insert-node",
+  "replace-node",
+  "remove-node",
+  "move-node",
+  "resize-panel",
+  "set-layout",
+  "reveal-field",
+  "hide-field",
+  "promote-action",
+  "set-focus"
+];
+var DEFAULT_NODE_KINDS = [
+  "entity-section",
+  "entity-card",
+  "data-view",
+  "assistant-panel",
+  "chat-thread",
+  "action-bar",
+  "timeline",
+  "table",
+  "rich-doc",
+  "form",
+  "chart",
+  "custom-widget"
+];
+function collectSlotIdsFromRegion(node) {
+  const ids = [];
+  if (node.type === "slot") {
+    ids.push(node.slotId);
+  }
+  if (node.type === "panel-group" || node.type === "stack") {
+    for (const child of node.children) {
+      ids.push(...collectSlotIdsFromRegion(child));
+    }
+  }
+  if (node.type === "tabs") {
+    for (const tab of node.tabs) {
+      ids.push(...collectSlotIdsFromRegion(tab.child));
+    }
+  }
+  if (node.type === "floating") {
+    ids.push(node.anchorSlotId);
+    ids.push(...collectSlotIdsFromRegion(node.child));
+  }
+  return ids;
+}
+function deriveConstraints(plan) {
+  const slotIds = collectSlotIdsFromRegion(plan.layoutRoot);
+  const uniqueSlots = [...new Set(slotIds)];
+  return {
+    allowedOps: VALID_OPS,
+    allowedSlots: uniqueSlots.length > 0 ? uniqueSlots : ["assistant", "primary"],
+    allowedNodeKinds: DEFAULT_NODE_KINDS
+  };
+}
+var ProposePatchInputSchema = z3.object({
+  proposalId: z3.string().describe("Unique proposal identifier"),
+  ops: z3.array(z3.object({
+    op: z3.enum([
+      "insert-node",
+      "replace-node",
+      "remove-node",
+      "move-node",
+      "resize-panel",
+      "set-layout",
+      "reveal-field",
+      "hide-field",
+      "promote-action",
+      "set-focus"
+    ]),
+    slotId: z3.string().optional(),
+    nodeId: z3.string().optional(),
+    toSlotId: z3.string().optional(),
+    index: z3.number().optional(),
+    node: z3.object({
+      nodeId: z3.string(),
+      kind: z3.string(),
+      title: z3.string().optional(),
+      props: z3.record(z3.string(), z3.unknown()).optional(),
+      children: z3.array(z3.unknown()).optional()
+    }).optional(),
+    persistKey: z3.string().optional(),
+    sizes: z3.array(z3.number()).optional(),
+    layoutId: z3.string().optional(),
+    fieldId: z3.string().optional(),
+    actionId: z3.string().optional(),
+    placement: z3.enum(["header", "inline", "context", "assistant"]).optional(),
+    targetId: z3.string().optional()
+  }))
+});
+function createSurfacePlannerTools(config) {
+  const { plan, constraints, onPatchProposal } = config;
+  const resolvedConstraints = constraints ?? deriveConstraints(plan);
+  const proposePatchTool = tool3({
+    description: "Propose surface patches (layout changes, node insertions, etc.) for user approval. " + "Only use allowed ops, slots, and node kinds from the planner context.",
+    inputSchema: ProposePatchInputSchema,
+    execute: async (input) => {
+      const ops = input.ops;
+      try {
+        validatePatchProposal(ops, resolvedConstraints);
+        const proposal = buildSurfacePatchProposal(input.proposalId, ops);
+        onPatchProposal?.(proposal);
+        return {
+          success: true,
+          proposalId: proposal.proposalId,
+          opsCount: proposal.ops.length,
+          message: "Patch proposal validated; awaiting user approval"
+        };
+      } catch (err) {
+        return {
+          success: false,
+          error: err instanceof Error ? err.message : String(err),
+          proposalId: input.proposalId
+        };
+      }
+    }
+  });
+  return {
+    "propose-patch": proposePatchTool
+  };
+}
+function buildPlannerPromptInput(plan) {
+  const constraints = deriveConstraints(plan);
+  return {
+    bundleMeta: {
+      key: plan.bundleKey,
+      version: "0.0.0",
+      title: plan.bundleKey
+    },
+    surfaceId: plan.surfaceId,
+    allowedPatchOps: constraints.allowedOps,
+    allowedSlots: [...constraints.allowedSlots],
+    allowedNodeKinds: [...constraints.allowedNodeKinds],
+    actions: plan.actions.map((a) => ({
+      actionId: a.actionId,
+      title: a.title
+    })),
+    preferences: {
+      guidance: "hints",
+      density: "standard",
+      dataDepth: "detailed",
+      control: "standard",
+      media: "text",
+      pace: "balanced",
+      narrative: "top-down"
+    }
+  };
+}
+
+// src/core/chat-service.ts
+import { compilePlannerPrompt } from "@contractspec/lib.surface-runtime/runtime/planner-prompt";
+var DEFAULT_SYSTEM_PROMPT = `You are ContractSpec AI, an expert coding assistant specialized in ContractSpec development.
+
+Your capabilities:
+- Help users create, modify, and understand ContractSpec specifications
+- Generate code that follows ContractSpec patterns and best practices
+- Explain concepts from the ContractSpec documentation
+- Suggest improvements and identify issues in specs and implementations
+
+Guidelines:
+- Be concise but thorough
+- Provide code examples when helpful
+- Reference relevant ContractSpec concepts and patterns
+- Ask clarifying questions when the user's intent is unclear
+- When suggesting code changes, explain the rationale`;
+var WORKFLOW_TOOLS_PROMPT = `
+
+Workflow creation: You can create and modify workflows. Use create_workflow_extension when the user asks to add steps, change a workflow, or create a tenant-specific extension. Use compose_workflow to apply extensions to a base workflow. Use generate_workflow_spec_code to output TypeScript for the user to save.`;
+
+class ChatService {
+  provider;
+  context;
+  store;
+  systemPrompt;
+  maxHistoryMessages;
+  onUsage;
+  tools;
+  thinkingLevel;
+  sendReasoning;
+  sendSources;
+  modelSelector;
+  constructor(config) {
+    this.provider = config.provider;
     this.context = config.context;
     this.store = config.store ?? new InMemoryConversationStore;
-    this.systemPrompt = config.systemPrompt ?? DEFAULT_SYSTEM_PROMPT;
+    this.systemPrompt = this.buildSystemPrompt(config);
     this.maxHistoryMessages = config.maxHistoryMessages ?? 20;
     this.onUsage = config.onUsage;
-    this.tools = config.tools;
-    this.sendReasoning = config.sendReasoning ?? false;
+    this.tools = this.mergeTools(config);
+    this.thinkingLevel = config.thinkingLevel;
+    this.modelSelector = config.modelSelector;
+    this.sendReasoning = config.sendReasoning ?? (config.thinkingLevel != null && config.thinkingLevel !== "instant");
     this.sendSources = config.sendSources ?? false;
   }
+  buildSystemPrompt(config) {
+    let base = config.systemPrompt ?? DEFAULT_SYSTEM_PROMPT;
+    if (config.workflowToolsConfig?.baseWorkflows?.length) {
+      base += WORKFLOW_TOOLS_PROMPT;
+    }
+    const contractsPrompt = buildContractsContextPrompt(config.contractsContext ?? {});
+    if (contractsPrompt) {
+      base += contractsPrompt;
+    }
+    if (config.surfacePlanConfig?.plan) {
+      const plannerInput = buildPlannerPromptInput(config.surfacePlanConfig.plan);
+      base += `
+
+` + compilePlannerPrompt(plannerInput);
+    }
+    return base;
+  }
+  mergeTools(config) {
+    let merged = config.tools ?? {};
+    const wfConfig = config.workflowToolsConfig;
+    if (wfConfig?.baseWorkflows?.length) {
+      const workflowTools = createWorkflowTools({
+        baseWorkflows: wfConfig.baseWorkflows,
+        composer: wfConfig.composer
+      });
+      merged = { ...merged, ...workflowTools };
+    }
+    const contractsCtx = config.contractsContext;
+    if (contractsCtx?.agentSpecs?.length) {
+      const allTools = [];
+      for (const agent of contractsCtx.agentSpecs) {
+        if (agent.tools?.length)
+          allTools.push(...agent.tools);
+      }
+      if (allTools.length > 0) {
+        const agentTools = agentToolConfigsToToolSet(allTools);
+        merged = { ...merged, ...agentTools };
+      }
+    }
+    const surfaceConfig = config.surfacePlanConfig;
+    if (surfaceConfig?.plan) {
+      const plannerTools = createSurfacePlannerTools({
+        plan: surfaceConfig.plan,
+        onPatchProposal: surfaceConfig.onPatchProposal
+      });
+      merged = { ...merged, ...plannerTools };
+    }
+    if (config.mcpTools && Object.keys(config.mcpTools).length > 0) {
+      merged = { ...merged, ...config.mcpTools };
+    }
+    return Object.keys(merged).length > 0 ? merged : undefined;
+  }
+  async resolveModel() {
+    if (this.modelSelector) {
+      const dimension = this.thinkingLevelToDimension(this.thinkingLevel);
+      const { model, selection } = await this.modelSelector.selectAndCreate({
+        taskDimension: dimension
+      });
+      return { model, providerName: selection.providerKey };
+    }
+    return {
+      model: this.provider.getModel(),
+      providerName: this.provider.name
+    };
+  }
+  thinkingLevelToDimension(level) {
+    if (!level || level === "instant")
+      return "latency";
+    return "reasoning";
+  }
   async send(options) {
     let conversation;
     if (options.conversationId) {
@@ -1234,20 +2433,25 @@ class ChatService {
         workspacePath: this.context?.workspacePath
       });
     }
-    await this.store.appendMessage(conversation.id, {
-      role: "user",
-      content: options.content,
-      status: "completed",
-      attachments: options.attachments
-    });
+    if (!options.skipUserAppend) {
+      await this.store.appendMessage(conversation.id, {
+        role: "user",
+        content: options.content,
+        status: "completed",
+        attachments: options.attachments
+      });
+    }
+    conversation = await this.store.get(conversation.id) ?? conversation;
     const messages = this.buildMessages(conversation, options);
-    const model = this.provider.getModel();
+    const { model, providerName } = await this.resolveModel();
+    const providerOptions = getProviderOptions(this.thinkingLevel, providerName);
     try {
       const result = await generateText({
         model,
         messages,
         system: this.systemPrompt,
-        tools: this.tools
+        tools: this.tools,
+        providerOptions: Object.keys(providerOptions).length > 0 ? providerOptions : undefined
       });
       const assistantMessage = await this.store.appendMessage(conversation.id, {
         role: "assistant",
@@ -1292,23 +2496,27 @@ class ChatService {
         workspacePath: this.context?.workspacePath
       });
     }
-    await this.store.appendMessage(conversation.id, {
-      role: "user",
-      content: options.content,
-      status: "completed",
-      attachments: options.attachments
-    });
+    if (!options.skipUserAppend) {
+      await this.store.appendMessage(conversation.id, {
+        role: "user",
+        content: options.content,
+        status: "completed",
+        attachments: options.attachments
+      });
+    }
+    conversation = await this.store.get(conversation.id) ?? conversation;
     const assistantMessage = await this.store.appendMessage(conversation.id, {
       role: "assistant",
       content: "",
       status: "streaming"
     });
     const messages = this.buildMessages(conversation, options);
-    const model = this.provider.getModel();
+    const { model, providerName } = await this.resolveModel();
     const systemPrompt = this.systemPrompt;
     const tools = this.tools;
     const store = this.store;
     const onUsage = this.onUsage;
+    const streamProviderOptions = getProviderOptions(this.thinkingLevel, providerName);
     async function* streamGenerator() {
       let fullContent = "";
       let fullReasoning = "";
@@ -1319,7 +2527,8 @@ class ChatService {
           model,
           messages,
           system: systemPrompt,
-          tools
+          tools,
+          providerOptions: Object.keys(streamProviderOptions).length > 0 ? streamProviderOptions : undefined
         });
         for await (const part of result.fullStream) {
           if (part.type === "text-delta") {
@@ -1434,6 +2643,18 @@ class ChatService {
       ...options
     });
   }
+  async updateConversation(conversationId, updates) {
+    return this.store.update(conversationId, updates);
+  }
+  async forkConversation(conversationId, upToMessageId) {
+    return this.store.fork(conversationId, upToMessageId);
+  }
+  async updateMessage(conversationId, messageId, updates) {
+    return this.store.updateMessage(conversationId, messageId, updates);
+  }
+  async truncateAfter(conversationId, messageId) {
+    return this.store.truncateAfter(conversationId, messageId);
+  }
   async deleteConversation(conversationId) {
     return this.store.delete(conversationId);
   }
@@ -1504,9 +2725,9 @@ import {
 function toolsToToolSet(defs) {
   const result = {};
   for (const def of defs) {
-    result[def.name] = tool({
+    result[def.name] = tool4({
       description: def.description ?? def.name,
-      inputSchema: z.object({}).passthrough(),
+      inputSchema: z4.object({}).passthrough(),
       execute: async () => ({})
     });
   }
@@ -1520,22 +2741,64 @@ function useChat(options = {}) {
     apiKey,
     proxyUrl,
     conversationId: initialConversationId,
+    store,
     systemPrompt,
     streaming = true,
     onSend,
     onResponse,
     onError,
     onUsage,
-    tools: toolsDefs
+    tools: toolsDefs,
+    thinkingLevel,
+    workflowToolsConfig,
+    modelSelector,
+    contractsContext,
+    surfacePlanConfig,
+    mcpServers,
+    agentMode
   } = options;
-  const [messages, setMessages] = React6.useState([]);
-  const [conversation, setConversation] = React6.useState(null);
-  const [isLoading, setIsLoading] = React6.useState(false);
-  const [error, setError] = React6.useState(null);
-  const [conversationId, setConversationId] = React6.useState(initialConversationId ?? null);
-  const abortControllerRef = React6.useRef(null);
-  const chatServiceRef = React6.useRef(null);
-  React6.useEffect(() => {
+  const [messages, setMessages] = React11.useState([]);
+  const [mcpTools, setMcpTools] = React11.useState(null);
+  const mcpCleanupRef = React11.useRef(null);
+  const [conversation, setConversation] = React11.useState(null);
+  const [isLoading, setIsLoading] = React11.useState(false);
+  const [error, setError] = React11.useState(null);
+  const [conversationId, setConversationId] = React11.useState(initialConversationId ?? null);
+  const abortControllerRef = React11.useRef(null);
+  const chatServiceRef = React11.useRef(null);
+  React11.useEffect(() => {
+    if (!mcpServers?.length) {
+      setMcpTools(null);
+      return;
+    }
+    let cancelled = false;
+    import("@contractspec/lib.ai-agent/tools/mcp-client").then(({ createMcpToolsets }) => {
+      createMcpToolsets(mcpServers).then(({ tools, cleanup }) => {
+        if (!cancelled) {
+          setMcpTools(tools);
+          mcpCleanupRef.current = cleanup;
+        } else {
+          cleanup().catch(() => {
+            return;
+          });
+        }
+      }).catch(() => {
+        if (!cancelled)
+          setMcpTools(null);
+      });
+    });
+    return () => {
+      cancelled = true;
+      const cleanup = mcpCleanupRef.current;
+      mcpCleanupRef.current = null;
+      if (cleanup)
+        cleanup().catch(() => {
+          return;
+        });
+      setMcpTools(null);
+    };
+  }, [mcpServers]);
+  React11.useEffect(() => {
     const chatProvider = createProvider({
       provider,
       model,
@@ -1544,9 +2807,16 @@ function useChat(options = {}) {
     });
     chatServiceRef.current = new ChatService({
       provider: chatProvider,
+      store,
       systemPrompt,
       onUsage,
-      tools: toolsDefs?.length ? toolsToToolSet(toolsDefs) : undefined
+      tools: toolsDefs?.length ? toolsToToolSet(toolsDefs) : undefined,
+      thinkingLevel,
+      workflowToolsConfig,
+      modelSelector,
+      contractsContext,
+      surfacePlanConfig,
+      mcpTools
     });
   }, [
     provider,
@@ -1554,11 +2824,18 @@ function useChat(options = {}) {
     model,
     apiKey,
     proxyUrl,
+    store,
     systemPrompt,
     onUsage,
-    toolsDefs
+    toolsDefs,
+    thinkingLevel,
+    workflowToolsConfig,
+    modelSelector,
+    contractsContext,
+    surfacePlanConfig,
+    mcpTools
   ]);
-  React6.useEffect(() => {
+  React11.useEffect(() => {
     if (!conversationId || !chatServiceRef.current)
       return;
     const loadConversation = async () => {
@@ -1572,7 +2849,90 @@ function useChat(options = {}) {
     };
     loadConversation().catch(console.error);
   }, [conversationId]);
-  const sendMessage = React6.useCallback(async (content, attachments) => {
+  const sendMessage = React11.useCallback(async (content, attachments, opts) => {
+    if (agentMode?.agent) {
+      setIsLoading(true);
+      setError(null);
+      abortControllerRef.current = new AbortController;
+      try {
+        if (!opts?.skipUserAppend) {
+          const userMessage = {
+            id: `msg_${Date.now()}`,
+            conversationId: conversationId ?? "",
+            role: "user",
+            content,
+            status: "completed",
+            createdAt: new Date,
+            updatedAt: new Date,
+            attachments
+          };
+          setMessages((prev) => [...prev, userMessage]);
+          onSend?.(userMessage);
+        }
+        const result = await agentMode.agent.generate({
+          prompt: content,
+          signal: abortControllerRef.current.signal
+        });
+        const toolCallsMap = new Map;
+        for (const tc of result.toolCalls ?? []) {
+          const tr = result.toolResults?.find((r) => r.toolCallId === tc.toolCallId);
+          toolCallsMap.set(tc.toolCallId, {
+            id: tc.toolCallId,
+            name: tc.toolName,
+            args: tc.args ?? {},
+            result: tr?.output,
+            status: "completed"
+          });
+        }
+        const assistantMessage = {
+          id: `msg_${Date.now()}_a`,
+          conversationId: conversationId ?? "",
+          role: "assistant",
+          content: result.text,
+          status: "completed",
+          createdAt: new Date,
+          updatedAt: new Date,
+          toolCalls: toolCallsMap.size ? Array.from(toolCallsMap.values()) : undefined,
+          usage: result.usage
+        };
+        setMessages((prev) => [...prev, assistantMessage]);
+        onResponse?.(assistantMessage);
+        onUsage?.(result.usage ?? { inputTokens: 0, outputTokens: 0 });
+        if (store && !conversationId) {
+          const conv = await store.create({
+            status: "active",
+            provider: "agent",
+            model: "agent",
+            messages: []
+          });
+          if (!opts?.skipUserAppend) {
+            await store.appendMessage(conv.id, {
+              role: "user",
+              content,
+              status: "completed",
+              attachments
+            });
+          }
+          await store.appendMessage(conv.id, {
+            role: "assistant",
+            content: result.text,
+            status: "completed",
+            toolCalls: assistantMessage.toolCalls,
+            usage: result.usage
+          });
+          const updated = await store.get(conv.id);
+          if (updated)
+            setConversation(updated);
+          setConversationId(conv.id);
+        }
+      } catch (err) {
+        setError(err instanceof Error ? err : new Error(String(err)));
+        onError?.(err instanceof Error ? err : new Error(String(err)));
+      } finally {
+        setIsLoading(false);
+      }
+      return;
+    }
     if (!chatServiceRef.current) {
       throw new Error("Chat service not initialized");
     }
@@ -1580,25 +2940,28 @@ function useChat(options = {}) {
     setError(null);
     abortControllerRef.current = new AbortController;
     try {
-      const userMessage = {
-        id: `msg_${Date.now()}`,
-        conversationId: conversationId ?? "",
-        role: "user",
-        content,
-        status: "completed",
-        createdAt: new Date,
-        updatedAt: new Date,
-        attachments
-      };
-      setMessages((prev) => [...prev, userMessage]);
-      onSend?.(userMessage);
+      if (!opts?.skipUserAppend) {
+        const userMessage = {
+          id: `msg_${Date.now()}`,
+          conversationId: conversationId ?? "",
+          role: "user",
+          content,
+          status: "completed",
+          createdAt: new Date,
+          updatedAt: new Date,
+          attachments
+        };
+        setMessages((prev) => [...prev, userMessage]);
+        onSend?.(userMessage);
+      }
       if (streaming) {
         const result = await chatServiceRef.current.stream({
           conversationId: conversationId ?? undefined,
           content,
-          attachments
+          attachments,
+          skipUserAppend: opts?.skipUserAppend
         });
-        if (!conversationId) {
+        if (!conversationId && !opts?.skipUserAppend) {
           setConversationId(result.conversationId);
         }
         const assistantMessage = {
@@ -1679,7 +3042,8 @@ function useChat(options = {}) {
         const result = await chatServiceRef.current.send({
           conversationId: conversationId ?? undefined,
           content,
-          attachments
+          attachments,
+          skipUserAppend: opts?.skipUserAppend
         });
         setConversation(result.conversation);
         setMessages(result.conversation.messages);
@@ -1696,14 +3060,24 @@ function useChat(options = {}) {
       setIsLoading(false);
       abortControllerRef.current = null;
     }
-  }, [conversationId, streaming, onSend, onResponse, onError, messages]);
-  const clearConversation = React6.useCallback(() => {
+  }, [
+    conversationId,
+    streaming,
+    onSend,
+    onResponse,
+    onError,
+    onUsage,
+    messages,
+    agentMode,
+    store
+  ]);
+  const clearConversation = React11.useCallback(() => {
     setMessages([]);
     setConversation(null);
     setConversationId(null);
     setError(null);
   }, []);
-  const regenerate = React6.useCallback(async () => {
+  const regenerate = React11.useCallback(async () => {
     const lastUserMessageIndex = messages.findLastIndex((m) => m.role === "user");
     if (lastUserMessageIndex === -1)
       return;
@@ -1713,11 +3087,51 @@ function useChat(options = {}) {
     setMessages((prev) => prev.slice(0, lastUserMessageIndex + 1));
     await sendMessage(lastUserMessage.content, lastUserMessage.attachments);
   }, [messages, sendMessage]);
-  const stop = React6.useCallback(() => {
+  const stop = React11.useCallback(() => {
     abortControllerRef.current?.abort();
     setIsLoading(false);
   }, []);
-  const addToolApprovalResponse = React6.useCallback((_toolCallId, _result) => {
+  const createNewConversation = clearConversation;
+  const editMessage = React11.useCallback(async (messageId, newContent) => {
+    if (!chatServiceRef.current || !conversationId)
+      return;
+    const msg = messages.find((m) => m.id === messageId);
+    if (!msg || msg.role !== "user")
+      return;
+    await chatServiceRef.current.updateMessage(conversationId, messageId, {
+      content: newContent
+    });
+    const truncated = await chatServiceRef.current.truncateAfter(conversationId, messageId);
+    if (truncated) {
+      setMessages(truncated.messages);
+    }
+    await sendMessage(newContent, undefined, { skipUserAppend: true });
+  }, [conversationId, messages, sendMessage]);
+  const forkConversation = React11.useCallback(async (upToMessageId) => {
+    if (!chatServiceRef.current)
+      return null;
+    const idToFork = conversationId ?? conversation?.id;
+    if (!idToFork)
+      return null;
+    try {
+      const forked = await chatServiceRef.current.forkConversation(idToFork, upToMessageId);
+      setConversationId(forked.id);
+      setConversation(forked);
+      setMessages(forked.messages);
+      return forked.id;
+    } catch {
+      return null;
+    }
+  }, [conversationId, conversation]);
+  const updateConversationFn = React11.useCallback(async (updates) => {
+    if (!chatServiceRef.current || !conversationId)
+      return null;
+    const updated = await chatServiceRef.current.updateConversation(conversationId, updates);
+    if (updated)
+      setConversation(updated);
+    return updated;
+  }, [conversationId]);
+  const addToolApprovalResponse = React11.useCallback((_toolCallId, _result) => {
     throw new Error(`addToolApprovalResponse: Tool approval requires server route with toUIMessageStreamResponse. ` + `Use createChatRoute and @ai-sdk/react useChat for tools with requireApproval.`);
   }, []);
   const hasApprovalTools = toolsDefs?.some((t) => t.requireApproval) ?? false;
@@ -1731,40 +3145,751 @@ function useChat(options = {}) {
     setConversationId,
     regenerate,
     stop,
+    createNewConversation,
+    editMessage,
+    forkConversation,
+    updateConversation: updateConversationFn,
     ...hasApprovalTools && { addToolApprovalResponse }
   };
 }
-// src/presentation/hooks/useProviders.tsx
-import * as React7 from "react";
-import {
-  getAvailableProviders,
-  getModelsForProvider as getModelsForProvider2
-} from "@contractspec/lib.ai-providers";
-"use client";
-function useProviders() {
-  const [providers, setProviders] = React7.useState([]);
-  const [isLoading, setIsLoading] = React7.useState(true);
-  const loadProviders = React7.useCallback(async () => {
-    setIsLoading(true);
-    try {
-      const available = getAvailableProviders();
-      const providersWithModels = available.map((p) => ({
-        ...p,
-        models: getModelsForProvider2(p.provider)
-      }));
-      setProviders(providersWithModels);
-    } catch (error) {
-      console.error("Failed to load providers:", error);
-    } finally {
-      setIsLoading(false);
+
+// src/core/local-storage-conversation-store.ts
+var DEFAULT_KEY = "contractspec:ai-chat:conversations";
+function generateId2(prefix) {
+  return `${prefix}_${Date.now()}_${Math.random().toString(36).slice(2, 11)}`;
+}
+function toSerializable(conv) {
+  return {
+    ...conv,
+    createdAt: conv.createdAt.toISOString(),
+    updatedAt: conv.updatedAt.toISOString(),
+    messages: conv.messages.map((m) => ({
+      ...m,
+      createdAt: m.createdAt.toISOString(),
+      updatedAt: m.updatedAt.toISOString()
+    }))
+  };
+}
+function fromSerializable(raw) {
+  const messages = raw.messages?.map((m) => ({
+    ...m,
+    createdAt: new Date(m.createdAt),
+    updatedAt: new Date(m.updatedAt)
+  })) ?? [];
+  return {
+    ...raw,
+    createdAt: new Date(raw.createdAt),
+    updatedAt: new Date(raw.updatedAt),
+    messages
+  };
+}
+function loadAll(key) {
+  if (typeof window === "undefined")
+    return new Map;
+  try {
+    const raw = window.localStorage.getItem(key);
+    if (!raw)
+      return new Map;
+    const arr = JSON.parse(raw);
+    const map = new Map;
+    for (const item of arr) {
+      const conv = fromSerializable(item);
+      map.set(conv.id, conv);
     }
-  }, []);
-  React7.useEffect(() => {
+    return map;
+  } catch {
+    return new Map;
+  }
+}
+function saveAll(key, map) {
+  if (typeof window === "undefined")
+    return;
+  try {
+    const arr = Array.from(map.values()).map(toSerializable);
+    window.localStorage.setItem(key, JSON.stringify(arr));
+  } catch {}
+}
+
+class LocalStorageConversationStore {
+  key;
+  cache = null;
+  constructor(storageKey = DEFAULT_KEY) {
+    this.key = storageKey;
+  }
+  getMap() {
+    if (!this.cache) {
+      this.cache = loadAll(this.key);
+    }
+    return this.cache;
+  }
+  persist() {
+    saveAll(this.key, this.getMap());
+  }
+  async get(conversationId) {
+    return this.getMap().get(conversationId) ?? null;
+  }
+  async create(conversation) {
+    const now = new Date;
+    const full = {
+      ...conversation,
+      id: generateId2("conv"),
+      createdAt: now,
+      updatedAt: now
+    };
+    this.getMap().set(full.id, full);
+    this.persist();
+    return full;
+  }
+  async update(conversationId, updates) {
+    const conv = this.getMap().get(conversationId);
+    if (!conv)
+      return null;
+    const updated = {
+      ...conv,
+      ...updates,
+      updatedAt: new Date
+    };
+    this.getMap().set(conversationId, updated);
+    this.persist();
+    return updated;
+  }
+  async appendMessage(conversationId, message) {
+    const conv = this.getMap().get(conversationId);
+    if (!conv)
+      throw new Error(`Conversation ${conversationId} not found`);
+    const now = new Date;
+    const fullMessage = {
+      ...message,
+      id: generateId2("msg"),
+      conversationId,
+      createdAt: now,
+      updatedAt: now
+    };
+    conv.messages.push(fullMessage);
+    conv.updatedAt = now;
+    this.persist();
+    return fullMessage;
+  }
+  async updateMessage(conversationId, messageId, updates) {
+    const conv = this.getMap().get(conversationId);
+    if (!conv)
+      return null;
+    const idx = conv.messages.findIndex((m) => m.id === messageId);
+    if (idx === -1)
+      return null;
+    const msg = conv.messages[idx];
+    if (!msg)
+      return null;
+    const updated = {
+      ...msg,
+      ...updates,
+      updatedAt: new Date
+    };
+    conv.messages[idx] = updated;
+    conv.updatedAt = new Date;
+    this.persist();
+    return updated;
+  }
+  async delete(conversationId) {
+    const deleted = this.getMap().delete(conversationId);
+    if (deleted)
+      this.persist();
+    return deleted;
+  }
+  async list(options) {
+    let results = Array.from(this.getMap().values());
+    if (options?.status) {
+      results = results.filter((c) => c.status === options.status);
+    }
+    if (options?.projectId) {
+      results = results.filter((c) => c.projectId === options.projectId);
+    }
+    if (options?.tags && options.tags.length > 0) {
+      const tagSet = new Set(options.tags);
+      results = results.filter((c) => c.tags && c.tags.some((t) => tagSet.has(t)));
+    }
+    results.sort((a, b) => b.updatedAt.getTime() - a.updatedAt.getTime());
+    const offset = options?.offset ?? 0;
+    const limit = options?.limit ?? 100;
+    return results.slice(offset, offset + limit);
+  }
+  async fork(conversationId, upToMessageId) {
+    const source = this.getMap().get(conversationId);
+    if (!source)
+      throw new Error(`Conversation ${conversationId} not found`);
+    let messagesToCopy = source.messages;
+    if (upToMessageId) {
+      const idx = source.messages.findIndex((m) => m.id === upToMessageId);
+      if (idx === -1)
+        throw new Error(`Message ${upToMessageId} not found`);
+      messagesToCopy = source.messages.slice(0, idx + 1);
+    }
+    const now = new Date;
+    const forkedMessages = messagesToCopy.map((m) => ({
+      ...m,
+      id: generateId2("msg"),
+      conversationId: "",
+      createdAt: new Date(m.createdAt),
+      updatedAt: new Date(m.updatedAt)
+    }));
+    const forked = {
+      ...source,
+      id: generateId2("conv"),
+      title: source.title ? `${source.title} (fork)` : undefined,
+      forkedFromId: source.id,
+      createdAt: now,
+      updatedAt: now,
+      messages: forkedMessages
+    };
+    for (const m of forked.messages) {
+      m.conversationId = forked.id;
+    }
+    this.getMap().set(forked.id, forked);
+    this.persist();
+    return forked;
+  }
+  async truncateAfter(conversationId, messageId) {
+    const conv = this.getMap().get(conversationId);
+    if (!conv)
+      return null;
+    const idx = conv.messages.findIndex((m) => m.id === messageId);
+    if (idx === -1)
+      return null;
+    conv.messages = conv.messages.slice(0, idx + 1);
+    conv.updatedAt = new Date;
+    this.persist();
+    return conv;
+  }
+  async search(query, limit = 20) {
+    const lowerQuery = query.toLowerCase();
+    const results = [];
+    for (const conv of this.getMap().values()) {
+      if (conv.title?.toLowerCase().includes(lowerQuery)) {
+        results.push(conv);
+        continue;
+      }
+      if (conv.messages.some((m) => m.content.toLowerCase().includes(lowerQuery))) {
+        results.push(conv);
+      }
+      if (results.length >= limit)
+        break;
+    }
+    return results;
+  }
+}
+function createLocalStorageConversationStore(storageKey) {
+  return new LocalStorageConversationStore(storageKey);
+}
+
+// src/presentation/components/ChatWithSidebar.tsx
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+"use client";
+var defaultStore = createLocalStorageConversationStore();
+function ChatWithSidebar({
+  store = defaultStore,
+  projectId,
+  tags,
+  className,
+  thinkingLevel: initialThinkingLevel = "thinking",
+  presentationRenderer,
+  formRenderer,
+  ...useChatOptions
+}) {
+  const effectiveStore = store;
+  const [thinkingLevel, setThinkingLevel] = React12.useState(initialThinkingLevel);
+  const chat = useChat({
+    ...useChatOptions,
+    store: effectiveStore,
+    thinkingLevel
+  });
+  const {
+    messages,
+    conversation,
+    sendMessage,
+    isLoading,
+    setConversationId,
+    createNewConversation,
+    editMessage,
+    forkConversation,
+    updateConversation
+  } = chat;
+  const selectedConversationId = conversation?.id ?? null;
+  const handleSelectConversation = React12.useCallback((id) => {
+    setConversationId(id);
+  }, [setConversationId]);
+  return /* @__PURE__ */ jsxs10("div", {
+    className: className ?? "flex h-full w-full",
+    children: [
+      /* @__PURE__ */ jsx10(ChatSidebar, {
+        store: effectiveStore,
+        selectedConversationId,
+        onSelectConversation: handleSelectConversation,
+        onCreateNew: createNewConversation,
+        projectId,
+        tags,
+        selectedConversation: conversation,
+        onUpdateConversation: updateConversation ? async (id, updates) => {
+          if (id === selectedConversationId) {
+            await updateConversation(updates);
+          }
+        } : undefined
+      }),
+      /* @__PURE__ */ jsx10("div", {
+        className: "flex min-w-0 flex-1 flex-col",
+        children: /* @__PURE__ */ jsx10(ChatWithExport, {
+          messages,
+          conversation,
+          onCreateNew: createNewConversation,
+          onFork: forkConversation,
+          onEditMessage: editMessage,
+          thinkingLevel,
+          onThinkingLevelChange: setThinkingLevel,
+          presentationRenderer,
+          formRenderer,
+          children: /* @__PURE__ */ jsx10(ChatInput, {
+            onSend: (content, att) => sendMessage(content, att),
+            disabled: isLoading,
+            isLoading
+          })
+        })
+      })
+    ]
+  });
+}
+// src/presentation/components/ModelPicker.tsx
+import * as React13 from "react";
+import { cn as cn7 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { Button as Button6 } from "@contractspec/lib.design-system";
+import {
+  Select as Select2,
+  SelectContent as SelectContent2,
+  SelectItem as SelectItem2,
+  SelectTrigger as SelectTrigger2,
+  SelectValue as SelectValue2
+} from "@contractspec/lib.ui-kit-web/ui/select";
+import { Badge } from "@contractspec/lib.ui-kit-web/ui/badge";
+import { Label as Label2 } from "@contractspec/lib.ui-kit-web/ui/label";
+import { Bot as Bot2, Cloud, Cpu, Sparkles } from "lucide-react";
+import {
+  getModelsForProvider
+} from "@contractspec/lib.ai-providers";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+"use client";
+var PROVIDER_ICONS = {
+  ollama: /* @__PURE__ */ jsx11(Cpu, {
+    className: "h-4 w-4"
+  }),
+  openai: /* @__PURE__ */ jsx11(Bot2, {
+    className: "h-4 w-4"
+  }),
+  anthropic: /* @__PURE__ */ jsx11(Sparkles, {
+    className: "h-4 w-4"
+  }),
+  mistral: /* @__PURE__ */ jsx11(Cloud, {
+    className: "h-4 w-4"
+  }),
+  gemini: /* @__PURE__ */ jsx11(Sparkles, {
+    className: "h-4 w-4"
+  })
+};
+var PROVIDER_NAMES = {
+  ollama: "Ollama (Local)",
+  openai: "OpenAI",
+  anthropic: "Anthropic",
+  mistral: "Mistral",
+  gemini: "Google Gemini"
+};
+var MODE_BADGES = {
+  local: { label: "Local", variant: "secondary" },
+  byok: { label: "BYOK", variant: "outline" },
+  managed: { label: "Managed", variant: "default" }
+};
+function ModelPicker({
+  value,
+  onChange,
+  availableProviders,
+  className,
+  compact = false
+}) {
+  const providers = availableProviders ?? [
+    { provider: "ollama", available: true, mode: "local" },
+    { provider: "openai", available: true, mode: "byok" },
+    { provider: "anthropic", available: true, mode: "byok" },
+    { provider: "mistral", available: true, mode: "byok" },
+    { provider: "gemini", available: true, mode: "byok" }
+  ];
+  const models = getModelsForProvider(value.provider);
+  const selectedModel = models.find((m) => m.id === value.model);
+  const handleProviderChange = React13.useCallback((providerName) => {
+    const provider = providerName;
+    const providerInfo = providers.find((p) => p.provider === provider);
+    const providerModels = getModelsForProvider(provider);
+    const defaultModel = providerModels[0]?.id ?? "";
+    onChange({
+      provider,
+      model: defaultModel,
+      mode: providerInfo?.mode ?? "byok"
+    });
+  }, [onChange, providers]);
+  const handleModelChange = React13.useCallback((modelId) => {
+    onChange({
+      ...value,
+      model: modelId
+    });
+  }, [onChange, value]);
+  if (compact) {
+    return /* @__PURE__ */ jsxs11("div", {
+      className: cn7("flex items-center gap-2", className),
+      children: [
+        /* @__PURE__ */ jsxs11(Select2, {
+          value: value.provider,
+          onValueChange: handleProviderChange,
+          children: [
+            /* @__PURE__ */ jsx11(SelectTrigger2, {
+              className: "w-[140px]",
+              children: /* @__PURE__ */ jsx11(SelectValue2, {})
+            }),
+            /* @__PURE__ */ jsx11(SelectContent2, {
+              children: providers.map((p) => /* @__PURE__ */ jsx11(SelectItem2, {
+                value: p.provider,
+                disabled: !p.available,
+                children: /* @__PURE__ */ jsxs11("div", {
+                  className: "flex items-center gap-2",
+                  children: [
+                    PROVIDER_ICONS[p.provider],
+                    /* @__PURE__ */ jsx11("span", {
+                      children: PROVIDER_NAMES[p.provider]
+                    })
+                  ]
+                })
+              }, p.provider))
+            })
+          ]
+        }),
+        /* @__PURE__ */ jsxs11(Select2, {
+          value: value.model,
+          onValueChange: handleModelChange,
+          children: [
+            /* @__PURE__ */ jsx11(SelectTrigger2, {
+              className: "w-[160px]",
+              children: /* @__PURE__ */ jsx11(SelectValue2, {})
+            }),
+            /* @__PURE__ */ jsx11(SelectContent2, {
+              children: models.map((m) => /* @__PURE__ */ jsx11(SelectItem2, {
+                value: m.id,
+                children: m.name
+              }, m.id))
+            })
+          ]
+        })
+      ]
+    });
+  }
+  return /* @__PURE__ */ jsxs11("div", {
+    className: cn7("flex flex-col gap-3", className),
+    children: [
+      /* @__PURE__ */ jsxs11("div", {
+        className: "flex flex-col gap-1.5",
+        children: [
+          /* @__PURE__ */ jsx11(Label2, {
+            htmlFor: "provider-selection",
+            className: "text-sm font-medium",
+            children: "Provider"
+          }),
+          /* @__PURE__ */ jsx11("div", {
+            className: "flex flex-wrap gap-2",
+            id: "provider-selection",
+            children: providers.map((p) => /* @__PURE__ */ jsxs11(Button6, {
+              variant: value.provider === p.provider ? "default" : "outline",
+              size: "sm",
+              onPress: () => p.available && handleProviderChange(p.provider),
+              disabled: !p.available,
+              className: cn7(!p.available && "opacity-50"),
+              children: [
+                PROVIDER_ICONS[p.provider],
+                /* @__PURE__ */ jsx11("span", {
+                  children: PROVIDER_NAMES[p.provider]
+                }),
+                /* @__PURE__ */ jsx11(Badge, {
+                  variant: MODE_BADGES[p.mode].variant,
+                  className: "ml-1",
+                  children: MODE_BADGES[p.mode].label
+                })
+              ]
+            }, p.provider))
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs11("div", {
+        className: "flex flex-col gap-1.5",
+        children: [
+          /* @__PURE__ */ jsx11(Label2, {
+            htmlFor: "model-picker",
+            className: "text-sm font-medium",
+            children: "Model"
+          }),
+          /* @__PURE__ */ jsxs11(Select2, {
+            name: "model-picker",
+            value: value.model,
+            onValueChange: handleModelChange,
+            children: [
+              /* @__PURE__ */ jsx11(SelectTrigger2, {
+                children: /* @__PURE__ */ jsx11(SelectValue2, {
+                  placeholder: "Select a model"
+                })
+              }),
+              /* @__PURE__ */ jsx11(SelectContent2, {
+                children: models.map((m) => /* @__PURE__ */ jsx11(SelectItem2, {
+                  value: m.id,
+                  children: /* @__PURE__ */ jsxs11("div", {
+                    className: "flex items-center gap-2",
+                    children: [
+                      /* @__PURE__ */ jsx11("span", {
+                        children: m.name
+                      }),
+                      /* @__PURE__ */ jsxs11("span", {
+                        className: "text-muted-foreground text-xs",
+                        children: [
+                          Math.round(m.contextWindow / 1000),
+                          "K"
+                        ]
+                      }),
+                      m.capabilities.vision && /* @__PURE__ */ jsx11(Badge, {
+                        variant: "outline",
+                        className: "text-xs",
+                        children: "Vision"
+                      }),
+                      m.capabilities.reasoning && /* @__PURE__ */ jsx11(Badge, {
+                        variant: "outline",
+                        className: "text-xs",
+                        children: "Reasoning"
+                      })
+                    ]
+                  })
+                }, m.id))
+              })
+            ]
+          })
+        ]
+      }),
+      selectedModel && /* @__PURE__ */ jsxs11("div", {
+        className: "text-muted-foreground flex flex-wrap gap-2 text-xs",
+        children: [
+          /* @__PURE__ */ jsxs11("span", {
+            children: [
+              "Context: ",
+              Math.round(selectedModel.contextWindow / 1000),
+              "K tokens"
+            ]
+          }),
+          selectedModel.capabilities.vision && /* @__PURE__ */ jsx11("span", {
+            children: "• Vision"
+          }),
+          selectedModel.capabilities.tools && /* @__PURE__ */ jsx11("span", {
+            children: "• Tools"
+          }),
+          selectedModel.capabilities.reasoning && /* @__PURE__ */ jsx11("span", {
+            children: "• Reasoning"
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/presentation/components/ContextIndicator.tsx
+import { cn as cn8 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { Badge as Badge2 } from "@contractspec/lib.ui-kit-web/ui/badge";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger
+} from "@contractspec/lib.ui-kit-web/ui/tooltip";
+import { FolderOpen, FileCode, Zap, Info } from "lucide-react";
+import { jsx as jsx12, jsxs as jsxs12, Fragment as Fragment6 } from "react/jsx-runtime";
+"use client";
+function ContextIndicator({
+  summary,
+  active = false,
+  className,
+  showDetails = true
+}) {
+  if (!summary && !active) {
+    return /* @__PURE__ */ jsxs12("div", {
+      className: cn8("flex items-center gap-1.5 text-sm", "text-muted-foreground", className),
+      children: [
+        /* @__PURE__ */ jsx12(Info, {
+          className: "h-4 w-4"
+        }),
+        /* @__PURE__ */ jsx12("span", {
+          children: "No workspace context"
+        })
+      ]
+    });
+  }
+  const content = /* @__PURE__ */ jsxs12("div", {
+    className: cn8("flex items-center gap-2", active ? "text-foreground" : "text-muted-foreground", className),
+    children: [
+      /* @__PURE__ */ jsxs12(Badge2, {
+        variant: active ? "default" : "secondary",
+        className: "flex items-center gap-1",
+        children: [
+          /* @__PURE__ */ jsx12(Zap, {
+            className: "h-3 w-3"
+          }),
+          "Context"
+        ]
+      }),
+      summary && showDetails && /* @__PURE__ */ jsxs12(Fragment6, {
+        children: [
+          /* @__PURE__ */ jsxs12("div", {
+            className: "flex items-center gap-1 text-xs",
+            children: [
+              /* @__PURE__ */ jsx12(FolderOpen, {
+                className: "h-3.5 w-3.5"
+              }),
+              /* @__PURE__ */ jsx12("span", {
+                children: summary.name
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsxs12("div", {
+            className: "flex items-center gap-1 text-xs",
+            children: [
+              /* @__PURE__ */ jsx12(FileCode, {
+                className: "h-3.5 w-3.5"
+              }),
+              /* @__PURE__ */ jsxs12("span", {
+                children: [
+                  summary.specs.total,
+                  " specs"
+                ]
+              })
+            ]
+          })
+        ]
+      })
+    ]
+  });
+  if (!summary) {
+    return content;
+  }
+  return /* @__PURE__ */ jsx12(TooltipProvider, {
+    children: /* @__PURE__ */ jsxs12(Tooltip, {
+      children: [
+        /* @__PURE__ */ jsx12(TooltipTrigger, {
+          asChild: true,
+          children: content
+        }),
+        /* @__PURE__ */ jsx12(TooltipContent, {
+          side: "bottom",
+          className: "max-w-[300px]",
+          children: /* @__PURE__ */ jsxs12("div", {
+            className: "flex flex-col gap-2 text-sm",
+            children: [
+              /* @__PURE__ */ jsx12("div", {
+                className: "font-medium",
+                children: summary.name
+              }),
+              /* @__PURE__ */ jsx12("div", {
+                className: "text-muted-foreground text-xs",
+                children: summary.path
+              }),
+              /* @__PURE__ */ jsx12("div", {
+                className: "border-t pt-2",
+                children: /* @__PURE__ */ jsxs12("div", {
+                  className: "grid grid-cols-2 gap-1 text-xs",
+                  children: [
+                    /* @__PURE__ */ jsx12("span", {
+                      children: "Commands:"
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      className: "text-right",
+                      children: summary.specs.commands
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      children: "Queries:"
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      className: "text-right",
+                      children: summary.specs.queries
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      children: "Events:"
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      className: "text-right",
+                      children: summary.specs.events
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      children: "Presentations:"
+                    }),
+                    /* @__PURE__ */ jsx12("span", {
+                      className: "text-right",
+                      children: summary.specs.presentations
+                    })
+                  ]
+                })
+              }),
+              /* @__PURE__ */ jsxs12("div", {
+                className: "border-t pt-2 text-xs",
+                children: [
+                  /* @__PURE__ */ jsxs12("span", {
+                    children: [
+                      summary.files.total,
+                      " files"
+                    ]
+                  }),
+                  /* @__PURE__ */ jsx12("span", {
+                    className: "mx-1",
+                    children: "•"
+                  }),
+                  /* @__PURE__ */ jsxs12("span", {
+                    children: [
+                      summary.files.specFiles,
+                      " spec files"
+                    ]
+                  })
+                ]
+              })
+            ]
+          })
+        })
+      ]
+    })
+  });
+}
+// src/presentation/hooks/useProviders.tsx
+import * as React14 from "react";
+import {
+  getAvailableProviders,
+  getModelsForProvider as getModelsForProvider2
+} from "@contractspec/lib.ai-providers";
+"use client";
+function useProviders() {
+  const [providers, setProviders] = React14.useState([]);
+  const [isLoading, setIsLoading] = React14.useState(true);
+  const loadProviders = React14.useCallback(async () => {
+    setIsLoading(true);
+    try {
+      const available = getAvailableProviders();
+      const providersWithModels = available.map((p) => ({
+        ...p,
+        models: getModelsForProvider2(p.provider)
+      }));
+      setProviders(providersWithModels);
+    } catch (error) {
+      console.error("Failed to load providers:", error);
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+  React14.useEffect(() => {
     loadProviders();
   }, [loadProviders]);
-  const availableProviders = React7.useMemo(() => providers.filter((p) => p.available), [providers]);
-  const isAvailable = React7.useCallback((provider) => providers.some((p) => p.provider === provider && p.available), [providers]);
-  const getModelsCallback = React7.useCallback((provider) => providers.find((p) => p.provider === provider)?.models ?? [], [providers]);
+  const availableProviders = React14.useMemo(() => providers.filter((p) => p.available), [providers]);
+  const isAvailable = React14.useCallback((provider) => providers.some((p) => p.provider === provider && p.available), [providers]);
+  const getModelsCallback = React14.useCallback((provider) => providers.find((p) => p.provider === provider)?.models ?? [], [providers]);
   return {
     providers,
     availableProviders,
@@ -1779,12 +3904,22 @@ function useProviders() {
 import { useCompletion } from "@ai-sdk/react";
 export {
   useProviders,
+  useMessageSelection,
+  useConversations,
   useCompletion,
   useChat,
+  isPresentationToolResult,
+  isFormToolResult,
+  ToolResultRenderer,
+  ThinkingLevelPicker,
   ModelPicker,
   ContextIndicator,
   CodePreview,
+  ChatWithSidebar,
+  ChatWithExport,
+  ChatSidebar,
   ChatMessage,
   ChatInput,
+  ChatExportToolbar,
   ChatContainer
 };