veryfront 0.0.75 → 0.0.79

package/dist/ai/components.js

@@ -1,1769 +0,0 @@
-// src/_shims/deno-env.ts
-globalThis.Deno = globalThis.Deno || {
-  env: {
-    get(key) {
-      return process.env[key];
-    },
-    set(key, value) {
-      process.env[key] = value;
-    },
-    delete(key) {
-      delete process.env[key];
-    },
-    has(key) {
-      return key in process.env;
-    },
-    toObject() {
-      return { ...process.env };
-    }
-  }
-};
-
-// src/ai/react/components/theme.ts
-var defaultChatTheme = {
-  container: "flex flex-col h-full overflow-hidden bg-white dark:bg-neutral-900",
-  message: {
-    user: "bg-blue-500 text-white rounded-[20px] rounded-br-[4px] px-4 py-2.5 max-w-[75%]",
-    assistant: "bg-neutral-100 dark:bg-neutral-800 text-neutral-900 dark:text-neutral-100 rounded-[20px] rounded-bl-[4px] px-4 py-2.5 max-w-[75%]",
-    system: "bg-neutral-100 dark:bg-neutral-800 text-neutral-500 dark:text-neutral-400 rounded-2xl px-4 py-2 text-sm mx-auto text-center",
-    tool: "bg-neutral-50 dark:bg-neutral-800 text-neutral-600 dark:text-neutral-300 rounded-xl px-3 py-2 text-sm font-mono border border-neutral-200 dark:border-neutral-700"
-  },
-  input: "flex-1 px-4 py-2.5 bg-neutral-100 dark:bg-neutral-800 border-0 rounded-full focus:outline-none focus:ring-2 focus:ring-blue-500/30 dark:text-neutral-100 placeholder-neutral-400 dark:placeholder-neutral-500 text-[15px]",
-  button: "w-9 h-9 flex items-center justify-center bg-blue-500 hover:bg-blue-600 active:scale-95 text-white rounded-full transition-all disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:bg-blue-500 disabled:active:scale-100",
-  loading: "w-1.5 h-1.5 bg-neutral-400 rounded-full animate-bounce"
-};
-var defaultAgentTheme = {
-  container: "border border-neutral-200 dark:border-neutral-800 rounded-2xl p-6 space-y-4 bg-white dark:bg-neutral-900",
-  status: "inline-flex items-center px-3 py-1.5 rounded-full text-sm font-medium",
-  thinking: "bg-amber-50 dark:bg-amber-900/20 rounded-xl px-4 py-3 italic text-neutral-700 dark:text-neutral-300 border border-amber-200 dark:border-amber-800",
-  tool: "rounded-xl px-4 py-3 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800",
-  toolResult: "mt-2 p-3 bg-neutral-100 dark:bg-neutral-800 rounded-xl font-mono text-sm overflow-x-auto"
-};
-function mergeThemes(defaultTheme, userTheme) {
-  if (!userTheme)
-    return defaultTheme;
-  const merged = { ...defaultTheme };
-  for (const key in userTheme) {
-    const value = userTheme[key];
-    if (value === void 0) {
-      continue;
-    }
-    if (typeof value === "object" && !Array.isArray(value)) {
-      merged[key] = { ...defaultTheme[key], ...value };
-    } else {
-      merged[key] = value;
-    }
-  }
-  return merged;
-}
-function cn(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-
-// src/ai/react/components/chat.tsx
-import * as React8 from "react";
-
-// src/ai/react/primitives/chat-container.tsx
-import * as React from "react";
-import { jsx } from "react/jsx-runtime";
-var ChatContainer = React.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className,
-        "data-chat-container": "",
-        ...props,
-        children
-      }
-    );
-  }
-);
-ChatContainer.displayName = "ChatContainer";
-
-// src/ai/react/primitives/message-list.tsx
-import * as React2 from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var MessageList = React2.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx2(
-      "div",
-      {
-        ref,
-        className,
-        "data-message-list": "",
-        role: "log",
-        "aria-live": "polite",
-        ...props,
-        children
-      }
-    );
-  }
-);
-MessageList.displayName = "MessageList";
-var MessageItem = React2.forwardRef(
-  ({ className, role, content, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx2(
-      "div",
-      {
-        ref,
-        className,
-        "data-message-item": "",
-        "data-role": role,
-        ...props,
-        children: children || content
-      }
-    );
-  }
-);
-MessageItem.displayName = "MessageItem";
-var MessageRole = React2.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx2(
-      "span",
-      {
-        ref,
-        className,
-        "data-message-role": "",
-        ...props,
-        children
-      }
-    );
-  }
-);
-MessageRole.displayName = "MessageRole";
-var MessageContent = React2.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      ref,
-      className,
-      "data-message-content": "",
-      ...props,
-      children
-    }
-  );
-});
-MessageContent.displayName = "MessageContent";
-
-// src/ai/react/primitives/input-box.tsx
-import * as React3 from "react";
-import { jsx as jsx3, jsxs } from "react/jsx-runtime";
-var InputBox = React3.forwardRef(({ className, value, onChange, onSubmit, multiline, ...props }, ref) => {
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter" && !e.shiftKey && onSubmit) {
-      e.preventDefault();
-      onSubmit();
-    }
-  };
-  if (multiline) {
-    return /* @__PURE__ */ jsx3(
-      "textarea",
-      {
-        ref,
-        className,
-        value,
-        onChange,
-        onKeyDown: handleKeyDown,
-        "data-input-box": "",
-        "data-multiline": "true",
-        rows: 3,
-        ...props
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx3(
-    "input",
-    {
-      ref,
-      type: "text",
-      className,
-      value,
-      onChange,
-      onKeyDown: handleKeyDown,
-      "data-input-box": "",
-      ...props
-    }
-  );
-});
-InputBox.displayName = "InputBox";
-var SubmitIcon = () => /* @__PURE__ */ jsx3("svg", { className: "w-4 h-4", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx3("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) });
-var StopIcon = () => /* @__PURE__ */ jsx3("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx3("rect", { x: "4", y: "4", width: "16", height: "16", rx: "2" }) });
-var VoiceIcon = () => /* @__PURE__ */ jsxs(
-  "svg",
-  {
-    width: "16",
-    height: "16",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    children: [
-      /* @__PURE__ */ jsx3("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z" }),
-      /* @__PURE__ */ jsx3("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
-      /* @__PURE__ */ jsx3("line", { x1: "12", x2: "12", y1: "19", y2: "22" })
-    ]
-  }
-);
-var SubmitButton = React3.forwardRef(({ className, isLoading, hasInput, onStop, onVoice, icons, disabled, children, ...props }, ref) => {
-  const showStop = isLoading;
-  const showVoice = !isLoading && !hasInput && onVoice;
-  const handleClick = (e) => {
-    if (showStop && onStop) {
-      e.preventDefault();
-      onStop();
-    } else if (showVoice && onVoice) {
-      e.preventDefault();
-      onVoice();
-    }
-  };
-  let icon;
-  let ariaLabel;
-  if (showStop) {
-    icon = icons?.stop || /* @__PURE__ */ jsx3(StopIcon, {});
-    ariaLabel = "Stop generating";
-  } else if (showVoice) {
-    icon = icons?.voice || /* @__PURE__ */ jsx3(VoiceIcon, {});
-    ariaLabel = "Voice input";
-  } else {
-    icon = icons?.submit || /* @__PURE__ */ jsx3(SubmitIcon, {});
-    ariaLabel = "Send message";
-  }
-  return /* @__PURE__ */ jsx3(
-    "button",
-    {
-      ref,
-      type: showStop || showVoice ? "button" : "submit",
-      className,
-      disabled: disabled && !showStop,
-      onClick: handleClick,
-      "data-submit-button": "",
-      "data-state": showStop ? "stop" : showVoice ? "voice" : "submit",
-      "data-loading": isLoading,
-      "aria-label": ariaLabel,
-      ...props,
-      children: children || icon
-    }
-  );
-});
-SubmitButton.displayName = "SubmitButton";
-var LoadingIndicator = React3.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx3(
-    "div",
-    {
-      ref,
-      className,
-      "data-loading-indicator": "",
-      role: "status",
-      "aria-label": "Loading",
-      ...props
-    }
-  );
-});
-LoadingIndicator.displayName = "LoadingIndicator";
-
-// src/ai/react/primitives/agent-primitives.tsx
-import * as React4 from "react";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var AgentContainer = React4.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx4(
-    "div",
-    {
-      ref,
-      className,
-      "data-agent-container": "",
-      ...props,
-      children
-    }
-  );
-});
-AgentContainer.displayName = "AgentContainer";
-var AgentStatus = React4.forwardRef(
-  ({ className, status, label, ...props }, ref) => {
-    const displayLabel = label || formatStatus(status);
-    return /* @__PURE__ */ jsx4(
-      "div",
-      {
-        ref,
-        className,
-        "data-agent-status": "",
-        "data-status": status,
-        role: "status",
-        "aria-label": `Agent status: ${displayLabel}`,
-        ...props,
-        children: displayLabel
-      }
-    );
-  }
-);
-AgentStatus.displayName = "AgentStatus";
-var ThinkingIndicator = React4.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx4(
-    "div",
-    {
-      ref,
-      className,
-      "data-thinking-indicator": "",
-      role: "status",
-      "aria-live": "polite",
-      ...props,
-      children
-    }
-  );
-});
-ThinkingIndicator.displayName = "ThinkingIndicator";
-function formatStatus(status) {
-  switch (status) {
-    case "idle":
-      return "Idle";
-    case "thinking":
-      return "Thinking...";
-    case "tool_execution":
-      return "Using tools...";
-    case "streaming":
-      return "Responding...";
-    case "completed":
-      return "Completed";
-    case "error":
-      return "Error";
-    default:
-      return String(status);
-  }
-}
-
-// src/ai/react/primitives/tool-primitives.tsx
-import * as React5 from "react";
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
-var ToolInvocation = React5.forwardRef(({ className, name, input, output: _output, state, errorText, dynamic, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ref,
-      className,
-      "data-tool-invocation": "",
-      "data-tool-name": name,
-      "data-state": state,
-      "data-dynamic": dynamic || void 0,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs2("div", { "data-tool-header": "", children: [
-          /* @__PURE__ */ jsx5("span", { "data-tool-name": "", children: name }),
-          state && /* @__PURE__ */ jsxs2("span", { "data-tool-state": "", children: [
-            "(",
-            state,
-            ")"
-          ] }),
-          dynamic && /* @__PURE__ */ jsx5("span", { "data-tool-dynamic": "", children: "[dynamic]" })
-        ] }),
-        input !== void 0 && /* @__PURE__ */ jsx5("div", { "data-tool-input": "", children: /* @__PURE__ */ jsx5("pre", { children: JSON.stringify(input, null, 2) }) }),
-        errorText && /* @__PURE__ */ jsx5("div", { "data-tool-error": "", children: errorText }),
-        children
-      ]
-    }
-  );
-});
-ToolInvocation.displayName = "ToolInvocation";
-var ToolResult = React5.forwardRef(
-  ({ className, output, renderOutput, ...props }, ref) => {
-    const content = renderOutput ? renderOutput(output) : JSON.stringify(output, null, 2);
-    return /* @__PURE__ */ jsx5(
-      "div",
-      {
-        ref,
-        className,
-        "data-tool-result": "",
-        ...props,
-        children: typeof content === "string" ? /* @__PURE__ */ jsx5("pre", { children: content }) : content
-      }
-    );
-  }
-);
-ToolResult.displayName = "ToolResult";
-function isDynamicTool(tool) {
-  return tool.type === "dynamic-tool";
-}
-var ToolList = React5.forwardRef(
-  ({ className, tools, renderTool, ...props }, ref) => {
-    return /* @__PURE__ */ jsx5(
-      "div",
-      {
-        ref,
-        className,
-        "data-tool-list": "",
-        ...props,
-        children: tools.map(
-          (tool) => renderTool ? /* @__PURE__ */ jsx5(React5.Fragment, { children: renderTool(tool) }, tool.toolCallId) : /* @__PURE__ */ jsx5(
-            ToolInvocation,
-            {
-              name: tool.toolName,
-              input: tool.input,
-              state: tool.state,
-              errorText: tool.errorText,
-              dynamic: isDynamicTool(tool),
-              children: tool.output !== void 0 && /* @__PURE__ */ jsx5(ToolResult, { output: tool.output })
-            },
-            tool.toolCallId
-          )
-        )
-      }
-    );
-  }
-);
-ToolList.displayName = "ToolList";
-
-// src/ai/react/hooks/use-voice-input.ts
-import * as React6 from "react";
-function useVoiceInput(options = {}) {
-  const {
-    language,
-    continuous = false,
-    interimResults = true,
-    onTranscript,
-    onError,
-    onStart,
-    onEnd
-  } = options;
-  const [isListening, setIsListening] = React6.useState(false);
-  const [transcript, setTranscript] = React6.useState("");
-  const [error, setError] = React6.useState(null);
-  const recognitionRef = React6.useRef(null);
-  const isSupported = React6.useMemo(() => {
-    if (typeof globalThis === "undefined")
-      return false;
-    const g = globalThis;
-    return !!(g.SpeechRecognition || g.webkitSpeechRecognition);
-  }, []);
-  React6.useEffect(() => {
-    if (!isSupported)
-      return;
-    const g = globalThis;
-    const SpeechRecognitionAPI = g.SpeechRecognition || g.webkitSpeechRecognition;
-    if (!SpeechRecognitionAPI)
-      return;
-    const recognition = new SpeechRecognitionAPI();
-    recognition.continuous = continuous;
-    recognition.interimResults = interimResults;
-    if (language) {
-      recognition.lang = language;
-    }
-    recognition.onresult = (event) => {
-      let finalTranscript = "";
-      let interimTranscript = "";
-      for (let i = event.resultIndex; i < event.results.length; i++) {
-        const result = event.results[i];
-        if (!result || !result[0])
-          continue;
-        if (result.isFinal) {
-          finalTranscript += result[0].transcript;
-        } else {
-          interimTranscript += result[0].transcript;
-        }
-      }
-      const currentTranscript = finalTranscript || interimTranscript;
-      setTranscript(currentTranscript);
-      if (onTranscript) {
-        onTranscript(currentTranscript, !!finalTranscript);
-      }
-    };
-    recognition.onerror = (event) => {
-      const errorMessage = getErrorMessage(event.error);
-      setError(errorMessage);
-      setIsListening(false);
-      if (onError) {
-        onError(errorMessage);
-      }
-    };
-    recognition.onstart = () => {
-      setIsListening(true);
-      setError(null);
-      if (onStart) {
-        onStart();
-      }
-    };
-    recognition.onend = () => {
-      setIsListening(false);
-      if (onEnd) {
-        onEnd();
-      }
-    };
-    recognitionRef.current = recognition;
-    return () => {
-      recognition.abort();
-    };
-  }, [isSupported, language, continuous, interimResults, onTranscript, onError, onStart, onEnd]);
-  const start = React6.useCallback(() => {
-    if (!recognitionRef.current || isListening)
-      return;
-    setTranscript("");
-    setError(null);
-    try {
-      recognitionRef.current.start();
-    } catch {
-      console.warn("Speech recognition already started");
-    }
-  }, [isListening]);
-  const stop = React6.useCallback(() => {
-    if (!recognitionRef.current || !isListening)
-      return;
-    recognitionRef.current.stop();
-  }, [isListening]);
-  const toggle = React6.useCallback(() => {
-    if (isListening) {
-      stop();
-    } else {
-      start();
-    }
-  }, [isListening, start, stop]);
-  const clear = React6.useCallback(() => {
-    setTranscript("");
-  }, []);
-  return {
-    isSupported,
-    isListening,
-    transcript,
-    start,
-    stop,
-    toggle,
-    clear,
-    error
-  };
-}
-function getErrorMessage(error) {
-  switch (error) {
-    case "no-speech":
-      return "No speech detected. Please try again.";
-    case "audio-capture":
-      return "No microphone found. Please check your device.";
-    case "not-allowed":
-      return "Microphone permission denied. Please allow access.";
-    case "network":
-      return "Network error. Please check your connection.";
-    case "aborted":
-      return "Speech recognition was aborted.";
-    case "language-not-supported":
-      return "Language not supported.";
-    case "service-not-allowed":
-      return "Speech recognition service not allowed.";
-    default:
-      return `Speech recognition error: ${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 ESM_REACT_MARKDOWN = "https://esm.sh/react-markdown@9?external=react&target=es2022";
-var ESM_REMARK_GFM = "https://esm.sh/remark-gfm@4?target=es2022";
-var ESM_REHYPE_HIGHLIGHT = "https://esm.sh/rehype-highlight@7?target=es2022";
-var ESM_MERMAID = "https://esm.sh/mermaid@11";
-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) {
-    const dynamicImport = new Function("url", "return import(url)");
-    mermaidPromise = dynamicImport(ESM_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 dynamicImport = new Function("url", "return import(url)");
-        const [rmModule, gfmModule, highlightModule] = await Promise.all([
-          dynamicImport(ESM_REACT_MARKDOWN),
-          dynamicImport(ESM_REMARK_GFM),
-          dynamicImport(ESM_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 { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
-function CircleIcon({ className }) {
-  return /* @__PURE__ */ jsx7(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx7("circle", { cx: "12", cy: "12", r: "10" })
-    }
-  );
-}
-function ClockIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx7("polyline", { points: "12 6 12 12 16 14" })
-      ]
-    }
-  );
-}
-function CheckCircleIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
-        /* @__PURE__ */ jsx7("polyline", { points: "22 4 12 14.01 9 11.01" })
-      ]
-    }
-  );
-}
-function XCircleIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx7("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
-        /* @__PURE__ */ jsx7("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
-      ]
-    }
-  );
-}
-function WrenchIcon({ className }) {
-  return /* @__PURE__ */ jsx7(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx7("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" })
-    }
-  );
-}
-function ChevronDownIcon({ className }) {
-  return /* @__PURE__ */ jsx7(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx7("polyline", { points: "6 9 12 15 18 9" })
-    }
-  );
-}
-function BrainIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("path", { d: "M12 5a3 3 0 1 0-5.997.125 4 4 0 0 0-2.526 5.77 4 4 0 0 0 .556 6.588A4 4 0 1 0 12 18Z" }),
-        /* @__PURE__ */ jsx7("path", { d: "M12 5a3 3 0 1 1 5.997.125 4 4 0 0 1 2.526 5.77 4 4 0 0 1-.556 6.588A4 4 0 1 1 12 18Z" }),
-        /* @__PURE__ */ jsx7("path", { d: "M15 13a4.5 4.5 0 0 1-3-4 4.5 4.5 0 0 1-3 4" }),
-        /* @__PURE__ */ jsx7("path", { d: "M17.599 6.5a3 3 0 0 0 .399-1.375" }),
-        /* @__PURE__ */ jsx7("path", { d: "M6.003 5.125A3 3 0 0 0 6.401 6.5" }),
-        /* @__PURE__ */ jsx7("path", { d: "M3.477 10.896a4 4 0 0 1 .585-.396" }),
-        /* @__PURE__ */ jsx7("path", { d: "M19.938 10.5a4 4 0 0 1 .585.396" }),
-        /* @__PURE__ */ jsx7("path", { d: "M6 18a4 4 0 0 1-1.967-.516" }),
-        /* @__PURE__ */ jsx7("path", { d: "M19.967 17.484A4 4 0 0 1 18 18" })
-      ]
-    }
-  );
-}
-function MessageSquareIcon({ className }) {
-  return /* @__PURE__ */ jsx7(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx7("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" })
-    }
-  );
-}
-function ArrowDownIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
-        /* @__PURE__ */ jsx7("polyline", { points: "19 12 12 19 5 12" })
-      ]
-    }
-  );
-}
-function RefreshCwIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
-        /* @__PURE__ */ jsx7("path", { d: "M21 3v5h-5" }),
-        /* @__PURE__ */ jsx7("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
-        /* @__PURE__ */ jsx7("path", { d: "M8 16H3v5" })
-      ]
-    }
-  );
-}
-function CopyIcon({ className }) {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx7("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-        /* @__PURE__ */ jsx7("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
-      ]
-    }
-  );
-}
-function CheckIcon({ className }) {
-  return /* @__PURE__ */ jsx7(
-    "svg",
-    {
-      className: cn("size-4", className),
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx7("polyline", { points: "20 6 9 17 4 12" })
-    }
-  );
-}
-function Shimmer({ children }) {
-  return /* @__PURE__ */ jsx7("span", { className: "relative inline-block overflow-hidden", children: /* @__PURE__ */ jsx7("span", { className: "animate-pulse", children }) });
-}
-function ReasoningCard({ text, isStreaming = false }) {
-  const [isOpen, setIsOpen] = React8.useState(true);
-  React8.useEffect(() => {
-    if (!isStreaming && isOpen) {
-      const timer = setTimeout(() => {
-        setIsOpen(false);
-      }, 1e3);
-      return () => clearTimeout(timer);
-    }
-  }, [isStreaming, isOpen]);
-  return /* @__PURE__ */ jsxs4("div", { className: "not-prose mb-4", children: [
-    /* @__PURE__ */ jsxs4(
-      "button",
-      {
-        type: "button",
-        onClick: () => setIsOpen(!isOpen),
-        className: "flex w-full items-center gap-2 text-muted-foreground text-sm transition-colors hover:text-foreground",
-        children: [
-          /* @__PURE__ */ jsx7(BrainIcon, { className: "size-4" }),
-          isStreaming ? /* @__PURE__ */ jsx7(Shimmer, { children: "Thinking..." }) : /* @__PURE__ */ jsx7("span", { children: "Thought process" }),
-          /* @__PURE__ */ jsx7(
-            ChevronDownIcon,
-            {
-              className: cn(
-                "size-4 transition-transform",
-                isOpen && "rotate-180"
-              )
-            }
-          )
-        ]
-      }
-    ),
-    isOpen && /* @__PURE__ */ jsx7("div", { className: "mt-4 text-sm text-muted-foreground border-l-2 border-muted pl-4 ml-2", children: /* @__PURE__ */ jsx7(Markdown, { className: "text-sm", children: text }) })
-  ] });
-}
-function Suggestion({ suggestion, onClick, className, icon }) {
-  return /* @__PURE__ */ jsxs4(
-    "button",
-    {
-      type: "button",
-      onClick: () => onClick?.(suggestion),
-      className: cn(
-        "group flex items-start gap-3 rounded-xl border border-border bg-background p-4 text-left text-sm text-foreground transition-all hover:bg-muted hover:border-muted-foreground/20",
-        className
-      ),
-      children: [
-        icon && /* @__PURE__ */ jsx7("span", { className: "shrink-0 text-muted-foreground group-hover:text-foreground transition-colors", children: icon }),
-        /* @__PURE__ */ jsx7("span", { className: "line-clamp-2", children: suggestion })
-      ]
-    }
-  );
-}
-function Suggestions({ children, className, layout = "grid" }) {
-  if (layout === "horizontal") {
-    return /* @__PURE__ */ jsx7("div", { className: cn("flex gap-2 overflow-x-auto pb-2 scrollbar-hide", className), children });
-  }
-  return /* @__PURE__ */ jsx7("div", { className: cn("grid grid-cols-2 gap-3 max-w-2xl mx-auto", className), children });
-}
-function ConversationEmptyState({
-  icon,
-  title = "What can I help with?",
-  description,
-  children,
-  className
-}) {
-  return /* @__PURE__ */ jsxs4("div", { className: cn("flex flex-col items-center justify-center text-center", className), children: [
-    icon && /* @__PURE__ */ jsx7("div", { className: "mb-4 text-muted-foreground", children: icon }),
-    /* @__PURE__ */ jsx7("h1", { className: "text-3xl font-semibold text-foreground", children: title }),
-    description && /* @__PURE__ */ jsx7("p", { className: "mt-2 text-base text-muted-foreground max-w-md", children: description }),
-    children
-  ] });
-}
-function ConversationScrollButton({
-  onClick,
-  visible = true,
-  className
-}) {
-  if (!visible)
-    return null;
-  return /* @__PURE__ */ jsx7(
-    "button",
-    {
-      type: "button",
-      onClick,
-      className: cn(
-        "absolute bottom-4 left-1/2 -translate-x-1/2 rounded-full border border-border bg-background p-2 shadow-lg transition-all hover:bg-muted",
-        className
-      ),
-      children: /* @__PURE__ */ jsx7(ArrowDownIcon, { className: "size-4" })
-    }
-  );
-}
-function MessageActions({ content, className }) {
-  const [copied, setCopied] = React8.useState(false);
-  const handleCopy = async () => {
-    try {
-      await navigator.clipboard.writeText(content);
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2e3);
-    } catch {
-      const textarea = document.createElement("textarea");
-      textarea.value = content;
-      document.body.appendChild(textarea);
-      textarea.select();
-      document.execCommand("copy");
-      document.body.removeChild(textarea);
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2e3);
-    }
-  };
-  return /* @__PURE__ */ jsx7("div", { className: cn("flex items-center gap-1 mt-2", className), children: /* @__PURE__ */ jsx7(
-    "button",
-    {
-      type: "button",
-      onClick: handleCopy,
-      className: "inline-flex items-center gap-1 px-2 py-1 text-xs text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors",
-      title: copied ? "Copied!" : "Copy to clipboard",
-      children: copied ? /* @__PURE__ */ jsxs4(Fragment4, { children: [
-        /* @__PURE__ */ jsx7(CheckIcon, { className: "size-3" }),
-        /* @__PURE__ */ jsx7("span", { children: "Copied" })
-      ] }) : /* @__PURE__ */ jsxs4(Fragment4, { children: [
-        /* @__PURE__ */ jsx7(CopyIcon, { className: "size-3" }),
-        /* @__PURE__ */ jsx7("span", { children: "Copy" })
-      ] })
-    }
-  ) });
-}
-function ToolStatusBadge({ state }) {
-  const labels = {
-    "input-streaming": "Pending",
-    "input-available": "Running",
-    "approval-requested": "Awaiting Approval",
-    "approval-responded": "Responded",
-    "output-available": "Completed",
-    "output-error": "Error",
-    "output-denied": "Denied",
-    // Legacy states
-    "call": "Running",
-    "partial-call": "Running",
-    "result": "Completed",
-    "error": "Error"
-  };
-  const icons = {
-    "input-streaming": /* @__PURE__ */ jsx7(CircleIcon, { className: "size-3.5" }),
-    "input-available": /* @__PURE__ */ jsx7(ClockIcon, { className: "size-3.5 animate-pulse" }),
-    "approval-requested": /* @__PURE__ */ jsx7(ClockIcon, { className: "size-3.5 text-yellow-600" }),
-    "approval-responded": /* @__PURE__ */ jsx7(CheckCircleIcon, { className: "size-3.5 text-blue-600" }),
-    "output-available": /* @__PURE__ */ jsx7(CheckCircleIcon, { className: "size-3.5 text-green-600" }),
-    "output-error": /* @__PURE__ */ jsx7(XCircleIcon, { className: "size-3.5 text-red-600" }),
-    "output-denied": /* @__PURE__ */ jsx7(XCircleIcon, { className: "size-3.5 text-orange-600" }),
-    // Legacy states
-    "call": /* @__PURE__ */ jsx7(ClockIcon, { className: "size-3.5 animate-pulse" }),
-    "partial-call": /* @__PURE__ */ jsx7(ClockIcon, { className: "size-3.5 animate-pulse" }),
-    "result": /* @__PURE__ */ jsx7(CheckCircleIcon, { className: "size-3.5 text-green-600" }),
-    "error": /* @__PURE__ */ jsx7(XCircleIcon, { className: "size-3.5 text-red-600" })
-  };
-  return /* @__PURE__ */ jsxs4("span", { className: "inline-flex items-center gap-1.5 rounded-full bg-secondary px-2.5 py-0.5 text-xs font-medium text-secondary-foreground border border-border", children: [
-    icons[state] || /* @__PURE__ */ jsx7(CircleIcon, { className: "size-3.5" }),
-    labels[state] || state
-  ] });
-}
-function formatJsonWithHighlight(obj) {
-  if (obj === void 0 || obj === null)
-    return null;
-  const jsonStr = typeof obj === "string" ? obj : JSON.stringify(obj, null, 2);
-  const highlighted = jsonStr.replace(/"([^"]+)":/g, '<span class="text-green-600 dark:text-green-400">"$1"</span>:').replace(/: "([^"]*)"/g, ': <span class="text-amber-600 dark:text-amber-400">"$1"</span>').replace(/: (\d+)/g, ': <span class="text-blue-600 dark:text-blue-400">$1</span>').replace(/: (true|false)/g, ': <span class="text-purple-600 dark:text-purple-400">$1</span>');
-  return /* @__PURE__ */ jsx7(
-    "pre",
-    {
-      className: "text-sm font-mono whitespace-pre-wrap",
-      dangerouslySetInnerHTML: { __html: highlighted }
-    }
-  );
-}
-function renderOutputAsTable(output) {
-  if (!Array.isArray(output) || output.length === 0)
-    return null;
-  const firstItem = output[0];
-  if (typeof firstItem !== "object" || firstItem === null)
-    return null;
-  const keys = Object.keys(firstItem);
-  if (keys.length === 0)
-    return null;
-  return /* @__PURE__ */ jsx7("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs4("table", { className: "min-w-full text-sm", children: [
-    /* @__PURE__ */ jsx7("thead", { children: /* @__PURE__ */ jsx7("tr", { className: "border-b border-neutral-200 dark:border-neutral-700", children: keys.map((key) => /* @__PURE__ */ jsx7(
-      "th",
-      {
-        className: "px-4 py-2 text-left font-semibold text-neutral-900 dark:text-neutral-100",
-        children: key.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase())
-      },
-      key
-    )) }) }),
-    /* @__PURE__ */ jsx7("tbody", { children: output.map((row, i) => /* @__PURE__ */ jsx7("tr", { className: "border-b border-neutral-100 dark:border-neutral-800", children: keys.map((key) => /* @__PURE__ */ jsx7("td", { className: "px-4 py-2 text-neutral-700 dark:text-neutral-300", children: String(row[key] ?? "") }, key)) }, i)) })
-  ] }) });
-}
-function ToolCallCard({ tool }) {
-  const [isExpanded, setIsExpanded] = React8.useState(true);
-  const tableOutput = tool.output !== void 0 ? renderOutputAsTable(tool.output) : null;
-  return /* @__PURE__ */ jsxs4("div", { className: "not-prose w-full rounded-md border border-border bg-card", children: [
-    /* @__PURE__ */ jsxs4(
-      "button",
-      {
-        type: "button",
-        onClick: () => setIsExpanded(!isExpanded),
-        className: "group flex w-full items-center justify-between gap-4 p-3 hover:bg-muted/50 transition-colors",
-        children: [
-          /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx7(WrenchIcon, { className: "size-4 text-muted-foreground" }),
-            /* @__PURE__ */ jsx7("span", { className: "font-medium text-sm text-foreground", children: tool.toolName }),
-            /* @__PURE__ */ jsx7(ToolStatusBadge, { state: tool.state })
-          ] }),
-          /* @__PURE__ */ jsx7(
-            ChevronDownIcon,
-            {
-              className: cn(
-                "size-4 text-muted-foreground transition-transform",
-                isExpanded && "rotate-180"
-              )
-            }
-          )
-        ]
-      }
-    ),
-    isExpanded && /* @__PURE__ */ jsxs4("div", { className: "border-t border-border", children: [
-      tool.input !== void 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-2 overflow-hidden p-4", children: [
-        /* @__PURE__ */ jsx7("h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: "Parameters" }),
-        /* @__PURE__ */ jsx7("div", { className: "rounded-md bg-muted/50 p-3", children: formatJsonWithHighlight(tool.input) })
-      ] }),
-      tool.output !== void 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-2 p-4 border-t border-border", children: [
-        /* @__PURE__ */ jsx7("h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: "Result" }),
-        /* @__PURE__ */ jsx7("div", { className: "overflow-x-auto rounded-md bg-muted/50 text-foreground", children: tableOutput || /* @__PURE__ */ jsx7("div", { className: "p-3", children: formatJsonWithHighlight(tool.output) }) })
-      ] }),
-      tool.errorText && /* @__PURE__ */ jsxs4("div", { className: "space-y-2 p-4 border-t border-border", children: [
-        /* @__PURE__ */ jsx7("h4", { className: "font-medium text-destructive text-xs uppercase tracking-wide", children: "Error" }),
-        /* @__PURE__ */ jsx7("div", { className: "rounded-md bg-destructive/10 text-destructive p-3 text-sm", children: tool.errorText })
-      ] })
-    ] })
-  ] });
-}
-function getTextContent(message) {
-  return message.parts.filter((p) => p.type === "text").map((p) => p.text).join("");
-}
-function isToolPart(part) {
-  return part.type.startsWith("tool-") && part.type !== "tool-result" || part.type === "dynamic-tool";
-}
-function isReasoningPart(part) {
-  return part.type === "reasoning";
-}
-function groupPartsInOrder(parts) {
-  const groups = [];
-  let currentTextGroup = [];
-  for (const part of parts) {
-    if (part.type === "text") {
-      currentTextGroup.push(part.text);
-    } else if (isToolPart(part)) {
-      if (currentTextGroup.length > 0) {
-        groups.push({ type: "text", content: currentTextGroup.join("") });
-        currentTextGroup = [];
-      }
-      groups.push({ type: "tool", tool: part });
-    } else if (isReasoningPart(part)) {
-      if (currentTextGroup.length > 0) {
-        groups.push({ type: "text", content: currentTextGroup.join("") });
-        currentTextGroup = [];
-      }
-      groups.push({
-        type: "reasoning",
-        text: part.text,
-        isStreaming: part.state === "streaming"
-      });
-    }
-  }
-  if (currentTextGroup.length > 0) {
-    groups.push({ type: "text", content: currentTextGroup.join("") });
-  }
-  return groups;
-}
-var Chat = React8.forwardRef(
-  ({
-    messages,
-    input,
-    onChange,
-    handleInputChange,
-    onSubmit,
-    handleSubmit,
-    stop,
-    reload,
-    enableVoice = false,
-    onVoice,
-    setInput,
-    isLoading,
-    error,
-    placeholder = "Type a message...",
-    maxHeight = "100%",
-    className,
-    theme: userTheme,
-    renderMessage,
-    renderTool,
-    multiline = false,
-    suggestions,
-    onSuggestionClick,
-    emptyState,
-    showScrollButton = false,
-    showMessageActions = true
-  }, ref) => {
-    const theme = mergeThemes(defaultChatTheme, userTheme);
-    const messagesEndRef = React8.useRef(null);
-    const inputChangeHandler = onChange || handleInputChange || (() => {
-    });
-    const submitHandler = onSubmit || handleSubmit;
-    const voice = useVoiceInput({
-      onTranscript: (transcript, isFinal) => {
-        if (setInput && isFinal) {
-          setInput(transcript);
-        }
-      }
-    });
-    const voiceHandler = React8.useMemo(() => {
-      if (onVoice)
-        return onVoice;
-      if (enableVoice && voice.isSupported && setInput) {
-        return voice.toggle;
-      }
-      return void 0;
-    }, [onVoice, enableVoice, voice.isSupported, voice.toggle, setInput]);
-    React8.useEffect(() => {
-      messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
-    }, [messages]);
-    return /* @__PURE__ */ jsxs4(
-      ChatContainer,
-      {
-        ref,
-        className: cn(theme.container, className),
-        style: { maxHeight },
-        children: [
-          /* @__PURE__ */ jsxs4(MessageList, { className: "flex-1 min-h-0 overflow-y-auto relative", children: [
-            messages.length === 0 ? /* @__PURE__ */ jsxs4("div", { className: "flex flex-col items-center justify-center h-full px-4", children: [
-              /* @__PURE__ */ jsx7("div", { className: "flex-1" }),
-              /* @__PURE__ */ jsx7(
-                ConversationEmptyState,
-                {
-                  icon: emptyState?.icon || /* @__PURE__ */ jsx7(MessageSquareIcon, { className: "size-10" }),
-                  title: emptyState?.title || "What can I help with?",
-                  description: emptyState?.description
-                }
-              ),
-              suggestions && suggestions.length > 0 && /* @__PURE__ */ jsx7("div", { className: "w-full max-w-2xl mt-6 mb-8", children: /* @__PURE__ */ jsx7(Suggestions, { layout: "grid", children: suggestions.map((suggestion) => /* @__PURE__ */ jsx7(
-                Suggestion,
-                {
-                  suggestion,
-                  onClick: onSuggestionClick
-                },
-                suggestion
-              )) }) }),
-              /* @__PURE__ */ jsx7("div", { className: "flex-1" })
-            ] }) : /* @__PURE__ */ jsxs4("div", { className: "max-w-2xl mx-auto px-4 py-4 space-y-2", children: [
-              messages.map((msg) => {
-                if (msg.role === "user") {
-                  const content = getTextContent(msg);
-                  return renderMessage ? /* @__PURE__ */ jsx7(React8.Fragment, { children: renderMessage(msg) }, msg.id) : /* @__PURE__ */ jsx7(
-                    MessageItem,
-                    {
-                      role: msg.role,
-                      className: cn("flex", "justify-end"),
-                      children: /* @__PURE__ */ jsx7("div", { className: theme.message?.[msg.role] || theme.message?.user, children: /* @__PURE__ */ jsx7("p", { className: "whitespace-pre-wrap text-[15px] leading-relaxed", children: content }) })
-                    },
-                    msg.id
-                  );
-                }
-                const partGroups = groupPartsInOrder(msg.parts);
-                const textContent = getTextContent(msg);
-                return renderMessage ? /* @__PURE__ */ jsx7(React8.Fragment, { children: renderMessage(msg) }, msg.id) : /* @__PURE__ */ jsx7(
-                  MessageItem,
-                  {
-                    role: msg.role,
-                    className: cn("flex", "justify-start"),
-                    children: /* @__PURE__ */ jsxs4("div", { className: theme.message?.[msg.role] || theme.message?.assistant, children: [
-                      partGroups.map((group, index) => {
-                        if (group.type === "text") {
-                          return /* @__PURE__ */ jsx7(
-                            Markdown,
-                            {
-                              className: "text-[15px] leading-relaxed",
-                              children: group.content
-                            },
-                            `text-${index}`
-                          );
-                        }
-                        if (group.type === "reasoning") {
-                          return /* @__PURE__ */ jsx7(
-                            ReasoningCard,
-                            {
-                              text: group.text,
-                              isStreaming: group.isStreaming
-                            },
-                            `reasoning-${index}`
-                          );
-                        }
-                        return /* @__PURE__ */ jsx7("div", { className: "my-3", children: renderTool ? renderTool(group.tool) : /* @__PURE__ */ jsx7(ToolCallCard, { tool: group.tool }) }, group.tool.toolCallId);
-                      }),
-                      showMessageActions && textContent && /* @__PURE__ */ jsx7(MessageActions, { content: textContent })
-                    ] })
-                  },
-                  msg.id
-                );
-              }),
-              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__ */ jsx7("div", { ref: messagesEndRef })
-            ] }),
-            showScrollButton && /* @__PURE__ */ jsx7(
-              ConversationScrollButton,
-              {
-                onClick: () => messagesEndRef.current?.scrollIntoView({ behavior: "smooth" })
-              }
-            )
-          ] }),
-          error && /* @__PURE__ */ jsxs4("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 flex items-center justify-between gap-3", children: [
-            /* @__PURE__ */ jsx7("span", { children: error.message }),
-            reload && /* @__PURE__ */ jsxs4(
-              "button",
-              {
-                type: "button",
-                onClick: reload,
-                className: "inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-red-600 dark:text-red-400 bg-red-100 dark:bg-red-900/40 hover:bg-red-200 dark:hover:bg-red-900/60 rounded-lg transition-colors",
-                children: [
-                  /* @__PURE__ */ jsx7(RefreshCwIcon, { className: "size-3.5" }),
-                  "Retry"
-                ]
-              }
-            )
-          ] }),
-          /* @__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__ */ jsxs4("div", { className: "flex gap-2 items-center", children: [
-                /* @__PURE__ */ jsx7(
-                  InputBox,
-                  {
-                    value: voice.isListening ? voice.transcript || input : input,
-                    onChange: inputChangeHandler,
-                    placeholder: voice.isListening ? "Listening..." : placeholder,
-                    disabled: isLoading || voice.isListening,
-                    multiline,
-                    className: theme.input
-                  }
-                ),
-                /* @__PURE__ */ jsx7(
-                  SubmitButton,
-                  {
-                    isLoading: isLoading || voice.isListening,
-                    hasInput: !!input.trim(),
-                    onStop: voice.isListening ? voice.stop : stop,
-                    onVoice: voiceHandler,
-                    disabled: !input.trim(),
-                    className: theme.button
-                  }
-                )
-              ] })
-            }
-          ) })
-        ]
-      }
-    );
-  }
-);
-Chat.displayName = "Chat";
-var ChatHeader = React8.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx7(
-    "div",
-    {
-      ref,
-      className: cn(
-        "border-b border-gray-200 dark:border-gray-800 p-4 bg-gray-50 dark:bg-gray-900",
-        className
-      ),
-      ...props,
-      children
-    }
-  );
-});
-ChatHeader.displayName = "ChatHeader";
-var ChatMessages = MessageList;
-ChatMessages.displayName = "ChatMessages";
-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,
-      className: cn(defaultChatTheme.input, className),
-      ...props
-    }
-  ) }) });
-});
-ChatInput.displayName = "ChatInput";
-var ChatFooter = React8.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx7(
-    "div",
-    {
-      ref,
-      className: cn(
-        "border-t border-gray-200 dark:border-gray-800 p-4 text-sm text-gray-500",
-        className
-      ),
-      ...props,
-      children
-    }
-  );
-});
-ChatFooter.displayName = "ChatFooter";
-var ChatComponents = Object.assign(Chat, {
-  Header: ChatHeader,
-  Messages: ChatMessages,
-  Input: ChatInput,
-  Footer: ChatFooter
-});
-
-// src/ai/react/components/agent-card.tsx
-import * as React9 from "react";
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
-var AgentCard = React9.forwardRef(
-  ({
-    messages,
-    toolCalls = [],
-    status,
-    thinking,
-    className,
-    theme: userTheme,
-    renderTool
-  }, ref) => {
-    const theme = mergeThemes(defaultAgentTheme, userTheme);
-    return /* @__PURE__ */ jsxs5(AgentContainer, { ref, className: cn(theme.container, className), children: [
-      /* @__PURE__ */ jsx8(
-        AgentStatus,
-        {
-          status,
-          className: cn(theme.status, getStatusColor(status))
-        }
-      ),
-      thinking && /* @__PURE__ */ jsxs5(ThinkingIndicator, { className: theme.thinking, children: [
-        /* @__PURE__ */ jsx8("span", { className: "font-semibold", children: "Thinking:" }),
-        thinking
-      ] }),
-      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__ */ jsxs5(
-              ToolInvocation,
-              {
-                name: tool.name,
-                args: tool.args,
-                status: tool.status,
-                className: theme.tool,
-                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
-                  ] })
-                ]
-              }
-            ))
-          }
-        )
-      ] }),
-      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__ */ jsxs5("span", { className: "font-semibold capitalize text-neutral-900 dark:text-neutral-100", children: [
-                msg.role,
-                ":"
-              ] }),
-              /* @__PURE__ */ jsxs5("span", { className: "text-neutral-600 dark:text-neutral-400 ml-1", children: [
-                msg.content.substring(0, 200),
-                "..."
-              ] })
-            ]
-          },
-          msg.id
-        )) })
-      ] })
-    ] });
-  }
-);
-AgentCard.displayName = "AgentCard";
-function getStatusColor(status) {
-  switch (status) {
-    case "idle":
-      return "bg-neutral-100 text-neutral-700 dark:bg-neutral-800 dark:text-neutral-300";
-    case "thinking":
-      return "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-300";
-    case "tool_execution":
-      return "bg-violet-100 text-violet-700 dark:bg-violet-900/30 dark:text-violet-300";
-    case "streaming":
-      return "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-300";
-    case "completed":
-      return "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-300";
-    case "error":
-      return "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-300";
-    default:
-      return "bg-neutral-100 text-neutral-700 dark:bg-neutral-800 dark:text-neutral-300";
-  }
-}
-
-// src/ai/react/components/message.tsx
-import * as React10 from "react";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
-function getTextFromParts(parts) {
-  return parts.filter((p) => p.type === "text").map((p) => p.text).join("");
-}
-var Message = React10.forwardRef(
-  ({
-    message,
-    className,
-    theme: userTheme,
-    showRole = false,
-    showTimestamp = false,
-    renderToolCall,
-    renderDynamicTool,
-    renderReasoning
-  }, ref) => {
-    const theme = mergeThemes(defaultChatTheme, userTheme);
-    return /* @__PURE__ */ jsx9(
-      MessageItem,
-      {
-        ref,
-        role: message.role,
-        className: cn(
-          "flex",
-          message.role === "user" ? "justify-end" : "justify-start",
-          className
-        ),
-        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 }),
-          message.parts.map((part, index) => {
-            const key = `${message.id}-part-${index}`;
-            switch (part.type) {
-              case "text":
-                return /* @__PURE__ */ jsx9(MessageContent, { children: part.text }, key);
-              case "reasoning":
-                if (renderReasoning) {
-                  return /* @__PURE__ */ jsx9(React10.Fragment, { children: renderReasoning(part) }, key);
-                }
-                return /* @__PURE__ */ jsx9("div", { className: "text-sm italic opacity-70 my-2 pl-2 border-l-2", children: part.text }, key);
-              case "dynamic-tool":
-                if (renderDynamicTool) {
-                  return /* @__PURE__ */ jsx9(React10.Fragment, { children: renderDynamicTool(part) }, key);
-                }
-                return /* @__PURE__ */ jsxs6("div", { className: "text-xs bg-blue-50 rounded p-2 my-2", children: [
-                  /* @__PURE__ */ jsx9("span", { className: "font-mono", children: part.toolName }),
-                  /* @__PURE__ */ jsxs6("span", { className: "ml-2 text-blue-500", children: [
-                    "[dynamic: ",
-                    part.state,
-                    "]"
-                  ] }),
-                  part.errorText && /* @__PURE__ */ jsx9("div", { className: "text-red-600 mt-1", children: part.errorText })
-                ] }, key);
-              default:
-                if (part.type.startsWith("tool-") && "toolCallId" in part) {
-                  const toolPart = part;
-                  if (renderToolCall) {
-                    return /* @__PURE__ */ jsx9(React10.Fragment, { children: renderToolCall(toolPart) }, key);
-                  }
-                  return /* @__PURE__ */ jsxs6("div", { className: "text-xs bg-gray-100 rounded p-2 my-2", children: [
-                    /* @__PURE__ */ jsx9("span", { className: "font-mono", children: toolPart.toolName }),
-                    /* @__PURE__ */ jsxs6("span", { className: "ml-2 text-gray-500", children: [
-                      "[",
-                      toolPart.state,
-                      "]"
-                    ] }),
-                    toolPart.errorText && /* @__PURE__ */ jsx9("div", { className: "text-red-600 mt-1", children: toolPart.errorText })
-                  ] }, key);
-                }
-                return null;
-            }
-          }),
-          showTimestamp && message.createdAt && /* @__PURE__ */ jsx9("div", { className: "text-xs opacity-60 mt-1", children: new Date(message.createdAt).toLocaleTimeString() })
-        ] })
-      }
-    );
-  }
-);
-Message.displayName = "Message";
-var StreamingMessage = React10.forwardRef(({ parts, showCursor = true, className, theme: userTheme }, ref) => {
-  const theme = mergeThemes(defaultChatTheme, userTheme);
-  const textContent = getTextFromParts(parts);
-  return /* @__PURE__ */ jsx9(
-    MessageItem,
-    {
-      ref,
-      role: "assistant",
-      className: cn("flex justify-start", className),
-      children: /* @__PURE__ */ jsx9("div", { className: theme.message?.assistant, children: /* @__PURE__ */ jsxs6(MessageContent, { children: [
-        textContent,
-        showCursor && /* @__PURE__ */ jsx9("span", { className: "inline-block w-1 h-4 bg-current ml-1 animate-pulse" })
-      ] }) })
-    }
-  );
-});
-StreamingMessage.displayName = "StreamingMessage";
-
-// src/ai/react/components/error-boundary.tsx
-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.state = { hasError: false, error: null };
-  }
-  static getDerivedStateFromError(error) {
-    return { hasError: true, error };
-  }
-  componentDidCatch(error, errorInfo) {
-    console.error("[AIErrorBoundary] Caught error:", error, errorInfo);
-    if (this.props.onError) {
-      this.props.onError(error, errorInfo);
-    }
-  }
-  reset = () => {
-    this.setState({ hasError: false, error: null });
-  };
-  render() {
-    if (this.state.hasError && this.state.error) {
-      if (this.props.fallback) {
-        if (typeof this.props.fallback === "function") {
-          return this.props.fallback(this.state.error, this.reset);
-        }
-        return this.props.fallback;
-      }
-      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__ */ 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__ */ jsx10(
-                  "path",
-                  {
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    strokeWidth: 2,
-                    d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-                  }
-                )
-              }
-            ) }),
-            /* @__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",
-                  onClick: this.reset,
-                  className: "mt-4 px-5 py-2.5 text-sm font-medium text-white bg-red-500 hover:bg-red-600 active:scale-[0.98] rounded-full transition-all",
-                  children: "Try Again"
-                }
-              )
-            ] })
-          ] })
-        }
-      );
-    }
-    return this.props.children;
-  }
-};
-function useAIErrorHandler() {
-  const [error, setError] = React11.useState(null);
-  const handleError = React11.useCallback((error2) => {
-    console.error("[useAIErrorHandler] Error:", error2);
-    setError(error2);
-  }, []);
-  const clearError = React11.useCallback(() => {
-    setError(null);
-  }, []);
-  return {
-    error,
-    handleError,
-    clearError,
-    hasError: error !== null
-  };
-}
-export {
-  AIErrorBoundary,
-  AgentCard,
-  Chat,
-  ChatComponents,
-  Markdown,
-  Message,
-  StreamingMessage,
-  cn,
-  defaultAgentTheme,
-  defaultChatTheme,
-  mergeThemes,
-  useAIErrorHandler
-};
-//# sourceMappingURL=components.js.map