@datalayer/agent-runtimes 1.3.71 → 1.3.72

package/lib/chat/assistant/toolLine.d.ts

@@ -0,0 +1,69 @@
+/**
+ * How the balloon shows the conversation: `history`, every message,
+ * scrolled, the composer last; `current`, only what it says or does now, in
+ * one balloon that replaces its words as the turn goes on.
+ */
+export type BalloonDisplay = 'history' | 'current';
+/** The two displays, in the Appspec's order (`interface.balloon`). */
+export declare const BALLOON_DISPLAYS: readonly BalloonDisplay[];
+/** The floating chat's display when nothing says one. */
+export declare const DEFAULT_BALLOON_DISPLAY: BalloonDisplay;
+/** Where a tool call is: running, returned, or failed. */
+export type ToolLinePhase = 'running' | 'done' | 'failed';
+/** A tool call, as the balloon says it. */
+export interface BalloonToolLine {
+    /** The call's id: a start and its end share it. */
+    id: string;
+    /** The tool's name, as the agent calls it (`list_invoices`). */
+    tool: string;
+    /** How it is said: the spec's display name, else the name. */
+    name: string;
+    phase: ToolLinePhase;
+    /**
+     * Its own words, when its runtime said what it does (`Writing a
+     * notebook…`, `Asking Accounting…`): said in place of "Using …".
+     */
+    words?: string;
+}
+/**
+ * How a tool is said: the display name its runtime spec gives it (`Current
+ * Time` for `current_time`), else its own name without the MCP server's
+ * prefix (`odoo__list_invoices` is `list_invoices`).
+ */
+export declare function toolDisplayName(tool: string): string;
+/** The three parts a tool line is said in: before the name, the name, after it. */
+export declare function toolLineParts(line: BalloonToolLine): {
+    before: string;
+    name: string;
+    after: string;
+};
+/** A tool line in plain words: "Using list_invoices…". */
+export declare function toolLineText(line: BalloonToolLine): string;
+/**
+ * The tool line of the conversation's newest item, when that item is a tool
+ * call: running until it is complete or failed. Once words follow it, the
+ * newest item is the answer, and there is no tool line.
+ */
+export declare function newestToolLine(items: readonly unknown[]): BalloonToolLine | undefined;
+/** A tool step a peer told over A2A (`a2aPeer`'s `A2APeerToolStep`). */
+export interface ToolStep {
+    id?: string;
+    name: string;
+    ended: boolean;
+    error?: string;
+}
+/** The tool line of a step a peer told: its start running, its end done or failed. */
+export declare function toolLineOfStep(step: ToolStep, name?: string): BalloonToolLine;
+/**
+ * What a screen reader hears of a tool line: once when the call starts and
+ * once when it ends — a new id or a new phase — never while it runs.
+ */
+export declare function toolAnnouncement(line: BalloonToolLine | undefined, previous: {
+    id: string;
+    phase: ToolLinePhase;
+} | undefined): string | undefined;
+/**
+ * How many messages the conversation holds, as the `history` balloon's
+ * header counts them: the person's and the agent's, not the tool calls.
+ */
+export declare function conversationCount(items: readonly unknown[]): number;

package/lib/chat/assistant/toolLine.js

@@ -0,0 +1,118 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * What the floating assistant's balloon shows (LOOP T-23): the whole
+ * conversation (`history`), or only what it says or does now (`current`);
+ * and, either way, the tool it calls, in plain words — "Using
+ * **list_invoices**…", then "Done: list_invoices" or "list_invoices failed".
+ *
+ * @module chat/assistant/toolLine
+ */
+import { BACKEND_TOOL_CATALOG } from '../../specs/backendTools';
+/** The two displays, in the Appspec's order (`interface.balloon`). */
+export const BALLOON_DISPLAYS = [
+    'history',
+    'current',
+];
+/** The floating chat's display when nothing says one. */
+export const DEFAULT_BALLOON_DISPLAY = 'history';
+let displayNames = null;
+/**
+ * How a tool is said: the display name its runtime spec gives it (`Current
+ * Time` for `current_time`), else its own name without the MCP server's
+ * prefix (`odoo__list_invoices` is `list_invoices`).
+ */
+export function toolDisplayName(tool) {
+    if (!displayNames) {
+        displayNames = new Map();
+        for (const spec of Object.values(BACKEND_TOOL_CATALOG)) {
+            const method = spec.runtime?.method;
+            if (method && spec.name && !displayNames.has(method)) {
+                displayNames.set(method, spec.name);
+            }
+        }
+    }
+    const named = displayNames.get(tool);
+    if (named) {
+        return named;
+    }
+    const at = tool.indexOf('__');
+    return at > 0 ? tool.slice(at + 2) : tool;
+}
+/** The three parts a tool line is said in: before the name, the name, after it. */
+export function toolLineParts(line) {
+    if (line.phase === 'running' && line.words) {
+        return { before: '', name: '', after: line.words };
+    }
+    switch (line.phase) {
+        case 'running':
+            return { before: 'Using ', name: line.name, after: '…' };
+        case 'done':
+            return { before: 'Done: ', name: line.name, after: '' };
+        case 'failed':
+            return { before: '', name: line.name, after: ' failed' };
+    }
+}
+/** A tool line in plain words: "Using list_invoices…". */
+export function toolLineText(line) {
+    const { before, name, after } = toolLineParts(line);
+    return `${before}${name}${after}`;
+}
+/**
+ * The tool line of the conversation's newest item, when that item is a tool
+ * call: running until it is complete or failed. Once words follow it, the
+ * newest item is the answer, and there is no tool line.
+ */
+export function newestToolLine(items) {
+    const newest = items[items.length - 1];
+    if (!newest || typeof newest.toolName !== 'string' || !newest.toolName) {
+        return undefined;
+    }
+    const phase = newest.status === 'error' ||
+        (typeof newest.error === 'string' && newest.error)
+        ? 'failed'
+        : newest.status === 'complete'
+            ? 'done'
+            : 'running';
+    return {
+        id: String(newest.toolCallId ?? newest.id ?? newest.toolName),
+        tool: newest.toolName,
+        name: toolDisplayName(newest.toolName),
+        phase,
+    };
+}
+/** The tool line of a step a peer told: its start running, its end done or failed. */
+export function toolLineOfStep(step, name = toolDisplayName(step.name)) {
+    return {
+        id: step.id ?? step.name,
+        tool: step.name,
+        name,
+        phase: step.error ? 'failed' : step.ended ? 'done' : 'running',
+    };
+}
+/**
+ * What a screen reader hears of a tool line: once when the call starts and
+ * once when it ends — a new id or a new phase — never while it runs.
+ */
+export function toolAnnouncement(line, previous) {
+    if (!line) {
+        return undefined;
+    }
+    if (previous && previous.id === line.id && previous.phase === line.phase) {
+        return undefined;
+    }
+    return toolLineText(line);
+}
+/**
+ * How many messages the conversation holds, as the `history` balloon's
+ * header counts them: the person's and the agent's, not the tool calls.
+ */
+export function conversationCount(items) {
+    return items.filter(item => {
+        const message = item;
+        return ((message.role === 'user' || message.role === 'assistant') &&
+            typeof message.toolName !== 'string');
+    }).length;
+}

package/lib/components/teams/A2ATeamGraph.d.ts

@@ -27,6 +27,7 @@ import { type Edge, type EdgeProps, type Viewport } from '@xyflow/react';
 import '@xyflow/react/dist/base.css';
 import { type A2ATeamCall, type A2ATeamConnection, type A2ATeamFlow } from './a2aTeamFlow';
 import type { A2ATeamPersona } from './useA2ATeam';
+import type { BalloonDisplay } from '../../chat/assistant/toolLine';
 /** One member of the team, as the graph draws it. */
 export type A2ATeamGraphMember = {
     id: string;
@@ -43,6 +44,17 @@ export type A2ATeamGraphMember = {
     onAway?: (away: boolean) => void;
     /** The MCP servers it reaches, drawn under it (`teamConnectionsOf`). */
     connections?: A2ATeamConnection[];
+    /**
+     * How its balloon shows what it says (LOOP T-23): only what it says or
+     * does now (`current`, a team's default) — the words, the tool it calls,
+     * a notebook it was given — or a peek (`history`).
+     */
+    balloonDisplay?: BalloonDisplay;
+    /**
+     * The notebook in its balloon was clicked: by default, the page's
+     * `TeamNotebook` is scrolled to and focused.
+     */
+    onNotebookOpen?: () => void;
 };
 export type A2ATeamGraphProps = {
     /** The member that asks: drawn on the left. */

package/lib/components/teams/A2ATeamGraph.js

@@ -7,9 +7,15 @@ import { Box } from '@datalayer/primer-addons';
 import { AssistantStage } from '../../chat/assistant/AssistantStage';
 import { SpecMark } from '../../chat/marks/SpecMark';
 import { toolWords, } from './a2aTeamFlow';
+import { NotebookPreview, focusTeamNotebook } from './NotebookPreview';
+import { toolLineText } from '../../chat/assistant/toolLine';
 /** The graph's own coordinates: the members, and room above them for their balloons. */
 const NODE_WIDTH = 200;
-const BALLOON_ROOM = 120;
+const BALLOON_ROOM = 144;
+/** The room a balloon that holds a notebook needs above its member. */
+const NOTEBOOK_BALLOON_ROOM = 340;
+/** How tall the notebook in a balloon grows before it scrolls. */
+const NOTEBOOK_PREVIEW_HEIGHT = 180;
 const GAP = 220;
 const WIDTH = NODE_WIDTH * 2 + GAP;
 /** A connection's node: half a member's. */
@@ -70,9 +76,25 @@ const MemberNode = memo(function MemberNode({ data, }) {
                     // middle of the graph: rightward from the left member.
                     place: side === 'left'
                         ? { position: 'absolute', left: 'auto' }
-                        : { position: 'absolute', right: 'auto' }, stageRef: stageRef, onDragStart: () => undefined, open: false, onToggle: member.onToggle ?? (() => undefined), balloon: persona.saying
-                        ? { text: persona.saying, more: persona.saying.endsWith('…') }
-                        : undefined, insist: persona.insist, onDismiss: away => member.onAway?.(away !== 'none'), 
+                        : { position: 'absolute', right: 'auto' }, stageRef: stageRef, onDragStart: () => undefined, open: false, onToggle: member.onToggle ?? (() => undefined), balloonDisplay: member.balloonDisplay ?? 'current', balloon: persona.tool
+                        ? {
+                            text: toolLineText(persona.tool),
+                            tool: persona.tool,
+                            busy: persona.state !== 'idle',
+                        }
+                        : persona.saying
+                            ? {
+                                text: persona.saying,
+                                more: persona.saying.endsWith('…'),
+                                speaking: persona.state === 'speaking',
+                                busy: persona.state === 'thinking' ||
+                                    persona.state === 'working' ||
+                                    persona.state === 'speaking',
+                                // A notebook it was given, read-only: the one that
+                                // runs is under the graph.
+                                attachment: persona.notebook ? (_jsx(NotebookPreview, { notebook: persona.notebook.data, title: persona.notebook.name || 'The notebook', maxHeight: NOTEBOOK_PREVIEW_HEIGHT, onOpen: member.onNotebookOpen ?? focusTeamNotebook })) : undefined,
+                            }
+                            : undefined, insist: persona.insist, onDismiss: away => member.onAway?.(away !== 'none'), 
                     // A member of the graph: what is clicked around it is the graph.
                     stayPut: true })) }), _jsxs(Text, { sx: { fontWeight: 600, textAlign: 'center' }, children: [member.emoji ? `${member.emoji} ` : '', member.name] }), _jsx(Text, { sx: { fontSize: 0, color: 'fg.muted', textAlign: 'center' }, "data-member-where": "", children: member.where }), _jsx(Handle, { type: "source", position: Position.Right, style: HANDLE(size), isConnectable: false }), member.connections?.length ? (_jsx(Handle, { id: "connections", type: "source", position: Position.Bottom, style: { ...HANDLE(size), top: 'auto', bottom: 0 }, isConnectable: false })) : null] }));
 });
@@ -201,7 +223,11 @@ export function A2ATeamGraph({ entry, peer, flow, connected, label = 'A2A', size
     }));
     const placedKey = JSON.stringify(placed);
     const hasConnections = placed.some(({ connections }) => connections.length);
-    const height = Math.ceil((BALLOON_ROOM +
+    // A notebook in a balloon: more room above the members.
+    const room = [entry, peer].some(member => member.persona.notebook)
+        ? NOTEBOOK_BALLOON_ROOM
+        : BALLOON_ROOM;
+    const height = Math.ceil((room +
         memberHeight +
         (hasConnections ? CONNECTION_GAP + connectionHeight : 0)) *
         viewport.zoom);
@@ -209,7 +235,7 @@ export function A2ATeamGraph({ entry, peer, flow, connected, label = 'A2A', size
         {
             id: entry.id,
             type: 'member',
-            position: { x: 0, y: BALLOON_ROOM },
+            position: { x: 0, y: room },
             width: NODE_WIDTH,
             height: memberHeight,
             draggable: false,
@@ -221,7 +247,7 @@ export function A2ATeamGraph({ entry, peer, flow, connected, label = 'A2A', size
         {
             id: peer.id,
             type: 'member',
-            position: { x: NODE_WIDTH + GAP, y: BALLOON_ROOM },
+            position: { x: NODE_WIDTH + GAP, y: room },
             width: NODE_WIDTH,
             height: memberHeight,
             draggable: false,
@@ -236,7 +262,7 @@ export function A2ATeamGraph({ entry, peer, flow, connected, label = 'A2A', size
                 type: 'connection',
                 position: {
                     x: xs[at],
-                    y: BALLOON_ROOM + memberHeight + CONNECTION_GAP,
+                    y: room + memberHeight + CONNECTION_GAP,
                 },
                 width: CONNECTION_WIDTH,
                 height: connectionHeight,
@@ -250,6 +276,7 @@ export function A2ATeamGraph({ entry, peer, flow, connected, label = 'A2A', size
         entry.id,
         peer.id,
         size,
+        room,
         memberHeight,
         placedKey,
         connectionSize,

package/lib/components/teams/NotebookPreview.d.ts

@@ -0,0 +1,39 @@
+/**
+ * A notebook, read-only and small: what a member of the team gave, shown in
+ * its balloon (LOOP T-23, H-29). It is jupyter-react's notebook in read-only
+ * mode (`NotebookPreviewView`): its cells and the outputs it carries, nothing
+ * editable, on a service manager with no kernel (`ServiceManagerLess`) —
+ * nothing runs, and no Pyodide is loaded. The view is imported only when a
+ * notebook is drawn, so a balloon, and the page it is on, stay light until
+ * one arrives. It scrolls within its own height, and a click takes the
+ * reader to the notebook that runs (`TeamNotebook`).
+ *
+ * @module components/teams/NotebookPreview
+ */
+import type { JSX } from 'react';
+/** An nbformat 4 document, as far as the preview checks it. */
+export interface NotebookDocument {
+    cells: unknown[];
+    metadata?: Record<string, unknown>;
+    nbformat?: number;
+    nbformat_minor?: number;
+}
+/** The document a notebook artifact carries, or none when it is not one. */
+export declare function notebookDocument(data: unknown): NotebookDocument | undefined;
+export type NotebookPreviewProps = {
+    /** The nbformat document (an artifact's `data`, parsed or not). */
+    notebook: unknown;
+    /** Its name, said to a screen reader: `Accounting's notebook`. */
+    title: string;
+    /** How tall it is, in pixels; it scrolls within. */
+    maxHeight?: number;
+    /** Takes the reader to the notebook that runs; the line under it says so. */
+    onOpen?: () => void;
+};
+/** A notebook, read-only and small, with the way to the one that runs. */
+export declare function NotebookPreview({ notebook, title, maxHeight, onOpen, }: NotebookPreviewProps): JSX.Element | null;
+/** Where the notebook that runs is: `TeamNotebook` marks its section. */
+export declare const TEAM_NOTEBOOK_SELECTOR = "[data-team-notebook]";
+/** Takes the reader to the notebook that runs: scrolled to, and focused. */
+export declare function focusTeamNotebook(): void;
+export default NotebookPreview;

package/lib/components/teams/NotebookPreview.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Suspense, lazy } from 'react';
+import { Text } from '@primer/react';
+import { Box } from '@datalayer/primer-addons';
+/** jupyter-react's notebook, read-only, with no kernel: loaded when a notebook is drawn. */
+const NotebookPreviewView = lazy(() => import('./NotebookPreviewView'));
+/** The document a notebook artifact carries, or none when it is not one. */
+export function notebookDocument(data) {
+    const parsed = typeof data === 'string'
+        ? (() => {
+            try {
+                return JSON.parse(data);
+            }
+            catch {
+                return undefined;
+            }
+        })()
+        : data;
+    if (parsed &&
+        typeof parsed === 'object' &&
+        Array.isArray(parsed.cells)) {
+        return parsed;
+    }
+    return undefined;
+}
+/** A notebook, read-only and small, with the way to the one that runs. */
+export function NotebookPreview({ notebook, title, maxHeight = 220, onOpen, }) {
+    const doc = notebookDocument(notebook);
+    if (!doc) {
+        return null;
+    }
+    return (_jsxs(Box, { "data-notebook-preview": "", sx: { display: 'flex', flexDirection: 'column', gap: 1, minWidth: 0 }, children: [_jsx(Box, { role: "region", "aria-label": `${title}, read-only`, onClick: onOpen, "data-notebook-preview-cells": doc.cells.length, sx: {
+                    position: 'relative',
+                    height: maxHeight,
+                    overflow: 'hidden',
+                    border: '1px solid',
+                    borderColor: 'border.muted',
+                    borderRadius: 2,
+                    bg: 'canvas.default',
+                    cursor: onOpen ? 'pointer' : 'default',
+                }, children: _jsx(Suspense, { fallback: _jsx(Text, { as: "p", sx: { color: 'fg.muted', fontSize: 0, m: 2 }, children: "Opening the notebook\u2026" }), children: _jsx(NotebookPreviewView, { nbformat: doc, height: maxHeight }) }) }), onOpen ? (_jsx(Text, { as: "button", type: "button", onClick: onOpen, "data-notebook-preview-open": "", sx: {
+                    alignSelf: 'flex-start',
+                    p: 0,
+                    border: 0,
+                    bg: 'transparent',
+                    color: 'accent.fg',
+                    fontSize: 0,
+                    cursor: 'pointer',
+                    '&:hover': { textDecoration: 'underline' },
+                }, children: "Open it below to run it" })) : null] }));
+}
+/** Where the notebook that runs is: `TeamNotebook` marks its section. */
+export const TEAM_NOTEBOOK_SELECTOR = '[data-team-notebook]';
+/** Takes the reader to the notebook that runs: scrolled to, and focused. */
+export function focusTeamNotebook() {
+    const section = document.querySelector(TEAM_NOTEBOOK_SELECTOR);
+    if (!section) {
+        return;
+    }
+    const still = typeof window !== 'undefined' &&
+        !!window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
+    section.scrollIntoView?.({
+        behavior: still ? 'auto' : 'smooth',
+        block: 'start',
+    });
+    section.focus({ preventScroll: true });
+}
+export default NotebookPreview;

package/lib/components/teams/NotebookPreviewView.d.ts

@@ -0,0 +1,21 @@
+/**
+ * jupyter-react's notebook, read-only and with no kernel: the notebook a
+ * member of the team gave, as its balloon shows it (`NotebookPreview`).
+ *
+ * `readonly` makes every cell uneditable; `ServiceManagerLess` is a service
+ * manager that reaches no server and starts no kernel, so nothing here runs
+ * and no Pyodide is loaded — the notebook that runs is `TeamNotebook`'s, on
+ * the browser sandbox. Loaded by `NotebookPreview` when a notebook is drawn,
+ * never before.
+ *
+ * @module components/teams/NotebookPreviewView
+ */
+import type { JSX } from 'react';
+import type { NotebookDocument } from './NotebookPreview';
+export type NotebookPreviewViewProps = {
+    nbformat: NotebookDocument;
+    /** Its height, in pixels: it scrolls within. */
+    height: number;
+};
+export declare function NotebookPreviewView({ nbformat, height, }: NotebookPreviewViewProps): JSX.Element;
+export default NotebookPreviewView;

package/lib/components/teams/NotebookPreviewView.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { useTheme } from '@primer/react';
+import { Box } from '@datalayer/primer-addons';
+import { JupyterReactTheme, Notebook, ServiceManagerLess, } from '@datalayer/jupyter-react';
+/** Each preview has its own id in jupyter-react's store. */
+let drawn = 0;
+export function NotebookPreviewView({ nbformat, height, }) {
+    // A manager with no server and no kernel: nothing can run.
+    const serviceManager = useMemo(() => new ServiceManagerLess(), []);
+    // A new id, and a copy handed once, for each notebook: the notebook
+    // component keeps, and edits in place, the document it is first handed.
+    const id = useMemo(() => {
+        drawn += 1;
+        return `team-notebook-preview-${drawn}`;
+    }, [nbformat]);
+    const content = useMemo(() => JSON.parse(JSON.stringify(nbformat)), [nbformat]);
+    const { colorScheme } = useTheme();
+    return (_jsxs(Box, { "data-notebook-preview-theme": "", sx: { height }, children: [_jsx("span", { "data-jupyter-react-theme-root": "notebook-preview", hidden: true }), _jsx(JupyterReactTheme, { colormode: colorScheme?.startsWith('dark') ? 'dark' : 'light', children: _jsx(Box, { "data-notebook-preview-view": id, sx: {
+                        height,
+                        // No toolbar: no room kept for one.
+                        '& .datalayer-NotebookPanel-header': {
+                            display: 'none',
+                            minHeight: 0,
+                        },
+                        // Small, as a balloon holds it: no prompts, no sidebars, no
+                        // collapsers, the headings a step down.
+                        '& .jp-InputPrompt, & .jp-OutputPrompt, & .jp-Collapser, & .jp-cell-toolbar, & .jp-Notebook-footer': { display: 'none !important' },
+                        '& .jp-Notebook': { padding: '4px !important', fontSize: '12px' },
+                        '& .jp-Cell': { padding: '2px 0 !important' },
+                        '& .jp-Cell .jp-InputArea-editor, & .jp-Cell .jp-OutputArea-output': { marginLeft: '0 !important' },
+                        '& .jp-RenderedHTMLCommon': { paddingRight: 0, fontSize: '12px' },
+                        '& .jp-RenderedHTMLCommon :is(h1, h2, h3, h4)': {
+                            fontSize: '14px',
+                            margin: '2px 0',
+                        },
+                        '& .jp-RenderedHTMLCommon .jp-InternalAnchorLink': {
+                            display: 'none',
+                        },
+                    }, children: _jsx(Notebook, { id: id, nbformat: content, readonly: true, serviceManager: serviceManager, startDefaultKernel: false, height: `${height}px`, cellSidebarMargin: 0 }) }) })] }));
+}
+export default NotebookPreviewView;

package/lib/components/teams/TeamNotebook.js

@@ -17,6 +17,21 @@ export function notebookFileName(notebook) {
 }
 /** A notebook a member of the team gave, under its title, to run in the page. */
 export function TeamNotebook({ notebook, title, height = 560, }) {
-    return (_jsxs(Box, { as: "section", "aria-label": title, "data-team-notebook": "", sx: { display: 'flex', flexDirection: 'column', gap: 2, minWidth: 0 }, children: [_jsx(Heading, { as: "h3", sx: { fontSize: 2, m: 0 }, children: title }), _jsx(Suspense, { fallback: _jsx(Text, { as: "p", sx: { color: 'fg.muted', fontSize: 1, m: 0 }, children: "Opening the notebook\u2026" }), children: _jsx(TeamNotebookView, { notebook: notebook, fileName: notebookFileName(notebook), height: height }) })] }));
+    return (_jsxs(Box, { as: "section", "aria-label": title, "data-team-notebook": "", 
+        // Focused when the notebook in a balloon is clicked (`focusTeamNotebook`).
+        tabIndex: -1, sx: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 2,
+            minWidth: 0,
+            scrollMarginTop: '16px',
+            '&:focus': { outline: 'none' },
+            '&:focus-visible': {
+                outline: '2px solid',
+                outlineColor: 'var(--focus-outlineColor, var(--fgColor-accent))',
+                outlineOffset: 4,
+                borderRadius: 2,
+            },
+        }, children: [_jsx(Heading, { as: "h3", sx: { fontSize: 2, m: 0 }, children: title }), _jsx(Suspense, { fallback: _jsx(Text, { as: "p", sx: { color: 'fg.muted', fontSize: 1, m: 0 }, children: "Opening the notebook\u2026" }), children: _jsx(TeamNotebookView, { notebook: notebook, fileName: notebookFileName(notebook), height: height }) })] }));
 }
 export default TeamNotebook;

package/lib/components/teams/a2aTeamFlow.d.ts

@@ -78,6 +78,11 @@ export declare const CALL_SHOWN_MS = 900;
 export declare function connectionOfTool(tool: string, connections: A2ATeamConnection[]): A2ATeamConnection | undefined;
 /** A tool's name in a few words, without its connection's prefix: `list invoices`. */
 export declare function toolWords(tool: string, connection?: A2ATeamConnection): string;
+/**
+ * A tool's own name, without its connection's prefix: `list_invoices` for
+ * `odoo_accounting_list_invoices` — as a balloon says it (LOOP T-23).
+ */
+export declare function toolOwnName(tool: string, connections: A2ATeamConnection[]): string;
 /**
  * The calls running after an event of the peer's (`member`): a call it
  * starts to one of its connections is added; its end marks it ended, and

package/lib/components/teams/a2aTeamFlow.js

@@ -52,6 +52,17 @@ export function toolWords(tool, connection) {
     }
     return name.replace(/[_-]+/g, ' ').trim() || tool;
 }
+/**
+ * A tool's own name, without its connection's prefix: `list_invoices` for
+ * `odoo_accounting_list_invoices` — as a balloon says it (LOOP T-23).
+ */
+export function toolOwnName(tool, connections) {
+    const prefix = connectionOfTool(tool, connections)?.prefix;
+    if (prefix && tool.includes(prefix)) {
+        return tool.slice(tool.indexOf(prefix) + prefix.length) || tool;
+    }
+    return tool;
+}
 /**
  * The calls running after an event of the peer's (`member`): a call it
  * starts to one of its connections is added; its end marks it ended, and

package/lib/components/teams/index.d.ts

@@ -11,3 +11,4 @@ export * from './teamConnections';
 export * from './useA2ATeam';
 export * from './A2ATeamGraph';
 export * from './TeamNotebook';
+export * from './NotebookPreview';

package/lib/components/teams/index.js

@@ -15,3 +15,4 @@ export * from './teamConnections';
 export * from './useA2ATeam';
 export * from './A2ATeamGraph';
 export * from './TeamNotebook';
+export * from './NotebookPreview';

package/lib/components/teams/useA2ATeam.d.ts

@@ -3,6 +3,7 @@ import { type BrowserModelOptions } from '../../runtimes/browser/model';
 import { type A2APeer, type A2APeerArtifact } from '../../runtimes/browser/a2aPeer';
 import type { AppSpec } from '../../types/agentspecs';
 import { type A2ATeamCall, type A2ATeamConnection, type A2ATeamFlow } from './a2aTeamFlow';
+import { type BalloonToolLine } from '../../chat/assistant/toolLine';
 /** What one member's character does: its state, its balloon, and whether it was sent away. */
 export type A2ATeamPersona = {
     state: AssistantState;
@@ -11,6 +12,13 @@ export type A2ATeamPersona = {
     /** Whether the balloon shows without the pointer over it. */
     insist: boolean;
     away: boolean;
+    /**
+     * The tool it calls now, or just called (LOOP T-23): "Using
+     * list_invoices…", "Asking Accounting…"; said in place of its words.
+     */
+    tool?: BalloonToolLine;
+    /** A notebook it was given: in its balloon, read-only, under its words. */
+    notebook?: A2APeerArtifact;
 };
 export declare const AT_REST: A2ATeamPersona;
 /** One turn of the conversation with the entry. */