@adecore/agents-react 0.37.2 → 0.38.0

package/dist/chat/ui/composer/ComposerMenu.js

@@ -1,8 +1,9 @@
 import { c as _c } from "react/compiler-runtime";
 import { useTranslation } from 'react-i18next';
 import clsx from 'clsx';
-import { MessageSquare, SquareSlash, Zap } from 'lucide-react';
+import { SquareSlash, Zap } from 'lucide-react';
 import { FileIcon, Icon, Menu, MiddleTruncate } from '@adecore/ui';
+import { REFERENCE_ICONS } from '../reference-icons.js';
 import { optionIdOf } from './menu-aria.js';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function splitPath(path) {
@@ -205,7 +206,7 @@ function SkillMenu(t0) {
   return t4;
 }
 function MentionMenu(t0) {
-  const $ = _c(18);
+  const $ = _c(15);
   const {
     menus,
     query
@@ -215,118 +216,165 @@ function MentionMenu(t0) {
   } = useTranslation("agent-chat");
   const {
     listId,
-    chatMatches,
     files,
     mentionCount
   } = menus;
-  const mentionsLabelId = `${listId}-chats`;
   const filesLabelId = `${listId}-files`;
-  const filesLabelShown = query === "" || chatMatches.length > 0;
+  const filesLabelShown = query === "";
   let t1;
-  if ($[0] !== chatMatches || $[1] !== files || $[2] !== filesLabelId || $[3] !== filesLabelShown || $[4] !== listId || $[5] !== mentionCount || $[6] !== mentionsLabelId || $[7] !== menus || $[8] !== query || $[9] !== t) {
+  if ($[0] !== files || $[1] !== filesLabelId || $[2] !== filesLabelShown || $[3] !== listId || $[4] !== mentionCount || $[5] !== menus || $[6] !== t) {
     t1 = mentionCount > 0 && /*#__PURE__*/_jsxs("div", {
       id: listId,
       role: "listbox",
-      "aria-label": t("composer.menu.mentions"),
-      children: [chatMatches.length > 0 && /*#__PURE__*/_jsxs("div", {
-        role: "group",
-        "aria-labelledby": mentionsLabelId,
-        children: [/*#__PURE__*/_jsx(Menu.Label, {
-          id: mentionsLabelId,
-          children: t("composer.mentions.chats")
-        }), chatMatches.map((chat, index) => /*#__PURE__*/_jsxs(MenuOption, {
+      ...(filesLabelShown ? {
+        "aria-labelledby": filesLabelId
+      } : {
+        "aria-label": t("composer.mentions.files")
+      }),
+      children: [filesLabelShown && /*#__PURE__*/_jsx(Menu.Label, {
+        id: filesLabelId,
+        children: t("composer.mentions.here")
+      }), files.map((path, index) => {
+        const {
+          name,
+          dir
+        } = splitPath(path);
+        return /*#__PURE__*/_jsxs(MenuOption, {
           menus: menus,
           index: index,
           className: "items-center",
-          onPick: () => menus.chooseChat(chat.id),
-          children: [/*#__PURE__*/_jsx(Icon, {
-            icon: MessageSquare,
-            size: 14,
-            className: "shrink-0 text-text-faint"
+          onPick: () => menus.chooseMention(path),
+          children: [/*#__PURE__*/_jsx(FileIcon, {
+            path: path,
+            size: 14
           }), /*#__PURE__*/_jsx("span", {
-            className: "truncate text-text",
-            children: chat.title || t("chatReference.untitled")
+            className: "truncate font-mono text-text",
+            children: name
+          }), dir && /*#__PURE__*/_jsx(MiddleTruncate, {
+            text: dir,
+            tooltip: false,
+            className: "text-text-faint"
           })]
-        }, chat.id))]
-      }), files.length > 0 && /*#__PURE__*/_jsxs("div", {
-        role: "group",
-        ...(filesLabelShown ? {
-          "aria-labelledby": filesLabelId
-        } : {
-          "aria-label": t("composer.mentions.files")
-        }),
-        children: [filesLabelShown && /*#__PURE__*/_jsx(Menu.Label, {
-          id: filesLabelId,
-          children: query === "" ? t("composer.mentions.here") : t("composer.mentions.files")
-        }), files.map((path, index_0) => {
-          const {
-            name,
-            dir
-          } = splitPath(path);
-          return /*#__PURE__*/_jsxs(MenuOption, {
-            menus: menus,
-            index: chatMatches.length + index_0,
-            className: "items-center",
-            onPick: () => menus.chooseMention(path),
-            children: [/*#__PURE__*/_jsx(FileIcon, {
-              path: path,
-              size: 14
-            }), /*#__PURE__*/_jsx("span", {
-              className: "truncate font-mono text-text",
-              children: name
-            }), dir && /*#__PURE__*/_jsx(MiddleTruncate, {
-              text: dir,
-              tooltip: false,
-              className: "text-text-faint"
-            })]
-          }, path);
-        })]
+        }, path);
       })]
     });
-    $[0] = chatMatches;
-    $[1] = files;
-    $[2] = filesLabelId;
-    $[3] = filesLabelShown;
-    $[4] = listId;
-    $[5] = mentionCount;
-    $[6] = mentionsLabelId;
-    $[7] = menus;
-    $[8] = query;
-    $[9] = t;
-    $[10] = t1;
+    $[0] = files;
+    $[1] = filesLabelId;
+    $[2] = filesLabelShown;
+    $[3] = listId;
+    $[4] = mentionCount;
+    $[5] = menus;
+    $[6] = t;
+    $[7] = t1;
   } else {
-    t1 = $[10];
+    t1 = $[7];
   }
   let t2;
-  if ($[11] !== mentionCount || $[12] !== query || $[13] !== t) {
+  if ($[8] !== mentionCount || $[9] !== query || $[10] !== t) {
     t2 = mentionCount === 0 && /*#__PURE__*/_jsx("div", {
       className: "px-2 py-1 text-xs text-text-faint",
       children: query ? t("composer.mentions.noMatch") : t("composer.mentions.empty")
     });
-    $[11] = mentionCount;
-    $[12] = query;
-    $[13] = t;
-    $[14] = t2;
+    $[8] = mentionCount;
+    $[9] = query;
+    $[10] = t;
+    $[11] = t2;
   } else {
-    t2 = $[14];
+    t2 = $[11];
   }
   let t3;
-  if ($[15] !== t1 || $[16] !== t2) {
+  if ($[12] !== t1 || $[13] !== t2) {
     t3 = /*#__PURE__*/_jsxs("div", {
       className: "border-b border-border px-1.5 py-1.5",
       children: [t1, t2]
     });
-    $[15] = t1;
-    $[16] = t2;
-    $[17] = t3;
+    $[12] = t1;
+    $[13] = t2;
+    $[14] = t3;
   } else {
-    t3 = $[17];
+    t3 = $[14];
   }
   return t3;
 }
+/* The views, nodes and chats a `#` offers, what stands on this canvas first, each with its kind or what tells it apart. */
+function ReferenceMenu(t0) {
+  const $ = _c(5);
+  const {
+    menus
+  } = t0;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  const {
+    listId,
+    referenceMatches
+  } = menus;
+  let t1;
+  if ($[0] !== listId || $[1] !== menus || $[2] !== referenceMatches || $[3] !== t) {
+    const groups = ["canvas", "views"].map(group => ({
+      group,
+      items: referenceMatches.filter(item => item.group === group)
+    })).filter(_temp2);
+    t1 = /*#__PURE__*/_jsx("div", {
+      className: "border-b border-border px-1.5 py-1.5",
+      children: referenceMatches.length > 0 ? /*#__PURE__*/_jsx("div", {
+        id: listId,
+        role: "listbox",
+        "aria-label": t("composer.menu.references"),
+        children: groups.map(t2 => {
+          const {
+            group: group_0,
+            items
+          } = t2;
+          return /*#__PURE__*/_jsxs("div", {
+            role: "group",
+            "aria-labelledby": `${listId}-${group_0}`,
+            children: [/*#__PURE__*/_jsx(Menu.Label, {
+              id: `${listId}-${group_0}`,
+              children: t(`composer.references.${group_0}`)
+            }), items.map(item_0 => {
+              const index = referenceMatches.indexOf(item_0);
+              return /*#__PURE__*/_jsxs(MenuOption, {
+                menus: menus,
+                index: index,
+                className: "items-center",
+                onPick: () => menus.chooseReference(item_0),
+                children: [/*#__PURE__*/_jsx(Icon, {
+                  icon: REFERENCE_ICONS[item_0.kind],
+                  size: 14,
+                  className: "shrink-0 text-text-faint"
+                }), /*#__PURE__*/_jsx("span", {
+                  className: "truncate text-text",
+                  children: item_0.name
+                }), /*#__PURE__*/_jsx("span", {
+                  className: "ml-auto shrink-0 truncate pl-2 text-text-faint",
+                  children: item_0.detail ?? t(`composer.references.kinds.${item_0.kind}`)
+                })]
+              }, item_0.id);
+            })]
+          }, group_0);
+        })
+      }) : /*#__PURE__*/_jsx("div", {
+        className: "px-2 py-1 text-xs text-text-faint",
+        children: t("composer.references.noMatch")
+      })
+    });
+    $[0] = listId;
+    $[1] = menus;
+    $[2] = referenceMatches;
+    $[3] = t;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  return t1;
+}
 /* Whichever picker the caret opened, over the box. */
+function _temp2(entry) {
+  return entry.items.length > 0;
+}
 export function ComposerMenu(t0) {
-  const $ = _c(6);
+  const $ = _c(8);
   const {
     menus
   } = t0;
@@ -370,5 +418,18 @@ export function ComposerMenu(t0) {
     }
     return t1;
   }
+  if (menus.referenceMenuOpen) {
+    let t1;
+    if ($[6] !== menus) {
+      t1 = /*#__PURE__*/_jsx(ReferenceMenu, {
+        menus: menus
+      });
+      $[6] = menus;
+      $[7] = t1;
+    } else {
+      t1 = $[7];
+    }
+    return t1;
+  }
   return null;
 }

package/dist/chat/ui/composer/DraftParts.d.ts

@@ -7,10 +7,6 @@ interface DraftQuoteProps {
     onSourceGone(): void;
 }
 export declare function DraftQuote({ chatId, quote, source, onRemove, onSourceGone }: DraftQuoteProps): import("react").JSX.Element;
-export declare function DraftChats({ chats, onRemove }: {
-    chats: readonly string[];
-    onRemove(id: string): void;
-}): import("react").JSX.Element;
 export declare function DraftAttachments({ attachments, onRemove }: {
     attachments: readonly ChatAttachmentUpload[];
     onRemove(index: number): void;

package/dist/chat/ui/composer/DraftParts.js

@@ -5,7 +5,6 @@ import { Icon, IconButton, Tooltip } from '@adecore/ui';
 import { useChatScope } from '../../../scope.js';
 import { formatBytes, isImageAttachment, uploadBytes } from '../../attachments.js';
 import { jumpToTimelineItem } from '../../timeline-scroll.js';
-import { ChatReferenceChip } from '../ChatReferenceChip.js';
 import { UploadThumb } from '../UploadThumb.js';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const ROW = 'px-5 pt-4 @max-md/composer:px-3.5 @max-md/composer:pt-3';
@@ -86,46 +85,6 @@ export function DraftQuote(t0) {
   }
   return t4;
 }
-/* Other chats the message points at, beside the text rather than in it. */
-export function DraftChats(t0) {
-  const $ = _c(7);
-  const {
-    chats,
-    onRemove
-  } = t0;
-  let t1;
-  if ($[0] !== chats || $[1] !== onRemove) {
-    let t2;
-    if ($[3] !== onRemove) {
-      t2 = id => /*#__PURE__*/_jsx(ChatReferenceChip, {
-        chatId: id,
-        onRemove: () => onRemove(id)
-      }, id);
-      $[3] = onRemove;
-      $[4] = t2;
-    } else {
-      t2 = $[4];
-    }
-    t1 = chats.map(t2);
-    $[0] = chats;
-    $[1] = onRemove;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  let t2;
-  if ($[5] !== t1) {
-    t2 = /*#__PURE__*/_jsx("div", {
-      className: `flex flex-wrap gap-1.5 ${ROW}`,
-      children: t1
-    });
-    $[5] = t1;
-    $[6] = t2;
-  } else {
-    t2 = $[6];
-  }
-  return t2;
-}
 /* The files the message carries: an image as a thumbnail, anything else by its name and size. */
 export function DraftAttachments(t0) {
   const $ = _c(9);

package/dist/chat/ui/composer/chip-paste.d.ts

@@ -0,0 +1,15 @@
+import type { EditorView } from '@codemirror/view';
+import type { ChatDraft } from '../../drafts.js';
+import type { Referable } from '../../chat-references.js';
+import { type ClipboardChips, type ReferenceToken, type TextRange } from '../../mentions.js';
+export interface PasteChoices {
+    skills: readonly string[];
+    referables: readonly Referable[];
+    referenced: readonly string[];
+    mentions: boolean;
+}
+export declare function pastedChipsIn(text: string, from: number, to: number, code: readonly TextRange[], choices: PasteChoices): ClipboardChips;
+export declare function mayHoldChips(text: string): boolean;
+export declare function withPastedChips(draft: ChatDraft, chips: ClipboardChips, choices: PasteChoices): ChatDraft;
+export declare function pasteWithChips(view: EditorView, clip: string, copied: ClipboardChips | null, choices: PasteChoices): ClipboardChips | null;
+export declare function copyWithChipsFromEditor(event: ClipboardEvent, view: EditorView, draft: Pick<ChatDraft, 'mentions' | 'skills'>, references: readonly ReferenceToken[]): boolean;

package/dist/chat/ui/composer/chip-paste.js

@@ -0,0 +1,104 @@
+import { chipRanges, clipboardChipsOf, hasClipboardChips, namedReferenceRanges, tokenizeChips, writeClipboardChips } from '../../mentions.js';
+import { codeRanges } from './editor.js';
+/*
+ * The chips a plain paste spells between `from` and `to` of the text it landed in: `$name` for a skill
+ * there is, `#Name` by the reply rule. Code spans and code blocks keep what they hold.
+ */
+export function pastedChipsIn(text, from, to, code, choices) {
+  const outside = [...code, {
+    from: 0,
+    to: from
+  }, {
+    from: to,
+    to: text.length
+  }];
+  const skills = chipRanges(text, [], [...choices.skills], outside);
+  const references = namedReferenceRanges(text, choices.referables, choices.referenced, outside);
+  return clipboardChipsOf(text.slice(from, to), [...skills, ...references].map(range => range.kind === 'skill' ? {
+    kind: 'skill',
+    name: range.value
+  } : {
+    kind: 'reference',
+    id: range.value,
+    name: text.slice(range.from + 1, range.to)
+  }));
+}
+/* Whether a plain paste could make a chip at all, before it goes in as text. */
+export function mayHoldChips(text) {
+  return /(^|[\s([{"'“‘])[$#]\p{L}/u.test(text);
+}
+/* The draft with the chips of a paste added, a chat beside the views and nodes as the picker keeps it. */
+export function withPastedChips(draft, chips, choices) {
+  const add = (ids, more) => [...ids, ...more.filter((id, index) => !ids.includes(id) && more.indexOf(id) === index)];
+  const isChat = token => choices.referables.some(item => item.id === token.id && item.kind === 'chat');
+  const chats = chips.references.filter(isChat);
+  const references = chips.references.filter(token => !isChat(token));
+  return {
+    ...draft,
+    mentions: choices.mentions ? add(draft.mentions, chips.mentions) : draft.mentions,
+    skills: add(draft.skills, chips.skills),
+    chats: add(draft.chats, chats.map(token => token.id)),
+    references: add(draft.references, references.map(token => token.id)),
+    referenceNames: chips.references.length === 0 ? draft.referenceNames : {
+      ...draft.referenceNames,
+      ...Object.fromEntries(chips.references.map(token => [token.id, token.name]))
+    }
+  };
+}
+/*
+ * Puts a paste in the editor and says which chips it brings: the ones it was copied with, or the ones
+ * its plain text spells. Null when there are none, so the editor pastes it as it always does.
+ */
+export function pasteWithChips(view, clip, copied, choices) {
+  if (copied !== null && hasClipboardChips(copied)) {
+    view.dispatch(view.state.replaceSelection(copied.text), {
+      scrollIntoView: true,
+      userEvent: 'input.paste'
+    });
+    return copied;
+  }
+  if (!mayHoldChips(clip)) {
+    return null;
+  }
+  const from = view.state.selection.main.from;
+  const inserted = view.state.replaceSelection(clip);
+  const state = view.state.update(inserted).state;
+  const to = state.selection.main.head;
+  const found = pastedChipsIn(state.doc.toString(), from, to, codeRanges(state), choices);
+  if (!hasClipboardChips(found)) {
+    return null;
+  }
+  view.dispatch(inserted, {
+    scrollIntoView: true,
+    userEvent: 'input.paste'
+  });
+  return found;
+}
+/* A copy or a cut of a selection that holds chips, which carries them beside its text. False leaves it to the editor. */
+export function copyWithChipsFromEditor(event, view, draft, references) {
+  const {
+    from,
+    to
+  } = view.state.selection.main;
+  if (from === to || event.clipboardData === null) {
+    return false;
+  }
+  const text = view.state.sliceDoc(from, to);
+  const chips = clipboardChipsOf(text, tokenizeChips(text, draft.mentions, draft.skills, references));
+  if (!hasClipboardChips(chips)) {
+    return false;
+  }
+  writeClipboardChips(event.clipboardData, chips);
+  event.preventDefault();
+  if (event.type === 'cut') {
+    view.dispatch({
+      changes: {
+        from,
+        to
+      },
+      scrollIntoView: true,
+      userEvent: 'delete.cut'
+    });
+  }
+  return true;
+}

package/dist/chat/ui/composer/chips.d.ts

@@ -1,6 +1,11 @@
 import { type Extension } from '@codemirror/state';
+import type { ReferableKind } from '../../chat-references.js';
+import { type ReferenceToken } from '../../mentions.js';
 export interface ChipChoices {
     mentions: string[];
     skills: string[];
+    references?: ReadonlyArray<ReferenceToken & {
+        kind: ReferableKind | null;
+    }>;
 }
 export declare function chipDecorations(value: ChipChoices): Extension;

package/dist/chat/ui/composer/chips.js

@@ -1,8 +1,12 @@
+import { createElement } from 'react';
+import { createRoot } from 'react-dom/client';
 import { syntaxTree } from '@codemirror/language';
-import { Facet, RangeSetBuilder, StateField } from '@codemirror/state';
-import { Decoration, EditorView } from '@codemirror/view';
+import { Facet, StateField } from '@codemirror/state';
+import { Decoration, EditorView, WidgetType } from '@codemirror/view';
+import { Icon } from '@adecore/ui';
 import { chipRanges } from '../../mentions.js';
-import { CHIP_IN_EDITOR, MENTION_TONE, SKILL_TONE } from '../chips.js';
+import { CHIP_IN_EDITOR, MENTION_TONE, REFERENCE_TONE, SKILL_TONE, TOKEN_ICON_IN_EDITOR } from '../chips.js';
+import { REFERENCE_ICONS } from '../reference-icons.js';
 import { codeRanges } from './editor.js';
 const NO_CHOICES = {
   mentions: [],
@@ -17,17 +21,63 @@ const mentionMark = Decoration.mark({
 const skillMark = Decoration.mark({
   class: `${SKILL_TONE} ${CHIP_IN_EDITOR}`
 });
+// Inclusive at the start, so the pill opens before the mark of the kind that replaces its `#` and holds it.
+const referenceMark = Decoration.mark({
+  class: `${REFERENCE_TONE} ${CHIP_IN_EDITOR}`,
+  inclusiveStart: true
+});
+const roots = new WeakMap();
+/* The kind's mark in place of the `#`, the way a sent message draws it. */
+class ReferenceIcon extends WidgetType {
+  kind;
+  constructor(kind) {
+    super();
+    this.kind = kind;
+  }
+  eq(other) {
+    return other.kind === this.kind;
+  }
+  toDOM() {
+    const holder = document.createElement('span');
+    holder.className = TOKEN_ICON_IN_EDITOR;
+    const root = createRoot(holder);
+    root.render(createElement(Icon, {
+      icon: REFERENCE_ICONS[this.kind],
+      size: 12
+    }));
+    roots.set(holder, root);
+    return holder;
+  }
+  destroy(dom) {
+    const root = roots.get(dom);
+    roots.delete(dom);
+    // The editor drops a widget inside React's own commit, where a root may not unmount at once.
+    queueMicrotask(() => root?.unmount());
+  }
+}
 function chipMarks(state) {
   const {
     mentions,
-    skills
+    skills,
+    references = []
   } = state.facet(choices);
-  const builder = new RangeSetBuilder();
+  const kinds = new Map(references.map(token => [token.id, token.kind]));
+  const marks = [];
   // `@a.ts` in backticks is code, not a mention.
-  for (const range of chipRanges(state.doc.toString(), mentions, skills, codeRanges(state))) {
-    builder.add(range.from, range.to, range.kind === 'skill' ? skillMark : mentionMark);
+  for (const range of chipRanges(state.doc.toString(), mentions, skills, codeRanges(state), references)) {
+    if (range.kind !== 'reference') {
+      marks.push((range.kind === 'skill' ? skillMark : mentionMark).range(range.from, range.to));
+      continue;
+    }
+    marks.push(referenceMark.range(range.from, range.to));
+    const kind = kinds.get(range.value);
+    if (kind !== undefined && kind !== null) {
+      marks.push(Decoration.replace({
+        widget: new ReferenceIcon(kind)
+      }).range(range.from, range.from + 1));
+    }
   }
-  return builder.finish();
+  return Decoration.set(marks, true);
 }
 const chipField = StateField.define({
   create: chipMarks,
@@ -35,7 +85,7 @@ const chipField = StateField.define({
   update: (marks, tr) => tr.docChanged || tr.startState.facet(choices) !== tr.state.facet(choices) || syntaxTree(tr.startState) !== syntaxTree(tr.state) ? chipMarks(tr.state) : marks,
   provide: field => EditorView.decorations.from(field)
 });
-/* Draws the chosen `@path` and `$name` tokens as chips; a new `ChipChoices` object is what redraws them. */
+/* Draws the chosen `@path`, `$name` and `#name` tokens as chips; a new `ChipChoices` object is what redraws them. */
 export function chipDecorations(value) {
   return [choices.of(value), chipField];
 }

package/dist/chat/ui/composer/key-handler.js

@@ -76,6 +76,15 @@ function pickInMenu(e, {
       return true;
     }
   }
+  if (menus.referenceMenuOpen && menus.referenceMatches.length > 0) {
+    if (menus.moveInMenu(e.key, menus.referenceMatches.length)) {
+      return true;
+    }
+    if (e.key === 'Tab' || e.key === 'Enter') {
+      menus.chooseReferenceAt(activeIndex);
+      return true;
+    }
+  }
   return false;
 }
 /* Enter sends, adds a line, or carries a list on, by the send key and where the caret is. */

package/dist/chat/ui/composer/use-composer-draft.d.ts

@@ -8,7 +8,6 @@ export interface ComposerDraft {
     setText(next: string, mentions?: string[], skills?: string[]): void;
     clear(): void;
     removeQuote(): void;
-    removeChat(id: string): void;
     removeAttachment(index: number): void;
 }
 export declare function useComposerDraft(chatId: string, inputRef: RefObject<ComposerInputHandle | null>): ComposerDraft;

package/dist/chat/ui/composer/use-composer-draft.js

@@ -44,17 +44,10 @@ export function useComposerDraft(chatId, inputRef) {
     }));
     inputRef.current?.focus();
   };
-  const removeChat = id => {
+  const removeAttachment = index => {
     setDraft(current_3 => ({
       ...current_3,
-      chats: current_3.chats.filter(entry => entry !== id)
-    }));
-    inputRef.current?.focus();
-  };
-  const removeAttachment = index => {
-    setDraft(current_4 => ({
-      ...current_4,
-      attachments: current_4.attachments.filter((_, i) => i !== index)
+      attachments: current_3.attachments.filter((_, i) => i !== index)
     }));
   };
   return {
@@ -64,7 +57,6 @@ export function useComposerDraft(chatId, inputRef) {
     setText,
     clear,
     removeQuote,
-    removeChat,
     removeAttachment
   };
 }

package/dist/chat/ui/composer/use-composer-menus.d.ts

@@ -1,6 +1,7 @@
 import { type RefObject } from 'react';
 import type { EditorState } from '@codemirror/state';
 import type { ChatInfo, ProviderCapabilities } from '@adecore/agent-contracts';
+import { type Referable } from '../../chat-references.js';
 import { type MentionQuery, type TextRange } from '../../mentions.js';
 import type { ComposerInputHandle } from '../ComposerInput.js';
 import type { ComposerDraft } from './use-composer-draft.js';
@@ -24,6 +25,7 @@ export declare function useComposerMenus({ chatId, info, capabilities, providerN
     activeIndex: number;
     inputAria: Record<string, string>;
     hasSkills: boolean;
+    skillNames: string[];
     commandQuery: string | null;
     commands: ComposerCommand[];
     commandMenuOpen: boolean;
@@ -36,14 +38,22 @@ export declare function useComposerMenus({ chatId, info, capabilities, providerN
     mention: MentionQuery | null;
     mentionMenuOpen: boolean;
     mentionCount: number;
-    chatMatches: import("../../index.js").ProjectChat[];
     files: string[];
+    referenceMenuOpen: boolean;
+    referenceMatches: Referable[];
+    referables: import("../../index.js").Referables;
+    referenceChips: {
+        id: string;
+        name: string;
+        kind: import("../../index.js").ReferableKind | null;
+    }[];
     setMenuIndex: import("react").Dispatch<import("react").SetStateAction<number>>;
     trackTriggers: (value: string, selection: TextRange, state: EditorState) => void;
     close: () => void;
     chooseMention: (path: string) => void;
-    chooseChat: (id: string) => void;
     chooseMentionAt: (index: number) => void;
+    chooseReference: (item: Referable) => void;
+    chooseReferenceAt: (index: number) => void;
     chooseSkill: (name: string) => void;
     pickCommand: (command: ComposerCommand, index: number) => void;
     moveInMenu: (key: string, count: number) => boolean;