@athenaintel/react 0.22.4 → 0.23.0

package/dist/chat/AthenaChat.js

@@ -1,10 +1,29 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import "../packages/agent-runtime/src/generated/runconfig-contract.js";
+import { useMemo, useContext, useState, useRef, useEffect, createContext, useCallback } from "react";
+import "@assistant-ui/tap";
+import "statewire";
+import "../packages/agent-runtime/src/statewire-suspended.js";
+import "../packages/agent-runtime/src/conversation-list.js";
+import "@tanstack/react-query";
+import "../packages/agent-runtime/src/statewire-state.js";
+import "../packages/agent-runtime/src/messages.js";
+import "@assistant-ui/store";
+import "../packages/agent-runtime/src/quota-safe-local-storage-session.js";
+import "../packages/agent-runtime/src/statewire-attach-observer.js";
+import "../packages/agent-runtime/src/thread-status.js";
+import "@assistant-ui/react-statewire";
+import { isGithubWakeMessage } from "../packages/agent-runtime/src/github-wake-event.js";
+import "@assistant-ui/core";
+import "../packages/agent-runtime/src/thread-handoff.js";
 import { TiptapText } from "./tiptap-text.js";
 import { AthenaChatErrorBoundary } from "./AthenaChatErrorBoundary.js";
 import { StatewireApprovalCard } from "./StatewireApprovalCard.js";
 import { StatewireQueuedMessages } from "./StatewireQueuedMessages.js";
 import { StatewireConnectionBanner, StatewireErrorBanner } from "./statewire-banners.js";
-import { ToolFallback } from "../tools/tool-fallback.js";
+import { WaitingOnYouBanner } from "./WaitingOnYouBanner.js";
+import { WakeMarkerMessage } from "../chat-ui/messages/wake-marker.js";
+import { ToolFallback, ToolFallbackAppearanceProvider } from "../tools/tool-fallback.js";
 import { AppendDocumentToolUI } from "../tools/append-document-tool-ui.js";
 import { ReadAssetToolUI } from "../tools/read-asset-tool-ui.js";
 import { TOOL_UI_REGISTRY } from "../tools/tool-uis.js";
@@ -16,16 +35,20 @@ import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "../ui/colla
 import { ChatComposerDock } from "../chat-ui/thread/chat-composer-dock.js";
 import { ChatThreadShell } from "../chat-ui/thread/chat-thread-shell.js";
 import { StatewireHistoryEdge } from "../chat-ui/thread/statewire-history-edge.js";
+import { ThreadLoadingOverlay } from "../chat-ui/thread/thread-loading-overlay.js";
 import { ComposerSendOrStop } from "../chat-ui/thread/composer-send-or-stop.js";
 import { TiptapComposer } from "../chat-ui/composer/tiptap-composer.js";
 import { MentionAuthCtx } from "../chat-ui/mentions/suggestions/data/api-client.js";
 import { ACTION_BAR_REVEAL_CLASS, BranchPicker } from "../chat-ui/messages/message-components.js";
 import { useMessageActionsReadOnly } from "../chat-ui/messages/message-actions-config.js";
 import { useAthenaRunLive } from "./use-athena-run-live.js";
-import { useAuiState, ActionBarPrimitive, ActionBarMorePrimitive, MessagePrimitive, AuiIf, ErrorPrimitive, useAui, ThreadPrimitive } from "@assistant-ui/react";
-import { MoreHorizontalIcon, DownloadIcon, ExternalLinkIcon, SearchIcon, PresentationIcon, FileTextIcon, BrainIcon, ChevronRightIcon, CheckIcon, CopyIcon, RefreshCwIcon, AlertCircleIcon, ArrowDownIcon, ArrowUpIcon, SquareIcon, ListPlusIcon, ArrowRightIcon, PencilIcon } from "lucide-react";
-import { useMemo, useContext, useState, useRef, useEffect, createContext, useCallback } from "react";
-import { useAthenaThreadId, useAthenaStatewireThreadId } from "../threads/thread-id-context.js";
+import { DEFAULT_WELCOME_SUGGESTIONS, AthenaChatWelcomeSuggestions, AthenaChatWelcome, welcomeEntrance, welcomeComposerDelayMs } from "./athena-chat-welcome.js";
+import { ATHENA_COMPOSER_COMPONENTS, AthenaComposerMentionButton } from "./athena-composer-controls.js";
+import { useComposerKeyboardHint, ComposerKeyboardHint } from "./composer-keyboard-hint.js";
+import { usePrefersReducedMotion } from "../lib/use-prefers-reduced-motion.js";
+import { useAuiState, ActionBarPrimitive, ActionBarMorePrimitive, MessagePrimitive, ThreadPrimitive, AuiIf, ErrorPrimitive, useAui } from "@assistant-ui/react";
+import { MoreHorizontalIcon, DownloadIcon, ExternalLinkIcon, BrainIcon, ChevronRightIcon, CheckIcon, CopyIcon, RefreshCwIcon, AlertCircleIcon, ArrowUpIcon, PencilIcon } from "lucide-react";
+import { useAthenaThreadId, AthenaStatewireThreadIdContext, useAthenaStatewireThreadId } from "../threads/thread-id-context.js";
 import { FileUploadButton } from "../composer/FileUploadButton.js";
 import { ComposerQuotePreview } from "../composer/ComposerQuotePreview.js";
 import { ComposerAttachmentPreview } from "../composer/ComposerAttachmentPreview.js";
@@ -37,36 +60,15 @@ import { useAttachFiles } from "../composer/useAttachFiles.js";
 import { useAthenaConfig } from "../provider/AthenaContext.js";
 import { createAthenaSpacesUrl } from "../lib/athena-urls.js";
 import { isRecord } from "../lib/utils.js";
-import { useSendMessage } from "../composer/useSendMessage.js";
 import { getToolkitDisplayInfo } from "../toolkits/index.js";
-import { runActivityKey, runActivityLabel, RUN_ACTIVITY_STALL_SECONDS } from "./run-activity.js";
+import { runActivityKey, runActivityVerb, RUN_ACTIVITY_COUNTER_SECONDS, runActivityLabel, RUN_ACTIVITY_STALL_SECONDS } from "./run-activity.js";
+import { readMessageCreatedAt, parseMessageTime, isSameCalendarDay, formatDayLabel, formatMessageTime, formatMessageDateTime } from "./message-time.js";
+import { ThreadScrollToBottom } from "./thread-scroll-to-bottom.js";
 import { cn } from "cnfast";
 function QuotePostMessageBridge() {
   useQuoteFromPostMessage();
   return null;
 }
-const DEFAULT_SUGGESTIONS = [
-  {
-    icon: SearchIcon,
-    title: "Research a topic and draft a report",
-    prompt: "Search the web for the latest developments in enterprise AI adoption, then create a document summarizing the key trends, market data, and strategic implications."
-  },
-  {
-    icon: SearchIcon,
-    title: "Compare recent AI model launches",
-    prompt: "Search the web for the latest major AI model launches from OpenAI, Anthropic, and Google, then summarize the release dates, standout capabilities, and practical tradeoffs in a concise comparison table."
-  },
-  {
-    icon: PresentationIcon,
-    title: "Build a presentation from scratch",
-    prompt: "Create a 5-slide investor update presentation covering market opportunity, product traction, key metrics, competitive positioning, and next steps."
-  },
-  {
-    icon: FileTextIcon,
-    title: "Set up a structured spreadsheet",
-    prompt: "Create a project tracking spreadsheet with columns for task name, owner, priority, status, start date, due date, and completion percentage."
-  }
-];
 const AthenaChatDefaultComponentsContext = createContext(null);
 const AthenaReasoningTextComponentContext = createContext(null);
 const useAthenaChatDefaultComponents = () => {
@@ -77,11 +79,20 @@ const useAthenaChatDefaultComponents = () => {
   return value;
 };
 const AthenaDefaultAssistantMessage = () => {
-  const { toolUIs, TextComponent, ReasoningComponent, EmptyComponent, ActionBarComponent, groupToolCalls } = useAthenaChatDefaultComponents();
+  const {
+    toolUIs,
+    TextComponent,
+    ReasoningComponent,
+    EmptyComponent,
+    ActionBarComponent,
+    AvatarComponent,
+    groupToolCalls
+  } = useAthenaChatDefaultComponents();
   return /* @__PURE__ */ jsx(
     AthenaAssistantMessage,
     {
       toolUIs,
+      AvatarComponent,
       TextComponent,
       ReasoningComponent,
       EmptyComponent,
@@ -120,50 +131,22 @@ const withNestedPtcMessages = (ToolUI) => {
   };
   return ToolUIWithNestedPtcMessages;
 };
-const SuggestionCard = ({
-  suggestion,
-  index
-}) => {
-  const Icon = suggestion.icon;
-  const sendMessage = useSendMessage();
-  const handleClick = useCallback(() => {
-    void sendMessage(suggestion.prompt);
-  }, [sendMessage, suggestion.prompt]);
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      onClick: handleClick,
-      className: `fade-in slide-in-from-bottom-2 animate-in fill-mode-both group flex items-start gap-3 rounded-xl border border-border/60 bg-background p-3.5 text-left shadow-sm transition-all duration-150 hover:border-border hover:bg-muted/40 hover:shadow-md`,
-      style: { animationDelay: `${100 + index * 75}ms` },
-      children: [
-        /* @__PURE__ */ jsx("div", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted/60 text-muted-foreground transition-colors group-hover:bg-primary/10 group-hover:text-primary", children: /* @__PURE__ */ jsx(Icon, { className: "size-4" }) }),
-        /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx("span", { className: "text-[13px] font-medium leading-snug text-foreground", children: suggestion.title }) }),
-        /* @__PURE__ */ jsx(ArrowRightIcon, { className: "mt-0.5 size-3.5 shrink-0 text-muted-foreground/0 transition-all group-hover:text-muted-foreground" })
-      ]
-    }
-  );
-};
-const AthenaChatWelcome = ({ welcomeMessage, welcomeSubtext, welcomeSuggestions }) => /* @__PURE__ */ jsx("div", { className: "aui-thread-welcome-root mx-auto my-auto flex w-full max-w-(--thread-max-width) grow flex-col", children: /* @__PURE__ */ jsx("div", { className: "aui-thread-welcome-center flex w-full grow flex-col items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "aui-thread-welcome-message flex size-full flex-col justify-center px-4", children: [
-  /* @__PURE__ */ jsx("h1", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both font-semibold text-2xl duration-200", children: welcomeMessage }),
-  welcomeSubtext && /* @__PURE__ */ jsx("p", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both text-muted-foreground text-lg delay-75 duration-200", children: welcomeSubtext }),
-  welcomeSuggestions.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-6 grid grid-cols-1 gap-2.5 sm:grid-cols-2", children: welcomeSuggestions.map((s, i) => /* @__PURE__ */ jsx(SuggestionCard, { suggestion: s, index: i }, s.title)) })
-] }) }) });
 const AthenaChat = ({
   className,
   welcomeMessage = "Hello there!",
   welcomeSubtext = "What can I help you with?",
-  maxWidth = "44rem",
+  maxWidth = "46rem",
   turnAnchor = "bottom",
   readOnly = false,
   toolUIs,
   mentionTools,
-  welcomeSuggestions = DEFAULT_SUGGESTIONS,
+  welcomeSuggestions = DEFAULT_WELCOME_SUGGESTIONS,
   components,
-  groupToolCalls = false
+  groupToolCalls = true
 }) => {
   var _a, _b, _c;
   const athenaConfig = useAthenaConfig();
+  const statewireThreadId = useContext(AthenaStatewireThreadIdContext);
   const mentionAuth = useMemo(
     () => ({
       backendUrl: athenaConfig.backendUrl,
@@ -204,6 +187,7 @@ const AthenaChat = ({
   const reasoningComponent = (_b = components == null ? void 0 : components.messageParts) == null ? void 0 : _b.Reasoning;
   const emptyComponent = ((_c = components == null ? void 0 : components.messageParts) == null ? void 0 : _c.Empty) ?? AthenaAssistantMessageEmpty;
   const actionBarComponent = (components == null ? void 0 : components.AssistantActionBar) ?? AthenaAssistantActionBar;
+  const avatarComponent = components == null ? void 0 : components.AssistantAvatar;
   const defaultComponentsContextValue = useMemo(
     () => ({
       toolUIs: mergedToolUIs,
@@ -211,9 +195,18 @@ const AthenaChat = ({
       ReasoningComponent: reasoningComponent,
       EmptyComponent: emptyComponent,
       ActionBarComponent: actionBarComponent,
+      AvatarComponent: avatarComponent,
       groupToolCalls
     }),
-    [actionBarComponent, emptyComponent, groupToolCalls, mergedToolUIs, reasoningComponent, textComponent]
+    [
+      actionBarComponent,
+      avatarComponent,
+      emptyComponent,
+      groupToolCalls,
+      mergedToolUIs,
+      reasoningComponent,
+      textComponent
+    ]
   );
   const AssistantMessageComponent = (components == null ? void 0 : components.AssistantMessage) ?? AthenaDefaultAssistantMessage;
   const UserMessageComponent = (components == null ? void 0 : components.UserMessage) ?? AthenaDefaultUserMessage;
@@ -224,7 +217,7 @@ const AthenaChat = ({
     }),
     [AssistantMessageComponent, UserMessageComponent]
   );
-  return /* @__PURE__ */ jsx(AthenaChatDefaultComponentsContext.Provider, { value: defaultComponentsContextValue, children: /* @__PURE__ */ jsx(AthenaChatErrorBoundary, { children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(AthenaChatDefaultComponentsContext.Provider, { value: defaultComponentsContextValue, children: /* @__PURE__ */ jsx(AthenaChatErrorBoundary, { children: /* @__PURE__ */ jsx(ToolFallbackAppearanceProvider, { appearance: "thread", children: /* @__PURE__ */ jsx(
     ChatThreadShell,
     {
       overlay: /* @__PURE__ */ jsx(ThreadLoadingOverlay, {}),
@@ -235,46 +228,35 @@ const AthenaChat = ({
       maxWidth,
       turnAnchor,
       readOnly,
+      banners: /* @__PURE__ */ jsx(WaitingOnYouBanner, { className: "px-4 pt-3" }),
       viewportClassName: "aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll scroll-smooth px-4 pt-4",
       contentClassName: "flex w-full flex-1 flex-col",
       viewportOverlay: /* @__PURE__ */ jsx(ThreadScrollToTop, {}),
-      welcome: /* @__PURE__ */ jsx(
-        AthenaChatWelcome,
-        {
-          welcomeMessage,
-          welcomeSubtext,
-          welcomeSuggestions
-        }
-      ),
+      welcome: /* @__PURE__ */ jsx(AthenaChatWelcome, { welcomeMessage, welcomeSubtext }),
       beforeMessages: /* @__PURE__ */ jsx(StatewireHistoryEdge, { className: "aui-thread-history-edge" }),
       components: messageComponents,
       runningIndicator: null,
-      scrollToBottom: /* @__PURE__ */ jsx(ThreadScrollToBottom, {}),
-      viewportFooterClassName: "aui-thread-viewport-footer sticky bottom-0 mx-auto mt-auto flex w-full max-w-(--thread-max-width) flex-col gap-4 overflow-visible rounded-t-3xl bg-background pb-4 md:pb-6",
+      scrollToBottom: null,
+      viewportFooterClassName: "aui-thread-viewport-footer sticky bottom-0 mx-auto mt-auto flex w-full max-w-(--thread-max-width) flex-col gap-4 overflow-visible rounded-t-3xl bg-background pt-4 pb-4 md:pb-6",
       viewportFooter: /* @__PURE__ */ jsxs(Fragment, { children: [
+        welcomeSuggestions.length > 0 && /* @__PURE__ */ jsx(ThreadPrimitive.Empty, { children: /* @__PURE__ */ jsx(AthenaChatWelcomeSuggestions, { suggestions: welcomeSuggestions }) }),
         /* @__PURE__ */ jsx(StatewireConnectionBanner, {}),
         /* @__PURE__ */ jsx(StatewireErrorBanner, {}),
         /* @__PURE__ */ jsx(StatewireApprovalCard, {}),
         /* @__PURE__ */ jsx(StatewireQueuedMessages, {}),
         /* @__PURE__ */ jsx(AttachmentProvider, { children: /* @__PURE__ */ jsxs(QuoteProvider, { children: [
           /* @__PURE__ */ jsx(QuotePostMessageBridge, {}),
-          /* @__PURE__ */ jsx(MentionAuthCtx.Provider, { value: mentionAuth, children: /* @__PURE__ */ jsx(AthenaChatComposer, { tools }) })
+          /* @__PURE__ */ jsx(MentionAuthCtx.Provider, { value: mentionAuth, children: /* @__PURE__ */ jsx(
+            AthenaChatComposer,
+            {
+              tools,
+              welcomeSuggestionCount: welcomeSuggestions.length
+            }
+          ) })
         ] }) })
       ] })
     }
-  ) }) });
-};
-const ThreadLoadingOverlay = () => {
-  const remoteId = useAthenaThreadId();
-  const [timedOut, setTimedOut] = useState(false);
-  useEffect(() => {
-    if (!remoteId) return;
-    setTimedOut(false);
-    const timer = setTimeout(() => setTimedOut(true), 15e3);
-    return () => clearTimeout(timer);
-  }, [remoteId]);
-  if (!remoteId || timedOut) return null;
-  return /* @__PURE__ */ jsx(AuiIf, { condition: (s) => s.thread.isEmpty, children: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-background/80", children: /* @__PURE__ */ jsx("div", { className: "size-5 animate-spin rounded-full border-2 border-muted-foreground border-t-transparent" }) }) });
+  ) }) }, statewireThreadId ?? void 0) });
 };
 const THREAD_VIEWPORT_ATTR = "data-aui-thread-viewport";
 const useScrollToTop = () => {
@@ -320,63 +302,13 @@ const ThreadScrollToTop = () => {
     }
   ) });
 };
-const ThreadScrollToBottom = () => /* @__PURE__ */ jsx(ThreadPrimitive.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx(
-  TooltipIconButton,
-  {
-    tooltip: "Scroll to bottom",
-    variant: "outline",
-    className: "aui-thread-scroll-to-bottom absolute -top-12 z-10 self-center rounded-full p-4 disabled:invisible dark:bg-background dark:hover:bg-accent",
-    children: /* @__PURE__ */ jsx(ArrowDownIcon, {})
-  }
-) });
-const AthenaComposerSendButton = ({
-  action,
-  onSend,
-  disabled,
-  title
-}) => {
-  const label = action === "queue" ? "Queue message" : "Send message";
-  return /* @__PURE__ */ jsx(
-    TooltipIconButton,
-    {
-      tooltip: title ?? label,
-      side: "bottom",
-      type: "button",
-      variant: "default",
-      size: "icon",
-      className: "aui-composer-send size-8 rounded-full",
-      "aria-label": label,
-      onClick: onSend,
-      disabled,
-      children: action === "queue" ? /* @__PURE__ */ jsx(ListPlusIcon, { className: "aui-composer-send-icon size-4" }) : /* @__PURE__ */ jsx(ArrowUpIcon, { className: "aui-composer-send-icon size-4" })
-    }
-  );
-};
-const AthenaComposerStopButton = ({ onStop, disabled, title }) => /* @__PURE__ */ jsx(
-  Button,
-  {
-    type: "button",
-    variant: "default",
-    size: "icon",
-    className: "aui-composer-cancel size-8 rounded-full",
-    "aria-label": "Stop generating",
-    title,
-    onClick: onStop,
-    disabled,
-    children: /* @__PURE__ */ jsx(SquareIcon, { className: "aui-composer-cancel-icon size-3 fill-current" })
-  }
-);
-const ATHENA_COMPOSER_COMPONENTS = {
-  SendButton: AthenaComposerSendButton,
-  StopButton: AthenaComposerStopButton
-};
 const ATHENA_CHAT_MENTION_CATEGORIES = [
   "favorites",
   "assets",
   "projects",
   "folders"
 ];
-const AthenaChatComposer = ({ tools }) => {
+const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
   const aui = useAui();
   const threadId = useAthenaStatewireThreadId();
   const { appUrl } = useAthenaConfig();
@@ -385,6 +317,15 @@ const AthenaChatComposer = ({ tools }) => {
   const { attachFiles } = useAttachFiles();
   const composerRef = useRef(null);
   const [hasText, setHasText] = useState(false);
+  const [dragActive, setDragActive] = useState(false);
+  const keyboardHint = useComposerKeyboardHint();
+  const reducedMotion = usePrefersReducedMotion();
+  const isEmpty = useAuiState((state) => state.thread.isEmpty);
+  const [mountedEmpty] = useState(() => isEmpty);
+  const entrance = welcomeEntrance(
+    welcomeComposerDelayMs(welcomeSuggestionCount),
+    reducedMotion || !mountedEmpty
+  );
   const rootCategories = useMemo(() => {
     const categories = [...ATHENA_CHAT_MENTION_CATEGORIES];
     if (tools.some((tool) => tool.type === "toolkit")) categories.push("toolkits");
@@ -440,41 +381,62 @@ const AthenaChatComposer = ({ tools }) => {
     }),
     [attachFiles]
   );
-  return /* @__PURE__ */ jsx(ComposerDropZone, { children: /* @__PURE__ */ jsx(
-    ChatComposerDock,
+  return /* @__PURE__ */ jsx(ComposerDropZone, { onDragActiveChange: setDragActive, children: /* @__PURE__ */ jsx(
+    "div",
     {
-      className: "",
-      surfaceClassName: "aui-composer-root relative flex w-full flex-col rounded-2xl border border-input bg-background px-1 pt-2 outline-none transition-shadow focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/20",
-      editorRowClassName: "px-2.5",
-      toolbarClassName: "aui-composer-action-wrapper relative mx-2 mb-2 flex items-center",
-      beforeEditor: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(ComposerQuotePreview, {}),
-        /* @__PURE__ */ jsx(ComposerAttachmentPreview, {})
-      ] }),
-      editor: /* @__PURE__ */ jsx(
-        TiptapComposer,
+      className: cn("aui-composer-entrance", entrance.className),
+      style: entrance.style,
+      onFocus: keyboardHint.onFocus,
+      children: /* @__PURE__ */ jsx(
+        ChatComposerDock,
         {
-          ref: composerRef,
-          threadId,
-          placeholder: "Type @ to tag an asset",
-          tools,
-          rootCategories,
-          onDraftStateChange: setHasText,
-          waitForHostUploads,
-          interceptSubmit,
-          fileIntake
-        }
-      ),
-      toolbarStart: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(FileUploadButton, {}) }),
-      toolbarEnd: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(
-        ComposerSendOrStop,
-        {
-          composerRef,
-          hasDraft: hasText || hasExtras,
-          sendBlockedReason: isUploading ? "Upload in progress..." : null,
-          components: ATHENA_COMPOSER_COMPONENTS
+          appearance: "paper",
+          dragActive,
+          aboveSurface: /* @__PURE__ */ jsx(ThreadScrollToBottom, {}),
+          beforeEditor: /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(ComposerQuotePreview, {}),
+            /* @__PURE__ */ jsx(ComposerAttachmentPreview, {})
+          ] }),
+          editor: /* @__PURE__ */ jsx(
+            TiptapComposer,
+            {
+              ref: composerRef,
+              threadId,
+              appearance: "paper",
+              placeholder: "Type @ to tag an asset",
+              tools,
+              rootCategories,
+              onDraftStateChange: setHasText,
+              waitForHostUploads,
+              interceptSubmit,
+              fileIntake,
+              onSubmitted: keyboardHint.onSubmitted
+            }
+          ),
+          toolbarStart: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(FileUploadButton, { className: "aui-composer-attach size-8 rounded-full p-0 disabled:opacity-30" }),
+            /* @__PURE__ */ jsx(
+              AthenaComposerMentionButton,
+              {
+                onClick: () => {
+                  var _a, _b;
+                  return (_b = (_a = composerRef.current) == null ? void 0 : _a.openMentionMenu) == null ? void 0 : _b.call(_a);
+                }
+              }
+            )
+          ] }),
+          toolbarEnd: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(
+            ComposerSendOrStop,
+            {
+              composerRef,
+              hasDraft: hasText || hasExtras,
+              sendBlockedReason: isUploading ? "Upload in progress..." : null,
+              components: ATHENA_COMPOSER_COMPONENTS
+            }
+          ) }),
+          belowSurface: /* @__PURE__ */ jsx(ComposerKeyboardHint, { visible: keyboardHint.visible })
         }
-      ) })
+      )
     }
   ) });
 };
@@ -491,9 +453,54 @@ const MessageError = () => /* @__PURE__ */ jsx(MessagePrimitive.Error, { childre
     }
   ) })
 ] }) });
+const RunStatusLine = ({ verb, resetKey, counterOnly = false, className }) => {
+  const [seconds, setSeconds] = useState(0);
+  useEffect(() => {
+    setSeconds(0);
+    const startedAt = Date.now();
+    const timer = setInterval(() => {
+      setSeconds(Math.floor((Date.now() - startedAt) / 1e3));
+    }, 1e3);
+    return () => clearInterval(timer);
+  }, [resetKey]);
+  const stalled = seconds >= RUN_ACTIVITY_STALL_SECONDS;
+  if (counterOnly && seconds < RUN_ACTIVITY_COUNTER_SECONDS) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "run-status-line",
+      "data-stalled": stalled ? "true" : void 0,
+      className: cn(
+        "aui-run-activity mt-2 flex items-center gap-2 px-1 text-[12px] text-muted-foreground",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "size-1.5 shrink-0 rounded-full bg-current opacity-60",
+              !stalled && "animate-pulse motion-reduce:animate-none"
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn("tabular-nums", stalled && "text-amber-600 dark:text-amber-400"),
+            children: runActivityLabel(seconds, verb)
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "sr-only", children: stalled ? "Assistant is still working; nothing new for over thirty seconds." : `${verb}…` })
+      ]
+    }
+  );
+};
 const AthenaAssistantMessageEmpty = ({ status }) => {
   if ((status == null ? void 0 : status.type) !== "running") return null;
-  return /* @__PURE__ */ jsx("span", { className: "shimmer text-[13px] text-muted-foreground", children: "Thinking..." });
+  return /* @__PURE__ */ jsx(RunStatusLine, { verb: "Thinking", resetKey: "empty", className: "mt-0" });
 };
 const AthenaMessageEmptyIndicator = ({
   EmptyComponent
@@ -512,27 +519,77 @@ const AthenaMessageActivityIndicator = () => {
     return ((_a = s.message.status) == null ? void 0 : _a.type) === "running";
   });
   const activityKey = useAuiState((s) => runActivityKey(s.message.parts));
-  const [seconds, setSeconds] = useState(0);
-  useEffect(() => {
-    setSeconds(0);
-    if (!isRunning || activityKey === null) return;
-    const startedAt = Date.now();
-    const timer = setInterval(() => {
-      setSeconds(Math.floor((Date.now() - startedAt) / 1e3));
-    }, 1e3);
-    return () => clearInterval(timer);
-  }, [isRunning, activityKey]);
+  const verb = useAuiState((s) => runActivityVerb(s.message.parts));
   if (!isRunning || activityKey === null) return null;
-  const stalled = seconds >= RUN_ACTIVITY_STALL_SECONDS;
-  return /* @__PURE__ */ jsxs("div", { className: "aui-run-activity mt-2 flex items-center gap-2 px-1 text-[12px] text-muted-foreground", children: [
-    /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", "aria-hidden": true, children: [
-      /* @__PURE__ */ jsx("span", { className: "size-1.5 animate-bounce rounded-full bg-current [animation-delay:0ms]" }),
-      /* @__PURE__ */ jsx("span", { className: "size-1.5 animate-bounce rounded-full bg-current [animation-delay:150ms]" }),
-      /* @__PURE__ */ jsx("span", { className: "size-1.5 animate-bounce rounded-full bg-current [animation-delay:300ms]" })
-    ] }),
-    /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: stalled ? "text-amber-600 dark:text-amber-400" : void 0, children: runActivityLabel(seconds) }),
-    /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "sr-only", children: stalled ? "Assistant is still working; nothing new for over thirty seconds." : "Assistant is working." })
-  ] });
+  return /* @__PURE__ */ jsx(RunStatusLine, { verb: verb ?? "Working", resetKey: activityKey });
+};
+const AthenaGroupedRunMeta = () => {
+  const activityKey = useAuiState((s) => runActivityKey(s.message.parts));
+  return /* @__PURE__ */ jsx(
+    RunStatusLine,
+    {
+      verb: "Working",
+      resetKey: activityKey ?? "thinking",
+      counterOnly: true,
+      className: "mt-1 px-0"
+    }
+  );
+};
+const renderGroupedRunningMeta = () => /* @__PURE__ */ jsx(AthenaGroupedRunMeta, {});
+const MessageDaySeparator = () => {
+  const stamp = useAuiState((s) => {
+    var _a;
+    return readMessageCreatedAt((_a = s.message.metadata) == null ? void 0 : _a.custom);
+  });
+  const previousStamp = useAuiState((s) => {
+    var _a;
+    const index = s.message.index;
+    const previous = index > 0 ? s.thread.messages[index - 1] : void 0;
+    return readMessageCreatedAt((_a = previous == null ? void 0 : previous.metadata) == null ? void 0 : _a.custom);
+  });
+  const label = useMemo(() => {
+    const date = stamp ? parseMessageTime(stamp) : null;
+    const previous = previousStamp ? parseMessageTime(previousStamp) : null;
+    if (!date || !previous || isSameCalendarDay(date, previous)) return null;
+    return formatDayLabel(date);
+  }, [stamp, previousStamp]);
+  if (!label) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "separator",
+      "aria-label": label,
+      "data-slot": "day-separator",
+      className: "aui-day-separator mb-3 flex w-full items-center gap-3 text-[11px] font-medium text-muted-foreground",
+      children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-border" }),
+        /* @__PURE__ */ jsx("span", { children: label }),
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-border" })
+      ]
+    }
+  );
+};
+const MessageTimestamp = ({ className }) => {
+  const stamp = useAuiState((s) => {
+    var _a;
+    return readMessageCreatedAt((_a = s.message.metadata) == null ? void 0 : _a.custom);
+  });
+  const date = useMemo(() => stamp ? parseMessageTime(stamp) : null, [stamp]);
+  if (!date) return null;
+  return /* @__PURE__ */ jsx(
+    "time",
+    {
+      dateTime: date.toISOString(),
+      title: formatMessageDateTime(date),
+      "data-slot": "message-timestamp",
+      className: cn(
+        "aui-message-timestamp shrink-0 text-[11px] tabular-nums text-muted-foreground",
+        ACTION_BAR_REVEAL_CLASS,
+        className
+      ),
+      children: formatMessageTime(date)
+    }
+  );
 };
 const AthenaReasoningPart = ({
   text,
@@ -612,11 +669,12 @@ const AthenaReasoningPart = ({
 const noToolGrouping = () => null;
 const AthenaAssistantMessage = ({
   toolUIs,
+  AvatarComponent,
   TextComponent = TiptapText,
   ReasoningComponent,
   EmptyComponent = AthenaAssistantMessageEmpty,
   ActionBarComponent = AthenaAssistantActionBar,
-  groupToolCalls = false
+  groupToolCalls = true
 }) => {
   const effectiveReasoningComponent = ReasoningComponent ?? AthenaReasoningPart;
   const toolUIsWithNestedMessages = useMemo(() => {
@@ -644,50 +702,71 @@ const AthenaAssistantMessage = ({
       className: "aui-assistant-message-root group/aui-assistant-message fade-in slide-in-from-bottom-1 relative mx-auto w-full max-w-(--thread-max-width) animate-in py-3 duration-150",
       "data-role": "assistant",
       children: [
-        /* @__PURE__ */ jsx(AthenaReasoningTextComponentContext.Provider, { value: TextComponent, children: /* @__PURE__ */ jsxs("div", { className: "aui-assistant-message-content wrap-break-word px-2 text-foreground leading-relaxed", children: [
-          /* @__PURE__ */ jsx(NestedPtcComponentsProvider, { components: nestedPtcComponents, children: groupToolCalls ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-2", children: [
-            /* @__PURE__ */ jsx(
-              SuperGroupingCard,
-              {
-                toolUIs: toolUIsWithNestedMessages,
-                TextComponent,
-                ReasoningComponent: effectiveReasoningComponent
-              }
-            ),
-            /* @__PURE__ */ jsx(SuperGroupingFinalText, { TextComponent }),
-            /* @__PURE__ */ jsx(AthenaMessageActivityIndicator, {})
-          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(AthenaMessageEmptyIndicator, { EmptyComponent }),
-            /* @__PURE__ */ jsx(MessagePrimitive.GroupedParts, { groupBy: noToolGrouping, children: ({ part }) => {
-              var _a;
-              switch (part.type) {
-                case "tool-call": {
-                  const ToolUI = toolUIsWithNestedMessages[part.toolName];
-                  const toolProps = part;
-                  return ToolUI ? /* @__PURE__ */ jsx(ToolUI, { ...toolProps }) : /* @__PURE__ */ jsx(ToolFallback, { ...toolProps });
-                }
-                case "reasoning": {
-                  const ReasoningRenderer = effectiveReasoningComponent;
-                  return /* @__PURE__ */ jsx(ReasoningRenderer, { ...part });
+        /* @__PURE__ */ jsx(MessageDaySeparator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "data-slot": "assistant-lead",
+              className: "aui-assistant-message-lead flex shrink-0 justify-center",
+              children: AvatarComponent ? /* @__PURE__ */ jsx(AvatarComponent, {}) : /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  "data-slot": "assistant-rule",
+                  className: "aui-assistant-message-rule w-0.5 self-stretch rounded-full bg-border"
                 }
-                case "text": {
-                  const textPart = part;
-                  if (textPart.text === "" && ((_a = textPart.status) == null ? void 0 : _a.type) === "running") {
-                    return /* @__PURE__ */ jsx(EmptyComponent, { status: textPart.status });
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx(AthenaReasoningTextComponentContext.Provider, { value: TextComponent, children: /* @__PURE__ */ jsxs("div", { className: "aui-assistant-message-content wrap-break-word px-2 text-foreground leading-relaxed", children: [
+              /* @__PURE__ */ jsx(NestedPtcComponentsProvider, { components: nestedPtcComponents, children: groupToolCalls ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-2", children: [
+                /* @__PURE__ */ jsx(
+                  SuperGroupingCard,
+                  {
+                    toolUIs: toolUIsWithNestedMessages,
+                    TextComponent,
+                    ReasoningComponent: effectiveReasoningComponent,
+                    renderRunningMeta: renderGroupedRunningMeta
                   }
-                  return /* @__PURE__ */ jsx(TextComponent, { ...textPart });
-                }
-                default:
-                  return null;
-              }
-            } }),
-            /* @__PURE__ */ jsx(AthenaMessageActivityIndicator, {})
-          ] }) }),
-          /* @__PURE__ */ jsx(MessageError, {})
-        ] }) }),
-        /* @__PURE__ */ jsxs("div", { className: "aui-assistant-message-footer mt-1 ml-2 flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx(BranchPicker, {}),
-          /* @__PURE__ */ jsx(ActionBarComponent, {})
+                ),
+                /* @__PURE__ */ jsx(SuperGroupingFinalText, { TextComponent })
+              ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(AthenaMessageEmptyIndicator, { EmptyComponent }),
+                /* @__PURE__ */ jsx(MessagePrimitive.GroupedParts, { groupBy: noToolGrouping, children: ({ part }) => {
+                  var _a;
+                  switch (part.type) {
+                    case "tool-call": {
+                      const ToolUI = toolUIsWithNestedMessages[part.toolName];
+                      const toolProps = part;
+                      return ToolUI ? /* @__PURE__ */ jsx(ToolUI, { ...toolProps }) : /* @__PURE__ */ jsx(ToolFallback, { ...toolProps });
+                    }
+                    case "reasoning": {
+                      const ReasoningRenderer = effectiveReasoningComponent;
+                      return /* @__PURE__ */ jsx(ReasoningRenderer, { ...part });
+                    }
+                    case "text": {
+                      const textPart = part;
+                      if (textPart.text === "" && ((_a = textPart.status) == null ? void 0 : _a.type) === "running") {
+                        return /* @__PURE__ */ jsx(EmptyComponent, { status: textPart.status });
+                      }
+                      return /* @__PURE__ */ jsx(TextComponent, { ...textPart });
+                    }
+                    default:
+                      return null;
+                  }
+                } }),
+                /* @__PURE__ */ jsx(AthenaMessageActivityIndicator, {})
+              ] }) }),
+              /* @__PURE__ */ jsx(MessageError, {})
+            ] }) }),
+            /* @__PURE__ */ jsxs("div", { className: "aui-assistant-message-footer mt-1 ml-2 flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx(BranchPicker, {}),
+              /* @__PURE__ */ jsx(ActionBarComponent, {}),
+              /* @__PURE__ */ jsx(MessageTimestamp, { className: "ml-auto group-hover/aui-assistant-message:opacity-100" })
+            ] })
+          ] })
         ] })
       ]
     }
@@ -786,20 +865,43 @@ const AthenaAssistantActionBar = ({ className }) => {
 };
 const AthenaUserMessage = ({
   TextComponent = TiptapText
-}) => /* @__PURE__ */ jsx(
-  MessagePrimitive.Root,
-  {
-    className: "aui-user-message-root group/aui-user-message fade-in slide-in-from-bottom-1 mx-auto flex w-full max-w-(--thread-max-width) animate-in justify-end px-2 py-3 duration-150",
-    "data-role": "user",
-    children: /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 max-w-full flex-col items-end gap-1", children: [
-      /* @__PURE__ */ jsx("div", { className: "aui-user-message-content wrap-break-word rounded-2xl bg-muted px-4 py-2.5 text-foreground", children: /* @__PURE__ */ jsx(MessagePrimitive.Parts, { components: { Text: TextComponent } }) }),
-      /* @__PURE__ */ jsxs("div", { className: "aui-user-message-footer -mr-1 flex items-center gap-1", children: [
-        /* @__PURE__ */ jsx(BranchPicker, {}),
-        /* @__PURE__ */ jsx(AthenaUserActionBar, {})
-      ] })
-    ] })
+}) => {
+  const isWake = useAuiState((s) => {
+    var _a;
+    return isGithubWakeMessage((_a = s.message.metadata) == null ? void 0 : _a.custom);
+  });
+  if (isWake) {
+    return /* @__PURE__ */ jsxs(
+      MessagePrimitive.Root,
+      {
+        className: "aui-user-message-root aui-wake-marker-root mx-auto w-full max-w-(--thread-max-width) px-2 py-1",
+        "data-role": "user",
+        children: [
+          /* @__PURE__ */ jsx(MessageDaySeparator, {}),
+          /* @__PURE__ */ jsx(WakeMarkerMessage, {})
+        ]
+      }
+    );
   }
-);
+  return /* @__PURE__ */ jsxs(
+    MessagePrimitive.Root,
+    {
+      className: "aui-user-message-root group/aui-user-message fade-in slide-in-from-bottom-1 mx-auto flex w-full max-w-(--thread-max-width) animate-in flex-col items-end px-2 py-3 duration-150",
+      "data-role": "user",
+      children: [
+        /* @__PURE__ */ jsx(MessageDaySeparator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 max-w-[75%] flex-col items-end gap-1", children: [
+          /* @__PURE__ */ jsx("div", { className: "aui-user-message-content wrap-break-word rounded-2xl bg-muted/70 px-4 py-2.5 text-foreground", children: /* @__PURE__ */ jsx(MessagePrimitive.Parts, { components: { Text: TextComponent } }) }),
+          /* @__PURE__ */ jsxs("div", { className: "aui-user-message-footer -mr-1 flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(MessageTimestamp, { className: "mr-1 group-hover/aui-user-message:opacity-100" }),
+            /* @__PURE__ */ jsx(BranchPicker, {}),
+            /* @__PURE__ */ jsx(AthenaUserActionBar, {})
+          ] })
+        ] })
+      ]
+    }
+  );
+};
 export {
   AthenaAssistantActionBar,
   AthenaAssistantMessage,