@tangle-network/ui 11.9.0 → 11.11.0

package/dist/chunk-7YOCS6IF.js

@@ -1,728 +0,0 @@
-import {
-  useAutoScroll,
-  useRunCollapseState,
-  useRunGroups
-} from "./chunk-565EATZZ.js";
-import {
-  InlineThinkingItem,
-  RunGroup
-} from "./chunk-TN4FUEWY.js";
-import {
-  ToolCallGroup,
-  ToolCallStep
-} from "./chunk-KNYSKNZX.js";
-import {
-  getToolDisplayMetadata
-} from "./chunk-ND3ZFXQK.js";
-import {
-  OpenUIArtifactRenderer
-} from "./chunk-3TI5DEHV.js";
-import {
-  Markdown
-} from "./chunk-EOAX2ENE.js";
-import {
-  cn
-} from "./chunk-RQHJBTEU.js";
-
-// src/chat/chat-container.tsx
-import {
-  memo as memo3,
-  useMemo,
-  useRef
-} from "react";
-import { ArrowDown } from "lucide-react";
-
-// src/chat/message-list.tsx
-import { memo as memo2 } from "react";
-
-// src/chat/user-message.tsx
-import { memo } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function formatTime(date) {
-  return date.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
-}
-var UserMessage = memo(
-  ({ message: _message, parts, content, timestamp, actions }) => {
-    const text = content ?? (parts ?? []).filter((p) => p.type === "text").map((p) => p.text).join("\n");
-    if (!text.trim()) return null;
-    return /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs("div", { className: "group flex max-w-[78%] flex-col items-end gap-2", children: [
-      /* @__PURE__ */ jsxs("div", { className: "relative w-full rounded-2xl bg-muted/50 px-4 py-3", children: [
-        timestamp ? /* @__PURE__ */ jsx(
-          "span",
-          {
-            "data-user-message-time": "",
-            className: "pointer-events-none absolute right-full top-1/2 mr-3 -translate-y-1/2 whitespace-nowrap text-[var(--font-size-xs)] text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100",
-            children: formatTime(timestamp)
-          }
-        ) : null,
-        /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap text-[var(--font-size-base)] leading-[1.5] text-foreground", children: text })
-      ] }),
-      actions ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-end gap-1.5 text-xs text-muted-foreground", children: actions }) : null
-    ] }) });
-  }
-);
-UserMessage.displayName = "UserMessage";
-
-// src/chat/message-list.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var MessageList = memo2(
-  ({
-    groups,
-    partMap,
-    isCollapsed,
-    onToggleCollapse,
-    branding,
-    renderToolDetail,
-    renderRunActions,
-    renderUserMessageActions,
-    renderToolActions
-  }) => {
-    return /* @__PURE__ */ jsx2("div", { className: "space-y-4", children: groups.map((group) => {
-      if (group.type === "user") {
-        const messageParts = partMap[group.message.id] ?? [];
-        return /* @__PURE__ */ jsx2(
-          UserMessage,
-          {
-            message: group.message,
-            parts: messageParts,
-            actions: renderUserMessageActions?.(group.message, messageParts)
-          },
-          group.message.id
-        );
-      }
-      return /* @__PURE__ */ jsx2(
-        RunGroup,
-        {
-          run: group.run,
-          partMap,
-          collapsed: isCollapsed(group.run.id),
-          onToggle: () => onToggleCollapse(group.run.id),
-          branding,
-          renderToolDetail,
-          headerActions: renderRunActions?.(group.run),
-          renderToolActions
-        },
-        group.run.id
-      );
-    }) });
-  }
-);
-MessageList.displayName = "MessageList";
-
-// src/chat/agent-timeline.tsx
-import { useState as useState2 } from "react";
-import {
-  AlertTriangle,
-  CheckCircle2,
-  CircleDot,
-  FileText,
-  Info
-} from "lucide-react";
-
-// src/chat/thinking-indicator.tsx
-import { useEffect, useState } from "react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-function ThinkingIndicator({ className }) {
-  const [elapsed, setElapsed] = useState(0);
-  useEffect(() => {
-    const interval = window.setInterval(() => setElapsed((current) => current + 1), 1e3);
-    return () => window.clearInterval(interval);
-  }, []);
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      role: "status",
-      "aria-label": "Agent is thinking",
-      className: cn("flex items-center gap-2 px-3 py-1.5", className),
-      children: [
-        /* @__PURE__ */ jsxs2("div", { className: "flex gap-[3px]", children: [
-          /* @__PURE__ */ jsx3("span", { className: "h-[var(--indicator-dot-size)] w-[var(--indicator-dot-size)] animate-bounce rounded-full bg-[var(--brand-glow)]", style: { animationDelay: "0ms" } }),
-          /* @__PURE__ */ jsx3("span", { className: "h-[var(--indicator-dot-size)] w-[var(--indicator-dot-size)] animate-bounce rounded-full bg-[var(--brand-glow)]", style: { animationDelay: "150ms" } }),
-          /* @__PURE__ */ jsx3("span", { className: "h-[var(--indicator-dot-size)] w-[var(--indicator-dot-size)] animate-bounce rounded-full bg-[var(--brand-glow)]", style: { animationDelay: "300ms" } })
-        ] }),
-        elapsed > 3 && /* @__PURE__ */ jsxs2("span", { className: "text-[var(--font-size-xs)] tabular-nums text-muted-foreground", children: [
-          elapsed,
-          "s"
-        ] })
-      ]
-    }
-  );
-}
-
-// src/chat/agent-timeline.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var TONE_STYLES = {
-  default: {
-    card: "border-border bg-card",
-    text: "text-foreground",
-    icon: CircleDot
-  },
-  info: {
-    card: "border-[var(--surface-info-border)] bg-[var(--surface-info-bg)]",
-    text: "text-[var(--surface-info-text)]",
-    icon: Info
-  },
-  success: {
-    card: "border-[var(--surface-success-border)] bg-[var(--surface-success-bg)]",
-    text: "text-[var(--surface-success-text)]",
-    icon: CheckCircle2
-  },
-  warning: {
-    card: "border-[var(--surface-warning-border)] bg-[var(--surface-warning-bg)]",
-    text: "text-[var(--surface-warning-text)]",
-    icon: AlertTriangle
-  },
-  error: {
-    card: "border-[var(--surface-danger-border)] bg-[var(--surface-danger-bg)]",
-    text: "text-[var(--surface-danger-text)]",
-    icon: AlertTriangle
-  }
-};
-function stepKind(item) {
-  if (item.kind === "message") return item.role === "user" ? "user" : "prose";
-  if (item.kind === "status" || item.kind === "artifact") return "card";
-  return "tool";
-}
-function spacingBefore(prev, next) {
-  if (prev === void 0) return "";
-  if (prev === "user" || next === "user") return "mt-4";
-  if (prev === "card" || next === "card") return "mt-2";
-  if (prev === "tool" || next === "tool") return "mt-1";
-  return "mt-3";
-}
-var ROW_BLEED = "-mx-3";
-function AssistantMessage({ item }) {
-  return /* @__PURE__ */ jsxs3("div", { children: [
-    item.content && /* @__PURE__ */ jsx4(Markdown, { className: "tangle-prose text-[var(--font-size-base)] leading-[1.5]", children: item.content }),
-    item.isStreaming && /* @__PURE__ */ jsx4(
-      "span",
-      {
-        "aria-hidden": true,
-        "data-streaming-caret": "",
-        className: "ml-0.5 inline-block h-[1em] w-0.5 animate-pulse rounded-full bg-muted-foreground align-text-bottom"
-      }
-    ),
-    item.toolCalls && /* @__PURE__ */ jsx4("div", { className: "mt-1", children: item.toolCalls }),
-    item.after && /* @__PURE__ */ jsx4("div", { className: "mt-3 border-t border-border pt-3", children: item.after })
-  ] });
-}
-function StatusCard({ item }) {
-  const tone = TONE_STYLES[item.tone ?? "default"];
-  const Icon = tone.icon;
-  return /* @__PURE__ */ jsx4("div", { className: cn("rounded-[var(--radius-lg)] border px-4 py-3", tone.card), children: /* @__PURE__ */ jsxs3("div", { className: "flex items-start gap-3", children: [
-    /* @__PURE__ */ jsx4(Icon, { className: cn("mt-0.5 h-4 w-4 shrink-0", tone.text) }),
-    /* @__PURE__ */ jsxs3("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsx4("div", { className: cn("text-sm font-medium", tone.text), children: item.label }),
-      item.detail && /* @__PURE__ */ jsx4("div", { className: "mt-0.5 text-sm text-muted-foreground", children: item.detail })
-    ] })
-  ] }) });
-}
-function ArtifactCard({ item }) {
-  const tone = TONE_STYLES[item.tone ?? "default"];
-  const content = /* @__PURE__ */ jsx4("div", { className: cn("rounded-[var(--radius-lg)] border px-4 py-3", tone.card), children: /* @__PURE__ */ jsxs3("div", { className: "flex items-start gap-3", children: [
-    /* @__PURE__ */ jsx4("div", { className: "mt-0.5 flex h-[var(--avatar-size)] w-[var(--avatar-size)] shrink-0 items-center justify-center rounded-[var(--radius-md)] bg-muted/50 text-foreground", children: item.icon ?? /* @__PURE__ */ jsx4(FileText, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ jsxs3("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsx4("div", { className: "text-sm font-medium text-foreground", children: item.title }),
-      item.description && /* @__PURE__ */ jsx4("div", { className: "mt-1 text-sm text-muted-foreground", children: item.description }),
-      item.meta && /* @__PURE__ */ jsx4("div", { className: "mt-2 flex flex-wrap items-center gap-2 text-xs text-muted-foreground", children: item.meta })
-    ] }),
-    item.action && /* @__PURE__ */ jsx4("div", { className: "shrink-0", children: item.action })
-  ] }) });
-  if (!item.onClick) return content;
-  return /* @__PURE__ */ jsx4(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      onClick: item.onClick,
-      onKeyDown: (event) => {
-        if (event.key === "Enter" || event.key === " ") {
-          event.preventDefault();
-          item.onClick?.();
-        }
-      },
-      className: "block w-full text-left transition-transform hover:-translate-y-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60",
-      children: content
-    }
-  );
-}
-function AgentTimeline({
-  items,
-  isThinking,
-  emptyState,
-  className,
-  renderToolActions,
-  collapseAfter
-}) {
-  const [expanded, setExpanded] = useState2(false);
-  if (items.length === 0 && !isThinking) {
-    return emptyState ? /* @__PURE__ */ jsx4("div", { className: cn("flex h-full items-center justify-center p-4", className), children: emptyState }) : null;
-  }
-  const renderedItems = isThinking ? [...items, { id: "__thinking__", kind: "custom", content: /* @__PURE__ */ jsx4(ThinkingIndicator, {}) }] : items;
-  const isUserMessage = (item) => item.kind === "message" && item.role === "user";
-  const stepItems = renderedItems.filter((item) => !isUserMessage(item));
-  const limit = collapseAfter ?? Infinity;
-  const collapsible = stepItems.length > limit;
-  const collapsed = collapsible && !expanded;
-  let renderList = renderedItems;
-  let hiddenCount = 0;
-  if (collapsed) {
-    const visible = [];
-    let stepCount = 0;
-    for (const item of renderedItems) {
-      if (stepCount >= limit) break;
-      visible.push(item);
-      if (!isUserMessage(item)) stepCount += 1;
-    }
-    renderList = visible;
-    hiddenCount = stepItems.length - limit;
-  }
-  const renderItem = (item) => {
-    if (item.kind === "message") {
-      return item.role === "user" ? /* @__PURE__ */ jsx4(UserMessage, { content: item.content, timestamp: item.timestamp }) : /* @__PURE__ */ jsx4(AssistantMessage, { item });
-    }
-    if (item.kind === "tool") {
-      return /* @__PURE__ */ jsx4(
-        ToolCallStep,
-        {
-          type: item.call.type,
-          label: item.call.label,
-          status: item.call.status,
-          detail: item.call.detail,
-          output: item.call.output,
-          duration: item.call.duration,
-          part: item.part,
-          actions: item.part ? renderToolActions?.(item.part) : void 0
-        }
-      );
-    }
-    if (item.kind === "tool_group") {
-      return /* @__PURE__ */ jsx4(ToolCallGroup, { title: item.title, children: item.calls.map((call, callIndex) => {
-        const part = item.parts?.[callIndex];
-        return /* @__PURE__ */ jsx4(
-          ToolCallStep,
-          {
-            type: call.type,
-            label: call.label,
-            status: call.status,
-            detail: call.detail,
-            output: call.output,
-            duration: call.duration,
-            part,
-            actions: part ? renderToolActions?.(part) : void 0
-          },
-          call.id
-        );
-      }) });
-    }
-    if (item.kind === "status") return /* @__PURE__ */ jsx4(StatusCard, { item });
-    if (item.kind === "artifact") return /* @__PURE__ */ jsx4(ArtifactCard, { item });
-    return item.content;
-  };
-  return /* @__PURE__ */ jsxs3("div", { className: cn("mx-auto flex w-full max-w-5xl flex-col px-4 py-4", className), children: [
-    renderList.map((item, index) => {
-      const kind = stepKind(item);
-      const prev = index > 0 ? stepKind(renderList[index - 1]) : void 0;
-      return /* @__PURE__ */ jsx4(
-        "div",
-        {
-          "data-timeline-step": kind,
-          className: cn(spacingBefore(prev, kind), kind === "tool" && ROW_BLEED),
-          children: renderItem(item)
-        },
-        item.id
-      );
-    }),
-    collapsible ? /* @__PURE__ */ jsx4(
-      "button",
-      {
-        type: "button",
-        onClick: () => setExpanded((value) => !value),
-        className: "mt-2 self-start text-xs font-medium text-muted-foreground transition-colors hover:text-foreground",
-        children: collapsed ? `Show ${hiddenCount} more step${hiddenCount === 1 ? "" : "s"}` : "Show less"
-      }
-    ) : null
-  ] });
-}
-
-// src/chat/chat-container.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var OPENUI_NODE_TYPES = /* @__PURE__ */ new Set([
-  "heading",
-  "text",
-  "badge",
-  "stat",
-  "key_value",
-  "code",
-  "markdown",
-  "table",
-  "actions",
-  "separator",
-  "stack",
-  "grid",
-  "card"
-]);
-function isOpenUINode(value) {
-  return typeof value === "object" && value !== null && "type" in value && typeof value.type === "string" && OPENUI_NODE_TYPES.has(value.type);
-}
-function extractOpenUISchema(output) {
-  if (output == null) return null;
-  if (isOpenUINode(output)) return [output];
-  if (Array.isArray(output) && output.length > 0 && output.every(isOpenUINode)) {
-    return output;
-  }
-  if (typeof output === "object" && !Array.isArray(output)) {
-    const obj = output;
-    for (const key of ["openui", "schema", "ui"]) {
-      if (obj[key]) {
-        const inner = obj[key];
-        if (isOpenUINode(inner)) return [inner];
-        if (Array.isArray(inner) && inner.length > 0 && inner.every(isOpenUINode)) {
-          return inner;
-        }
-      }
-    }
-  }
-  if (typeof output === "string") {
-    try {
-      const parsed = JSON.parse(output);
-      return extractOpenUISchema(parsed);
-    } catch {
-      return null;
-    }
-  }
-  return null;
-}
-function formatUnknown(value) {
-  if (value == null) return void 0;
-  if (typeof value === "string") return value;
-  try {
-    return JSON.stringify(value, null, 2);
-  } catch {
-    return String(value);
-  }
-}
-function createdAtFromMessage(message) {
-  return message.time?.created ? new Date(message.time.created) : void 0;
-}
-function mapToolPartToTimelineType(part) {
-  const name = part.tool.toLowerCase().replace(/^tool:/, "");
-  switch (name) {
-    case "bash":
-    case "shell":
-    case "command":
-    case "execute":
-      return "bash";
-    case "write":
-    case "write_file":
-    case "create_file":
-      return "write";
-    case "read":
-    case "read_file":
-    case "cat":
-      return "read";
-    case "edit":
-    case "patch":
-    case "sed":
-      return "edit";
-    case "glob":
-    case "find":
-      return "glob";
-    case "ls":
-      return "list";
-    case "grep":
-    case "search":
-    case "rg":
-      return "grep";
-    case "inspect":
-      return "inspect";
-    default:
-      return "unknown";
-  }
-}
-function buildTimelineItems(messages, partMap, isStreaming, onOpenUIAction, enableOpenUI = true) {
-  const items = [];
-  let latestUserIndex = -1;
-  for (let index = messages.length - 1; index >= 0; index -= 1) {
-    if (messages[index].role === "user") {
-      latestUserIndex = index;
-      break;
-    }
-  }
-  const responseMessages = latestUserIndex >= 0 ? messages.slice(latestUserIndex + 1) : messages;
-  const lastAssistantMessage = [...responseMessages].reverse().find((message) => message.role === "assistant");
-  const toToolCall = (part) => {
-    const meta = getToolDisplayMetadata(part);
-    const start = part.state.time?.start;
-    const end = part.state.time?.end;
-    return {
-      id: part.id,
-      type: mapToolPartToTimelineType(part),
-      label: meta.title,
-      status: part.state.status === "completed" ? "success" : part.state.status === "error" ? "error" : "running",
-      // A human-readable summary (file path / command), not the raw input JSON —
-      // the full input still renders in the expanded ExpandedToolDetail.
-      detail: meta.commandSnippet ?? meta.targetPath ?? meta.description,
-      output: formatUnknown(part.state.output),
-      duration: start && end ? end - start : void 0
-    };
-  };
-  for (const message of messages) {
-    const parts = partMap[message.id] ?? [];
-    if (message.role === "user") {
-      const content = parts.filter((part) => part.type === "text").map((part) => part.text).join("\n").trim();
-      if (!content) continue;
-      items.push({
-        id: message.id,
-        kind: "message",
-        role: "user",
-        content,
-        timestamp: createdAtFromMessage(message)
-      });
-      continue;
-    }
-    const toolBuffer = [];
-    const flushToolBuffer = (index) => {
-      if (toolBuffer.length === 0) return;
-      if (toolBuffer.length === 1) {
-        items.push({
-          id: `${message.id}-tool-${toolBuffer[0].id}`,
-          kind: "tool",
-          call: toToolCall(toolBuffer[0]),
-          part: toolBuffer[0]
-        });
-      } else {
-        items.push({
-          id: `${message.id}-tool-group-${index}`,
-          kind: "tool_group",
-          title: "Tool activity",
-          parts: [...toolBuffer],
-          calls: toolBuffer.map((part) => toToolCall(part))
-        });
-      }
-      if (enableOpenUI) {
-        for (const part of toolBuffer) {
-          if (part.state.status !== "completed" || !part.state.output) continue;
-          const schema = extractOpenUISchema(part.state.output);
-          if (!schema) continue;
-          items.push({
-            id: `${message.id}-openui-${part.id}`,
-            kind: "custom",
-            content: /* @__PURE__ */ jsx5("div", { className: "my-2 rounded-[var(--radius-lg)] border border-border bg-card p-4 shadow-[var(--shadow-card)]", children: /* @__PURE__ */ jsx5(OpenUIArtifactRenderer, { schema, onAction: onOpenUIAction }) })
-          });
-        }
-      }
-      toolBuffer.length = 0;
-    };
-    parts.forEach((part, index) => {
-      const itemId = `${message.id}-${index}`;
-      if (part.type === "tool") {
-        toolBuffer.push(part);
-        return;
-      }
-      flushToolBuffer(index);
-      if (part.type === "text" && !part.synthetic && part.text.trim()) {
-        if (enableOpenUI) {
-          const jsonMatch = part.text.match(/```(?:json)?\s*\n([\s\S]*?)\n```/);
-          if (jsonMatch) {
-            const schema = extractOpenUISchema(jsonMatch[1]);
-            if (schema) {
-              const beforeJson = part.text.slice(0, part.text.indexOf("```")).trim();
-              if (beforeJson) {
-                items.push({
-                  id: `${itemId}-text`,
-                  kind: "message",
-                  role: "assistant",
-                  content: beforeJson,
-                  timestamp: createdAtFromMessage(message)
-                });
-              }
-              items.push({
-                id: `${itemId}-openui`,
-                kind: "custom",
-                content: /* @__PURE__ */ jsx5("div", { className: "my-2 rounded-[var(--radius-lg)] border border-border bg-card p-4 shadow-[var(--shadow-card)]", children: /* @__PURE__ */ jsx5(OpenUIArtifactRenderer, { schema, onAction: onOpenUIAction }) })
-              });
-              const afterJson = part.text.slice(part.text.lastIndexOf("```") + 3).trim();
-              if (afterJson) {
-                items.push({
-                  id: `${itemId}-after`,
-                  kind: "message",
-                  role: "assistant",
-                  content: afterJson,
-                  timestamp: createdAtFromMessage(message)
-                });
-              }
-              return;
-            }
-          }
-        }
-        items.push({
-          id: itemId,
-          kind: "message",
-          role: "assistant",
-          content: part.text,
-          timestamp: createdAtFromMessage(message),
-          isStreaming: isStreaming && lastAssistantMessage?.id === message.id && index === parts.length - 1
-        });
-        return;
-      }
-      if (part.type === "reasoning") {
-        items.push({
-          id: itemId,
-          kind: "custom",
-          content: /* @__PURE__ */ jsx5(InlineThinkingItem, { part, defaultOpen: isStreaming && lastAssistantMessage?.id === message.id })
-        });
-        return;
-      }
-    });
-    flushToolBuffer(parts.length);
-  }
-  const showThinking = isStreaming && latestUserIndex >= 0 && (lastAssistantMessage == null || !items.some(
-    (item) => item.kind === "message" && item.role === "assistant" && item.id.startsWith(lastAssistantMessage.id)
-  ));
-  return { items, showThinking };
-}
-var ChatContainer = memo3(
-  ({
-    messages,
-    partMap,
-    isStreaming,
-    branding,
-    className,
-    renderToolDetail,
-    presentation = "runs",
-    onOpenUIAction,
-    enableOpenUI = true,
-    renderRunActions,
-    renderUserMessageActions,
-    renderToolActions,
-    renderTimelineToolActions,
-    collapseTimelineAfter
-  }) => {
-    const scrollRef = useRef(null);
-    const groups = useRunGroups({ messages, partMap, isStreaming });
-    const runs = groups.filter((g) => g.type === "run").map((g) => g.run);
-    const { isCollapsed, toggleCollapse } = useRunCollapseState(runs);
-    const { isAtBottom, scrollToBottom } = useAutoScroll(scrollRef, [
-      messages,
-      partMap,
-      isStreaming
-    ]);
-    const timeline = useMemo(
-      () => buildTimelineItems(messages, partMap, isStreaming, onOpenUIAction, enableOpenUI),
-      [messages, partMap, isStreaming, onOpenUIAction, enableOpenUI]
-    );
-    return /* @__PURE__ */ jsxs4("div", { className: cn("flex h-full flex-col", className), children: [
-      /* @__PURE__ */ jsx5(
-        "div",
-        {
-          ref: scrollRef,
-          className: "flex-1 overflow-y-auto [scrollbar-gutter:stable]",
-          children: messages.length === 0 ? /* @__PURE__ */ jsx5("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx5("div", { className: "max-w-md text-center", children: /* @__PURE__ */ jsx5("div", { className: "text-sm font-medium text-muted-foreground", children: "Start a conversation." }) }) }) : presentation === "timeline" ? /* @__PURE__ */ jsx5("div", { className: "mx-auto flex min-h-full w-full max-w-3xl flex-col justify-end", children: /* @__PURE__ */ jsx5(
-            AgentTimeline,
-            {
-              items: timeline.items,
-              isThinking: timeline.showThinking,
-              renderToolActions: renderTimelineToolActions,
-              collapseAfter: collapseTimelineAfter
-            }
-          ) }) : /* @__PURE__ */ jsx5("div", { className: "mx-auto flex min-h-full w-full max-w-3xl flex-col justify-end", children: /* @__PURE__ */ jsx5(
-            MessageList,
-            {
-              groups,
-              partMap,
-              isCollapsed,
-              onToggleCollapse: toggleCollapse,
-              branding,
-              renderToolDetail,
-              renderRunActions,
-              renderUserMessageActions,
-              renderToolActions
-            }
-          ) })
-        }
-      ),
-      !isAtBottom && /* @__PURE__ */ jsx5("div", { className: "relative z-10 -mt-10 flex justify-center", children: /* @__PURE__ */ jsxs4(
-        "button",
-        {
-          onClick: scrollToBottom,
-          className: cn(
-            "flex items-center gap-1.5 px-3 py-1.5 rounded-full",
-            "border border-border bg-card shadow-[0_6px_16px_rgba(15,23,42,0.08)]",
-            "text-xs text-foreground transition-colors hover:bg-accent",
-            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/60"
-          ),
-          children: [
-            /* @__PURE__ */ jsx5(ArrowDown, { className: "w-3 h-3" }),
-            "Scroll to bottom"
-          ]
-        }
-      ) })
-    ] });
-  }
-);
-ChatContainer.displayName = "ChatContainer";
-
-// src/chat/chat-message.tsx
-import { Fragment, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-function ChatMessage({
-  role,
-  content,
-  toolCalls,
-  isStreaming,
-  timestamp,
-  className,
-  userLabel = "You",
-  assistantLabel = "Agent",
-  hideRoleLabel
-}) {
-  const isUser = role === "user";
-  return /* @__PURE__ */ jsxs5(
-    "div",
-    {
-      className: cn(
-        "flex flex-col gap-1",
-        isUser ? "items-end" : "items-start",
-        className
-      ),
-      children: [
-        !hideRoleLabel && /* @__PURE__ */ jsxs5("div", { className: cn("flex items-center gap-2 px-1", isUser && "flex-row-reverse"), children: [
-          /* @__PURE__ */ jsx6("span", { className: "font-medium text-foreground text-xs", children: isUser ? userLabel : assistantLabel }),
-          timestamp && /* @__PURE__ */ jsx6("span", { className: "text-muted-foreground text-xs", children: formatTime2(timestamp) })
-        ] }),
-        /* @__PURE__ */ jsxs5(
-          "div",
-          {
-            className: cn(
-              "min-w-0 max-w-[85%] space-y-1 rounded-[var(--radius-lg)] border",
-              "px-[var(--chat-message-px)] py-[var(--chat-message-py)]",
-              isUser ? "border-border bg-muted/50" : "border-border bg-card"
-            ),
-            children: [
-              isUser ? /* @__PURE__ */ jsx6("div", { className: "whitespace-pre-wrap text-[var(--font-size-base)] leading-[var(--line-height-base)] text-foreground", children: content }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
-                content && /* @__PURE__ */ jsx6(Markdown, { className: "tangle-prose text-[var(--font-size-base)] leading-[var(--line-height-base)]", children: content }),
-                isStreaming && /* @__PURE__ */ jsx6("span", { className: "ml-0.5 inline-block h-4 w-2 animate-pulse rounded-sm bg-[var(--brand-cool)] align-text-bottom" })
-              ] }),
-              toolCalls
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-function formatTime2(date) {
-  return date.toLocaleTimeString(void 0, {
-    hour: "numeric",
-    minute: "2-digit"
-  });
-}
-
-export {
-  UserMessage,
-  MessageList,
-  ThinkingIndicator,
-  AgentTimeline,
-  ChatContainer,
-  ChatMessage
-};