@agents24/chat-react 0.5.0 → 0.5.2

package/dist/templates/index.cjs

@@ -1,2600 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/templates/index.ts
-var templates_exports = {};
-__export(templates_exports, {
-  AgentChatApp: () => AgentChatApp,
-  AgentChatAppearanceControl: () => AgentChatAppearanceControl,
-  AgentChatLayout: () => AgentChatLayout,
-  AgentChatShell: () => AgentChatShell,
-  AgentChatStatePanel: () => AgentChatStatePanel,
-  buildAgentChatOutlineItems: () => buildAgentChatOutlineItems,
-  getAgentChatShellScrollState: () => getAgentChatShellScrollState
-});
-module.exports = __toCommonJS(templates_exports);
-
-// src/templates/agent-chat-shell.tsx
-var React2 = __toESM(require("react"), 1);
-
-// src/latest-thread-scroller.tsx
-var React = __toESM(require("react"), 1);
-var import_message_scroller = require("@shadcn/react/message-scroller");
-var import_jsx_runtime = require("react/jsx-runtime");
-var cx = (...values) => values.filter(Boolean).join(" ");
-var LatestThreadScrollerLayoutContext = React.createContext(null);
-var useLatestThreadScrollerLayout = () => React.useContext(LatestThreadScrollerLayoutContext);
-function LatestThreadScrollerProvider({
-  autoScroll = true,
-  defaultScrollPosition = "last-anchor",
-  scrollPreviousItemPeek = 64,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Provider,
-    {
-      autoScroll,
-      defaultScrollPosition,
-      scrollPreviousItemPeek,
-      ...props
-    }
-  );
-}
-function LatestThreadScrollerRoot({
-  className,
-  ref,
-  ...props
-}) {
-  const [rootElement, setRootElement] = React.useState(null);
-  const [contentElement, setContentElement] = React.useState(null);
-  const layoutContext = React.useMemo(
-    () => ({
-      contentElement,
-      rootElement,
-      setContentElement,
-      setRootElement
-    }),
-    [contentElement, rootElement]
-  );
-  const setRef = React.useCallback(
-    (node) => {
-      setRootElement(node);
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    },
-    [ref]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LatestThreadScrollerLayoutContext.Provider, { value: layoutContext, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Root,
-    {
-      ref: setRef,
-      className: cx(
-        "a24-scroller relative flex size-full min-h-0 flex-1 flex-col overflow-hidden",
-        className
-      ),
-      ...props
-    }
-  ) });
-}
-function LatestThreadScrollerViewport({
-  className,
-  onViewportChange,
-  preserveScrollOnPrepend = true,
-  ref,
-  ...props
-}) {
-  const setRef = React.useCallback(
-    (node) => {
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-      onViewportChange?.(node);
-    },
-    [onViewportChange, ref]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Viewport,
-    {
-      ref: setRef,
-      className: cx(
-        "a24-scroller__viewport size-full min-h-0 min-w-0 flex-1 overflow-y-auto overscroll-contain",
-        className
-      ),
-      preserveScrollOnPrepend,
-      ...props
-    }
-  );
-}
-function LatestThreadScrollerContent({
-  className,
-  ref,
-  ...props
-}) {
-  const layout = useLatestThreadScrollerLayout();
-  const setRef = React.useCallback(
-    (node) => {
-      layout?.setContentElement(node);
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    },
-    [layout, ref]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Content,
-    {
-      ref: setRef,
-      "data-agents24-latest-thread-content": "",
-      className: cx("a24-scroller__content flex h-max min-h-full flex-col gap-8 p-4", className),
-      ...props
-    }
-  );
-}
-function LatestThreadScrollerItem({
-  className,
-  messageId,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Item,
-    {
-      className: cx(
-        "a24-scroller__item min-w-0 shrink-0 overflow-visible",
-        className
-      ),
-      messageId,
-      ...props
-    }
-  );
-}
-function LatestThreadScrollerButton({
-  children,
-  className,
-  direction = "end",
-  render,
-  ...props
-}) {
-  if (render) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_message_scroller.MessageScroller.Button,
-      {
-        direction,
-        render,
-        ...props
-      }
-    );
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_message_scroller.MessageScroller.Button,
-    {
-      direction,
-      render: (buttonProps) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "button",
-        {
-          ...buttonProps,
-          "aria-label": direction === "end" ? "Scroll to latest message" : "Scroll to first message",
-          className: cx(
-            "a24-scroller__button absolute bottom-4 left-1/2 z-50 flex size-9 -translate-x-1/2 items-center justify-center rounded-full border border-border bg-background text-foreground shadow-md transition-[background-color,border-color,color,opacity,transform] duration-200 data-[active=false]:pointer-events-none data-[active=false]:translate-y-2 data-[active=false]:opacity-0 data-[active=true]:translate-y-0 data-[active=true]:opacity-100",
-            className
-          ),
-          type: "button",
-          children: children ?? (direction === "end" ? "\u2193" : "\u2191")
-        }
-      ),
-      ...props
-    }
-  );
-}
-function LatestThreadScrollerOutline({
-  cardClassName,
-  className,
-  contentMaxWidth = 768,
-  dir = "ltr",
-  items,
-  minContainerWidthForRail = 0,
-  minSideGutterForRail = 48,
-  side
-}) {
-  const navRef = React.useRef(null);
-  const layout = useLatestThreadScrollerLayout();
-  const [hasSideRoom, setHasSideRoom] = React.useState(false);
-  const [hoveredIndex, setHoveredIndex] = React.useState(null);
-  const { scrollToMessage } = (0, import_message_scroller.useMessageScroller)();
-  const { currentAnchorId, visibleMessageIds } = (0, import_message_scroller.useMessageScrollerVisibility)();
-  const visibleMessageIdSet = React.useMemo(
-    () => new Set(visibleMessageIds),
-    [visibleMessageIds]
-  );
-  const focusIndex = hoveredIndex ?? -1;
-  const railSide = side ?? (dir === "rtl" ? "right" : "left");
-  React.useEffect(() => {
-    const root = layout?.rootElement ?? navRef.current?.parentElement;
-    if (!root) return;
-    const updateSideRoom = () => {
-      const rootRect = root.getBoundingClientRect();
-      const rootWidth = rootRect.width;
-      const content2 = layout?.contentElement;
-      const sideGutter = content2 ? Math.max(
-        0,
-        railSide === "left" ? content2.getBoundingClientRect().left - rootRect.left : rootRect.right - content2.getBoundingClientRect().right
-      ) : Math.max(0, (rootWidth - contentMaxWidth) / 2);
-      const nextHasSideRoom = rootWidth >= minContainerWidthForRail && sideGutter >= minSideGutterForRail;
-      setHasSideRoom(
-        (current) => current === nextHasSideRoom ? current : nextHasSideRoom
-      );
-    };
-    updateSideRoom();
-    if (typeof ResizeObserver === "undefined") return;
-    const resizeObserver = new ResizeObserver(updateSideRoom);
-    resizeObserver.observe(root);
-    const content = layout?.contentElement;
-    if (content) {
-      resizeObserver.observe(content);
-    }
-    return () => resizeObserver.disconnect();
-  }, [
-    contentMaxWidth,
-    layout?.contentElement,
-    layout?.rootElement,
-    minContainerWidthForRail,
-    minSideGutterForRail,
-    railSide
-  ]);
-  if (items.length < 2) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "nav",
-    {
-      ref: navRef,
-      "aria-label": "Transcript outline",
-      "data-side": railSide,
-      "data-visible": hasSideRoom ? "" : void 0,
-      className: cx(
-        "a24-outline pointer-events-none absolute top-[46%] z-10 max-h-[min(18rem,calc(100%-10rem))] w-16 -translate-y-1/2 overflow-visible",
-        hasSideRoom ? "hidden md:block" : "hidden",
-        railSide === "left" ? "left-1" : "right-1",
-        className
-      ),
-      dir,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "a24-outline__rail pointer-events-auto flex flex-col gap-0 py-1", children: items.map((item, index) => {
-        const itemMessageIds = item.messageIds && item.messageIds.length > 0 ? item.messageIds : [item.id];
-        const active = itemMessageIds.some(
-          (messageId) => visibleMessageIdSet.has(messageId) || messageId === currentAnchorId
-        );
-        const distance = focusIndex >= 0 ? Math.abs(index - focusIndex) : Number.POSITIVE_INFINITY;
-        const isFocused = distance === 0;
-        const isNear = distance === 1;
-        const isNextNear = distance === 2;
-        const barWidth = isFocused ? 50 : isNear ? 36 : isNextNear ? 23 : 10;
-        const barOpacity = isFocused ? 1 : isNear ? 0.78 : isNextNear ? 0.58 : 0.36;
-        const fallbackLabel = `Turn ${index + 1}`;
-        const previewLabel = item.label && item.label !== fallbackLabel ? item.label : "";
-        const responsePreview = (item.responsePreview || "").trim();
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-          "button",
-          {
-            type: "button",
-            "data-active": active,
-            "data-side": railSide,
-            dir: "ltr",
-            className: cx(
-              "a24-outline__button group relative flex h-2 w-16 items-center rounded-sm outline-none",
-              railSide === "left" ? "justify-start" : "justify-end"
-            ),
-            "aria-label": `Jump to ${item.label || fallbackLabel}`,
-            onBlur: () => setHoveredIndex(null),
-            onFocus: () => setHoveredIndex(index),
-            onMouseEnter: () => setHoveredIndex(index),
-            onMouseLeave: () => setHoveredIndex(null),
-            onClick: () => scrollToMessage(item.id, {
-              align: "start",
-              behavior: "smooth"
-            }),
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                "span",
-                {
-                  className: "a24-outline__bar h-0.5 rounded-full bg-muted-foreground/55 transition-[width,background-color,opacity] duration-150 ease-out group-hover:bg-foreground group-focus-visible:bg-foreground group-data-[active=true]:bg-foreground",
-                  style: {
-                    opacity: barOpacity,
-                    width: barWidth
-                  }
-                }
-              ),
-              previewLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-                "span",
-                {
-                  dir,
-                  className: cx(
-                    "a24-outline__preview pointer-events-none absolute top-1/2 z-20 max-h-32 w-64 -translate-y-1/2 overflow-hidden rounded-lg border border-border/80 bg-background p-3 text-start opacity-0 shadow-lg transition-[opacity,transform] duration-200 group-hover:pointer-events-auto group-hover:opacity-100 group-focus-visible:pointer-events-auto group-focus-visible:opacity-100",
-                    railSide === "left" ? "left-full ml-2 -translate-x-1 group-hover:translate-x-0 group-focus-visible:translate-x-0" : "right-full mr-2 translate-x-1 group-hover:translate-x-0 group-focus-visible:translate-x-0",
-                    cardClassName
-                  ),
-                  children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                      "span",
-                      {
-                        className: "block overflow-hidden text-sm leading-5 text-foreground",
-                        style: {
-                          display: "-webkit-box",
-                          WebkitBoxOrient: "vertical",
-                          WebkitLineClamp: responsePreview ? 2 : 4
-                        },
-                        children: previewLabel
-                      }
-                    ),
-                    responsePreview ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                      "span",
-                      {
-                        className: "mt-1 block overflow-hidden text-sm leading-5 text-muted-foreground",
-                        style: {
-                          display: "-webkit-box",
-                          WebkitBoxOrient: "vertical",
-                          WebkitLineClamp: 2
-                        },
-                        children: responsePreview
-                      }
-                    ) : null
-                  ]
-                }
-              ) : null
-            ]
-          },
-          item.id
-        );
-      }) })
-    }
-  );
-}
-var LatestThreadScroller = {
-  Provider: LatestThreadScrollerProvider,
-  Root: LatestThreadScrollerRoot,
-  Viewport: LatestThreadScrollerViewport,
-  Content: LatestThreadScrollerContent,
-  Item: LatestThreadScrollerItem,
-  Button: LatestThreadScrollerButton,
-  Outline: LatestThreadScrollerOutline
-};
-
-// src/ui/utils.ts
-var import_clsx = require("clsx");
-var import_tailwind_merge = require("tailwind-merge");
-function cn(...values) {
-  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(values));
-}
-
-// src/templates/agent-chat-shell.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-function getAgentChatShellScrollState(viewport) {
-  const canScroll = viewport.scrollHeight - viewport.clientHeight > 1;
-  return {
-    canScroll,
-    isScrolled: canScroll && viewport.scrollTop > 4
-  };
-}
-var defaultOutlineLabel = (content, index) => {
-  const label = String(content || "").replace(/\s+/g, " ").trim();
-  return label || `Turn ${index + 1}`;
-};
-var defaultOutlinePreview = (content) => String(content || "").replace(/\s+/g, " ").trim();
-function buildAgentChatOutlineItems(messages, getLabel = (message, index) => defaultOutlineLabel(message.content, index), getResponsePreview = (message) => defaultOutlinePreview(message.content)) {
-  return messages.reduce((items, message) => {
-    if (message.role === "user") {
-      items.push({
-        id: message.id,
-        label: getLabel(message, items.length),
-        messageIds: [message.id]
-      });
-      return items;
-    }
-    const currentItem = items[items.length - 1];
-    currentItem?.messageIds?.push(message.id);
-    if (currentItem && !currentItem.responsePreview && message.role === "assistant") {
-      currentItem.responsePreview = getResponsePreview(message);
-    }
-    return items;
-  }, []);
-}
-function AgentChatShell({
-  className,
-  composer,
-  composerOverlayClassName,
-  composerOverlayHeight,
-  contentClassName,
-  defaultComposerOverlayHeight = 192,
-  dir = "ltr",
-  emptyInputAttachmentCount = 0,
-  emptyTitle = "Ready when you are.",
-  hideComposer = false,
-  isLoadingOlder = false,
-  messages,
-  onLoadOlder,
-  onScrollStateChange,
-  outlineItems,
-  outlineSide = "left",
-  renderEmptyState,
-  renderMessage,
-  renderOlderLoader
-}) {
-  const overlayRef = React2.useRef(null);
-  const viewportRef = React2.useRef(null);
-  const contentRef = React2.useRef(null);
-  const lastScrollStateRef = React2.useRef(null);
-  const [measuredOverlayHeight, setMeasuredOverlayHeight] = React2.useState(
-    defaultComposerOverlayHeight
-  );
-  const olderPageRequestRef = React2.useRef(false);
-  const items = React2.useMemo(
-    () => outlineItems || buildAgentChatOutlineItems(messages),
-    [messages, outlineItems]
-  );
-  const updateScrollState = React2.useCallback(() => {
-    const viewport = viewportRef.current;
-    if (!viewport || !onScrollStateChange) return;
-    const next = getAgentChatShellScrollState(viewport);
-    const previous = lastScrollStateRef.current;
-    if (previous && previous.canScroll === next.canScroll && previous.isScrolled === next.isScrolled) {
-      return;
-    }
-    lastScrollStateRef.current = next;
-    onScrollStateChange(next);
-  }, [onScrollStateChange]);
-  React2.useEffect(() => {
-    const overlay = overlayRef.current;
-    if (!overlay || hideComposer) return;
-    const updateHeight = () => {
-      setMeasuredOverlayHeight(Math.ceil(overlay.getBoundingClientRect().height));
-    };
-    updateHeight();
-    const observer = new ResizeObserver(updateHeight);
-    observer.observe(overlay);
-    return () => observer.disconnect();
-  }, [hideComposer]);
-  React2.useEffect(() => {
-    if (!onScrollStateChange) return;
-    updateScrollState();
-    const viewport = viewportRef.current;
-    const content = contentRef.current;
-    if (!viewport || typeof ResizeObserver === "undefined") return;
-    const observer = new ResizeObserver(updateScrollState);
-    observer.observe(viewport);
-    if (content) observer.observe(content);
-    return () => observer.disconnect();
-  }, [messages, onScrollStateChange, updateScrollState]);
-  const handleScroll = React2.useCallback(
-    (event) => {
-      updateScrollState();
-      if (!onLoadOlder || isLoadingOlder || olderPageRequestRef.current || event.currentTarget.scrollTop > 48) {
-        return;
-      }
-      olderPageRequestRef.current = true;
-      void Promise.resolve(onLoadOlder()).finally(() => {
-        olderPageRequestRef.current = false;
-      });
-    },
-    [isLoadingOlder, onLoadOlder, updateScrollState]
-  );
-  const bottomPadding = hideComposer ? 32 : (composerOverlayHeight ?? measuredOverlayHeight) + 72;
-  const isEmptyState = messages.length === 0;
-  if (isEmptyState) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn("a24-shell a24-shell--empty relative flex h-full min-h-0 w-full flex-col overflow-visible px-4", className), dir, children: renderEmptyState ? renderEmptyState({ composer: hideComposer ? void 0 : composer, title: emptyTitle }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "a24-shell__empty relative z-10 flex h-full flex-1 flex-col justify-center p-0 pt-13", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "a24-shell__empty-content flex w-full flex-col items-center pb-34 text-center animate-in fade-in slide-in-from-bottom-4 duration-500", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "p",
-        {
-          className: cn(
-            "a24-shell__empty-title pb-6 text-3xl font-semibold transition-transform duration-200",
-            emptyInputAttachmentCount > 0 && "-translate-y-12"
-          ),
-          children: emptyTitle
-        }
-      ),
-      !hideComposer && composer ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "a24-shell__empty-composer mx-auto w-full max-w-3xl px-4", children: composer }) : null
-    ] }) }) });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn("a24-shell relative flex h-full min-h-0 w-full flex-col", className), dir, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(LatestThreadScroller.Provider, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(LatestThreadScroller.Root, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        LatestThreadScroller.Viewport,
-        {
-          onScroll: handleScroll,
-          onViewportChange: (node) => {
-            viewportRef.current = node;
-            updateScrollState();
-          },
-          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-            LatestThreadScroller.Content,
-            {
-              ref: contentRef,
-              className: cn(
-                "a24-shell__content mx-auto flex min-h-full w-full max-w-3xl flex-col gap-8 px-4 pt-12",
-                contentClassName
-              ),
-              style: { paddingBottom: bottomPadding },
-              children: [
-                isLoadingOlder ? renderOlderLoader?.() : null,
-                messages.map((message, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                  LatestThreadScroller.Item,
-                  {
-                    messageId: message.id,
-                    scrollAnchor: message.role === "user",
-                    children: renderMessage(message, index)
-                  },
-                  message.id
-                ))
-              ]
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        LatestThreadScroller.Outline,
-        {
-          dir,
-          items,
-          side: outlineSide
-        }
-      )
-    ] }),
-    !hideComposer && composer ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-      "div",
-      {
-        ref: overlayRef,
-        className: cn(
-          "a24-shell__composer-overlay pointer-events-none absolute inset-x-0 bottom-0 z-20 overflow-visible px-4 pb-4 pt-10",
-          composerOverlayClassName
-        ),
-        style: {
-          background: "linear-gradient(to bottom, transparent 0%, color-mix(in oklch, var(--chat-background, var(--background)) 85%, transparent) 45%, var(--chat-background, var(--background)) 65%, var(--chat-background, var(--background)) 100%)"
-        },
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "a24-shell__scroll-button pointer-events-auto absolute inset-x-0 top-0 flex -translate-y-full justify-center pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LatestThreadScroller.Button, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "a24-shell__composer-inner pointer-events-auto mx-auto w-full max-w-3xl px-4", children: composer })
-        ]
-      }
-    ) : null
-  ] }) });
-}
-
-// src/templates/agent-chat-layout.tsx
-var React8 = __toESM(require("react"), 1);
-var import_lucide_react5 = require("lucide-react");
-
-// src/ui/agent-chat-composer.tsx
-var React3 = __toESM(require("react"), 1);
-var import_lucide_react = require("lucide-react");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var createId = () => typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `file-${Date.now()}-${Math.random().toString(36).slice(2)}`;
-function createComposerFile(file) {
-  return {
-    id: createId(),
-    type: "file",
-    url: URL.createObjectURL(file),
-    filename: file.name || "attachment",
-    mediaType: file.type || "application/octet-stream",
-    source: file
-  };
-}
-function revokeComposerFiles(files) {
-  files.forEach((file) => {
-    try {
-      URL.revokeObjectURL(file.url);
-    } catch {
-    }
-  });
-}
-function formatFileCount(files) {
-  if (files.length === 1) return files[0].filename;
-  return `${files.length} files`;
-}
-var pillButtonClass = "inline-flex size-8 shrink-0 items-center justify-center gap-2 rounded-full border-0 bg-neutral-100 text-sm text-neutral-600 shadow-none transition-colors hover:bg-neutral-200 hover:text-neutral-800 focus-visible:border-neutral-300 focus-visible:outline-none focus-visible:ring-0 disabled:pointer-events-none disabled:opacity-50 dark:bg-neutral-800 dark:text-neutral-300 dark:hover:bg-neutral-700";
-var submitButtonClass = "inline-flex size-9 shrink-0 items-center justify-center gap-2 rounded-full border-0 bg-neutral-900 text-sm text-white shadow-none transition-[background-color,color,opacity,transform] duration-200 hover:bg-neutral-800 hover:text-white focus-visible:border-neutral-300 focus-visible:outline-none focus-visible:ring-0 disabled:pointer-events-none disabled:opacity-50 dark:bg-neutral-100 dark:text-neutral-900 dark:hover:bg-white";
-function AgentChatComposer({
-  accept,
-  allowAttachments = true,
-  attachmentLayout = "flow",
-  className,
-  disabled = false,
-  inputToolbarContent,
-  isRunning = false,
-  onAttachmentCountChange,
-  onStop,
-  onSubmit,
-  placeholder = "Send follow-up\u2026",
-  textareaRef
-}) {
-  const fileInputRef = React3.useRef(null);
-  const filesRef = React3.useRef([]);
-  const localTextareaRef = React3.useRef(null);
-  const [text, setText] = React3.useState("");
-  const [files, setFiles] = React3.useState([]);
-  const [isSubmitting, setIsSubmitting] = React3.useState(false);
-  const isExpanded = text.includes("\n") || text.length > 62;
-  const setTextareaRef = React3.useCallback(
-    (node) => {
-      localTextareaRef.current = node;
-      if (typeof textareaRef === "function") {
-        textareaRef(node);
-      } else if (textareaRef) {
-        textareaRef.current = node;
-      }
-    },
-    [textareaRef]
-  );
-  React3.useEffect(() => {
-    filesRef.current = files;
-    onAttachmentCountChange?.(files.length);
-  }, [files, onAttachmentCountChange]);
-  React3.useEffect(() => () => revokeComposerFiles(filesRef.current), []);
-  React3.useLayoutEffect(() => {
-    const textarea = localTextareaRef.current;
-    if (!textarea) return;
-    if (isExpanded) {
-      textarea.style.height = "auto";
-      const scrollHeight = textarea.scrollHeight;
-      textarea.style.height = `${Math.min(scrollHeight, 224)}px`;
-      textarea.style.overflowY = scrollHeight >= 224 ? "auto" : "hidden";
-      return;
-    }
-    textarea.style.height = "";
-    textarea.style.overflowY = "hidden";
-  }, [isExpanded, text]);
-  const canSubmit = !disabled && !isSubmitting && !isRunning && (text.trim().length > 0 || files.length > 0);
-  const handleFilesChange = (event) => {
-    const selected = Array.from(event.target.files || []).map(createComposerFile);
-    if (selected.length > 0) {
-      setFiles((current) => [...current, ...selected]);
-    }
-    event.currentTarget.value = "";
-  };
-  const removeFile = (fileId) => {
-    setFiles((current) => {
-      const target = current.find((file) => file.id === fileId);
-      if (target) revokeComposerFiles([target]);
-      return current.filter((file) => file.id !== fileId);
-    });
-  };
-  const submit = async () => {
-    if (!canSubmit) return;
-    const submittedText = text.trim();
-    const submittedFiles = files;
-    setIsSubmitting(true);
-    try {
-      await onSubmit({ text: submittedText, files: submittedFiles });
-      setText("");
-      setFiles([]);
-      revokeComposerFiles(submittedFiles);
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-  const handleKeyDown = (event) => {
-    if (event.key === "Enter" && !event.shiftKey) {
-      event.preventDefault();
-      void submit();
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: cn("a24-composer relative mx-auto w-full max-w-3xl overflow-visible", className), children: [
-    files.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      "div",
-      {
-        "data-testid": "agent-chat-composer-attachments",
-        "data-layout": attachmentLayout,
-        className: cn(
-          "a24-composer__attachments flex min-w-0 gap-2 py-1",
-          attachmentLayout === "overlay" ? "absolute bottom-full left-0 right-0 mb-1.5 flex-nowrap overflow-x-auto overflow-y-hidden overscroll-x-contain px-2" : "mb-2 flex-wrap px-1"
-        ),
-        children: files.map((file) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-          "div",
-          {
-            className: "a24-composer__attachment group relative flex h-8 max-w-[min(20rem,calc(100vw-2rem))] cursor-default select-none items-center gap-1.5 rounded-md border border-neutral-200 bg-white px-1.5 text-sm font-medium text-foreground transition-colors hover:bg-neutral-50",
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "flex size-5 shrink-0 items-center justify-center rounded bg-background text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.Paperclip, { className: "size-3" }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "min-w-0 flex-1 truncate", children: file.filename }),
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "button",
-                {
-                  "aria-label": `Remove ${file.filename}`,
-                  className: "a24-composer__attachment-remove inline-flex size-5 shrink-0 items-center justify-center rounded text-muted-foreground opacity-70 transition-colors hover:bg-muted hover:text-foreground hover:opacity-100 focus-visible:outline-none",
-                  onClick: () => removeFile(file.id),
-                  type: "button",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.X, { className: "size-3" })
-                }
-              )
-            ]
-          },
-          file.id
-        ))
-      }
-    ) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      "div",
-      {
-        "data-expanded": isExpanded ? "" : void 0,
-        className: cn(
-          "a24-composer__surface relative w-full border border-neutral-200 bg-white shadow-sm transition-colors duration-200 focus-within:border-neutral-300 dark:border-neutral-700 dark:bg-card dark:focus-within:border-neutral-600",
-          isExpanded ? "rounded-[18px] p-2 pb-1.5" : "rounded-full px-2 py-[3px]"
-        ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-          "div",
-          {
-            className: "a24-composer__grid w-full",
-            style: {
-              alignItems: "center",
-              display: "grid",
-              gridTemplateAreas: isExpanded ? `"textarea textarea textarea" "plus toolbar submit"` : `"plus textarea composer mic submit"`,
-              gridTemplateColumns: isExpanded ? "auto 1fr auto" : "auto 1fr auto auto auto",
-              gap: isExpanded ? "3px 10px" : "8px"
-            },
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { gridArea: "plus" }, className: "a24-composer__attach-slot flex shrink-0 items-center justify-center", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  "input",
-                  {
-                    ref: fileInputRef,
-                    accept,
-                    "aria-label": "Attach files",
-                    className: "hidden",
-                    multiple: true,
-                    name: "attachments",
-                    onChange: handleFilesChange,
-                    type: "file"
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  "button",
-                  {
-                    "aria-label": "Attach files",
-                    className: cn("a24-composer__attach", pillButtonClass),
-                    disabled: disabled || isSubmitting || isRunning || !allowAttachments,
-                    onClick: () => fileInputRef.current?.click(),
-                    title: "Attach files",
-                    type: "button",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.Plus, { className: "size-4" })
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { gridArea: "textarea" }, className: "a24-composer__textarea-slot min-w-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "textarea",
-                {
-                  ref: setTextareaRef,
-                  "aria-label": "Message",
-                  autoComplete: "off",
-                  className: cn(
-                    "a24-composer__textarea w-full resize-none border-0 bg-transparent px-1 text-[15px] leading-relaxed text-foreground shadow-none outline-none placeholder:text-neutral-400 focus-visible:ring-0 scrollbar-thin",
-                    isExpanded ? "min-h-9 max-h-[224px] py-1" : "min-h-9 h-9 max-h-9 py-2"
-                  ),
-                  disabled: disabled || isSubmitting || isRunning,
-                  name: "message",
-                  onChange: (event) => setText(event.target.value),
-                  onKeyDown: handleKeyDown,
-                  placeholder,
-                  rows: isExpanded ? 2 : 1,
-                  value: text
-                }
-              ) }),
-              isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { gridArea: "toolbar" }, className: "a24-composer__toolbar flex min-w-0 items-center gap-1.5", children: inputToolbarContent }) : null,
-              !isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { gridArea: "composer" }, className: "flex min-w-0 items-center gap-1.5" }) : null,
-              !isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { gridArea: "mic" }, className: "flex shrink-0 items-center justify-end" }) : null,
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { gridArea: "submit" }, className: "a24-composer__submit-slot flex shrink-0 items-center justify-end", children: isRunning ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "button",
-                {
-                  "aria-label": "Stop generating",
-                  className: cn("a24-composer__submit", submitButtonClass),
-                  disabled: disabled || !onStop,
-                  onClick: onStop,
-                  title: "Stop",
-                  type: "button",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.Square, { className: "size-3.5 fill-current" })
-                }
-              ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "button",
-                {
-                  "aria-label": files.length > 0 ? `Send ${formatFileCount(files)}` : "Send message",
-                  className: cn("a24-composer__submit", submitButtonClass, text.trim().length > 0 && "hover:scale-105"),
-                  disabled: !canSubmit,
-                  onClick: () => void submit(),
-                  title: "Send",
-                  type: "button",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ArrowUp, { className: "size-4", strokeWidth: 2.5 })
-                }
-              ) })
-            ]
-          }
-        )
-      }
-    ),
-    !isExpanded && inputToolbarContent ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "a24-composer__toolbar a24-composer__toolbar--external mt-2 flex items-center gap-2 px-1", children: inputToolbarContent }) : null
-  ] });
-}
-
-// src/ui/agent-chat-message.tsx
-var React7 = __toESM(require("react"), 1);
-var import_lucide_react4 = require("lucide-react");
-
-// src/ui/adapters.ts
-var React4 = __toESM(require("react"), 1);
-
-// src/ui/attachment.tsx
-var import_class_variance_authority = require("class-variance-authority");
-var import_react_slot = require("@radix-ui/react-slot");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var attachmentVariants = (0, import_class_variance_authority.cva)(
-  "group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-xl border bg-card text-card-foreground transition-colors focus-within:border-neutral-300 focus-within:ring-0 has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed",
-  {
-    variants: {
-      size: {
-        default: "gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2",
-        sm: "gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5",
-        xs: "gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1"
-      },
-      orientation: {
-        horizontal: "min-w-40 items-center",
-        vertical: "w-24 flex-col has-data-[slot=attachment-content]:w-30"
-      }
-    }
-  }
-);
-function Attachment({
-  className,
-  state = "done",
-  size = "default",
-  orientation = "horizontal",
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "div",
-    {
-      "data-slot": "attachment",
-      "data-state": state,
-      "data-size": size,
-      "data-orientation": orientation,
-      className: cn(attachmentVariants({ size, orientation }), className),
-      ...props
-    }
-  );
-}
-var attachmentMediaVariants = (0, import_class_variance_authority.cva)(
-  "relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[size=sm]/attachment:w-8 group-data-[size=xs]/attachment:w-7 group-data-[size=xs]/attachment:rounded-md group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5",
-  {
-    variants: {
-      variant: {
-        icon: "",
-        image: "opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover"
-      }
-    },
-    defaultVariants: {
-      variant: "icon"
-    }
-  }
-);
-function AttachmentMedia({
-  className,
-  variant = "icon",
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "div",
-    {
-      "data-slot": "attachment-media",
-      "data-variant": variant,
-      className: cn(attachmentMediaVariants({ variant }), className),
-      ...props
-    }
-  );
-}
-function AttachmentContent({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "div",
-    {
-      "data-slot": "attachment-content",
-      className: cn(
-        "max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AttachmentTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "span",
-    {
-      "data-slot": "attachment-title",
-      className: cn(
-        "block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AttachmentDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "span",
-    {
-      "data-slot": "attachment-description",
-      className: cn(
-        "mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80",
-        "max-w-full",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AttachmentGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "div",
-    {
-      "data-slot": "attachment-group",
-      className: cn(
-        "flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start",
-        className
-      ),
-      ...props
-    }
-  );
-}
-
-// src/ui/message.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-function Message({
-  className,
-  align = "start",
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    "div",
-    {
-      "data-slot": "message",
-      "data-align": align,
-      className: cn(
-        "group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse",
-        className
-      ),
-      ...props
-    }
-  );
-}
-
-// src/ui/adapters.ts
-function ChatMessage(input) {
-  const { className, from, align, ...props } = input;
-  const isUser = from === "user";
-  const isRtl = props.dir === "rtl";
-  const resolvedAlign = align || "start";
-  const messageProps = Object.assign({}, props);
-  messageProps.align = resolvedAlign;
-  messageProps.className = cn(
-    "group flex w-full flex-col gap-2",
-    isUser ? cn("is-user max-w-[80%] justify-end", isRtl ? "mr-auto" : "ml-auto") : "is-assistant max-w-full",
-    className
-  );
-  return React4.createElement(Message, messageProps);
-}
-function ChatMessageContent({
-  className,
-  ...props
-}) {
-  return React4.createElement("div", {
-    className: cn(
-      "is-user:dark flex w-full max-w-full min-w-0 flex-col gap-2 overflow-hidden text-sm group-[.is-user]:w-fit group-[.is-user]:overflow-visible",
-      "group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground",
-      "group-[.is-assistant]:w-full group-[.is-assistant]:max-w-full group-[.is-assistant]:text-foreground",
-      props.dir === "rtl" ? "group-[.is-user]:mr-auto" : "group-[.is-user]:ml-auto",
-      className
-    ),
-    "data-slot": "bubble-content",
-    ...props
-  });
-}
-function ChatMessageActions({
-  className,
-  ...props
-}) {
-  return React4.createElement("div", {
-    className: cn("flex items-center gap-1", className),
-    "data-slot": "message-actions",
-    ...props
-  });
-}
-function ChatMessageAction({
-  children,
-  className,
-  label,
-  tooltip,
-  type = "button",
-  ...props
-}) {
-  const tooltipLabel = typeof tooltip === "string" ? tooltip : void 0;
-  return React4.createElement(
-    "button",
-    {
-      "aria-label": label || tooltipLabel,
-      className: cn(
-        "inline-flex size-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:border-neutral-300 focus-visible:outline-none focus-visible:ring-0 disabled:pointer-events-none disabled:opacity-50",
-        className
-      ),
-      title: tooltipLabel,
-      type,
-      ...props
-    },
-    children,
-    React4.createElement(
-      "span",
-      { className: "sr-only" },
-      label || tooltipLabel
-    )
-  );
-}
-function ChatAttachment({
-  data,
-  onRemove,
-  orientation,
-  ...props
-}) {
-  const mediaType = data.mediaType || data.contentType || String(data.type || "application/octet-stream");
-  const filename = data.filename || data.name || "Attachment";
-  const isImage = mediaType.startsWith("image/") && Boolean(data.url);
-  return React4.createElement(
-    Attachment,
-    {
-      orientation: orientation || (isImage ? "vertical" : "horizontal"),
-      ...props
-    },
-    React4.createElement(
-      AttachmentMedia,
-      { variant: isImage ? "image" : "icon" },
-      isImage ? React4.createElement("img", {
-        alt: filename,
-        className: "size-full object-cover",
-        src: data.url
-      }) : React4.createElement(
-        "span",
-        { "aria-hidden": "true", className: "text-sm" },
-        filename.slice(0, 1).toUpperCase()
-      )
-    ),
-    React4.createElement(
-      AttachmentContent,
-      null,
-      React4.createElement(AttachmentTitle, null, filename),
-      React4.createElement(AttachmentDescription, null, mediaType)
-    ),
-    onRemove ? React4.createElement(
-      "button",
-      {
-        "aria-label": "Remove attachment",
-        className: "relative z-20 mr-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
-        onClick: (event) => {
-          event.stopPropagation();
-          onRemove();
-        },
-        type: "button"
-      },
-      React4.createElement("span", { "aria-hidden": "true" }, "x")
-    ) : null
-  );
-}
-function ChatAttachments({
-  children,
-  className,
-  ...props
-}) {
-  if (!children) return null;
-  return React4.createElement(
-    AttachmentGroup,
-    {
-      className: cn(
-        props.dir === "rtl" ? "mr-auto" : "ml-auto",
-        "w-fit flex-wrap overflow-visible",
-        className
-      ),
-      ...props
-    },
-    children
-  );
-}
-
-// src/ui/agent-chat-actions.tsx
-var import_lucide_react2 = require("lucide-react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-function AgentChatDefaultActions({
-  handlers,
-  message
-}) {
-  if (!handlers || message.role !== "assistant" || message.isFinal === false) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(ChatMessageActions, { children: [
-    handlers.onRetry ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      ChatMessageAction,
-      {
-        label: "Retry",
-        onClick: () => void handlers.onRetry?.(message),
-        tooltip: "Regenerate response",
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react2.RefreshCcw, { className: "size-4" })
-      }
-    ) : null,
-    handlers.onLike ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      ChatMessageAction,
-      {
-        label: "Like",
-        onClick: () => void handlers.onLike?.(message),
-        tooltip: "Like this response",
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react2.ThumbsUp, { className: "size-4", fill: handlers.liked ? "currentColor" : "none" })
-      }
-    ) : null,
-    handlers.onDislike ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      ChatMessageAction,
-      {
-        label: "Dislike",
-        onClick: () => void handlers.onDislike?.(message),
-        tooltip: "Dislike this response",
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react2.ThumbsDown, { className: "size-4", fill: handlers.disliked ? "currentColor" : "none" })
-      }
-    ) : null,
-    handlers.onCopy ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      ChatMessageAction,
-      {
-        label: "Copy",
-        onClick: () => handlers.onCopy?.(message.content || "", message.id),
-        tooltip: handlers.copied ? "Copied!" : "Copy to clipboard",
-        children: handlers.copied ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react2.Check, { className: "size-4 text-green-600" }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react2.Copy, { className: "size-4" })
-      }
-    ) : null
-  ] });
-}
-
-// src/ui/agent-response-timeline.tsx
-var React6 = __toESM(require("react"), 1);
-var import_lucide_react3 = require("lucide-react");
-
-// src/ui/message-response.tsx
-var React5 = __toESM(require("react"), 1);
-var import_streamdown = require("streamdown");
-
-// src/active-content.ts
-var CHAT_MARKDOWN_HARDEN_OPTIONS = Object.freeze({
-  allowDataImages: false,
-  allowedImagePrefixes: [],
-  allowedLinkPrefixes: ["*"],
-  allowedProtocols: [],
-  defaultOrigin: void 0,
-  imageBlockPolicy: "text-only",
-  linkBlockPolicy: "text-only"
-});
-function safeChatMarkdownHref(value) {
-  if (!value) return void 0;
-  if (value.startsWith("#")) return value;
-  try {
-    const url = new URL(value);
-    return url.protocol === "https:" || url.protocol === "http:" ? url.href : void 0;
-  } catch {
-    return void 0;
-  }
-}
-
-// src/streaming-text.ts
-var import_react = require("react");
-var DEFAULT_COMPLETED_TEXT_CACHE_SIZE = 200;
-var defaultCompletedTextCache = /* @__PURE__ */ new Map();
-var defaultStreamingTextCache = {
-  get: (id) => defaultCompletedTextCache.get(id),
-  set: (id, text) => {
-    defaultCompletedTextCache.set(id, text);
-    if (defaultCompletedTextCache.size > DEFAULT_COMPLETED_TEXT_CACHE_SIZE) {
-      const firstKey = defaultCompletedTextCache.keys().next().value;
-      if (firstKey) defaultCompletedTextCache.delete(firstKey);
-    }
-  }
-};
-function useStreamingText({
-  id,
-  isStreaming,
-  text,
-  cache = defaultStreamingTextCache,
-  charsPerSecond = 72,
-  catchupThreshold = 40,
-  maxCatchupChars = 20
-}) {
-  const cacheAdapter = cache === false ? null : cache;
-  const [displayedText, setDisplayedText] = (0, import_react.useState)(() => {
-    const cachedText = cacheAdapter?.get(id);
-    return cachedText && text.startsWith(cachedText) ? cachedText : text;
-  });
-  const targetRef = (0, import_react.useRef)(text);
-  const displayedRef = (0, import_react.useRef)(displayedText);
-  const rafRef = (0, import_react.useRef)(null);
-  const lastFrameAtRef = (0, import_react.useRef)(null);
-  const idRef = (0, import_react.useRef)(id);
-  const shouldAnimateRef = (0, import_react.useRef)(isStreaming);
-  (0, import_react.useEffect)(() => {
-    if (isStreaming || !text) return;
-    cacheAdapter?.set(id, text);
-  }, [cacheAdapter, id, isStreaming, text]);
-  (0, import_react.useEffect)(() => {
-    targetRef.current = text;
-  }, [text]);
-  (0, import_react.useEffect)(() => {
-    if (idRef.current === id) return;
-    idRef.current = id;
-    const cachedText = cacheAdapter?.get(id);
-    const initial = cachedText && text.startsWith(cachedText) ? cachedText : text;
-    shouldAnimateRef.current = isStreaming && initial !== text;
-    displayedRef.current = initial;
-    setDisplayedText(initial);
-    if (rafRef.current !== null) {
-      cancelAnimationFrame(rafRef.current);
-      rafRef.current = null;
-    }
-    lastFrameAtRef.current = null;
-  }, [cacheAdapter, id, isStreaming, text]);
-  (0, import_react.useEffect)(() => {
-    if (typeof window === "undefined") {
-      displayedRef.current = text;
-      setDisplayedText(text);
-      return;
-    }
-    const reduceMotion = typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-    if (reduceMotion) {
-      displayedRef.current = text;
-      setDisplayedText(text);
-      shouldAnimateRef.current = false;
-      return;
-    }
-    const cachedText = cacheAdapter?.get(id);
-    if (cachedText === text) {
-      displayedRef.current = text;
-      setDisplayedText(text);
-      shouldAnimateRef.current = false;
-      return;
-    }
-    if (isStreaming) {
-      shouldAnimateRef.current = true;
-    }
-    if (!shouldAnimateRef.current) {
-      displayedRef.current = text;
-      setDisplayedText(text);
-      return;
-    }
-    if (!text.startsWith(displayedRef.current)) {
-      displayedRef.current = "";
-      setDisplayedText("");
-    }
-    const tick = (timestamp) => {
-      const previousTimestamp = lastFrameAtRef.current ?? timestamp;
-      lastFrameAtRef.current = timestamp;
-      const target = targetRef.current;
-      const current = displayedRef.current;
-      if (current.length >= target.length) {
-        shouldAnimateRef.current = false;
-        rafRef.current = null;
-        return;
-      }
-      const elapsedMs = Math.max(8, timestamp - previousTimestamp);
-      const charsFromTime = Math.max(1, Math.floor(elapsedMs / 1e3 * charsPerSecond));
-      const gap = target.length - current.length;
-      const catchupStep = gap > catchupThreshold ? Math.min(maxCatchupChars, Math.ceil(gap / 10)) : charsFromTime;
-      const nextLength = Math.min(
-        target.length,
-        current.length + Math.max(charsFromTime, catchupStep)
-      );
-      const next = target.slice(0, nextLength);
-      displayedRef.current = next;
-      setDisplayedText(next);
-      rafRef.current = window.requestAnimationFrame(tick);
-    };
-    if (rafRef.current === null && displayedRef.current.length < text.length) {
-      rafRef.current = window.requestAnimationFrame(tick);
-    }
-    return () => {
-      if (rafRef.current !== null) {
-        cancelAnimationFrame(rafRef.current);
-        rafRef.current = null;
-      }
-      lastFrameAtRef.current = null;
-    };
-  }, [cacheAdapter, catchupThreshold, charsPerSecond, id, isStreaming, maxCatchupChars, text]);
-  return {
-    displayedText,
-    isAnimating: isStreaming,
-    mode: isStreaming ? "streaming" : "static",
-    parseIncompleteMarkdown: isStreaming
-  };
-}
-
-// src/ui/message-response.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-function SafeMarkdownLink({ children, href, ...props }) {
-  const domProps = { ...props };
-  delete domProps.node;
-  const safeHref = safeChatMarkdownHref(href);
-  if (!safeHref) return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children });
-  if (safeHref.startsWith("#")) return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("a", { ...domProps, href: safeHref, children });
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("a", { ...domProps, href: safeHref, rel: "noopener noreferrer", target: "_blank", children });
-}
-function BlockedMarkdownImage({ alt }) {
-  return alt ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { "aria-label": `Image blocked: ${alt}`, role: "img", children: alt }) : null;
-}
-var BLOCK_MARKDOWN_TAGS = /* @__PURE__ */ new Set([
-  "blockquote",
-  "div",
-  "h1",
-  "h2",
-  "h3",
-  "h4",
-  "h5",
-  "h6",
-  "hr",
-  "ol",
-  "pre",
-  "table",
-  "ul"
-]);
-function isMultilineCodeNode(node) {
-  return node?.tagName === "code" && node.position?.start?.line !== void 0 && node.position?.end?.line !== void 0 && node.position.start.line !== node.position.end.line;
-}
-function hasBlockMarkdownChild(child) {
-  if (!React5.isValidElement(child)) {
-    return false;
-  }
-  if (typeof child.type === "string" && BLOCK_MARKDOWN_TAGS.has(child.type)) {
-    return true;
-  }
-  const props = child.props;
-  if (BLOCK_MARKDOWN_TAGS.has(props.node?.tagName || "") || isMultilineCodeNode(props.node)) {
-    return true;
-  }
-  return React5.Children.toArray(props.children).some(hasBlockMarkdownChild);
-}
-function MessageMarkdownParagraph({
-  children,
-  ...props
-}) {
-  const domProps = { ...props };
-  delete domProps.node;
-  const childArray = React5.Children.toArray(children).filter(
-    (child) => child !== null && child !== ""
-  );
-  const isImageOnly = childArray.length === 1 && React5.isValidElement(childArray[0]) && childArray[0].props.node?.tagName === "img";
-  if (isImageOnly) {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { children });
-  }
-  if (childArray.some(hasBlockMarkdownChild)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ...domProps, children });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { ...domProps, children });
-}
-var MESSAGE_RESPONSE_COMPONENTS = {
-  a: SafeMarkdownLink,
-  img: BlockedMarkdownImage,
-  p: MessageMarkdownParagraph
-};
-var streamdownDefaultRehypePlugins = import_streamdown.defaultRehypePlugins || {};
-var streamdownHardenPlugin = Array.isArray(
-  streamdownDefaultRehypePlugins.harden
-) ? streamdownDefaultRehypePlugins.harden[0] : streamdownDefaultRehypePlugins.harden;
-var MESSAGE_RESPONSE_REHYPE_PLUGINS = [
-  ...Object.entries(streamdownDefaultRehypePlugins).filter(([key]) => key !== "harden").map(([, plugin]) => plugin),
-  ...streamdownHardenPlugin ? [
-    [
-      streamdownHardenPlugin,
-      CHAT_MARKDOWN_HARDEN_OPTIONS
-    ]
-  ] : []
-];
-var MessageResponse = React5.memo(
-  ({
-    children,
-    className,
-    components,
-    rehypePlugins,
-    streaming = false,
-    streamingId,
-    ...props
-  }) => {
-    const text = typeof children === "string" || typeof children === "number" ? String(children) : "";
-    const streamingText = useStreamingText({
-      charsPerSecond: 120,
-      id: streamingId || text,
-      isStreaming: streaming && text.length > 0,
-      maxCatchupChars: 32,
-      text
-    });
-    const streamdownComponents = React5.useMemo(
-      () => ({ ...MESSAGE_RESPONSE_COMPONENTS, ...components }),
-      [components]
-    );
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-      import_streamdown.Streamdown,
-      {
-        className: cn("a24-message-response", className),
-        components: streamdownComponents,
-        rehypePlugins: rehypePlugins || MESSAGE_RESPONSE_REHYPE_PLUGINS,
-        ...props,
-        children: text ? streamingText.displayedText : children
-      }
-    );
-  },
-  (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className && prevProps.streaming === nextProps.streaming && prevProps.streamingId === nextProps.streamingId && prevProps.components === nextProps.components
-);
-MessageResponse.displayName = "MessageResponse";
-
-// src/ui/hitl-presentation.ts
-function optionalString(value) {
-  return typeof value === "string" && value.trim() ? value.trim() : null;
-}
-function hitlActionLabel(part, action) {
-  if (action === "approve") return ["tool_review", "app_data_permission"].includes(part.hitlKind) ? "Allow once" : "Approve";
-  if (action === "reject") return ["tool_review", "app_data_permission"].includes(part.hitlKind) ? "Don\u2019t allow" : "Reject";
-  if (action === "connect") return "Connect";
-  return "Skip";
-}
-function hitlTitle(part) {
-  const presentation = part.presentation || {};
-  if (part.hitlKind === "tool_review") return `Run ${optionalString(presentation.tool_name) || "this tool"}?`;
-  if (part.hitlKind === "mcp_auth") {
-    const serverName = optionalString(presentation.server_name);
-    return serverName ? `Connect ${serverName} to continue` : part.message;
-  }
-  if (part.hitlKind === "app_data_permission") return "Allow this data change?";
-  return part.message;
-}
-function resolvedHitlLabel(part) {
-  const outcome = String(part.resolution?.outcome || part.status).trim().toLowerCase();
-  return {
-    approved: part.hitlKind === "user_approval" ? "Approved" : "Allowed",
-    rejected: part.hitlKind === "user_approval" ? "Rejected" : "Not allowed",
-    connected: "connected",
-    skipped: "Skipped",
-    timeout: "Timed out",
-    expired: "Timed out",
-    cancelled: "Cancelled",
-    invalidated: "No longer available",
-    policy_denied: "Not allowed"
-  }[outcome] || outcome.replace(/_/g, " ");
-}
-
-// src/ui/agent-response-timeline.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-function optionalString2(value) {
-  return typeof value === "string" && value.trim() ? value.trim() : null;
-}
-function presentationValue(part, key) {
-  const presentation = part.presentation || {};
-  const snakeKey = key.replace(/[A-Z]/g, (letter) => `_${letter.toLowerCase()}`);
-  return optionalString2(presentation[key]) || optionalString2(presentation[snakeKey]);
-}
-function groupKey(part) {
-  return presentationValue(part, "groupKey");
-}
-function groupLabel(part) {
-  return presentationValue(part, "groupLabel") || toolLabel(part);
-}
-function toolLabel(part) {
-  return presentationValue(part, "activity") || presentationValue(part, "title") || part.toolName || "Tool activity";
-}
-function toolDetail(part) {
-  return presentationValue(part, "detail") || part.errorText || null;
-}
-function isActiveTool(part, activeToolId) {
-  return part.id === activeToolId || part.toolCallId === activeToolId || part.state === "input-available" || part.state === "input-streaming";
-}
-function Shimmer({ children, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: cn("inline-block animate-pulse", className), children });
-}
-function CompactTask({
-  children,
-  defaultOpen = false,
-  detail,
-  error,
-  label,
-  loading
-}) {
-  const [open, setOpen] = React6.useState(defaultOpen);
-  const expandable = Boolean(children || detail);
-  const content = loading ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Shimmer, { children: label }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: label });
-  if (!expandable) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cn("flex min-w-0 items-center gap-1.5 text-sm", error ? "text-destructive" : "text-muted-foreground"), children: content });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-      "button",
-      {
-        "aria-expanded": open,
-        className: cn(
-          "group flex min-w-0 items-center gap-1.5 rounded-md px-0 py-0.5 text-left text-sm transition-colors hover:text-foreground",
-          error ? "text-destructive" : "text-muted-foreground"
-        ),
-        onClick: () => setOpen((value) => !value),
-        type: "button",
-        children: [
-          content,
-          open ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.ChevronDown, { className: "size-3" }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.ChevronRight, { className: "size-3 opacity-70" })
-        ]
-      }
-    ),
-    open ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "mt-1 pl-4 text-sm text-muted-foreground", children: [
-      detail ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: detail }) : null,
-      children
-    ] }) : null
-  ] });
-}
-function ToolPartRow({
-  activeToolId,
-  part
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { "data-agents24-tool-part": part.type, "data-state": part.state, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    CompactTask,
-    {
-      defaultOpen: part.state === "output-error",
-      detail: toolDetail(part),
-      error: part.state === "output-error",
-      label: toolLabel(part),
-      loading: isActiveTool(part, activeToolId)
-    }
-  ) });
-}
-function ToolGroup({
-  activeToolId,
-  parts
-}) {
-  const loading = parts.some((part) => isActiveTool(part, activeToolId));
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CompactTask, { label: groupLabel(parts[0]), loading, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "space-y-1", children: parts.map((part) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-    "div",
-    {
-      className: cn("text-sm", part.state === "output-error" ? "text-destructive" : "text-muted-foreground"),
-      children: [
-        isActiveTool(part, activeToolId) ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Shimmer, { children: toolLabel(part) }) : toolLabel(part),
-        toolDetail(part) ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "ml-1 text-xs text-muted-foreground/75", children: toolDetail(part) }) : null
-      ]
-    },
-    part.id
-  )) }) });
-}
-function HitlPartRow({
-  getHitlActionState,
-  isLoading,
-  onHitlAction,
-  part
-}) {
-  const state = getHitlActionState?.(part);
-  const [comment, setComment] = React6.useState("");
-  const presentation = part.presentation || {};
-  const requireComment = presentation.require_comment === true;
-  const isTerminal = part.status !== "pending";
-  const resolvedRef = React6.useRef(null);
-  const wasTerminal = React6.useRef(isTerminal);
-  React6.useEffect(() => {
-    if (isTerminal && !wasTerminal.current) resolvedRef.current?.focus();
-    wasTerminal.current = isTerminal;
-  }, [isTerminal]);
-  if (isTerminal) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-hitl a24-hitl--resolved px-1 py-1 text-sm text-muted-foreground", ref: resolvedRef, role: "status", tabIndex: -1, children: resolvedHitlLabel(part) });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "a24-hitl space-y-2.5 px-1 py-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-hitl__title text-sm font-medium text-foreground text-pretty", children: hitlTitle(part) }),
-    requireComment ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      "textarea",
-      {
-        "aria-label": "Approval comment",
-        autoComplete: "off",
-        className: "a24-hitl__comment min-h-20 w-full resize-y rounded-md border border-border/60 bg-background px-3 py-2 text-sm outline-none focus-visible:border-neutral-300 focus-visible:ring-0 dark:focus-visible:border-neutral-600",
-        name: "hitl-comment",
-        onChange: (event) => setComment(event.target.value),
-        placeholder: "Comment required\u2026",
-        value: comment
-      }
-    ) : null,
-    state?.error ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-hitl__error text-sm text-destructive", children: state.error }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-hitl__actions flex flex-wrap items-center gap-1.5", children: part.allowedActions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      "button",
-      {
-        "aria-label": hitlActionLabel(part, action),
-        className: cn(
-          "a24-hitl__action min-h-10 rounded-md px-3 text-sm font-medium transition-[background-color,color,opacity,transform] duration-150 ease-out active:scale-[0.96] disabled:pointer-events-none disabled:opacity-60",
-          action === "approve" || action === "connect" ? "bg-neutral-900 text-white hover:bg-neutral-800 dark:bg-neutral-100 dark:text-neutral-900 dark:hover:bg-white" : "bg-transparent text-muted-foreground hover:bg-background/80 hover:text-foreground"
-        ),
-        "data-primary": action === "approve" || action === "connect" ? "" : void 0,
-        disabled: !onHitlAction || isLoading || state?.status === "connecting" || state?.status === "resuming" || requireComment && !comment.trim(),
-        onClick: () => onHitlAction?.(part, action, comment.trim() || void 0),
-        type: "button",
-        children: hitlActionLabel(part, action)
-      },
-      action
-    )) })
-  ] });
-}
-function DefaultPartRow({
-  activeToolId,
-  getHitlActionState,
-  isLoading,
-  message,
-  onHitlAction,
-  part
-}) {
-  if (part.kind === "text") return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MessageResponse, { children: part.text });
-  if (part.kind === "tool") return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ToolPartRow, { activeToolId, part });
-  if (part.kind === "reasoning") {
-    const label = part.text || part.label || "Thinking";
-    return part.status === "running" || part.status === "streaming" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Shimmer, { className: "text-sm text-muted-foreground", children: label }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "text-sm text-muted-foreground", children: label });
-  }
-  if (part.kind === "ui-blocks") {
-    if (part.state === "output-error") {
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "text-sm text-destructive", children: part.errorText || "Failed to render UI content." });
-    }
-    return part.bundle ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SafeUiBlocks, { bundle: part.bundle }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CompactTask, { label: part.state === "input-streaming" ? "Rendering UI block" : "Rendered UI block", loading: part.state === "input-streaming" });
-  }
-  if (part.kind === "hitl") {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      HitlPartRow,
-      {
-        getHitlActionState,
-        isLoading,
-        onHitlAction,
-        part
-      }
-    );
-  }
-  if (part.kind === "error") return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "text-sm text-destructive", role: "alert", children: part.errorText });
-  if (part.kind === "source") {
-    const href = safeExternalUrl(part.url);
-    return href ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("a", { className: "a24-source-link", href, rel: "noopener noreferrer", target: "_blank", children: part.title }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "a24-source-link", children: part.title });
-  }
-  if (part.kind === "citation") {
-    const href = safeExternalUrl(part.url);
-    const label = part.label || "Citation";
-    return href ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("a", { className: "a24-citation", href, rel: "noopener noreferrer", target: "_blank", children: label }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "a24-citation", children: label });
-  }
-  if (part.kind === "attachment") return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-output-attachment", children: part.attachment.filename || "Attachment" });
-  if (part.kind === "data") return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { "data-agents24-data-part": part.name, className: "hidden", children: message.id });
-  return null;
-}
-function safeExternalUrl(value) {
-  if (!value) return null;
-  try {
-    const url = new URL(value);
-    return url.protocol === "https:" || url.protocol === "http:" ? url.href : null;
-  } catch {
-    return null;
-  }
-}
-function SafeUiBlocks({ bundle }) {
-  const rows = Array.isArray(bundle.rows) ? bundle.rows : [];
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("section", { "aria-label": typeof bundle.title === "string" ? bundle.title : "Agent result", className: "a24-ui-blocks", children: [
-    typeof bundle.title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h3", { children: bundle.title }) : null,
-    rows.map((rawRow, rowIndex) => {
-      const row = rawRow && typeof rawRow === "object" && !Array.isArray(rawRow) ? rawRow : {};
-      const blocks = Array.isArray(row.blocks) ? row.blocks : [];
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-ui-blocks__row", children: blocks.map((rawBlock, blockIndex) => {
-        const block = rawBlock && typeof rawBlock === "object" && !Array.isArray(rawBlock) ? rawBlock : {};
-        const title = typeof block.title === "string" ? block.title : "Result";
-        const kind = String(block.kind || "note");
-        if (kind === "table" && Array.isArray(block.columns) && Array.isArray(block.rows)) {
-          return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "a24-ui-block", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { children: title }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "a24-ui-table-scroll", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("table", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("tr", { children: block.columns.map((column, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("th", { children: String(column) }, index)) }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("tbody", { children: block.rows.map((rawCells, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("tr", { children: (Array.isArray(rawCells) ? rawCells : []).map((cell, cellIndex) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { children: String(cell) }, cellIndex)) }, index)) })
-            ] }) })
-          ] }, String(block.id || blockIndex));
-        }
-        const value = block.value ?? block.text ?? "";
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "a24-ui-block", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: String(value) })
-        ] }, String(block.id || blockIndex));
-      }) }, `row-${rowIndex}`);
-    })
-  ] });
-}
-function AgentResponseTimeline({
-  getHitlActionState,
-  isLoading = false,
-  message,
-  onHitlAction,
-  renderPart
-}) {
-  const parts = message.parts || [];
-  const activeToolId = [...parts].reverse().find((part) => part.kind === "tool" && (part.state === "input-available" || part.state === "input-streaming"))?.id;
-  const rendered = [];
-  let index = 0;
-  while (index < parts.length) {
-    const part = parts[index];
-    if (part.kind === "tool" && groupKey(part)) {
-      const key = groupKey(part);
-      const group = [];
-      while (index < parts.length) {
-        const candidate = parts[index];
-        if (candidate.kind !== "tool" || groupKey(candidate) !== key) break;
-        group.push(candidate);
-        index += 1;
-      }
-      rendered.push(group.length === 1 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ToolPartRow, { activeToolId, part: group[0] }, group[0].id) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ToolGroup, { activeToolId, parts: group }, `tool-group-${key}-${group[0].id}`));
-      continue;
-    }
-    rendered.push(
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(React6.Fragment, { children: renderPart ? renderPart(part, message) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-        DefaultPartRow,
-        {
-          activeToolId,
-          getHitlActionState,
-          isLoading,
-          message,
-          onHitlAction,
-          part
-        }
-      ) }, part.id)
-    );
-    index += 1;
-  }
-  if (rendered.length === 0 && message.content) {
-    rendered.push(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MessageResponse, { children: message.content }, `${message.id}-fallback`));
-  }
-  if (rendered.length === 0 && isLoading) {
-    rendered.push(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "text-sm text-muted-foreground", children: "Thinking" }, `${message.id}-thinking`));
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "space-y-3", children: rendered });
-}
-
-// src/ui/agent-chat-message.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var DEFAULT_USER_MESSAGE_COLLAPSE_THRESHOLD = 360;
-var DEFAULT_USER_MESSAGE_COLLAPSED_LINES = 4;
-function shouldCollapseUserMessage(content, threshold = DEFAULT_USER_MESSAGE_COLLAPSE_THRESHOLD) {
-  return typeof threshold === "number" && threshold > 0 && content.length > threshold;
-}
-function AgentChatUserMessageContent({
-  collapsedLines = DEFAULT_USER_MESSAGE_COLLAPSED_LINES,
-  collapseThreshold = DEFAULT_USER_MESSAGE_COLLAPSE_THRESHOLD,
-  content,
-  showLessLabel = "Show less",
-  showMoreLabel = "Show more"
-}) {
-  const [isExpanded, setIsExpanded] = React7.useState(false);
-  const contentId = React7.useId();
-  const shouldCollapse = shouldCollapseUserMessage(content, collapseThreshold);
-  const Icon = isExpanded ? import_lucide_react4.ChevronUp : import_lucide_react4.ChevronDown;
-  const clampedStyle = shouldCollapse && !isExpanded ? {
-    WebkitBoxOrient: "vertical",
-    WebkitLineClamp: Math.max(1, collapsedLines),
-    display: "-webkit-box",
-    overflow: "hidden"
-  } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex min-w-0 flex-col gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { id: contentId, className: "min-w-0", style: clampedStyle, children: content }),
-    shouldCollapse ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-      "button",
-      {
-        "aria-controls": contentId,
-        "aria-expanded": isExpanded,
-        className: cn(
-          "inline-flex w-fit items-center gap-1 rounded-md text-left text-sm font-medium text-muted-foreground transition-colors",
-          "hover:text-foreground focus-visible:border-neutral-300 focus-visible:outline-none focus-visible:ring-0"
-        ),
-        onClick: () => setIsExpanded((current) => !current),
-        type: "button",
-        children: [
-          isExpanded ? showLessLabel : showMoreLabel,
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon, { "aria-hidden": "true", className: "size-4", strokeWidth: 2 })
-        ]
-      }
-    ) : null
-  ] });
-}
-function AgentChatMessage({
-  actionHandlers,
-  actions,
-  actionsClassName,
-  className,
-  contentClassName,
-  dir,
-  getHitlActionState,
-  message,
-  onHitlAction,
-  renderAssistantContent,
-  renderPart,
-  renderUserContent,
-  showAssistantAttachments = false,
-  streamingMessageId,
-  userMessageCollapsedLines,
-  userMessageContent,
-  userMessageCollapseThreshold,
-  userMessageShowLessLabel,
-  userMessageShowMoreLabel
-}) {
-  const isAssistant = message.role === "assistant";
-  const isStreaming = isAssistant && message.id === streamingMessageId;
-  const resolvedUserContent = userMessageContent ?? message.content;
-  const shouldRenderContent = isAssistant || Boolean(renderUserContent || resolvedUserContent);
-  const showAttachments = Boolean(message.attachments?.length) && (message.role === "user" || showAssistantAttachments);
-  const renderedActions = actions ?? (actionHandlers ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AgentChatDefaultActions, { handlers: actionHandlers, message }) : null);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(ChatMessage, { className, dir, from: message.role, children: [
-    showAttachments ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ChatAttachments, { className: "mb-2", dir, children: message.attachments?.map((attachment, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-      ChatAttachment,
-      {
-        data: attachment,
-        dir: "ltr"
-      },
-      String(attachment.url || attachment.filename || index)
-    )) }) : null,
-    shouldRenderContent ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-      ChatMessageContent,
-      {
-        className: cn(isAssistant ? "bg-transparent p-0" : void 0, contentClassName),
-        dir,
-        children: [
-          isAssistant ? renderAssistantContent ? renderAssistantContent({ isStreaming, message }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            AgentResponseTimeline,
-            {
-              getHitlActionState,
-              isLoading: isStreaming,
-              message,
-              onHitlAction,
-              renderPart
-            }
-          ) : null,
-          !isAssistant ? renderUserContent ? renderUserContent({ message }) : resolvedUserContent ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            AgentChatUserMessageContent,
-            {
-              collapsedLines: userMessageCollapsedLines,
-              collapseThreshold: userMessageCollapseThreshold,
-              content: resolvedUserContent,
-              showLessLabel: userMessageShowLessLabel,
-              showMoreLabel: userMessageShowMoreLabel
-            }
-          ) : null : null
-        ]
-      }
-    ) : null,
-    renderedActions ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: cn(dir === "rtl" ? "mt-1 h-9 w-full translate-x-2" : "mt-1 h-9 w-full -translate-x-2", actionsClassName), children: renderedActions }) : null
-  ] });
-}
-
-// src/templates/agent-chat-layout.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var stateCopy = {
-  loading: { title: "Loading chat", detail: "Your conversation is being prepared." },
-  reconnecting: { title: "Reconnecting", detail: "Messages are safe. Trying the connection again." },
-  offline: { title: "You\u2019re offline", detail: "Reconnect to continue this conversation." },
-  denied: { title: "Access denied", detail: "This deployment does not allow this request." },
-  quota: { title: "Usage limit reached", detail: "Try again after the deployment limit resets." },
-  failed: { title: "Something went wrong", detail: "The request could not be completed safely." },
-  expired: { title: "Session expired", detail: "Reconnect to start a new secure session." }
-};
-function AgentChatStatePanel({
-  errorMessage,
-  onRetry,
-  state
-}) {
-  const copy = stateCopy[state];
-  const retryable = state === "offline" || state === "failed" || state === "expired";
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-state", "data-state": state, role: state === "failed" ? "alert" : "status", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "a24-state__icon", "aria-hidden": "true", children: state === "offline" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.WifiOff, {}) : state === "reconnecting" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.RefreshCw, {}) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.MessageSquare, {}) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h2", { children: copy.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { children: errorMessage || copy.detail }),
-    retryable && onRetry ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { className: "a24-button a24-button--primary", onClick: () => void onRetry(), type: "button", children: "Try again" }) : null
-  ] });
-}
-function connectionLabel(state) {
-  if (state === "connected") return "Connected";
-  if (state === "connecting") return "Connecting";
-  if (state === "reconnecting") return "Reconnecting";
-  if (state === "expired") return "Session expired";
-  return "Offline";
-}
-function AgentAvatar({ agent }) {
-  return agent.avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("img", { alt: "", className: "a24-avatar", height: 36, src: agent.avatarUrl, width: 36 }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { "aria-hidden": "true", className: "a24-avatar a24-avatar--fallback", children: agent.name.trim().slice(0, 1).toUpperCase() || "A" });
-}
-function AgentTargetSelector({ agent, selector }) {
-  const rootRef = React8.useRef(null);
-  const triggerRef = React8.useRef(null);
-  const inputId = React8.useId();
-  const [draft, setDraft] = React8.useState(selector.value);
-  const [error, setError] = React8.useState(null);
-  const [open, setOpen] = React8.useState(false);
-  const [submitting, setSubmitting] = React8.useState(false);
-  React8.useEffect(() => setDraft(selector.value), [selector.value]);
-  React8.useEffect(() => {
-    if (!open) return void 0;
-    const closeOnPointerDown = (event) => {
-      if (!rootRef.current?.contains(event.target)) setOpen(false);
-    };
-    const closeOnEscape = (event) => {
-      if (event.key !== "Escape") return;
-      event.preventDefault();
-      setOpen(false);
-      triggerRef.current?.focus();
-    };
-    document.addEventListener("pointerdown", closeOnPointerDown);
-    document.addEventListener("keydown", closeOnEscape);
-    return () => {
-      document.removeEventListener("pointerdown", closeOnPointerDown);
-      document.removeEventListener("keydown", closeOnEscape);
-    };
-  }, [open]);
-  const apply = async (event) => {
-    event.preventDefault();
-    const value = draft.trim();
-    if (!value) {
-      setError(`${selector.label} is required.`);
-      return;
-    }
-    setSubmitting(true);
-    setError(null);
-    try {
-      await selector.onApply(value);
-      setOpen(false);
-    } catch (nextError) {
-      setError(nextError instanceof Error ? nextError.message : "The target could not be changed.");
-    } finally {
-      setSubmitting(false);
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-target-selector", "data-open": open || void 0, ref: rootRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-      "button",
-      {
-        "aria-expanded": open,
-        "aria-haspopup": "dialog",
-        "aria-label": `Change ${selector.label}`,
-        className: "a24-target-selector__trigger",
-        onClick: () => setOpen((value) => !value),
-        ref: triggerRef,
-        type: "button",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AgentAvatar, { agent }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "a24-target-selector__copy", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("strong", { children: agent.name }),
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: agent.description || "Click to change target" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.ChevronDown, { "aria-hidden": "true" })
-        ]
-      }
-    ),
-    open ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("form", { "aria-label": `Change ${selector.label}`, className: "a24-target-selector__panel", onSubmit: (event) => void apply(event), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("label", { htmlFor: inputId, children: selector.label }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("input", { autoComplete: "off", id: inputId, onChange: (event) => setDraft(event.target.value), placeholder: selector.placeholder, spellCheck: false, value: draft }),
-      selector.helperText ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { children: selector.helperText }) : null,
-      error ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "a24-target-selector__error", role: "alert", children: error }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { className: "a24-button a24-target-selector__apply", disabled: submitting || !draft.trim(), type: "submit", children: submitting ? "Switching\u2026" : "Use target" })
-    ] }) : null
-  ] });
-}
-function ThreadNavigation({
-  activeThreadId,
-  agent,
-  close,
-  hasMoreThreads,
-  isDeletingThread,
-  isLoadingThreads,
-  onDeleteThread,
-  onLoadMoreThreads,
-  onNewThread,
-  onOpenThread,
-  slots,
-  targetSelector,
-  threads
-}) {
-  const [query, setQuery] = React8.useState("");
-  const normalizedQuery = query.trim().toLocaleLowerCase();
-  const visibleThreads = normalizedQuery ? threads.filter((thread) => String(thread.title || "New chat").toLocaleLowerCase().includes(normalizedQuery)) : threads;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-sidebar__inner", children: [
-    targetSelector ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AgentTargetSelector, { agent, selector: targetSelector }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-sidebar__top", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-        "button",
-        {
-          "aria-label": "New chat",
-          className: "a24-button a24-button--primary a24-sidebar__new",
-          onClick: () => {
-            onNewThread();
-            close();
-          },
-          type: "button",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.Plus, { "aria-hidden": "true" }),
-            "New chat"
-          ]
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "aria-label": "Close conversations", className: "a24-icon-button a24-sidebar__mobile-close", onClick: close, type: "button", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.X, { "aria-hidden": "true" }) })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("label", { className: "a24-search", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.Search, { "aria-hidden": "true" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "a24-sr-only", children: "Search conversations" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-        "input",
-        {
-          autoComplete: "off",
-          name: "conversation-search",
-          onChange: (event) => setQuery(event.target.value),
-          placeholder: "Search conversations\u2026",
-          type: "search",
-          value: query
-        }
-      )
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("nav", { "aria-label": "Conversations", className: "a24-thread-list", children: [
-      isLoadingThreads && threads.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "a24-sidebar__hint", role: "status", children: "Loading conversations\u2026" }) : null,
-      !isLoadingThreads && visibleThreads.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "a24-sidebar__hint", children: "No conversations yet." }) : null,
-      visibleThreads.map((thread) => {
-        const selected = thread.id === activeThreadId;
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-thread", "data-selected": selected || void 0, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-            "button",
-            {
-              "aria-current": selected ? "page" : void 0,
-              className: "a24-thread__open",
-              onClick: () => {
-                void onOpenThread(thread.id);
-                close();
-              },
-              type: "button",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "a24-thread__title", children: thread.title || "New chat" }),
-                thread.status ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "a24-thread__status", children: thread.status }) : null
-              ]
-            }
-          ),
-          slots?.threadActions ? slots.threadActions(thread) : onDeleteThread ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            "button",
-            {
-              "aria-label": `Delete ${thread.title || "conversation"}`,
-              className: "a24-icon-button a24-thread__delete",
-              disabled: isDeletingThread,
-              onClick: () => void onDeleteThread(thread.id),
-              type: "button",
-              children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.Trash2, { "aria-hidden": "true" })
-            }
-          ) : null
-        ] }, thread.id);
-      })
-    ] }),
-    hasMoreThreads && onLoadMoreThreads ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("button", { className: "a24-button a24-button--quiet a24-sidebar__more", onClick: () => void onLoadMoreThreads(), type: "button", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.MoreHorizontal, { "aria-hidden": "true" }),
-      "Load more"
-    ] }) : null
-  ] });
-}
-function AgentChatLayout({
-  activeThreadId,
-  agent,
-  allowAttachments = true,
-  className,
-  connectionState = "connected",
-  dir = "ltr",
-  errorMessage,
-  hasMoreThreads,
-  isDeletingThread,
-  isLoadingOlder,
-  isLoadingThreads,
-  isRunning = false,
-  messages,
-  modelId,
-  models = [],
-  onDeleteThread,
-  onHitlAction,
-  onLoadMoreThreads,
-  onLoadOlder,
-  onModelChange,
-  onNewThread,
-  onOpenThread,
-  onRetryConnection,
-  onStop,
-  onSubmit,
-  placeholder,
-  slots,
-  state = "ready",
-  streamingMessageId,
-  targetSelector,
-  threads,
-  title
-}) {
-  const [sidebarOpen, setSidebarOpen] = React8.useState(false);
-  const menuButtonRef = React8.useRef(null);
-  const closeSidebar = React8.useCallback(() => {
-    setSidebarOpen(false);
-    menuButtonRef.current?.focus();
-  }, []);
-  React8.useEffect(() => {
-    if (!sidebarOpen) return void 0;
-    const onKeyDown = (event) => {
-      if (event.key !== "Escape") return;
-      event.preventDefault();
-      closeSidebar();
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [closeSidebar, sidebarOpen]);
-  const shellState = state === "streaming" || state === "paused" ? "ready" : state;
-  const showState = shellState !== "ready";
-  const liveLabel = state === "streaming" ? "Agent is responding" : state === "paused" ? "Waiting for your response" : connectionLabel(connectionState);
-  const composer = /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-    AgentChatComposer,
-    {
-      allowAttachments,
-      disabled: state === "denied" || state === "quota" || state === "expired" || state === "offline",
-      inputToolbarContent: models.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("label", { className: "a24-model-select", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "a24-sr-only", children: "Model" }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("select", { "aria-label": "Model", onChange: (event) => onModelChange?.(event.target.value), value: modelId || models[0]?.id, children: models.map((model) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("option", { value: model.id, children: model.label }, model.id)) }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.ChevronDown, { "aria-hidden": "true" })
-      ] }) : void 0,
-      isRunning,
-      onStop,
-      onSubmit,
-      placeholder
-    }
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("section", { className: cn("a24-chat", className), "data-agents24-chat-layout": "", dir, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("a", { className: "a24-skip-link", href: "#agents24-chat-main", children: "Skip to messages" }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("nav", { "aria-label": "Chat navigation", className: "a24-sidebar", "data-open": sidebarOpen || void 0, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-      ThreadNavigation,
-      {
-        activeThreadId,
-        agent,
-        close: closeSidebar,
-        hasMoreThreads,
-        isDeletingThread,
-        isLoadingThreads,
-        onDeleteThread,
-        onLoadMoreThreads,
-        onNewThread,
-        onOpenThread,
-        slots,
-        targetSelector,
-        threads
-      }
-    ) }),
-    sidebarOpen ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "aria-label": "Close conversations", className: "a24-sidebar-backdrop", onClick: closeSidebar, type: "button" }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-chat__body", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("header", { className: "a24-header", role: "banner", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "aria-label": "Open conversations", className: "a24-icon-button a24-header__menu", onClick: () => setSidebarOpen(true), ref: menuButtonRef, type: "button", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.Menu, { "aria-hidden": "true" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AgentAvatar, { agent }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-header__identity", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h1", { children: title || agent.name }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "a24-connection", "data-state": connectionState, children: [
-            connectionState === "offline" || connectionState === "expired" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.WifiOff, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.Wifi, { "aria-hidden": "true" }),
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: connectionLabel(connectionState) })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "a24-header__actions", children: slots?.headerActions })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("main", { "aria-busy": state === "loading" || state === "reconnecting", className: "a24-main", id: "agents24-chat-main", children: showState ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AgentChatStatePanel, { errorMessage, onRetry: onRetryConnection, state: shellState }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-        AgentChatShell,
-        {
-          composer,
-          dir,
-          isLoadingOlder,
-          messages,
-          onLoadOlder,
-          renderEmptyState: slots?.empty ? () => slots.empty : void 0,
-          renderMessage: (message) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            AgentChatMessage,
-            {
-              actions: slots?.messageActions?.(message),
-              message,
-              onHitlAction: (part, action, comment) => void onHitlAction?.(part, action, comment),
-              renderAssistantContent: slots?.assistantBody,
-              streamingMessageId
-            }
-          )
-        }
-      ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { "aria-live": "polite", "aria-atomic": "true", className: "a24-sr-only", children: liveLabel })
-    ] })
-  ] });
-}
-
-// src/templates/agent-chat-app.tsx
-var import_react2 = require("@agents24/react");
-var React9 = __toESM(require("react"), 1);
-
-// src/mcp-oauth.ts
-var UUID_PATTERN = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
-function isLoopback(hostname) {
-  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "[::1]";
-}
-function normalizedOrigin(value) {
-  try {
-    const url = new URL(value);
-    if (url.protocol !== "https:" && !(url.protocol === "http:" && isLoopback(url.hostname))) {
-      throw new Error("unsafe callback origin");
-    }
-    if (url.origin === "null") throw new Error("opaque callback origin");
-    return url.origin;
-  } catch {
-    throw new Error("MCP authorization returned an invalid callback origin.");
-  }
-}
-function validateMcpCallbackResult(result, expectedServerId) {
-  const serverId = String(result.server_id || "").trim();
-  const connectionId = String(result.connection_id || "").trim();
-  if (!serverId || serverId !== expectedServerId) {
-    throw new Error("MCP authorization completed for an unexpected server.");
-  }
-  if (!UUID_PATTERN.test(connectionId)) {
-    throw new Error("MCP authorization returned an invalid connection identity.");
-  }
-  return result;
-}
-function waitForMcpOauthComplete({
-  popup,
-  callbackOrigin,
-  popupNonce,
-  requireConnectionId = false,
-  serverId,
-  timeoutMs = 12e4
-}) {
-  if (!popup) return Promise.reject(new Error("Could not open the MCP authorization popup."));
-  const expectedOrigin = normalizedOrigin(callbackOrigin);
-  const expectedServerId = String(serverId || "").trim();
-  const expectedPopupNonce = String(popupNonce || "").trim();
-  if (!expectedServerId) return Promise.reject(new Error("MCP authorization is missing its server identity."));
-  if (!expectedPopupNonce) return Promise.reject(new Error("MCP authorization is missing its popup binding."));
-  const returnFocusTo = typeof document !== "undefined" ? document.activeElement : null;
-  return new Promise((resolve, reject) => {
-    let settled = false;
-    const finish = (result) => {
-      if (settled) return;
-      settled = true;
-      window.clearTimeout(timeout);
-      window.clearInterval(closeTimer);
-      window.removeEventListener("message", onMessage);
-      returnFocusTo?.focus?.();
-      if (result instanceof Error) reject(result);
-      else resolve(result);
-    };
-    const onMessage = (event) => {
-      if (event.source !== popup || event.origin !== expectedOrigin) return;
-      const data = event.data;
-      if (data?.type !== "agents24.mcp.callback" || data.server_id !== expectedServerId || data.popup_nonce !== expectedPopupNonce) return;
-      const code = String(data.code || "").trim();
-      if (!code || code.length > 2048) return;
-      const connectionId = String(data.connection_id || "").trim();
-      if ((requireConnectionId || connectionId) && !UUID_PATTERN.test(connectionId)) return;
-      finish({
-        code,
-        ...connectionId ? { connectionId } : {},
-        popupNonce: expectedPopupNonce,
-        serverId: expectedServerId
-      });
-    };
-    const timeout = window.setTimeout(
-      () => finish(new Error("MCP authorization timed out.")),
-      Math.max(1, timeoutMs)
-    );
-    const closeTimer = window.setInterval(() => {
-      if (popup.closed) finish(new Error("MCP authorization window was closed before connecting."));
-    }, 500);
-    window.addEventListener("message", onMessage);
-  });
-}
-
-// src/templates/agent-chat-app.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-function browserCrypto() {
-  const value = globalThis.crypto;
-  if (!value?.subtle || !value.randomUUID) throw new Error("Secure browser crypto is required for MCP authorization.");
-  return value;
-}
-function base64Url(bytes) {
-  let binary = "";
-  bytes.forEach((byte) => {
-    binary += String.fromCharCode(byte);
-  });
-  return btoa(binary).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/g, "");
-}
-async function createPkceProof() {
-  const crypto2 = browserCrypto();
-  const verifier = base64Url(crypto2.getRandomValues(new Uint8Array(32)));
-  const bytes = new TextEncoder().encode(verifier);
-  const digest = await crypto2.subtle.digest("SHA-256", bytes);
-  return { verifier, challenge: base64Url(new Uint8Array(digest)) };
-}
-function stateFromError(error) {
-  const typed = error;
-  if (typed?.kind === "authentication") return "expired";
-  if (typed?.kind === "authorization") return "denied";
-  if (typed?.kind === "quota" || typed?.kind === "rate_limit") return "quota";
-  if (typed?.kind === "network") return "offline";
-  return "failed";
-}
-function BoundAgentChatApp({
-  agent: agentOverride,
-  client,
-  completeMcpAuthorization,
-  mcpRedirectUri,
-  modelId,
-  models: modelOverrides,
-  onModelChange,
-  slots,
-  ...layoutProps
-}) {
-  const controller = (0, import_react2.useAgentChat)();
-  const attachments = (0, import_react2.useAgentAttachments)();
-  const mcp = (0, import_react2.useAgentMcp)();
-  const [agent, setAgent] = React9.useState(agentOverride || { name: "Agent" });
-  const [capabilities, setCapabilities] = React9.useState([]);
-  const [bootstrapModels, setBootstrapModels] = React9.useState([]);
-  const [selectedModelId, setSelectedModelId] = React9.useState(modelId || null);
-  const [bootstrapLoading, setBootstrapLoading] = React9.useState(true);
-  const [localError, setLocalError] = React9.useState(null);
-  const [liked, setLiked] = React9.useState({});
-  const [disliked, setDisliked] = React9.useState({});
-  const loadBootstrap = React9.useCallback(async () => {
-    setBootstrapLoading(true);
-    setLocalError(null);
-    try {
-      const bootstrap = await client.bootstrap();
-      if (!agentOverride) setAgent({ name: bootstrap.deployment.name || "Agent" });
-      setCapabilities(bootstrap.capabilities);
-      const modelFeatures = bootstrap.features.models;
-      const allowedModelIds = Array.isArray(modelFeatures?.allowed_ids) ? modelFeatures.allowed_ids.filter((value) => typeof value === "string") : [];
-      if (bootstrap.capabilities.includes("models.select") && modelFeatures?.selectable) {
-        setBootstrapModels(allowedModelIds.map((id) => ({ id, label: id })));
-        if (!modelId) {
-          const defaultId = typeof modelFeatures.default_id === "string" ? modelFeatures.default_id : allowedModelIds[0];
-          setSelectedModelId(defaultId || null);
-        }
-      } else {
-        setBootstrapModels([]);
-      }
-      await controller.refreshThreads();
-    } catch (error2) {
-      setLocalError(error2);
-    } finally {
-      setBootstrapLoading(false);
-    }
-  }, [agentOverride, client, controller.refreshThreads, modelId]);
-  React9.useEffect(() => {
-    if (modelId !== void 0) setSelectedModelId(modelId);
-  }, [modelId]);
-  React9.useEffect(() => {
-    void loadBootstrap();
-  }, [loadBootstrap]);
-  const submit = React9.useCallback(async (message) => {
-    setLocalError(null);
-    try {
-      const uploaded = await Promise.all(message.files.map((file) => attachments.upload({
-        data: file.source,
-        name: file.filename,
-        mediaType: file.mediaType,
-        threadId: controller.activeThreadId || void 0
-      })));
-      await controller.submit({
-        text: message.text,
-        attachmentIds: uploaded.flatMap((attachment) => attachment.id ? [attachment.id] : []),
-        attachments: uploaded,
-        requestedModelId: selectedModelId || void 0
-      });
-    } catch (error2) {
-      setLocalError(error2);
-    }
-  }, [attachments, controller, selectedModelId]);
-  const deleteThread = React9.useCallback(async (threadId) => {
-    if (!window.confirm("Delete this conversation? This cannot be undone.")) return;
-    await controller.deleteThread(threadId);
-  }, [controller.deleteThread]);
-  const changeModel = React9.useCallback((nextModelId) => {
-    if (modelId === void 0) setSelectedModelId(nextModelId);
-    onModelChange?.(nextModelId);
-  }, [modelId, onModelChange]);
-  const handleMcp = React9.useCallback(async (part) => {
-    if (!mcpRedirectUri) throw new Error("mcpRedirectUri is required for MCP Connect.");
-    const serverId = String(part.presentation.server_id || "").trim();
-    if (!serverId) throw new Error("MCP authorization is missing its server identity.");
-    const runId = controller.activeRunId || controller.messages.find((message) => message.parts.includes(part))?.runId;
-    if (!runId) throw new Error("MCP authorization is missing its paused run.");
-    const popupNonce = browserCrypto().randomUUID();
-    const proof = await createPkceProof();
-    const popup = window.open("about:blank", "agents24-mcp", "popup,width=560,height=720");
-    try {
-      const start = await mcp.startAuthorization({
-        runId,
-        serverId,
-        interruptId: part.interruptId,
-        redirectUri: mcpRedirectUri,
-        popupNonce,
-        codeChallenge: proof.challenge
-      });
-      if (!start.callback_origin) throw new Error("MCP authorization did not return a callback origin.");
-      if (popup) popup.location.replace(start.authorization_url);
-      const completion = await waitForMcpOauthComplete({
-        popup,
-        callbackOrigin: start.callback_origin,
-        popupNonce,
-        requireConnectionId: Boolean(completeMcpAuthorization),
-        serverId
-      });
-      if (completeMcpAuthorization) {
-        await completeMcpAuthorization({ completion, codeVerifier: proof.verifier, serverId });
-      } else {
-        const redeemed = await mcp.redeemCallback({ code: completion.code, codeVerifier: proof.verifier });
-        validateMcpCallbackResult(redeemed, serverId);
-      }
-      popup?.close();
-      await controller.resumeHitl(part, "connect");
-    } catch (error2) {
-      popup?.close();
-      throw error2;
-    }
-  }, [completeMcpAuthorization, controller, mcp, mcpRedirectUri]);
-  const onHitlAction = React9.useCallback(async (part, action, comment) => {
-    setLocalError(null);
-    try {
-      if (part.hitlKind === "mcp_auth" && action === "connect") await handleMcp(part);
-      else await controller.resumeHitl(part, action, comment);
-    } catch (error2) {
-      setLocalError(error2);
-    }
-  }, [controller, handleMcp]);
-  const error = localError || controller.error;
-  const state = bootstrapLoading ? "loading" : error ? stateFromError(error) : controller.runState === "streaming" ? "streaming" : controller.runState === "reconnecting" ? "reconnecting" : controller.runState === "paused" ? "paused" : "ready";
-  const connectionState = state === "offline" ? "offline" : state === "expired" ? "expired" : state === "reconnecting" ? "reconnecting" : bootstrapLoading ? "connecting" : "connected";
-  const defaultMessageActions = (message) => message.role === "assistant" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    AgentChatDefaultActions,
-    {
-      handlers: {
-        copied: false,
-        disliked: Boolean(disliked[message.id]),
-        liked: Boolean(liked[message.id]),
-        onCopy: async (content) => navigator.clipboard.writeText(content),
-        onDislike: () => {
-          setDisliked((current) => ({ ...current, [message.id]: !current[message.id] }));
-          setLiked((current) => ({ ...current, [message.id]: false }));
-        },
-        onLike: () => {
-          setLiked((current) => ({ ...current, [message.id]: !current[message.id] }));
-          setDisliked((current) => ({ ...current, [message.id]: false }));
-        },
-        onRetry: () => controller.regenerate(message)
-      },
-      message
-    }
-  ) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    AgentChatLayout,
-    {
-      ...layoutProps,
-      activeThreadId: controller.activeThreadId,
-      agent,
-      allowAttachments: layoutProps.allowAttachments ?? capabilities.includes("attachments.write"),
-      connectionState,
-      errorMessage: error instanceof Error ? error.message : null,
-      isLoadingOlder: controller.isLoadingOlder,
-      isLoadingThreads: controller.isLoadingThreads,
-      isRunning: controller.runState === "streaming" || controller.isSubmitting,
-      messages: controller.messages,
-      hasMoreThreads: controller.hasMoreThreads,
-      modelId: selectedModelId,
-      models: modelOverrides ?? bootstrapModels,
-      onDeleteThread: deleteThread,
-      onHitlAction,
-      onLoadOlder: controller.hasOlderTurns ? controller.loadOlder : void 0,
-      onLoadMoreThreads: controller.hasMoreThreads ? controller.loadMoreThreads : void 0,
-      onModelChange: changeModel,
-      onNewThread: controller.startNewThread,
-      onOpenThread: controller.openThread,
-      onRetryConnection: loadBootstrap,
-      onStop: () => void controller.cancelRun(),
-      onSubmit: submit,
-      slots: { ...slots, messageActions: slots?.messageActions || defaultMessageActions },
-      state,
-      streamingMessageId: controller.streamingMessageId,
-      threads: controller.threads.map((thread) => ({ id: thread.id, title: thread.title, status: thread.last_run_status || thread.status, updatedAt: thread.updated_at }))
-    }
-  );
-}
-function AgentChatApp({
-  client,
-  createAbortController,
-  createId: createId2,
-  storage,
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    import_react2.Agents24Provider,
-    {
-      client,
-      createAbortController: createAbortController || (() => new AbortController()),
-      createId: createId2,
-      storage,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(BoundAgentChatApp, { client, ...props })
-    }
-  );
-}
-
-// src/templates/appearance-control.tsx
-var import_lucide_react6 = require("lucide-react");
-var React10 = __toESM(require("react"), 1);
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var MODES = ["system", "light", "dark"];
-function storedMode(storageKey) {
-  if (typeof window === "undefined") return "system";
-  const value = window.localStorage.getItem(storageKey);
-  return value === "light" || value === "dark" ? value : "system";
-}
-function applyMode(mode) {
-  if (typeof document === "undefined") return;
-  document.documentElement.dataset.agents24ColorMode = mode;
-}
-function AgentChatAppearanceControl({
-  storageKey = "agents24-color-mode"
-}) {
-  const [mode, setMode] = React10.useState(() => storedMode(storageKey));
-  React10.useEffect(() => applyMode(mode), [mode]);
-  const label = `Appearance: ${mode[0]?.toUpperCase()}${mode.slice(1)}`;
-  const Icon = mode === "light" ? import_lucide_react6.Sun : mode === "dark" ? import_lucide_react6.Moon : import_lucide_react6.Monitor;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    "button",
-    {
-      "aria-label": `${label}. Activate to change.`,
-      className: "a24-icon-button a24-appearance",
-      onClick: () => {
-        const next = MODES[(MODES.indexOf(mode) + 1) % MODES.length] || "system";
-        window.localStorage.setItem(storageKey, next);
-        setMode(next);
-      },
-      title: label,
-      type: "button",
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { "aria-hidden": "true" }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "a24-sr-only", children: label })
-      ]
-    }
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  AgentChatApp,
-  AgentChatAppearanceControl,
-  AgentChatLayout,
-  AgentChatShell,
-  AgentChatStatePanel,
-  buildAgentChatOutlineItems,
-  getAgentChatShellScrollState
-});
-//# sourceMappingURL=index.cjs.map