@datalayer/agent-runtimes 1.0.29 → 1.3.10

package/lib/examples/Lexical2Example.js

@@ -20,29 +20,18 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  */
 import '@datalayer/jupyter-react/lib/css/PrismCss';
 import { useCallback, useEffect, useState } from 'react';
-import { LexicalComposer } from '@lexical/react/LexicalComposer';
-import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { LexicalExtensionComposer } from '@lexical/react/LexicalExtensionComposer';
 import { ContentEditable } from '@lexical/react/LexicalContentEditable';
-import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
 import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';
-import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';
-import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin';
-import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
-import { TRANSFORMERS } from '@lexical/markdown';
-import { registerCodeHighlighting } from '@lexical/code';
-import { ListPlugin } from '@lexical/react/LexicalListPlugin';
-import { CheckListPlugin } from '@lexical/react/LexicalCheckListPlugin';
-import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
 import { Box } from '@datalayer/primer-addons';
 import { Text } from '@primer/react';
 import { useJupyter } from '@datalayer/jupyter-react';
 import { ThemedJupyterProvider } from './utils/themedProvider';
-import { ComponentPickerMenuPlugin, JupyterCellPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, ImagesPlugin, HorizontalRulePlugin, EquationsPlugin, YouTubePlugin, ExcalidrawPlugin, CollapsiblePlugin, AutoLinkPlugin, AutoEmbedPlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, ListMaxIndentLevelPlugin, TableCellResizerPlugin, TablePlugin, } from '@datalayer/jupyter-lexical';
+import { ComponentPickerMenuPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, TableCellResizerPlugin, } from '@datalayer/jupyter-lexical';
 import { ChatFloating } from '../chat';
 import { useLexicalToolActions } from '../tools/adapters/copilotkit/lexicalHooks';
 import { ActionRegistrar } from '../tools/adapters/copilotkit/CopilotKitToolAdapter';
-import { editorConfig } from './lexical/editorConfig';
+import { editorExtension } from './lexical/editorConfig';
 import { useFrontendTool } from '../hooks';
 import { useChatStore } from '../stores';
 import { DatalayerInferenceProvider } from '../inference';
@@ -51,16 +40,6 @@ import '@datalayer/jupyter-lexical/style/index.css';
 import './lexical/lexical-theme.css';
 // Fixed lexical document ID
 const LEXICAL_ID = 'chat-popup-lexical-example';
-/**
- * Lexical plugin for code highlighting
- */
-function CodeHighlightingPlugin() {
-    const [editor] = useLexicalComposerContext();
-    useEffect(() => {
-        return registerCodeHighlighting(editor);
-    }, [editor]);
-    return null;
-}
 /**
  * Tool registration component - registers Lexical tools with Chat
  */
@@ -88,7 +67,7 @@ function CustomToolsRegistrar() {
         ],
         handler: async ({ name }) => {
             return {
-                greeting: `Hello, ${name}! Welcome to Agent Runtime Lexical Example.`,
+                greeting: `Hello, ${name}! Welcome to Lexical Example.`,
             };
         },
     });
@@ -131,24 +110,24 @@ function LexicalEditor({ serviceManager: _serviceManager, }) {
     const onChange = useCallback((_editorState) => {
         // Could persist state here
     }, []);
-    return (_jsx(LexicalComposer, { initialConfig: editorConfig, children: _jsxs(Box, { sx: {
+    return (_jsx(LexicalExtensionComposer, { extension: editorExtension, contentEditable: null, children: _jsxs(Box, { sx: {
                 position: 'relative',
                 flex: 1,
                 display: 'flex',
                 flexDirection: 'column',
                 overflow: 'hidden',
-            }, children: [_jsx(RichTextPlugin, { contentEditable: _jsx("div", { ref: onRef, style: { flex: 1, display: 'flex', flexDirection: 'column' }, children: _jsx(ContentEditable, { className: "lexical-editor-content", style: {
-                                flex: 1,
-                                padding: '24px',
-                                outline: 'none',
-                                overflow: 'auto',
-                            } }) }), placeholder: _jsx("div", { style: {
-                            position: 'absolute',
-                            top: '24px',
-                            left: '24px',
-                            color: 'var(--fgColor-muted)',
-                            pointerEvents: 'none',
-                        }, children: "Start typing or click the chat button to open the AI assistant..." }), ErrorBoundary: LexicalErrorBoundary }), _jsx(HistoryPlugin, {}), _jsx(AutoFocusPlugin, {}), _jsx(OnChangePlugin, { onChange: onChange }), _jsx(MarkdownShortcutPlugin, { transformers: TRANSFORMERS }), _jsx(CodeHighlightingPlugin, {}), _jsx(ListPlugin, {}), _jsx(CheckListPlugin, {}), _jsx(LinkPlugin, {}), _jsx(JupyterCellPlugin, {}), _jsx(JupyterInputOutputPlugin, {}), _jsx(ImagesPlugin, {}), _jsx(HorizontalRulePlugin, {}), _jsx(EquationsPlugin, {}), _jsx(YouTubePlugin, {}), _jsx(ExcalidrawPlugin, {}), _jsx(CollapsiblePlugin, {}), _jsx(AutoLinkPlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(TablePlugin, {}), _jsx(TableCellResizerPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(ComponentPickerMenuPlugin, {}), _jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem, setIsLinkEditMode: setIsLinkEditMode }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] }))] }) }));
+            }, children: [_jsx("div", { ref: onRef, style: { flex: 1, display: 'flex', flexDirection: 'column' }, children: _jsx(ContentEditable, { placeholder: _jsx("div", { style: {
+                                position: 'absolute',
+                                top: '24px',
+                                left: '24px',
+                                color: 'var(--fgColor-muted)',
+                                pointerEvents: 'none',
+                            }, children: "Start typing or click the chat button to open the AI assistant..." }), "aria-placeholder": "Start typing or click the chat button to open the AI assistant...", className: "lexical-editor-content", style: {
+                            flex: 1,
+                            padding: '24px',
+                            outline: 'none',
+                            overflow: 'auto',
+                        } }) }), _jsx(OnChangePlugin, { onChange: onChange }), _jsx(JupyterInputOutputPlugin, {}), _jsx(TableCellResizerPlugin, {}), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(ComponentPickerMenuPlugin, {}), _jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem, setIsLinkEditMode: setIsLinkEditMode }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] }))] }) }));
 }
 export function ChatLexicalExampleInner({ serviceManager, }) {
     // Chat configuration - set up the inference provider in the store

package/lib/examples/LexicalAgentExample.d.ts

@@ -1,5 +1,5 @@
 /**
- * Agent Runtime Lexical Example with Agent-Runtimes Integration.
+ * Lexical Example with Agent-Runtimes Integration.
  *
  * This example demonstrates using the agent-runtimes ChatFloating component
  * with lexical tools for AI-assisted document editing.
@@ -10,6 +10,7 @@
  *
  * @module examples/LexicalAgentExample
  */
+import type { JSX } from 'react';
 import '@datalayer/jupyter-react/lib/css/PrismCss';
 import type { ServiceManager } from '@jupyterlab/services';
 import '@datalayer/jupyter-lexical/style/index.css';

package/lib/examples/LexicalAgentExample.js

@@ -1,74 +1,29 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/*
- * Copyright (c) 2025-2026 Datalayer, Inc.
- * Distributed under the terms of the Modified BSD License.
- */
-/**
- * Agent Runtime Lexical Example with Agent-Runtimes Integration.
- *
- * This example demonstrates using the agent-runtimes ChatFloating component
- * with lexical tools for AI-assisted document editing.
- *
- * To run this example:
- * 1. Start the agent-runtimes server: `npm run start:server`
- * 2. Start the frontend: `npm run dev`
- *
- * @module examples/LexicalAgentExample
- */
 import '@datalayer/jupyter-react/lib/css/PrismCss';
-import React, { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { $getRoot, $createParagraphNode } from 'lexical';
-import { LexicalComposer } from '@lexical/react/LexicalComposer';
-import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { LexicalExtensionComposer } from '@lexical/react/LexicalExtensionComposer';
 import { ContentEditable } from '@lexical/react/LexicalContentEditable';
-import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
 import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';
-import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin';
-import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
-import { TRANSFORMERS } from '@lexical/markdown';
-import { registerCodeHighlighting } from '@lexical/code';
-import { ListPlugin } from '@lexical/react/LexicalListPlugin';
-import { CheckListPlugin } from '@lexical/react/LexicalCheckListPlugin';
-import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
 import { Box } from '@datalayer/primer-addons';
 import { useJupyter } from '@datalayer/jupyter-react';
 import { ThemedJupyterProvider } from './utils/themedProvider';
-import { ComponentPickerMenuPlugin, JupyterCellPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, ImagesPlugin, HorizontalRulePlugin, EquationsPlugin, YouTubePlugin, ExcalidrawPlugin, CollapsiblePlugin, AutoLinkPlugin, AutoEmbedPlugin, LexicalConfigProvider, LexicalStatePlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, ListMaxIndentLevelPlugin, TableCellResizerPlugin, TablePlugin, } from '@datalayer/jupyter-lexical';
+import { ComponentPickerMenuPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, LexicalConfigProvider, LexicalStatePlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, TableCellResizerPlugin, } from '@datalayer/jupyter-lexical';
 // Agent-runtimes imports
 import { ChatFloating } from '../chat';
 import { ChatInlinePlugin } from '../lexical/ChatInlinePlugin';
 import { useChatInlineToolbarItems } from '../lexical/useChatInlineToolbarItems';
 import { useLexicalTools } from '../tools/adapters/agent-runtimes/lexicalHooks';
-import { editorConfig } from './lexical/editorConfig';
-import { useExampleAgentRuntimesUrl } from './utils/useExampleAgentRuntimesUrl';
-import { useExampleAgentRuntime } from './hooks/useExampleAgentRuntime';
-import { DEFAULT_MODEL } from '../specs';
+import { editorExtension } from './lexical/editorConfig';
+import { useExampleJupyterAgent } from './hooks/useExampleJupyterAgent';
 import '@datalayer/jupyter-lexical/style/index.css';
 import './lexical/lexical-theme.css';
 // Fixed lexical document ID
 const LEXICAL_ID = 'agui-lexical-example';
 const AGENT_ID = 'lexical-agent-runtime-example';
-function getJupyterSandboxUrl(serviceManager) {
-    const envUrl = import.meta.env.VITE_JUPYTER_SANDBOX_URL;
-    if (envUrl) {
-        return envUrl;
-    }
-    const baseUrl = serviceManager?.serverSettings?.baseUrl?.replace(/\/$/, '');
-    if (!baseUrl) {
-        return undefined;
-    }
-    if (baseUrl.includes('token=')) {
-        return baseUrl;
-    }
-    const token = serviceManager?.serverSettings?.token;
-    if (!token) {
-        return baseUrl;
-    }
-    const separator = baseUrl.includes('?') ? '&' : '?';
-    return `${baseUrl}${separator}token=${encodeURIComponent(token)}`;
-}
+/** The agentspec this example's agent is built from. */
+const AGENTSPEC_ID = 'example-document-agent';
 /**
  * Hook to ensure the example-agent exists on the server.
  * Creates it if it doesn't exist.
@@ -112,16 +67,6 @@ function LoadContentPlugin({ content }) {
     }, [content, editor]);
     return null;
 }
-/**
- * Lexical plugin for Simple code syntax highlighting.
- */
-function CodeHighlightPlugin() {
-    const [editor] = useLexicalComposerContext();
-    useEffect(() => {
-        return registerCodeHighlighting(editor);
-    }, [editor]);
-    return null;
-}
 /**
  * Wrapper component for kernel-dependent Simple plugins.
  * Accepts a serviceManager so it can initialise a Jupyter kernel
@@ -169,59 +114,41 @@ const LexicalUI = React.memo(function LexicalUI({ content = INITIAL_CONTENT, ser
                     paddingBottom: 3,
                     borderBottom: '1px solid',
                     borderColor: 'border.default',
-                }, children: [_jsx("h1", { children: "Agent Runtime Lexical Example" }), _jsx("p", { children: "Platform-agnostic tool usage with agent-runtimes integration. Use the AI copilot to manipulate the document." })] }), _jsx(Box, { sx: {
+                }, children: [_jsx("h1", { children: "Lexical Example" }), _jsx("p", { children: "Platform-agnostic usage with agent-runtimes integration. Use the AI Agent to manipulate the Document." })] }), _jsx(Box, { sx: {
                     border: '1px solid',
                     borderColor: 'border.default',
                     borderRadius: 2,
                     padding: 3,
                     backgroundColor: 'canvas.default',
                     minHeight: '600px',
-                }, children: _jsxs(LexicalConfigProvider, { lexicalId: LEXICAL_ID, serviceManager: serviceManager, children: [_jsx(LexicalToolsPlugin, { onToolsReady: onToolsReady }), _jsx(LexicalComposer, { initialConfig: editorConfig, children: _jsxs("div", { className: "lexical-editor-inner", ref: onRef, children: [_jsx(LexicalStatePlugin, {}), _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "lexical-editor-content", "aria-label": "Lexical Editor" }), ErrorBoundary: LexicalErrorBoundary }), _jsx(OnChangePlugin, { onChange: handleChange }), _jsx(HistoryPlugin, {}), _jsx(AutoFocusPlugin, {}), _jsx(ListPlugin, {}), _jsx(CheckListPlugin, {}), _jsx(LinkPlugin, {}), _jsx(AutoLinkPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), _jsx(MarkdownShortcutPlugin, { transformers: TRANSFORMERS }), _jsx(LoadContentPlugin, { content: content }), _jsx(CodeHighlightPlugin, {}), _jsx(ImagesPlugin, { captionsEnabled: false }), _jsx(HorizontalRulePlugin, {}), _jsx(EquationsPlugin, {}), _jsx(YouTubePlugin, {}), _jsx(ExcalidrawPlugin, {}), _jsx(CollapsiblePlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(TablePlugin, {}), _jsx(TableCellResizerPlugin, {}), _jsx(JupyterCellPlugin, {}), _jsx(ThemedJupyterProvider, { children: _jsx(SimpleKernelPluginsInner, { serviceManager: serviceManager }) }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem, setIsLinkEditMode: setIsLinkEditMode, extraItems: toolbarItems }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] })), _jsx(ChatInlinePlugin, { protocol: {
+                }, children: _jsxs(LexicalConfigProvider, { lexicalId: LEXICAL_ID, serviceManager: serviceManager, children: [_jsx(LexicalToolsPlugin, { onToolsReady: onToolsReady }), _jsx(LexicalExtensionComposer, { extension: editorExtension, contentEditable: null, children: _jsxs("div", { className: "lexical-editor-inner", ref: onRef, children: [_jsx(LexicalStatePlugin, {}), _jsx(ContentEditable, { className: "lexical-editor-content", "aria-label": "Lexical Editor" }), _jsx(OnChangePlugin, { onChange: handleChange }), _jsx(LoadContentPlugin, { content: content }), _jsx(TableCellResizerPlugin, {}), _jsx(ThemedJupyterProvider, { children: _jsx(SimpleKernelPluginsInner, { serviceManager: serviceManager }) }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem, setIsLinkEditMode: setIsLinkEditMode, extraItems: toolbarItems }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] })), _jsx(ChatInlinePlugin, { protocol: {
                                             type: 'vercel-ai',
                                             endpoint,
                                         }, isOpen: isAiOpen, onClose: closeAi, pendingPrompt: pendingPrompt, onPendingPromptConsumed: clearPendingPrompt })] }) })] }) })] }));
 });
 function LexicalWithChat({ content, serviceManager, }) {
-    const baseUrl = useExampleAgentRuntimesUrl();
-    const vercelAiEndpoint = `${baseUrl}/api/v1/vercel-ai/${AGENT_ID}`;
-    const [createRequested, setCreateRequested] = useState(false);
-    const jupyterSandboxUrl = useMemo(() => getJupyterSandboxUrl(serviceManager), [serviceManager]);
-    const { agentId, isReady, status, error, createAgent } = useExampleAgentRuntime({
+    // Lifted out of the editor below, and declared here so the hook that routes
+    // them is downstream of them.
+    const [tools, setTools] = useState([]);
+    const { agentReady, protocol: protocolConfig, chatFrontendTools, error, unavailableReason, } = useExampleJupyterAgent({
         exampleId: 'LexicalAgentExample',
         agentName: AGENT_ID,
-        autoCreateAgent: false,
-        agentConfig: {
-            name: AGENT_ID,
-            description: 'Demo agent for lexical example',
-            protocol: 'vercel-ai',
-            model: DEFAULT_MODEL,
-            systemPrompt: 'You are a helpful AI assistant that helps users work with documents. You can help with writing, editing, and formatting content.',
-            enableCodemode: false,
-            sandboxVariant: 'jupyter',
-            jupyterSandbox: jupyterSandboxUrl,
-        },
+        specId: AGENTSPEC_ID,
+        description: 'Demo agent for lexical example',
+        systemPrompt: 'You are a helpful AI assistant that helps users work with documents. You can help with writing, editing, and formatting content.',
+        serviceManager,
+        // Lifted out of the editor by `onToolsReady`, so they reach the hook a
+        // render later than in the other examples. The protocol config is rebuilt
+        // when they arrive.
+        frontendTools: tools,
     });
-    useEffect(() => {
-        if (!jupyterSandboxUrl || createRequested || agentId) {
-            return;
-        }
-        setCreateRequested(true);
-        void createAgent({
-            name: AGENT_ID,
-            description: 'Demo agent for lexical example',
-            protocol: 'vercel-ai',
-            model: DEFAULT_MODEL,
-            systemPrompt: 'You are a helpful AI assistant that helps users work with documents. You can help with writing, editing, and formatting content.',
-            enableCodemode: false,
-            sandboxVariant: 'jupyter',
-            jupyterSandbox: jupyterSandboxUrl,
-        }).catch(() => {
-            setCreateRequested(false);
-        });
-    }, [jupyterSandboxUrl, createRequested, agentId, createAgent]);
-    const effectiveReady = isReady || status === 'ready';
+    // One failed attempt is reported, not retried — see
+    // `useExampleJupyterAgent`.
+    const chatError = error || unavailableReason;
+    // The example's own agent, not merely the runtime: on the cloud target the
+    // runtime is ready before this agent has been registered on it.
+    const effectiveReady = agentReady;
     // State to hold tools - populated by LexicalToolsPlugin inside the context
-    const [tools, setTools] = useState([]);
     // Stable callback for receiving tools from LexicalToolsPlugin
     // NOTE: Do NOT use a key={...} on ChatFloating to force re-render on tool changes.
     // Changing the key remounts the entire chat component, resetting all state (including isLoading),
@@ -236,7 +163,7 @@ function LexicalWithChat({ content, serviceManager, }) {
             width: '100vw',
             display: 'flex',
             overflow: 'hidden',
-        }, children: [_jsx(LexicalUI, { content: content, serviceManager: serviceManager, endpoint: vercelAiEndpoint, onToolsReady: handleToolsReady }), error && (_jsxs(Box, { sx: {
+        }, children: [_jsx(LexicalUI, { content: content, serviceManager: serviceManager, endpoint: protocolConfig.endpoint, onToolsReady: handleToolsReady }), chatError && (_jsxs(Box, { sx: {
                     position: 'fixed',
                     bottom: 20,
                     right: 20,
@@ -245,7 +172,7 @@ function LexicalWithChat({ content, serviceManager, }) {
                     color: 'danger.fg',
                     borderRadius: 2,
                     maxWidth: 300,
-                }, children: [_jsx("strong", { children: "Error:" }), " ", error] })), effectiveReady && (_jsx(ChatFloating, { kernelIndicatorPlacement: "right", protocol: "vercel-ai", endpoint: vercelAiEndpoint, title: "Lexical AI Agent Runtime", description: "Hi! I can help you edit documents. Try: 'Insert a heading', 'Add a code block', or 'Create a list'", defaultOpen: true, defaultViewMode: "panel", position: "bottom-right", frontendTools: tools, useStore: false, showModelSelector: true, showToolsMenu: true, showSkillsMenu: true, suggestions: [
+                }, children: [_jsx("strong", { children: "Error:" }), " ", chatError] })), effectiveReady && (_jsx(ChatFloating, { kernelIndicatorPlacement: "right", protocol: protocolConfig, title: "Lexical AI Agent Runtime", description: "Hi! I can help you edit documents. Try: 'Insert a heading', 'Add a code block', or 'Create a list'", defaultOpen: true, defaultViewMode: "panel", position: "bottom-right", frontendTools: chatFrontendTools, useStore: false, showModelSelector: true, showToolsMenu: true, showSkillsMenu: true, suggestions: [
                     {
                         title: 'Insert heading',
                         message: 'Insert a heading that says "Welcome"',

package/lib/examples/LexicalAgentSidebarExample.d.ts

@@ -1,5 +1,5 @@
 /**
- * Agent Runtime Lexical Example - Next generation chat with Lexical editor.
+ * Lexical Example - Next generation chat with Lexical editor.
  *
  * This example demonstrates using the chat component with:
  * - Lexical editor integration
@@ -17,14 +17,25 @@ import type { ServiceManager } from '@jupyterlab/services';
 import '@datalayer/jupyter-lexical/style/index.css';
 import './lexical/lexical-theme.css';
 /**
- * Agent Runtime Lexical Sidebar Example with Simple integration
+ * Lexical Agent Sidebar Example with Simple integration
  */
 interface ChatLexicalAgentExampleProps {
     serviceManager?: ServiceManager.IManager;
 }
-export declare function ChatLexicalAgentExampleInner({ serviceManager, }: ChatLexicalAgentExampleProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatLexicalAgentExampleInner({ serviceManager, }: ChatLexicalAgentExampleProps): import("react").JSX.Element;
 /**
- * Main example component with Simple wrapper
+ * The example, in the app's theme, on the shell's runtime.
+ *
+ * The service manager comes from the shell, as it does in every other
+ * example. Reading it from an ambient `useJupyter()` instead — which is what
+ * this example used to do — did not merely risk showing a document on a
+ * different runtime than the picker says: with no `<Jupyter>` provider above
+ * it there was nothing ambient to read, so the hook fell back to
+ * `DEFAULT_JUPYTER_SERVER_URL` (`prod1.datalayer.run/api/jupyter-server`).
+ * That URL is what the example then handed the agent runtime as its sandbox,
+ * and validating it is what came back as "Failed to connect to Jupyter
+ * sandbox: Jupyter server returned HTTP 404" — a server that was running all
+ * along, just not the one being asked.
  */
-export declare function AgentRuntimeLexicalAgentSidebarExample(): import("react/jsx-runtime").JSX.Element;
+export declare function AgentRuntimeLexicalAgentSidebarExample({ serviceManager, }: ChatLexicalAgentExampleProps): import("react").JSX.Element;
 export default AgentRuntimeLexicalAgentSidebarExample;