@oakkles/llm-ui-react 0.1.1

package/dist/index.js

@@ -0,0 +1,2518 @@
+import { createContext, useState, useEffect, useRef, useMemo, useCallback, useContext, isValidElement } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+import { useShikiHighlighter } from 'react-shiki';
+
+// src/components/bubble/BubblePrimitive.tsx
+var statusTextMap = {
+  sending: "\u53D1\u9001\u4E2D",
+  sent: "\u5DF2\u53D1\u9001",
+  error: "\u53D1\u9001\u5931\u8D25"
+};
+function formatTimestamp(timestamp) {
+  if (typeof timestamp === "string") {
+    return timestamp;
+  }
+  return timestamp.toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function BubblePrimitive({
+  role,
+  content,
+  avatar,
+  timestamp,
+  status,
+  loading,
+  children,
+  actions,
+  className,
+  style
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className,
+      style,
+      "data-role": role,
+      "data-status": status,
+      "data-loading": loading,
+      "data-has-actions": actions ? "" : void 0,
+      children: [
+        avatar && /* @__PURE__ */ jsx("div", { className: "llm-bubble__avatar", "data-slot": "bubble-avatar", children: avatar }),
+        /* @__PURE__ */ jsxs("div", { className: "llm-bubble__body", "data-slot": "bubble-body", children: [
+          (children ?? content) && /* @__PURE__ */ jsx("div", { className: "llm-bubble__content", "data-slot": "bubble-content", children: children ?? content }),
+          (timestamp || status || loading) && /* @__PURE__ */ jsxs("div", { className: "llm-bubble__meta", "data-slot": "bubble-meta", children: [
+            timestamp && /* @__PURE__ */ jsx("span", { className: "llm-bubble__time", "data-slot": "bubble-time", children: formatTimestamp(timestamp) }),
+            status && /* @__PURE__ */ jsx("span", { className: "llm-bubble__status", "data-slot": "bubble-status", children: statusTextMap[status] }),
+            loading && /* @__PURE__ */ jsx("span", { className: "llm-bubble__loading", "data-slot": "bubble-loading", children: "\u601D\u8003\u4E2D" })
+          ] }),
+          actions ? /* @__PURE__ */ jsx("div", { className: "llm-bubble__actions", "data-slot": "bubble-actions", children: actions }) : null
+        ] })
+      ]
+    }
+  );
+}
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Bubble({ className, ...props }) {
+  return /* @__PURE__ */ jsx(BubblePrimitive, { className: cn("llm-bubble", className), ...props });
+}
+function getLanguageLabel(language) {
+  const normalizedLanguage = language.toLowerCase();
+  const labels = {
+    astro: "Astro",
+    bash: "Bash",
+    bat: "Batch",
+    c: "C",
+    cpp: "C++",
+    "c++": "C++",
+    csharp: "C#",
+    cs: "C#",
+    css: "CSS",
+    dart: "Dart",
+    diff: "Diff",
+    docker: "Dockerfile",
+    dockerfile: "Dockerfile",
+    elixir: "Elixir",
+    ex: "Elixir",
+    go: "Go",
+    graphql: "GraphQL",
+    groovy: "Groovy",
+    html: "HTML",
+    java: "Java",
+    javascript: "JavaScript",
+    js: "JavaScript",
+    json: "JSON",
+    jsonc: "JSONC",
+    jsx: "JavaScript JSX",
+    kotlin: "Kotlin",
+    kt: "Kotlin",
+    less: "Less",
+    lua: "Lua",
+    markdown: "Markdown",
+    md: "Markdown",
+    objectivec: "Objective-C",
+    objc: "Objective-C",
+    perl: "Perl",
+    php: "PHP",
+    plaintext: "Plain Text",
+    powershell: "PowerShell",
+    prisma: "Prisma",
+    ps1: "PowerShell",
+    py: "Python",
+    python: "Python",
+    r: "R",
+    rb: "Ruby",
+    ruby: "Ruby",
+    rust: "Rust",
+    rs: "Rust",
+    sass: "Sass",
+    scala: "Scala",
+    scss: "SCSS",
+    shell: "Shell",
+    sh: "Shell",
+    sql: "SQL",
+    svelte: "Svelte",
+    swift: "Swift",
+    text: "Plain Text",
+    toml: "TOML",
+    ts: "TypeScript",
+    tsx: "TypeScript TSX",
+    typescript: "TypeScript",
+    vue: "Vue",
+    wasm: "WebAssembly",
+    xml: "XML",
+    yaml: "YAML",
+    yml: "YAML",
+    zig: "Zig"
+  };
+  return labels[normalizedLanguage] ?? language;
+}
+function CodeIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-code-highlighter__code-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m9 18-6-6 6-6",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m15 6 6 6-6 6",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+function CopyIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-code-highlighter__copy-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            height: "13",
+            rx: "2",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2",
+            width: "13",
+            x: "9",
+            y: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M5 9H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2-2v-1",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+var codeTheme = { light: "github-light", dark: "github-dark" };
+function CheckIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-code-highlighter__copy-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m20 6-11 11-5-5",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      )
+    }
+  );
+}
+function CodeHighlighterPrimitive({
+  code,
+  copyable = true,
+  language = "text",
+  showLineNumbers = false,
+  startingLineNumber = 1,
+  className
+}) {
+  const [copied, setCopied] = useState(false);
+  const languageLabel = getLanguageLabel(language);
+  const highlightedCode = useShikiHighlighter(code, language, codeTheme, {
+    defaultColor: "light-dark()",
+    showLineNumbers,
+    startingLineNumber
+  });
+  useEffect(() => {
+    if (!copied) return;
+    const timer = window.setTimeout(() => {
+      setCopied(false);
+    }, 1500);
+    return () => window.clearTimeout(timer);
+  }, [copied]);
+  const handleCopy = async () => {
+    await navigator.clipboard.writeText(code);
+    setCopied(true);
+  };
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsxs("div", { className: "llm-code-highlighter__header", children: [
+      /* @__PURE__ */ jsxs("div", { className: "llm-code-highlighter__title", children: [
+        /* @__PURE__ */ jsx(CodeIcon, {}),
+        /* @__PURE__ */ jsx("span", { className: "llm-code-highlighter__language", children: languageLabel })
+      ] }),
+      copyable ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          "aria-label": copied ? "Code copied" : "Copy code",
+          className: "llm-code-highlighter__copy",
+          onClick: handleCopy,
+          type: "button",
+          children: copied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {})
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "llm-code-highlighter__body", children: highlightedCode ? /* @__PURE__ */ jsx("div", { className: "rs-root not-prose", children: highlightedCode }) : /* @__PURE__ */ jsx("pre", { "aria-hidden": "true", className: "llm-code-highlighter__placeholder", children: /* @__PURE__ */ jsx("code", { children: code }) }) })
+  ] });
+}
+function CodeHighlighter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    CodeHighlighterPrimitive,
+    {
+      className: cn("llm-code-highlighter", className),
+      ...props
+    }
+  );
+}
+
+// src/utils/markdown.ts
+function sanitizeMarkdown(content) {
+  const codeBlockCount = (content.match(/```/g) || []).length;
+  if (codeBlockCount % 2 !== 0) {
+    content += `${content.endsWith("\n") ? "" : "\n"}
+\`\`\``;
+  }
+  const stripped = content.replace(/```/g, "");
+  const inlineCount = (stripped.match(/`/g) || []).length;
+  if (inlineCount % 2 !== 0) {
+    content += "`";
+  }
+  return content;
+}
+function getCodeLanguage(className) {
+  return className?.match(/language-([\w-]+)/)?.[1] ?? "text";
+}
+function getCodeContent(children) {
+  return String(children ?? "").replace(/\n$/, "");
+}
+function hasOpenCodeFence(content) {
+  return (content.match(/```/g) ?? []).length % 2 !== 0;
+}
+function isCodeElement(node) {
+  return isValidElement(node);
+}
+var markdownComponents = {
+  code: ({ children, className }) => /* @__PURE__ */ jsx("code", { className, children }),
+  img: ({ alt, src, title }) => /* @__PURE__ */ jsx("img", { alt, loading: "lazy", src, title }),
+  pre: ({ children }) => {
+    if (!isCodeElement(children)) return null;
+    return /* @__PURE__ */ jsx(
+      CodeHighlighter,
+      {
+        code: getCodeContent(children.props.children),
+        language: getCodeLanguage(children.props.className)
+      }
+    );
+  }
+};
+function MarkPrimitive({
+  content,
+  streaming = false,
+  className
+}) {
+  const hasStreamingCodeFence = streaming && hasOpenCodeFence(content);
+  const parsedContent = hasStreamingCodeFence ? sanitizeMarkdown(content) : content;
+  return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
+    ReactMarkdown,
+    {
+      remarkPlugins: [remarkGfm],
+      components: markdownComponents,
+      children: parsedContent
+    }
+  ) });
+}
+function Mark({ className, ...props }) {
+  return /* @__PURE__ */ jsx(MarkPrimitive, { className: cn("llm-mark", className), ...props });
+}
+var senderPrefixActions = [
+  { key: "upload", label: "\u4E0A\u4F20\u9644\u4EF6" },
+  { key: "image", label: "\u6DFB\u52A0\u56FE\u7247" },
+  { key: "search", label: "\u8054\u7F51\u641C\u7D22" },
+  { key: "reasoning", label: "\u6DF1\u5EA6\u601D\u8003" }
+];
+var defaultModelOptions = [
+  { value: "gpt-4o", label: "GPT-4o" },
+  { value: "claude-sonnet-4", label: "Claude Sonnet 4" },
+  { value: "gemini-2.5-pro", label: "Gemini 2.5 Pro" },
+  { value: "deepseek-r1", label: "DeepSeek R1" }
+];
+function PlusIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-sender__prefix-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 5v14",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M5 12h14",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+function VoiceIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-sender__suffix-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 3a3 3 0 0 0-3 3v6a3 3 0 0 0 6 0V6a3 3 0 0 0-3-3Z",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M19 10v2a7 7 0 0 1-14 0v-2",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 19v3",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+function SendIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-sender__send-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M5 12h14",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m13 6 6 6-6 6",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+function StopIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-sender__send-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "rect",
+        {
+          height: "8",
+          rx: "1.5",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          width: "8",
+          x: "8",
+          y: "8"
+        }
+      )
+    }
+  );
+}
+function SenderPrimitive({
+  value,
+  defaultValue = "",
+  onChange,
+  onSend,
+  onCancel,
+  onPrefixAction,
+  onModelChange,
+  onVoiceClick,
+  loading = false,
+  disabled = false,
+  placeholder = "\u8F93\u5165\u6D88\u606F...",
+  model,
+  modelOptions = defaultModelOptions,
+  prefix,
+  suffix,
+  className
+}) {
+  const [innerMessage, setInnerMessage] = useState(defaultValue);
+  const controlled = value !== void 0;
+  const message = controlled ? value : innerMessage;
+  const textareaRef = useRef(null);
+  const prefixMenuRef = useRef(null);
+  const modelMenuRef = useRef(null);
+  const [prefixMenuOpen, setPrefixMenuOpen] = useState(false);
+  const [modelMenuOpen, setModelMenuOpen] = useState(false);
+  const [selectedModel, setSelectedModel] = useState(
+    model ?? modelOptions[0]?.value ?? ""
+  );
+  useEffect(() => {
+    const textarea = textareaRef.current;
+    if (!textarea) return;
+    textarea.style.height = "auto";
+    textarea.style.height = `${textarea.scrollHeight}px`;
+  }, [message]);
+  useEffect(() => {
+    const handlePointerDown = (event) => {
+      const target = event.target;
+      if (!(target instanceof Node)) return;
+      if (!prefixMenuRef.current?.contains(target)) {
+        setPrefixMenuOpen(false);
+      }
+      if (!modelMenuRef.current?.contains(target)) {
+        setModelMenuOpen(false);
+      }
+    };
+    document.addEventListener("pointerdown", handlePointerDown);
+    return () => {
+      document.removeEventListener("pointerdown", handlePointerDown);
+    };
+  }, []);
+  const handleMessageChange = (nextMessage) => {
+    if (!controlled) {
+      setInnerMessage(nextMessage);
+    }
+    onChange?.(nextMessage);
+  };
+  const handleSend = () => {
+    const nextMessage = message.trim();
+    if (!nextMessage || disabled || loading) return;
+    onSend?.(nextMessage);
+    handleMessageChange("");
+  };
+  const handleAction = () => {
+    if (loading) {
+      onCancel?.();
+      return;
+    }
+    handleSend();
+  };
+  const handleKeyDown = (event) => {
+    if (event.key !== "Enter" || event.shiftKey) return;
+    event.preventDefault();
+    handleSend();
+  };
+  const handlePrefixAction = (action) => {
+    onPrefixAction?.(action);
+    setPrefixMenuOpen(false);
+  };
+  const selectedModelLabel = modelOptions.find((option) => option.value === selectedModel)?.label ?? selectedModel;
+  const handleModelChange = (nextModel) => {
+    setSelectedModel(nextModel);
+    onModelChange?.(nextModel);
+    setModelMenuOpen(false);
+  };
+  const handleVoiceClick = () => {
+    if (disabled) return;
+    onVoiceClick?.();
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className,
+      "data-disabled": disabled ? "" : void 0,
+      "data-loading": loading ? "" : void 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            className: "llm-sender__textarea",
+            disabled,
+            onChange: (event) => handleMessageChange(event.target.value),
+            ref: textareaRef,
+            onKeyDown: handleKeyDown,
+            placeholder,
+            rows: 1,
+            value: message
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "llm-sender__footer", children: [
+          /* @__PURE__ */ jsx("div", { className: "llm-sender__prefix", children: prefix ?? /* @__PURE__ */ jsxs("div", { className: "llm-sender__prefix-menu", ref: prefixMenuRef, children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                "aria-expanded": prefixMenuOpen,
+                "aria-label": "\u6253\u5F00\u66F4\u591A\u64CD\u4F5C",
+                className: "llm-sender__prefix-trigger",
+                disabled,
+                onClick: () => setPrefixMenuOpen((open) => !open),
+                type: "button",
+                children: /* @__PURE__ */ jsx(PlusIcon, {})
+              }
+            ),
+            prefixMenuOpen ? /* @__PURE__ */ jsx("div", { className: "llm-sender__prefix-list", role: "menu", children: senderPrefixActions.map((action) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "llm-sender__prefix-item",
+                onClick: () => handlePrefixAction(action.key),
+                role: "menuitem",
+                type: "button",
+                children: action.label
+              },
+              action.key
+            )) }) : null
+          ] }) }),
+          /* @__PURE__ */ jsxs("div", { className: "llm-sender__actions", children: [
+            /* @__PURE__ */ jsx("div", { className: "llm-sender__suffix", children: suffix ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsxs("div", { className: "llm-sender__model-menu", ref: modelMenuRef, children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    "aria-expanded": modelMenuOpen,
+                    className: "llm-sender__suffix-button llm-sender__model",
+                    disabled,
+                    onClick: () => setModelMenuOpen((open) => !open),
+                    type: "button",
+                    children: selectedModelLabel
+                  }
+                ),
+                modelMenuOpen ? /* @__PURE__ */ jsx("div", { className: "llm-sender__model-list", role: "menu", children: modelOptions.map((option) => /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    "aria-current": option.value === selectedModel ? "true" : void 0,
+                    className: "llm-sender__model-item",
+                    onClick: () => handleModelChange(option.value),
+                    role: "menuitem",
+                    type: "button",
+                    children: option.label
+                  },
+                  option.value
+                )) }) : null
+              ] }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  "aria-label": "\u8BED\u97F3\u8F93\u5165",
+                  className: "llm-sender__suffix-button",
+                  disabled,
+                  onClick: handleVoiceClick,
+                  type: "button",
+                  children: /* @__PURE__ */ jsx(VoiceIcon, {})
+                }
+              )
+            ] }) }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                "aria-label": loading ? "\u505C\u6B62\u751F\u6210" : "\u53D1\u9001\u6D88\u606F",
+                className: "llm-sender__send",
+                "data-loading": loading ? "" : void 0,
+                disabled: disabled || !loading && !message.trim(),
+                onClick: handleAction,
+                type: "button",
+                children: loading ? /* @__PURE__ */ jsx(StopIcon, {}) : /* @__PURE__ */ jsx(SendIcon, {})
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function Sender({ className, ...props }) {
+  return /* @__PURE__ */ jsx(SenderPrimitive, { className: cn("llm-sender", className), ...props });
+}
+function SparkIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-think__icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 3 9.9 8.2 5 10.1l4.9 1.9L12 17l2.1-5 4.9-1.9-4.9-1.9L12 3Z",
+            stroke: "currentColor",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m18 15-.9 2.1L15 18l2.1.9L18 21l.9-2.1L21 18l-2.1-.9L18 15Z",
+            stroke: "currentColor",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        )
+      ]
+    }
+  );
+}
+function ChevronIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-think__chevron",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m6 9 6 6 6-6",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      )
+    }
+  );
+}
+function ThinkingDots() {
+  return /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "llm-think__dots", children: [
+    /* @__PURE__ */ jsx("span", {}),
+    /* @__PURE__ */ jsx("span", {}),
+    /* @__PURE__ */ jsx("span", {})
+  ] });
+}
+function ThinkPrimitive({
+  content,
+  status = "thinking",
+  label,
+  defaultOpen = true,
+  className,
+  style
+}) {
+  const [open, setOpen] = useState(defaultOpen);
+  const title = label ?? (status === "thinking" ? "\u601D\u8003\u4E2D" : "\u5DF2\u5B8C\u6210\u601D\u8003");
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className,
+      "data-open": open ? "" : void 0,
+      "data-status": status,
+      style,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            "aria-expanded": open,
+            className: "llm-think__header",
+            onClick: () => setOpen((nextOpen) => !nextOpen),
+            type: "button",
+            children: [
+              /* @__PURE__ */ jsxs("span", { className: "llm-think__title", children: [
+                /* @__PURE__ */ jsx(SparkIcon, {}),
+                /* @__PURE__ */ jsx("span", { children: title }),
+                status === "thinking" ? /* @__PURE__ */ jsx(ThinkingDots, {}) : null
+              ] }),
+              /* @__PURE__ */ jsx(ChevronIcon, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "llm-think__content", hidden: !open, children: content ? /* @__PURE__ */ jsx("div", { className: "llm-think__text", children: content }) : /* @__PURE__ */ jsx("div", { className: "llm-think__placeholder", children: "\u6B63\u5728\u5206\u6790\u4E0A\u4E0B\u6587\u4E0E\u7528\u6237\u610F\u56FE" }) })
+      ]
+    }
+  );
+}
+function Think({ className, ...props }) {
+  return /* @__PURE__ */ jsx(ThinkPrimitive, { className: cn("llm-think", className), ...props });
+}
+var defaultTitleMap = {
+  success: "\u64CD\u4F5C\u6210\u529F",
+  error: "\u64CD\u4F5C\u5931\u8D25",
+  loading: "\u5904\u7406\u4E2D"
+};
+function SuccessIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-notification__icon-svg",
+      fill: "none",
+      height: "18",
+      viewBox: "0 0 24 24",
+      width: "18",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m6 12 4 4 8-8",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2.4"
+        }
+      )
+    }
+  );
+}
+function ErrorIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-notification__icon-svg",
+      fill: "none",
+      height: "18",
+      viewBox: "0 0 24 24",
+      width: "18",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m8 8 8 8",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2.4"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m16 8-8 8",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2.4"
+          }
+        )
+      ]
+    }
+  );
+}
+function LoadingIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-notification__icon-svg llm-notification__icon-svg--loading",
+      fill: "none",
+      height: "18",
+      viewBox: "0 0 24 24",
+      width: "18",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M21 12a9 9 0 1 1-3.2-6.9",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeWidth: "2.4"
+        }
+      )
+    }
+  );
+}
+function CloseIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-notification__close-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m7 7 10 10",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m17 7-10 10",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2"
+          }
+        )
+      ]
+    }
+  );
+}
+function DefaultIcon({ type }) {
+  if (type === "success") return /* @__PURE__ */ jsx(SuccessIcon, {});
+  if (type === "error") return /* @__PURE__ */ jsx(ErrorIcon, {});
+  return /* @__PURE__ */ jsx(LoadingIcon, {});
+}
+function NotificationPrimitive({
+  type = "success",
+  title,
+  description,
+  duration = 4500,
+  showProgress = false,
+  closeable = true,
+  icon,
+  onClose,
+  className,
+  style
+}) {
+  useEffect(() => {
+    if (!duration || type === "loading") return;
+    const timer = window.setTimeout(() => {
+      onClose?.();
+    }, duration);
+    return () => {
+      window.clearTimeout(timer);
+    };
+  }, [duration, onClose, type]);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-live": type === "error" ? "assertive" : "polite",
+      className,
+      "data-type": type,
+      role: type === "error" ? "alert" : "status",
+      style,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "llm-notification__icon", children: icon ?? /* @__PURE__ */ jsx(DefaultIcon, { type }) }),
+        /* @__PURE__ */ jsxs("div", { className: "llm-notification__body", children: [
+          /* @__PURE__ */ jsx("div", { className: "llm-notification__title", children: title ?? defaultTitleMap[type] }),
+          description ? /* @__PURE__ */ jsx("div", { className: "llm-notification__description", children: description }) : null
+        ] }),
+        closeable ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            "aria-label": "\u5173\u95ED\u901A\u77E5",
+            className: "llm-notification__close",
+            onClick: onClose,
+            type: "button",
+            children: /* @__PURE__ */ jsx(CloseIcon, {})
+          }
+        ) : null,
+        showProgress && duration > 0 && type !== "loading" ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "llm-notification__progress",
+            style: { animationDuration: `${duration}ms` }
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function Notification({ className, ...props }) {
+  return /* @__PURE__ */ jsx(NotificationPrimitive, { className: cn("llm-notification", className), ...props });
+}
+function NotificationStack({
+  items,
+  onClose,
+  className
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("llm-notification-stack", className), children: items.map(({ id, onClose: itemOnClose, ...item }) => /* @__PURE__ */ jsx(
+    Notification,
+    {
+      ...item,
+      onClose: () => {
+        itemOnClose?.();
+        onClose?.(id);
+      }
+    },
+    id
+  )) });
+}
+function CopyIcon2() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M8 8.5V6a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.5",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M4 10a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z",
+            stroke: "currentColor",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        )
+      ]
+    }
+  );
+}
+function CheckIcon2() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m5 12.5 4.2 4.2L19 6.8",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      )
+    }
+  );
+}
+function ReloadIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M20 12a8 8 0 1 1-2.34-5.66L20 8.68M20 4v4.68h-4.68",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+function EditIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m4 20 4.8-1.2L19 8.6 15.4 5 5.2 15.2z",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m13.8 6.6 3.6 3.6",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "1.8"
+          }
+        )
+      ]
+    }
+  );
+}
+function ThumbsUpIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M7 21H4a1 1 0 0 1-1-1v-8a1 1 0 0 1 1-1h3m0 10V10l4-7 1.4 1.4a3 3 0 0 1 .8 2.7L12.8 10H19a2 2 0 0 1 2 2.3l-1 6A3 3 0 0 1 17 21z",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+function ThumbsDownIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M17 3h3a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1h-3m0-10v11l-4 7-1.4-1.4a3 3 0 0 1-.8-2.7l.4-2.9H5a2 2 0 0 1-2-2.3l1-6A3 3 0 0 1 7 3z",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+function SummaryIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M5 5.5h14M5 10h10M5 14.5h7",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "1.8"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m15 17 1.6 1.6L20 15",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        )
+      ]
+    }
+  );
+}
+function PolishIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m4 20 6.2-1.4L19 9.8 14.2 5 5.4 13.8z",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.8"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M15.5 3.5 20.5 8.5M5 4.5h3M6.5 3v3M19 17h2M20 16v2",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "1.8"
+          }
+        )
+      ]
+    }
+  );
+}
+function ExplainCodeIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m8 9-3 3 3 3M16 9l3 3-3 3M13.5 6.5l-3 11",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+var defaultIcons = {
+  copy: /* @__PURE__ */ jsx(CopyIcon2, {}),
+  regenerate: /* @__PURE__ */ jsx(ReloadIcon, {}),
+  reload: /* @__PURE__ */ jsx(ReloadIcon, {}),
+  edit: /* @__PURE__ */ jsx(EditIcon, {}),
+  correct: /* @__PURE__ */ jsx(EditIcon, {}),
+  like: /* @__PURE__ */ jsx(ThumbsUpIcon, {}),
+  dislike: /* @__PURE__ */ jsx(ThumbsDownIcon, {}),
+  summary: /* @__PURE__ */ jsx(SummaryIcon, {}),
+  polish: /* @__PURE__ */ jsx(PolishIcon, {}),
+  "explain-code": /* @__PURE__ */ jsx(ExplainCodeIcon, {})
+};
+function getActionIcon(item, copied) {
+  if (copied) return /* @__PURE__ */ jsx(CheckIcon2, {});
+  return item.icon ?? defaultIcons[item.key];
+}
+function ActionsPrimitive({
+  items,
+  onAction,
+  copiedKey = "copy",
+  copiedDuration = 1800,
+  orientation = "horizontal",
+  size = "md",
+  className,
+  style
+}) {
+  const [copied, setCopied] = useState(false);
+  useEffect(() => {
+    if (!copied) return;
+    const timer = window.setTimeout(() => setCopied(false), copiedDuration);
+    return () => window.clearTimeout(timer);
+  }, [copied, copiedDuration]);
+  const handleAction = (item) => {
+    if (item.disabled) return;
+    if (item.key === copiedKey) {
+      setCopied(true);
+    }
+    onAction?.(item.key, item);
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className,
+      "data-orientation": orientation,
+      "data-size": size,
+      role: "toolbar",
+      style,
+      children: items.map((item) => {
+        const itemCopied = item.key === copiedKey && copied;
+        const icon = getActionIcon(item, itemCopied);
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            "aria-label": item.label,
+            className: "llm-actions__item",
+            "data-copied": itemCopied ? "" : void 0,
+            "data-variant": item.variant,
+            disabled: item.disabled,
+            onClick: () => handleAction(item),
+            title: item.label,
+            type: "button",
+            children: [
+              icon ? /* @__PURE__ */ jsx("span", { className: "llm-actions__icon", children: icon }) : null,
+              /* @__PURE__ */ jsx("span", { className: "llm-actions__label", children: itemCopied ? "\u5DF2\u590D\u5236" : item.label })
+            ]
+          },
+          item.key
+        );
+      })
+    }
+  );
+}
+function Actions({ className, ...props }) {
+  return /* @__PURE__ */ jsx(ActionsPrimitive, { className: cn("llm-actions", className), ...props });
+}
+
+// src/components/actions/ActionsPreset.ts
+var actionPresets = {
+  copy: { key: "copy", label: "\u590D\u5236" },
+  regenerate: { key: "regenerate", label: "\u91CD\u65B0\u751F\u6210" },
+  correct: { key: "correct", label: "\u7EA0\u9519" },
+  summary: { key: "summary", label: "\u603B\u7ED3" },
+  polish: { key: "polish", label: "\u6DA6\u8272" },
+  "explain-code": { key: "explain-code", label: "\u89E3\u91CA\u4EE3\u7801" }
+};
+function createPresetActions(keys) {
+  return keys.map((key) => actionPresets[key]);
+}
+function PromptsPrimitive({
+  items,
+  onPrompt,
+  title,
+  description,
+  emptyText = "\u6682\u65E0\u63D0\u793A\u8BCD",
+  columns = 2,
+  className,
+  style
+}) {
+  const hasHeader = Boolean(title || description);
+  const handlePrompt = (item) => {
+    if (item.disabled) return;
+    onPrompt?.(item.key, item);
+  };
+  return /* @__PURE__ */ jsxs("section", { className, "data-columns": columns, style, children: [
+    hasHeader ? /* @__PURE__ */ jsxs("div", { className: "llm-prompts__header", children: [
+      title ? /* @__PURE__ */ jsx("div", { className: "llm-prompts__title", children: title }) : null,
+      description ? /* @__PURE__ */ jsx("div", { className: "llm-prompts__description", children: description }) : null
+    ] }) : null,
+    items.length > 0 ? /* @__PURE__ */ jsx("div", { className: "llm-prompts__list", children: items.map((item) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        "aria-label": typeof item.title === "string" ? item.title : void 0,
+        className: "llm-prompts__item",
+        disabled: item.disabled,
+        onClick: () => handlePrompt(item),
+        type: "button",
+        children: [
+          item.icon ? /* @__PURE__ */ jsx("span", { className: "llm-prompts__icon", children: item.icon }) : null,
+          /* @__PURE__ */ jsx("span", { className: "llm-prompts__item-title", children: item.title })
+        ]
+      },
+      item.key
+    )) }) : /* @__PURE__ */ jsx("div", { className: "llm-prompts__empty", children: emptyText })
+  ] });
+}
+function Prompts({ className, ...props }) {
+  return /* @__PURE__ */ jsx(PromptsPrimitive, { className: cn("llm-prompts", className), ...props });
+}
+function formatTimestamp2(timestamp) {
+  if (!timestamp) return void 0;
+  if (typeof timestamp === "string") return timestamp;
+  return timestamp.toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function PinIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "14",
+      viewBox: "0 0 24 24",
+      width: "14",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m14.5 4.5 5 5-3.2 3.2.8 5.4-1.2 1.2-4.4-4.4-4.7 4.7-2.4.8.8-2.4 4.7-4.7-4.4-4.4 1.2-1.2 5.4.8 3.2-3.2Z",
+          stroke: "currentColor",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+function StarIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "currentColor",
+      height: "14",
+      viewBox: "0 0 24 24",
+      width: "14",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx("path", { d: "m12 3 2.7 5.47 6.03.88-4.36 4.25 1.03 6-5.4-2.84-5.4 2.84 1.03-6-4.36-4.25 6.03-.88L12 3Z" })
+    }
+  );
+}
+function MoreIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-conversation-item__menu-icon",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M19 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M5 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+}
+function ConversationItemPrimitive({
+  conversation,
+  active = false,
+  onSelect,
+  onDelete,
+  onPin,
+  onFavorite,
+  className,
+  style
+}) {
+  const rootRef = useRef(null);
+  const [menuOpen, setMenuOpen] = useState(false);
+  const timestamp = formatTimestamp2(conversation.timestamp);
+  useEffect(() => {
+    if (!menuOpen) return;
+    const handlePointerDown = (event) => {
+      if (!rootRef.current?.contains(event.target)) {
+        setMenuOpen(false);
+      }
+    };
+    document.addEventListener("pointerdown", handlePointerDown);
+    return () => {
+      document.removeEventListener("pointerdown", handlePointerDown);
+    };
+  }, [menuOpen]);
+  const handleAction = (action) => {
+    if (action === "pin") {
+      onPin?.(conversation.id);
+    }
+    if (action === "favorite") {
+      onFavorite?.(conversation.id);
+    }
+    if (action === "delete") {
+      onDelete?.(conversation.id);
+    }
+    setMenuOpen(false);
+  };
+  return /* @__PURE__ */ jsxs(
+    "article",
+    {
+      ref: rootRef,
+      className,
+      "data-active": active ? "" : void 0,
+      "data-favorite": conversation.favorite ? "" : void 0,
+      "data-pinned": conversation.pinned ? "" : void 0,
+      style,
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            "aria-current": active ? "true" : void 0,
+            className: "llm-conversation-item__main",
+            onClick: () => onSelect?.(conversation.id),
+            type: "button",
+            children: /* @__PURE__ */ jsx("span", { className: "llm-conversation-item__content", children: /* @__PURE__ */ jsxs("span", { className: "llm-conversation-item__header", children: [
+              /* @__PURE__ */ jsx("span", { className: "llm-conversation-item__title", children: conversation.title }),
+              timestamp ? /* @__PURE__ */ jsx("span", { className: "llm-conversation-item__time", children: timestamp }) : null
+            ] }) })
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "llm-conversation-item__actions", children: [
+          conversation.pinned ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-label": "\u53D6\u6D88\u7F6E\u9876",
+              className: "llm-conversation-item__status-button",
+              onClick: () => handleAction("pin"),
+              type: "button",
+              children: /* @__PURE__ */ jsx(PinIcon, {})
+            }
+          ) : null,
+          conversation.favorite ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-label": "\u53D6\u6D88\u6536\u85CF",
+              className: "llm-conversation-item__status-button",
+              onClick: () => handleAction("favorite"),
+              type: "button",
+              children: /* @__PURE__ */ jsx(StarIcon, {})
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-expanded": menuOpen,
+              "aria-label": "\u6253\u5F00\u4F1A\u8BDD\u64CD\u4F5C",
+              className: "llm-conversation-item__menu-trigger",
+              onClick: () => setMenuOpen((open) => !open),
+              type: "button",
+              children: /* @__PURE__ */ jsx(MoreIcon, {})
+            }
+          ),
+          menuOpen ? /* @__PURE__ */ jsxs("div", { className: "llm-conversation-item__menu", role: "menu", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "llm-conversation-item__menu-item",
+                onClick: () => handleAction("pin"),
+                role: "menuitem",
+                type: "button",
+                children: conversation.pinned ? "\u53D6\u6D88\u7F6E\u9876" : "\u7F6E\u9876"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "llm-conversation-item__menu-item",
+                onClick: () => handleAction("favorite"),
+                role: "menuitem",
+                type: "button",
+                children: conversation.favorite ? "\u53D6\u6D88\u6536\u85CF" : "\u6536\u85CF"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "llm-conversation-item__menu-item",
+                "data-danger": "",
+                onClick: () => handleAction("delete"),
+                role: "menuitem",
+                type: "button",
+                children: "\u5220\u9664"
+              }
+            )
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+}
+function ConversationItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ConversationItemPrimitive,
+    {
+      className: cn("llm-conversation-item", className),
+      ...props
+    }
+  );
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function useVirtualList({
+  items,
+  itemHeight,
+  overscan = 5,
+  enabled = true,
+  getItemKey
+}) {
+  const containerRef = useRef(null);
+  const [scrollTop, setScrollTop] = useState(0);
+  const [viewportHeight, setViewportHeight] = useState(0);
+  const safeItemHeight = Math.max(1, itemHeight);
+  const safeOverscan = Math.max(0, overscan);
+  const totalSize = items.length * safeItemHeight;
+  useEffect(() => {
+    if (!enabled) return;
+    const container = containerRef.current;
+    if (!container) return;
+    const updateViewportHeight = () => {
+      setViewportHeight(container.clientHeight);
+    };
+    updateViewportHeight();
+    if (typeof ResizeObserver === "undefined") {
+      return;
+    }
+    const observer = new ResizeObserver(updateViewportHeight);
+    observer.observe(container);
+    return () => observer.disconnect();
+  }, [enabled]);
+  useEffect(() => {
+    if (!enabled) return;
+    const container = containerRef.current;
+    if (!container) return;
+    const handleScroll = () => {
+      setScrollTop(container.scrollTop);
+    };
+    handleScroll();
+    container.addEventListener("scroll", handleScroll, { passive: true });
+    return () => container.removeEventListener("scroll", handleScroll);
+  }, [enabled]);
+  const virtualItems = useMemo(() => {
+    const listItems = [];
+    if (!enabled) {
+      for (let index = 0; index < items.length; index += 1) {
+        const item = items[index];
+        if (item === void 0) continue;
+        listItems.push({
+          item,
+          index,
+          key: getItemKey?.(item, index) ?? index,
+          start: index * safeItemHeight,
+          size: safeItemHeight
+        });
+      }
+      return listItems;
+    }
+    const startIndex = clamp(
+      Math.floor(scrollTop / safeItemHeight) - safeOverscan,
+      0,
+      items.length
+    );
+    const endIndex = clamp(
+      Math.ceil((scrollTop + viewportHeight) / safeItemHeight) + safeOverscan,
+      startIndex,
+      items.length
+    );
+    for (let index = startIndex; index < endIndex; index += 1) {
+      const item = items[index];
+      if (item === void 0) continue;
+      listItems.push({
+        item,
+        index,
+        key: getItemKey?.(item, index) ?? index,
+        start: index * safeItemHeight,
+        size: safeItemHeight
+      });
+    }
+    return listItems;
+  }, [
+    enabled,
+    getItemKey,
+    items,
+    safeItemHeight,
+    safeOverscan,
+    scrollTop,
+    viewportHeight
+  ]);
+  const scrollToIndex = useCallback(
+    (index, align = "start") => {
+      const container = containerRef.current;
+      if (!container) return;
+      const clampedIndex = clamp(index, 0, Math.max(0, items.length - 1));
+      const itemStart = clampedIndex * safeItemHeight;
+      const itemEnd = itemStart + safeItemHeight;
+      const maxScrollTop = Math.max(0, totalSize - container.clientHeight);
+      let nextScrollTop = itemStart;
+      if (align === "center") {
+        nextScrollTop = itemStart - (container.clientHeight - safeItemHeight) / 2;
+      }
+      if (align === "end") {
+        nextScrollTop = itemEnd - container.clientHeight;
+      }
+      container.scrollTo({
+        top: clamp(nextScrollTop, 0, maxScrollTop),
+        behavior: "smooth"
+      });
+    },
+    [items.length, safeItemHeight, totalSize]
+  );
+  return {
+    containerRef,
+    virtualItems,
+    totalSize,
+    scrollToIndex
+  };
+}
+function normalizeSearchText(value) {
+  return value.trim().toLowerCase();
+}
+function SearchIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m20 20-4.3-4.3m1.8-5.2a7 7 0 1 1-14 0 7 7 0 0 1 14 0Z",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "1.8"
+        }
+      )
+    }
+  );
+}
+function ConversationListPrimitive({
+  conversations,
+  activeId,
+  onSelect,
+  onDelete,
+  onPin,
+  onFavorite,
+  onCollapsedChange,
+  onNewConversation,
+  collapsed = false,
+  searchable = false,
+  searchPlaceholder = "\u641C\u7D22\u4F1A\u8BDD...",
+  title,
+  emptyText,
+  virtualized = false,
+  itemHeight = 56,
+  overscan = 6,
+  className,
+  style
+}) {
+  const [searchOpen, setSearchOpen] = useState(false);
+  const [searchValue, setSearchValue] = useState("");
+  const keyword = normalizeSearchText(searchValue);
+  const visibleConversations = useMemo(() => {
+    const filteredConversations = keyword ? conversations.filter((conversation) => {
+      const titleMatched = conversation.title.toLowerCase().includes(keyword);
+      const messageMatched = conversation.lastMessage?.toLowerCase().includes(keyword) ?? false;
+      return titleMatched || messageMatched;
+    }) : conversations;
+    return filteredConversations.map((conversation, index) => ({ conversation, index })).sort((a, b) => {
+      if (a.conversation.pinned === b.conversation.pinned) {
+        return a.index - b.index;
+      }
+      return a.conversation.pinned ? -1 : 1;
+    }).map(({ conversation }) => conversation);
+  }, [conversations, keyword]);
+  const resolvedEmptyText = emptyText ?? (keyword ? "\u672A\u627E\u5230\u76F8\u5173\u4F1A\u8BDD" : "\u6682\u65E0\u4F1A\u8BDD");
+  const { containerRef, totalSize, virtualItems } = useVirtualList({
+    items: visibleConversations,
+    itemHeight,
+    overscan,
+    enabled: virtualized,
+    getItemKey: (conversation) => conversation.id
+  });
+  return /* @__PURE__ */ jsxs(
+    "aside",
+    {
+      className,
+      "data-collapsed": collapsed ? "" : void 0,
+      "data-virtualized": virtualized ? "" : void 0,
+      style,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "llm-conversation-list__header", children: [
+          /* @__PURE__ */ jsxs("div", { className: "llm-conversation-list__toolbar", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                "aria-label": collapsed ? "\u6253\u5F00\u8FB9\u680F" : "\u5173\u95ED\u8FB9\u680F",
+                className: "llm-conversation-list__icon-button",
+                onClick: () => onCollapsedChange?.(!collapsed),
+                type: "button",
+                children: collapsed ? "\u203A" : "\u2039"
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "llm-conversation-list__toolbar-actions", children: [
+              searchable && !collapsed ? /* @__PURE__ */ jsx(
+                "button",
+                {
+                  "aria-expanded": searchOpen,
+                  "aria-label": "\u641C\u7D22\u4F1A\u8BDD",
+                  className: "llm-conversation-list__icon-button",
+                  onClick: () => setSearchOpen((open) => !open),
+                  type: "button",
+                  children: /* @__PURE__ */ jsx(SearchIcon, {})
+                }
+              ) : null,
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  "aria-label": "\u6253\u5F00\u65B0\u804A\u5929",
+                  className: "llm-conversation-list__icon-button",
+                  onClick: onNewConversation,
+                  type: "button",
+                  children: "+"
+                }
+              )
+            ] })
+          ] }),
+          title ? /* @__PURE__ */ jsx("div", { className: "llm-conversation-list__title", children: title }) : null,
+          searchable && searchOpen && !collapsed ? /* @__PURE__ */ jsxs("label", { className: "llm-conversation-list__search", children: [
+            /* @__PURE__ */ jsx("span", { className: "llm-conversation-list__search-label", children: "\u641C\u7D22\u4F1A\u8BDD" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                "aria-label": "\u641C\u7D22\u4F1A\u8BDD",
+                className: "llm-conversation-list__search-input",
+                onChange: (event) => setSearchValue(event.target.value),
+                placeholder: searchPlaceholder,
+                type: "search",
+                value: searchValue
+              }
+            )
+          ] }) : null
+        ] }),
+        !collapsed ? /* @__PURE__ */ jsx("div", { className: "llm-conversation-list__body", ref: containerRef, children: visibleConversations.length > 0 ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "llm-conversation-list__items",
+            "data-virtualized": virtualized ? "" : void 0,
+            role: "list",
+            style: virtualized ? { height: totalSize } : void 0,
+            children: (virtualized ? virtualItems : visibleConversations.map((conversation, index) => ({
+              item: conversation,
+              index,
+              key: conversation.id,
+              start: index * itemHeight,
+              size: itemHeight
+            }))).map((virtualItem) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "llm-conversation-list__item",
+                "data-virtualized": virtualized ? "" : void 0,
+                role: "listitem",
+                style: virtualized ? {
+                  height: virtualItem.size,
+                  transform: `translateY(${virtualItem.start}px)`
+                } : void 0,
+                children: /* @__PURE__ */ jsx(
+                  ConversationItem,
+                  {
+                    active: virtualItem.item.id === activeId,
+                    conversation: virtualItem.item,
+                    ...onSelect && { onSelect },
+                    ...onDelete && { onDelete },
+                    ...onFavorite && { onFavorite },
+                    ...onPin && { onPin }
+                  }
+                )
+              },
+              virtualItem.key
+            ))
+          }
+        ) : /* @__PURE__ */ jsx("div", { className: "llm-conversation-list__empty", children: resolvedEmptyText }) }) : null
+      ]
+    }
+  );
+}
+function ConversationList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ConversationListPrimitive,
+    {
+      className: cn("llm-conversation-list", className),
+      ...props
+    }
+  );
+}
+function defaultRenderMessage(message) {
+  return /* @__PURE__ */ jsx(
+    Bubble,
+    {
+      role: message.role,
+      ...message.actions && { actions: message.actions },
+      ...message.avatar && { avatar: message.avatar },
+      ...message.content && { content: message.content },
+      ...message.loading !== void 0 && { loading: message.loading },
+      ...message.status && { status: message.status },
+      ...message.timestamp && { timestamp: message.timestamp }
+    }
+  );
+}
+function MessageListPrimitive({
+  messages,
+  virtualized = false,
+  itemHeight = 112,
+  overscan = 5,
+  emptyText = "\u6682\u65E0\u6D88\u606F",
+  renderMessage,
+  role = "log",
+  ariaLabel = "\u6D88\u606F\u5217\u8868",
+  className,
+  style
+}) {
+  const { containerRef, totalSize, virtualItems } = useVirtualList({
+    items: messages,
+    itemHeight,
+    overscan,
+    enabled: virtualized,
+    getItemKey: (message) => message.id
+  });
+  const isLog = role === "log";
+  const listItems = virtualized ? virtualItems : messages.map((message, index) => ({
+    item: message,
+    index,
+    key: message.id,
+    start: index * itemHeight,
+    size: itemHeight
+  }));
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      "aria-label": ariaLabel,
+      "aria-live": isLog ? "polite" : void 0,
+      className,
+      "data-virtualized": virtualized ? "" : void 0,
+      role,
+      style,
+      children: /* @__PURE__ */ jsx("div", { className: "llm-message-list__body", ref: containerRef, children: messages.length > 0 ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "llm-message-list__items",
+          "data-virtualized": virtualized ? "" : void 0,
+          role: isLog ? void 0 : "list",
+          style: virtualized ? { height: totalSize } : void 0,
+          children: listItems.map((virtualItem) => /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "llm-message-list__item",
+              "data-virtualized": virtualized ? "" : void 0,
+              role: isLog ? "article" : "listitem",
+              style: virtualized ? {
+                height: virtualItem.size,
+                transform: `translateY(${virtualItem.start}px)`
+              } : void 0,
+              children: renderMessage ? renderMessage(virtualItem.item, virtualItem.index) : defaultRenderMessage(virtualItem.item)
+            },
+            virtualItem.key
+          ))
+        }
+      ) : /* @__PURE__ */ jsx("div", { className: "llm-message-list__empty", children: emptyText }) })
+    }
+  );
+}
+function MessageList({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    MessageListPrimitive,
+    {
+      className: cn("llm-message-list", className),
+      ...props
+    }
+  );
+}
+function ChevronIcon2() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-thought__chevron",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m9 6 6 6-6 6",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      )
+    }
+  );
+}
+function StatusIcon({ status }) {
+  if (status === "loading") {
+    return /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "llm-thought__spinner", children: /* @__PURE__ */ jsx("span", {}) });
+  }
+  if (status === "success") {
+    return /* @__PURE__ */ jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        fill: "none",
+        height: "14",
+        viewBox: "0 0 24 24",
+        width: "14",
+        children: /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m5 12.5 4.2 4.2L19 6.8",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "2.4"
+          }
+        )
+      }
+    );
+  }
+  if (status === "error") {
+    return /* @__PURE__ */ jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        fill: "none",
+        height: "14",
+        viewBox: "0 0 24 24",
+        width: "14",
+        children: /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "m7 7 10 10M17 7 7 17",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2.4"
+          }
+        )
+      }
+    );
+  }
+  if (status === "abort") {
+    return /* @__PURE__ */ jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        fill: "none",
+        height: "14",
+        viewBox: "0 0 24 24",
+        width: "14",
+        children: /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M7 12h10",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeWidth: "2.4"
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "llm-thought__pending-dot" });
+}
+function hasExpandableContent(item) {
+  return Boolean(item.status === "loading" && item.content);
+}
+function ThoughtNode({
+  item,
+  depth,
+  line,
+  isExpanded,
+  onToggle
+}) {
+  const status = item.status ?? "pending";
+  const expandable = item.collapsible ?? hasExpandableContent(item);
+  const expanded = expandable && isExpanded(item.key);
+  const nodeId = `llm-thought-node-${item.key}`;
+  const contentId = `llm-thought-content-${item.key}`;
+  return /* @__PURE__ */ jsxs("li", { className: "llm-thought__item", "data-depth": depth, "data-status": status, children: [
+    /* @__PURE__ */ jsx("div", { className: "llm-thought__rail", "data-line": line ? "" : void 0, children: item.icon === false ? null : /* @__PURE__ */ jsx("span", { className: "llm-thought__icon", children: item.icon ?? /* @__PURE__ */ jsx(StatusIcon, { status }) }) }),
+    /* @__PURE__ */ jsxs("div", { className: "llm-thought__node", children: [
+      /* @__PURE__ */ jsxs("div", { className: "llm-thought__header", children: [
+        /* @__PURE__ */ jsx("div", { className: "llm-thought__heading", id: nodeId, children: /* @__PURE__ */ jsx("span", { className: "llm-thought__item-title", children: item.title }) }),
+        expandable ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            "aria-controls": contentId,
+            "aria-expanded": expanded,
+            "aria-labelledby": nodeId,
+            className: "llm-thought__toggle",
+            onClick: () => onToggle(item),
+            type: "button",
+            children: /* @__PURE__ */ jsx(ChevronIcon2, {})
+          }
+        ) : null
+      ] }),
+      hasExpandableContent(item) ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "llm-thought__content",
+          hidden: !expanded,
+          id: contentId,
+          children: status === "loading" && item.content ? /* @__PURE__ */ jsx("div", { className: "llm-thought__body", children: item.content }) : null
+        }
+      ) : null
+    ] })
+  ] });
+}
+function ThoughtList({
+  items,
+  depth,
+  line,
+  isExpanded,
+  onToggle
+}) {
+  return /* @__PURE__ */ jsx("ol", { className: "llm-thought__list", children: items.map((item) => /* @__PURE__ */ jsx(
+    ThoughtNode,
+    {
+      depth,
+      isExpanded,
+      item,
+      line,
+      onToggle
+    },
+    item.key
+  )) });
+}
+function ThoughtPrimitive({
+  items,
+  title,
+  description,
+  defaultExpandedKeys,
+  expandedKeys,
+  onExpand,
+  line = true,
+  compact = false,
+  emptyText = "\u6682\u65E0\u601D\u8003\u6B65\u9AA4",
+  className,
+  style
+}) {
+  const [innerExpandedKeys, setInnerExpandedKeys] = useState(
+    () => defaultExpandedKeys ?? []
+  );
+  const mergedExpandedKeys = expandedKeys ?? innerExpandedKeys;
+  const hasHeader = Boolean(title || description);
+  const isExpanded = (key) => mergedExpandedKeys.includes(key);
+  const handleToggle = (item) => {
+    const nextExpandedKeys = isExpanded(item.key) ? mergedExpandedKeys.filter((key) => key !== item.key) : [...mergedExpandedKeys, item.key];
+    if (!expandedKeys) setInnerExpandedKeys(nextExpandedKeys);
+    onExpand?.(nextExpandedKeys, item);
+  };
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className,
+      "data-compact": compact ? "" : void 0,
+      style,
+      children: [
+        hasHeader ? /* @__PURE__ */ jsxs("div", { className: "llm-thought__section-header", children: [
+          title ? /* @__PURE__ */ jsx("div", { className: "llm-thought__title", children: title }) : null,
+          description ? /* @__PURE__ */ jsx("div", { className: "llm-thought__summary", children: description }) : null
+        ] }) : null,
+        items.length > 0 ? /* @__PURE__ */ jsx(
+          ThoughtList,
+          {
+            depth: 0,
+            isExpanded,
+            items,
+            line,
+            onToggle: handleToggle
+          }
+        ) : /* @__PURE__ */ jsx("div", { className: "llm-thought__empty", children: emptyText })
+      ]
+    }
+  );
+}
+function Thought({ className, ...props }) {
+  return /* @__PURE__ */ jsx(ThoughtPrimitive, { className: cn("llm-thought", className), ...props });
+}
+function ChevronIcon3() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      className: "llm-citation__chevron",
+      fill: "none",
+      height: "16",
+      viewBox: "0 0 24 24",
+      width: "16",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "m6 9 6 6 6-6",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: "2"
+        }
+      )
+    }
+  );
+}
+function getHost(url) {
+  if (!url) return void 0;
+  try {
+    return new URL(url).host;
+  } catch {
+    return url;
+  }
+}
+function CitationPreview({ item }) {
+  return /* @__PURE__ */ jsxs("span", { className: "llm-citation__preview", role: "tooltip", children: [
+    /* @__PURE__ */ jsx("span", { className: "llm-citation__preview-title", children: item.title }),
+    item.description ? /* @__PURE__ */ jsx("span", { className: "llm-citation__preview-description", children: item.description }) : null,
+    item.url ? /* @__PURE__ */ jsx("span", { className: "llm-citation__preview-url", children: getHost(item.url) }) : null
+  ] });
+}
+function CitationInlinePrimitive({
+  item,
+  index = 1,
+  active = false,
+  onCitation,
+  className,
+  style
+}) {
+  const label = `\u5F15\u7528\u6765\u6E90 ${index}`;
+  const handleClick = () => {
+    onCitation?.(item.key, item);
+  };
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className,
+      "data-active": active ? "" : void 0,
+      style,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            "aria-label": label,
+            className: "llm-citation__inline-trigger",
+            onClick: handleClick,
+            type: "button",
+            children: [
+              "[",
+              index,
+              "]"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(CitationPreview, { item })
+      ]
+    }
+  );
+}
+function CitationPrimitive({
+  items,
+  title,
+  defaultExpanded = true,
+  expanded,
+  onExpand,
+  onCitation,
+  emptyText = "\u6682\u65E0\u5F15\u7528\u6765\u6E90",
+  className,
+  style
+}) {
+  const [innerExpanded, setInnerExpanded] = useState(defaultExpanded);
+  const mergedExpanded = expanded ?? innerExpanded;
+  const heading = title ?? `Used ${items.length} sources`;
+  const handleExpand = () => {
+    const nextExpanded = !mergedExpanded;
+    if (expanded === void 0) setInnerExpanded(nextExpanded);
+    onExpand?.(nextExpanded);
+  };
+  const handleCitation = (item) => {
+    onCitation?.(item.key, item);
+  };
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className,
+      "data-expanded": mergedExpanded ? "" : void 0,
+      style,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            "aria-expanded": mergedExpanded,
+            className: "llm-citation__header",
+            onClick: handleExpand,
+            type: "button",
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "llm-citation__title", children: heading }),
+              /* @__PURE__ */ jsx(ChevronIcon3, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "llm-citation__content", hidden: !mergedExpanded, children: items.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "llm-citation__list", children: items.map((item) => /* @__PURE__ */ jsx("li", { className: "llm-citation__item", children: /* @__PURE__ */ jsxs(
+          "button",
+          {
+            className: "llm-citation__item-button",
+            onClick: () => handleCitation(item),
+            type: "button",
+            children: [
+              item.icon ? /* @__PURE__ */ jsx("span", { className: "llm-citation__item-icon", children: item.icon }) : null,
+              /* @__PURE__ */ jsx("span", { className: "llm-citation__item-title", children: item.title })
+            ]
+          }
+        ) }, item.key)) }) : /* @__PURE__ */ jsx("div", { className: "llm-citation__empty", children: emptyText }) })
+      ]
+    }
+  );
+}
+function Citation({ className, ...props }) {
+  return /* @__PURE__ */ jsx(CitationPrimitive, { className: cn("llm-citation", className), ...props });
+}
+function CitationInline({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    CitationInlinePrimitive,
+    {
+      className: cn("llm-citation-inline", className),
+      ...props
+    }
+  );
+}
+Citation.Inline = CitationInline;
+
+// src/locale/zh-CN.ts
+var zhCN = {
+  think: {
+    loading: "\u601D\u8003\u4E2D...",
+    done: "\u5DF2\u5B8C\u6210"
+  },
+  sender: {
+    placeholder: "\u8F93\u5165\u6D88\u606F...",
+    send: "\u53D1\u9001"
+  }
+};
+var zh_CN_default = zhCN;
+
+// src/locale/en-US.ts
+var enUS = {
+  think: {
+    loading: "Thinking...",
+    done: "Done"
+  },
+  sender: {
+    placeholder: "Type a message...",
+    send: "Send"
+  }
+};
+var en_US_default = enUS;
+var configContext = createContext(
+  void 0
+);
+function ConfigProvider({
+  theme,
+  locale,
+  ai,
+  children,
+  components
+}) {
+  const [themeState, setThemeState] = useState({
+    mode: theme?.mode ?? "system",
+    primaryColor: theme?.primaryColor ?? "oklch(0.205 0 0)"
+  });
+  const setTheme = (newTheme) => {
+    setThemeState((prev) => ({ ...prev, ...newTheme }));
+  };
+  const value = {
+    theme: themeState,
+    setTheme,
+    locale: typeof locale === "string" ? locale === "en-US" ? en_US_default : zh_CN_default : locale ?? zh_CN_default,
+    ...ai && { ai },
+    ...components && { components }
+  };
+  const resolveMode = value.theme.mode === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : value.theme.mode;
+  document.documentElement.setAttribute("data-theme", resolveMode);
+  return /* @__PURE__ */ jsx(configContext.Provider, { value, children });
+}
+function useConfig() {
+  const context = useContext(configContext);
+  if (!context) {
+    throw new Error("useConfig \u5FC5\u987B\u5728 ConfigProvider \u5185\u90E8\u4F7F\u7528");
+  }
+  return context;
+}
+
+// src/hooks/useLocale.ts
+function useLocale() {
+  const context = useConfig();
+  return context.locale;
+}
+
+// src/hooks/useTheme.ts
+function useTheme() {
+  const context = useConfig();
+  const setMode = (mode) => {
+    context.setTheme({ mode });
+  };
+  const isDark = context.theme.mode === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches : context.theme.mode === "dark";
+  return {
+    mode: context.theme.mode,
+    isDark,
+    setMode,
+    primaryColor: context.theme.primaryColor
+  };
+}
+function useStream() {
+  const [state, setState] = useState("idle");
+  const [content, setContent] = useState("");
+  const abortRef = useRef(new AbortController());
+  const start = useCallback(
+    async (generator, options) => {
+      abortRef.current = new AbortController();
+      setState("streaming");
+      setContent("");
+      let nextContent = "";
+      try {
+        for await (const token of generator) {
+          if (abortRef.current.signal.aborted) break;
+          nextContent += token;
+          setContent(nextContent);
+          options?.onToken?.(nextContent, token);
+        }
+        if (!abortRef.current.signal.aborted) {
+          setState("complete");
+          options?.onComplete?.(nextContent);
+        }
+      } catch {
+        setState("error");
+        options?.onError?.();
+      }
+    },
+    []
+  );
+  const cancel = useCallback(() => {
+    abortRef.current.abort();
+    setState("idle");
+  }, []);
+  return { content, state, start, cancel };
+}
+
+// src/utils/stream.ts
+async function* streamToGenerator(stream, encoding = "utf-8") {
+  const reader = stream.getReader();
+  const decoder = new TextDecoder(encoding);
+  try {
+    while (true) {
+      const { value, done } = await reader.read();
+      if (done) break;
+      yield decoder.decode(value, { stream: true });
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}
+function generatorToStream(gen) {
+  const encoder = new TextEncoder();
+  return new ReadableStream({
+    async pull(controller) {
+      const { value, done } = await gen.next();
+      if (done) {
+        controller.close();
+      } else {
+        controller.enqueue(encoder.encode(value));
+      }
+    }
+  });
+}
+async function* mockStream(text, delay = 50) {
+  for (const char of text) {
+    yield char;
+    await new Promise((resolve) => setTimeout(resolve, delay));
+  }
+}
+
+export { Actions, ActionsPrimitive, Bubble, BubblePrimitive, Citation, CitationInlinePrimitive, CitationPrimitive, CodeHighlighter, CodeHighlighterPrimitive, ConfigProvider, ConversationItem, ConversationItemPrimitive, ConversationList, ConversationListPrimitive, Mark, MarkPrimitive, MessageList, MessageListPrimitive, Notification, NotificationPrimitive, NotificationStack, Prompts, PromptsPrimitive, Sender, SenderPrimitive, Think, ThinkPrimitive, Thought, ThoughtPrimitive, actionPresets, createPresetActions, en_US_default as enUS, generatorToStream, mockStream, sanitizeMarkdown, streamToGenerator, useConfig, useLocale, useStream, useTheme, useVirtualList, zh_CN_default as zhCN };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map