@yourgpt/copilot-sdk 0.1.0

package/dist/ui/index.cjs

@@ -0,0 +1,4116 @@
+'use strict';
+
+var chunkW6KQT7YZ_cjs = require('../chunk-W6KQT7YZ.cjs');
+require('../chunk-2ZCWVAAK.cjs');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+var marked = require('marked');
+var React8 = require('react');
+var ReactMarkdown = require('react-markdown');
+var remarkBreaks = require('remark-breaks');
+var remarkGfm = require('remark-gfm');
+var shiki = require('shiki');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var useStickToBottom = require('use-stick-to-bottom');
+var tooltip = require('@base-ui/react/tooltip');
+var AvatarPrimitive = require('@radix-ui/react-avatar');
+var HoverCardPrimitive = require('@radix-ui/react-hover-card');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React8__namespace = /*#__PURE__*/_interopNamespace(React8);
+var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
+var remarkBreaks__default = /*#__PURE__*/_interopDefault(remarkBreaks);
+var remarkGfm__default = /*#__PURE__*/_interopDefault(remarkGfm);
+var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
+var HoverCardPrimitive__namespace = /*#__PURE__*/_interopNamespace(HoverCardPrimitive);
+
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+function CircularLoader({
+  className,
+  size = "md"
+}) {
+  const sizeClasses = {
+    sm: "size-4",
+    md: "size-5",
+    lg: "size-6"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "border-primary animate-spin rounded-full border-2 border-t-transparent",
+        sizeClasses[size],
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+    }
+  );
+}
+function ClassicLoader({
+  className,
+  size = "md"
+}) {
+  const sizeClasses = {
+    sm: "size-4",
+    md: "size-5",
+    lg: "size-6"
+  };
+  const barSizes = {
+    sm: { height: "6px", width: "1.5px" },
+    md: { height: "8px", width: "2px" },
+    lg: { height: "10px", width: "2.5px" }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", sizeClasses[size], className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute h-full w-full", children: [...Array(12)].map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "bg-primary absolute animate-[spinner-fade_1.2s_linear_infinite] rounded-full",
+        style: {
+          top: "0",
+          left: "50%",
+          marginLeft: size === "sm" ? "-0.75px" : size === "lg" ? "-1.25px" : "-1px",
+          transformOrigin: `${size === "sm" ? "0.75px" : size === "lg" ? "1.25px" : "1px"} ${size === "sm" ? "10px" : size === "lg" ? "14px" : "12px"}`,
+          transform: `rotate(${i * 30}deg)`,
+          opacity: 0,
+          animationDelay: `${i * 0.1}s`,
+          height: barSizes[size].height,
+          width: barSizes[size].width
+        }
+      },
+      i
+    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+  ] });
+}
+function PulseLoader({
+  className,
+  size = "md"
+}) {
+  const sizeClasses = {
+    sm: "size-4",
+    md: "size-5",
+    lg: "size-6"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", sizeClasses[size], className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-primary absolute inset-0 animate-[thin-pulse_1.5s_ease-in-out_infinite] rounded-full border-2" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+  ] });
+}
+function PulseDotLoader({
+  className,
+  size = "md"
+}) {
+  const sizeClasses = {
+    sm: "size-1",
+    md: "size-2",
+    lg: "size-3"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "bg-primary animate-[pulse-dot_1.2s_ease-in-out_infinite] rounded-full",
+        sizeClasses[size],
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+    }
+  );
+}
+function DotsLoader({
+  className,
+  size = "md"
+}) {
+  const dotSizes = {
+    sm: "h-1.5 w-1.5",
+    md: "h-2 w-2",
+    lg: "h-2.5 w-2.5"
+  };
+  const containerSizes = {
+    sm: "h-4",
+    md: "h-5",
+    lg: "h-6"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center space-x-1",
+        containerSizes[size],
+        className
+      ),
+      children: [
+        [...Array(3)].map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "bg-primary animate-[bounce-dots_1.4s_ease-in-out_infinite] rounded-full",
+              dotSizes[size]
+            ),
+            style: {
+              animationDelay: `${i * 160}ms`
+            }
+          },
+          i
+        )),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+      ]
+    }
+  );
+}
+function TypingLoader({
+  className,
+  size = "md"
+}) {
+  const dotSizes = {
+    sm: "h-1 w-1",
+    md: "h-1.5 w-1.5",
+    lg: "h-2 w-2"
+  };
+  const containerSizes = {
+    sm: "h-4",
+    md: "h-5",
+    lg: "h-6"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center space-x-1",
+        containerSizes[size],
+        className
+      ),
+      children: [
+        [...Array(3)].map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "bg-primary animate-[typing_1s_infinite] rounded-full",
+              dotSizes[size]
+            ),
+            style: {
+              animationDelay: `${i * 250}ms`
+            }
+          },
+          i
+        )),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+      ]
+    }
+  );
+}
+function WaveLoader({
+  className,
+  size = "md"
+}) {
+  const barWidths = {
+    sm: "w-0.5",
+    md: "w-0.5",
+    lg: "w-1"
+  };
+  const containerSizes = {
+    sm: "h-4",
+    md: "h-5",
+    lg: "h-6"
+  };
+  const heights = {
+    sm: ["6px", "9px", "12px", "9px", "6px"],
+    md: ["8px", "12px", "16px", "12px", "8px"],
+    lg: ["10px", "15px", "20px", "15px", "10px"]
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-0.5",
+        containerSizes[size],
+        className
+      ),
+      children: [
+        [...Array(5)].map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "bg-primary animate-[wave_1s_ease-in-out_infinite] rounded-full",
+              barWidths[size]
+            ),
+            style: {
+              animationDelay: `${i * 100}ms`,
+              height: heights[size][i]
+            }
+          },
+          i
+        )),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+      ]
+    }
+  );
+}
+function BarsLoader({
+  className,
+  size = "md"
+}) {
+  const barWidths = {
+    sm: "w-1",
+    md: "w-1.5",
+    lg: "w-2"
+  };
+  const containerSizes = {
+    sm: "h-4 gap-1",
+    md: "h-5 gap-1.5",
+    lg: "h-6 gap-2"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex", containerSizes[size], className), children: [
+    [...Array(3)].map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(
+          "bg-primary h-full animate-[wave-bars_1.2s_ease-in-out_infinite]",
+          barWidths[size]
+        ),
+        style: {
+          animationDelay: `${i * 0.2}s`
+        }
+      },
+      i
+    )),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+  ] });
+}
+function TerminalLoader({
+  className,
+  size = "md"
+}) {
+  const cursorSizes = {
+    sm: "h-3 w-1.5",
+    md: "h-4 w-2",
+    lg: "h-5 w-2.5"
+  };
+  const textSizes = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  };
+  const containerSizes = {
+    sm: "h-4",
+    md: "h-5",
+    lg: "h-6"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center space-x-1",
+        containerSizes[size],
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-primary font-mono", textSizes[size]), children: ">" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "bg-primary animate-[blink_1s_step-end_infinite]",
+              cursorSizes[size]
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading" })
+      ]
+    }
+  );
+}
+function TextBlinkLoader({
+  text = "Thinking",
+  className,
+  size = "md"
+}) {
+  const textSizes = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "animate-[text-blink_2s_ease-in-out_infinite] font-medium",
+        textSizes[size],
+        className
+      ),
+      children: text
+    }
+  );
+}
+function TextShimmerLoader({
+  text = "Thinking",
+  className,
+  size = "md"
+}) {
+  const textSizes = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "bg-[linear-gradient(to_right,var(--muted-foreground)_40%,var(--foreground)_60%,var(--muted-foreground)_80%)]",
+        "bg-size-[200%_auto] bg-clip-text font-medium text-transparent",
+        "animate-[shimmer_4s_infinite_linear]",
+        textSizes[size],
+        className
+      ),
+      children: text
+    }
+  );
+}
+function TextDotsLoader({
+  className,
+  text = "Thinking",
+  size = "md"
+}) {
+  const textSizes = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("inline-flex items-center", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-primary font-medium", textSizes[size]), children: text }),
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary animate-[loading-dots_1.4s_infinite_0.2s]", children: "." }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary animate-[loading-dots_1.4s_infinite_0.4s]", children: "." }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary animate-[loading-dots_1.4s_infinite_0.6s]", children: "." })
+    ] })
+  ] });
+}
+function Loader({
+  variant = "circular",
+  size = "md",
+  text,
+  className
+}) {
+  switch (variant) {
+    case "circular":
+      return /* @__PURE__ */ jsxRuntime.jsx(CircularLoader, { size, className });
+    case "classic":
+      return /* @__PURE__ */ jsxRuntime.jsx(ClassicLoader, { size, className });
+    case "pulse":
+      return /* @__PURE__ */ jsxRuntime.jsx(PulseLoader, { size, className });
+    case "pulse-dot":
+      return /* @__PURE__ */ jsxRuntime.jsx(PulseDotLoader, { size, className });
+    case "dots":
+      return /* @__PURE__ */ jsxRuntime.jsx(DotsLoader, { size, className });
+    case "typing":
+      return /* @__PURE__ */ jsxRuntime.jsx(TypingLoader, { size, className });
+    case "wave":
+      return /* @__PURE__ */ jsxRuntime.jsx(WaveLoader, { size, className });
+    case "bars":
+      return /* @__PURE__ */ jsxRuntime.jsx(BarsLoader, { size, className });
+    case "terminal":
+      return /* @__PURE__ */ jsxRuntime.jsx(TerminalLoader, { size, className });
+    case "text-blink":
+      return /* @__PURE__ */ jsxRuntime.jsx(TextBlinkLoader, { text, size, className });
+    case "text-shimmer":
+      return /* @__PURE__ */ jsxRuntime.jsx(TextShimmerLoader, { text, size, className });
+    case "loading-dots":
+      return /* @__PURE__ */ jsxRuntime.jsx(TextDotsLoader, { text, size, className });
+    default:
+      return /* @__PURE__ */ jsxRuntime.jsx(CircularLoader, { size, className });
+  }
+}
+function CodeBlock({ children, className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "not-prose flex w-full flex-col overflow-clip border",
+        "border-border bg-card text-card-foreground rounded-xl",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function CodeBlockCode({
+  code,
+  language = "tsx",
+  theme = "github-light",
+  className,
+  ...props
+}) {
+  const [highlightedHtml, setHighlightedHtml] = React8.useState(null);
+  React8.useEffect(() => {
+    async function highlight() {
+      if (!code) {
+        setHighlightedHtml("<pre><code></code></pre>");
+        return;
+      }
+      const html = await shiki.codeToHtml(code, { lang: language, theme });
+      setHighlightedHtml(html);
+    }
+    highlight();
+  }, [code, language, theme]);
+  const classNames = cn(
+    "w-full overflow-x-auto text-[13px] [&>pre]:px-4 [&>pre]:py-4",
+    className
+  );
+  return highlightedHtml ? /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: classNames,
+      dangerouslySetInnerHTML: { __html: highlightedHtml },
+      ...props
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames, ...props, children: /* @__PURE__ */ jsxRuntime.jsx("pre", { children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: code }) }) });
+}
+function parseMarkdownIntoBlocks(markdown) {
+  const tokens = marked.marked.lexer(markdown);
+  return tokens.map((token) => token.raw);
+}
+function extractLanguage(className) {
+  if (!className) return "plaintext";
+  const match = className.match(/language-(\w+)/);
+  return match ? match[1] : "plaintext";
+}
+var INITIAL_COMPONENTS = {
+  code: function CodeComponent({ className, children, ...props }) {
+    const isInline = !props.node?.position?.start.line || props.node?.position?.start.line === props.node?.position?.end.line;
+    if (isInline) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: cn(
+            "bg-primary-foreground rounded-sm px-1 font-mono text-sm",
+            className
+          ),
+          ...props,
+          children
+        }
+      );
+    }
+    const language = extractLanguage(className);
+    return /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, { className, children: /* @__PURE__ */ jsxRuntime.jsx(CodeBlockCode, { code: children, language }) });
+  },
+  pre: function PreComponent({ children }) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
+  }
+};
+var MemoizedMarkdownBlock = React8.memo(
+  function MarkdownBlock({
+    content,
+    components = INITIAL_COMPONENTS
+  }) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      ReactMarkdown__default.default,
+      {
+        remarkPlugins: [remarkGfm__default.default, remarkBreaks__default.default],
+        components,
+        children: content
+      }
+    );
+  },
+  function propsAreEqual(prevProps, nextProps) {
+    return prevProps.content === nextProps.content;
+  }
+);
+MemoizedMarkdownBlock.displayName = "MemoizedMarkdownBlock";
+function MarkdownComponent({
+  children,
+  id,
+  className,
+  components = INITIAL_COMPONENTS
+}) {
+  const generatedId = React8.useId();
+  const blockId = id ?? generatedId;
+  const blocks = React8.useMemo(() => parseMarkdownIntoBlocks(children), [children]);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: blocks.map((block, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    MemoizedMarkdownBlock,
+    {
+      content: block,
+      components
+    },
+    `${blockId}-block-${index}`
+  )) });
+}
+var Markdown = React8.memo(MarkdownComponent);
+Markdown.displayName = "Markdown";
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-white shadow-sm hover:bg-destructive/90",
+        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React8__namespace.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+function ThumbsUpIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 10v12" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z" })
+      ]
+    }
+  );
+}
+function ThumbsDownIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 14V2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z" })
+      ]
+    }
+  );
+}
+function XIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+      ]
+    }
+  );
+}
+function FeedbackBar({
+  className,
+  title,
+  icon,
+  onHelpful,
+  onNotHelpful,
+  onClose
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "bg-background border-border inline-flex rounded-[12px] border text-sm",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center justify-start gap-4 py-3 pl-4", children: [
+          icon,
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground font-medium", children: title })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-0.5 px-3 py-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "text-muted-foreground hover:text-foreground flex size-8 items-center justify-center rounded-md transition-colors",
+              "aria-label": "Helpful",
+              onClick: onHelpful,
+              children: /* @__PURE__ */ jsxRuntime.jsx(ThumbsUpIcon, { className: "size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "text-muted-foreground hover:text-foreground flex size-8 items-center justify-center rounded-md transition-colors",
+              "aria-label": "Not helpful",
+              onClick: onNotHelpful,
+              children: /* @__PURE__ */ jsxRuntime.jsx(ThumbsDownIcon, { className: "size-4" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-border flex items-center justify-center border-l", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            className: "text-muted-foreground hover:text-foreground flex items-center justify-center rounded-md p-3",
+            "aria-label": "Close",
+            children: /* @__PURE__ */ jsxRuntime.jsx(XIcon, { className: "size-5" })
+          }
+        ) })
+      ] })
+    }
+  );
+}
+var StickToBottom = useStickToBottom.StickToBottom;
+function useChatContainer() {
+  const context = useStickToBottom.useStickToBottomContext();
+  return {
+    isAtBottom: context.isAtBottom,
+    scrollToBottom: context.scrollToBottom
+  };
+}
+function ChatContainerRoot({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    StickToBottom,
+    {
+      className: cn("flex overflow-y-auto", className),
+      resize: "smooth",
+      initial: "instant",
+      role: "log",
+      ...props,
+      children
+    }
+  );
+}
+function ChatContainerContent({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    StickToBottom.Content,
+    {
+      className: cn("flex w-full flex-col", className),
+      ...props,
+      children
+    }
+  );
+}
+function ChatContainerScrollAnchor({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn("h-px w-full shrink-0 scroll-mt-4", className),
+      "aria-hidden": "true",
+      ...props
+    }
+  );
+}
+function ChevronDownIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+    }
+  );
+}
+function ScrollButton({
+  className,
+  variant = "outline",
+  size = "sm",
+  ...props
+}) {
+  const { isAtBottom, scrollToBottom } = useChatContainer();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Button,
+    {
+      variant,
+      size,
+      className: cn(
+        "h-10 w-10 rounded-full transition-all duration-150 ease-out",
+        !isAtBottom ? "translate-y-0 scale-100 opacity-100" : "pointer-events-none translate-y-4 scale-95 opacity-0",
+        className
+      ),
+      onClick: () => scrollToBottom(),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDownIcon, { className: "h-5 w-5" })
+    }
+  );
+}
+function TooltipProvider({
+  children,
+  delayDuration = 300
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Provider, { delay: delayDuration, children });
+}
+function Tooltip({ children, open, defaultOpen, onOpenChange }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    tooltip.Tooltip.Root,
+    {
+      open,
+      defaultOpen,
+      onOpenChange,
+      children
+    }
+  );
+}
+function TooltipTrigger({
+  children,
+  asChild,
+  disabled,
+  ...props
+}) {
+  if (asChild && React8__namespace.default.isValidElement(children)) {
+    return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Trigger, { disabled, render: children, ...props });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Trigger, { disabled, ...props, children });
+}
+function TooltipContent({
+  children,
+  className,
+  side = "top",
+  align = "center",
+  sideOffset = 8,
+  showArrow = true
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Positioner, { side, align, sideOffset, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    tooltip.Tooltip.Popup,
+    {
+      className: cn(
+        "z-50 rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground shadow-md",
+        "animate-in fade-in-0 zoom-in-95",
+        "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+        className
+      ),
+      children: [
+        children,
+        showArrow && /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Arrow, { className: "fill-primary" })
+      ]
+    }
+  ) }) });
+}
+var Avatar = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
+      className
+    ),
+    ...props
+  }
+));
+Avatar.displayName = AvatarPrimitive__namespace.Root.displayName;
+var AvatarImage = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Image,
+  {
+    ref,
+    className: cn("aspect-square h-full w-full", className),
+    ...props
+  }
+));
+AvatarImage.displayName = AvatarPrimitive__namespace.Image.displayName;
+var AvatarFallback = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  AvatarPrimitive__namespace.Fallback,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive__namespace.Fallback.displayName;
+var Message = ({ children, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex gap-3", className), ...props, children });
+var MessageAvatar = ({
+  src,
+  alt,
+  fallback,
+  delayMs,
+  className
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: cn("size-7 shrink-0", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src, alt }),
+    fallback && /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { delayMs, children: fallback })
+  ] });
+};
+var proseSizeMap = {
+  sm: "prose-sm",
+  base: "prose-base",
+  lg: "prose-lg"
+};
+var MessageContent = ({
+  children,
+  markdown = false,
+  className,
+  size = "sm",
+  ...props
+}) => {
+  const classNames = cn(
+    "rounded-lg p-2 bg-secondary prose break-words whitespace-normal max-w-none",
+    "text-foreground prose-headings:text-foreground prose-p:text-foreground prose-strong:text-foreground prose-li:text-foreground prose-a:text-foreground prose-ol:text-foreground prose-ul:text-foreground prose-code:text-foreground",
+    proseSizeMap[size],
+    className
+  );
+  return markdown ? /* @__PURE__ */ jsxRuntime.jsx(Markdown, { className: classNames, ...props, children }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames, ...props, children });
+};
+var Textarea = React8__namespace.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "textarea",
+    {
+      className: cn(
+        "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        className
+      ),
+      ref,
+      ...props
+    }
+  );
+});
+Textarea.displayName = "Textarea";
+var PromptInputContext = React8.createContext({
+  isLoading: false,
+  value: "",
+  setValue: () => {
+  },
+  maxHeight: 240,
+  onSubmit: void 0,
+  disabled: false,
+  textareaRef: { current: null }
+});
+function usePromptInput() {
+  return React8.useContext(PromptInputContext);
+}
+function PromptInput({
+  className,
+  isLoading = false,
+  maxHeight = 240,
+  value,
+  onValueChange,
+  onSubmit,
+  children,
+  disabled = false,
+  onClick,
+  ...props
+}) {
+  const [internalValue, setInternalValue] = React8.useState(value || "");
+  const textareaRef = React8.useRef(null);
+  const handleChange = (newValue) => {
+    setInternalValue(newValue);
+    onValueChange?.(newValue);
+  };
+  const handleClick = (e) => {
+    if (!disabled) textareaRef.current?.focus();
+    onClick?.(e);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    PromptInputContext.Provider,
+    {
+      value: {
+        isLoading,
+        value: value ?? internalValue,
+        setValue: onValueChange ?? handleChange,
+        maxHeight,
+        onSubmit,
+        disabled,
+        textareaRef
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          onClick: handleClick,
+          className: cn(
+            "border-input bg-background cursor-text rounded-3xl border p-2 shadow-xs",
+            disabled && "cursor-not-allowed opacity-60",
+            className
+          ),
+          ...props,
+          children
+        }
+      )
+    }
+  ) });
+}
+function PromptInputTextarea({
+  className,
+  onKeyDown,
+  disableAutosize = false,
+  ...props
+}) {
+  const { value, setValue, maxHeight, onSubmit, disabled, textareaRef } = usePromptInput();
+  const adjustHeight = (el) => {
+    if (!el || disableAutosize) return;
+    el.style.height = "auto";
+    if (typeof maxHeight === "number") {
+      el.style.height = `${Math.min(el.scrollHeight, maxHeight)}px`;
+    } else {
+      el.style.height = `min(${el.scrollHeight}px, ${maxHeight})`;
+    }
+  };
+  const handleRef = (el) => {
+    textareaRef.current = el;
+    adjustHeight(el);
+  };
+  React8.useLayoutEffect(() => {
+    if (!textareaRef.current || disableAutosize) return;
+    const el = textareaRef.current;
+    el.style.height = "auto";
+    if (typeof maxHeight === "number") {
+      el.style.height = `${Math.min(el.scrollHeight, maxHeight)}px`;
+    } else {
+      el.style.height = `min(${el.scrollHeight}px, ${maxHeight})`;
+    }
+  }, [value, maxHeight, disableAutosize]);
+  const handleChange = (e) => {
+    adjustHeight(e.target);
+    setValue(e.target.value);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      onSubmit?.();
+    }
+    onKeyDown?.(e);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Textarea,
+    {
+      ref: handleRef,
+      value,
+      onChange: handleChange,
+      onKeyDown: handleKeyDown,
+      className: cn(
+        "text-foreground min-h-[44px] w-full resize-none border-none bg-transparent shadow-none outline-none focus-visible:ring-0 focus-visible:ring-offset-0",
+        className
+      ),
+      rows: 1,
+      disabled,
+      ...props
+    }
+  );
+}
+function PromptInputActions({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-2", className), ...props, children });
+}
+function PromptInputAction({
+  tooltip,
+  children,
+  className,
+  side = "top"
+}) {
+  const { disabled } = usePromptInput();
+  return /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      TooltipTrigger,
+      {
+        asChild: true,
+        disabled,
+        onClick: (e) => e.stopPropagation(),
+        children
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side, className, showArrow: true, children: tooltip })
+  ] });
+}
+var HoverCard = HoverCardPrimitive__namespace.Root;
+var HoverCardTrigger = HoverCardPrimitive__namespace.Trigger;
+var HoverCardContent = React8__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  HoverCardPrimitive__namespace.Content,
+  {
+    ref,
+    align,
+    sideOffset,
+    className: cn(
+      "z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-hover-card-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+));
+HoverCardContent.displayName = HoverCardPrimitive__namespace.Content.displayName;
+var SourceContext = React8.createContext(null);
+function useSourceContext() {
+  const ctx = React8.useContext(SourceContext);
+  if (!ctx) throw new Error("Source.* must be used inside <Source>");
+  return ctx;
+}
+function Source({ href, children }) {
+  let domain = "";
+  try {
+    domain = new URL(href).hostname;
+  } catch {
+    domain = href.split("/").pop() || href;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(SourceContext.Provider, { value: { href, domain }, children: /* @__PURE__ */ jsxRuntime.jsx(HoverCard, { openDelay: 150, closeDelay: 0, children }) });
+}
+function SourceTrigger({
+  label,
+  showFavicon = false,
+  className
+}) {
+  const { href, domain } = useSourceContext();
+  const labelToShow = label ?? domain.replace("www.", "");
+  return /* @__PURE__ */ jsxRuntime.jsx(HoverCardTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: cn(
+        "bg-muted text-muted-foreground hover:bg-muted-foreground/30 hover:text-primary inline-flex h-5 max-w-32 items-center gap-1 overflow-hidden rounded-full py-0 text-xs no-underline transition-colors duration-150",
+        showFavicon ? "pr-2 pl-1" : "px-1",
+        className
+      ),
+      children: [
+        showFavicon && /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            src: `https://www.google.com/s2/favicons?sz=64&domain_url=${encodeURIComponent(
+              href
+            )}`,
+            alt: "favicon",
+            width: 14,
+            height: 14,
+            className: "size-3.5 rounded-full"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate tabular-nums text-center font-normal", children: labelToShow })
+      ]
+    }
+  ) });
+}
+function SourceContent({
+  title,
+  description,
+  className
+}) {
+  const { href, domain } = useSourceContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(HoverCardContent, { className: cn("w-80 p-0 shadow-xs", className), children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "flex flex-col gap-2 p-3",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src: `https://www.google.com/s2/favicons?sz=64&domain_url=${encodeURIComponent(
+                href
+              )}`,
+              alt: "favicon",
+              className: "size-4 rounded-full",
+              width: 16,
+              height: 16
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-primary truncate text-sm", children: domain.replace("www.", "") })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "line-clamp-2 text-sm font-medium", children: title }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground line-clamp-2 text-sm", children: description })
+      ]
+    }
+  ) });
+}
+var ReasoningContext = React8__namespace.createContext(
+  null
+);
+function useReasoningContext() {
+  const context = React8__namespace.useContext(ReasoningContext);
+  if (!context) {
+    throw new Error(
+      "Reasoning components must be used within a Reasoning provider"
+    );
+  }
+  return context;
+}
+function Reasoning({
+  children,
+  isStreaming = false,
+  open: controlledOpen,
+  onOpenChange,
+  defaultOpen = false,
+  className
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React8__namespace.useState(defaultOpen);
+  const prevStreamingRef = React8__namespace.useRef(isStreaming);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const setIsOpen = React8__namespace.useCallback(
+    (open) => {
+      if (onOpenChange) {
+        onOpenChange(open);
+      }
+      if (!isControlled) {
+        setUncontrolledOpen(open);
+      }
+    },
+    [isControlled, onOpenChange]
+  );
+  React8__namespace.useEffect(() => {
+    if (isStreaming && !prevStreamingRef.current) {
+      setIsOpen(true);
+    } else if (!isStreaming && prevStreamingRef.current) {
+      setIsOpen(false);
+    }
+    prevStreamingRef.current = isStreaming;
+  }, [isStreaming, setIsOpen]);
+  return /* @__PURE__ */ jsxRuntime.jsx(ReasoningContext.Provider, { value: { isOpen, setIsOpen, isStreaming }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("reasoning", className), children }) });
+}
+function ReasoningTrigger({
+  children,
+  className
+}) {
+  const { isOpen, setIsOpen, isStreaming } = useReasoningContext();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: () => setIsOpen(!isOpen),
+      className: cn(
+        "flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground transition-colors",
+        "py-1 px-0 bg-transparent border-none cursor-pointer",
+        className
+      ),
+      "aria-expanded": isOpen,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "svg",
+          {
+            className: cn(
+              "size-3 transition-transform duration-200",
+              isOpen && "rotate-90"
+            ),
+            fill: "none",
+            viewBox: "0 0 24 24",
+            stroke: "currentColor",
+            strokeWidth: 2,
+            children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })
+          }
+        ),
+        isStreaming && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex h-2 w-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-primary" })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+function ReasoningContent({
+  children,
+  markdown = false,
+  className
+}) {
+  const { isOpen } = useReasoningContext();
+  const contentRef = React8__namespace.useRef(null);
+  const [height, setHeight] = React8__namespace.useState(0);
+  React8__namespace.useEffect(() => {
+    if (contentRef.current) {
+      const resizeObserver = new ResizeObserver((entries) => {
+        for (const entry of entries) {
+          setHeight(entry.contentRect.height);
+        }
+      });
+      resizeObserver.observe(contentRef.current);
+      return () => resizeObserver.disconnect();
+    }
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden transition-[max-height] duration-200 ease-out",
+        isOpen ? "opacity-100" : "opacity-0"
+      ),
+      style: { maxHeight: isOpen ? height : 0 },
+      "aria-hidden": !isOpen,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ref: contentRef,
+          className: cn(
+            "mt-1 pl-3 border-l-2 border-muted-foreground/20",
+            "text-xs text-muted-foreground",
+            className
+          ),
+          children: markdown && typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Markdown, { className: "prose-xs", children }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "whitespace-pre-wrap", children })
+        }
+      )
+    }
+  );
+}
+function SimpleReasoning({
+  content,
+  isStreaming = false,
+  streamingLabel = "Thinking...",
+  collapsedLabel = "View reasoning",
+  markdown = true,
+  className
+}) {
+  if (!content) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(Reasoning, { isStreaming, className, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ReasoningTrigger, { children: isStreaming ? streamingLabel : collapsedLabel }),
+    /* @__PURE__ */ jsxRuntime.jsx(ReasoningContent, { markdown, children: content })
+  ] });
+}
+var CopilotUIContext = React8__namespace.createContext(
+  null
+);
+function useCopilotUI() {
+  const context = React8__namespace.useContext(CopilotUIContext);
+  if (!context) {
+    return {
+      debug: false,
+      defaultDebugExpanded: false,
+      isDebug: false
+    };
+  }
+  return context;
+}
+function CopilotUIProvider({
+  children,
+  debug = false,
+  defaultDebugExpanded = false
+}) {
+  const value = React8__namespace.useMemo(
+    () => ({
+      debug,
+      defaultDebugExpanded,
+      isDebug: debug
+    }),
+    [debug, defaultDebugExpanded]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(CopilotUIContext.Provider, { value, children });
+}
+function toolNameToTitle(name) {
+  let result = name.replace(/_/g, " ");
+  result = result.replace(/([a-z])([A-Z])/g, "$1 $2");
+  return result.charAt(0).toUpperCase() + result.slice(1).toLowerCase();
+}
+function getDisplayTitle(step) {
+  const fallbackTitle = toolNameToTitle(step.name);
+  switch (step.status) {
+    case "pending":
+      return step.title ?? fallbackTitle;
+    case "executing":
+      if (step.executingTitle) return step.executingTitle;
+      return step.title ? `${step.title}...` : `${fallbackTitle}...`;
+    case "completed":
+      return step.completedTitle ?? step.title ?? fallbackTitle;
+    case "error":
+    case "failed":
+    case "rejected":
+      return step.title ?? fallbackTitle;
+    default:
+      return fallbackTitle;
+  }
+}
+function StatusIndicator({ status, className }) {
+  const baseClasses = "flex-shrink-0";
+  switch (status) {
+    case "pending":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            baseClasses,
+            "size-3 flex items-center justify-center",
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-1.5 rounded-full bg-muted-foreground/40" })
+        }
+      );
+    case "executing":
+      return null;
+    case "completed":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            baseClasses,
+            "size-3 flex items-center justify-center",
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              className: "size-3 text-green-500",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 3,
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  d: "M5 13l4 4L19 7"
+                }
+              )
+            }
+          )
+        }
+      );
+    case "error":
+    case "failed":
+    case "rejected":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            baseClasses,
+            "size-3 flex items-center justify-center",
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              className: "size-3 text-red-500",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 3,
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  d: "M6 18L18 6M6 6l12 12"
+                }
+              )
+            }
+          )
+        }
+      );
+  }
+}
+function formatResult(result) {
+  if (!result) return "";
+  if (result.message) return result.message;
+  if (result.error) return result.error;
+  if (result.data) {
+    const data = result.data;
+    if (data.image && typeof data.image === "string" && data.image.startsWith("data:image")) {
+      return `Image (${data.width || "?"}x${data.height || "?"})`;
+    }
+    return JSON.stringify(result.data);
+  }
+  return result.success ? "Success" : "Failed";
+}
+function getResultImage(result) {
+  if (!result?.data) return null;
+  const data = result.data;
+  if (data.image && typeof data.image === "string" && data.image.startsWith("data:image")) {
+    return data.image;
+  }
+  return null;
+}
+function ToolStep({
+  step,
+  showLine = false,
+  debug: debugProp,
+  defaultExpanded,
+  className
+}) {
+  const { isDebug, defaultDebugExpanded } = useCopilotUI();
+  const debug = debugProp ?? isDebug;
+  const [expanded, setExpanded] = React8__namespace.useState(
+    defaultExpanded ?? defaultDebugExpanded ?? false
+  );
+  const displayTitle = getDisplayTitle(step);
+  const hasDebugContent = step.args && Object.keys(step.args).length > 0 || step.result;
+  const isExecuting = step.status === "executing";
+  const isCompleted = step.status === "completed";
+  const isError = step.status === "error" || step.status === "failed" || step.status === "rejected";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", className), children: [
+    showLine && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "absolute left-[5px] top-4 bottom-0 w-px bg-border",
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2", children: [
+      !isExecuting && /* @__PURE__ */ jsxRuntime.jsx(StatusIndicator, { status: step.status, className: "mt-0.5" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => debug && hasDebugContent && setExpanded(!expanded),
+            disabled: !debug || !hasDebugContent,
+            className: cn(
+              "flex items-center gap-2 text-left min-w-0 w-full",
+              debug && hasDebugContent && "cursor-pointer hover:text-foreground",
+              !debug && "cursor-default"
+            ),
+            children: [
+              isExecuting ? /* @__PURE__ */ jsxRuntime.jsx(TextShimmerLoader, { text: displayTitle, size: "sm" }) : /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: cn(
+                    "text-sm truncate",
+                    isCompleted && "text-foreground",
+                    isError && "text-red-500",
+                    step.status === "pending" && "text-muted-foreground/60"
+                  ),
+                  children: displayTitle
+                }
+              ),
+              debug && hasDebugContent && /* @__PURE__ */ jsxRuntime.jsx(
+                "svg",
+                {
+                  className: cn(
+                    "size-3 text-muted-foreground/40 transition-transform ml-auto flex-shrink-0",
+                    expanded && "rotate-90"
+                  ),
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  strokeWidth: 2,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M9 5l7 7-7 7"
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        debug && expanded && hasDebugContent && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1.5 space-y-1.5", children: [
+          step.args && Object.keys(step.args).length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[10px] font-mono bg-muted/50 rounded px-2 py-1 overflow-x-auto", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "args: " }),
+            JSON.stringify(step.args)
+          ] }),
+          step.result && /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: cn(
+                "text-[10px] font-mono rounded px-2 py-1 overflow-x-auto whitespace-pre-wrap break-all",
+                step.result.success !== false ? "bg-green-500/10 text-green-600 dark:text-green-400" : "bg-red-500/10 text-red-600 dark:text-red-400"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "result: " }),
+                formatResult(step.result),
+                getResultImage(step.result) && /* @__PURE__ */ jsxRuntime.jsx(
+                  "img",
+                  {
+                    src: getResultImage(step.result),
+                    alt: "Screenshot",
+                    className: "mt-1.5 rounded border border-border max-w-full max-h-48 object-contain"
+                  }
+                )
+              ]
+            }
+          )
+        ] }),
+        isError && step.error && !step.result && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[10px] font-mono bg-red-500/10 text-red-600 dark:text-red-400 rounded px-1.5 py-0.5", children: step.error })
+      ] })
+    ] })
+  ] });
+}
+function ToolSteps({
+  steps,
+  debug,
+  defaultExpanded = false,
+  className
+}) {
+  if (steps.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-1.5", className), children: steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    ToolStep,
+    {
+      step,
+      showLine: index < steps.length - 1,
+      debug,
+      defaultExpanded
+    },
+    step.id
+  )) });
+}
+function InlineToolSteps({
+  steps,
+  maxVisible = 5,
+  className
+}) {
+  if (steps.length === 0) return null;
+  const visibleSteps = steps.slice(0, maxVisible);
+  const hiddenCount = steps.length - maxVisible;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-1", className), children: [
+    visibleSteps.map((step) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        title: `${step.name}: ${step.status}`,
+        className: "flex items-center",
+        children: /* @__PURE__ */ jsxRuntime.jsx(StatusIndicator, { status: step.status })
+      },
+      step.id
+    )),
+    hiddenCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+      "+",
+      hiddenCount
+    ] })
+  ] });
+}
+function SendIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m22 2-7 20-4-9-9-4Z" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M22 2 11 13" })
+      ]
+    }
+  );
+}
+function StopIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" })
+    }
+  );
+}
+function CloseIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+      ]
+    }
+  );
+}
+function ChevronDownIcon2({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+    }
+  );
+}
+function ChevronUpIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m18 15-6-6-6 6" })
+    }
+  );
+}
+function CopyIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("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__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" })
+    }
+  );
+}
+function ThumbsUpIcon2({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 10v12" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z" })
+      ]
+    }
+  );
+}
+function ThumbsDownIcon2({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 14V2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z" })
+      ]
+    }
+  );
+}
+function RefreshIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 3v5h-5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8 16H3v5" })
+      ]
+    }
+  );
+}
+function UserIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "7", r: "4" })
+      ]
+    }
+  );
+}
+function BotIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 8V4H8" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "16", height: "12", x: "4", y: "8", rx: "2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 14h2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 14h2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 13v2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 13v2" })
+      ]
+    }
+  );
+}
+function PlusIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12h14" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 5v14" })
+      ]
+    }
+  );
+}
+function ArrowUpIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m5 12 7-7 7 7" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 19V5" })
+      ]
+    }
+  );
+}
+function XIcon2({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
+      ]
+    }
+  );
+}
+function AlertTriangleIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 9v4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 17h.01" })
+      ]
+    }
+  );
+}
+var ConfirmationContext = React8__namespace.createContext(null);
+function useConfirmationContext() {
+  const context = React8__namespace.useContext(ConfirmationContext);
+  if (!context) {
+    throw new Error(
+      "Confirmation components must be used within a Confirmation provider"
+    );
+  }
+  return context;
+}
+function Confirmation({
+  children,
+  state = "pending",
+  message,
+  onApprove,
+  onReject,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ConfirmationContext.Provider,
+    {
+      value: { state, message, onApprove, onReject },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "confirmation rounded-lg border bg-card text-card-foreground",
+            className
+          ),
+          children
+        }
+      )
+    }
+  );
+}
+function ConfirmationPending({
+  children,
+  className
+}) {
+  const { state } = useConfirmationContext();
+  if (state !== "pending") return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("p-4", className), children });
+}
+function ConfirmationApproved({
+  children,
+  className
+}) {
+  const { state } = useConfirmationContext();
+  if (state !== "approved") return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 px-4 py-2 text-sm text-green-600 dark:text-green-400",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { className: "h-4 w-4" }),
+        children || /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Approved" })
+      ]
+    }
+  );
+}
+function ConfirmationRejected({
+  children,
+  className
+}) {
+  const { state } = useConfirmationContext();
+  if (state !== "rejected") return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 px-4 py-2 text-sm text-red-600 dark:text-red-400",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(XIcon2, { className: "h-4 w-4" }),
+        children || /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Rejected" })
+      ]
+    }
+  );
+}
+function ConfirmationMessage({
+  children,
+  className
+}) {
+  const { message } = useConfirmationContext();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-start gap-3", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AlertTriangleIcon, { className: "mt-0.5 h-5 w-5 flex-shrink-0 text-amber-500" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground", children: children || message || "This action requires your approval." })
+  ] });
+}
+function ConfirmationActions({
+  children,
+  className,
+  rejectLabel = "Reject",
+  approveLabel = "Approve"
+}) {
+  const { onApprove, onReject } = useConfirmationContext();
+  if (children) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-3 flex justify-end gap-2", className), children });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-3 flex justify-end gap-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "sm", onClick: onReject, children: rejectLabel }),
+    /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "default", size: "sm", onClick: onApprove, children: approveLabel })
+  ] });
+}
+function SimpleConfirmation({
+  state,
+  message,
+  onApprove,
+  onReject,
+  rejectLabel,
+  approveLabel,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Confirmation,
+    {
+      state,
+      message,
+      onApprove,
+      onReject,
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ConfirmationPending, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ConfirmationMessage, {}),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ConfirmationActions,
+            {
+              rejectLabel,
+              approveLabel
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(ConfirmationApproved, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(ConfirmationRejected, {})
+      ]
+    }
+  );
+}
+var DEFAULT_PERMISSION_OPTIONS = [
+  {
+    value: "ask",
+    label: "Ask every time",
+    description: "Always prompt before this tool runs"
+  },
+  {
+    value: "allow_always",
+    label: "Allow always",
+    description: "Never ask again, always approve"
+  },
+  {
+    value: "session",
+    label: "Allow this session",
+    description: "Allow until you close this page"
+  },
+  {
+    value: "deny_always",
+    label: "Deny always",
+    description: "Never ask again, always deny"
+  }
+];
+function PermissionConfirmation({
+  state,
+  toolName,
+  message,
+  onApprove,
+  onReject,
+  showPermissionOptions = true,
+  permissionOptions = DEFAULT_PERMISSION_OPTIONS,
+  className
+}) {
+  const [selectedPermission, setSelectedPermission] = React8__namespace.useState("ask");
+  const [showOptions, setShowOptions] = React8__namespace.useState(false);
+  const handleApprove = () => {
+    onApprove?.(selectedPermission);
+  };
+  const handleReject = () => {
+    onReject?.(
+      selectedPermission === "deny_always" ? "deny_always" : void 0
+    );
+  };
+  if (state === "approved") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-2 px-4 py-2 text-sm text-green-600 dark:text-green-400 rounded-lg border bg-green-50 dark:bg-green-950/20",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Approved" })
+        ]
+      }
+    );
+  }
+  if (state === "rejected") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-2 px-4 py-2 text-sm text-red-600 dark:text-red-400 rounded-lg border bg-red-50 dark:bg-red-950/20",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(XIcon2, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Rejected" })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "rounded-lg border bg-card text-card-foreground p-4",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 mb-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(AlertTriangleIcon, { className: "mt-0.5 h-5 w-5 flex-shrink-0 text-amber-500" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+            toolName && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-foreground", children: toolName }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: message || "This tool requires your approval to execute." })
+          ] })
+        ] }),
+        showPermissionOptions && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => setShowOptions(!showOptions),
+              className: "flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: permissionOptions.find((o) => o.value === selectedPermission)?.label }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "svg",
+                  {
+                    className: cn(
+                      "h-4 w-4 transition-transform",
+                      showOptions && "rotate-180"
+                    ),
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    strokeWidth: 2,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(
+                      "path",
+                      {
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round",
+                        d: "M19 9l-7 7-7-7"
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          showOptions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 space-y-1 pl-1", children: permissionOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "label",
+            {
+              className: cn(
+                "flex items-start gap-2 p-2 rounded-md cursor-pointer transition-colors",
+                selectedPermission === option.value ? "bg-primary/10" : "hover:bg-muted/50"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "input",
+                  {
+                    type: "radio",
+                    name: "permission",
+                    value: option.value,
+                    checked: selectedPermission === option.value,
+                    onChange: () => setSelectedPermission(option.value),
+                    className: "mt-0.5"
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium", children: option.label }),
+                  option.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-muted-foreground", children: option.description })
+                ] })
+              ]
+            },
+            option.value
+          )) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "sm", onClick: handleReject, children: "Deny" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "default", size: "sm", onClick: handleApprove, children: "Allow" })
+        ] })
+      ]
+    }
+  );
+}
+function CompactPermissionConfirmation({
+  state,
+  message,
+  onApprove,
+  onReject,
+  className
+}) {
+  const [rememberChoice, setRememberChoice] = React8__namespace.useState(false);
+  const handleApprove = () => {
+    onApprove?.(rememberChoice ? "allow_always" : "ask");
+  };
+  const handleReject = () => {
+    onReject?.(rememberChoice ? "deny_always" : void 0);
+  };
+  if (state === "approved") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-2 px-4 py-2 text-sm text-green-600 dark:text-green-400",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Approved" })
+        ]
+      }
+    );
+  }
+  if (state === "rejected") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-2 px-4 py-2 text-sm text-red-600 dark:text-red-400",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(XIcon2, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Rejected" })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "rounded-lg border bg-card text-card-foreground p-4",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3 mb-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(AlertTriangleIcon, { className: "mt-0.5 h-5 w-5 flex-shrink-0 text-amber-500" }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground", children: message || "This action requires your approval." })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center gap-2 text-sm text-muted-foreground cursor-pointer", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                type: "checkbox",
+                checked: rememberChoice,
+                onChange: (e) => setRememberChoice(e.target.checked),
+                className: "rounded border-gray-300"
+              }
+            ),
+            "Don't ask again"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "sm", onClick: handleReject, children: "Deny" }),
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "default", size: "sm", onClick: handleApprove, children: "Allow" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function parseFollowUps(content) {
+  if (!content) {
+    return { cleanContent: content, followUps: [] };
+  }
+  const followUpRegex = /\[FOLLOWUP:\s*([^\]]+)\]/gi;
+  const matches = content.match(followUpRegex);
+  if (!matches || matches.length === 0) {
+    return { cleanContent: content, followUps: [] };
+  }
+  const lastMatch = matches[matches.length - 1];
+  const innerContent = lastMatch.replace(/\[FOLLOWUP:\s*|\]/gi, "");
+  const followUps = innerContent.split("|").map((q) => q.trim()).filter((q) => q.length > 0);
+  const cleanContent = content.replace(followUpRegex, "").trim();
+  return { cleanContent, followUps };
+}
+function FollowUpQuestions({
+  questions,
+  onSelect,
+  className,
+  buttonClassName
+}) {
+  if (!questions || questions.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-2 mt-2", className), children: questions.map((question, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      onClick: () => onSelect(question),
+      className: cn(
+        "px-3 py-1.5 text-sm rounded-full",
+        "bg-primary/10 hover:bg-primary/20 text-primary",
+        "border border-primary/20 hover:border-primary/40",
+        "transition-colors duration-150",
+        "text-left whitespace-nowrap",
+        buttonClassName
+      ),
+      children: question
+    },
+    index
+  )) });
+}
+function DevLogger({
+  state,
+  position = "bottom-right",
+  className
+}) {
+  const [isOpen, setIsOpen] = React8.useState(false);
+  const [activeTab, setActiveTab] = React8.useState("chat");
+  const positionClasses = {
+    "bottom-left": "bottom-4 left-4",
+    "bottom-right": "bottom-4 right-4",
+    "top-left": "top-4 left-4",
+    "top-right": "top-4 right-4"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsOpen(true),
+        className: cn(
+          "fixed z-[9999] flex items-center justify-center",
+          "w-12 h-12 rounded-full shadow-lg",
+          "bg-orange-500 hover:bg-orange-600 text-white",
+          "transition-transform hover:scale-110",
+          positionClasses[position],
+          className
+        ),
+        title: "Open SDK DevLogger",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "svg",
+          {
+            className: "w-6 h-6",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            stroke: "currentColor",
+            strokeWidth: 2,
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                d: "M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"
+              }
+            )
+          }
+        )
+      }
+    ),
+    isOpen && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "fixed inset-0 z-[10000] flex items-center justify-center bg-black/50",
+        onClick: () => setIsOpen(false),
+        children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: "bg-background border rounded-lg shadow-xl w-[600px] max-h-[80vh] overflow-hidden",
+            onClick: (e) => e.stopPropagation(),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-muted/50", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-3 h-3 rounded-full bg-orange-500" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-semibold text-sm", children: "Copilot SDK DevLogger" })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setIsOpen(false),
+                    className: "text-muted-foreground hover:text-foreground",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(
+                      "svg",
+                      {
+                        className: "w-5 h-5",
+                        fill: "none",
+                        viewBox: "0 0 24 24",
+                        stroke: "currentColor",
+                        children: /* @__PURE__ */ jsxRuntime.jsx(
+                          "path",
+                          {
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round",
+                            strokeWidth: 2,
+                            d: "M6 18L18 6M6 6l12 12"
+                          }
+                        )
+                      }
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex border-b", children: ["chat", "tools", "agent", "config"].map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setActiveTab(tab),
+                  className: cn(
+                    "px-4 py-2 text-sm font-medium capitalize",
+                    activeTab === tab ? "border-b-2 border-primary text-primary" : "text-muted-foreground hover:text-foreground"
+                  ),
+                  children: tab
+                },
+                tab
+              )) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 overflow-y-auto max-h-[60vh]", children: [
+                activeTab === "chat" && /* @__PURE__ */ jsxRuntime.jsx(ChatTab, { state }),
+                activeTab === "tools" && /* @__PURE__ */ jsxRuntime.jsx(ToolsTab, { state }),
+                activeTab === "agent" && /* @__PURE__ */ jsxRuntime.jsx(AgentTab, { state }),
+                activeTab === "config" && /* @__PURE__ */ jsxRuntime.jsx(ConfigTab, { state })
+              ] })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}
+function ChatTab({ state }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Section, { title: "Status", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Loading", value: state.chat.isLoading ? "Yes" : "No" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Message Count", value: state.chat.messageCount }),
+    /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Thread ID", value: state.chat.threadId, mono: true }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Row,
+      {
+        label: "Error",
+        value: state.chat.error || "None",
+        valueClass: state.chat.error ? "text-red-500" : "text-green-500"
+      }
+    )
+  ] }) });
+}
+function ToolsTab({ state }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Section, { title: "Smart Context", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Enabled", value: state.tools.isEnabled ? "Yes" : "No" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Capturing", value: state.tools.isCapturing ? "Yes" : "No" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Row,
+        {
+          label: "Pending Consent",
+          value: state.tools.pendingConsent ? "Yes" : "No"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Section, { title: "Registered Tools", children: state.registered.tools.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No tools registered" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: state.registered.tools.map((tool) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: "flex items-center justify-between text-sm",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("code", { className: "bg-muted px-1.5 py-0.5 rounded text-xs", children: tool.name }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-xs", children: tool.location })
+        ]
+      },
+      tool.name
+    )) }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(Section, { title: "Permissions", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Loaded", value: state.permissions.loaded ? "Yes" : "No" }),
+      state.permissions.stored.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 space-y-1", children: state.permissions.stored.map((p) => /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "flex items-center justify-between text-sm",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("code", { className: "bg-muted px-1.5 py-0.5 rounded text-xs", children: p.toolName }),
+            /* @__PURE__ */ jsxRuntime.jsx(Badge, { level: p.level })
+          ]
+        },
+        p.toolName
+      )) })
+    ] })
+  ] });
+}
+function AgentTab({ state }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Section, { title: "Loop State", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Row,
+        {
+          label: "Iteration",
+          value: `${state.agentLoop.iteration} / ${state.agentLoop.maxIterations}`
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Row,
+        {
+          label: "Pending Approvals",
+          value: state.agentLoop.pendingApprovals
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Section, { title: "Tool Executions", children: state.agentLoop.toolExecutions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No executions" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: state.agentLoop.toolExecutions.map((exec) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: "border rounded p-2 text-sm space-y-1",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("code", { className: "font-medium", children: exec.name }),
+            /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: exec.status })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+              "ID: ",
+              exec.id.slice(0, 12),
+              "..."
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+              "Approval: ",
+              exec.approvalStatus
+            ] })
+          ] })
+        ]
+      },
+      exec.id
+    )) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(Section, { title: "Registered Actions", children: state.registered.actions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No actions registered" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1", children: state.registered.actions.map((action) => /* @__PURE__ */ jsxRuntime.jsx(
+      "code",
+      {
+        className: "bg-muted px-1.5 py-0.5 rounded text-xs",
+        children: action.name
+      },
+      action.name
+    )) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(Section, { title: "Context Tree", children: /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Context Items", value: state.registered.contextCount }) })
+  ] });
+}
+function ConfigTab({ state }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Section, { title: "Provider", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Provider", value: state.config.provider || "Not set" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Row, { label: "Model", value: state.config.model || "Default" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Row,
+      {
+        label: "Runtime URL",
+        value: state.config.runtimeUrl || "Not set",
+        mono: true
+      }
+    )
+  ] }) });
+}
+function Section({
+  title,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wide mb-2", children: title }),
+    children
+  ] });
+}
+function Row({
+  label,
+  value,
+  mono,
+  valueClass
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between py-1 text-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: cn(
+          mono && "font-mono text-xs bg-muted px-1.5 py-0.5 rounded",
+          valueClass
+        ),
+        children: value
+      }
+    )
+  ] });
+}
+function Badge({ level }) {
+  const colors = {
+    allow_always: "bg-green-100 text-green-800",
+    deny_always: "bg-red-100 text-red-800",
+    session: "bg-blue-100 text-blue-800",
+    ask: "bg-gray-100 text-gray-800"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: cn(
+        "px-1.5 py-0.5 rounded text-xs font-medium",
+        colors[level] || colors.ask
+      ),
+      children: level
+    }
+  );
+}
+function StatusBadge({ status }) {
+  const colors = {
+    pending: "bg-yellow-100 text-yellow-800",
+    executing: "bg-blue-100 text-blue-800",
+    completed: "bg-green-100 text-green-800",
+    error: "bg-red-100 text-red-800"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: cn(
+        "px-1.5 py-0.5 rounded text-xs font-medium",
+        colors[status] || "bg-gray-100 text-gray-800"
+      ),
+      children: status
+    }
+  );
+}
+var icons = {
+  vision: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3" })
+  ] }),
+  tools: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsxRuntime.jsx("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" }) }),
+  thinking: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
+  ] }),
+  streaming: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M22 12h-4l-3 9L9 3l-3 9H2" }) }),
+  pdf: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "14 2 14 8 20 8" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
+    /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "10 9 9 9 8 9" })
+  ] }),
+  audio: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
+  ] }),
+  video: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: "23 7 16 12 23 17 23 7" }),
+    /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "1", y: "5", width: "15", height: "14", rx: "2", ry: "2" })
+  ] }),
+  json: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 6h16" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 12h16" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 18h12" })
+  ] })
+};
+var labels = {
+  vision: "Vision",
+  tools: "Tools",
+  thinking: "Thinking",
+  streaming: "Streaming",
+  pdf: "PDF",
+  audio: "Audio",
+  video: "Video",
+  json: "JSON"
+};
+var descriptions = {
+  vision: "Supports image inputs",
+  tools: "Supports function calling",
+  thinking: "Extended reasoning mode",
+  streaming: "Real-time streaming",
+  pdf: "Can process PDF files",
+  audio: "Supports audio inputs",
+  video: "Supports video inputs",
+  json: "Structured JSON output"
+};
+function CapabilityBadge({
+  type,
+  supported = true,
+  showLabel = false,
+  size = "sm",
+  className
+}) {
+  const sizeClasses = {
+    sm: "h-5 px-1.5 text-[10px]",
+    md: "h-6 px-2 text-xs",
+    lg: "h-7 px-2.5 text-sm"
+  };
+  const iconSizes = {
+    sm: "w-3 h-3",
+    md: "w-3.5 h-3.5",
+    lg: "w-4 h-4"
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "inline-flex items-center gap-1 rounded-full font-medium transition-colors",
+        sizeClasses[size],
+        supported ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground opacity-50",
+        className
+      ),
+      title: `${labels[type]}: ${descriptions[type]}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("flex-shrink-0", iconSizes[size]), children: icons[type] }),
+        showLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels[type] })
+      ]
+    }
+  );
+}
+function CapabilityList({
+  capabilities,
+  showLabels = false,
+  onlySupported = true,
+  size = "sm",
+  className
+}) {
+  const items = [
+    { type: "vision", supported: capabilities.supportsVision ?? false },
+    { type: "tools", supported: capabilities.supportsTools ?? false },
+    { type: "thinking", supported: capabilities.supportsThinking ?? false },
+    { type: "streaming", supported: capabilities.supportsStreaming ?? false },
+    { type: "pdf", supported: capabilities.supportsPDF ?? false },
+    { type: "audio", supported: capabilities.supportsAudio ?? false },
+    { type: "video", supported: capabilities.supportsVideo ?? false },
+    { type: "json", supported: capabilities.supportsJsonMode ?? false }
+  ];
+  const filteredItems = onlySupported ? items.filter((item) => item.supported) : items;
+  if (filteredItems.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-1", className), children: filteredItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+    CapabilityBadge,
+    {
+      type: item.type,
+      supported: item.supported,
+      showLabel: showLabels,
+      size
+    },
+    item.type
+  )) });
+}
+function ModelSelector({
+  value,
+  onChange,
+  providers,
+  models,
+  currentCapabilities,
+  placeholder = "Select model...",
+  disabled = false,
+  size = "md",
+  showCapabilities = true,
+  className
+}) {
+  const [isOpen, setIsOpen] = React8__namespace.useState(false);
+  const containerRef = React8__namespace.useRef(null);
+  React8__namespace.useEffect(() => {
+    function handleClickOutside(event) {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const selectedModel = React8__namespace.useMemo(() => {
+    if (!value) return null;
+    if (providers) {
+      for (const provider of providers) {
+        const model = provider.models.find((m) => m.id === value);
+        if (model) return { ...model, provider: provider.name };
+      }
+    }
+    if (models) {
+      return models.find((m) => m.id === value) || null;
+    }
+    return null;
+  }, [value, providers, models]);
+  const sizeClasses = {
+    sm: "h-8 text-xs px-2",
+    md: "h-9 text-sm px-3",
+    lg: "h-10 text-base px-4"
+  };
+  const handleSelect = (modelId, provider) => {
+    onChange?.(modelId, provider);
+    setIsOpen(false);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: cn("relative", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => !disabled && setIsOpen(!isOpen),
+        disabled,
+        className: cn(
+          "flex items-center justify-between gap-2 w-full rounded-md border bg-background",
+          "hover:bg-accent hover:text-accent-foreground",
+          "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          sizeClasses[size]
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 min-w-0", children: selectedModel ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-medium", children: selectedModel.name || selectedModel.id }),
+            selectedModel.provider && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-[10px] uppercase", children: selectedModel.provider })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: placeholder }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              className: cn(
+                "w-4 h-4 flex-shrink-0 text-muted-foreground transition-transform",
+                isOpen && "rotate-180"
+              ),
+              fill: "none",
+              viewBox: "0 0 24 24",
+              stroke: "currentColor",
+              strokeWidth: 2,
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  d: "M19 9l-7 7-7-7"
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    showCapabilities && currentCapabilities && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+      CapabilityList,
+      {
+        capabilities: currentCapabilities,
+        size: "sm",
+        onlySupported: true
+      }
+    ) }),
+    isOpen && /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "absolute z-50 top-full left-0 right-0 mt-1",
+          "max-h-[300px] overflow-auto",
+          "rounded-md border bg-popover text-popover-foreground shadow-md",
+          "animate-in fade-in-0 zoom-in-95"
+        ),
+        children: [
+          providers?.map((provider) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-1.5 text-[10px] font-semibold text-muted-foreground uppercase tracking-wider bg-muted/50", children: provider.label || provider.name }),
+            provider.models.map((model) => /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleSelect(model.id, provider.name),
+                className: cn(
+                  "flex flex-col gap-0.5 w-full px-3 py-2 text-left",
+                  "hover:bg-accent hover:text-accent-foreground",
+                  "focus:bg-accent focus:text-accent-foreground focus:outline-none",
+                  value === model.id && "bg-accent"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-sm", children: model.name || model.id }),
+                    value === model.id && /* @__PURE__ */ jsxRuntime.jsx(
+                      "svg",
+                      {
+                        className: "w-4 h-4 text-primary",
+                        fill: "none",
+                        viewBox: "0 0 24 24",
+                        stroke: "currentColor",
+                        strokeWidth: 2,
+                        children: /* @__PURE__ */ jsxRuntime.jsx(
+                          "path",
+                          {
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round",
+                            d: "M5 13l4 4L19 7"
+                          }
+                        )
+                      }
+                    )
+                  ] }),
+                  showCapabilities && model.capabilities && /* @__PURE__ */ jsxRuntime.jsx(
+                    CapabilityList,
+                    {
+                      capabilities: model.capabilities,
+                      size: "sm",
+                      onlySupported: true
+                    }
+                  )
+                ]
+              },
+              model.id
+            ))
+          ] }, provider.name)),
+          models?.map((model) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => handleSelect(model.id, model.provider),
+              className: cn(
+                "flex flex-col gap-0.5 w-full px-3 py-2 text-left",
+                "hover:bg-accent hover:text-accent-foreground",
+                "focus:bg-accent focus:text-accent-foreground focus:outline-none",
+                value === model.id && "bg-accent"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-sm", children: model.name || model.id }),
+                  model.provider && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-[10px] uppercase", children: model.provider }),
+                  value === model.id && /* @__PURE__ */ jsxRuntime.jsx(
+                    "svg",
+                    {
+                      className: "w-4 h-4 text-primary ml-auto",
+                      fill: "none",
+                      viewBox: "0 0 24 24",
+                      stroke: "currentColor",
+                      strokeWidth: 2,
+                      children: /* @__PURE__ */ jsxRuntime.jsx(
+                        "path",
+                        {
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          d: "M5 13l4 4L19 7"
+                        }
+                      )
+                    }
+                  )
+                ] }),
+                showCapabilities && model.capabilities && /* @__PURE__ */ jsxRuntime.jsx(
+                  CapabilityList,
+                  {
+                    capabilities: model.capabilities,
+                    size: "sm",
+                    onlySupported: true
+                  }
+                )
+              ]
+            },
+            model.id
+          )),
+          !providers?.length && !models?.length && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 py-4 text-center text-sm text-muted-foreground", children: "No models available" })
+        ]
+      }
+    )
+  ] });
+}
+function SimpleModelSelector({
+  value,
+  onChange,
+  models,
+  disabled = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "select",
+    {
+      value: value || "",
+      onChange: (e) => onChange?.(e.target.value),
+      disabled,
+      className: cn(
+        "h-9 px-3 rounded-md border bg-background text-sm",
+        "focus:outline-none focus:ring-2 focus:ring-ring",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: "Select model..." }),
+        models.map((modelId) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: modelId, children: modelId }, modelId))
+      ]
+    }
+  );
+}
+function ChatHeader({ title, onClose, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center justify-between border-b px-4 py-3",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-semibold text-foreground", children: title || "Chat" }),
+        onClose && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            className: "rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+            "aria-label": "Close chat",
+            children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-5 w-5" })
+          }
+        )
+      ]
+    }
+  );
+}
+function Suggestions({
+  suggestions,
+  onSuggestionClick,
+  className
+}) {
+  if (!suggestions.length) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-2 px-4 py-2", className), children: suggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      onClick: () => onSuggestionClick?.(suggestion),
+      className: "inline-flex items-center rounded-full border bg-background px-3 py-1.5 text-sm transition-colors hover:bg-muted",
+      children: suggestion
+    },
+    index
+  )) });
+}
+function DefaultMessage({
+  message,
+  userAvatar,
+  assistantAvatar,
+  showUserAvatar = false,
+  userMessageClassName,
+  assistantMessageClassName,
+  size = "sm",
+  isLastMessage = false,
+  isLoading = false,
+  toolRenderers,
+  onApproveToolExecution,
+  onRejectToolExecution,
+  showFollowUps = true,
+  onFollowUpClick,
+  followUpClassName,
+  followUpButtonClassName
+}) {
+  const isUser = message.role === "user";
+  const isStreaming = isLastMessage && isLoading;
+  const { cleanContent, followUps } = React8__namespace.useMemo(() => {
+    if (isUser || !message.content) {
+      return { cleanContent: message.content, followUps: [] };
+    }
+    return parseFollowUps(message.content);
+  }, [message.content, isUser]);
+  const shouldShowFollowUps = showFollowUps && !isUser && isLastMessage && !isLoading && followUps.length > 0 && onFollowUpClick;
+  if (isUser) {
+    const hasAttachments = message.attachments && message.attachments.length > 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      Message,
+      {
+        className: cn(
+          "flex gap-2",
+          showUserAvatar ? "justify-end" : "justify-end"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end max-w-[80%]", children: [
+            message.content && /* @__PURE__ */ jsxRuntime.jsx(
+              MessageContent,
+              {
+                className: cn(
+                  "rounded-lg px-4 py-2 bg-primary text-primary-foreground",
+                  userMessageClassName
+                ),
+                size,
+                children: message.content
+              }
+            ),
+            hasAttachments && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 flex flex-wrap gap-2 justify-end", children: message.attachments.map((attachment, index) => /* @__PURE__ */ jsxRuntime.jsx(AttachmentPreview, { attachment }, index)) })
+          ] }),
+          showUserAvatar && /* @__PURE__ */ jsxRuntime.jsx(
+            MessageAvatar,
+            {
+              src: userAvatar.src || "",
+              alt: "User",
+              fallback: userAvatar.fallback
+            }
+          )
+        ]
+      }
+    );
+  }
+  const pendingApprovalTools = message.toolExecutions?.filter(
+    (exec) => exec.approvalStatus === "required"
+  );
+  const completedTools = message.toolExecutions?.filter(
+    (exec) => exec.approvalStatus !== "required"
+  );
+  const toolsWithCustomRenderer = completedTools?.filter(
+    (exec) => toolRenderers && toolRenderers[exec.name]
+  );
+  const toolsWithoutCustomRenderer = completedTools?.filter(
+    (exec) => !toolRenderers || !toolRenderers[exec.name]
+  );
+  const toolSteps = toolsWithoutCustomRenderer?.map((exec) => ({
+    id: exec.id,
+    name: exec.name,
+    args: exec.args,
+    status: exec.status,
+    result: exec.result,
+    error: exec.error
+  }));
+  return /* @__PURE__ */ jsxRuntime.jsxs(Message, { className: "flex gap-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MessageAvatar,
+      {
+        src: assistantAvatar.src || "",
+        alt: "Assistant",
+        fallback: assistantAvatar.fallback,
+        className: "bg-primary text-primary-foreground"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0 max-w-[80%]", children: [
+      message.thinking && /* @__PURE__ */ jsxRuntime.jsx(
+        SimpleReasoning,
+        {
+          content: message.thinking,
+          isStreaming,
+          className: "mb-2"
+        }
+      ),
+      cleanContent?.trim() && /* @__PURE__ */ jsxRuntime.jsx(
+        MessageContent,
+        {
+          className: cn(
+            "rounded-lg px-4 py-2 bg-muted",
+            assistantMessageClassName
+          ),
+          markdown: true,
+          size,
+          children: cleanContent
+        }
+      ),
+      toolsWithCustomRenderer && toolsWithCustomRenderer.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 space-y-2", children: toolsWithCustomRenderer.map((exec) => {
+        const Renderer = toolRenderers[exec.name];
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          Renderer,
+          {
+            execution: {
+              id: exec.id,
+              name: exec.name,
+              args: exec.args,
+              status: exec.status,
+              result: exec.result,
+              error: exec.error,
+              approvalStatus: exec.approvalStatus
+            }
+          },
+          exec.id
+        );
+      }) }),
+      toolSteps && toolSteps.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 rounded-lg bg-muted/50 px-3 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(ToolSteps, { steps: toolSteps }) }),
+      pendingApprovalTools && pendingApprovalTools.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 space-y-2", children: pendingApprovalTools.map((tool) => /* @__PURE__ */ jsxRuntime.jsx(
+        PermissionConfirmation,
+        {
+          state: "pending",
+          toolName: tool.name,
+          message: tool.approvalMessage || `This tool wants to execute. Do you approve?`,
+          onApprove: (permissionLevel) => onApproveToolExecution?.(tool.id, permissionLevel),
+          onReject: (permissionLevel) => onRejectToolExecution?.(tool.id, void 0, permissionLevel)
+        },
+        tool.id
+      )) }),
+      message.attachments && message.attachments.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: message.attachments.map((attachment, index) => /* @__PURE__ */ jsxRuntime.jsx(AttachmentPreview, { attachment }, index)) }),
+      shouldShowFollowUps && /* @__PURE__ */ jsxRuntime.jsx(
+        FollowUpQuestions,
+        {
+          questions: followUps,
+          onSelect: onFollowUpClick,
+          className: followUpClassName,
+          buttonClassName: followUpButtonClassName
+        }
+      )
+    ] })
+  ] });
+}
+function AttachmentPreview({ attachment }) {
+  const [expanded, setExpanded] = React8__namespace.useState(false);
+  if (attachment.type !== "image") {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 rounded-lg border bg-muted/50 px-3 py-2 text-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: attachment.type }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: attachment.filename || "Attachment" })
+    ] });
+  }
+  let src;
+  if (attachment.url) {
+    src = attachment.url;
+  } else if (attachment.data) {
+    src = attachment.data.startsWith("data:") ? attachment.data : `data:${attachment.mimeType};base64,${attachment.data}`;
+  } else {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setExpanded(true),
+        className: "relative rounded-lg overflow-hidden border bg-muted/50 hover:opacity-90 transition-opacity",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            src,
+            alt: attachment.filename || "Image",
+            className: "max-w-[200px] max-h-[150px] object-cover"
+          }
+        )
+      }
+    ),
+    expanded && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "fixed inset-0 z-50 flex items-center justify-center bg-black/80",
+        onClick: () => setExpanded(false),
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative max-w-[90vw] max-h-[90vh]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src,
+              alt: attachment.filename || "Image (expanded)",
+              className: "max-w-full max-h-full object-contain rounded-lg"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "absolute top-2 right-2 bg-white/90 rounded-full p-2 hover:bg-white transition-colors",
+              onClick: (e) => {
+                e.stopPropagation();
+                setExpanded(false);
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                "svg",
+                {
+                  className: "w-4 h-4",
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  strokeWidth: 2,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M6 18L18 6M6 6l12 12"
+                    }
+                  )
+                }
+              )
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+}
+var DEFAULT_MAX_FILE_SIZE = 5 * 1024 * 1024;
+var DEFAULT_ALLOWED_TYPES = ["image/*", "application/pdf"];
+function getAttachmentType(mimeType) {
+  if (mimeType.startsWith("image/")) return "image";
+  if (mimeType.startsWith("audio/")) return "audio";
+  if (mimeType.startsWith("video/")) return "video";
+  return "file";
+}
+function fileToBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => {
+      if (typeof reader.result === "string") {
+        resolve(reader.result);
+      } else {
+        reject(new Error("Failed to read file"));
+      }
+    };
+    reader.onerror = () => reject(new Error("Failed to read file"));
+    reader.readAsDataURL(file);
+  });
+}
+function generateAttachmentId() {
+  return `att_${Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
+}
+function Chat({
+  // Core
+  messages = [],
+  onSendMessage,
+  onStop,
+  isLoading = false,
+  // Labels
+  placeholder = "Type a message...",
+  welcomeMessage,
+  title,
+  // Header
+  showHeader = false,
+  onClose,
+  // Appearance
+  showPoweredBy = true,
+  showUserAvatar = false,
+  userAvatar = { fallback: "U" },
+  assistantAvatar = { fallback: "AI" },
+  loaderVariant = "typing",
+  fontSize = "sm",
+  // Attachments
+  maxFileSize = DEFAULT_MAX_FILE_SIZE,
+  allowedFileTypes = DEFAULT_ALLOWED_TYPES,
+  attachmentsEnabled = true,
+  attachmentsDisabledTooltip = "Attachments not supported by this model",
+  processAttachment: processAttachmentProp,
+  // Suggestions
+  suggestions = [],
+  onSuggestionClick,
+  // Tool Executions
+  isProcessing = false,
+  toolRenderers,
+  onApproveToolExecution,
+  onRejectToolExecution,
+  // Follow-up Questions
+  showFollowUps = true,
+  followUpClassName,
+  followUpButtonClassName,
+  // Custom rendering
+  renderMessage,
+  renderInput,
+  renderHeader,
+  // Styling
+  className,
+  classNames = {}
+}) {
+  const [input, setInput] = React8.useState("");
+  const [pendingAttachments, setPendingAttachments] = React8.useState([]);
+  const [isDragging, setIsDragging] = React8.useState(false);
+  const fileInputRef = React8.useRef(null);
+  const fileInputId = React8.useId();
+  const isFileTypeAllowed = React8.useCallback(
+    (file) => {
+      for (const type of allowedFileTypes) {
+        if (type.endsWith("/*")) {
+          const category = type.slice(0, -2);
+          if (file.type.startsWith(category + "/")) return true;
+        } else if (file.type === type) {
+          return true;
+        }
+      }
+      return false;
+    },
+    [allowedFileTypes]
+  );
+  const handleFileSelect = React8.useCallback(
+    async (files) => {
+      if (!files || !attachmentsEnabled) return;
+      for (const file of Array.from(files)) {
+        if (file.size > maxFileSize) {
+          const sizeMB = (maxFileSize / (1024 * 1024)).toFixed(0);
+          console.warn(`File ${file.name} exceeds ${sizeMB}MB limit`);
+          continue;
+        }
+        if (!isFileTypeAllowed(file)) {
+          console.warn(`File type ${file.type} is not allowed`);
+          continue;
+        }
+        const id = generateAttachmentId();
+        const previewUrl = URL.createObjectURL(file);
+        setPendingAttachments((prev) => [
+          ...prev,
+          {
+            id,
+            file,
+            previewUrl,
+            attachment: {
+              type: getAttachmentType(file.type),
+              data: "",
+              mimeType: file.type,
+              filename: file.name
+            },
+            status: "processing"
+          }
+        ]);
+        try {
+          let attachment;
+          if (processAttachmentProp) {
+            attachment = await processAttachmentProp(file);
+          } else {
+            const data = await fileToBase64(file);
+            attachment = {
+              type: getAttachmentType(file.type),
+              data,
+              mimeType: file.type,
+              filename: file.name
+            };
+          }
+          setPendingAttachments(
+            (prev) => prev.map(
+              (att) => att.id === id ? { ...att, status: "ready", attachment } : att
+            )
+          );
+        } catch (error) {
+          setPendingAttachments(
+            (prev) => prev.map(
+              (att) => att.id === id ? {
+                ...att,
+                status: "error",
+                error: "Failed to process file"
+              } : att
+            )
+          );
+        }
+      }
+    },
+    [attachmentsEnabled, maxFileSize, isFileTypeAllowed, processAttachmentProp]
+  );
+  const handleInputChange = React8.useCallback(
+    (e) => {
+      handleFileSelect(e.target.files);
+      if (fileInputRef.current) {
+        fileInputRef.current.value = "";
+      }
+    },
+    [handleFileSelect]
+  );
+  const removePendingAttachment = React8.useCallback((id) => {
+    setPendingAttachments((prev) => {
+      const att = prev.find((a) => a.id === id);
+      if (att) {
+        URL.revokeObjectURL(att.previewUrl);
+      }
+      return prev.filter((a) => a.id !== id);
+    });
+  }, []);
+  const handleDragOver = React8.useCallback(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (attachmentsEnabled) {
+        setIsDragging(true);
+      }
+    },
+    [attachmentsEnabled]
+  );
+  const handleDragLeave = React8.useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDragging(false);
+  }, []);
+  const handleDrop = React8.useCallback(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      setIsDragging(false);
+      if (attachmentsEnabled) {
+        handleFileSelect(e.dataTransfer.files);
+      }
+    },
+    [attachmentsEnabled, handleFileSelect]
+  );
+  const handleSubmit = React8.useCallback(() => {
+    const hasContent = input.trim();
+    const hasAttachments = pendingAttachments.some(
+      (att) => att.status === "ready"
+    );
+    if (!hasContent && !hasAttachments || isLoading) return;
+    const attachments = pendingAttachments.filter((att) => att.status === "ready").map((att) => att.attachment);
+    onSendMessage?.(input, attachments.length > 0 ? attachments : void 0);
+    pendingAttachments.forEach((att) => URL.revokeObjectURL(att.previewUrl));
+    setPendingAttachments([]);
+    setInput("");
+  }, [input, isLoading, onSendMessage, pendingAttachments]);
+  const handleSuggestionClick = React8.useCallback(
+    (suggestion) => {
+      if (onSuggestionClick) {
+        onSuggestionClick(suggestion);
+      } else {
+        onSendMessage?.(suggestion);
+      }
+    },
+    [onSuggestionClick, onSendMessage]
+  );
+  const acceptString = allowedFileTypes.join(",");
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex h-full flex-col bg-background relative",
+        className,
+        classNames.root
+      ),
+      onDragOver: handleDragOver,
+      onDragLeave: handleDragLeave,
+      onDrop: handleDrop,
+      children: [
+        isDragging && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-50 bg-primary/10 border-2 border-dashed border-primary flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-primary font-medium text-lg", children: "Drop files here" }) }),
+        showHeader && (renderHeader ? renderHeader() : /* @__PURE__ */ jsxRuntime.jsx(
+          ChatHeader,
+          {
+            title,
+            onClose,
+            className: classNames.header
+          }
+        )),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ChatContainerRoot,
+          {
+            className: cn("relative flex-1", classNames.container),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                ChatContainerContent,
+                {
+                  className: cn("gap-4 p-4", classNames.messageList),
+                  children: [
+                    messages.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-muted-foreground", children: welcomeMessage || "Send a message to start the conversation" }),
+                    messages.map((message, index) => {
+                      const isLastMessage = index === messages.length - 1;
+                      const isEmptyAssistant = message.role === "assistant" && !message.content?.trim();
+                      const hasToolCalls = message.tool_calls && message.tool_calls.length > 0;
+                      const hasToolExecutions = message.toolExecutions && message.toolExecutions.length > 0;
+                      const hasPendingApprovals = message.toolExecutions?.some(
+                        (exec) => exec.approvalStatus === "required"
+                      );
+                      if (isEmptyAssistant) {
+                        if (hasToolCalls || hasToolExecutions) ; else if (isLastMessage && hasPendingApprovals) ; else if (isLastMessage && isLoading && !isProcessing) {
+                          return /* @__PURE__ */ jsxRuntime.jsxs(Message, { className: "flex gap-2", children: [
+                            /* @__PURE__ */ jsxRuntime.jsx(
+                              MessageAvatar,
+                              {
+                                src: assistantAvatar.src || "",
+                                alt: "Assistant",
+                                fallback: assistantAvatar.fallback,
+                                className: "bg-primary text-primary-foreground"
+                              }
+                            ),
+                            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-muted px-4 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(Loader, { variant: loaderVariant, size: "sm" }) })
+                          ] }, message.id);
+                        } else {
+                          return null;
+                        }
+                      }
+                      const savedExecutions = message.metadata?.toolExecutions;
+                      const messageToolExecutions = message.toolExecutions || savedExecutions;
+                      const messageWithExecutions = messageToolExecutions ? { ...message, toolExecutions: messageToolExecutions } : message;
+                      const handleFollowUpClick = (question) => {
+                        if (onSuggestionClick) {
+                          onSuggestionClick(question);
+                        } else {
+                          onSendMessage?.(question);
+                        }
+                      };
+                      return renderMessage ? /* @__PURE__ */ jsxRuntime.jsx(React8__namespace.default.Fragment, { children: renderMessage(messageWithExecutions, index) }, message.id) : /* @__PURE__ */ jsxRuntime.jsx(
+                        DefaultMessage,
+                        {
+                          message: messageWithExecutions,
+                          userAvatar,
+                          assistantAvatar,
+                          showUserAvatar,
+                          userMessageClassName: classNames.userMessage,
+                          assistantMessageClassName: classNames.assistantMessage,
+                          size: fontSize,
+                          isLastMessage,
+                          isLoading,
+                          toolRenderers,
+                          onApproveToolExecution,
+                          onRejectToolExecution,
+                          showFollowUps,
+                          onFollowUpClick: handleFollowUpClick,
+                          followUpClassName,
+                          followUpButtonClassName
+                        },
+                        message.id
+                      );
+                    }),
+                    isProcessing && /* @__PURE__ */ jsxRuntime.jsxs(Message, { className: "flex gap-2", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        MessageAvatar,
+                        {
+                          src: assistantAvatar?.src || "",
+                          alt: "Assistant",
+                          fallback: assistantAvatar?.fallback || "AI",
+                          className: "bg-primary text-primary-foreground"
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg bg-muted px-4 py-2 flex items-center gap-2", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(Loader, { variant: "dots", size: "sm" }),
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: "Continuing..." })
+                      ] })
+                    ] }),
+                    isLoading && !isProcessing && (() => {
+                      const lastMessage = messages[messages.length - 1];
+                      if (lastMessage?.role === "user") {
+                        return /* @__PURE__ */ jsxRuntime.jsxs(Message, { className: "flex gap-2", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            MessageAvatar,
+                            {
+                              src: assistantAvatar?.src || "",
+                              alt: "Assistant",
+                              fallback: assistantAvatar?.fallback || "AI",
+                              className: "bg-primary text-primary-foreground"
+                            }
+                          ),
+                          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-muted px-4 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(Loader, { variant: loaderVariant, size: "sm" }) })
+                        ] });
+                      }
+                      return null;
+                    })(),
+                    /* @__PURE__ */ jsxRuntime.jsx(ChatContainerScrollAnchor, {})
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-4 bottom-4", children: /* @__PURE__ */ jsxRuntime.jsx(ScrollButton, { className: "shadow-sm" }) })
+            ]
+          }
+        ),
+        suggestions.length > 0 && !isLoading && /* @__PURE__ */ jsxRuntime.jsx(
+          Suggestions,
+          {
+            suggestions,
+            onSuggestionClick: handleSuggestionClick,
+            className: classNames.suggestions
+          }
+        ),
+        renderInput ? renderInput() : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("p-2", classNames.input), children: [
+          pendingAttachments.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2 p-2 mb-2 bg-muted/30 rounded-lg", children: pendingAttachments.map((att) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative group", children: [
+            att.attachment.type === "image" ? /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: att.previewUrl,
+                alt: att.file.name,
+                className: "w-16 h-16 object-cover rounded-lg border"
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-16 h-16 bg-muted rounded-lg border flex flex-col items-center justify-center p-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "svg",
+                {
+                  className: "w-6 h-6 text-muted-foreground",
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      strokeWidth: 1.5,
+                      d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] text-muted-foreground truncate w-full text-center mt-1", children: att.file.name.length > 10 ? att.file.name.slice(0, 8) + "..." : att.file.name })
+            ] }),
+            att.status === "processing" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-background/80 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(Loader, { variant: "dots", size: "sm" }) }),
+            att.status === "error" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-destructive/20 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive text-xs", children: "Error" }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                onClick: () => removePendingAttachment(att.id),
+                className: "absolute -top-1.5 -right-1.5 bg-destructive text-destructive-foreground rounded-full p-0.5 opacity-0 group-hover:opacity-100 transition-opacity",
+                type: "button",
+                children: /* @__PURE__ */ jsxRuntime.jsx(XIcon2, { className: "w-3 h-3" })
+              }
+            )
+          ] }, att.id)) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            PromptInput,
+            {
+              value: input,
+              onValueChange: setInput,
+              isLoading,
+              onSubmit: handleSubmit,
+              className: "",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(PromptInputTextarea, { placeholder }),
+                /* @__PURE__ */ jsxRuntime.jsxs(PromptInputActions, { className: "flex justify-between", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                    PromptInputAction,
+                    {
+                      tooltip: attachmentsEnabled ? "Attach files" : attachmentsDisabledTooltip,
+                      children: /* @__PURE__ */ jsxRuntime.jsxs(
+                        "label",
+                        {
+                          htmlFor: fileInputId,
+                          className: cn(
+                            "flex h-8 w-8 items-center justify-center rounded-2xl",
+                            attachmentsEnabled ? "hover:bg-secondary-foreground/10 cursor-pointer" : "opacity-50 cursor-not-allowed"
+                          ),
+                          children: [
+                            /* @__PURE__ */ jsxRuntime.jsx(
+                              "input",
+                              {
+                                ref: fileInputRef,
+                                type: "file",
+                                multiple: true,
+                                accept: acceptString,
+                                onChange: handleInputChange,
+                                className: "hidden",
+                                id: fileInputId,
+                                disabled: !attachmentsEnabled
+                              }
+                            ),
+                            /* @__PURE__ */ jsxRuntime.jsx(PlusIcon, { className: "text-primary size-5" })
+                          ]
+                        }
+                      )
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(PromptInputAction, { tooltip: isLoading ? "Stop" : "Send", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      variant: "destructive",
+                      className: "rounded-full size-9",
+                      onClick: onStop,
+                      children: /* @__PURE__ */ jsxRuntime.jsx(StopIcon, { className: "h-4 w-4" })
+                    }
+                  ) : /* @__PURE__ */ jsxRuntime.jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      className: "rounded-full size-9",
+                      onClick: handleSubmit,
+                      disabled: !input.trim() && !pendingAttachments.some((att) => att.status === "ready"),
+                      children: /* @__PURE__ */ jsxRuntime.jsx(ArrowUpIcon, { className: "h-4 w-4" })
+                    }
+                  ) })
+                ] })
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function ToolExecutionMessage({
+  executions,
+  assistantAvatar = { fallback: "AI" },
+  onApprove,
+  onReject,
+  className
+}) {
+  if (!executions || executions.length === 0) return null;
+  const pendingApprovals = executions.filter(
+    (exec) => exec.approvalStatus === "required"
+  );
+  const otherExecutions = executions.filter(
+    (exec) => exec.approvalStatus !== "required"
+  );
+  const toolSteps = otherExecutions.map((exec) => ({
+    id: exec.id,
+    name: exec.name,
+    args: exec.args,
+    status: exec.status,
+    result: exec.result,
+    error: exec.error
+  }));
+  const hasExecuting = executions.some((exec) => exec.status === "executing");
+  executions.some((exec) => exec.status === "completed");
+  const allCompleted = executions.every(
+    (exec) => exec.status === "completed" || exec.status === "error"
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(Message, { className: cn("flex gap-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MessageAvatar,
+      {
+        src: assistantAvatar.src || "",
+        alt: "Assistant",
+        fallback: assistantAvatar.fallback,
+        className: "bg-primary text-primary-foreground"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0 max-w-[85%]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 mb-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
+        hasExecuting && /* @__PURE__ */ jsxRuntime.jsxs(
+          "svg",
+          {
+            className: "size-3.5 animate-spin text-primary",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "circle",
+                {
+                  className: "opacity-25",
+                  cx: "12",
+                  cy: "12",
+                  r: "10",
+                  stroke: "currentColor",
+                  strokeWidth: "4"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "path",
+                {
+                  className: "opacity-75",
+                  fill: "currentColor",
+                  d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+                }
+              )
+            ]
+          }
+        ),
+        !hasExecuting && allCompleted && /* @__PURE__ */ jsxRuntime.jsx(
+          "svg",
+          {
+            className: "size-3.5 text-green-500",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            stroke: "currentColor",
+            strokeWidth: 2.5,
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                d: "M5 13l4 4L19 7"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-muted-foreground", children: hasExecuting ? "Running tools..." : allCompleted ? `${executions.length} tool${executions.length > 1 ? "s" : ""} completed` : "Tools" })
+      ] }) }),
+      pendingApprovals.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 space-y-2", children: pendingApprovals.map((tool) => /* @__PURE__ */ jsxRuntime.jsx(
+        PermissionConfirmation,
+        {
+          state: "pending",
+          toolName: tool.name,
+          message: tool.approvalMessage || `This tool wants to execute. Do you approve?`,
+          onApprove: (permissionLevel) => onApprove?.(tool.id, permissionLevel),
+          onReject: (permissionLevel) => onReject?.(tool.id, void 0, permissionLevel)
+        },
+        tool.id
+      )) }),
+      toolSteps.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border bg-card px-3 py-2.5 shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(ToolSteps, { steps: toolSteps }) })
+    ] })
+  ] });
+}
+function CopilotChat(props) {
+  const {
+    messages,
+    isLoading,
+    sendMessage,
+    stop,
+    toolExecutions: rawToolExecutions,
+    approveToolExecution,
+    rejectToolExecution
+  } = chunkW6KQT7YZ_cjs.useCopilot();
+  const toolExecutions = rawToolExecutions.map(
+    (exec) => ({
+      id: exec.id,
+      name: exec.name,
+      args: exec.args,
+      status: exec.status,
+      result: exec.result,
+      error: exec.error,
+      timestamp: exec.startedAt ? exec.startedAt.getTime() : Date.now(),
+      approvalStatus: exec.approvalStatus
+    })
+  );
+  const toolResultsMap = /* @__PURE__ */ new Map();
+  messages.filter((m) => m.role === "tool" && m.toolCallId).forEach((m) => {
+    toolResultsMap.set(m.toolCallId, m.content ?? "");
+  });
+  const visibleMessages = messages.filter((m) => m.role !== "tool").map((m) => {
+    let messageToolExecutions;
+    if (m.role === "assistant" && m.toolCalls && m.toolCalls.length > 0) {
+      const toolCallIds = new Set(
+        m.toolCalls.map((tc) => tc.id)
+      );
+      const liveExecutions = toolExecutions.filter(
+        (exec) => toolCallIds.has(exec.id)
+      );
+      if (liveExecutions.length > 0) {
+        messageToolExecutions = liveExecutions.map(
+          (exec) => {
+            if (!exec.result && toolResultsMap.has(exec.id)) {
+              const resultContent = toolResultsMap.get(exec.id);
+              try {
+                return { ...exec, result: JSON.parse(resultContent) };
+              } catch {
+                return {
+                  ...exec,
+                  result: { success: true, message: resultContent }
+                };
+              }
+            }
+            return exec;
+          }
+        );
+      } else {
+        messageToolExecutions = m.toolCalls.map(
+          (tc) => {
+            const resultContent = toolResultsMap.get(tc.id);
+            let result = void 0;
+            if (resultContent) {
+              try {
+                result = JSON.parse(resultContent);
+              } catch {
+                result = { success: true, message: resultContent };
+              }
+            }
+            let args = {};
+            try {
+              args = JSON.parse(tc.function.arguments || "{}");
+            } catch {
+            }
+            return {
+              id: tc.id,
+              name: tc.function.name,
+              args,
+              status: result ? "completed" : "pending",
+              result,
+              timestamp: Date.now()
+              // Historical - use current time
+            };
+          }
+        );
+      }
+    }
+    const savedExecutions = m.metadata?.toolExecutions;
+    if (savedExecutions && savedExecutions.length > 0 && !messageToolExecutions) {
+      messageToolExecutions = savedExecutions;
+    }
+    return {
+      id: m.id,
+      role: m.role,
+      content: m.content ?? "",
+      thinking: m.thinking,
+      // Include attachments (images, files)
+      attachments: m.attachments,
+      // Include tool_calls for assistant messages
+      tool_calls: m.toolCalls,
+      // Attach matched tool executions to assistant messages
+      toolExecutions: messageToolExecutions
+    };
+  });
+  const suggestions = visibleMessages.length === 0 && props.suggestions?.length ? props.suggestions : [];
+  const lastMessage = messages[messages.length - 1];
+  const isInToolFlow = lastMessage?.role === "assistant" && lastMessage.toolCalls?.length;
+  let isProcessingToolResults = false;
+  if (isLoading && isInToolFlow) {
+    const currentToolCallIds = new Set(
+      lastMessage.toolCalls?.map(
+        (tc) => tc.id
+      ) || []
+    );
+    const currentExecutions = toolExecutions.filter(
+      (exec) => currentToolCallIds.has(exec.id)
+    );
+    const hasCompletedTools = currentExecutions.some(
+      (exec) => exec.status === "completed" || exec.status === "error" || exec.status === "failed"
+    );
+    const hasExecutingTools = currentExecutions.some(
+      (exec) => exec.status === "executing" || exec.status === "pending"
+    );
+    isProcessingToolResults = hasCompletedTools && !hasExecutingTools;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Chat,
+    {
+      ...props,
+      messages: visibleMessages,
+      onSendMessage: sendMessage,
+      onStop: stop,
+      isLoading,
+      showPoweredBy: props.showPoweredBy ?? true,
+      suggestions,
+      isProcessing: isProcessingToolResults,
+      onApproveToolExecution: approveToolExecution,
+      onRejectToolExecution: rejectToolExecution
+    }
+  );
+}
+var ConnectedChat = CopilotChat;
+function YourGPTLogo({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 17l10 5 10-5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 12l10 5 10-5" })
+      ]
+    }
+  );
+}
+function PoweredBy({ className, showLogo = true }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center justify-center gap-1.5 py-2 text-xs text-muted-foreground",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Powered by" }),
+        showLogo && /* @__PURE__ */ jsxRuntime.jsx(YourGPTLogo, { className: "h-3 w-3" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: "https://yourgpt.ai",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "font-medium text-foreground hover:underline",
+            children: "YourGPT"
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.AlertTriangleIcon = AlertTriangleIcon;
+exports.BotIcon = BotIcon;
+exports.Button = Button;
+exports.CapabilityBadge = CapabilityBadge;
+exports.CapabilityList = CapabilityList;
+exports.Chat = Chat;
+exports.ChatContainerContent = ChatContainerContent;
+exports.ChatContainerRoot = ChatContainerRoot;
+exports.ChatContainerScrollAnchor = ChatContainerScrollAnchor;
+exports.CheckIcon = CheckIcon;
+exports.ChevronDownIcon = ChevronDownIcon2;
+exports.ChevronUpIcon = ChevronUpIcon;
+exports.CloseIcon = CloseIcon;
+exports.CodeBlock = CodeBlock;
+exports.CompactPermissionConfirmation = CompactPermissionConfirmation;
+exports.Confirmation = Confirmation;
+exports.ConfirmationActions = ConfirmationActions;
+exports.ConfirmationApproved = ConfirmationApproved;
+exports.ConfirmationMessage = ConfirmationMessage;
+exports.ConfirmationPending = ConfirmationPending;
+exports.ConfirmationRejected = ConfirmationRejected;
+exports.ConnectedChat = ConnectedChat;
+exports.CopilotChat = CopilotChat;
+exports.CopilotUIProvider = CopilotUIProvider;
+exports.CopyIcon = CopyIcon;
+exports.DEFAULT_PERMISSION_OPTIONS = DEFAULT_PERMISSION_OPTIONS;
+exports.DevLogger = DevLogger;
+exports.FeedbackBar = FeedbackBar;
+exports.FollowUpQuestions = FollowUpQuestions;
+exports.InlineToolSteps = InlineToolSteps;
+exports.Loader = Loader;
+exports.Markdown = Markdown;
+exports.MessageAvatar = MessageAvatar;
+exports.MessageContent = MessageContent;
+exports.MessagePrimitive = Message;
+exports.ModelSelector = ModelSelector;
+exports.PermissionConfirmation = PermissionConfirmation;
+exports.PoweredBy = PoweredBy;
+exports.PromptInput = PromptInput;
+exports.PromptInputAction = PromptInputAction;
+exports.PromptInputActions = PromptInputActions;
+exports.PromptInputTextarea = PromptInputTextarea;
+exports.Reasoning = Reasoning;
+exports.ReasoningContent = ReasoningContent;
+exports.ReasoningTrigger = ReasoningTrigger;
+exports.RefreshIcon = RefreshIcon;
+exports.ScrollButton = ScrollButton;
+exports.SendIcon = SendIcon;
+exports.SimpleConfirmation = SimpleConfirmation;
+exports.SimpleModelSelector = SimpleModelSelector;
+exports.SimpleReasoning = SimpleReasoning;
+exports.Source = Source;
+exports.SourceContent = SourceContent;
+exports.SourceTrigger = SourceTrigger;
+exports.StopIcon = StopIcon;
+exports.ThumbsDownIcon = ThumbsDownIcon2;
+exports.ThumbsUpIcon = ThumbsUpIcon2;
+exports.ToolExecutionMessage = ToolExecutionMessage;
+exports.ToolStep = ToolStep;
+exports.ToolSteps = ToolSteps;
+exports.Tooltip = Tooltip;
+exports.TooltipContent = TooltipContent;
+exports.TooltipProvider = TooltipProvider;
+exports.TooltipTrigger = TooltipTrigger;
+exports.UserIcon = UserIcon;
+exports.XIcon = XIcon2;
+exports.cn = cn;
+exports.parseFollowUps = parseFollowUps;
+exports.useChatContainer = useChatContainer;
+exports.useCopilotUI = useCopilotUI;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map