@adecore/agents-react 0.37.2 → 0.37.3

package/dist/chat/ui/rows/MessageRows.js

@@ -10,7 +10,10 @@ import { useChatScope } from '../../../scope.js';
 import { splitQuote } from '../../quote.js';
 import { jumpToTimelineItem } from '../../timeline-scroll.js';
 import { useProviders } from '../../../state/providers.js';
-import { ChatReferenceChip } from '../ChatReferenceChip.js';
+import { referenceTokens } from '../../chat-references.js';
+import { presentReferences } from '../../mentions.js';
+import { ReferenceChip } from '../ReferenceChip.js';
+import { ReferenceLookupContext } from '../reference-lookup.js';
 import { ImageThumb } from '../ImageView.js';
 import { Markdown, MessageMarkdown, ReplyMarkdown } from '../Markdown.js';
 import { FadingWords } from '../FadingWords.js';
@@ -26,6 +29,8 @@ import { useOpenForFind } from '../find-reveal.js';
 import { ReplyContext, UiReplyNavigationContext } from '../reply-context.js';
 import { UiReply } from '../intelligent-ui/UiReply.js';
 import { useHostAttachmentUrl, useHostChatPlace, useHostReplyAuthor, useHostStreaming } from '../../../host-hooks.js';
+import { copySelectionWithChips } from '../chip-clipboard.js';
+import { useReferenceLookup } from '../thread-references.js';
 // A long prompt folds so the answer stays in view; the reader can open it.
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const USER_FOLD_LINES = 8;
@@ -183,7 +188,7 @@ function AttachmentThumb(t0) {
   return t1;
 }
 export function UserRow(t0) {
-  const $ = _c(43);
+  const $ = _c(51);
   const {
     chatId,
     item
@@ -210,33 +215,43 @@ export function UserRow(t0) {
     t2 = $[3];
   }
   const attachments = t2;
-  let t3;
-  if ($[4] !== item.chats) {
-    t3 = item.chats ?? [];
-    $[4] = item.chats;
-    $[5] = t3;
-  } else {
-    t3 = $[5];
-  }
-  const chats = t3;
   const [missing, setMissing] = useState(false);
   const {
     keyOf
   } = useChatScope();
+  const lookup = useReferenceLookup(chatId);
+  let references;
+  let t3;
+  if ($[4] !== item.chats || $[5] !== item.references || $[6] !== item.text || $[7] !== lookup.items) {
+    const referenced = [...(item.chats ?? []), ...(item.references ?? [])];
+    references = referenceTokens(referenced, lookup.items);
+    const placed = presentReferences(item.text, referenced, references);
+    t3 = referenced.filter(id => !placed.includes(id));
+    $[4] = item.chats;
+    $[5] = item.references;
+    $[6] = item.text;
+    $[7] = lookup.items;
+    $[8] = references;
+    $[9] = t3;
+  } else {
+    references = $[8];
+    t3 = $[9];
+  }
+  const beside = t3;
   useOpenForFind(item.id, "text", setOpen);
   let t4;
-  if ($[6] !== item.quoteSource || $[7] !== item.text) {
+  if ($[10] !== item.quoteSource || $[11] !== item.text) {
     t4 = item.quoteSource === undefined ? null : splitQuote(item.text);
-    $[6] = item.quoteSource;
-    $[7] = item.text;
-    $[8] = t4;
+    $[10] = item.quoteSource;
+    $[11] = item.text;
+    $[12] = t4;
   } else {
-    t4 = $[8];
+    t4 = $[12];
   }
   const quoted = t4;
   const source = item.quoteSource?.itemId;
   let t5;
-  if ($[9] !== chatId || $[10] !== keyOf || $[11] !== source) {
+  if ($[13] !== chatId || $[14] !== keyOf || $[15] !== source) {
     t5 = function goToSource() {
       if (source !== undefined) {
         setMissing(false);
@@ -246,35 +261,35 @@ export function UserRow(t0) {
         });
       }
     };
-    $[9] = chatId;
-    $[10] = keyOf;
-    $[11] = source;
-    $[12] = t5;
+    $[13] = chatId;
+    $[14] = keyOf;
+    $[15] = source;
+    $[16] = t5;
   } else {
-    t5 = $[12];
+    t5 = $[16];
   }
   const goToSource = t5;
   const t6 = item.id;
   let t7;
-  if ($[13] !== t) {
+  if ($[17] !== t) {
     t7 = t("rows.user.heading");
-    $[13] = t;
-    $[14] = t7;
+    $[17] = t;
+    $[18] = t7;
   } else {
-    t7 = $[14];
+    t7 = $[18];
   }
   let t8;
-  if ($[15] !== t7) {
+  if ($[19] !== t7) {
     t8 = /*#__PURE__*/_jsx(MessageHeading, {
       children: t7
     });
-    $[15] = t7;
-    $[16] = t8;
+    $[19] = t7;
+    $[20] = t8;
   } else {
-    t8 = $[16];
+    t8 = $[20];
   }
   let t9;
-  if ($[17] !== attachments || $[18] !== chatId) {
+  if ($[21] !== attachments || $[22] !== chatId) {
     t9 = attachments.length > 0 && /*#__PURE__*/_jsx("div", {
       className: "mb-1.5 flex max-w-[80%] flex-wrap justify-end gap-1.5",
       children: attachments.map(attachment => isImageAttachment(attachment.mime) ? /*#__PURE__*/_jsx(AttachmentThumb, {
@@ -285,37 +300,37 @@ export function UserRow(t0) {
         attachment: attachment
       }, attachment.id))
     });
-    $[17] = attachments;
-    $[18] = chatId;
-    $[19] = t9;
+    $[21] = attachments;
+    $[22] = chatId;
+    $[23] = t9;
   } else {
-    t9 = $[19];
+    t9 = $[23];
   }
   let t10;
-  if ($[20] !== chats) {
-    t10 = chats.length > 0 && /*#__PURE__*/_jsx("div", {
+  if ($[24] !== beside) {
+    t10 = beside.length > 0 && /*#__PURE__*/_jsx("div", {
       className: "mb-1.5 flex max-w-[80%] flex-wrap justify-end gap-1.5",
-      children: chats.map(_temp)
+      children: beside.map(_temp2)
     });
-    $[20] = chats;
-    $[21] = t10;
+    $[24] = beside;
+    $[25] = t10;
   } else {
-    t10 = $[21];
+    t10 = $[25];
   }
   let t11;
-  if ($[22] !== chatId || $[23] !== item.uiChoice) {
+  if ($[26] !== chatId || $[27] !== item.uiChoice) {
     t11 = item.uiChoice !== undefined && /*#__PURE__*/_jsx(ChoiceLine, {
       chatId: chatId,
       choice: item.uiChoice
     });
-    $[22] = chatId;
-    $[23] = item.uiChoice;
-    $[24] = t11;
+    $[26] = chatId;
+    $[27] = item.uiChoice;
+    $[28] = t11;
   } else {
-    t11 = $[24];
+    t11 = $[28];
   }
   let t12;
-  if ($[25] !== goToSource || $[26] !== item.mentions || $[27] !== item.skills || $[28] !== item.text || $[29] !== long || $[30] !== missing || $[31] !== open || $[32] !== quoted || $[33] !== source || $[34] !== t) {
+  if ($[29] !== goToSource || $[30] !== item.mentions || $[31] !== item.skills || $[32] !== item.text || $[33] !== long || $[34] !== missing || $[35] !== open || $[36] !== quoted || $[37] !== references || $[38] !== source || $[39] !== t) {
     t12 = item.text !== "" && /*#__PURE__*/_jsxs("div", {
       className: "relative max-w-[80%] rounded-2xl bg-surface-active px-3.5 py-2.5 text-sm wrap-anywhere text-text select-text",
       children: [/*#__PURE__*/_jsx("div", {
@@ -329,9 +344,9 @@ export function UserRow(t0) {
               tabIndex: 0,
               className: "mb-2 cursor-pointer rounded-sm border-l-2 border-border-strong pl-2.5 text-text-muted hover:bg-text/5 hover:text-text focus-visible:outline-2 focus-visible:outline-accent",
               onClick: goToSource,
-              onKeyDown: e => {
-                if (e.key === "Enter" || e.key === " ") {
-                  e.preventDefault();
+              onKeyDown: e_0 => {
+                if (e_0.key === "Enter" || e_0.key === " ") {
+                  e_0.preventDefault();
                   goToSource();
                 }
               },
@@ -345,16 +360,18 @@ export function UserRow(t0) {
           }), quoted.rest !== "" && /*#__PURE__*/_jsx(MessageMarkdown, {
             text: quoted.rest,
             mentions: item.mentions,
-            skills: item.skills
+            skills: item.skills,
+            references: references
           })]
         }) : /*#__PURE__*/_jsx(MessageMarkdown, {
           text: item.text,
           mentions: item.mentions,
-          skills: item.skills
+          skills: item.skills,
+          references: references
         })
       }), long && /*#__PURE__*/_jsxs("button", {
         className: "mt-1 flex items-center gap-1 text-xs text-text-muted hover:text-text",
-        onClick: () => setOpen(_temp2),
+        onClick: () => setOpen(_temp3),
         children: [/*#__PURE__*/_jsx(Icon, {
           icon: ChevronDown,
           size: 12,
@@ -362,50 +379,67 @@ export function UserRow(t0) {
         }), " ", open ? t("rows.user.showLess") : t("rows.user.showAll")]
       })]
     });
-    $[25] = goToSource;
-    $[26] = item.mentions;
-    $[27] = item.skills;
-    $[28] = item.text;
-    $[29] = long;
-    $[30] = missing;
-    $[31] = open;
-    $[32] = quoted;
-    $[33] = source;
-    $[34] = t;
-    $[35] = t12;
-  } else {
-    t12 = $[35];
+    $[29] = goToSource;
+    $[30] = item.mentions;
+    $[31] = item.skills;
+    $[32] = item.text;
+    $[33] = long;
+    $[34] = missing;
+    $[35] = open;
+    $[36] = quoted;
+    $[37] = references;
+    $[38] = source;
+    $[39] = t;
+    $[40] = t12;
+  } else {
+    t12 = $[40];
   }
   let t13;
-  if ($[36] !== item.id || $[37] !== t10 || $[38] !== t11 || $[39] !== t12 || $[40] !== t8 || $[41] !== t9) {
+  if ($[41] !== item.id || $[42] !== t10 || $[43] !== t11 || $[44] !== t12 || $[45] !== t8 || $[46] !== t9) {
     t13 = /*#__PURE__*/_jsxs("div", {
       "data-find-item": t6,
       className: "flex flex-col items-end",
+      onCopy: _temp,
       children: [t8, t9, t10, t11, t12]
     });
-    $[36] = item.id;
-    $[37] = t10;
-    $[38] = t11;
-    $[39] = t12;
-    $[40] = t8;
-    $[41] = t9;
-    $[42] = t13;
+    $[41] = item.id;
+    $[42] = t10;
+    $[43] = t11;
+    $[44] = t12;
+    $[45] = t8;
+    $[46] = t9;
+    $[47] = t13;
+  } else {
+    t13 = $[47];
+  }
+  let t14;
+  if ($[48] !== lookup || $[49] !== t13) {
+    t14 = /*#__PURE__*/_jsx(ReferenceLookupContext, {
+      value: lookup,
+      children: t13
+    });
+    $[48] = lookup;
+    $[49] = t13;
+    $[50] = t14;
   } else {
-    t13 = $[42];
+    t14 = $[50];
   }
-  return t13;
+  return t14;
 }
 /*
  * The choice a message answers. The label stays out of the message, which holds exactly what the agent
  * read, and out of a copied selection; a screen reader hears it between the heading and the message.
  */
-function _temp2(o) {
+function _temp3(o) {
   return !o;
 }
-function _temp(id) {
-  return /*#__PURE__*/_jsx(ChatReferenceChip, {
-    chatId: id
-  }, id);
+function _temp2(id_0) {
+  return /*#__PURE__*/_jsx(ReferenceChip, {
+    id: id_0
+  }, id_0);
+}
+function _temp(e) {
+  return copySelectionWithChips(e.nativeEvent);
 }
 function ChoiceLine(t0) {
   const $ = _c(19);
@@ -610,7 +644,7 @@ function ReplyHeading(t0) {
   } = useTranslation("agent-chat");
   const context = useContext(ReplyContext);
   const author = useReplyAuthor(chatId);
-  const kind = useChatRow(chatId, _temp3);
+  const kind = useChatRow(chatId, _temp4);
   let t1;
   if ($[0] !== context?.provider || $[1] !== kind) {
     t1 = s => s.providers.find(provider => provider.kind === (context?.provider ?? kind))?.name;
@@ -647,7 +681,7 @@ function ReplyHeading(t0) {
  * The line over a reply with who wrote it and how long ago, when the host names its author. A screen
  * reader hears the name from the reply's own heading, so this line is for the eye only.
  */
-function _temp3(row) {
+function _temp4(row) {
   return row?.info.provider;
 }
 export function ReplyHeader(t0) {
@@ -755,15 +789,17 @@ function Writing() {
  * A reply. A word at a time, it follows the text as it arrives. A block at a time, the blocks that
  * closed are drawn and fade in as they land, with "Writing…" where the next one will stand. Whole,
  * it says it is being written and fades in once it is done. Only a row that saw the reply being
- * written fades anything: an old reply scrolled back into view just stands there.
+ * written fades anything: an old reply scrolled back into view just stands there. A `#Name` it
+ * spells for a view, node or chat of the project is a chip that opens it.
  */
 export function AssistantRow(t0) {
-  const $ = _c(63);
+  const $ = _c(67);
   const {
     chatId,
     item: derived
   } = t0;
   const item = useCurrentItem(chatId, derived);
+  const lookup = useReferenceLookup(chatId);
   const scope = useChatScope();
   const context = useContext(ReplyContext);
   let t1;
@@ -880,154 +916,178 @@ export function AssistantRow(t0) {
       t3 = $[29];
     }
     let t4;
-    if ($[30] !== reply || $[31] !== sawWriting || $[32] !== settled) {
+    if ($[30] !== lookup || $[31] !== reply || $[32] !== sawWriting || $[33] !== settled) {
       t4 = settled !== "" && /*#__PURE__*/_jsx("div", {
         "data-find-field": "text",
         "data-quote-answer": true,
         className: "contents",
-        children: /*#__PURE__*/_jsx(ReplyMarkdown, {
-          text: settled,
-          streaming: false,
-          arriving: sawWriting,
-          reply: reply
+        children: /*#__PURE__*/_jsx(ReferenceLookupContext, {
+          value: lookup,
+          children: /*#__PURE__*/_jsx(ReplyMarkdown, {
+            text: settled,
+            streaming: false,
+            arriving: sawWriting,
+            reply: reply
+          })
         })
       });
-      $[30] = reply;
-      $[31] = sawWriting;
-      $[32] = settled;
-      $[33] = t4;
+      $[30] = lookup;
+      $[31] = reply;
+      $[32] = sawWriting;
+      $[33] = settled;
+      $[34] = t4;
     } else {
-      t4 = $[33];
+      t4 = $[34];
     }
     let t5;
-    if ($[34] !== item.streaming) {
+    if ($[35] !== item.streaming) {
       t5 = item.streaming && /*#__PURE__*/_jsx(Writing, {});
-      $[34] = item.streaming;
-      $[35] = t5;
+      $[35] = item.streaming;
+      $[36] = t5;
     } else {
-      t5 = $[35];
+      t5 = $[36];
     }
     let t6;
-    if ($[36] !== item.id || $[37] !== t3 || $[38] !== t4 || $[39] !== t5) {
+    if ($[37] !== item.id || $[38] !== t3 || $[39] !== t4 || $[40] !== t5) {
       t6 = /*#__PURE__*/_jsxs("div", {
         "data-find-item": item.id,
         className: "-mx-1 px-1 pb-2",
+        onCopy: _temp5,
         children: [t3, t4, t5]
       });
-      $[36] = item.id;
-      $[37] = t3;
-      $[38] = t4;
-      $[39] = t5;
-      $[40] = t6;
+      $[37] = item.id;
+      $[38] = t3;
+      $[39] = t4;
+      $[40] = t5;
+      $[41] = t6;
     } else {
-      t6 = $[40];
+      t6 = $[41];
     }
     return t6;
   }
   if (mode === "whole" && item.streaming) {
     let t2;
-    if ($[41] !== chatId) {
+    if ($[42] !== chatId) {
       t2 = /*#__PURE__*/_jsx(ReplyHeading, {
         chatId: chatId
       });
-      $[41] = chatId;
-      $[42] = t2;
+      $[42] = chatId;
+      $[43] = t2;
     } else {
-      t2 = $[42];
+      t2 = $[43];
     }
     let t3;
-    if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
+    if ($[44] === Symbol.for("react.memo_cache_sentinel")) {
       t3 = /*#__PURE__*/_jsx(Writing, {});
-      $[43] = t3;
+      $[44] = t3;
     } else {
-      t3 = $[43];
+      t3 = $[44];
     }
     let t4;
-    if ($[44] !== t2) {
+    if ($[45] !== t2) {
       t4 = /*#__PURE__*/_jsxs("div", {
         className: "-mx-1 px-1 pb-2",
         children: [t2, t3]
       });
-      $[44] = t2;
-      $[45] = t4;
+      $[45] = t2;
+      $[46] = t4;
     } else {
-      t4 = $[45];
+      t4 = $[46];
     }
     return t4;
   }
   const t2 = item.id;
   const t3 = mode === "whole" && sawWriting && WHOLE_FADE_CLASS;
   let t4;
-  if ($[46] !== t3) {
+  if ($[47] !== t3) {
     t4 = clsx("-mx-1 px-1 pb-2", t3);
-    $[46] = t3;
-    $[47] = t4;
+    $[47] = t3;
+    $[48] = t4;
   } else {
-    t4 = $[47];
+    t4 = $[48];
   }
   let t5;
-  if ($[48] !== chatId) {
+  if ($[49] !== chatId) {
     t5 = /*#__PURE__*/_jsx(ReplyHeading, {
       chatId: chatId
     });
-    $[48] = chatId;
-    $[49] = t5;
+    $[49] = chatId;
+    $[50] = t5;
   } else {
-    t5 = $[49];
+    t5 = $[50];
   }
   let t6;
-  if ($[50] !== reply || $[51] !== reveal.active || $[52] !== reveal.text) {
-    t6 = /*#__PURE__*/_jsx("div", {
+  if ($[51] !== reply || $[52] !== reveal.active || $[53] !== reveal.text) {
+    t6 = /*#__PURE__*/_jsx(ReplyMarkdown, {
+      text: reveal.text,
+      streaming: reveal.active,
+      reply: reply
+    });
+    $[51] = reply;
+    $[52] = reveal.active;
+    $[53] = reveal.text;
+    $[54] = t6;
+  } else {
+    t6 = $[54];
+  }
+  let t7;
+  if ($[55] !== lookup || $[56] !== t6) {
+    t7 = /*#__PURE__*/_jsx("div", {
       "data-find-field": "text",
       "data-quote-answer": true,
       className: "contents",
-      children: /*#__PURE__*/_jsx(ReplyMarkdown, {
-        text: reveal.text,
-        streaming: reveal.active,
-        reply: reply
+      children: /*#__PURE__*/_jsx(ReferenceLookupContext, {
+        value: lookup,
+        children: t6
       })
     });
-    $[50] = reply;
-    $[51] = reveal.active;
-    $[52] = reveal.text;
-    $[53] = t6;
+    $[55] = lookup;
+    $[56] = t6;
+    $[57] = t7;
   } else {
-    t6 = $[53];
+    t7 = $[57];
   }
-  let t7;
-  if ($[54] !== item.text || $[55] !== live) {
-    t7 = live && item.text === "" && /*#__PURE__*/_jsx("span", {
+  let t8;
+  if ($[58] !== item.text || $[59] !== live) {
+    t8 = live && item.text === "" && /*#__PURE__*/_jsx("span", {
       className: "inline-block h-3.5 w-1.5 animate-pulse rounded-sm bg-text-faint align-middle"
     });
-    $[54] = item.text;
-    $[55] = live;
-    $[56] = t7;
+    $[58] = item.text;
+    $[59] = live;
+    $[60] = t8;
   } else {
-    t7 = $[56];
+    t8 = $[60];
   }
-  let t8;
-  if ($[57] !== item.id || $[58] !== t4 || $[59] !== t5 || $[60] !== t6 || $[61] !== t7) {
-    t8 = /*#__PURE__*/_jsxs("div", {
+  let t9;
+  if ($[61] !== item.id || $[62] !== t4 || $[63] !== t5 || $[64] !== t7 || $[65] !== t8) {
+    t9 = /*#__PURE__*/_jsxs("div", {
       "data-find-item": t2,
       className: t4,
-      children: [t5, t6, t7]
+      onCopy: _temp6,
+      children: [t5, t7, t8]
     });
-    $[57] = item.id;
-    $[58] = t4;
-    $[59] = t5;
-    $[60] = t6;
-    $[61] = t7;
-    $[62] = t8;
+    $[61] = item.id;
+    $[62] = t4;
+    $[63] = t5;
+    $[64] = t7;
+    $[65] = t8;
+    $[66] = t9;
   } else {
-    t8 = $[62];
+    t9 = $[66];
   }
-  return t8;
+  return t9;
 }
 /*
  * What the model thought before it answered. It shimmers while it streams and folds itself away
  * once the answer starts, because the thought is worth a glance and rarely worth reading twice:
  * folded, it shows the heading it opens with or itself on one line, and opened, it reads as Markdown.
  */
+function _temp6(e_0) {
+  return copySelectionWithChips(e_0.nativeEvent);
+}
+function _temp5(e) {
+  return copySelectionWithChips(e.nativeEvent);
+}
 export function ThinkingRow(t0) {
   const $ = _c(27);
   const {
@@ -1082,7 +1142,7 @@ export function ThinkingRow(t0) {
   const t6 = item.streaming ? undefined : open;
   let t7;
   if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-    t7 = () => setOpen(_temp4);
+    t7 = () => setOpen(_temp7);
     $[11] = t7;
   } else {
     t7 = $[11];
@@ -1188,7 +1248,7 @@ export function ThinkingRow(t0) {
  * The latest thought of a running turn over the call it led to, as its heading or first sentence,
  * so what the model found stays in view while it checks it. Nothing while the thought has no line yet.
  */
-function _temp4(o) {
+function _temp7(o) {
   return !o;
 }
 export function LiveThoughtRow(t0) {

package/dist/chat/ui/thread-references.d.ts

@@ -0,0 +1,4 @@
+import type { ChatItem } from '@adecore/agent-contracts';
+import type { ReferenceLookup } from './reference-lookup.js';
+export declare function threadReferencedKey(structure: Record<string, ChatItem> | undefined): string;
+export declare function useReferenceLookup(chatId: string): ReferenceLookup;