@adecore/agents-react 0.37.3 → 0.39.0

package/dist/chat/ui/composer/use-prompt-menus.js

@@ -0,0 +1,536 @@
+import { c as _c } from "react/compiler-runtime";
+import { useEffect, useId, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { ensureSyntaxTree, syntaxTree } from '@codemirror/language';
+import { useChatHost } from '../../../host.js';
+import { useChatScope } from '../../../scope.js';
+import { referenceSuggestions, referenceTokens } from '../../chat-references.js';
+import { usableSlashCommands } from '../../guards.js';
+import { chipRanges, findMentionQuery, findReferenceQuery, findSkillQuery, insertMention, insertReference, insertSkill, mentionPick, NO_MENTION_SEARCH, queryOutsideChips } from '../../mentions.js';
+import { inCode } from './keys.js';
+import { clampMenuIndex, composerMenuAria } from './menu-aria.js';
+const SEARCH_DEBOUNCE_MS = 80;
+// What fits above the box without turning the picker into a file tree.
+const MENTION_RESULTS = 8;
+const REFERENCE_RESULTS = 8;
+const NO_COMMANDS = [];
+function sameQuery(left, right) {
+  return left?.start === right?.start && left?.query === right?.query;
+}
+/*
+ * The pickers over a prompt: `/` for a command, `$` for a skill, `@` for a file and `#` for a view,
+ * a node or a chat. One is open at a time, and the arrow keys and the editor's ARIA attributes
+ * follow that one.
+ */
+export function usePromptMenus(t0) {
+  const $ = _c(103);
+  const {
+    draft: t1,
+    inputRef,
+    cwd,
+    skills,
+    slashCommands,
+    localCommands: t2,
+    goals,
+    providerName,
+    referables,
+    ownId,
+    label
+  } = t0;
+  const {
+    draft,
+    setDraft,
+    setText
+  } = t1;
+  const localCommands = t2 === undefined ? NO_COMMANDS : t2;
+  const {
+    t
+  } = useTranslation("agent-chat");
+  const scope = useChatScope();
+  const {
+    searchFiles
+  } = useChatHost();
+  const [menuIndex, setMenuIndex] = useState(0);
+  const [mention, setMention] = useState(null);
+  const [referenceQuery, setReferenceQuery] = useState(null);
+  const [skillQuery, setSkillQuery] = useState(null);
+  const [searched, setSearched] = useState(NO_MENTION_SEARCH);
+  const text = draft.text;
+  let t3;
+  let t4;
+  if ($[0] !== cwd || $[1] !== mention || $[2] !== scope || $[3] !== searchFiles) {
+    t3 = () => {
+      if (mention === null || cwd === null) {
+        return;
+      }
+      let stale = false;
+      const search = () => {
+        if (searchFiles === null) {
+          return;
+        }
+        searchFiles(scope.id, cwd, mention.query, MENTION_RESULTS).then(files => {
+          if (!stale) {
+            setSearched({
+              query: mention.query,
+              files
+            });
+            setMenuIndex(0);
+          }
+        }).catch(_temp);
+      };
+      if (mention.query === "") {
+        search();
+        return () => {
+          stale = true;
+        };
+      }
+      const timer = setTimeout(search, SEARCH_DEBOUNCE_MS);
+      return () => {
+        stale = true;
+        clearTimeout(timer);
+      };
+    };
+    t4 = [scope, cwd, mention, searchFiles];
+    $[0] = cwd;
+    $[1] = mention;
+    $[2] = scope;
+    $[3] = searchFiles;
+    $[4] = t3;
+    $[5] = t4;
+  } else {
+    t3 = $[4];
+    t4 = $[5];
+  }
+  useEffect(t3, t4);
+  let t5;
+  if ($[6] !== text) {
+    t5 = text.startsWith("/") && !text.includes("\n") ? text.slice(1).trim().toLowerCase() : null;
+    $[6] = text;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  const commandQuery = t5;
+  let t6;
+  bb0: {
+    if (commandQuery === null) {
+      let t7;
+      if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+        t7 = [];
+        $[8] = t7;
+      } else {
+        t7 = $[8];
+      }
+      t6 = t7;
+      break bb0;
+    }
+    let t7;
+    if ($[9] !== skills) {
+      t7 = new Set(skills.map(_temp2));
+      $[9] = skills;
+      $[10] = t7;
+    } else {
+      t7 = $[10];
+    }
+    const known = t7;
+    let t8;
+    if ($[11] !== commandQuery || $[12] !== goals || $[13] !== known || $[14] !== localCommands || $[15] !== providerName || $[16] !== slashCommands || $[17] !== t) {
+      const own = localCommands.map(name => ({
+        name,
+        hint: t(`composer.commands.${name}`),
+        local: true,
+        skill: false
+      }));
+      const goal = goals ? [{
+        name: "goal",
+        hint: t("composer.commands.goal"),
+        local: false,
+        skill: false
+      }] : [];
+      const cli = usableSlashCommands([...slashCommands]).filter(name_0 => !localCommands.includes(name_0) && (!goals || name_0 !== "goal")).map(name_1 => ({
+        name: name_1,
+        hint: known.has(name_1) ? t("composer.commands.skill") : t("composer.commands.cli", {
+          cli: providerName ?? t("composer.commands.anyCli")
+        }),
+        local: false,
+        skill: known.has(name_1)
+      }));
+      t8 = [...own, ...goal, ...cli].filter(command => command.name.startsWith(commandQuery)).slice(0, 8);
+      $[11] = commandQuery;
+      $[12] = goals;
+      $[13] = known;
+      $[14] = localCommands;
+      $[15] = providerName;
+      $[16] = slashCommands;
+      $[17] = t;
+      $[18] = t8;
+    } else {
+      t8 = $[18];
+    }
+    t6 = t8;
+  }
+  const commands = t6;
+  let t7;
+  bb1: {
+    if (skillQuery === null) {
+      let t8;
+      if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+        t8 = [];
+        $[19] = t8;
+      } else {
+        t8 = $[19];
+      }
+      t7 = t8;
+      break bb1;
+    }
+    let t8;
+    if ($[20] !== skillQuery.query || $[21] !== skills) {
+      const query = skillQuery.query.toLowerCase();
+      t8 = skills.filter(skill_0 => skill_0.name.toLowerCase().includes(query)).slice(0, 8);
+      $[20] = skillQuery.query;
+      $[21] = skills;
+      $[22] = t8;
+    } else {
+      t8 = $[22];
+    }
+    t7 = t8;
+  }
+  const skillMatches = t7;
+  const commandMenuOpen = commandQuery !== null && commands.length > 0;
+  const skillMenuOpen = !commandMenuOpen && skillQuery !== null && skillMatches.length > 0;
+  const mentionMenuOpen = !commandMenuOpen && !skillMenuOpen && mention !== null;
+  const files_0 = mention === null ? [] : searched.files;
+  const mentionCount = files_0.length;
+  let t8;
+  if ($[23] !== referables.chatsOnly) {
+    t8 = item => !referables.chatsOnly || item.kind === "chat";
+    $[23] = referables.chatsOnly;
+    $[24] = t8;
+  } else {
+    t8 = $[24];
+  }
+  const offersReferences = referables.items.some(t8);
+  const referenceMenuOpen = !commandMenuOpen && !skillMenuOpen && !mentionMenuOpen && referenceQuery !== null && offersReferences;
+  const excluded = ownId === undefined ? [...draft.chats, ...draft.references] : [ownId, ...draft.chats, ...draft.references];
+  const referenceMatches = referenceMenuOpen ? referenceSuggestions(referables, referenceQuery.query, excluded, REFERENCE_RESULTS) : [];
+  let t9;
+  if ($[25] !== draft.chats || $[26] !== draft.referenceNames || $[27] !== draft.references || $[28] !== referables.items) {
+    let t10;
+    if ($[30] !== referables.items) {
+      t10 = token => ({
+        ...token,
+        kind: referables.items.find(item_0 => item_0.id === token.id)?.kind ?? null
+      });
+      $[30] = referables.items;
+      $[31] = t10;
+    } else {
+      t10 = $[31];
+    }
+    t9 = referenceTokens([...draft.chats, ...draft.references], referables.items, draft.referenceNames).map(t10);
+    $[25] = draft.chats;
+    $[26] = draft.referenceNames;
+    $[27] = draft.references;
+    $[28] = referables.items;
+    $[29] = t9;
+  } else {
+    t9 = $[29];
+  }
+  const referenceChips = t9;
+  const listId = useId();
+  const menuOpen = commandMenuOpen || skillMenuOpen || mentionMenuOpen || referenceMenuOpen;
+  const menuCount = commandMenuOpen ? commands.length : skillMenuOpen ? skillMatches.length : mentionMenuOpen ? mentionCount : referenceMatches.length;
+  const activeIndex = clampMenuIndex(menuIndex, menuCount);
+  const inputAria = composerMenuAria({
+    label,
+    listId,
+    open: menuOpen,
+    activeIndex,
+    count: menuCount
+  });
+  let t10;
+  if ($[32] !== cwd || $[33] !== draft.mentions || $[34] !== draft.skills || $[35] !== referenceChips) {
+    t10 = (value, selection, state) => {
+      const empty = selection.from === selection.to;
+      const tree = empty ? ensureSyntaxTree(state, selection.from, 50) ?? syntaxTree(state) : null;
+      const caret = tree !== null && !inCode(tree, value, selection.from) ? selection.from : null;
+      const chips = caret === null ? [] : chipRanges(value, draft.mentions, draft.skills, [], referenceChips);
+      const skill_1 = caret === null ? null : queryOutsideChips(findSkillQuery(value, caret), chips);
+      setSkillQuery(current => sameQuery(current, skill_1) ? current : skill_1);
+      const next = caret === null || cwd === null ? null : queryOutsideChips(findMentionQuery(value, caret), chips);
+      setMention(current_0 => sameQuery(current_0, next) ? current_0 : next);
+      const reference = caret === null ? null : queryOutsideChips(findReferenceQuery(value, caret), chips);
+      setReferenceQuery(current_1 => sameQuery(current_1, reference) ? current_1 : reference);
+    };
+    $[32] = cwd;
+    $[33] = draft.mentions;
+    $[34] = draft.skills;
+    $[35] = referenceChips;
+    $[36] = t10;
+  } else {
+    t10 = $[36];
+  }
+  const trackTriggers = t10;
+  let t11;
+  if ($[37] !== inputRef) {
+    t11 = caret_0 => {
+      requestAnimationFrame(() => inputRef.current?.setCaret(caret_0));
+    };
+    $[37] = inputRef;
+    $[38] = t11;
+  } else {
+    t11 = $[38];
+  }
+  const moveCaret = t11;
+  let t12;
+  if ($[39] === Symbol.for("react.memo_cache_sentinel")) {
+    t12 = () => {
+      setMention(null);
+      setSkillQuery(null);
+      setReferenceQuery(null);
+    };
+    $[39] = t12;
+  } else {
+    t12 = $[39];
+  }
+  const close = t12;
+  let t13;
+  if ($[40] !== draft.mentions || $[41] !== mention || $[42] !== moveCaret || $[43] !== setText || $[44] !== text) {
+    t13 = path => {
+      if (!mention) {
+        return;
+      }
+      const result = insertMention(text, mention, path);
+      setText(result.text, draft.mentions.includes(path) ? draft.mentions : [...draft.mentions, path]);
+      setMention(null);
+      moveCaret(result.caret);
+    };
+    $[40] = draft.mentions;
+    $[41] = mention;
+    $[42] = moveCaret;
+    $[43] = setText;
+    $[44] = text;
+    $[45] = t13;
+  } else {
+    t13 = $[45];
+  }
+  const chooseMention = t13;
+  let t14;
+  if ($[46] !== chooseMention || $[47] !== mention || $[48] !== searched) {
+    t14 = index => {
+      const path_0 = mention === null ? null : mentionPick(index, searched, mention.query);
+      if (path_0 !== null) {
+        chooseMention(path_0);
+      }
+    };
+    $[46] = chooseMention;
+    $[47] = mention;
+    $[48] = searched;
+    $[49] = t14;
+  } else {
+    t14 = $[49];
+  }
+  const chooseMentionAt = t14;
+  let t15;
+  if ($[50] !== moveCaret || $[51] !== referenceQuery || $[52] !== setDraft || $[53] !== text) {
+    t15 = item_1 => {
+      if (!referenceQuery) {
+        return;
+      }
+      const result_0 = insertReference(text, referenceQuery, item_1.name);
+      const chat = item_1.kind === "chat";
+      const add = ids => ids.includes(item_1.id) ? ids : [...ids, item_1.id];
+      setDraft(current_2 => ({
+        ...current_2,
+        text: result_0.text,
+        chats: chat ? add(current_2.chats) : current_2.chats,
+        references: chat ? current_2.references : add(current_2.references),
+        referenceNames: {
+          ...current_2.referenceNames,
+          [item_1.id]: item_1.name
+        }
+      }));
+      setReferenceQuery(null);
+      moveCaret(result_0.caret);
+    };
+    $[50] = moveCaret;
+    $[51] = referenceQuery;
+    $[52] = setDraft;
+    $[53] = text;
+    $[54] = t15;
+  } else {
+    t15 = $[54];
+  }
+  const chooseReference = t15;
+  let t16;
+  if ($[55] !== chooseReference || $[56] !== referenceMatches) {
+    t16 = index_0 => {
+      const item_2 = referenceMatches[index_0] ?? referenceMatches[0];
+      if (item_2 !== undefined) {
+        chooseReference(item_2);
+      }
+    };
+    $[55] = chooseReference;
+    $[56] = referenceMatches;
+    $[57] = t16;
+  } else {
+    t16 = $[57];
+  }
+  const chooseReferenceAt = t16;
+  let t17;
+  if ($[58] !== draft.mentions || $[59] !== draft.skills || $[60] !== moveCaret || $[61] !== setText || $[62] !== skillQuery || $[63] !== text) {
+    t17 = name_2 => {
+      const result_1 = skillQuery ? insertSkill(text, skillQuery, name_2) : {
+        text: `$${name_2} `,
+        caret: name_2.length + 2
+      };
+      setText(result_1.text, draft.mentions, draft.skills.includes(name_2) ? draft.skills : [...draft.skills, name_2]);
+      setSkillQuery(null);
+      moveCaret(result_1.caret);
+    };
+    $[58] = draft.mentions;
+    $[59] = draft.skills;
+    $[60] = moveCaret;
+    $[61] = setText;
+    $[62] = skillQuery;
+    $[63] = text;
+    $[64] = t17;
+  } else {
+    t17 = $[64];
+  }
+  const chooseSkill = t17;
+  let t18;
+  if ($[65] !== chooseSkill || $[66] !== inputRef || $[67] !== setText) {
+    t18 = (command_0, index_1) => {
+      setMenuIndex(index_1);
+      if (command_0.skill) {
+        chooseSkill(command_0.name);
+        return;
+      }
+      setText(`/${command_0.name}`);
+      inputRef.current?.focus();
+    };
+    $[65] = chooseSkill;
+    $[66] = inputRef;
+    $[67] = setText;
+    $[68] = t18;
+  } else {
+    t18 = $[68];
+  }
+  const pickCommand = t18;
+  let t19;
+  if ($[69] !== chooseSkill || $[70] !== setText) {
+    t19 = command_1 => {
+      if (command_1.skill) {
+        chooseSkill(command_1.name);
+        return;
+      }
+      setText(`/${command_1.name} `);
+    };
+    $[69] = chooseSkill;
+    $[70] = setText;
+    $[71] = t19;
+  } else {
+    t19 = $[71];
+  }
+  const completeCommand = t19;
+  let t20;
+  if ($[72] === Symbol.for("react.memo_cache_sentinel")) {
+    t20 = (key, count) => {
+      if (key === "ArrowDown") {
+        setMenuIndex(i => (i + 1) % count);
+        return true;
+      }
+      if (key === "ArrowUp") {
+        setMenuIndex(i_0 => (i_0 - 1 + count) % count);
+        return true;
+      }
+      return false;
+    };
+    $[72] = t20;
+  } else {
+    t20 = $[72];
+  }
+  const moveInMenu = t20;
+  const t21 = skills.length > 0;
+  let t22;
+  if ($[73] !== skills) {
+    t22 = skills.map(_temp3);
+    $[73] = skills;
+    $[74] = t22;
+  } else {
+    t22 = $[74];
+  }
+  let t23;
+  if ($[75] !== activeIndex || $[76] !== chooseMention || $[77] !== chooseMentionAt || $[78] !== chooseReference || $[79] !== chooseReferenceAt || $[80] !== chooseSkill || $[81] !== commandMenuOpen || $[82] !== commandQuery || $[83] !== commands || $[84] !== completeCommand || $[85] !== files_0 || $[86] !== inputAria || $[87] !== listId || $[88] !== mention || $[89] !== mentionCount || $[90] !== mentionMenuOpen || $[91] !== menuOpen || $[92] !== pickCommand || $[93] !== referables || $[94] !== referenceChips || $[95] !== referenceMatches || $[96] !== referenceMenuOpen || $[97] !== skillMatches || $[98] !== skillMenuOpen || $[99] !== t21 || $[100] !== t22 || $[101] !== trackTriggers) {
+    t23 = {
+      listId,
+      activeIndex,
+      inputAria,
+      menuOpen,
+      hasSkills: t21,
+      skillNames: t22,
+      commandQuery,
+      commands,
+      commandMenuOpen,
+      skillMatches,
+      skillMenuOpen,
+      mention,
+      mentionMenuOpen,
+      mentionCount,
+      files: files_0,
+      referenceMenuOpen,
+      referenceMatches,
+      referables,
+      referenceChips,
+      setMenuIndex,
+      trackTriggers,
+      close,
+      chooseMention,
+      chooseMentionAt,
+      chooseReference,
+      chooseReferenceAt,
+      chooseSkill,
+      pickCommand,
+      completeCommand,
+      moveInMenu
+    };
+    $[75] = activeIndex;
+    $[76] = chooseMention;
+    $[77] = chooseMentionAt;
+    $[78] = chooseReference;
+    $[79] = chooseReferenceAt;
+    $[80] = chooseSkill;
+    $[81] = commandMenuOpen;
+    $[82] = commandQuery;
+    $[83] = commands;
+    $[84] = completeCommand;
+    $[85] = files_0;
+    $[86] = inputAria;
+    $[87] = listId;
+    $[88] = mention;
+    $[89] = mentionCount;
+    $[90] = mentionMenuOpen;
+    $[91] = menuOpen;
+    $[92] = pickCommand;
+    $[93] = referables;
+    $[94] = referenceChips;
+    $[95] = referenceMatches;
+    $[96] = referenceMenuOpen;
+    $[97] = skillMatches;
+    $[98] = skillMenuOpen;
+    $[99] = t21;
+    $[100] = t22;
+    $[101] = trackTriggers;
+    $[102] = t23;
+  } else {
+    t23 = $[102];
+  }
+  return t23;
+}
+function _temp3(skill_2) {
+  return skill_2.name;
+}
+function _temp2(skill) {
+  return skill.name;
+}
+function _temp() {}

package/dist/chat/ui/index.d.ts

@@ -13,6 +13,9 @@ export { ImageThumb, type ImageThumbProps } from './ImageView.js';
 export { LimitDock, LimitPill } from './LimitState.js';
 export { ReplyMarkdown, MessageMarkdown, Markdown } from './Markdown.js';
 export { ModelPicker } from './Pickers.js';
+export { PromptEditor } from './PromptEditor.js';
+export { promptPicks } from './composer/prompt-picks.js';
+export type { PromptDraft } from './composer/use-prompt-menus.js';
 export { ResumeCompactionDock } from './ResumeCompactionDock.js';
 export { SubagentTitleCrumb, SubagentBreadcrumb } from './SubagentControls.js';
 export { SubagentInfo } from './SubagentInfo.js';
@@ -21,6 +24,7 @@ export { Timeline } from './Timeline.js';
 export { TimelineMenuPopup } from './TimelineMenu.js';
 export { default as UnifiedDiff } from './UnifiedDiff.js';
 export { UploadThumb } from './UploadThumb.js';
+export { VisualPageFrame, type VisualPageFrameProps } from './VisualFrame.js';
 export { WelcomeGreeting } from './Welcome.js';
 export { externalChange, composerEditorExtensions } from './composer/editor.js';
 export { createDiffSyntaxRuntime, diffSyntaxRuntime, type DiffSyntaxRuntime, type DiffSyntaxRuntimeOptions, type DiffSyntaxSession, type DiffSyntaxMapping, type DiffSourceTokenSession, diffSourceTokens } from './diff-syntax.js';

package/dist/chat/ui/index.js

@@ -14,6 +14,8 @@ export { ImageThumb } from './ImageView.js';
 export { LimitDock, LimitPill } from './LimitState.js';
 export { ReplyMarkdown, MessageMarkdown, Markdown } from './Markdown.js';
 export { ModelPicker } from './Pickers.js';
+export { PromptEditor } from './PromptEditor.js';
+export { promptPicks } from './composer/prompt-picks.js';
 export { ResumeCompactionDock } from './ResumeCompactionDock.js';
 export { SubagentTitleCrumb, SubagentBreadcrumb } from './SubagentControls.js';
 export { SubagentInfo } from './SubagentInfo.js';
@@ -22,6 +24,7 @@ export { Timeline } from './Timeline.js';
 export { TimelineMenuPopup } from './TimelineMenu.js';
 export { default as UnifiedDiff } from './UnifiedDiff.js';
 export { UploadThumb } from './UploadThumb.js';
+export { VisualPageFrame } from './VisualFrame.js';
 export { WelcomeGreeting } from './Welcome.js';
 export { externalChange, composerEditorExtensions } from './composer/editor.js';
 export { createDiffSyntaxRuntime, diffSyntaxRuntime, diffSourceTokens } from './diff-syntax.js';

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

@@ -12,6 +12,7 @@ import { attachmentAspect, generatedImageView } from '../../logic/generated-imag
 import { toolStartedAt } from '../../logic/tools.js';
 import { CHIP_IN_MESSAGE, MENTION_TONE } from '../chips.js';
 import { useFileLinkCwd, useOpenFileLink } from '../file-links.js';
+import { HostMenuItems } from '../HostMenuItems.js';
 import { ImageThumb } from '../ImageView.js';
 import { ROW_GUTTER } from '../icons.js';
 import { RunningFor, WorkRow } from './WorkRows.js';
@@ -299,6 +300,7 @@ function ReadyImage({
     open,
     saveToProject
   } = attachments;
+  const extra = attachments.actions?.(scopeId, chatId, attachment) ?? [];
   const detail = [attachment.width !== undefined && attachment.height !== undefined ? t('generatedImage.dimensions', {
     width: attachment.width,
     height: attachment.height
@@ -359,21 +361,23 @@ function ReadyImage({
               size: "sm",
               label: t('generatedImage.openLarge'),
               onClick: () => setLightbox(true)
-            }), prompt !== null && /*#__PURE__*/_jsxs(Menu.Root, {
+            }), (prompt !== null || extra.length > 0) && /*#__PURE__*/_jsxs(Menu.Root, {
               children: [/*#__PURE__*/_jsx(IconButton, {
                 icon: Ellipsis,
                 size: "sm",
                 label: t('generatedImage.more'),
                 render: /*#__PURE__*/_jsx(Menu.Trigger, {})
-              }), /*#__PURE__*/_jsx(Menu.Popup, {
+              }), /*#__PURE__*/_jsxs(Menu.Popup, {
                 align: "end",
-                children: /*#__PURE__*/_jsxs(Menu.Item, {
+                children: [prompt !== null && /*#__PURE__*/_jsxs(Menu.Item, {
                   onClick: () => copyText(prompt),
                   children: [/*#__PURE__*/_jsx(Icon, {
                     icon: Copy,
                     size: 14
                   }), " ", t('generatedImage.copyPrompt')]
-                })
+                }), /*#__PURE__*/_jsx(HostMenuItems, {
+                  actions: extra
+                })]
               })]
             })]
           })