@datalayer/agent-runtimes 1.3.74 → 1.3.75

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/lib/chat/ChatFloating.d.ts +17 -1
  2. package/lib/chat/ChatFloating.js +52 -5
  3. package/lib/chat/assistant/AssistantContextMenu.d.ts +67 -0
  4. package/lib/chat/assistant/AssistantContextMenu.js +68 -0
  5. package/lib/chat/assistant/AssistantStage.d.ts +95 -1
  6. package/lib/chat/assistant/AssistantStage.js +227 -7
  7. package/lib/chat/assistant/BalloonParts.d.ts +15 -1
  8. package/lib/chat/assistant/BalloonParts.js +26 -9
  9. package/lib/chat/assistant/BalloonVisual.d.ts +10 -2
  10. package/lib/chat/assistant/BalloonVisual.js +3 -3
  11. package/lib/chat/assistant/SpeechBalloon.d.ts +47 -1
  12. package/lib/chat/assistant/SpeechBalloon.js +60 -8
  13. package/lib/chat/base/ChatBase.js +51 -1
  14. package/lib/chat/indicators/TypingDots.d.ts +13 -0
  15. package/lib/chat/indicators/TypingDots.js +21 -0
  16. package/lib/chat/messages/ChatMessageList.js +1 -15
  17. package/lib/components/inspector/AgentInspector.d.ts +59 -0
  18. package/lib/components/inspector/AgentInspector.js +220 -0
  19. package/lib/components/inspector/AgentInspectorDialog.d.ts +19 -0
  20. package/lib/components/inspector/AgentInspectorDialog.js +9 -0
  21. package/lib/components/inspector/JsonTree.d.ts +24 -0
  22. package/lib/components/inspector/JsonTree.js +89 -0
  23. package/lib/components/inspector/a2aInspect.d.ts +56 -0
  24. package/lib/components/inspector/a2aInspect.js +478 -0
  25. package/lib/components/inspector/agentInspector.d.ts +179 -0
  26. package/lib/components/inspector/agentInspector.js +267 -0
  27. package/lib/components/inspector/chatInspect.d.ts +38 -0
  28. package/lib/components/inspector/chatInspect.js +65 -0
  29. package/lib/components/inspector/classify.d.ts +19 -0
  30. package/lib/components/inspector/classify.js +42 -0
  31. package/lib/components/inspector/index.d.ts +14 -0
  32. package/lib/components/inspector/index.js +18 -0
  33. package/lib/components/teams/A2ATeamGraph.d.ts +42 -1
  34. package/lib/components/teams/A2ATeamGraph.js +24 -7
  35. package/lib/components/teams/NotebookPreviewView.js +9 -1
  36. package/lib/components/teams/TeamNotebook.d.ts +3 -1
  37. package/lib/components/teams/TeamNotebook.js +3 -3
  38. package/lib/components/teams/jupyterThemeVariables.d.ts +9 -0
  39. package/lib/components/teams/jupyterThemeVariables.js +441 -0
  40. package/lib/components/teams/teamConnections.d.ts +9 -1
  41. package/lib/components/teams/teamConnections.js +20 -0
  42. package/lib/components/teams/useA2ATeam.d.ts +17 -4
  43. package/lib/components/teams/useA2ATeam.js +87 -23
  44. package/lib/examples/AgentA2ATeamExample.d.ts +13 -0
  45. package/lib/examples/AgentA2ATeamExample.js +61 -13
  46. package/lib/examples/AssistantExample.js +62 -2
  47. package/lib/loop/apps/AppRenderer.js +1 -1
  48. package/lib/loop/core/index.d.ts +17 -0
  49. package/lib/loop/core/index.js +1 -0
  50. package/lib/loop/plugins/assistant/index.d.ts +1 -1
  51. package/lib/loop/plugins/assistant/index.js +8 -3
  52. package/lib/runtimes/browser/a2aPeer.d.ts +4 -1
  53. package/lib/types/chat.d.ts +7 -0
  54. package/package.json +1 -1
  55. package/scripts/codegen/generate_jupyter_theme_variables.mjs +57 -0
@@ -23,6 +23,9 @@ import { type AssistantCharacter } from './assistant/characters';
23
23
  import type { AssistantCharacterData } from './assistant/formats/types';
24
24
  import { type AssistantSaying } from './assistant/state';
25
25
  import { type PresenceState } from './presence/presenceStatus';
26
+ import type { AgentInspectorSink } from '../components/inspector/agentInspector';
27
+ import type { AssistantMenuItem } from './assistant/AssistantContextMenu';
28
+ import type { AssistantAbout } from './assistant/AssistantStage';
26
29
  import type { ChatCommonProps, ChatViewMode, ThemeOverrides } from '../types';
27
30
  /**
28
31
  * A conversation the host draws in the floating window, in place of the
@@ -172,6 +175,19 @@ export interface ChatFloatingProps extends ChatCommonProps {
172
175
  * own props (`protocol`, `suggestions`, …) are then not read.
173
176
  */
174
177
  conversation?: FloatingConversation;
178
+ /**
179
+ * The Agent Inspector's sink: the chat records its agent's turns and tool
180
+ * calls there, and the assistant's menu offers *Inspect the agent…*.
181
+ */
182
+ inspector?: AgentInspectorSink | null;
183
+ /** The balloon's display, changed from the assistant's menu. */
184
+ onBalloonDisplayChange?: (display: BalloonDisplay) => void;
185
+ /** Opens the host's character picker, from the assistant's menu. */
186
+ onChangeCharacter?: () => void;
187
+ /** What the assistant's menu's *About* says. */
188
+ about?: AssistantAbout;
189
+ /** The host's own entries of the assistant's menu. */
190
+ contextMenu?: readonly AssistantMenuItem[];
175
191
  /**
176
192
  * Its voice (VOICE.md V1): push-to-talk in the composer, heard on the
177
193
  * device; with `output: 'always'`, its answers said by Datalayer's speech
@@ -184,5 +200,5 @@ export interface ChatFloatingProps extends ChatCommonProps {
184
200
  * ChatFloating component
185
201
  * A floating chat window built on ChatBase
186
202
  */
187
- export declare function ChatFloating({ endpoint, protocol: protocolProp, useStore: useStoreMode, title, description, position, defaultOpen, width, height, showHeader, showButton, showNewChatButton, showClearButton, showSettingsButton, enableKeyboardShortcuts, toggleShortcut, showPoweredBy, promptVariant, mentionableAgents, poweredByProps, clickOutsideToClose, escapeToClose, className, onSettingsClick, onNewChat, onOpen, onClose, onStateUpdate, children, brandIcon, buttonIcon, buttonTooltip, brandColor, buttonGlow, offset, animationDuration, renderToolResult, frontendTools, initialState: _initialState, suggestions, submitOnSuggestionClick, hideMessagesAfterToolUI, defaultViewMode, onViewModeChange, sidebarMountPoint, showPanelBackdrop, availableModels, showModelSelector, showToolsMenu, showSkillsMenu, showTokenUsage, showContextRing, themeVariant, themeOverrides, colorMode, runtimeId, historyEndpoint, authToken, historyAuthToken, pendingPrompt, showInformation, onInformationClick, onToolCallStart, onToolCallComplete, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, panelProps, launching, launchingMessage, assistantCharacter, balloonDisplay, expandTarget, conversation, decisions, voice, }: ChatFloatingProps): React.JSX.Element;
203
+ export declare function ChatFloating({ endpoint, protocol: protocolProp, useStore: useStoreMode, title, description, position, defaultOpen, width, height, showHeader, showButton, showNewChatButton, showClearButton, showSettingsButton, enableKeyboardShortcuts, toggleShortcut, showPoweredBy, promptVariant, mentionableAgents, poweredByProps, clickOutsideToClose, escapeToClose, className, onSettingsClick, onNewChat, onOpen, onClose, onStateUpdate, children, brandIcon, buttonIcon, buttonTooltip, brandColor, buttonGlow, offset, animationDuration, renderToolResult, frontendTools, initialState: _initialState, suggestions, submitOnSuggestionClick, hideMessagesAfterToolUI, defaultViewMode, onViewModeChange, sidebarMountPoint, showPanelBackdrop, availableModels, showModelSelector, showToolsMenu, showSkillsMenu, showTokenUsage, showContextRing, themeVariant, themeOverrides, colorMode, runtimeId, historyEndpoint, authToken, historyAuthToken, pendingPrompt, showInformation, onInformationClick, onToolCallStart, onToolCallComplete, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, panelProps, launching, launchingMessage, assistantCharacter, balloonDisplay: balloonDisplayGiven, expandTarget, conversation, decisions, voice, inspector, onBalloonDisplayChange, onChangeCharacter, about, contextMenu, }: ChatFloatingProps): React.JSX.Element;
188
204
  export default ChatFloating;
@@ -70,7 +70,20 @@ const clamp = (value, max) => Math.max(8, Math.min(value, Math.max(8, max)));
70
70
  * ChatFloating component
71
71
  * A floating chat window built on ChatBase
72
72
  */
73
- export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useStoreMode = true, title = 'Chat', description = 'Start a conversation with the AI agent.', position = 'bottom-right', defaultOpen = false, width = 400, height = 550, showHeader = true, showButton = true, showNewChatButton = true, showClearButton = true, showSettingsButton = false, enableKeyboardShortcuts = true, toggleShortcut = '/', showPoweredBy = true, promptVariant, mentionableAgents, poweredByProps, clickOutsideToClose = false, escapeToClose = true, className, onSettingsClick, onNewChat, onOpen, onClose, onStateUpdate, children, brandIcon, buttonIcon, buttonTooltip = 'Chat with AI', brandColor, buttonGlow = true, offset = 20, animationDuration = 200, renderToolResult, frontendTools, initialState: _initialState, suggestions, submitOnSuggestionClick = true, hideMessagesAfterToolUI = false, defaultViewMode = 'floating', onViewModeChange, sidebarMountPoint = null, showPanelBackdrop = false, availableModels, showModelSelector = false, showToolsMenu = false, showSkillsMenu = false, showTokenUsage = true, showContextRing = false, themeVariant, themeOverrides, colorMode, runtimeId, historyEndpoint, authToken, historyAuthToken, pendingPrompt, showInformation = false, onInformationClick, onToolCallStart, onToolCallComplete, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, panelProps, launching = false, launchingMessage, assistantCharacter = DEFAULT_ASSISTANT_CHARACTER, balloonDisplay = DEFAULT_BALLOON_DISPLAY, expandTarget, conversation, decisions, voice, }) {
73
+ export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useStoreMode = true, title = 'Chat', description = 'Start a conversation with the AI agent.', position = 'bottom-right', defaultOpen = false, width = 400, height = 550, showHeader = true, showButton = true, showNewChatButton = true, showClearButton = true, showSettingsButton = false, enableKeyboardShortcuts = true, toggleShortcut = '/', showPoweredBy = true, promptVariant, mentionableAgents, poweredByProps, clickOutsideToClose = false, escapeToClose = true, className, onSettingsClick, onNewChat, onOpen, onClose, onStateUpdate, children, brandIcon, buttonIcon, buttonTooltip = 'Chat with AI', brandColor, buttonGlow = true, offset = 20, animationDuration = 200, renderToolResult, frontendTools, initialState: _initialState, suggestions, submitOnSuggestionClick = true, hideMessagesAfterToolUI = false, defaultViewMode = 'floating', onViewModeChange, sidebarMountPoint = null, showPanelBackdrop = false, availableModels, showModelSelector = false, showToolsMenu = false, showSkillsMenu = false, showTokenUsage = true, showContextRing = false, themeVariant, themeOverrides, colorMode, runtimeId, historyEndpoint, authToken, historyAuthToken, pendingPrompt, showInformation = false, onInformationClick, onToolCallStart, onToolCallComplete, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, panelProps, launching = false, launchingMessage, assistantCharacter = DEFAULT_ASSISTANT_CHARACTER, balloonDisplay: balloonDisplayGiven = DEFAULT_BALLOON_DISPLAY, expandTarget, conversation, decisions, voice, inspector, onBalloonDisplayChange, onChangeCharacter, about, contextMenu, }) {
74
+ // The chat's own send, once it can: what a suggestion in the balloon sends.
75
+ const chatControls = useRef(null);
76
+ const [suggestionPrompt, setSuggestionPrompt] = useState();
77
+ const [speechMuted, setSpeechMuted] = useState(false);
78
+ // The balloon's display, as the assistant's menu chose it; the host's
79
+ // until then, and again when the host changes it.
80
+ const [chosenDisplay, setChosenDisplay] = useState();
81
+ useEffect(() => setChosenDisplay(undefined), [balloonDisplayGiven]);
82
+ const balloonDisplay = chosenDisplay ?? balloonDisplayGiven;
83
+ const changeBalloonDisplay = useCallback((next) => {
84
+ setChosenDisplay(next);
85
+ onBalloonDisplayChange?.(next);
86
+ }, [onBalloonDisplayChange]);
74
87
  // Store-based state
75
88
  const storeIsOpen = useChatOpen();
76
89
  const storeMessages = useChatMessages();
@@ -176,7 +189,7 @@ export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useSt
176
189
  window.removeEventListener('keydown', unlock);
177
190
  };
178
191
  }, [speaker]);
179
- useSpokenAnswers(voiceItems, chatBusy, !!speaker, speaker);
192
+ useSpokenAnswers(voiceItems, chatBusy, !!speaker && !speechMuted, speaker);
180
193
  const stopSpeaking = useCallback(() => speaker?.stop(), [speaker]);
181
194
  const mouthLevel = useMemo(() => (speaker ? () => speaker.level() : undefined), [speaker]);
182
195
  const [arriving, setArriving] = useState(false);
@@ -318,6 +331,28 @@ export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useSt
318
331
  !!toolSaid ||
319
332
  (showsCurrent && atWork) ||
320
333
  (unheard && (assistantState === 'speaking' || freshSaying));
334
+ // The chat's suggestions, in the balloon while it waits for a question:
335
+ // one clicked is sent as the prompt, as if typed.
336
+ const balloonSuggestions = useMemo(() => conversation || !suggestions?.length
337
+ ? undefined
338
+ : suggestions.map(suggestion => ({
339
+ label: suggestion.title,
340
+ prompt: suggestion.message,
341
+ })), [conversation, suggestions]);
342
+ const sendSuggestion = useCallback((suggestion) => {
343
+ if (chatControls.current) {
344
+ chatControls.current.send(suggestion.prompt);
345
+ }
346
+ else {
347
+ // Not able to send yet: sent once it is.
348
+ setSuggestionPrompt(suggestion.prompt);
349
+ }
350
+ }, []);
351
+ const panelOnSendReady = panelProps?.onSendReady;
352
+ const handleSendReady = useCallback(controls => {
353
+ chatControls.current = controls;
354
+ panelOnSendReady?.(controls);
355
+ }, [panelOnSendReady]);
321
356
  const panelOnLoadingChange = panelProps?.onLoadingChange;
322
357
  const panelOnDisplayItemsChange = panelProps?.onDisplayItemsChange;
323
358
  const handleLoadingChange = useCallback((loading) => {
@@ -1021,9 +1056,9 @@ export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useSt
1021
1056
  ...poweredByProps,
1022
1057
  }, renderToolResult: renderToolResult, description: description, onStateUpdate: onStateUpdate, onNewChat: onNewChat, suggestions: suggestions, submitOnSuggestionClick: submitOnSuggestionClick, hideMessagesAfterToolUI: hideMessagesAfterToolUI, avatarConfig: {
1023
1058
  showAvatars: true,
1024
- }, placeholder: "Type a message...", backgroundColor: "canvas.subtle", frontendTools: frontendTools, showModelSelector: showModelSelector, availableModels: availableModels, showToolsMenu: showToolsMenu, showSkillsMenu: showSkillsMenu, showTokenUsage: showTokenUsage, showContextRing: showContextRing, runtimeId: runtimeId, historyEndpoint: historyEndpoint, historyAuthToken: historyAuthToken, pendingPrompt: pendingPrompt, showInformation: showInformation, onInformationClick: onInformationClick, onToolCallStart: onToolCallStart, onToolCallComplete: onToolCallComplete, showToolApprovalBanner: showToolApprovalBanner, pendingApprovals: pendingApprovals, onApproveApproval: onApproveApproval, onRejectApproval: onRejectApproval, voice: voice, voiceSpeaking: speakerState.speaking, onStopSpeaking: speaker ? stopSpeaking : undefined, ...panelProps, ...assistantChat, onLoadingChange: handleLoadingChange, onDisplayItemsChange: handleDisplayItemsChange, children: conversationBalloon && currentOpen ? (
1059
+ }, placeholder: "Type a message...", backgroundColor: "canvas.subtle", frontendTools: frontendTools, showModelSelector: showModelSelector, availableModels: availableModels, showToolsMenu: showToolsMenu, showSkillsMenu: showSkillsMenu, showTokenUsage: showTokenUsage, showContextRing: showContextRing, runtimeId: runtimeId, historyEndpoint: historyEndpoint, historyAuthToken: historyAuthToken, pendingPrompt: pendingPrompt ?? suggestionPrompt, inspector: inspector, showInformation: showInformation, onInformationClick: onInformationClick, onToolCallStart: onToolCallStart, onToolCallComplete: onToolCallComplete, showToolApprovalBanner: showToolApprovalBanner, pendingApprovals: pendingApprovals, onApproveApproval: onApproveApproval, onRejectApproval: onRejectApproval, voice: voice, voiceSpeaking: speakerState.speaking, onStopSpeaking: speaker ? stopSpeaking : undefined, ...panelProps, ...assistantChat, onLoadingChange: handleLoadingChange, onDisplayItemsChange: handleDisplayItemsChange, onSendReady: handleSendReady, children: conversationBalloon && currentOpen ? (
1025
1060
  // Current: the one thing said or done now, over the composer.
1026
- _jsx(Box, { sx: { px: 3, pt: 3, pb: 2, overflow: 'hidden' }, children: _jsx(CurrentBalloonBody, { text: toolSaid ? undefined : (currentWords ?? description), tool: toolSaid, busy: atWork, speaking: answering && atWork }) })) : (children) }))] }));
1061
+ _jsx(Box, { sx: { px: 3, pt: 3, pb: 2, overflow: 'hidden' }, children: _jsx(CurrentBalloonBody, { text: toolSaid ? undefined : (currentWords ?? description), tool: toolSaid, busy: atWork, speaking: answering && atWork, waiting: atWork && !answering }) })) : (children) }))] }));
1027
1062
  /*
1028
1063
  * The floating popup's button. Words not yet heard make it blink for the
1029
1064
  * person's attention, until the chat is opened; hovered, they show in a
@@ -1071,7 +1106,19 @@ export function ChatFloating({ endpoint, protocol: protocolProp, useStore: useSt
1071
1106
  left: px(stageDrag.position.left),
1072
1107
  top: px(stageDrag.position.top),
1073
1108
  }
1074
- : getPositionStyles(), stageRef: stageRef, onDragStart: stageDrag.onHandlePointerDown, open: isOpen, onToggle: handleToggle, balloon: assistantBalloon, balloonDisplay: balloonDisplay, expandTarget: expandTarget, insist: balloonInsists, onDismiss: dismissAssistant, ownRef: popupRef, mouthLevel: mouthLevel })), showButton && !isOpen && !assistantShown && (_jsx(Box, { sx: {
1109
+ : getPositionStyles(), stageRef: stageRef, onDragStart: stageDrag.onHandlePointerDown, open: isOpen, onToggle: handleToggle, balloon: assistantBalloon, balloonDisplay: balloonDisplay, expandTarget: expandTarget, insist: balloonInsists, onDismiss: dismissAssistant, ownRef: popupRef, mouthLevel: mouthLevel, suggestions: balloonSuggestions, onSuggestion: sendSuggestion, inspector: inspector, onBalloonDisplayChange: changeBalloonDisplay, onStop: chatBusy && chatControls.current
1110
+ ? () => chatControls.current?.stop()
1111
+ : undefined, onNewChat: !conversation && showNewChatButton ? handleNewChat : undefined, onClear: !conversation && useStoreMode ? handleClear : undefined, onChangeCharacter: onChangeCharacter, speech: speaker
1112
+ ? {
1113
+ muted: speechMuted,
1114
+ onToggle: () => {
1115
+ if (!speechMuted) {
1116
+ speaker.stop();
1117
+ }
1118
+ setSpeechMuted(!speechMuted);
1119
+ },
1120
+ }
1121
+ : undefined, onResetPosition: stageDrag.position ? stageDrag.reset : undefined, about: about, contextMenu: contextMenu })), showButton && !isOpen && !assistantShown && (_jsx(Box, { sx: {
1075
1122
  ...getPositionStyles(),
1076
1123
  }, children: _jsxs(Box, { sx: {
1077
1124
  position: 'relative',
@@ -0,0 +1,67 @@
1
+ /**
2
+ * The assistant's own menu (LOOP T-27): right-click the character — or
3
+ * Shift+F10 or the ContextMenu key while it has the focus, or a long press on
4
+ * a touch screen — and a menu opens where the pointer is, with what applies
5
+ * to this agent on this page: inspect it, open the conversation, the
6
+ * balloon's display, the suggestions, stop the turn, a new conversation,
7
+ * another character, its voice, send it away, put it back, about it. Esc or
8
+ * a click outside closes it.
9
+ *
10
+ * Its entries are composed from what the host passes ({@link
11
+ * AssistantMenuItem}s): a host or a plugin adds its own (`contextMenu`; in
12
+ * the LOOP workspace, the `loop.assistant.menu` contribution point).
13
+ *
14
+ * @module chat/assistant/AssistantContextMenu
15
+ */
16
+ import type { JSX, RefObject } from 'react';
17
+ import type { Icon } from '@primer/octicons-react';
18
+ /** One entry of the assistant's menu. */
19
+ export type AssistantMenuItem = {
20
+ /** Stable id: `inspect`, `stop`, a plugin's own. */
21
+ id: string;
22
+ label: string;
23
+ /** Said under the label, smaller. */
24
+ description?: string;
25
+ /** An octicon, before the label. */
26
+ icon?: Icon;
27
+ onSelect: () => void;
28
+ /**
29
+ * Checkable: `true` or `false` makes it one of a choice — the entries of
30
+ * its group are a radio group, one checked.
31
+ */
32
+ checked?: boolean;
33
+ disabled?: boolean;
34
+ /** The group it is listed in, by its heading; ungrouped entries come first. */
35
+ group?: string;
36
+ /** Drawn as a danger: send away. */
37
+ danger?: boolean;
38
+ };
39
+ /** The entries by group, in the order their first entry came. */
40
+ export declare function menuGroups(items: readonly AssistantMenuItem[]): {
41
+ group: string | undefined;
42
+ items: AssistantMenuItem[];
43
+ }[];
44
+ /** Whether a key opens the menu: Shift+F10, or the ContextMenu key. */
45
+ export declare function opensContextMenu(event: {
46
+ key: string;
47
+ shiftKey: boolean;
48
+ }): boolean;
49
+ /** How long a touch is held before the menu opens, in ms. */
50
+ export declare const LONG_PRESS_MS = 550;
51
+ export type AssistantContextMenuProps = {
52
+ /** Where it opens, in the window's coordinates; closed when `null`. */
53
+ at: {
54
+ x: number;
55
+ y: number;
56
+ } | null;
57
+ items: readonly AssistantMenuItem[];
58
+ /** It closed: Esc, a click outside, or an entry chosen. */
59
+ onClose: () => void;
60
+ /** Where the focus goes back to once it closes. */
61
+ returnFocusRef?: RefObject<HTMLElement | null>;
62
+ /** Its name, for a screen reader: `Paper clip's menu`. */
63
+ label: string;
64
+ };
65
+ /** The menu, anchored at a point of the window. */
66
+ export declare function AssistantContextMenu({ at, items, onClose, returnFocusRef, label, }: AssistantContextMenuProps): JSX.Element | null;
67
+ export default AssistantContextMenu;
@@ -0,0 +1,68 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { useEffect, useRef } from 'react';
3
+ import { createPortal } from 'react-dom';
4
+ import { ActionList, ActionMenu } from '@primer/react';
5
+ /** The entries by group, in the order their first entry came. */
6
+ export function menuGroups(items) {
7
+ const groups = [];
8
+ for (const item of items) {
9
+ const found = groups.find(group => group.group === item.group);
10
+ if (found) {
11
+ found.items.push(item);
12
+ }
13
+ else {
14
+ groups.push({ group: item.group, items: [item] });
15
+ }
16
+ }
17
+ // The ungrouped come first.
18
+ return [
19
+ ...groups.filter(group => group.group === undefined),
20
+ ...groups.filter(group => group.group !== undefined),
21
+ ];
22
+ }
23
+ /** Whether a key opens the menu: Shift+F10, or the ContextMenu key. */
24
+ export function opensContextMenu(event) {
25
+ return event.key === 'ContextMenu' || (event.key === 'F10' && event.shiftKey);
26
+ }
27
+ /** How long a touch is held before the menu opens, in ms. */
28
+ export const LONG_PRESS_MS = 550;
29
+ /** The menu, anchored at a point of the window. */
30
+ export function AssistantContextMenu({ at, items, onClose, returnFocusRef, label, }) {
31
+ const anchor = useRef(null);
32
+ const open = at !== null;
33
+ useEffect(() => {
34
+ if (!open) {
35
+ return;
36
+ }
37
+ // A scroll moves what it was opened on: it closes.
38
+ const close = () => onClose();
39
+ window.addEventListener('scroll', close, true);
40
+ return () => window.removeEventListener('scroll', close, true);
41
+ }, [open, onClose]);
42
+ if (!at || typeof document === 'undefined') {
43
+ return null;
44
+ }
45
+ const groups = menuGroups(items);
46
+ return (_jsxs(_Fragment, { children: [createPortal(_jsx("div", { ref: anchor, "aria-hidden": "true", "data-assistant-menu-anchor": "", style: {
47
+ position: 'fixed',
48
+ left: at.x,
49
+ top: at.y,
50
+ width: 1,
51
+ height: 1,
52
+ pointerEvents: 'none',
53
+ } }), document.body), _jsx(ActionMenu, { open: true, anchorRef: anchor, onOpenChange: next => {
54
+ if (!next) {
55
+ onClose();
56
+ requestAnimationFrame(() => returnFocusRef?.current?.focus());
57
+ }
58
+ }, children: _jsx(ActionMenu.Overlay, { width: "auto", "data-assistant-menu": "", children: _jsx(ActionList, { "aria-label": label, children: groups.map(({ group, items: entries }, index) => {
59
+ const choice = entries.some(item => item.checked !== undefined);
60
+ const list = entries.map(item => (_jsxs(ActionList.Item, { "data-assistant-menu-item": item.id, disabled: item.disabled, variant: item.danger ? 'danger' : 'default', ...(choice ? { selected: !!item.checked } : {}), onSelect: () => {
61
+ item.onSelect();
62
+ onClose();
63
+ requestAnimationFrame(() => returnFocusRef?.current?.focus());
64
+ }, children: [item.icon && (_jsx(ActionList.LeadingVisual, { children: _jsx(item.icon, {}) })), item.label, item.description && (_jsx(ActionList.Description, { variant: "block", children: item.description }))] }, item.id)));
65
+ return (_jsxs(ActionList.Group, { ...(choice ? { selectionVariant: 'single' } : {}), children: [group && (_jsx(ActionList.GroupHeading, { children: group })), list] }, group ?? `ungrouped-${index}`));
66
+ }) }) }) })] }));
67
+ }
68
+ export default AssistantContextMenu;
@@ -8,6 +8,17 @@
8
8
  * working: it steps aside — out of sight and out of the pointer's way — until
9
9
  * the place is clear again.
10
10
  *
11
+ * Right-clicked — or Shift+F10 or the ContextMenu key while it has the
12
+ * focus, or a long press — it opens its own menu where the pointer is
13
+ * (`AssistantContextMenu`): what the host passes applies — *Inspect the
14
+ * agent…* (the Agent Inspector, in a dialog loaded then), the conversation,
15
+ * the balloon's display, the suggestions, *Stop*, a new conversation,
16
+ * another character, its voice, send it away, its place, about it — and
17
+ * what a host or a plugin adds (`contextMenu`).
18
+ *
19
+ * Given suggestions, its balloon offers them while it waits for a question
20
+ * (idle, or greeting): one clicked is sent as the prompt (`onSuggestion`).
21
+ *
11
22
  * Its motions are one set for every character, by the parts each drawing
12
23
  * names (`assistant-body`, `-pupils`, `-lids`, `-mouth`), and nothing moves
13
24
  * for a reader who asks the system for reduced motion.
@@ -16,11 +27,54 @@
16
27
  */
17
28
  import type { JSX, ReactNode, RefObject } from 'react';
18
29
  import { type AssistantCharacter } from './characters';
30
+ import { type BalloonSuggestion } from './SpeechBalloon';
31
+ import { type AssistantMenuItem } from './AssistantContextMenu';
32
+ import type { AgentInspectorSink } from '../../components/inspector/agentInspector';
19
33
  import { type BalloonExpandTarget, type BalloonVisual } from './BalloonVisual';
20
34
  import type { AssistantCharacterData } from './formats/types';
21
35
  import type { DecisionAsker } from './decisions';
22
36
  import type { BalloonDisplay, BalloonToolLine } from './toolLine';
23
37
  import { type AssistantAway, type AssistantState, type BalloonApproval, type BalloonHistoryMessage } from './state';
38
+ /** What the assistant's *About* says. */
39
+ export type AssistantAbout = {
40
+ /** The agent's name, or its application's. */
41
+ name?: string;
42
+ /** Its spec or application id, with its version. */
43
+ spec?: string;
44
+ /** Its model. */
45
+ model?: string;
46
+ /** Where it runs: `in your browser`, `on a runtime`. */
47
+ where?: string;
48
+ };
49
+ /**
50
+ * The entries of the assistant's menu, composed from what the host passes:
51
+ * each shows when what it does is there to do.
52
+ */
53
+ export declare function assistantMenuItems(options: {
54
+ name: string;
55
+ open: boolean;
56
+ onToggle: () => void;
57
+ onDismiss: (away: AssistantAway) => void;
58
+ /** The conversation entry's label; `false` leaves it out. */
59
+ conversationLabel?: string | false;
60
+ inspect?: () => void;
61
+ balloonDisplay?: BalloonDisplay;
62
+ onBalloonDisplayChange?: (display: BalloonDisplay) => void;
63
+ suggestions?: readonly BalloonSuggestion[];
64
+ onSuggestion?: (suggestion: BalloonSuggestion) => void;
65
+ busy?: boolean;
66
+ onStop?: () => void;
67
+ onNewChat?: () => void;
68
+ onClear?: () => void;
69
+ onChangeCharacter?: () => void;
70
+ speech?: {
71
+ muted: boolean;
72
+ onToggle: () => void;
73
+ };
74
+ onResetPosition?: () => void;
75
+ about?: () => void;
76
+ extra?: readonly AssistantMenuItem[];
77
+ }): AssistantMenuItem[];
24
78
  /**
25
79
  * Where the balloon goes so that it stays inside the window (T-23): toward
26
80
  * the middle of the page from whichever half the character stands in, and
@@ -77,6 +131,8 @@ export interface AssistantStageProps {
77
131
  */
78
132
  balloon?: {
79
133
  text: string;
134
+ /** The words uncut, when `text` was cut to fit: *more* shows them. */
135
+ fullText?: string;
80
136
  more?: boolean;
81
137
  approval?: BalloonApproval;
82
138
  /** Puts the peek away (a × beside its line); never an approval's. */
@@ -121,6 +177,44 @@ export interface AssistantStageProps {
121
177
  balloonDisplay?: BalloonDisplay;
122
178
  /** Show the balloon without being hovered: something new to say. */
123
179
  insist?: boolean;
180
+ /**
181
+ * What the person may ask: chips in the balloon while it waits for a
182
+ * question (idle or greeting), and a group of its menu. One chosen is sent
183
+ * as the prompt with `onSuggestion`.
184
+ */
185
+ suggestions?: readonly BalloonSuggestion[];
186
+ onSuggestion?: (suggestion: BalloonSuggestion) => void;
187
+ /** The Agent Inspector's sink: its menu offers *Inspect the agent…*. */
188
+ inspector?: AgentInspectorSink | null;
189
+ /** The agent whose own record the inspector shows, of a shared sink (a team's member). */
190
+ inspectAgent?: string;
191
+ /**
192
+ * What its menu calls the conversation's entry, which does `onToggle`;
193
+ * `false` leaves it out, where there is no conversation to open (a team's
194
+ * member that is asked by another). Unsaid: *Open / Close the conversation*.
195
+ */
196
+ conversationLabel?: string | false;
197
+ /** The balloon's display changes from its menu: *Balloon: History / Current*. */
198
+ onBalloonDisplayChange?: (display: BalloonDisplay) => void;
199
+ /** Stops the turn: offered in its menu while it is at work. */
200
+ onStop?: () => void;
201
+ /** Starts a new conversation, from its menu. */
202
+ onNewChat?: () => void;
203
+ /** Clears the conversation, from its menu. */
204
+ onClear?: () => void;
205
+ /** Opens the host's character picker, from its menu. */
206
+ onChangeCharacter?: () => void;
207
+ /** Its voice, muted or not, from its menu. */
208
+ speech?: {
209
+ muted: boolean;
210
+ onToggle: () => void;
211
+ };
212
+ /** Puts it back where it started, after a drag: offered in its menu. */
213
+ onResetPosition?: () => void;
214
+ /** What its menu's *About* says. */
215
+ about?: AssistantAbout;
216
+ /** The host's or a plugin's own entries of its menu. */
217
+ contextMenu?: readonly AssistantMenuItem[];
124
218
  /** Send it away (T-27): for the page, for the session, or for good. */
125
219
  onDismiss: (away: AssistantAway) => void;
126
220
  /**
@@ -153,5 +247,5 @@ export declare function mouthOpening(level: number): 0 | 1 | 2 | 3;
153
247
  * `data-assistant-mouth`, each frame, without drawing the character again.
154
248
  */
155
249
  export declare function useMouth(stageRef: RefObject<HTMLElement | null>, mouthLevel: (() => number) | undefined, speaking: boolean): void;
156
- export declare function AssistantStage({ character, state, size, place, stageRef, onDragStart, open, onToggle, balloon, insist, onDismiss, ownRef, decide, mouthLevel, stayPut, balloonDisplay, expandTarget, expandOnArrival, }: AssistantStageProps): JSX.Element;
250
+ export declare function AssistantStage({ character, state, size, place, stageRef, onDragStart, open, onToggle, balloon, insist, onDismiss, ownRef, decide, mouthLevel, stayPut, balloonDisplay, expandTarget, expandOnArrival, suggestions, onSuggestion, inspector, inspectAgent, conversationLabel, onBalloonDisplayChange, onStop, onNewChat, onClear, onChangeCharacter, speech, onResetPosition, about, contextMenu, }: AssistantStageProps): JSX.Element;
157
251
  export default AssistantStage;