veryfront 0.0.58 → 0.0.60

package/dist/ai/components.js

@@ -40,7 +40,7 @@ function cn(...classes) {
 }
 
 // src/ai/react/components/chat.tsx
-import * as React7 from "react";
+import * as React8 from "react";
 
 // src/ai/react/primitives/chat-container.tsx
 import * as React from "react";
@@ -523,9 +523,185 @@ function getErrorMessage(error) {
   }
 }
 
+// src/ai/react/components/markdown.tsx
+import * as React7 from "react";
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
+var ReactMarkdown = null;
+var remarkGfm = null;
+var rehypeHighlight = null;
+var mermaidPromise = null;
+var mermaidModule = null;
+async function loadMermaid() {
+  if (!isBrowser)
+    return null;
+  if (mermaidModule)
+    return mermaidModule;
+  if (!mermaidPromise) {
+    mermaidPromise = import("mermaid");
+  }
+  mermaidModule = await mermaidPromise;
+  mermaidModule.default.initialize({
+    startOnLoad: false,
+    theme: "neutral",
+    securityLevel: "loose"
+  });
+  return mermaidModule;
+}
+function MermaidDiagram({ code }) {
+  const [svg, setSvg] = React7.useState("");
+  const [error, setError] = React7.useState("");
+  React7.useEffect(() => {
+    if (!isBrowser)
+      return;
+    let cancelled = false;
+    async function render() {
+      try {
+        const mermaid = await loadMermaid();
+        if (!mermaid)
+          return;
+        const id = `mermaid-${Math.random().toString(36).slice(2, 9)}`;
+        const { svg: renderedSvg } = await mermaid.default.render(id, code);
+        if (!cancelled) {
+          setSvg(renderedSvg);
+          setError("");
+        }
+      } catch (err) {
+        if (!cancelled) {
+          setError(err instanceof Error ? err.message : "Failed to render diagram");
+        }
+      }
+    }
+    render();
+    return () => {
+      cancelled = true;
+    };
+  }, [code]);
+  if (!isBrowser) {
+    return /* @__PURE__ */ jsx6("pre", { className: "my-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg overflow-auto", children: /* @__PURE__ */ jsx6("code", { children: code }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs3("div", { className: "my-4 p-4 bg-red-50 dark:bg-red-900/20 rounded-lg text-red-600 dark:text-red-400 text-sm", children: [
+      /* @__PURE__ */ jsx6("p", { className: "font-medium", children: "Mermaid Error" }),
+      /* @__PURE__ */ jsx6("p", { children: error }),
+      /* @__PURE__ */ jsx6("pre", { className: "mt-2 text-xs overflow-auto", children: code })
+    ] });
+  }
+  if (!svg) {
+    return /* @__PURE__ */ jsx6("div", { className: "my-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg animate-pulse", children: /* @__PURE__ */ jsx6("div", { className: "h-32 flex items-center justify-center text-neutral-400", children: "Loading diagram..." }) });
+  }
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      className: "my-4 flex justify-center overflow-auto",
+      dangerouslySetInnerHTML: { __html: svg }
+    }
+  );
+}
+function CodeBlock({
+  language,
+  code,
+  inline,
+  enableMermaid,
+  renderCodeBlock
+}) {
+  if (renderCodeBlock) {
+    return /* @__PURE__ */ jsx6(Fragment2, { children: renderCodeBlock({ language, code, inline }) });
+  }
+  if (inline) {
+    return /* @__PURE__ */ jsx6("code", { className: "bg-neutral-100 dark:bg-neutral-800 px-1.5 py-0.5 rounded text-sm font-mono", children: code });
+  }
+  if (enableMermaid && language === "mermaid") {
+    return /* @__PURE__ */ jsx6(MermaidDiagram, { code });
+  }
+  return /* @__PURE__ */ jsx6("pre", { className: "my-4 p-4 bg-neutral-900 dark:bg-neutral-950 rounded-lg overflow-auto", children: /* @__PURE__ */ jsx6("code", { className: language ? `language-${language} hljs` : "hljs", children: code }) });
+}
+function Markdown({
+  children,
+  className,
+  enableMermaid = true,
+  renderCodeBlock
+}) {
+  const [isLoaded, setIsLoaded] = React7.useState(false);
+  const [, forceUpdate] = React7.useReducer((x) => x + 1, 0);
+  React7.useEffect(() => {
+    async function load() {
+      if (!ReactMarkdown) {
+        const [rmModule, gfmModule, highlightModule] = await Promise.all([
+          import("react-markdown"),
+          import("remark-gfm"),
+          import("rehype-highlight")
+        ]);
+        ReactMarkdown = rmModule.default;
+        remarkGfm = gfmModule.default;
+        rehypeHighlight = highlightModule.default;
+      }
+      setIsLoaded(true);
+      forceUpdate();
+    }
+    load();
+  }, []);
+  if (!isLoaded || !ReactMarkdown) {
+    return /* @__PURE__ */ jsx6("div", { className: cn("prose prose-sm dark:prose-invert max-w-none", className), children: /* @__PURE__ */ jsx6("p", { className: "whitespace-pre-wrap", children }) });
+  }
+  return /* @__PURE__ */ jsx6("div", { className: cn("prose prose-sm dark:prose-invert max-w-none", className), children: /* @__PURE__ */ jsx6(
+    ReactMarkdown,
+    {
+      remarkPlugins: remarkGfm ? [remarkGfm] : [],
+      rehypePlugins: rehypeHighlight ? [rehypeHighlight] : [],
+      components: {
+        // Custom code rendering
+        // deno-lint-ignore no-explicit-any
+        code(props) {
+          const { className: codeClassName, children: codeChildren, node } = props;
+          const match = /language-(\w+)/.exec(codeClassName || "");
+          const language = match ? match[1] : void 0;
+          const code = String(codeChildren).replace(/\n$/, "");
+          const isInline = !node?.position?.start?.line;
+          return /* @__PURE__ */ jsx6(
+            CodeBlock,
+            {
+              language,
+              code,
+              inline: isInline,
+              enableMermaid,
+              renderCodeBlock
+            }
+          );
+        },
+        // Style tables
+        // deno-lint-ignore no-explicit-any
+        table(props) {
+          return /* @__PURE__ */ jsx6("div", { className: "my-4 overflow-auto", children: /* @__PURE__ */ jsx6("table", { className: "min-w-full divide-y divide-neutral-200 dark:divide-neutral-700", children: props.children }) });
+        },
+        // Style links
+        // deno-lint-ignore no-explicit-any
+        a(props) {
+          return /* @__PURE__ */ jsx6(
+            "a",
+            {
+              href: props.href,
+              className: "text-blue-600 dark:text-blue-400 hover:underline",
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: props.children
+            }
+          );
+        },
+        // Style blockquotes
+        // deno-lint-ignore no-explicit-any
+        blockquote(props) {
+          return /* @__PURE__ */ jsx6("blockquote", { className: "border-l-4 border-neutral-300 dark:border-neutral-600 pl-4 my-4 text-neutral-600 dark:text-neutral-400 italic", children: props.children });
+        }
+      },
+      children
+    }
+  ) });
+}
+
 // src/ai/react/components/chat.tsx
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
-var Chat = React7.forwardRef(
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+var Chat = React8.forwardRef(
   ({
     messages,
     input,
@@ -548,7 +724,7 @@ var Chat = React7.forwardRef(
     multiline = false
   }, ref) => {
     const theme = mergeThemes(defaultChatTheme, userTheme);
-    const messagesEndRef = React7.useRef(null);
+    const messagesEndRef = React8.useRef(null);
     const inputChangeHandler = onChange || handleInputChange || (() => {
     });
     const submitHandler = onSubmit || handleSubmit;
@@ -559,7 +735,7 @@ var Chat = React7.forwardRef(
         }
       }
     });
-    const voiceHandler = React7.useMemo(() => {
+    const voiceHandler = React8.useMemo(() => {
       if (onVoice)
         return onVoice;
       if (enableVoice && voice.isSupported && setInput) {
@@ -567,19 +743,19 @@ var Chat = React7.forwardRef(
       }
       return void 0;
     }, [onVoice, enableVoice, voice.isSupported, voice.toggle, setInput]);
-    React7.useEffect(() => {
+    React8.useEffect(() => {
       messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
     }, [messages]);
-    return /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs4(
       ChatContainer,
       {
         ref,
         className: cn(theme.container, className),
         style: { maxHeight },
         children: [
-          /* @__PURE__ */ jsx6(MessageList, { className: "flex-1 min-h-0 overflow-y-auto", children: /* @__PURE__ */ jsxs3("div", { className: "max-w-2xl mx-auto px-4 py-4 space-y-2", children: [
+          /* @__PURE__ */ jsx7(MessageList, { className: "flex-1 min-h-0 overflow-y-auto", children: /* @__PURE__ */ jsxs4("div", { className: "max-w-2xl mx-auto px-4 py-4 space-y-2", children: [
             messages.map(
-              (msg) => renderMessage ? /* @__PURE__ */ jsx6(React7.Fragment, { children: renderMessage(msg) }, msg.id) : /* @__PURE__ */ jsx6(
+              (msg) => renderMessage ? /* @__PURE__ */ jsx7(React8.Fragment, { children: renderMessage(msg) }, msg.id) : /* @__PURE__ */ jsx7(
                 MessageItem,
                 {
                   role: msg.role,
@@ -587,26 +763,26 @@ var Chat = React7.forwardRef(
                     "flex",
                     msg.role === "user" ? "justify-end" : "justify-start"
                   ),
-                  children: /* @__PURE__ */ jsx6("div", { className: theme.message?.[msg.role] || theme.message?.assistant, children: /* @__PURE__ */ jsx6("p", { className: "whitespace-pre-wrap text-[15px] leading-relaxed", children: msg.content }) })
+                  children: /* @__PURE__ */ jsx7("div", { className: theme.message?.[msg.role] || theme.message?.assistant, children: msg.role === "user" ? /* @__PURE__ */ jsx7("p", { className: "whitespace-pre-wrap text-[15px] leading-relaxed", children: msg.content }) : /* @__PURE__ */ jsx7(Markdown, { className: "text-[15px] leading-relaxed", children: msg.content }) })
                 },
                 msg.id
               )
             ),
-            isLoading && /* @__PURE__ */ jsx6("div", { className: "flex justify-start", children: /* @__PURE__ */ jsx6("div", { className: "bg-neutral-100 dark:bg-neutral-800 rounded-[20px] rounded-bl-[4px] px-4 py-3", children: /* @__PURE__ */ jsxs3("div", { className: "flex gap-1.5 items-center", children: [
-              /* @__PURE__ */ jsx6("span", { className: cn(theme.loading) }),
-              /* @__PURE__ */ jsx6("span", { className: cn(theme.loading), style: { animationDelay: "0.15s" } }),
-              /* @__PURE__ */ jsx6("span", { className: cn(theme.loading), style: { animationDelay: "0.3s" } })
+            isLoading && /* @__PURE__ */ jsx7("div", { className: "flex justify-start", children: /* @__PURE__ */ jsx7("div", { className: "bg-neutral-100 dark:bg-neutral-800 rounded-[20px] rounded-bl-[4px] px-4 py-3", children: /* @__PURE__ */ jsxs4("div", { className: "flex gap-1.5 items-center", children: [
+              /* @__PURE__ */ jsx7("span", { className: cn(theme.loading) }),
+              /* @__PURE__ */ jsx7("span", { className: cn(theme.loading), style: { animationDelay: "0.15s" } }),
+              /* @__PURE__ */ jsx7("span", { className: cn(theme.loading), style: { animationDelay: "0.3s" } })
             ] }) }) }),
-            /* @__PURE__ */ jsx6("div", { ref: messagesEndRef })
+            /* @__PURE__ */ jsx7("div", { ref: messagesEndRef })
           ] }) }),
-          error && /* @__PURE__ */ jsx6("div", { className: "mx-4 mb-2 px-4 py-3 bg-red-50 dark:bg-red-900/20 rounded-2xl text-red-600 dark:text-red-400 text-sm", children: error.message }),
-          /* @__PURE__ */ jsx6("div", { className: "flex-shrink-0 bg-white dark:bg-neutral-900 border-t border-neutral-200 dark:border-neutral-800", children: /* @__PURE__ */ jsx6(
+          error && /* @__PURE__ */ jsx7("div", { className: "mx-4 mb-2 px-4 py-3 bg-red-50 dark:bg-red-900/20 rounded-2xl text-red-600 dark:text-red-400 text-sm", children: error.message }),
+          /* @__PURE__ */ jsx7("div", { className: "flex-shrink-0 bg-white dark:bg-neutral-900 border-t border-neutral-200 dark:border-neutral-800", children: /* @__PURE__ */ jsx7(
             "form",
             {
               onSubmit: submitHandler,
               className: "max-w-2xl mx-auto px-4 py-3",
-              children: /* @__PURE__ */ jsxs3("div", { className: "flex gap-2 items-center", children: [
-                /* @__PURE__ */ jsx6(
+              children: /* @__PURE__ */ jsxs4("div", { className: "flex gap-2 items-center", children: [
+                /* @__PURE__ */ jsx7(
                   InputBox,
                   {
                     value: voice.isListening ? voice.transcript || input : input,
@@ -617,7 +793,7 @@ var Chat = React7.forwardRef(
                     className: theme.input
                   }
                 ),
-                /* @__PURE__ */ jsx6(
+                /* @__PURE__ */ jsx7(
                   SubmitButton,
                   {
                     isLoading: isLoading || voice.isListening,
@@ -637,8 +813,8 @@ var Chat = React7.forwardRef(
   }
 );
 Chat.displayName = "Chat";
-var ChatHeader = React7.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx6(
+var ChatHeader = React8.forwardRef(({ className, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       ref,
@@ -654,8 +830,8 @@ var ChatHeader = React7.forwardRef(({ className, children, ...props }, ref) => {
 ChatHeader.displayName = "ChatHeader";
 var ChatMessages = MessageList;
 ChatMessages.displayName = "ChatMessages";
-var ChatInput = React7.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx6("div", { className: "border-t border-gray-200 dark:border-gray-800 p-4", children: /* @__PURE__ */ jsx6("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx6(
+var ChatInput = React8.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx7("div", { className: "border-t border-gray-200 dark:border-gray-800 p-4", children: /* @__PURE__ */ jsx7("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx7(
     InputBox,
     {
       ref,
@@ -665,8 +841,8 @@ var ChatInput = React7.forwardRef(({ className, ...props }, ref) => {
   ) }) });
 });
 ChatInput.displayName = "ChatInput";
-var ChatFooter = React7.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx6(
+var ChatFooter = React8.forwardRef(({ className, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       ref,
@@ -688,9 +864,9 @@ var ChatComponents = Object.assign(Chat, {
 });
 
 // src/ai/react/components/agent-card.tsx
-import * as React8 from "react";
-import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
-var AgentCard = React8.forwardRef(
+import * as React9 from "react";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+var AgentCard = React9.forwardRef(
   ({
     messages,
     toolCalls = [],
@@ -701,26 +877,26 @@ var AgentCard = React8.forwardRef(
     renderTool
   }, ref) => {
     const theme = mergeThemes(defaultAgentTheme, userTheme);
-    return /* @__PURE__ */ jsxs4(AgentContainer, { ref, className: cn(theme.container, className), children: [
-      /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsxs5(AgentContainer, { ref, className: cn(theme.container, className), children: [
+      /* @__PURE__ */ jsx8(
         AgentStatus,
         {
           status,
           className: cn(theme.status, getStatusColor(status))
         }
       ),
-      thinking && /* @__PURE__ */ jsxs4(ThinkingIndicator, { className: theme.thinking, children: [
-        /* @__PURE__ */ jsx7("span", { className: "font-semibold", children: "Thinking:" }),
+      thinking && /* @__PURE__ */ jsxs5(ThinkingIndicator, { className: theme.thinking, children: [
+        /* @__PURE__ */ jsx8("span", { className: "font-semibold", children: "Thinking:" }),
         thinking
       ] }),
-      toolCalls.length > 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx7("h3", { className: "text-sm font-semibold text-neutral-700 dark:text-neutral-300", children: "Tool Calls" }),
-        /* @__PURE__ */ jsx7(
+      toolCalls.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx8("h3", { className: "text-sm font-semibold text-neutral-700 dark:text-neutral-300", children: "Tool Calls" }),
+        /* @__PURE__ */ jsx8(
           ToolList,
           {
             toolCalls,
             className: "space-y-3",
-            renderTool: renderTool || ((tool) => /* @__PURE__ */ jsxs4(
+            renderTool: renderTool || ((tool) => /* @__PURE__ */ jsxs5(
               ToolInvocation,
               {
                 name: tool.name,
@@ -728,8 +904,8 @@ var AgentCard = React8.forwardRef(
                 status: tool.status,
                 className: theme.tool,
                 children: [
-                  tool.result !== void 0 && /* @__PURE__ */ jsx7(ToolResult, { result: tool.result, className: theme.toolResult }),
-                  tool.error && /* @__PURE__ */ jsxs4("div", { className: "mt-2 p-3 bg-red-50 dark:bg-red-900/20 text-red-900 dark:text-red-100 rounded-xl text-sm border border-red-200 dark:border-red-800", children: [
+                  tool.result !== void 0 && /* @__PURE__ */ jsx8(ToolResult, { result: tool.result, className: theme.toolResult }),
+                  tool.error && /* @__PURE__ */ jsxs5("div", { className: "mt-2 p-3 bg-red-50 dark:bg-red-900/20 text-red-900 dark:text-red-100 rounded-xl text-sm border border-red-200 dark:border-red-800", children: [
                     "Error: ",
                     tool.error
                   ] })
@@ -739,18 +915,18 @@ var AgentCard = React8.forwardRef(
           }
         )
       ] }),
-      messages && messages.length > 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx7("h3", { className: "text-sm font-semibold text-neutral-700 dark:text-neutral-300", children: "Messages" }),
-        /* @__PURE__ */ jsx7("div", { className: "space-y-2 max-h-96 overflow-y-auto", children: messages.map((msg) => /* @__PURE__ */ jsxs4(
+      messages && messages.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx8("h3", { className: "text-sm font-semibold text-neutral-700 dark:text-neutral-300", children: "Messages" }),
+        /* @__PURE__ */ jsx8("div", { className: "space-y-2 max-h-96 overflow-y-auto", children: messages.map((msg) => /* @__PURE__ */ jsxs5(
           "div",
           {
             className: "text-sm p-3 rounded-xl bg-neutral-50 dark:bg-neutral-800",
             children: [
-              /* @__PURE__ */ jsxs4("span", { className: "font-semibold capitalize text-neutral-900 dark:text-neutral-100", children: [
+              /* @__PURE__ */ jsxs5("span", { className: "font-semibold capitalize text-neutral-900 dark:text-neutral-100", children: [
                 msg.role,
                 ":"
               ] }),
-              /* @__PURE__ */ jsxs4("span", { className: "text-neutral-600 dark:text-neutral-400 ml-1", children: [
+              /* @__PURE__ */ jsxs5("span", { className: "text-neutral-600 dark:text-neutral-400 ml-1", children: [
                 msg.content.substring(0, 200),
                 "..."
               ] })
@@ -783,12 +959,12 @@ function getStatusColor(status) {
 }
 
 // src/ai/react/components/message.tsx
-import * as React9 from "react";
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
-var Message = React9.forwardRef(
+import * as React10 from "react";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+var Message = React10.forwardRef(
   ({ message, className, theme: userTheme, showRole = false, showTimestamp = false }, ref) => {
     const theme = mergeThemes(defaultChatTheme, userTheme);
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx9(
       MessageItem,
       {
         ref,
@@ -798,27 +974,27 @@ var Message = React9.forwardRef(
           message.role === "user" ? "justify-end" : "justify-start",
           className
         ),
-        children: /* @__PURE__ */ jsxs5("div", { className: theme.message?.[message.role] || theme.message?.assistant, children: [
-          showRole && /* @__PURE__ */ jsx8(MessageRole, { className: "block text-xs font-semibold mb-1 opacity-75 uppercase", children: message.role }),
-          /* @__PURE__ */ jsx8(MessageContent, { children: message.content }),
-          showTimestamp && message.timestamp && /* @__PURE__ */ jsx8("div", { className: "text-xs opacity-60 mt-1", children: new Date(message.timestamp).toLocaleTimeString() })
+        children: /* @__PURE__ */ jsxs6("div", { className: theme.message?.[message.role] || theme.message?.assistant, children: [
+          showRole && /* @__PURE__ */ jsx9(MessageRole, { className: "block text-xs font-semibold mb-1 opacity-75 uppercase", children: message.role }),
+          /* @__PURE__ */ jsx9(MessageContent, { children: message.content }),
+          showTimestamp && message.timestamp && /* @__PURE__ */ jsx9("div", { className: "text-xs opacity-60 mt-1", children: new Date(message.timestamp).toLocaleTimeString() })
         ] })
       }
     );
   }
 );
 Message.displayName = "Message";
-var StreamingMessage = React9.forwardRef(({ content, showCursor = true, className, theme: userTheme }, ref) => {
+var StreamingMessage = React10.forwardRef(({ content, showCursor = true, className, theme: userTheme }, ref) => {
   const theme = mergeThemes(defaultChatTheme, userTheme);
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     MessageItem,
     {
       ref,
       role: "assistant",
       className: cn("flex justify-start", className),
-      children: /* @__PURE__ */ jsx8("div", { className: theme.message?.assistant, children: /* @__PURE__ */ jsxs5(MessageContent, { children: [
+      children: /* @__PURE__ */ jsx9("div", { className: theme.message?.assistant, children: /* @__PURE__ */ jsxs6(MessageContent, { children: [
         content,
-        showCursor && /* @__PURE__ */ jsx8("span", { className: "inline-block w-1 h-4 bg-current ml-1 animate-pulse" })
+        showCursor && /* @__PURE__ */ jsx9("span", { className: "inline-block w-1 h-4 bg-current ml-1 animate-pulse" })
       ] }) })
     }
   );
@@ -826,9 +1002,9 @@ var StreamingMessage = React9.forwardRef(({ content, showCursor = true, classNam
 StreamingMessage.displayName = "StreamingMessage";
 
 // src/ai/react/components/error-boundary.tsx
-import * as React10 from "react";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
-var AIErrorBoundary = class extends React10.Component {
+import * as React11 from "react";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+var AIErrorBoundary = class extends React11.Component {
   constructor(props) {
     super(props);
     this.reset = () => {
@@ -853,20 +1029,20 @@ var AIErrorBoundary = class extends React10.Component {
         }
         return this.props.fallback;
       }
-      return /* @__PURE__ */ jsx9(
+      return /* @__PURE__ */ jsx10(
         "div",
         {
           className: "border border-red-200 dark:border-red-800 bg-red-50 dark:bg-red-900/20 rounded-2xl p-6",
           role: "alert",
-          children: /* @__PURE__ */ jsxs6("div", { className: "flex items-start gap-4", children: [
-            /* @__PURE__ */ jsx9("div", { className: "w-10 h-10 rounded-full bg-red-100 dark:bg-red-900/40 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx9(
+          children: /* @__PURE__ */ jsxs7("div", { className: "flex items-start gap-4", children: [
+            /* @__PURE__ */ jsx10("div", { className: "w-10 h-10 rounded-full bg-red-100 dark:bg-red-900/40 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx10(
               "svg",
               {
                 className: "w-5 h-5 text-red-600 dark:text-red-400",
                 fill: "none",
                 viewBox: "0 0 24 24",
                 stroke: "currentColor",
-                children: /* @__PURE__ */ jsx9(
+                children: /* @__PURE__ */ jsx10(
                   "path",
                   {
                     strokeLinecap: "round",
@@ -877,10 +1053,10 @@ var AIErrorBoundary = class extends React10.Component {
                 )
               }
             ) }),
-            /* @__PURE__ */ jsxs6("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsx9("h3", { className: "text-base font-semibold text-red-900 dark:text-red-100", children: this.props.errorMessage || "An error occurred in the AI component" }),
-              /* @__PURE__ */ jsx9("p", { className: "mt-1.5 text-sm text-red-700 dark:text-red-300 leading-relaxed", children: this.state.error.message }),
-              /* @__PURE__ */ jsx9(
+            /* @__PURE__ */ jsxs7("div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ jsx10("h3", { className: "text-base font-semibold text-red-900 dark:text-red-100", children: this.props.errorMessage || "An error occurred in the AI component" }),
+              /* @__PURE__ */ jsx10("p", { className: "mt-1.5 text-sm text-red-700 dark:text-red-300 leading-relaxed", children: this.state.error.message }),
+              /* @__PURE__ */ jsx10(
                 "button",
                 {
                   type: "button",
@@ -898,12 +1074,12 @@ var AIErrorBoundary = class extends React10.Component {
   }
 };
 function useAIErrorHandler() {
-  const [error, setError] = React10.useState(null);
-  const handleError = React10.useCallback((error2) => {
+  const [error, setError] = React11.useState(null);
+  const handleError = React11.useCallback((error2) => {
     console.error("[useAIErrorHandler] Error:", error2);
     setError(error2);
   }, []);
-  const clearError = React10.useCallback(() => {
+  const clearError = React11.useCallback(() => {
     setError(null);
   }, []);
   return {
@@ -918,6 +1094,7 @@ export {
   AgentCard,
   Chat,
   ChatComponents,
+  Markdown,
   Message,
   StreamingMessage,
   cn,