@datalayer/agent-runtimes 0.0.7 → 0.0.9

package/lib/components/chat/protocols/AGUIAdapter.js

@@ -137,10 +137,16 @@ export class AGUIAdapter extends BaseProtocolAdapter {
             forwardedProps: null,
             // Include model for per-request model override
             ...(options?.model && { model: options.model }),
+            // Include identities for tool execution with OAuth tokens
+            ...(options?.identities &&
+                options.identities.length > 0 && { identities: options.identities }),
         };
         if (options?.model) {
             console.log('[AGUIAdapter] Sending with model:', options.model);
         }
+        if (options?.identities && options.identities.length > 0) {
+            console.log('[AGUIAdapter] Sending with identities:', options.identities.map(i => i.provider));
+        }
         try {
             const response = await fetch(this.aguiConfig.baseUrl, {
                 method: 'POST',
@@ -455,13 +461,25 @@ export class AGUIAdapter extends BaseProtocolAdapter {
                     }
                 }
                 if (toolCallId) {
+                    // Check for execution errors in the result
+                    // ExecutionResult format: { execution_ok, execution_error, code_error, ... }
+                    const contentObj = content;
+                    const isError = contentObj?.execution_ok === false ||
+                        contentObj?.code_error != null ||
+                        (contentObj?.error != null && !contentObj?.success);
+                    const errorMessage = contentObj?.execution_error ||
+                        contentObj?.error ||
+                        (contentObj?.code_error
+                            ? `${contentObj.code_error?.name || 'Error'}: ${contentObj.code_error?.value || ''}`
+                            : undefined);
                     // Emit tool result event with the actual content
                     this.emit({
                         type: 'tool-result',
                         toolResult: {
                             toolCallId,
-                            success: true,
+                            success: !isError,
                             result: content,
+                            error: isError ? errorMessage : undefined,
                         },
                         timestamp: new Date(),
                     });

package/lib/components/chat/protocols/VercelAIAdapter.d.ts

@@ -63,6 +63,13 @@ export declare class VercelAIAdapter extends BaseProtocolAdapter {
         messages?: ChatMessage[];
         /** Builtin tools / MCP tools to enable for this request */
         builtinTools?: string[];
+        /** Skills to enable for this request */
+        skills?: string[];
+        /** Connected identities with access tokens for skill execution */
+        identities?: Array<{
+            provider: string;
+            accessToken?: string;
+        }>;
     }): Promise<void>;
     /**
      * Parse SSE stream from Vercel AI

package/lib/components/chat/protocols/VercelAIAdapter.js

@@ -112,10 +112,29 @@ export class VercelAIAdapter extends BaseProtocolAdapter {
                     options.builtinTools.length > 0 && {
                     builtinTools: options.builtinTools,
                 }),
+                // Skills to enable
+                ...(options?.skills &&
+                    options.skills.length > 0 && {
+                    skills: options.skills,
+                }),
+                // Connected identities with access tokens
+                ...(options?.identities &&
+                    options.identities.length > 0 && {
+                    identities: options.identities,
+                }),
             };
             if (options?.model) {
                 console.log('[VercelAIAdapter] Sending with model:', options.model);
             }
+            if (options?.builtinTools && options.builtinTools.length > 0) {
+                console.log('[VercelAIAdapter] Sending with builtinTools:', options.builtinTools);
+            }
+            if (options?.skills && options.skills.length > 0) {
+                console.log('[VercelAIAdapter] Sending with skills:', options.skills);
+            }
+            if (options?.identities && options.identities.length > 0) {
+                console.log('[VercelAIAdapter] Sending with identities:', options.identities.map(i => i.provider));
+            }
             // Merge custom headers with defaults
             const headers = {
                 'Content-Type': 'application/json',

package/lib/components/chat/types/execution.d.ts

@@ -0,0 +1,78 @@
+/**
+ * Execution types for code/skills execution results.
+ * Maps to the Python code-sandboxes ExecutionResult model.
+ *
+ * @module components/chat/types/execution
+ */
+/**
+ * Code error information when Python code raises an exception.
+ */
+export interface CodeError {
+    /** Exception class name (e.g., 'ValueError', 'TypeError') */
+    name: string;
+    /** Exception message/value */
+    value: string;
+    /** Python traceback string */
+    traceback?: string;
+}
+/**
+ * Result from code or skill execution.
+ * This maps to the Python ExecutionResult model from code-sandboxes.
+ *
+ * Distinguishes between three levels of outcome:
+ * 1. Execution-level failure (execution_ok=false): Infrastructure/sandbox failed
+ * 2. Code-level error (code_error present): User code raised Python exception
+ * 3. Exit code (exit_code present): User code called sys.exit() with a code
+ */
+export interface ExecutionResult {
+    /** Whether overall execution succeeded (no infrastructure or code errors) */
+    success: boolean;
+    /** Whether the sandbox infrastructure executed the code successfully */
+    execution_ok: boolean;
+    /** Infrastructure error details when execution_ok is false */
+    execution_error?: string | null;
+    /** Python exception details when code raised an error */
+    code_error?: CodeError | null;
+    /** Exit code when code called sys.exit() - not a failure, but an intentional exit */
+    exit_code?: number | null;
+    /** Execution results (display outputs, return values) */
+    result?: unknown[];
+    /** Standard output text */
+    output?: string;
+    /** Backwards-compatible error message (derived from execution_error or code_error) */
+    error?: string | null;
+    /** Execution timing in seconds */
+    duration?: number;
+    /** Whether execution was interrupted/cancelled */
+    interrupted?: boolean;
+}
+/**
+ * Check if an execution result indicates infrastructure failure.
+ */
+export declare function isExecutionFailure(result: ExecutionResult): boolean;
+/**
+ * Check if an execution result indicates a code/script error.
+ */
+export declare function isCodeError(result: ExecutionResult): boolean;
+/**
+ * Check if an execution result has a non-zero exit code (intentional exit).
+ */
+export declare function hasNonZeroExitCode(result: ExecutionResult): boolean;
+/**
+ * Check if an execution result is truly successful (no errors AND exit_code is 0 or null).
+ */
+export declare function isFullySuccessful(result: ExecutionResult): boolean;
+/**
+ * Get a human-readable error message from an execution result.
+ * Returns null if no error or intentional exit.
+ */
+export declare function getExecutionErrorMessage(result: ExecutionResult): string | null;
+/**
+ * Get exit code message if present and non-zero.
+ * Returns null if no exit code or exit code is 0.
+ */
+export declare function getExitCodeMessage(result: ExecutionResult): string | null;
+/**
+ * Format a code error for display, optionally including traceback.
+ */
+export declare function formatCodeError(error: CodeError, includeTraceback?: boolean): string;

package/lib/components/chat/types/execution.js

@@ -0,0 +1,64 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * Check if an execution result indicates infrastructure failure.
+ */
+export function isExecutionFailure(result) {
+    return !result.execution_ok;
+}
+/**
+ * Check if an execution result indicates a code/script error.
+ */
+export function isCodeError(result) {
+    return result.execution_ok && result.code_error != null;
+}
+/**
+ * Check if an execution result has a non-zero exit code (intentional exit).
+ */
+export function hasNonZeroExitCode(result) {
+    return result.exit_code != null && result.exit_code !== 0;
+}
+/**
+ * Check if an execution result is truly successful (no errors AND exit_code is 0 or null).
+ */
+export function isFullySuccessful(result) {
+    return (result.execution_ok &&
+        result.code_error == null &&
+        !result.interrupted &&
+        (result.exit_code == null || result.exit_code === 0));
+}
+/**
+ * Get a human-readable error message from an execution result.
+ * Returns null if no error or intentional exit.
+ */
+export function getExecutionErrorMessage(result) {
+    if (!result.execution_ok) {
+        return `Execution failed: ${result.execution_error || 'Unknown error'}`;
+    }
+    if (result.code_error) {
+        return `${result.code_error.name}: ${result.code_error.value}`;
+    }
+    return null;
+}
+/**
+ * Get exit code message if present and non-zero.
+ * Returns null if no exit code or exit code is 0.
+ */
+export function getExitCodeMessage(result) {
+    if (result.exit_code != null && result.exit_code !== 0) {
+        return `Process exited with code ${result.exit_code}`;
+    }
+    return null;
+}
+/**
+ * Format a code error for display, optionally including traceback.
+ */
+export function formatCodeError(error, includeTraceback = false) {
+    let message = `${error.name}: ${error.value}`;
+    if (includeTraceback && error.traceback) {
+        message += `\n\n${error.traceback}`;
+    }
+    return message;
+}

package/lib/components/chat/types/index.d.ts

@@ -9,3 +9,4 @@ export * from './inference';
 export * from './protocol';
 export * from './middleware';
 export * from './extension';
+export * from './execution';

package/lib/components/chat/types/index.js

@@ -14,3 +14,4 @@ export * from './inference';
 export * from './protocol';
 export * from './middleware';
 export * from './extension';
+export * from './execution';

package/lib/components/chat/types/protocol.d.ts

@@ -117,6 +117,15 @@ export interface ProtocolAdapter {
         messages?: ChatMessage[];
         /** Model to use for this request (overrides agent default) */
         model?: string;
+        /** Built-in MCP tool names to enable */
+        builtinTools?: string[];
+        /** Skill IDs to enable */
+        skills?: string[];
+        /** Connected identity tokens to pass to backend for tool execution */
+        identities?: Array<{
+            provider: string;
+            accessToken: string;
+        }>;
     }): Promise<void>;
     /**
      * Send tool execution result back

package/lib/components/ui/pagination.d.ts

@@ -7,7 +7,7 @@ type PaginationLinkProps = {
     isActive?: boolean;
 } & Pick<React.ComponentProps<typeof Button>, 'size'> & React.ComponentProps<'a'>;
 declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): import("react/jsx-runtime").JSX.Element;
-declare function PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
-declare function PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
+declare function PaginationPrevious({ className, size, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
+declare function PaginationNext({ className, size, ...props }: React.ComponentProps<typeof PaginationLink>): import("react/jsx-runtime").JSX.Element;
 declare function PaginationEllipsis({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
 export { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis, };

package/lib/components/ui/pagination.js

@@ -17,11 +17,11 @@ function PaginationLink({ className, isActive, size = 'icon', ...props }) {
             size,
         }), className), ...props }));
 }
-function PaginationPrevious({ className, ...props }) {
-    return (_jsxs(PaginationLink, { "aria-label": "Go to previous page", size: "default", className: cn('gap-1 px-2.5 sm:pl-2.5', className), ...props, children: [_jsx(ChevronLeftIcon, {}), _jsx("span", { className: "hidden sm:block", children: "Previous" })] }));
+function PaginationPrevious({ className, size = 'default', ...props }) {
+    return (_jsxs(PaginationLink, { "aria-label": "Go to previous page", size: size, className: cn('gap-1 px-2.5 sm:pl-2.5', className), ...props, children: [_jsx(ChevronLeftIcon, {}), _jsx("span", { className: "hidden sm:block", children: "Previous" })] }));
 }
-function PaginationNext({ className, ...props }) {
-    return (_jsxs(PaginationLink, { "aria-label": "Go to next page", size: "default", className: cn('gap-1 px-2.5 sm:pr-2.5', className), ...props, children: [_jsx("span", { className: "hidden sm:block", children: "Next" }), _jsx(ChevronRightIcon, {})] }));
+function PaginationNext({ className, size = 'default', ...props }) {
+    return (_jsxs(PaginationLink, { "aria-label": "Go to next page", size: size, className: cn('gap-1 px-2.5 sm:pr-2.5', className), ...props, children: [_jsx("span", { className: "hidden sm:block", children: "Next" }), _jsx(ChevronRightIcon, {})] }));
 }
 function PaginationEllipsis({ className, ...props }) {
     return (_jsxs("span", { "aria-hidden": true, "data-slot": "pagination-ellipsis", className: cn('flex size-9 items-center justify-center', className), ...props, children: [_jsx(MoreHorizontalIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "More pages" })] }));

package/lib/components/ui/resizable.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import * as ResizablePrimitive from 'react-resizable-panels';
-declare function ResizablePanelGroup({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>): import("react/jsx-runtime").JSX.Element;
-declare function ResizablePanel({ ...props }: React.ComponentProps<typeof ResizablePrimitive.Panel>): import("react/jsx-runtime").JSX.Element;
-declare function ResizableHandle({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+import { Group, Panel, Separator } from 'react-resizable-panels';
+declare function ResizablePanelGroup({ className, ...props }: React.ComponentProps<typeof Group>): import("react/jsx-runtime").JSX.Element;
+declare function ResizablePanel({ ...props }: React.ComponentProps<typeof Panel>): import("react/jsx-runtime").JSX.Element;
+declare function ResizableHandle({ withHandle, className, ...props }: React.ComponentProps<typeof Separator> & {
     withHandle?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle };

package/lib/components/ui/resizable.js

@@ -5,15 +5,15 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { GripVerticalIcon } from 'lucide-react';
-import * as ResizablePrimitive from 'react-resizable-panels';
+import { Group, Panel, Separator } from 'react-resizable-panels';
 import { cn } from '@/lib/utils';
 function ResizablePanelGroup({ className, ...props }) {
-    return (_jsx(ResizablePrimitive.PanelGroup, { "data-slot": "resizable-panel-group", className: cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className), ...props }));
+    return (_jsx(Group, { "data-slot": "resizable-panel-group", className: cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className), ...props }));
 }
 function ResizablePanel({ ...props }) {
-    return _jsx(ResizablePrimitive.Panel, { "data-slot": "resizable-panel", ...props });
+    return _jsx(Panel, { "data-slot": "resizable-panel", ...props });
 }
 function ResizableHandle({ withHandle, className, ...props }) {
-    return (_jsx(ResizablePrimitive.PanelResizeHandle, { "data-slot": "resizable-handle", className: cn('bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90', className), ...props, children: withHandle && (_jsx("div", { className: "bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border", children: _jsx(GripVerticalIcon, { className: "size-2.5" }) })) }));
+    return (_jsx(Separator, { "data-slot": "resizable-handle", className: cn('bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90', className), ...props, children: withHandle && (_jsx("div", { className: "bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border", children: _jsx(GripVerticalIcon, { className: "size-2.5" }) })) }));
 }
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle };

package/lib/examples/A2UiRestaurantExample.js

@@ -20,7 +20,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { useState, useCallback, useEffect, useRef } from 'react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { Text, Spinner, TextInput, Button } from '@primer/react';
 import { A2UIProvider, A2UIRenderer, useA2UI } from '../renderers/a2ui';
 // A2UI endpoint for pydantic-ai restaurant agent
@@ -278,7 +278,7 @@ const A2UiRestaurantExample = () => {
         console.log('A2UI Action:', action);
         // Actions are handled in the content component
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, colorMode: "day", children: _jsx(A2UIProvider, { onAction: handleAction, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { colorMode: "day", children: _jsx(A2UIProvider, { onAction: handleAction, children: _jsxs(Box, { sx: {
                     display: 'flex',
                     flexDirection: 'column',
                     minHeight: '100vh',

package/lib/examples/AgUiAgenticExample.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Text } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 // AG-UI endpoint for agentic chat example
 const AGENTIC_CHAT_ENDPOINT = 'http://localhost:8765/api/v1/examples/agentic_chat/';
@@ -17,7 +17,7 @@ const AGENTIC_CHAT_ENDPOINT = 'http://localhost:8765/api/v1/examples/agentic_cha
  * - Floating popup interface
  */
 const AgUiAgenticExample = () => {
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgUiBackendToolRenderingExample.js

@@ -18,7 +18,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from 'react';
 import { Text } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 import { InlineWeatherCard } from './ag-ui/weather';
 // AG-UI endpoint for backend tool rendering example
@@ -58,7 +58,7 @@ const AgUiBackendToolRenderingExample = () => {
         // State updates are still available if needed for other purposes
         // Uncomment to debug: console.log('[WeatherExample] State update:', _state);
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgUiHaikuGenUIExample.js

@@ -19,7 +19,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useCallback, useRef, useImperativeHandle, forwardRef, } from 'react';
 import { Text } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 import { InlineHaikuCard, HaikuDisplay } from './ag-ui/haiku';
 // AG-UI endpoint for haiku generative UI example
@@ -95,7 +95,7 @@ const AgUiHaikuGenUIExample = () => {
         }
         return (_jsx(InlineHaikuCard, { haiku: haiku, status: context.status, error: context.error }));
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgUiHumanInTheLoopExample.js

@@ -18,7 +18,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState, useEffect } from 'react';
 import { Text, Checkbox, FormControl, Label, ProgressBar, Button, } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 import { TasklistIcon, CheckCircleFillIcon, XCircleFillIcon, } from '@primer/octicons-react';
 // AG-UI endpoint for human in the loop example
@@ -178,7 +178,7 @@ const renderTaskStepsTool = (context) => {
  * - UI state changes based on user actions
  */
 const AgUiHumanInTheLoopExample = () => {
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgUiSharedStateExample.js

@@ -15,7 +15,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useCallback } from 'react';
 import { Text, Button, TextInput, Label } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 import { PlusIcon, XIcon, BeakerIcon, ClockIcon, PersonIcon, } from '@primer/octicons-react';
 // AG-UI endpoint for shared state example
@@ -125,7 +125,7 @@ const AgUiSharedStateExample = () => {
     const handleClear = useCallback(() => {
         setRecipe(DEFAULT_RECIPE);
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgUiToolsBasedGenUIExample.js

@@ -15,7 +15,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useCallback } from 'react';
 import { Text, ProgressBar, Button } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatFloating } from '../components/chat';
 import { CheckCircleIcon, CircleIcon, DotFillIcon, CheckIcon, XIcon, } from '@primer/octicons-react';
 // AG-UI endpoint for agentic generative UI example
@@ -209,7 +209,7 @@ const AgUiToolsBasedGenUIExample = () => {
         setDecision('rejected');
         console.log('Plan rejected');
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,

package/lib/examples/AgentRuntimeCustomExample.js

@@ -7,7 +7,7 @@ import { useCallback, useEffect, useState } from 'react';
 import { Spinner, Text } from '@primer/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { Chat } from '../components/chat';
 // Create a query client for React Query
 const queryClient = new QueryClient({
@@ -121,7 +121,7 @@ Be concise, helpful, and provide working code examples when appropriate.`,
  */
 const AgentRuntimeCustomExample = () => {
     const { agentId, isLoading, error, retry } = useEnsureAgent();
-    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                     display: 'flex',
                     flexDirection: 'column',
                     height: '100vh',

package/lib/examples/AgentRuntimeLexical2Example.js

@@ -127,6 +127,7 @@ function CustomToolsRegistrar() {
 }
 function LexicalEditor({ serviceManager: _serviceManager, }) {
     const [floatingAnchorElem, setFloatingAnchorElem] = useState(null);
+    const [_isLinkEditMode, setIsLinkEditMode] = useState(false);
     const onRef = (_floatingAnchorElem) => {
         if (_floatingAnchorElem !== null) {
             setFloatingAnchorElem(_floatingAnchorElem);
@@ -153,7 +154,7 @@ function LexicalEditor({ serviceManager: _serviceManager, }) {
                             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(AutoLinkPlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(ComponentPickerMenuPlugin, {}), _jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] }))] }) }));
+                        }, 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(AutoLinkPlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), 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/AgentRuntimeLexicalExample.js

@@ -221,9 +221,12 @@ function LexicalWithChat({ content, serviceManager, }) {
     const { isReady, error } = useEnsureAgent(AGENT_ID, BASE_URL);
     // State to hold tools - populated by LexicalToolsPlugin inside the context
     const [tools, setTools] = useState([]);
+    const [toolsKey, setToolsKey] = useState(0);
     // Stable callback for receiving tools from LexicalToolsPlugin
     const handleToolsReady = useCallback((newTools) => {
+        console.log('[LexicalWithChat] 🔄 Tools received, updating state');
         setTools(newTools);
+        setToolsKey(prev => prev + 1); // Force ChatFloating to see new tools
     }, []);
     return (_jsxs(Box, { sx: {
             height: '100vh',
@@ -239,7 +242,7 @@ function LexicalWithChat({ content, serviceManager, }) {
                     color: 'danger.fg',
                     borderRadius: 2,
                     maxWidth: 300,
-                }, children: [_jsx("strong", { children: "Error:" }), " ", error] })), isReady && (_jsx(ChatFloating, { endpoint: AG_UI_ENDPOINT, 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", brandColor: "#7c3aed", tools: tools, useStore: false, showModelSelector: true, showToolsMenu: true, suggestions: [
+                }, children: [_jsx("strong", { children: "Error:" }), " ", error] })), isReady && (_jsx(ChatFloating, { endpoint: AG_UI_ENDPOINT, 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", brandColor: "#7c3aed", tools: tools, useStore: false, showModelSelector: true, showToolsMenu: true, showSkillsMenu: true, suggestions: [
                     {
                         title: 'Insert heading',
                         message: 'Insert a heading that says "Welcome"',
@@ -252,7 +255,7 @@ function LexicalWithChat({ content, serviceManager, }) {
                         title: 'Create list',
                         message: 'Create a bullet list with three items about Jupyter',
                     },
-                ] }))] }));
+                ] }, `chat-${toolsKey}`))] }));
 }
 function AgentRuntimeLexicalExample({ content, serviceManager, }) {
     return _jsx(LexicalWithChat, { content: content, serviceManager: serviceManager });

package/lib/examples/AgentRuntimeLexicalSidebarExample.js

@@ -44,9 +44,10 @@ import { registerCodeHighlighting } from '@lexical/code';
 import { ListPlugin } from '@lexical/react/LexicalListPlugin';
 import { CheckListPlugin } from '@lexical/react/LexicalCheckListPlugin';
 import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
+import { TablePlugin } from '@lexical/react/LexicalTablePlugin';
 import { Box } from '@datalayer/primer-addons';
 import { JupyterReactTheme, useJupyter } from '@datalayer/jupyter-react';
-import { ComponentPickerMenuPlugin, JupyterCellPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, ImagesPlugin, HorizontalRulePlugin, EquationsPlugin, YouTubePlugin, AutoLinkPlugin, AutoEmbedPlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, ListMaxIndentLevelPlugin, LexicalConfigProvider, LexicalStatePlugin, } from '@datalayer/jupyter-lexical';
+import { ComponentPickerMenuPlugin, JupyterCellPlugin, JupyterInputOutputPlugin, DraggableBlockPlugin, ImagesPlugin, HorizontalRulePlugin, EquationsPlugin, YouTubePlugin, ExcalidrawPlugin, CollapsiblePlugin, AutoLinkPlugin, AutoEmbedPlugin, FloatingTextFormatToolbarPlugin, CodeActionMenuPlugin, ListMaxIndentLevelPlugin, LexicalConfigProvider, LexicalStatePlugin, } from '@datalayer/jupyter-lexical';
 // Import Chat components
 import { ChatSidebar, } from '../components/chat';
 import { useLexicalTools } from '../tools/adapters/agent-runtimes/lexicalHooks';
@@ -70,6 +71,7 @@ function CodeHighlightingPlugin() {
 }
 function LexicalEditor({ serviceManager }) {
     const [floatingAnchorElem, setFloatingAnchorElem] = useState(null);
+    const [_isLinkEditMode, setIsLinkEditMode] = useState(false);
     const onRef = (_floatingAnchorElem) => {
         if (_floatingAnchorElem !== null) {
             setFloatingAnchorElem(_floatingAnchorElem);
@@ -96,7 +98,7 @@ function LexicalEditor({ serviceManager }) {
                                     left: '24px',
                                     color: 'var(--fgColor-muted)',
                                     pointerEvents: 'none',
-                                }, children: "Start typing or use the chat to create content..." }), 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(AutoLinkPlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(ComponentPickerMenuPlugin, {}), _jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] }))] })] }) }));
+                                }, children: "Start typing or use the chat to create content..." }), ErrorBoundary: LexicalErrorBoundary }), _jsx(HistoryPlugin, {}), _jsx(AutoFocusPlugin, {}), _jsx(OnChangePlugin, { onChange: onChange }), _jsx(MarkdownShortcutPlugin, { transformers: TRANSFORMERS }), _jsx(CodeHighlightingPlugin, {}), _jsx(ListPlugin, {}), _jsx(CheckListPlugin, {}), _jsx(LinkPlugin, {}), _jsx(TablePlugin, {}), _jsx(JupyterCellPlugin, {}), _jsx(JupyterInputOutputPlugin, {}), _jsx(ImagesPlugin, {}), _jsx(HorizontalRulePlugin, {}), _jsx(EquationsPlugin, {}), _jsx(YouTubePlugin, {}), _jsx(ExcalidrawPlugin, {}), _jsx(CollapsiblePlugin, {}), _jsx(AutoLinkPlugin, {}), _jsx(AutoEmbedPlugin, {}), _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), floatingAnchorElem && (_jsxs(_Fragment, { children: [_jsx(ComponentPickerMenuPlugin, {}), _jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem, setIsLinkEditMode: setIsLinkEditMode }), _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem })] }))] })] }) }));
 }
 export function ChatLexicalExampleInner({ serviceManager, }) {
     // Get lexical tools for ChatSidebar

package/lib/examples/AgentRuntimeNotebookExample.js

@@ -127,7 +127,7 @@ function NotebookWithChat({ serviceManager, }) {
                     color: 'danger.fg',
                     borderRadius: 2,
                     maxWidth: 300,
-                }, children: [_jsx("strong", { children: "Error:" }), " ", error] })), isReady && (_jsx(ChatFloating, { endpoint: AG_UI_ENDPOINT, title: "Notebook AI Agent Runtime", description: "Hi! I can help you edit notebook cells. Try: 'Add a new code cell', 'Run cell 1', or 'Delete the last cell'", defaultOpen: true, defaultViewMode: "panel", position: "bottom-right", brandColor: "#7c3aed", tools: tools, useStore: false, suggestions: [
+                }, children: [_jsx("strong", { children: "Error:" }), " ", error] })), isReady && (_jsx(ChatFloating, { endpoint: AG_UI_ENDPOINT, title: "Notebook AI Agent Runtime", description: "Hi! I can help you edit notebook cells. Try: 'Add a new code cell', 'Run cell 1', or 'Delete the last cell'", defaultOpen: true, defaultViewMode: "panel", position: "bottom-right", brandColor: "#7c3aed", tools: tools, useStore: false, showModelSelector: true, showToolsMenu: true, showSkillsMenu: true, suggestions: [
                     {
                         title: 'Add a cell',
                         message: 'Insert a random cell to the notebook',

package/lib/examples/AgentRuntimeStandaloneExample.js

@@ -18,7 +18,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from 'react';
 import { Text } from '@primer/react';
 import { Box } from '@datalayer/primer-addons';
-import { datalayerTheme, DatalayerThemeProvider } from '@datalayer/core';
+import { DatalayerThemeProvider } from '@datalayer/core';
 import { ChatStandalone } from '../components/chat';
 /**
  * Simulated AI responses for demo purposes.
@@ -97,7 +97,7 @@ const AgentRuntimePopupStandaloneExample = () => {
             throw err;
         }
     }, []);
-    return (_jsx(DatalayerThemeProvider, { theme: datalayerTheme, children: _jsxs(Box, { sx: {
+    return (_jsx(DatalayerThemeProvider, { children: _jsxs(Box, { sx: {
                 minHeight: '100vh',
                 backgroundColor: 'canvas.default',
                 padding: 4,