@datalayer/agent-runtimes 1.3.29 → 1.3.32

package/lib/chat/assistant/characters.js

@@ -1,33 +1,198 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const INK = '#1D1D1F';
+import { loopColors } from '@datalayer/primer-addons/lib/theme';
+const INK = loopColors.ink;
+const INK_DARK = loopColors.inkDark;
 /** Two eyes with lids that blink and pupils that look about. */
-function Eyes({ cx, cy, gap, r, }) {
+function Eyes({ cx, cy, gap, r, colours, }) {
     const left = cx - gap / 2;
     const right = cx + gap / 2;
-    return (_jsxs("g", { children: [_jsx("circle", { cx: left, cy: cy, r: r, fill: "#FFFFFF", stroke: INK, strokeWidth: 1.5 }), _jsx("circle", { cx: right, cy: cy, r: r, fill: "#FFFFFF", stroke: INK, strokeWidth: 1.5 }), _jsxs("g", { className: "assistant-pupils", children: [_jsx("circle", { cx: left + r * 0.15, cy: cy + r * 0.1, r: r * 0.45, fill: INK }), _jsx("circle", { cx: right + r * 0.15, cy: cy + r * 0.1, r: r * 0.45, fill: INK }), _jsx("circle", { cx: left + r * 0.3, cy: cy - r * 0.1, r: r * 0.14, fill: "#FFFFFF" }), _jsx("circle", { cx: right + r * 0.3, cy: cy - r * 0.1, r: r * 0.14, fill: "#FFFFFF" })] }), _jsxs("g", { className: "assistant-lids", children: [_jsx("ellipse", { cx: left, cy: cy, rx: r + 0.5, ry: r + 0.5, fill: "currentColor" }), _jsx("ellipse", { cx: right, cy: cy, rx: r + 0.5, ry: r + 0.5, fill: "currentColor" })] })] }));
+    return (_jsxs("g", { children: [_jsx("circle", { cx: left, cy: cy, r: r, fill: colours.white, stroke: colours.ring, strokeWidth: 1.5 }), _jsx("circle", { cx: right, cy: cy, r: r, fill: colours.white, stroke: colours.ring, strokeWidth: 1.5 }), _jsxs("g", { className: "assistant-pupils", children: [_jsx("circle", { cx: left + r * 0.15, cy: cy + r * 0.1, r: r * 0.45, fill: colours.pupil }), _jsx("circle", { cx: right + r * 0.15, cy: cy + r * 0.1, r: r * 0.45, fill: colours.pupil }), _jsx("circle", { cx: left + r * 0.3, cy: cy - r * 0.1, r: r * 0.14, fill: colours.white }), _jsx("circle", { cx: right + r * 0.3, cy: cy - r * 0.1, r: r * 0.14, fill: colours.white })] }), _jsxs("g", { className: "assistant-lids", children: [_jsx("ellipse", { cx: left, cy: cy, rx: r + 0.5, ry: r + 0.5, fill: colours.lid }), _jsx("ellipse", { cx: right, cy: cy, rx: r + 0.5, ry: r + 0.5, fill: colours.lid })] })] }));
 }
+/**
+ * Each drawing's colours, light and dark. The dark ones are drawn for the
+ * `loop` theme's dark page (near-black, `loopColors.black`) and not the light
+ * drawing on black: lines that were ink turn to the dark mode's ink, the
+ * steel and the violets go lighter, outlines that a light page needs give
+ * way to the fill's own edge.
+ */
+const PAPER_CLIP = {
+    light: {
+        wire: '#7A808A',
+        shine: '#E3E6EB',
+        line: INK,
+        eye: { white: loopColors.white, ring: INK, pupil: INK, lid: '#B8BDC6' },
+    },
+    dark: {
+        wire: '#C9CED6',
+        shine: '#8D93A0',
+        line: INK_DARK,
+        eye: {
+            white: INK_DARK,
+            ring: loopColors.grayDark,
+            pupil: INK,
+            lid: '#8D93A0',
+        },
+    },
+};
+const WIZARD = {
+    light: {
+        hat: '#6E5CD6',
+        brim: '#4A3C9E',
+        robe: '#5B4BB7',
+        face: '#F2D3B3',
+        faceEdge: '#A0694A',
+        beard: '#F4F4F6',
+        beardEdge: '#7A808A',
+        star: '#F8D469',
+        eye: { white: loopColors.white, ring: INK, pupil: INK, lid: '#F2D3B3' },
+    },
+    dark: {
+        hat: '#9C88F0',
+        brim: '#7B67DB',
+        robe: '#8F7CE8',
+        face: '#E8C4A0',
+        faceEdge: '#E8C4A0',
+        beard: '#E4E4EA',
+        beardEdge: loopColors.grayDark,
+        star: '#F8D469',
+        eye: { white: INK_DARK, ring: INK, pupil: INK, lid: '#E8C4A0' },
+    },
+};
+const CAT = {
+    light: {
+        fur: '#F4A261',
+        edge: '#B4571A',
+        tail: '#E08A45',
+        ear: '#F6A5C1',
+        nose: '#B83A6B',
+        whiskers: INK,
+        eye: { white: loopColors.white, ring: INK, pupil: INK, lid: '#F4A261' },
+    },
+    dark: {
+        fur: '#F4A261',
+        edge: '#F4A261',
+        tail: '#E08A45',
+        ear: '#F6A5C1',
+        nose: '#B83A6B',
+        whiskers: INK_DARK,
+        eye: { white: INK_DARK, ring: INK, pupil: INK, lid: '#F4A261' },
+    },
+};
+const LOOP_EYES = {
+    light: {
+        eye: { white: loopColors.white, ring: INK, pupil: INK, lid: '#E3E6EB' },
+    },
+    dark: {
+        eye: {
+            white: INK_DARK,
+            ring: INK_DARK,
+            pupil: loopColors.black,
+            lid: loopColors.grayDark,
+        },
+    },
+};
 /** A paper clip of our own: a bent wire with eyes on its upper loop. */
-function PaperClip({ size }) {
-    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Paper clip", style: { color: '#B8BDC6' }, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: "M40 86 L40 30 Q40 14 52 14 Q64 14 64 30 L64 74 Q64 82 56 82 Q48 82 48 74 L48 36", fill: "none", stroke: "#9AA0AA", strokeWidth: 6, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M40 86 L40 30 Q40 14 52 14 Q64 14 64 30 L64 74 Q64 82 56 82 Q48 82 48 74 L48 36", fill: "none", stroke: "#E3E6EB", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M36 22 Q42 18 47 21", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx("path", { d: "M57 21 Q62 18 68 22", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx(Eyes, { cx: 52, cy: 30, gap: 16, r: 6.5 }), _jsx("path", { className: "assistant-mouth", d: "M48 44 Q52 47 56 44", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" })] }) }));
+function PaperClip({ size, mode = 'light', }) {
+    const c = PAPER_CLIP[mode];
+    const wire = 'M40 86 L40 30 Q40 14 52 14 Q64 14 64 30 L64 74 Q64 82 56 82 Q48 82 48 74 L48 36';
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Paper clip", "data-assistant-mode": mode, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: wire, fill: "none", stroke: c.wire, strokeWidth: 6, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: wire, fill: "none", stroke: c.shine, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M36 22 Q42 18 47 21", stroke: c.line, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx("path", { d: "M57 21 Q62 18 68 22", stroke: c.line, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx(Eyes, { cx: 52, cy: 30, gap: 16, r: 6.5, colours: c.eye }), _jsx("path", { className: "assistant-mouth", d: "M48 44 Q52 47 56 44", stroke: c.line, strokeWidth: 2, fill: "none", strokeLinecap: "round" })] }) }));
 }
 /** A wizard: a starred hat, a white beard, kind eyes. */
-function Wizard({ size }) {
-    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Wizard", style: { color: '#F2D3B3' }, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: "M24 92 Q48 58 72 92 Z", fill: "#5B4BB7" }), _jsx("circle", { cx: 48, cy: 48, r: 17, fill: "#F2D3B3" }), _jsx("path", { d: "M31 50 Q48 92 65 50 Q57 60 48 60 Q39 60 31 50 Z", fill: "#F4F4F6", stroke: "#D9DAE0", strokeWidth: 1 }), _jsx("path", { d: "M22 36 L48 2 L74 36 Q48 30 22 36 Z", fill: "#6E5CD6" }), _jsx("path", { d: "M20 37 Q48 29 76 37 Q48 43 20 37 Z", fill: "#4A3C9E" }), _jsx("path", { d: "M52 14 l2 4 4 1 -3 3 1 4 -4 -2 -4 2 1 -4 -3 -3 4 -1 Z", fill: "#F8D469" }), _jsx("circle", { cx: 40, cy: 26, r: 1.8, fill: "#F8D469" }), _jsx(Eyes, { cx: 48, cy: 46, gap: 13, r: 5 }), _jsx("path", { className: "assistant-mouth", d: "M44 58 Q48 61 52 58", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" })] }) }));
+function Wizard({ size, mode = 'light', }) {
+    const c = WIZARD[mode];
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Wizard", "data-assistant-mode": mode, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: "M24 92 Q48 58 72 92 Z", fill: c.robe }), _jsx("circle", { cx: 48, cy: 48, r: 17, fill: c.face, stroke: c.faceEdge, strokeWidth: 1.5 }), _jsx("path", { d: "M31 50 Q48 92 65 50 Q57 60 48 60 Q39 60 31 50 Z", fill: c.beard, stroke: c.beardEdge, strokeWidth: 1.2 }), _jsx("path", { d: "M22 36 L48 2 L74 36 Q48 30 22 36 Z", fill: c.hat }), _jsx("path", { d: "M20 37 Q48 29 76 37 Q48 43 20 37 Z", fill: c.brim }), _jsx("path", { d: "M52 14 l2 4 4 1 -3 3 1 4 -4 -2 -4 2 1 -4 -3 -3 4 -1 Z", fill: c.star }), _jsx("circle", { cx: 40, cy: 26, r: 1.8, fill: c.star }), _jsx(Eyes, { cx: 48, cy: 46, gap: 13, r: 5, colours: c.eye }), _jsx("path", { className: "assistant-mouth", d: "M44 58 Q48 61 52 58", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" })] }) }));
 }
 /** A cat: round, two ears, whiskers, a tail. */
-function Cat({ size }) {
-    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Cat", style: { color: '#F4A261' }, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: "M70 84 Q90 78 84 58", stroke: "#E08A45", strokeWidth: 6, fill: "none", strokeLinecap: "round" }), _jsx("ellipse", { cx: 48, cy: 78, rx: 24, ry: 14, fill: "#F4A261" }), _jsx("path", { d: "M24 30 L28 8 L42 22 Z", fill: "#F4A261" }), _jsx("path", { d: "M72 30 L68 8 L54 22 Z", fill: "#F4A261" }), _jsx("path", { d: "M28 26 L30 14 L38 22 Z", fill: "#F6A5C1" }), _jsx("path", { d: "M68 26 L66 14 L58 22 Z", fill: "#F6A5C1" }), _jsx("circle", { cx: 48, cy: 42, r: 24, fill: "#F4A261" }), _jsx(Eyes, { cx: 48, cy: 38, gap: 18, r: 6.5 }), _jsx("path", { d: "M45 48 L51 48 L48 52 Z", fill: "#B83A6B" }), _jsx("path", { className: "assistant-mouth", d: "M43 55 Q48 58 53 55", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx("path", { d: "M30 48 L18 46 M30 52 L18 54 M66 48 L78 46 M66 52 L78 54", stroke: INK, strokeWidth: 1.2, strokeLinecap: "round" })] }) }));
+function Cat({ size, mode = 'light', }) {
+    const c = CAT[mode];
+    const tail = 'M70 84 Q90 78 84 58';
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "Cat", "data-assistant-mode": mode, children: _jsxs("g", { className: "assistant-body", children: [_jsx("path", { d: tail, stroke: c.edge, strokeWidth: 8, fill: "none", strokeLinecap: "round" }), _jsx("path", { d: tail, stroke: c.tail, strokeWidth: 5, fill: "none", strokeLinecap: "round" }), _jsx("ellipse", { cx: 48, cy: 78, rx: 24, ry: 14, fill: c.fur, stroke: c.edge, strokeWidth: 1.5 }), _jsx("path", { d: "M24 30 L28 8 L42 22 Z", fill: c.fur, stroke: c.edge, strokeWidth: 1.5, strokeLinejoin: "round" }), _jsx("path", { d: "M72 30 L68 8 L54 22 Z", fill: c.fur, stroke: c.edge, strokeWidth: 1.5, strokeLinejoin: "round" }), _jsx("path", { d: "M28 26 L30 14 L38 22 Z", fill: c.ear }), _jsx("path", { d: "M68 26 L66 14 L58 22 Z", fill: c.ear }), _jsx("circle", { cx: 48, cy: 42, r: 24, fill: c.fur, stroke: c.edge, strokeWidth: 1.5 }), _jsx(Eyes, { cx: 48, cy: 38, gap: 18, r: 6.5, colours: c.eye }), _jsx("path", { d: "M45 48 L51 48 L48 52 Z", fill: c.nose }), _jsx("path", { className: "assistant-mouth", d: "M43 55 Q48 58 53 55", stroke: INK, strokeWidth: 2, fill: "none", strokeLinecap: "round" }), _jsx("path", { d: "M30 48 L18 46 M30 52 L18 54 M66 48 L78 46 M66 52 L78 54", stroke: c.whiskers, strokeWidth: 1.2, strokeLinecap: "round" })] }) }));
 }
 /** The L👀P eyes: the product's own face, two eyes and nothing else. */
-function LoopEyes({ size }) {
-    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "L\uD83D\uDC40P eyes", style: { color: '#FFFFFF' }, children: _jsxs("g", { className: "assistant-body", children: [_jsx(Eyes, { cx: 48, cy: 50, gap: 40, r: 18 }), _jsx("path", { className: "assistant-mouth", d: "M42 80 Q48 84 54 80", stroke: INK, strokeWidth: 2.5, fill: "none", strokeLinecap: "round", opacity: 0 })] }) }));
+function LoopEyes({ size, mode = 'light', }) {
+    const c = LOOP_EYES[mode];
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 96 96", role: "img", "aria-label": "L\uD83D\uDC40P eyes", "data-assistant-mode": mode, children: _jsxs("g", { className: "assistant-body", children: [_jsx(Eyes, { cx: 48, cy: 50, gap: 40, r: 18, colours: c.eye }), _jsx("path", { className: "assistant-mouth", d: "M42 80 Q48 84 54 80", stroke: mode === 'dark' ? INK_DARK : INK, strokeWidth: 2.5, fill: "none", strokeLinecap: "round", opacity: 0 })] }) }));
 }
+const eyeOf = (eye, on) => ({
+    white: eye.white,
+    ring: eye.ring,
+    pupil: eye.pupil,
+    on,
+});
 /** The characters Datalayer ships, in the order a picker shows them. */
 export const ASSISTANT_CHARACTERS = [
-    { id: 'paperclip', name: 'Paper clip', Drawing: PaperClip },
-    { id: 'wizard', name: 'Wizard', Drawing: Wizard },
-    { id: 'cat', name: 'Cat', Drawing: Cat },
-    { id: 'eyes', name: 'L👀P eyes', Drawing: LoopEyes },
+    {
+        id: 'paperclip',
+        name: 'Paper clip',
+        Drawing: PaperClip,
+        keyColours: {
+            light: {
+                edges: [PAPER_CLIP.light.wire, PAPER_CLIP.light.line],
+                eye: eyeOf(PAPER_CLIP.light.eye, 'page'),
+            },
+            dark: {
+                edges: [PAPER_CLIP.dark.wire, PAPER_CLIP.dark.line],
+                eye: eyeOf(PAPER_CLIP.dark.eye, 'page'),
+            },
+        },
+    },
+    {
+        id: 'wizard',
+        name: 'Wizard',
+        Drawing: Wizard,
+        keyColours: {
+            light: {
+                edges: [
+                    WIZARD.light.hat,
+                    WIZARD.light.brim,
+                    WIZARD.light.robe,
+                    WIZARD.light.faceEdge,
+                    WIZARD.light.beardEdge,
+                ],
+                eye: eyeOf(WIZARD.light.eye, WIZARD.light.face),
+            },
+            dark: {
+                edges: [
+                    WIZARD.dark.hat,
+                    WIZARD.dark.brim,
+                    WIZARD.dark.robe,
+                    WIZARD.dark.faceEdge,
+                    WIZARD.dark.beardEdge,
+                ],
+                eye: eyeOf(WIZARD.dark.eye, WIZARD.dark.face),
+            },
+        },
+    },
+    {
+        id: 'cat',
+        name: 'Cat',
+        Drawing: Cat,
+        keyColours: {
+            light: {
+                edges: [CAT.light.edge, CAT.light.whiskers],
+                eye: eyeOf(CAT.light.eye, CAT.light.fur),
+            },
+            dark: {
+                edges: [CAT.dark.edge, CAT.dark.whiskers],
+                eye: eyeOf(CAT.dark.eye, CAT.dark.fur),
+            },
+        },
+    },
+    {
+        id: 'eyes',
+        name: 'L👀P eyes',
+        Drawing: LoopEyes,
+        keyColours: {
+            light: {
+                edges: [LOOP_EYES.light.eye.ring],
+                eye: eyeOf(LOOP_EYES.light.eye, 'page'),
+            },
+            dark: {
+                edges: [LOOP_EYES.dark.eye.white],
+                eye: eyeOf(LOOP_EYES.dark.eye, 'page'),
+            },
+        },
+    },
 ];
 /** The character an assistant shows when none is chosen. */
 export const DEFAULT_ASSISTANT_CHARACTER = 'paperclip';

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

@@ -60,3 +60,31 @@ export declare const ASSISTANT_AWAY_KEY = "datalayer-assistant-away";
 export declare function keptAway(): AssistantAway;
 /** Keep the choice where it lasts as long as it says; `none` forgets it. */
 export declare function keepAway(away: AssistantAway): void;
+/** A box on the screen, as `getBoundingClientRect` gives it. */
+export interface ScreenBox {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+}
+/**
+ * What the assistant never sits over (T-27): an open dialog or overlay —
+ * Primer's `Dialog`, an `ActionMenu` or `SelectPanel` overlay, a native
+ * `<dialog>` — and the composer of a chat.
+ */
+export declare const ASSISTANT_OBSTACLES: string;
+/** How near the pointer works, in pixels, before the assistant steps aside. */
+export declare const POINTER_ROOM = 24;
+/** How long the pointer stays away before the assistant comes back, in ms. */
+export declare const POINTER_CALM_MS = 1500;
+/** Whether two boxes share any area, the first grown by `margin`. */
+export declare function boxesMeet(a: ScreenBox, b: ScreenBox, margin?: number): boolean;
+/**
+ * Whether the pointer at `point` works where the assistant stands: over it,
+ * or within `POINTER_ROOM` of it — a press beside it is aimed at what it
+ * hides or crowds.
+ */
+export declare function pointerNear(box: ScreenBox, point: {
+    x: number;
+    y: number;
+}, room?: number): boolean;

package/lib/chat/assistant/state.js

@@ -114,3 +114,34 @@ export function keepAway(away) {
         // Without storage the choice holds for the page.
     }
 }
+/**
+ * What the assistant never sits over (T-27): an open dialog or overlay —
+ * Primer's `Dialog`, an `ActionMenu` or `SelectPanel` overlay, a native
+ * `<dialog>` — and the composer of a chat.
+ */
+export const ASSISTANT_OBSTACLES = [
+    '[role="dialog"]',
+    '[role="alertdialog"]',
+    'dialog[open]',
+    '[class*="prc-Overlay-Overlay"]',
+    '[data-chat-composer]',
+].join(', ');
+/** How near the pointer works, in pixels, before the assistant steps aside. */
+export const POINTER_ROOM = 24;
+/** How long the pointer stays away before the assistant comes back, in ms. */
+export const POINTER_CALM_MS = 1500;
+/** Whether two boxes share any area, the first grown by `margin`. */
+export function boxesMeet(a, b, margin = 0) {
+    return (a.left - margin < b.right &&
+        b.left < a.right + margin &&
+        a.top - margin < b.bottom &&
+        b.top < a.bottom + margin);
+}
+/**
+ * Whether the pointer at `point` works where the assistant stands: over it,
+ * or within `POINTER_ROOM` of it — a press beside it is aimed at what it
+ * hides or crowds.
+ */
+export function pointerNear(box, point, room = POINTER_ROOM) {
+    return boxesMeet(box, { left: point.x, top: point.y, right: point.x, bottom: point.y }, room);
+}

package/lib/chat/base/ChatBase.js

@@ -48,7 +48,7 @@ import { InputPrompt } from '../prompt/InputPrompt';
 import { isFloatingChatViewMode } from '../viewModes';
 import { ToolApprovalBanner, ToolApprovalDialog, } from '../tools';
 import { EphemeralNotebook } from '../notebook/EphemeralNotebook';
-import { initialModelId, isOffered, usableModels } from './modelChoice';
+import { initialModelId, isOffered, offeredModels as offeredModelsFor, } from './modelChoice';
 // EphemeralDocument statically imports `@datalayer/jupyter-lexical` (which
 // initialises Lumino-backed nodes on load). Lazy-load it so notebook-only chats
 // never pull lexical into the bundle or trigger its module side effects.
@@ -1380,37 +1380,46 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
         : undefined;
     const offeredModels = useMemo(() => {
         // Only what can actually be called — see `modelChoice` for the rule.
-        const fromConfig = availableModels || configQuery.data?.models;
-        if (fromConfig?.length) {
-            return usableModels(fromConfig);
-        }
-        /*
-         * The catalogue, filtered to what is worth offering.
-         *
-         * A server tells the chat which models it can reach and that answer wins.
-         * Without one — an in-page agent, or a server that has not answered yet —
-         * this used to offer the single model the protocol was built with, which
-         * is a menu with nothing to choose.
-         *
-         * `available` is the filter, not the whole catalogue: twenty-six models,
-         * most of them superseded, is a list nobody reads. The specs say which
-         * four are current.
-         */
-        const catalogued = Object.values(AI_MODEL_CATALOGUE)
-            // A typed-judgment model answers typed questions, not a chat.
-            .filter(model => model.available && isChatModel(model))
-            .map(model => ({
-            id: model.id,
-            name: model.name,
-            provider: model.provider,
-        }));
-        if (catalogued.length > 0) {
-            return usableModels(catalogued);
-        }
-        return browserModel
-            ? [{ id: browserModel, name: browserModel, provider: 'inference' }]
-            : [];
-    }, [availableModels, configQuery.data?.models, browserModel]);
+        // The runtime's answer, when it gave one, is the whole list.
+        // A runtime that was asked and did not answer offers nothing: the
+        // agentspecs catalogue below is not its answer.
+        const fromConfig = availableModels ||
+            configQuery.data?.models ||
+            (configQuery.isError ? [] : undefined);
+        return offeredModelsFor(fromConfig, () => {
+            /*
+             * The catalogue, filtered to what is worth offering.
+             *
+             * A server tells the chat which models it can reach and that answer wins.
+             * Without one — an in-page agent, or a server that has not answered yet —
+             * this used to offer the single model the protocol was built with, which
+             * is a menu with nothing to choose.
+             *
+             * `available` is the filter, not the whole catalogue: twenty-six models,
+             * most of them superseded, is a list nobody reads. The specs say which
+             * four are current.
+             */
+            const catalogued = Object.values(AI_MODEL_CATALOGUE)
+                // A typed-decision model answers typed questions, not a chat.
+                .filter(model => model.available && isChatModel(model))
+                .map(model => ({
+                id: model.id,
+                name: model.name,
+                provider: model.provider,
+            }));
+            if (catalogued.length > 0) {
+                return catalogued;
+            }
+            return browserModel
+                ? [{ id: browserModel, name: browserModel, provider: 'inference' }]
+                : [];
+        });
+    }, [
+        availableModels,
+        configQuery.data?.models,
+        configQuery.isError,
+        browserModel,
+    ]);
     /*
      * Who `@` may address.
      *
@@ -2115,9 +2124,13 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
         const store = useConversationStore.getState();
         const currentlyFetching = store.isFetching(historyScopeId);
         const storedMessages = store.getMessages(historyScopeId);
-        // 1) Fast local hydration for view switches in the same browser session.
+        // 1) Fast local hydration for view switches in the same browser session:
+        // only into an empty conversation. The saved copy holds messages, not
+        // tool calls, and this effect runs again on every change of the socket's
+        // state — put over a live conversation, it erased its tool cards, a
+        // pending approval among them, at the socket's first retry.
         if (storedMessages.length > 0) {
-            setDisplayItems(storedMessages);
+            setDisplayItems(prev => (prev.length > 0 ? prev : storedMessages));
             setHistoryLoaded(true);
         }
         if (currentlyFetching) {
@@ -2375,16 +2388,24 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
                         const incomingId = event.message.id;
                         const currentId = currentAssistantMessageRef.current?.id;
                         const isNewMessage = !currentId || (incomingId && incomingId !== currentId);
-                        if (currentAssistantMessageRef.current && !isNewMessage) {
+                        if (currentId && !isNewMessage) {
+                            /*
+                             * The message to write to is the one current now, as the event
+                             * arrives — not whichever the ref names when React gets round
+                             * to running the updater. A whole answer in one network chunk
+                             * queues every delta's updater in the same task, and the turn's
+                             * end clears the ref before any of them runs: read lazily, all
+                             * but the first found nothing to update, and the conversation
+                             * and the balloon showed only the answer's first word.
+                             */
+                            const rawContent = event.message.content;
+                            const sanitizedContent = typeof rawContent === 'string'
+                                ? sanitizeAssistantContent(rawContent)
+                                : (rawContent ?? '');
                             setDisplayItems(prev => {
                                 const newItems = [...prev];
-                                const idx = newItems.findIndex(item => !isToolCallMessage(item) &&
-                                    item.id === currentAssistantMessageRef.current?.id);
+                                const idx = newItems.findIndex(item => !isToolCallMessage(item) && item.id === currentId);
                                 if (idx >= 0 && !isToolCallMessage(newItems[idx])) {
-                                    const rawContent = event.message?.content;
-                                    const sanitizedContent = typeof rawContent === 'string'
-                                        ? sanitizeAssistantContent(rawContent)
-                                        : (rawContent ?? '');
                                     newItems[idx] = {
                                         ...newItems[idx],
                                         content: sanitizedContent,
@@ -2392,14 +2413,8 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
                                 }
                                 return newItems;
                             });
-                            if (useStoreMode && currentAssistantMessageRef.current) {
-                                const rawContent = event.message?.content;
-                                const sanitizedContent = typeof rawContent === 'string'
-                                    ? sanitizeAssistantContent(rawContent)
-                                    : (rawContent ?? '');
-                                useChatStore
-                                    .getState()
-                                    .updateMessage(currentAssistantMessageRef.current.id, {
+                            if (useStoreMode) {
+                                useChatStore.getState().updateMessage(currentId, {
                                     content: sanitizedContent,
                                 });
                             }
@@ -3087,6 +3102,7 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
             // The same reset the header's + performs, for a host whose controls
             // live outside this component — the LOOP prompt's + reaches it here.
             newChat: handleNewChat,
+            thread: () => threadIdRef.current,
         });
         return () => {
             onSendReady(null);
@@ -3481,7 +3497,15 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
         promptHistory: configQuery.data?.promptHistory, showTokenUsage: showTokenUsage, showContextRing: showContextRing, agentUsage: agentUsage, showModelSelector: showModelSelector, showToolsMenu: showToolsMenu, showSkillsMenu: showSkillsMenu, codemodeEnabled: codemodeEnabled, onToggleCodemode: onToggleCodemode, isA2AProtocol: isA2AProtocol, showAgentsMenu: showAgentsMenu, agents: footerAgents, selectedAgentId: selectedAgentId ?? footerAgents[0]?.id, onSelectAgent: onSelectAgent, hasConfigData: !!configQuery.data, hasSkillsData: !!skillsQuery.data, 
         // So the bar can tell "not here yet" from "not coming": a chat whose
         // agent has no config endpoint waits for ever otherwise.
-        configLoading: configQuery.isLoading, models: offeredModels, selectedModel: selectedModel, onModelSelect: setSelectedModel, availableTools: builtinTools, mcpServers: filteredMcpServers, enabledMcpTools: enabledMcpTools, enabledMcpToolCount: getEnabledMcpToolNames().length, onToggleMcpTool: toggleMcpTool, onToggleAllMcpServerTools: toggleAllMcpServerTools, approvedMcpTools: approvedMcpTools, onToggleMcpToolApproval: toggleMcpToolApproval, skills: skillsQuery.data?.skills || [], skillsLoading: !!skillsQuery.isLoading, enabledSkills: enabledSkills, onToggleSkill: toggleSkill, onToggleAllSkills: toggleAllSkills, approvedSkills: approvedSkills, onToggleSkillApproval: toggleSkillApproval, apiBase: indicatorApiBase, authToken: protocol?.authToken, mcpStatusData: effectiveMcpStatusData })) : null;
+        configLoading: configQuery.isLoading, models: offeredModels, 
+        // Listed apart and read-only: a typed-decision model is never the
+        // agent's model.
+        decisions: configQuery.data
+            ? {
+                models: configQuery.data.decisionModels,
+                note: configQuery.data.decisionsNote,
+            }
+            : undefined, selectedModel: selectedModel, onModelSelect: setSelectedModel, availableTools: builtinTools, mcpServers: filteredMcpServers, enabledMcpTools: enabledMcpTools, enabledMcpToolCount: getEnabledMcpToolNames().length, onToggleMcpTool: toggleMcpTool, onToggleAllMcpServerTools: toggleAllMcpServerTools, approvedMcpTools: approvedMcpTools, onToggleMcpToolApproval: toggleMcpToolApproval, skills: skillsQuery.data?.skills || [], skillsLoading: !!skillsQuery.isLoading, enabledSkills: enabledSkills, onToggleSkill: toggleSkill, onToggleAllSkills: toggleAllSkills, approvedSkills: approvedSkills, onToggleSkillApproval: toggleSkillApproval, apiBase: indicatorApiBase, authToken: protocol?.authToken, mcpStatusData: effectiveMcpStatusData })) : null;
     // Shared header element. It is rendered either at the top of the chat (when
     // no ephemeral notebook is shown) or INSIDE the chat body column (when the
     // notebook is visible) so the header always follows the chat body across all

package/lib/chat/base/modelChoice.d.ts

@@ -26,6 +26,17 @@ export declare const isUsable: (model: ModelConfig) => boolean;
  * while the rows and their reasons say which key is missing.
  */
 export declare function usableModels(models: ModelConfig[]): ModelConfig[];
+/**
+ * The models a chat offers, given what its runtime answered.
+ *
+ * The runtime's answer is the list: an agent's own models (its `model` and
+ * `model_additionals`), each flagged with whether its inference serves it.
+ * When the runtime answered, nothing else is added — not even when its list
+ * is empty, which says the agent has nothing to switch to. `fallback` is
+ * asked only when there is no runtime to answer (an in-page agent) or it
+ * has not answered yet.
+ */
+export declare function offeredModels(fromRuntime: ModelConfig[] | undefined, fallback: () => ModelConfig[]): ModelConfig[];
 /** Whether `id` is on offer and usable — the selection may stand. */
 export declare const isOffered: (offered: ModelConfig[], id?: string) => boolean;
 /**
@@ -46,9 +57,28 @@ export type ServerCatalogueModel = {
     name?: string;
     available?: boolean;
     missing_env_vars?: string[];
-    reason?: string;
+    reason?: string | null;
     warning?: string | null;
 };
+/**
+ * The typed-decision models a runtime lists apart (Jev).
+ *
+ * They answer a decision's typed questions, not a conversation: the menu
+ * shows them read-only, under their own heading, with `note` saying so, and
+ * never offers one as the agent's model.
+ */
+export type Decisions = {
+    models: ModelConfig[];
+    note: string;
+};
+/** The runtime's `/configure/models` answer, as far as the chat reads it. */
+export type ServerCatalogue = {
+    models?: ServerCatalogueModel[];
+    source?: string;
+    note?: string;
+    decision_models: ServerCatalogueModel[];
+    decisions_note: string;
+};
 /**
  * The server's catalogue in the chat's shape.
  *
@@ -59,4 +89,13 @@ export type ServerCatalogueModel = {
  */
 export declare function readServerCatalogue(payload: {
     models?: ServerCatalogueModel[];
+    source?: string;
+    note?: string;
 } | null | undefined): ModelConfig[];
+/**
+ * The typed-decision models of the runtime's answer, in the chat's shape.
+ *
+ * Read apart from `readServerCatalogue`, so no list a chat picks its model
+ * from ever holds one.
+ */
+export declare function readServerDecisions(payload: ServerCatalogue): Decisions;

package/lib/chat/base/modelChoice.js

@@ -14,6 +14,19 @@ export function usableModels(models) {
     const usable = models.filter(isUsable);
     return usable.length > 0 ? usable : models;
 }
+/**
+ * The models a chat offers, given what its runtime answered.
+ *
+ * The runtime's answer is the list: an agent's own models (its `model` and
+ * `model_additionals`), each flagged with whether its inference serves it.
+ * When the runtime answered, nothing else is added — not even when its list
+ * is empty, which says the agent has nothing to switch to. `fallback` is
+ * asked only when there is no runtime to answer (an in-page agent) or it
+ * has not answered yet.
+ */
+export function offeredModels(fromRuntime, fallback) {
+    return usableModels(fromRuntime ?? fallback());
+}
 /** Whether `id` is on offer and usable — the selection may stand. */
 export const isOffered = (offered, id) => Boolean(id) && offered.some(m => m.id === id && isUsable(m));
 /**
@@ -38,19 +51,33 @@ export function initialModelId(offered, preferred) {
  * its spec was known went to the first row — Alibaba, and its missing key.
  */
 export function readServerCatalogue(payload) {
-    return (payload?.models ?? []).map(model => {
-        const missing = model.missing_env_vars ?? [];
-        const reason = model.reason ??
-            (missing.length > 0 ? `Set ${missing.join(', ')}` : undefined) ??
-            model.warning ??
-            undefined;
-        return {
-            id: model.id,
-            name: model.name ?? model.id,
-            isAvailable: model.available !== false,
-            ...(reason && model.available === false
-                ? { unavailableReason: reason }
-                : {}),
-        };
-    });
+    return (payload?.models ?? []).map(readServerModel);
+}
+/**
+ * The typed-decision models of the runtime's answer, in the chat's shape.
+ *
+ * Read apart from `readServerCatalogue`, so no list a chat picks its model
+ * from ever holds one.
+ */
+export function readServerDecisions(payload) {
+    return {
+        models: payload.decision_models.map(readServerModel),
+        note: payload.decisions_note,
+    };
+}
+/** One row of the runtime's answer, in the chat's shape. */
+function readServerModel(model) {
+    const missing = model.missing_env_vars ?? [];
+    const reason = model.reason ??
+        (missing.length > 0 ? `Set ${missing.join(', ')}` : undefined) ??
+        model.warning ??
+        undefined;
+    return {
+        id: model.id,
+        name: model.name ?? model.id,
+        isAvailable: model.available !== false,
+        ...(reason && model.available === false
+            ? { unavailableReason: reason }
+            : {}),
+    };
 }

package/lib/chat/prompt/InputPrompt.d.ts

@@ -16,6 +16,7 @@ import type { PromptSuggestion } from './menus/SuggestionsMenu';
 import type { MentionableAgent } from './plugins/AgentMentionPlugin';
 /** One agent the footer may offer. */
 import type { FooterAgent } from '../../types/chat';
+import type { Decisions } from '../base/modelChoice';
 export type { FooterAgent };
 /** Where the prompt stands: in the flow, or in a draggable card over it. */
 export type InputPromptPlacement = 'docked' | 'floating';
@@ -187,6 +188,11 @@ export interface InputPromptProps {
      */
     configLoading?: boolean;
     models?: ModelConfig[];
+    /**
+     * The typed-decision models the runtime lists apart (Jev): shown read-only
+     * under the models, never one to pick. See `modelChoice`'s `Decisions`.
+     */
+    decisions?: Decisions;
     selectedModel?: string;
     onModelSelect?: (modelId: string) => void;
     availableTools?: BuiltinTool[];
@@ -214,4 +220,4 @@ export interface InputPromptProps {
     /** Pre-fetched MCP status from WebSocket — bypasses REST polling */
     mcpStatusData?: McpToolsetsStatusResponse | null;
 }
-export declare function InputPrompt({ input, setInput, isLoading, kernelStatus, connectionConfirmed, placeholder, typingSuggestions, autoFocus, focusTrigger, padding, placement, floatingAnchor, draggable, container, footerExtras, leadingPanel, trailingPanel, onSend, onStop, disableInputPrompt, promptVariant, mentionableAgents, promptHistory, headerContent, showAgentsMenu, showInlineAgentsMenu, agents, selectedAgentId, onSelectAgent, showTokenUsage, showContextRing, agentUsage, showModelSelector, showToolsMenu, showSkillsMenu, showSuggestionsMenu, suggestions, codemodeEnabled, onToggleCodemode, isA2AProtocol, hasConfigData, hasSkillsData, configLoading, models, selectedModel, onModelSelect, availableTools, mcpServers, enabledMcpTools, enabledMcpToolCount, onToggleMcpTool, onToggleAllMcpServerTools, approvedMcpTools, onToggleMcpToolApproval, skills, skillsLoading, enabledSkills, onToggleSkill, onToggleAllSkills, approvedSkills, onToggleSkillApproval, apiBase, authToken, mcpStatusData, }: InputPromptProps): import("react").JSX.Element;
+export declare function InputPrompt({ input, setInput, isLoading, kernelStatus, connectionConfirmed, placeholder, typingSuggestions, autoFocus, focusTrigger, padding, placement, floatingAnchor, draggable, container, footerExtras, leadingPanel, trailingPanel, onSend, onStop, disableInputPrompt, promptVariant, mentionableAgents, promptHistory, headerContent, showAgentsMenu, showInlineAgentsMenu, agents, selectedAgentId, onSelectAgent, showTokenUsage, showContextRing, agentUsage, showModelSelector, showToolsMenu, showSkillsMenu, showSuggestionsMenu, suggestions, codemodeEnabled, onToggleCodemode, isA2AProtocol, hasConfigData, hasSkillsData, configLoading, models, decisions, selectedModel, onModelSelect, availableTools, mcpServers, enabledMcpTools, enabledMcpToolCount, onToggleMcpTool, onToggleAllMcpServerTools, approvedMcpTools, onToggleMcpToolApproval, skills, skillsLoading, enabledSkills, onToggleSkill, onToggleAllSkills, approvedSkills, onToggleSkillApproval, apiBase, authToken, mcpStatusData, }: InputPromptProps): import("react").JSX.Element;