@athenaintel/react 0.22.3 → 0.23.0

package/dist/chat-ui/rich-text/citation-anchors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"citation-anchors.js","sources":["../../../src/chat-ui/rich-text/citation-anchors.ts"],"sourcesContent":["/**\n * Citation anchors in assistant text, made parseable and safe for the chat\n * text schema.\n *\n * Agora's deep agent cites sources as inline HTML anchors that carry no\n * `href` (`agora/agora/graphs/tools/citation_readables.py`,\n * `agora/agora/services/reader/service.py`):\n *\n *   <a class=\"mention\" data-type=\"url\" data-url=\"https://…\" data-excerpt=\"…\">Label</a>\n *   <a class=\"mention\" data-type=\"pdf\" data-id=\"asset_…\" data-page-number=10\n *      data-end-page-number=null data-excerpt=\"…\">Citation</a>\n *\n * ProseMirror's Link mark parses `a[href]` only, so without a rewrite both\n * shapes render as their label text — a source nobody can open. This module\n * rewrites the anchors in the HTML markdown-it produced, before the schema\n * parses it: a URL citation gets its `data-url` as `href`; an asset citation\n * gets the Spaces deep link (`asset_ids`, `type`, the page anchor, `excerpt`)\n * that the mention rule turns into an asset chip. `data-excerpt` stays on the\n * anchor for the Link mark's `excerpt` attribute — the source chip's tooltip\n * and its scroll-to-text target. Working on the parsed DOM rather than the\n * markdown keeps fenced and inline code (where markdown-it has already\n * escaped the tag into text) untouched.\n */\n\n/** `asset_<uuid>`, `asset_thread_<uuid>`, the ids agora hands the model. */\nconst ASSET_ID = /^asset_[\\w-]+$/;\n/** The `mention` class agora and Olympus put on citation anchors. */\nconst MENTION_CLASS = /(?:^|\\s)mention(?:\\s|$)/;\n/** A URL scheme at the start of an href. */\nconst SCHEME = /^([a-z][a-z0-9+.-]*):/i;\n/** Whitespace, control and format characters, which a scheme check must not be fooled by (`java\\nscript:`, a zero-width space). */\nconst IGNORED_CHARACTERS = /[\\s\\p{Cc}\\p{Cf}]/gu;\n/** An app-relative Spaces path — the one relative href assistant text may carry. */\nconst SPACES_PATH = /^\\/dashboard\\/spaces\\/?(?:[?#]|$)/;\n/** Only these schemes pass; every other one is dropped and its label kept as text. */\nconst ALLOWED_SCHEMES: ReadonlySet<string> = new Set([\n  \"http\",\n  \"https\",\n  \"mailto\",\n  \"athena-point\",\n]);\n\n/**\n * Whether an href may become a link in chat text: `http(s):`, `mailto:`, the\n * screen-point protocol, or an app-relative Spaces path. Scheme-less\n * protocol-relative (`//host`) and fragment/query-only hrefs fail, and so\n * does every other scheme (`javascript:`, `vbscript:`, `data:`, `ftp:`).\n */\nexport function isAllowedChatHref(href: string): boolean {\n  const value = href.replace(IGNORED_CHARACTERS, \"\");\n  if (!value) return false;\n  const scheme = SCHEME.exec(value)?.[1]?.toLowerCase();\n  if (scheme !== undefined) return ALLOWED_SCHEMES.has(scheme);\n  return SPACES_PATH.test(value);\n}\n\n/** Whether an href points at a web page (the source chip's domain) rather than an app path or mail address. */\nexport function isWebHref(href: string): boolean {\n  const scheme = SCHEME.exec(href.replace(IGNORED_CHARACTERS, \"\"))?.[1]?.toLowerCase();\n  return scheme === \"http\" || scheme === \"https\";\n}\n\n/** The page number an agora citation attribute names, or null for `null`, blanks and non-numbers. */\nfunction parsePage(value: string | null): number | null {\n  if (value === null) return null;\n  const trimmed = value.trim().replace(/^\"|\"$/g, \"\");\n  if (!/^\\d+$/.test(trimmed)) return null;\n  const page = Number(trimmed);\n  return page > 0 ? page : null;\n}\n\n/** `pdf`, `Citation/pdf`, `athena/document` → the bare asset type Spaces expects. */\nfunction normalizeAssetType(value: string | null): string | null {\n  const trimmed = value?.trim() ?? \"\";\n  if (!trimmed) return null;\n  const bare = trimmed.slice(trimmed.lastIndexOf(\"/\") + 1).toLowerCase();\n  return bare && bare !== \"url\" ? bare : null;\n}\n\n/**\n * The Spaces deep link for an agora asset citation: the cited asset, its type,\n * a `page` anchor (or `page_range` when the citation spans pages) and the\n * excerpt — the same query the SDK's `parseAthenaCitationLink` reads back\n * into an embed reference when the chip is clicked.\n */\nexport function buildAssetCitationHref({\n  assetId,\n  assetType,\n  pageNumber,\n  endPageNumber,\n  excerpt,\n}: {\n  assetId: string;\n  assetType: string | null;\n  pageNumber: string | null;\n  endPageNumber: string | null;\n  excerpt: string | null;\n}): string {\n  const params = new URLSearchParams({ asset_ids: assetId });\n  const type = normalizeAssetType(assetType);\n  if (type) params.set(\"type\", type);\n  const start = parsePage(pageNumber);\n  const end = parsePage(endPageNumber);\n  if (start !== null && end !== null && end > start) {\n    params.set(\"anchor\", \"page_range\");\n    params.set(\"start_page\", String(start));\n    params.set(\"end_page\", String(end));\n  } else if (start !== null) {\n    params.set(\"anchor\", \"page\");\n    params.set(\"page\", String(start));\n  }\n  const trimmedExcerpt = excerpt?.trim();\n  if (trimmedExcerpt) params.set(\"excerpt\", trimmedExcerpt);\n  return `/dashboard/spaces/?${params.toString()}`;\n}\n\n/**\n * Give every `href`-less citation anchor under `root` the href the schema's\n * parse rules need. Anchors that already carry an href are left alone (their\n * `data-excerpt`, if any, is read by the Link mark itself).\n */\nexport function normalizeCitationAnchors(root: ParentNode): void {\n  for (const anchor of root.querySelectorAll(\"a\")) {\n    // Olympus serializes a mention's label as `@Label`; the chip draws the name.\n    const label = anchor.firstChild;\n    if (\n      MENTION_CLASS.test(anchor.getAttribute(\"class\") ?? \"\") &&\n      label?.nodeType === 3 &&\n      label.textContent?.startsWith(\"@\")\n    ) {\n      label.textContent = label.textContent.slice(1);\n    }\n    if (anchor.hasAttribute(\"href\")) continue;\n    const type = anchor.getAttribute(\"data-type\");\n    const assetId = anchor.getAttribute(\"data-id\");\n    const dataUrl = anchor.getAttribute(\"data-url\");\n    if (dataUrl && (type === \"url\" || !assetId)) {\n      const href = dataUrl.trim();\n      if (isAllowedChatHref(href)) anchor.setAttribute(\"href\", href);\n      continue;\n    }\n    if (assetId && ASSET_ID.test(assetId)) {\n      anchor.setAttribute(\n        \"href\",\n        buildAssetCitationHref({\n          assetId,\n          assetType: type,\n          pageNumber: anchor.getAttribute(\"data-page-number\"),\n          endPageNumber: anchor.getAttribute(\"data-end-page-number\"),\n          excerpt: anchor.getAttribute(\"data-excerpt\"),\n        }),\n      );\n    }\n  }\n}\n\n/**\n * The cited page with a Scroll-to-Text Fragment (`#:~:text=`) for the excerpt,\n * so the browser lands on and highlights the quoted passage. Agora's\n * `start...end` range form becomes `text=start,end`. A URL that does not parse\n * is returned as is.\n * @see https://wicg.github.io/scroll-to-text-fragment/\n */\nexport function buildScrollToTextUrl(url: string, excerpt: string | null | undefined): string {\n  if (!excerpt) return url;\n  try {\n    new URL(url);\n  } catch {\n    return url;\n  }\n  let fragment: string;\n  const separator = excerpt.indexOf(\"...\");\n  const start = separator === -1 ? \"\" : excerpt.slice(0, separator).trim();\n  const end = separator === -1 ? \"\" : excerpt.slice(separator + 3).trim();\n  if (start && end) {\n    fragment = `${encodeURIComponent(start)},${encodeURIComponent(end)}`;\n  } else {\n    fragment = encodeURIComponent(excerpt);\n  }\n  const hash = url.indexOf(\"#\");\n  if (hash === -1) return `${url}#:~:text=${fragment}`;\n  return `${url.slice(0, hash)}#${url.slice(hash + 1)}:~:text=${fragment}`;\n}\n\n/** A single-label host (`intranet`, `localhost`) or a reserved / private-network suffix. */\nconst PRIVATE_HOSTNAME =\n  /^(?:[^.]+|.*\\.(?:local|localhost|internal|intranet|corp|home|lan|private|test|example|invalid|onion))$/i;\n/** An IPv4 or bracketed IPv6 literal, as `URL.hostname` spells them. */\nconst IP_LITERAL = /^(?:\\d{1,3}(?:\\.\\d{1,3}){3}|\\[[0-9a-f:.]+\\])$/i;\n\n/**\n * Whether a hostname looks like a public site: dotted, ending in an\n * alphabetic top-level label, not an IP literal and not a reserved or\n * intranet suffix. Only such a host is ever named to a third party.\n */\nexport function isPublicHostname(hostname: string): boolean {\n  if (!hostname || IP_LITERAL.test(hostname) || PRIVATE_HOSTNAME.test(hostname)) {\n    return false;\n  }\n  return /\\.[a-z]{2,}$/i.test(hostname);\n}\n\n/**\n * The favicon of a web source, from Google's favicon service, or null when\n * there is none to ask for: a non-web href, or a host that looks private\n * (single label, IP literal, reserved or intranet suffix). The service is a\n * third party, so a hostname that may belong to a tenant's own network must\n * not leave it just because a message rendered; the chip shows a globe\n * instead. The image also carries `referrerPolicy=\"no-referrer\"`.\n */\nexport function sourceFaviconUrl(href: string): string | null {\n  if (!isWebHref(href)) return null;\n  try {\n    const { hostname } = new URL(href);\n    if (!isPublicHostname(hostname)) return null;\n    return `https://www.google.com/s2/favicons?domain=${encodeURIComponent(hostname)}&sz=32`;\n  } catch {\n    return null;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/chat-ui/statewire.cjs

@@ -7,21 +7,24 @@ const statewireHistoryEdge = require("./thread/statewire-history-edge.cjs");
 const statewireWindowContext = require("../provider/statewire-window-context.cjs");
 const continuePill = require("./messages/continue-pill.cjs");
 const runtimeMessage = require("./messages/runtime-message.cjs");
+const wakeMarker = require("./messages/wake-marker.cjs");
+const WaitingOnYouBanner = require("../chat/WaitingOnYouBanner.cjs");
 const statewireContinueRun = require("./messages/statewire-continue-run.cjs");
 require("../packages/agent-runtime/src/generated/runconfig-contract.cjs");
 require("react");
 require("@assistant-ui/tap");
 require("statewire");
 require("../packages/agent-runtime/src/statewire-suspended.cjs");
+require("../packages/agent-runtime/src/conversation-list.cjs");
 require("@tanstack/react-query");
 const interrupts = require("../packages/agent-runtime/src/interrupts.cjs");
 require("../packages/agent-runtime/src/messages.cjs");
 require("../packages/agent-runtime/src/statewire-state.cjs");
-require("@assistant-ui/react-statewire");
 require("@assistant-ui/store");
 require("../packages/agent-runtime/src/quota-safe-local-storage-session.cjs");
 require("../packages/agent-runtime/src/statewire-attach-observer.cjs");
 require("../packages/agent-runtime/src/thread-status.cjs");
+require("@assistant-ui/react-statewire");
 require("@assistant-ui/core");
 require("../packages/agent-runtime/src/thread-handoff.cjs");
 exports.StatewireApprovalCard = StatewireApprovalCard.StatewireApprovalCard;
@@ -33,6 +36,10 @@ exports.StatewireToolOutputsContext = statewireWindowContext.StatewireToolOutput
 exports.useStatewireToolOutputs = statewireWindowContext.useStatewireToolOutputs;
 exports.ContinuePill = continuePill.ContinuePill;
 exports.RuntimeMessageCard = runtimeMessage.RuntimeMessageCard;
+exports.WakeMarkerCard = wakeMarker.WakeMarkerCard;
+exports.WakeMarkerMessage = wakeMarker.WakeMarkerMessage;
+exports.WaitingOnYouBanner = WaitingOnYouBanner.WaitingOnYouBanner;
+exports.WaitingOnYouBannerView = WaitingOnYouBanner.WaitingOnYouBannerView;
 exports.StatewireContinueRunAffordance = statewireContinueRun.StatewireContinueRunAffordance;
 exports.StatewireContinueRunButton = statewireContinueRun.StatewireContinueRunButton;
 exports.StatewireRunEndedFooter = statewireContinueRun.StatewireRunEndedFooter;

package/dist/chat-ui/statewire.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"statewire.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"statewire.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chat-ui/statewire.d.ts

@@ -15,5 +15,7 @@ export { HistoryEdgeRow, type HistoryEdgeRowProps, StatewireHistoryEdge, type St
 export { StatewireToolOutputsContext, useStatewireToolOutputs, } from "../provider/statewire-window-context";
 export { ContinuePill } from "./messages/continue-pill";
 export { RuntimeMessageCard, type RuntimeMessageCardProps } from "./messages/runtime-message";
+export { WakeMarkerCard, type WakeMarkerCardProps, WakeMarkerMessage, } from "./messages/wake-marker";
+export { WaitingOnYouBanner, type WaitingOnYouBannerProps, WaitingOnYouBannerView, type WaitingOnYouBannerViewProps, } from "../chat/WaitingOnYouBanner";
 export { type ReadStatewireTailEnding, StatewireContinueRunAffordance, StatewireContinueRunButton, type StatewireContinueRunButtonProps, StatewireRunEndedFooter, type StatewireRunEndedFooterActionsContext, type StatewireRunEndedFooterProps, type StatewireTailEnding, } from "./messages/statewire-continue-run";
 export { HITL_PENDING_RESUME_GRACE_MS } from "@athenaintel/agent-runtime";

package/dist/chat-ui/statewire.js

@@ -5,21 +5,24 @@ import { HistoryEdgeRow, StatewireHistoryEdge } from "./thread/statewire-history
 import { StatewireToolOutputsContext, useStatewireToolOutputs } from "../provider/statewire-window-context.js";
 import { ContinuePill } from "./messages/continue-pill.js";
 import { RuntimeMessageCard } from "./messages/runtime-message.js";
+import { WakeMarkerCard, WakeMarkerMessage } from "./messages/wake-marker.js";
+import { WaitingOnYouBanner, WaitingOnYouBannerView } from "../chat/WaitingOnYouBanner.js";
 import { StatewireContinueRunAffordance, StatewireContinueRunButton, StatewireRunEndedFooter } from "./messages/statewire-continue-run.js";
 import "../packages/agent-runtime/src/generated/runconfig-contract.js";
 import "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 { HITL_PENDING_RESUME_GRACE_MS } from "../packages/agent-runtime/src/interrupts.js";
 import "../packages/agent-runtime/src/messages.js";
 import "../packages/agent-runtime/src/statewire-state.js";
-import "@assistant-ui/react-statewire";
 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 "@assistant-ui/core";
 import "../packages/agent-runtime/src/thread-handoff.js";
 export {
@@ -34,6 +37,10 @@ export {
   StatewireQueuedMessages,
   StatewireRunEndedFooter,
   StatewireToolOutputsContext,
+  WaitingOnYouBanner,
+  WaitingOnYouBannerView,
+  WakeMarkerCard,
+  WakeMarkerMessage,
   useStatewireApprovalRequest,
   useStatewireToolOutputs
 };

package/dist/chat-ui/statewire.js.map

@@ -1 +1 @@
-{"version":3,"file":"statewire.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"statewire.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chat-ui/thread/chat-composer-dock.cjs

@@ -3,34 +3,55 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("@assistant-ui/react");
 const messageComponents = require("../messages/message-components.cjs");
+const CHROME = {
+  default: {
+    dock: messageComponents.COMPOSER_DOCK_CLASS,
+    surface: messageComponents.COMPOSER_SURFACE_CLASS,
+    editorRow: messageComponents.COMPOSER_EDITOR_ROW_CLASS,
+    toolbar: messageComponents.COMPOSER_TOOLBAR_CLASS
+  },
+  paper: {
+    dock: messageComponents.COMPOSER_PAPER_DOCK_CLASS,
+    surface: messageComponents.COMPOSER_PAPER_SURFACE_CLASS,
+    editorRow: messageComponents.COMPOSER_PAPER_EDITOR_ROW_CLASS,
+    toolbar: messageComponents.COMPOSER_PAPER_TOOLBAR_CLASS
+  }
+};
 function ChatComposerDock({
+  appearance = "default",
   className,
   surfaceClassName,
   editorRowClassName,
   toolbarClassName,
+  dragActive = false,
   aboveSurface,
   beforeEditor,
   editor,
   toolbarStart,
-  toolbarEnd
+  toolbarEnd,
+  belowSurface
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: className ?? messageComponents.COMPOSER_DOCK_CLASS, children: [
+  const chrome = CHROME[appearance];
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: className ?? chrome.dock, children: [
     aboveSurface,
     /* @__PURE__ */ jsxRuntime.jsxs(
       react.ComposerPrimitive.Root,
       {
-        className: surfaceClassName ?? messageComponents.COMPOSER_SURFACE_CLASS,
+        className: surfaceClassName ?? chrome.surface,
+        "data-appearance": appearance === "paper" ? "paper" : void 0,
+        "data-drag-active": dragActive ? "true" : void 0,
         children: [
           beforeEditor,
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: editorRowClassName ?? messageComponents.COMPOSER_EDITOR_ROW_CLASS, children: editor }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: toolbarClassName ?? messageComponents.COMPOSER_TOOLBAR_CLASS, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: editorRowClassName ?? chrome.editorRow, children: editor }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: toolbarClassName ?? chrome.toolbar, children: [
             toolbarStart,
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
             toolbarEnd
           ] })
         ]
       }
-    )
+    ),
+    belowSurface
   ] });
 }
 exports.ChatComposerDock = ChatComposerDock;

package/dist/chat-ui/thread/chat-composer-dock.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"chat-composer-dock.cjs","sources":["../../../src/chat-ui/thread/chat-composer-dock.tsx"],"sourcesContent":["import { ComposerPrimitive } from \"@assistant-ui/react\";\nimport type { ReactNode } from \"react\";\nimport {\n  COMPOSER_DOCK_CLASS,\n  COMPOSER_EDITOR_ROW_CLASS,\n  COMPOSER_SURFACE_CLASS,\n  COMPOSER_TOOLBAR_CLASS,\n} from \"../messages/message-components\";\n\nexport interface ChatComposerDockProps {\n  /**\n   * Replaces the dock chrome (padding + background around the surface).\n   * Hosts with their own composer chrome system (AthenaChat's `aui-*`\n   * classes) pass their chrome here; the scaffolding structure stays shared.\n   */\n  className?: string;\n  /** Replaces the bordered composer-surface chrome. */\n  surfaceClassName?: string;\n  /** Replaces the editor-row chrome. */\n  editorRowClassName?: string;\n  /** Replaces the toolbar-row chrome. */\n  toolbarClassName?: string;\n  /** Rendered inside the dock, above the composer surface (error banners). */\n  aboveSurface?: ReactNode;\n  /**\n   * Rendered inside the surface above the editor row: context chips,\n   * restore notices, attachment strips.\n   */\n  beforeEditor?: ReactNode;\n  /** The editor element (a TiptapComposer, typically ref-held by the host). */\n  editor: ReactNode;\n  /** Toolbar contents before the spacer (attach buttons, pickers). */\n  toolbarStart?: ReactNode;\n  /** Toolbar contents after the spacer (voice and send/stop controls). */\n  toolbarEnd: ReactNode;\n}\n\n/**\n * The shared composer scaffolding: dock padding, the bordered surface, the\n * editor row, and the toolbar with its start/end slots around a flexible\n * spacer. Hosts supply the editor element and toolbar controls.\n */\nexport function ChatComposerDock({\n  className,\n  surfaceClassName,\n  editorRowClassName,\n  toolbarClassName,\n  aboveSurface,\n  beforeEditor,\n  editor,\n  toolbarStart,\n  toolbarEnd,\n}: ChatComposerDockProps) {\n  return (\n    <div className={className ?? COMPOSER_DOCK_CLASS}>\n      {aboveSurface}\n      <ComposerPrimitive.Root\n        className={surfaceClassName ?? COMPOSER_SURFACE_CLASS}\n      >\n        {beforeEditor}\n        <div className={editorRowClassName ?? COMPOSER_EDITOR_ROW_CLASS}>\n          {editor}\n        </div>\n        <div className={toolbarClassName ?? COMPOSER_TOOLBAR_CLASS}>\n          {toolbarStart}\n          <div className=\"flex-1\" />\n          {toolbarEnd}\n        </div>\n      </ComposerPrimitive.Root>\n    </div>\n  );\n}\n"],"names":["jsxs","COMPOSER_DOCK_CLASS","ComposerPrimitive","COMPOSER_SURFACE_CLASS","jsx","COMPOSER_EDITOR_ROW_CLASS","COMPOSER_TOOLBAR_CLASS"],"mappings":";;;;;AA0CO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACEA,2BAAAA,KAAC,OAAA,EAAI,WAAW,aAAaC,kBAAAA,qBAC1B,UAAA;AAAA,IAAA;AAAA,IACDD,2BAAAA;AAAAA,MAACE,MAAAA,kBAAkB;AAAA,MAAlB;AAAA,QACC,WAAW,oBAAoBC,kBAAAA;AAAAA,QAE9B,UAAA;AAAA,UAAA;AAAA,UACDC,2BAAAA,IAAC,OAAA,EAAI,WAAW,sBAAsBC,6CACnC,UAAA,QACH;AAAA,UACAL,2BAAAA,KAAC,OAAA,EAAI,WAAW,oBAAoBM,kBAAAA,wBACjC,UAAA;AAAA,YAAA;AAAA,YACDF,2BAAAA,IAAC,OAAA,EAAI,WAAU,SAAA,CAAS;AAAA,YACvB;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;;"}
+{"version":3,"file":"chat-composer-dock.cjs","sources":["../../../src/chat-ui/thread/chat-composer-dock.tsx"],"sourcesContent":["import { ComposerPrimitive } from \"@assistant-ui/react\";\nimport type { ReactNode } from \"react\";\nimport {\n  COMPOSER_DOCK_CLASS,\n  COMPOSER_EDITOR_ROW_CLASS,\n  COMPOSER_PAPER_DOCK_CLASS,\n  COMPOSER_PAPER_EDITOR_ROW_CLASS,\n  COMPOSER_PAPER_SURFACE_CLASS,\n  COMPOSER_PAPER_TOOLBAR_CLASS,\n  COMPOSER_SURFACE_CLASS,\n  COMPOSER_TOOLBAR_CLASS,\n} from \"../messages/message-components\";\n\n/**\n * Which chrome the dock renders when a host supplies no class names of its\n * own. `default` is the side-panel / task-pane card (Chrome extension, Office\n * add-in); `paper` is the SDK thread's card-toned surface with the larger\n * radius, focus ring and drag-over tint.\n */\nexport type ChatComposerAppearance = \"default\" | \"paper\";\n\ninterface ComposerChrome {\n  dock: string;\n  surface: string;\n  editorRow: string;\n  toolbar: string;\n}\n\nconst CHROME: Record<ChatComposerAppearance, ComposerChrome> = {\n  default: {\n    dock: COMPOSER_DOCK_CLASS,\n    surface: COMPOSER_SURFACE_CLASS,\n    editorRow: COMPOSER_EDITOR_ROW_CLASS,\n    toolbar: COMPOSER_TOOLBAR_CLASS,\n  },\n  paper: {\n    dock: COMPOSER_PAPER_DOCK_CLASS,\n    surface: COMPOSER_PAPER_SURFACE_CLASS,\n    editorRow: COMPOSER_PAPER_EDITOR_ROW_CLASS,\n    toolbar: COMPOSER_PAPER_TOOLBAR_CLASS,\n  },\n};\n\nexport interface ChatComposerDockProps {\n  /**\n   * The chrome set used for every class a host leaves unset. Defaults to\n   * `default`, so existing hosts render exactly what they rendered before.\n   */\n  appearance?: ChatComposerAppearance;\n  /**\n   * Replaces the dock chrome (padding + background around the surface).\n   * Hosts with their own composer chrome system (AthenaChat's `aui-*`\n   * classes) pass their chrome here; the scaffolding structure stays shared.\n   */\n  className?: string;\n  /** Replaces the bordered composer-surface chrome. */\n  surfaceClassName?: string;\n  /** Replaces the editor-row chrome. */\n  editorRowClassName?: string;\n  /** Replaces the toolbar-row chrome. */\n  toolbarClassName?: string;\n  /**\n   * Files are being dragged over the composer: sets `data-drag-active=\"true\"`\n   * on the surface, which the paper chrome tints. The host's drop zone owns\n   * the drag state (`ComposerDropZone onDragActiveChange`).\n   */\n  dragActive?: boolean;\n  /** Rendered inside the dock, above the composer surface (error banners). */\n  aboveSurface?: ReactNode;\n  /**\n   * Rendered inside the surface above the editor row: context chips,\n   * restore notices, attachment strips.\n   */\n  beforeEditor?: ReactNode;\n  /** The editor element (a TiptapComposer, typically ref-held by the host). */\n  editor: ReactNode;\n  /** Toolbar contents before the spacer (attach buttons, pickers). */\n  toolbarStart?: ReactNode;\n  /** Toolbar contents after the spacer (voice and send/stop controls). */\n  toolbarEnd: ReactNode;\n  /** Rendered inside the dock, under the composer surface (keyboard hints). */\n  belowSurface?: ReactNode;\n}\n\n/**\n * The shared composer scaffolding: dock padding, the bordered surface, the\n * editor row, and the toolbar with its start/end slots around a flexible\n * spacer. Hosts supply the editor element and toolbar controls.\n */\nexport function ChatComposerDock({\n  appearance = \"default\",\n  className,\n  surfaceClassName,\n  editorRowClassName,\n  toolbarClassName,\n  dragActive = false,\n  aboveSurface,\n  beforeEditor,\n  editor,\n  toolbarStart,\n  toolbarEnd,\n  belowSurface,\n}: ChatComposerDockProps) {\n  const chrome = CHROME[appearance];\n  return (\n    <div className={className ?? chrome.dock}>\n      {aboveSurface}\n      <ComposerPrimitive.Root\n        className={surfaceClassName ?? chrome.surface}\n        // Only the paper chrome is keyed off these attributes; the default\n        // chrome's DOM stays byte-for-byte what its hosts snapshot.\n        data-appearance={appearance === \"paper\" ? \"paper\" : undefined}\n        data-drag-active={dragActive ? \"true\" : undefined}\n      >\n        {beforeEditor}\n        <div className={editorRowClassName ?? chrome.editorRow}>\n          {editor}\n        </div>\n        <div className={toolbarClassName ?? chrome.toolbar}>\n          {toolbarStart}\n          <div className=\"flex-1\" />\n          {toolbarEnd}\n        </div>\n      </ComposerPrimitive.Root>\n      {belowSurface}\n    </div>\n  );\n}\n"],"names":["COMPOSER_DOCK_CLASS","COMPOSER_SURFACE_CLASS","COMPOSER_EDITOR_ROW_CLASS","COMPOSER_TOOLBAR_CLASS","COMPOSER_PAPER_DOCK_CLASS","COMPOSER_PAPER_SURFACE_CLASS","COMPOSER_PAPER_EDITOR_ROW_CLASS","COMPOSER_PAPER_TOOLBAR_CLASS","jsxs","ComposerPrimitive","jsx"],"mappings":";;;;;AA4BA,MAAM,SAAyD;AAAA,EAC7D,SAAS;AAAA,IACP,MAAMA,kBAAAA;AAAAA,IACN,SAASC,kBAAAA;AAAAA,IACT,WAAWC,kBAAAA;AAAAA,IACX,SAASC,kBAAAA;AAAAA,EAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAMC,kBAAAA;AAAAA,IACN,SAASC,kBAAAA;AAAAA,IACT,WAAWC,kBAAAA;AAAAA,IACX,SAASC,kBAAAA;AAAAA,EAAA;AAEb;AAgDO,SAAS,iBAAiB;AAAA,EAC/B,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,QAAM,SAAS,OAAO,UAAU;AAChC,SACEC,2BAAAA,KAAC,OAAA,EAAI,WAAW,aAAa,OAAO,MACjC,UAAA;AAAA,IAAA;AAAA,IACDA,2BAAAA;AAAAA,MAACC,MAAAA,kBAAkB;AAAA,MAAlB;AAAA,QACC,WAAW,oBAAoB,OAAO;AAAA,QAGtC,mBAAiB,eAAe,UAAU,UAAU;AAAA,QACpD,oBAAkB,aAAa,SAAS;AAAA,QAEvC,UAAA;AAAA,UAAA;AAAA,yCACA,OAAA,EAAI,WAAW,sBAAsB,OAAO,WAC1C,UAAA,QACH;AAAA,UACAD,2BAAAA,KAAC,OAAA,EAAI,WAAW,oBAAoB,OAAO,SACxC,UAAA;AAAA,YAAA;AAAA,YACDE,2BAAAA,IAAC,OAAA,EAAI,WAAU,SAAA,CAAS;AAAA,YACvB;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAED;AAAA,EAAA,GACH;AAEJ;;"}

package/dist/chat-ui/thread/chat-composer-dock.d.ts

@@ -1,5 +1,17 @@
 import type { ReactNode } from "react";
+/**
+ * Which chrome the dock renders when a host supplies no class names of its
+ * own. `default` is the side-panel / task-pane card (Chrome extension, Office
+ * add-in); `paper` is the SDK thread's card-toned surface with the larger
+ * radius, focus ring and drag-over tint.
+ */
+export type ChatComposerAppearance = "default" | "paper";
 export interface ChatComposerDockProps {
+    /**
+     * The chrome set used for every class a host leaves unset. Defaults to
+     * `default`, so existing hosts render exactly what they rendered before.
+     */
+    appearance?: ChatComposerAppearance;
     /**
      * Replaces the dock chrome (padding + background around the surface).
      * Hosts with their own composer chrome system (AthenaChat's `aui-*`
@@ -12,6 +24,12 @@ export interface ChatComposerDockProps {
     editorRowClassName?: string;
     /** Replaces the toolbar-row chrome. */
     toolbarClassName?: string;
+    /**
+     * Files are being dragged over the composer: sets `data-drag-active="true"`
+     * on the surface, which the paper chrome tints. The host's drop zone owns
+     * the drag state (`ComposerDropZone onDragActiveChange`).
+     */
+    dragActive?: boolean;
     /** Rendered inside the dock, above the composer surface (error banners). */
     aboveSurface?: ReactNode;
     /**
@@ -25,10 +43,12 @@ export interface ChatComposerDockProps {
     toolbarStart?: ReactNode;
     /** Toolbar contents after the spacer (voice and send/stop controls). */
     toolbarEnd: ReactNode;
+    /** Rendered inside the dock, under the composer surface (keyboard hints). */
+    belowSurface?: ReactNode;
 }
 /**
  * The shared composer scaffolding: dock padding, the bordered surface, the
  * editor row, and the toolbar with its start/end slots around a flexible
  * spacer. Hosts supply the editor element and toolbar controls.
  */
-export declare function ChatComposerDock({ className, surfaceClassName, editorRowClassName, toolbarClassName, aboveSurface, beforeEditor, editor, toolbarStart, toolbarEnd, }: ChatComposerDockProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatComposerDock({ appearance, className, surfaceClassName, editorRowClassName, toolbarClassName, dragActive, aboveSurface, beforeEditor, editor, toolbarStart, toolbarEnd, belowSurface, }: ChatComposerDockProps): import("react/jsx-runtime").JSX.Element;

package/dist/chat-ui/thread/chat-composer-dock.js

@@ -1,34 +1,55 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { ComposerPrimitive } from "@assistant-ui/react";
-import { COMPOSER_DOCK_CLASS, COMPOSER_SURFACE_CLASS, COMPOSER_EDITOR_ROW_CLASS, COMPOSER_TOOLBAR_CLASS } from "../messages/message-components.js";
+import { COMPOSER_PAPER_TOOLBAR_CLASS, COMPOSER_PAPER_EDITOR_ROW_CLASS, COMPOSER_PAPER_SURFACE_CLASS, COMPOSER_PAPER_DOCK_CLASS, COMPOSER_TOOLBAR_CLASS, COMPOSER_EDITOR_ROW_CLASS, COMPOSER_SURFACE_CLASS, COMPOSER_DOCK_CLASS } from "../messages/message-components.js";
+const CHROME = {
+  default: {
+    dock: COMPOSER_DOCK_CLASS,
+    surface: COMPOSER_SURFACE_CLASS,
+    editorRow: COMPOSER_EDITOR_ROW_CLASS,
+    toolbar: COMPOSER_TOOLBAR_CLASS
+  },
+  paper: {
+    dock: COMPOSER_PAPER_DOCK_CLASS,
+    surface: COMPOSER_PAPER_SURFACE_CLASS,
+    editorRow: COMPOSER_PAPER_EDITOR_ROW_CLASS,
+    toolbar: COMPOSER_PAPER_TOOLBAR_CLASS
+  }
+};
 function ChatComposerDock({
+  appearance = "default",
   className,
   surfaceClassName,
   editorRowClassName,
   toolbarClassName,
+  dragActive = false,
   aboveSurface,
   beforeEditor,
   editor,
   toolbarStart,
-  toolbarEnd
+  toolbarEnd,
+  belowSurface
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: className ?? COMPOSER_DOCK_CLASS, children: [
+  const chrome = CHROME[appearance];
+  return /* @__PURE__ */ jsxs("div", { className: className ?? chrome.dock, children: [
     aboveSurface,
     /* @__PURE__ */ jsxs(
       ComposerPrimitive.Root,
       {
-        className: surfaceClassName ?? COMPOSER_SURFACE_CLASS,
+        className: surfaceClassName ?? chrome.surface,
+        "data-appearance": appearance === "paper" ? "paper" : void 0,
+        "data-drag-active": dragActive ? "true" : void 0,
         children: [
           beforeEditor,
-          /* @__PURE__ */ jsx("div", { className: editorRowClassName ?? COMPOSER_EDITOR_ROW_CLASS, children: editor }),
-          /* @__PURE__ */ jsxs("div", { className: toolbarClassName ?? COMPOSER_TOOLBAR_CLASS, children: [
+          /* @__PURE__ */ jsx("div", { className: editorRowClassName ?? chrome.editorRow, children: editor }),
+          /* @__PURE__ */ jsxs("div", { className: toolbarClassName ?? chrome.toolbar, children: [
             toolbarStart,
             /* @__PURE__ */ jsx("div", { className: "flex-1" }),
             toolbarEnd
           ] })
         ]
       }
-    )
+    ),
+    belowSurface
   ] });
 }
 export {

package/dist/chat-ui/thread/chat-composer-dock.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat-composer-dock.js","sources":["../../../src/chat-ui/thread/chat-composer-dock.tsx"],"sourcesContent":["import { ComposerPrimitive } from \"@assistant-ui/react\";\nimport type { ReactNode } from \"react\";\nimport {\n  COMPOSER_DOCK_CLASS,\n  COMPOSER_EDITOR_ROW_CLASS,\n  COMPOSER_SURFACE_CLASS,\n  COMPOSER_TOOLBAR_CLASS,\n} from \"../messages/message-components\";\n\nexport interface ChatComposerDockProps {\n  /**\n   * Replaces the dock chrome (padding + background around the surface).\n   * Hosts with their own composer chrome system (AthenaChat's `aui-*`\n   * classes) pass their chrome here; the scaffolding structure stays shared.\n   */\n  className?: string;\n  /** Replaces the bordered composer-surface chrome. */\n  surfaceClassName?: string;\n  /** Replaces the editor-row chrome. */\n  editorRowClassName?: string;\n  /** Replaces the toolbar-row chrome. */\n  toolbarClassName?: string;\n  /** Rendered inside the dock, above the composer surface (error banners). */\n  aboveSurface?: ReactNode;\n  /**\n   * Rendered inside the surface above the editor row: context chips,\n   * restore notices, attachment strips.\n   */\n  beforeEditor?: ReactNode;\n  /** The editor element (a TiptapComposer, typically ref-held by the host). */\n  editor: ReactNode;\n  /** Toolbar contents before the spacer (attach buttons, pickers). */\n  toolbarStart?: ReactNode;\n  /** Toolbar contents after the spacer (voice and send/stop controls). */\n  toolbarEnd: ReactNode;\n}\n\n/**\n * The shared composer scaffolding: dock padding, the bordered surface, the\n * editor row, and the toolbar with its start/end slots around a flexible\n * spacer. Hosts supply the editor element and toolbar controls.\n */\nexport function ChatComposerDock({\n  className,\n  surfaceClassName,\n  editorRowClassName,\n  toolbarClassName,\n  aboveSurface,\n  beforeEditor,\n  editor,\n  toolbarStart,\n  toolbarEnd,\n}: ChatComposerDockProps) {\n  return (\n    <div className={className ?? COMPOSER_DOCK_CLASS}>\n      {aboveSurface}\n      <ComposerPrimitive.Root\n        className={surfaceClassName ?? COMPOSER_SURFACE_CLASS}\n      >\n        {beforeEditor}\n        <div className={editorRowClassName ?? COMPOSER_EDITOR_ROW_CLASS}>\n          {editor}\n        </div>\n        <div className={toolbarClassName ?? COMPOSER_TOOLBAR_CLASS}>\n          {toolbarStart}\n          <div className=\"flex-1\" />\n          {toolbarEnd}\n        </div>\n      </ComposerPrimitive.Root>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AA0CO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACE,qBAAC,OAAA,EAAI,WAAW,aAAa,qBAC1B,UAAA;AAAA,IAAA;AAAA,IACD;AAAA,MAAC,kBAAkB;AAAA,MAAlB;AAAA,QACC,WAAW,oBAAoB;AAAA,QAE9B,UAAA;AAAA,UAAA;AAAA,UACD,oBAAC,OAAA,EAAI,WAAW,sBAAsB,2BACnC,UAAA,QACH;AAAA,UACA,qBAAC,OAAA,EAAI,WAAW,oBAAoB,wBACjC,UAAA;AAAA,YAAA;AAAA,YACD,oBAAC,OAAA,EAAI,WAAU,SAAA,CAAS;AAAA,YACvB;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}
+{"version":3,"file":"chat-composer-dock.js","sources":["../../../src/chat-ui/thread/chat-composer-dock.tsx"],"sourcesContent":["import { ComposerPrimitive } from \"@assistant-ui/react\";\nimport type { ReactNode } from \"react\";\nimport {\n  COMPOSER_DOCK_CLASS,\n  COMPOSER_EDITOR_ROW_CLASS,\n  COMPOSER_PAPER_DOCK_CLASS,\n  COMPOSER_PAPER_EDITOR_ROW_CLASS,\n  COMPOSER_PAPER_SURFACE_CLASS,\n  COMPOSER_PAPER_TOOLBAR_CLASS,\n  COMPOSER_SURFACE_CLASS,\n  COMPOSER_TOOLBAR_CLASS,\n} from \"../messages/message-components\";\n\n/**\n * Which chrome the dock renders when a host supplies no class names of its\n * own. `default` is the side-panel / task-pane card (Chrome extension, Office\n * add-in); `paper` is the SDK thread's card-toned surface with the larger\n * radius, focus ring and drag-over tint.\n */\nexport type ChatComposerAppearance = \"default\" | \"paper\";\n\ninterface ComposerChrome {\n  dock: string;\n  surface: string;\n  editorRow: string;\n  toolbar: string;\n}\n\nconst CHROME: Record<ChatComposerAppearance, ComposerChrome> = {\n  default: {\n    dock: COMPOSER_DOCK_CLASS,\n    surface: COMPOSER_SURFACE_CLASS,\n    editorRow: COMPOSER_EDITOR_ROW_CLASS,\n    toolbar: COMPOSER_TOOLBAR_CLASS,\n  },\n  paper: {\n    dock: COMPOSER_PAPER_DOCK_CLASS,\n    surface: COMPOSER_PAPER_SURFACE_CLASS,\n    editorRow: COMPOSER_PAPER_EDITOR_ROW_CLASS,\n    toolbar: COMPOSER_PAPER_TOOLBAR_CLASS,\n  },\n};\n\nexport interface ChatComposerDockProps {\n  /**\n   * The chrome set used for every class a host leaves unset. Defaults to\n   * `default`, so existing hosts render exactly what they rendered before.\n   */\n  appearance?: ChatComposerAppearance;\n  /**\n   * Replaces the dock chrome (padding + background around the surface).\n   * Hosts with their own composer chrome system (AthenaChat's `aui-*`\n   * classes) pass their chrome here; the scaffolding structure stays shared.\n   */\n  className?: string;\n  /** Replaces the bordered composer-surface chrome. */\n  surfaceClassName?: string;\n  /** Replaces the editor-row chrome. */\n  editorRowClassName?: string;\n  /** Replaces the toolbar-row chrome. */\n  toolbarClassName?: string;\n  /**\n   * Files are being dragged over the composer: sets `data-drag-active=\"true\"`\n   * on the surface, which the paper chrome tints. The host's drop zone owns\n   * the drag state (`ComposerDropZone onDragActiveChange`).\n   */\n  dragActive?: boolean;\n  /** Rendered inside the dock, above the composer surface (error banners). */\n  aboveSurface?: ReactNode;\n  /**\n   * Rendered inside the surface above the editor row: context chips,\n   * restore notices, attachment strips.\n   */\n  beforeEditor?: ReactNode;\n  /** The editor element (a TiptapComposer, typically ref-held by the host). */\n  editor: ReactNode;\n  /** Toolbar contents before the spacer (attach buttons, pickers). */\n  toolbarStart?: ReactNode;\n  /** Toolbar contents after the spacer (voice and send/stop controls). */\n  toolbarEnd: ReactNode;\n  /** Rendered inside the dock, under the composer surface (keyboard hints). */\n  belowSurface?: ReactNode;\n}\n\n/**\n * The shared composer scaffolding: dock padding, the bordered surface, the\n * editor row, and the toolbar with its start/end slots around a flexible\n * spacer. Hosts supply the editor element and toolbar controls.\n */\nexport function ChatComposerDock({\n  appearance = \"default\",\n  className,\n  surfaceClassName,\n  editorRowClassName,\n  toolbarClassName,\n  dragActive = false,\n  aboveSurface,\n  beforeEditor,\n  editor,\n  toolbarStart,\n  toolbarEnd,\n  belowSurface,\n}: ChatComposerDockProps) {\n  const chrome = CHROME[appearance];\n  return (\n    <div className={className ?? chrome.dock}>\n      {aboveSurface}\n      <ComposerPrimitive.Root\n        className={surfaceClassName ?? chrome.surface}\n        // Only the paper chrome is keyed off these attributes; the default\n        // chrome's DOM stays byte-for-byte what its hosts snapshot.\n        data-appearance={appearance === \"paper\" ? \"paper\" : undefined}\n        data-drag-active={dragActive ? \"true\" : undefined}\n      >\n        {beforeEditor}\n        <div className={editorRowClassName ?? chrome.editorRow}>\n          {editor}\n        </div>\n        <div className={toolbarClassName ?? chrome.toolbar}>\n          {toolbarStart}\n          <div className=\"flex-1\" />\n          {toolbarEnd}\n        </div>\n      </ComposerPrimitive.Root>\n      {belowSurface}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AA4BA,MAAM,SAAyD;AAAA,EAC7D,SAAS;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,EAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,EAAA;AAEb;AAgDO,SAAS,iBAAiB;AAAA,EAC/B,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,QAAM,SAAS,OAAO,UAAU;AAChC,SACE,qBAAC,OAAA,EAAI,WAAW,aAAa,OAAO,MACjC,UAAA;AAAA,IAAA;AAAA,IACD;AAAA,MAAC,kBAAkB;AAAA,MAAlB;AAAA,QACC,WAAW,oBAAoB,OAAO;AAAA,QAGtC,mBAAiB,eAAe,UAAU,UAAU;AAAA,QACpD,oBAAkB,aAAa,SAAS;AAAA,QAEvC,UAAA;AAAA,UAAA;AAAA,8BACA,OAAA,EAAI,WAAW,sBAAsB,OAAO,WAC1C,UAAA,QACH;AAAA,UACA,qBAAC,OAAA,EAAI,WAAW,oBAAoB,OAAO,SACxC,UAAA;AAAA,YAAA;AAAA,YACD,oBAAC,OAAA,EAAI,WAAU,SAAA,CAAS;AAAA,YACvB;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAED;AAAA,EAAA,GACH;AAEJ;"}

package/dist/chat-ui/thread/statewire-history-edge.cjs

@@ -8,6 +8,7 @@ require("@assistant-ui/tap");
 require("statewire");
 const errors = require("../../packages/agent-runtime/src/errors.cjs");
 require("../../packages/agent-runtime/src/statewire-suspended.cjs");
+require("../../packages/agent-runtime/src/conversation-list.cjs");
 require("@tanstack/react-query");
 require("../../packages/agent-runtime/src/statewire-state.cjs");
 require("../../packages/agent-runtime/src/messages.cjs");
@@ -24,13 +25,14 @@ const cnfast = require("cnfast");
 const THREAD_VIEWPORT_ATTR = "data-aui-thread-viewport";
 const HISTORY_EDGE_NEAR_MARGIN_PX = 1500;
 const HistoryEdgeRow = ({
-  olderCount,
+  hasOlder,
+  canLoadOlder = hasOlder,
   loading,
   onLoadOlder,
   className,
   rowRef
 }) => {
-  if (olderCount <= 0) return null;
+  if (!hasOlder) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -40,20 +42,16 @@ const HistoryEdgeRow = ({
         "flex w-full max-w-(--thread-max-width) items-center justify-center py-1 text-xs text-muted-foreground",
         className
       ),
-      children: loading ? /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "thread-history-edge-loading", children: "Loading earlier messages…" }) : /* @__PURE__ */ jsxRuntime.jsxs(
+      children: loading ? /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "thread-history-edge-loading", children: "Loading earlier messages…" }) : canLoadOlder ? /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           type: "button",
           "data-testid": "thread-history-edge-load",
           onClick: onLoadOlder,
           className: "rounded-lg px-2.5 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
-          children: [
-            olderCount.toLocaleString(),
-            " earlier ",
-            olderCount === 1 ? "message" : "messages"
-          ]
+          children: "Load earlier messages"
         }
-      )
+      ) : /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "thread-history-edge-limit", children: "Earlier messages can't be loaded here" })
     }
   );
 };
@@ -70,7 +68,7 @@ const StatewireHistoryEdge = ({
   const [nearTopEpoch, setNearTopEpoch] = react$1.useState(0);
   const nearTopRef = react$1.useRef(false);
   const [rowEl, setRowEl] = react$1.useState(null);
-  const { olderCount, loading, loadOlder } = useDeepAgentWindowSync.useDeepAgentWindowSync({
+  const { hasOlder, canLoadOlder, loading, loadOlder } = useDeepAgentWindowSync.useDeepAgentWindowSync({
     messages,
     toolOutputs,
     nearTop,
@@ -82,7 +80,7 @@ const StatewireHistoryEdge = ({
     }
   });
   react$1.useEffect(() => {
-    if (!rowEl || olderCount <= 0 || typeof IntersectionObserver === "undefined") return;
+    if (!rowEl || !hasOlder || typeof IntersectionObserver === "undefined") return;
     const observer = new IntersectionObserver(
       (entries) => {
         for (const entry of entries) {
@@ -104,7 +102,7 @@ const StatewireHistoryEdge = ({
       nearTopRef.current = false;
       setNearTop(false);
     };
-  }, [rowEl, olderCount]);
+  }, [rowEl, hasOlder]);
   const shapeRef = react$1.useRef(
     null
   );
@@ -121,7 +119,8 @@ const StatewireHistoryEdge = ({
     HistoryEdgeRow,
     {
       rowRef: setRowEl,
-      olderCount,
+      hasOlder,
+      canLoadOlder,
       loading,
       onLoadOlder: loadOlder,
       className

package/dist/chat-ui/thread/statewire-history-edge.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"statewire-history-edge.cjs","sources":["../../../src/chat-ui/thread/statewire-history-edge.tsx"],"sourcesContent":["import { useAuiState } from \"@assistant-ui/react\";\nimport {\n  type DeepAgentHistoryLoadEvent,\n  type DeepAgentToolOutputStore,\n  isStatewireChannelTeardown,\n  useDeepAgentWindowSync,\n} from \"@athenaintel/agent-runtime\";\nimport type { FC } from \"react\";\nimport { useEffect, useLayoutEffect, useRef, useState } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { useStatewireToolOutputs } from \"../../provider/statewire-window-context\";\n\n/** The attribute `ChatThreadShell` stamps on the scroll viewport. */\nexport const THREAD_VIEWPORT_ATTR = \"data-aui-thread-viewport\";\n\n/**\n * How far above the viewport the edge row counts as near: the row sits above\n * the first loaded message, so reaching it means the user has scrolled past\n * everything loaded and the next page should already be on its way.\n */\nexport const HISTORY_EDGE_NEAR_MARGIN_PX = 1500;\n\nexport interface HistoryEdgeRowProps {\n  /** Messages older than the loaded window the server still holds. */\n  olderCount: number;\n  /** A page of older history is in flight. */\n  loading: boolean;\n  onLoadOlder: () => void;\n  className?: string;\n  /** The row element, for the viewport observer. */\n  rowRef?: (element: HTMLElement | null) => void;\n}\n\n/**\n * The top edge of the LOADED history on a windowed wire: how many older\n * messages the server still holds, a manual way to load the next page, and\n * the in-flight state. Renders nothing when the whole transcript is loaded\n * (or the wire is not windowed).\n */\nexport const HistoryEdgeRow: FC<HistoryEdgeRowProps> = ({\n  olderCount,\n  loading,\n  onLoadOlder,\n  className,\n  rowRef,\n}) => {\n  if (olderCount <= 0) return null;\n  return (\n    <div\n      ref={rowRef}\n      data-testid=\"thread-history-edge\"\n      className={cn(\n        \"flex w-full max-w-(--thread-max-width) items-center justify-center py-1 text-xs text-muted-foreground\",\n        className,\n      )}\n    >\n      {loading ? (\n        <span data-testid=\"thread-history-edge-loading\">Loading earlier messages…</span>\n      ) : (\n        <button\n          type=\"button\"\n          data-testid=\"thread-history-edge-load\"\n          onClick={onLoadOlder}\n          className=\"rounded-lg px-2.5 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground\"\n        >\n          {olderCount.toLocaleString()} earlier {olderCount === 1 ? \"message\" : \"messages\"}\n        </button>\n      )}\n    </div>\n  );\n};\n\nexport interface StatewireHistoryEdgeProps {\n  /**\n   * The thread's tool-output store (the one its converter substitutes from).\n   * Defaults to `AthenaProvider`'s; hosts mounting the runtime themselves pass\n   * the store they gave `useDeepAgentRuntime({ toolOutputs })`.\n   */\n  toolOutputs?: DeepAgentToolOutputStore;\n  className?: string;\n  /** A `history/load` settled (telemetry). */\n  onHistoryLoad?: (event: DeepAgentHistoryLoadEvent) => void;\n}\n\n/**\n * The client half of the windowed wire for a DOM thread — mounted once per\n * thread, inside the scroll viewport above the messages (`ChatThreadShell`'s\n * `beforeMessages` slot):\n *\n * - renders the \"N earlier messages\" edge row and loads the next page when\n *   the row comes near the viewport (scrolling up) or on its button, keeping\n *   the reading position when the page lands above the view;\n * - fetches cut tool outputs whole for the rendered cards, so they re-render\n *   complete through the converter (`toolOutputs`).\n *\n * Inert on a wire that is not windowed: no row, no reads.\n */\nexport const StatewireHistoryEdge: FC<StatewireHistoryEdgeProps> = ({\n  toolOutputs: toolOutputsProp,\n  className,\n  onHistoryLoad,\n}) => {\n  const providerToolOutputs = useStatewireToolOutputs();\n  const toolOutputs = toolOutputsProp ?? providerToolOutputs ?? undefined;\n  const messages = useAuiState((s) => s.thread.messages);\n  const [nearTop, setNearTop] = useState(false);\n  const [nearTopEpoch, setNearTopEpoch] = useState(0);\n  const nearTopRef = useRef(false);\n  const [rowEl, setRowEl] = useState<HTMLElement | null>(null);\n  const { olderCount, loading, loadOlder } = useDeepAgentWindowSync({\n    messages,\n    toolOutputs,\n    nearTop,\n    nearTopEpoch,\n    onHistoryLoad,\n    onError: (error, command) => {\n      // Leaving the thread settles an in-flight read as lost: lifecycle, not a failure.\n      if (error instanceof Error && isStatewireChannelTeardown(error)) return;\n      console.warn(`[StatewireHistoryEdge] ${command} failed:`, error);\n    },\n  });\n\n  // The row's own visibility is the near-top level: a level, not an edge, so\n  // pages chain while the user stays at the top and stop once the prepended\n  // content has pushed the row away again.\n  useEffect(() => {\n    if (!rowEl || olderCount <= 0 || typeof IntersectionObserver === \"undefined\") return;\n    const observer = new IntersectionObserver(\n      (entries) => {\n        for (const entry of entries) {\n          const near = entry.isIntersecting;\n          if (nearTopRef.current === near) continue;\n          nearTopRef.current = near;\n          setNearTop(near);\n          if (near) setNearTopEpoch((epoch) => epoch + 1);\n        }\n      },\n      {\n        root: rowEl.closest<HTMLElement>(`[${THREAD_VIEWPORT_ATTR}]`),\n        rootMargin: `${HISTORY_EDGE_NEAR_MARGIN_PX}px 0px`,\n      },\n    );\n    observer.observe(rowEl);\n    return () => {\n      observer.disconnect();\n      nearTopRef.current = false;\n      setNearTop(false);\n    };\n  }, [rowEl, olderCount]);\n\n  // A prepend (older history landing) keeps the reading position: the\n  // viewport scrolls by the height the page added above the view, so the\n  // message the user was on stays put. The pre-prepend height is measured\n  // only while a page is in flight (a layout read per render would force a\n  // reflow on every streamed token otherwise).\n  const shapeRef = useRef<{ firstId: string | undefined; length: number; scrollHeight: number } | null>(\n    null,\n  );\n  const firstId = messages[0]?.id;\n  const length = messages.length;\n  useLayoutEffect(() => {\n    const viewport = rowEl?.closest<HTMLElement>(`[${THREAD_VIEWPORT_ATTR}]`) ?? null;\n    const prev = shapeRef.current;\n    const prepended =\n      viewport !== null &&\n      prev !== null &&\n      prev.firstId !== undefined &&\n      firstId !== prev.firstId &&\n      length > prev.length;\n    if (prepended) viewport.scrollTop += viewport.scrollHeight - prev.scrollHeight;\n    shapeRef.current =\n      loading || prepended || prev === null\n        ? { firstId, length, scrollHeight: viewport?.scrollHeight ?? 0 }\n        : { firstId, length, scrollHeight: prev.scrollHeight };\n  });\n\n  return (\n    <HistoryEdgeRow\n      rowRef={setRowEl}\n      olderCount={olderCount}\n      loading={loading}\n      onLoadOlder={loadOlder}\n      className={className}\n    />\n  );\n};\n"],"names":["jsx","cn","jsxs","useStatewireToolOutputs","useAuiState","useState","useRef","useDeepAgentWindowSync","isStatewireChannelTeardown","useEffect","useLayoutEffect"],"mappings":"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"}
+{"version":3,"file":"statewire-history-edge.cjs","sources":["../../../src/chat-ui/thread/statewire-history-edge.tsx"],"sourcesContent":["import { useAuiState } from \"@assistant-ui/react\";\nimport {\n  type DeepAgentHistoryLoadEvent,\n  type DeepAgentToolOutputStore,\n  isStatewireChannelTeardown,\n  useDeepAgentWindowSync,\n} from \"@athenaintel/agent-runtime\";\nimport type { FC } from \"react\";\nimport { useEffect, useLayoutEffect, useRef, useState } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { useStatewireToolOutputs } from \"../../provider/statewire-window-context\";\n\n/** The attribute `ChatThreadShell` stamps on the scroll viewport. */\nexport const THREAD_VIEWPORT_ATTR = \"data-aui-thread-viewport\";\n\n/**\n * How far above the viewport the edge row counts as near: the row sits above\n * the first loaded message, so reaching it means the user has scrolled past\n * everything loaded and the next page should already be on its way.\n */\nexport const HISTORY_EDGE_NEAR_MARGIN_PX = 1500;\n\nexport interface HistoryEdgeRowProps {\n  /** Whether the server holds messages older than the loaded window. */\n  hasOlder: boolean;\n  /** Whether the next page can be asked for; `false` with `hasOlder` is the connection's loading depth spent. Defaults to `hasOlder`. */\n  canLoadOlder?: boolean;\n  /** A page of older history is in flight. */\n  loading: boolean;\n  onLoadOlder: () => void;\n  className?: string;\n  /** The row element, for the viewport observer. */\n  rowRef?: (element: HTMLElement | null) => void;\n}\n\n/**\n * The top edge of the LOADED history: a manual way to load the next page of\n * older messages, and the in-flight state. Renders nothing when the whole\n * transcript is loaded (or the head interest has not resolved).\n */\nexport const HistoryEdgeRow: FC<HistoryEdgeRowProps> = ({\n  hasOlder,\n  canLoadOlder = hasOlder,\n  loading,\n  onLoadOlder,\n  className,\n  rowRef,\n}) => {\n  if (!hasOlder) return null;\n  return (\n    <div\n      ref={rowRef}\n      data-testid=\"thread-history-edge\"\n      className={cn(\n        \"flex w-full max-w-(--thread-max-width) items-center justify-center py-1 text-xs text-muted-foreground\",\n        className,\n      )}\n    >\n      {loading ? (\n        <span data-testid=\"thread-history-edge-loading\">Loading earlier messages…</span>\n      ) : canLoadOlder ? (\n        <button\n          type=\"button\"\n          data-testid=\"thread-history-edge-load\"\n          onClick={onLoadOlder}\n          className=\"rounded-lg px-2.5 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground\"\n        >\n          Load earlier messages\n        </button>\n      ) : (\n        <span data-testid=\"thread-history-edge-limit\">Earlier messages can't be loaded here</span>\n      )}\n    </div>\n  );\n};\n\nexport interface StatewireHistoryEdgeProps {\n  /**\n   * The thread's tool-output store (the one its converter substitutes from).\n   * Defaults to `AthenaProvider`'s; hosts mounting the runtime themselves pass\n   * the store they gave `useDeepAgentRuntime({ toolOutputs })`.\n   */\n  toolOutputs?: DeepAgentToolOutputStore;\n  className?: string;\n  /** A page interest resolved (telemetry). */\n  onHistoryLoad?: (event: DeepAgentHistoryLoadEvent) => void;\n}\n\n/**\n * The client half of the interest window for a DOM thread — mounted once per\n * thread, inside the scroll viewport above the messages (`ChatThreadShell`'s\n * `beforeMessages` slot):\n *\n * - renders the \"Load earlier messages\" edge row and loads the next page when\n *   the row comes near the viewport (scrolling up) or on its button, keeping\n *   the reading position when the page lands above the view;\n * - fetches cut tool outputs whole for the rendered cards, so they re-render\n *   complete through the converter (`toolOutputs`).\n *\n * Inert until the head interest resolves: no row, no reads.\n */\nexport const StatewireHistoryEdge: FC<StatewireHistoryEdgeProps> = ({\n  toolOutputs: toolOutputsProp,\n  className,\n  onHistoryLoad,\n}) => {\n  const providerToolOutputs = useStatewireToolOutputs();\n  const toolOutputs = toolOutputsProp ?? providerToolOutputs ?? undefined;\n  const messages = useAuiState((s) => s.thread.messages);\n  const [nearTop, setNearTop] = useState(false);\n  const [nearTopEpoch, setNearTopEpoch] = useState(0);\n  const nearTopRef = useRef(false);\n  const [rowEl, setRowEl] = useState<HTMLElement | null>(null);\n  const { hasOlder, canLoadOlder, loading, loadOlder } = useDeepAgentWindowSync({\n    messages,\n    toolOutputs,\n    nearTop,\n    nearTopEpoch,\n    onHistoryLoad,\n    onError: (error, command) => {\n      // Leaving the thread settles an in-flight read as lost: lifecycle, not a failure.\n      if (error instanceof Error && isStatewireChannelTeardown(error)) return;\n      console.warn(`[StatewireHistoryEdge] ${command} failed:`, error);\n    },\n  });\n\n  // The row's own visibility is the near-top level: a level, not an edge, so\n  // pages chain while the user stays at the top and stop once the prepended\n  // content has pushed the row away again.\n  useEffect(() => {\n    if (!rowEl || !hasOlder || typeof IntersectionObserver === \"undefined\") return;\n    const observer = new IntersectionObserver(\n      (entries) => {\n        for (const entry of entries) {\n          const near = entry.isIntersecting;\n          if (nearTopRef.current === near) continue;\n          nearTopRef.current = near;\n          setNearTop(near);\n          if (near) setNearTopEpoch((epoch) => epoch + 1);\n        }\n      },\n      {\n        root: rowEl.closest<HTMLElement>(`[${THREAD_VIEWPORT_ATTR}]`),\n        rootMargin: `${HISTORY_EDGE_NEAR_MARGIN_PX}px 0px`,\n      },\n    );\n    observer.observe(rowEl);\n    return () => {\n      observer.disconnect();\n      nearTopRef.current = false;\n      setNearTop(false);\n    };\n  }, [rowEl, hasOlder]);\n\n  // A prepend (older history landing) keeps the reading position: the\n  // viewport scrolls by the height the page added above the view, so the\n  // message the user was on stays put. The pre-prepend height is measured\n  // only while a page is in flight (a layout read per render would force a\n  // reflow on every streamed token otherwise).\n  const shapeRef = useRef<{ firstId: string | undefined; length: number; scrollHeight: number } | null>(\n    null,\n  );\n  const firstId = messages[0]?.id;\n  const length = messages.length;\n  useLayoutEffect(() => {\n    const viewport = rowEl?.closest<HTMLElement>(`[${THREAD_VIEWPORT_ATTR}]`) ?? null;\n    const prev = shapeRef.current;\n    const prepended =\n      viewport !== null &&\n      prev !== null &&\n      prev.firstId !== undefined &&\n      firstId !== prev.firstId &&\n      length > prev.length;\n    if (prepended) viewport.scrollTop += viewport.scrollHeight - prev.scrollHeight;\n    shapeRef.current =\n      loading || prepended || prev === null\n        ? { firstId, length, scrollHeight: viewport?.scrollHeight ?? 0 }\n        : { firstId, length, scrollHeight: prev.scrollHeight };\n  });\n\n  return (\n    <HistoryEdgeRow\n      rowRef={setRowEl}\n      hasOlder={hasOlder}\n      canLoadOlder={canLoadOlder}\n      loading={loading}\n      onLoadOlder={loadOlder}\n      className={className}\n    />\n  );\n};\n"],"names":["jsx","cn","useStatewireToolOutputs","useAuiState","useState","useRef","useDeepAgentWindowSync","isStatewireChannelTeardown","useEffect","useLayoutEffect"],"mappings":"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"}

package/dist/chat-ui/thread/statewire-history-edge.d.ts

@@ -9,8 +9,10 @@ export declare const THREAD_VIEWPORT_ATTR = "data-aui-thread-viewport";
  */
 export declare const HISTORY_EDGE_NEAR_MARGIN_PX = 1500;
 export interface HistoryEdgeRowProps {
-    /** Messages older than the loaded window the server still holds. */
-    olderCount: number;
+    /** Whether the server holds messages older than the loaded window. */
+    hasOlder: boolean;
+    /** Whether the next page can be asked for; `false` with `hasOlder` is the connection's loading depth spent. Defaults to `hasOlder`. */
+    canLoadOlder?: boolean;
     /** A page of older history is in flight. */
     loading: boolean;
     onLoadOlder: () => void;
@@ -19,10 +21,9 @@ export interface HistoryEdgeRowProps {
     rowRef?: (element: HTMLElement | null) => void;
 }
 /**
- * The top edge of the LOADED history on a windowed wire: how many older
- * messages the server still holds, a manual way to load the next page, and
- * the in-flight state. Renders nothing when the whole transcript is loaded
- * (or the wire is not windowed).
+ * The top edge of the LOADED history: a manual way to load the next page of
+ * older messages, and the in-flight state. Renders nothing when the whole
+ * transcript is loaded (or the head interest has not resolved).
  */
 export declare const HistoryEdgeRow: FC<HistoryEdgeRowProps>;
 export interface StatewireHistoryEdgeProps {
@@ -33,20 +34,20 @@ export interface StatewireHistoryEdgeProps {
      */
     toolOutputs?: DeepAgentToolOutputStore;
     className?: string;
-    /** A `history/load` settled (telemetry). */
+    /** A page interest resolved (telemetry). */
     onHistoryLoad?: (event: DeepAgentHistoryLoadEvent) => void;
 }
 /**
- * The client half of the windowed wire for a DOM thread — mounted once per
+ * The client half of the interest window for a DOM thread — mounted once per
  * thread, inside the scroll viewport above the messages (`ChatThreadShell`'s
  * `beforeMessages` slot):
  *
- * - renders the "N earlier messages" edge row and loads the next page when
+ * - renders the "Load earlier messages" edge row and loads the next page when
  *   the row comes near the viewport (scrolling up) or on its button, keeping
  *   the reading position when the page lands above the view;
  * - fetches cut tool outputs whole for the rendered cards, so they re-render
  *   complete through the converter (`toolOutputs`).
  *
- * Inert on a wire that is not windowed: no row, no reads.
+ * Inert until the head interest resolves: no row, no reads.
  */
 export declare const StatewireHistoryEdge: FC<StatewireHistoryEdgeProps>;

package/dist/chat-ui/thread/statewire-history-edge.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { useAuiState } from "@assistant-ui/react";
 import "../../packages/agent-runtime/src/generated/runconfig-contract.js";
 import { useState, useRef, useEffect, useLayoutEffect } from "react";
@@ -6,6 +6,7 @@ import "@assistant-ui/tap";
 import "statewire";
 import { isStatewireChannelTeardown } from "../../packages/agent-runtime/src/errors.js";
 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";
@@ -22,13 +23,14 @@ import { cn } from "cnfast";
 const THREAD_VIEWPORT_ATTR = "data-aui-thread-viewport";
 const HISTORY_EDGE_NEAR_MARGIN_PX = 1500;
 const HistoryEdgeRow = ({
-  olderCount,
+  hasOlder,
+  canLoadOlder = hasOlder,
   loading,
   onLoadOlder,
   className,
   rowRef
 }) => {
-  if (olderCount <= 0) return null;
+  if (!hasOlder) return null;
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -38,20 +40,16 @@ const HistoryEdgeRow = ({
         "flex w-full max-w-(--thread-max-width) items-center justify-center py-1 text-xs text-muted-foreground",
         className
       ),
-      children: loading ? /* @__PURE__ */ jsx("span", { "data-testid": "thread-history-edge-loading", children: "Loading earlier messages…" }) : /* @__PURE__ */ jsxs(
+      children: loading ? /* @__PURE__ */ jsx("span", { "data-testid": "thread-history-edge-loading", children: "Loading earlier messages…" }) : canLoadOlder ? /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
           "data-testid": "thread-history-edge-load",
           onClick: onLoadOlder,
           className: "rounded-lg px-2.5 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
-          children: [
-            olderCount.toLocaleString(),
-            " earlier ",
-            olderCount === 1 ? "message" : "messages"
-          ]
+          children: "Load earlier messages"
         }
-      )
+      ) : /* @__PURE__ */ jsx("span", { "data-testid": "thread-history-edge-limit", children: "Earlier messages can't be loaded here" })
     }
   );
 };
@@ -68,7 +66,7 @@ const StatewireHistoryEdge = ({
   const [nearTopEpoch, setNearTopEpoch] = useState(0);
   const nearTopRef = useRef(false);
   const [rowEl, setRowEl] = useState(null);
-  const { olderCount, loading, loadOlder } = useDeepAgentWindowSync({
+  const { hasOlder, canLoadOlder, loading, loadOlder } = useDeepAgentWindowSync({
     messages,
     toolOutputs,
     nearTop,
@@ -80,7 +78,7 @@ const StatewireHistoryEdge = ({
     }
   });
   useEffect(() => {
-    if (!rowEl || olderCount <= 0 || typeof IntersectionObserver === "undefined") return;
+    if (!rowEl || !hasOlder || typeof IntersectionObserver === "undefined") return;
     const observer = new IntersectionObserver(
       (entries) => {
         for (const entry of entries) {
@@ -102,7 +100,7 @@ const StatewireHistoryEdge = ({
       nearTopRef.current = false;
       setNearTop(false);
     };
-  }, [rowEl, olderCount]);
+  }, [rowEl, hasOlder]);
   const shapeRef = useRef(
     null
   );
@@ -119,7 +117,8 @@ const StatewireHistoryEdge = ({
     HistoryEdgeRow,
     {
       rowRef: setRowEl,
-      olderCount,
+      hasOlder,
+      canLoadOlder,
       loading,
       onLoadOlder: loadOlder,
       className