@datalayer/core 1.2.22 → 1.2.24

package/README.md

@@ -100,10 +100,11 @@ Use `agent-runtimes` for runtime workloads (`RuntimeClient`, `@datalayer`, snaps
 
 ## Examples
 
-Examples have moved to Agent Runtimes:
+The [examples](./examples/README.md) show the Datalayer Client at work:
 
-- [Agent Runtimes examples README](https://github.com/datalayer/agent-runtimes/blob/main/examples/README.md)
-- [Agent Runtimes examples directory](https://github.com/datalayer/agent-runtimes/tree/main/examples)
+- [OpenTelemetry observability](./examples/otel/README.md): instrument Datalayer usage with OpenTelemetry traces and metrics, with a small FastAPI service and a React UI to visualize them (`make` targets in [examples/otel](./examples/otel)).
+
+For agents, chats and sandboxes built on the client, see the [Agent Runtimes examples](https://github.com/datalayer/agent-runtimes/tree/main/examples).
 
 ## Platform Integration
 

package/lib/api/DatalayerApi.d.ts

@@ -1,4 +1,3 @@
-import { AxiosRequestConfig } from 'axios';
 /**
  * Error wrapper for failed HTTP responses.
  * Includes response details, warnings, errors, and tracebacks.
@@ -44,15 +43,15 @@ export declare class RunResponseError extends Error {
 }
 /**
  * Error wrapper for network failures.
- * Thrown when HTTP request fails due to connectivity issues.
+ * Thrown when `fetch` could not reach the server at all.
  */
 export declare class NetworkError extends TypeError {
     /**
-     * Creates a NetworkError from the original TypeError.
+     * Creates a NetworkError from the error `fetch` rejected with.
      *
      * @param original - The original network error
      */
-    constructor(original: TypeError);
+    constructor(original: Error);
 }
 /**
  * Thrown when a request is made with a JWT that has already expired.
@@ -85,6 +84,15 @@ export declare class TokenExpiredError extends Error {
     readonly url: string;
     constructor(url: string, expiredAt: number);
 }
+/**
+ * How the response body is read.
+ *
+ * `json` (the default) parses the body as JSON and falls back to the text
+ * when it does not parse, so an empty body or a plain-text answer still
+ * arrives as data rather than an error. `stream` hands back the body's
+ * `ReadableStream` unread.
+ */
+export type DatalayerAPIResponseType = 'json' | 'text' | 'blob' | 'arraybuffer' | 'stream';
 /**
  * Options for Datalayer API requests.
  */
@@ -93,7 +101,7 @@ export interface IRequestDatalayerAPIOptions {
     url: string;
     /** HTTP method (GET, POST, PUT, DELETE, etc.) */
     method?: string;
-    /** Request body (JSON object or FormData) */
+    /** Request body (JSON object, FormData, string, or raw bytes) */
     body?: any;
     /** Custom HTTP headers */
     headers?: Record<string, string>;
@@ -101,8 +109,8 @@ export interface IRequestDatalayerAPIOptions {
     token?: string;
     /** AbortSignal for request cancellation */
     signal?: AbortSignal;
-    /** Axios response representation for binary or streaming transports. */
-    responseType?: AxiosRequestConfig['responseType'];
+    /** How to read the body; `json` when omitted. */
+    responseType?: DatalayerAPIResponseType;
 }
 export interface IDatalayerAPIResponse<T> {
     data: T;
@@ -118,6 +126,7 @@ export interface IDatalayerAPIResponse<T> {
  * @returns Promise resolving to response data
  * @throws {NetworkError} On network failures
  * @throws {RunResponseError} On HTTP error responses
+ * @throws {TokenExpiredError} On a 401 explained by an expired token
  *
  * @example
  * ```typescript

package/lib/api/DatalayerApi.js

@@ -9,7 +9,6 @@
  * @module api/DatalayerApi
  */
 import { URLExt } from '@jupyterlab/coreutils';
-import axios from 'axios';
 import { sleep } from '../utils/Sleep.js';
 import { getJwtExpiryMs, isJwtExpired } from '../utils/Jwt.js';
 function isFormDataBody(body) {
@@ -106,11 +105,11 @@ export class RunResponseError extends Error {
 }
 /**
  * Error wrapper for network failures.
- * Thrown when HTTP request fails due to connectivity issues.
+ * Thrown when `fetch` could not reach the server at all.
  */
 export class NetworkError extends TypeError {
     /**
-     * Creates a NetworkError from the original TypeError.
+     * Creates a NetworkError from the error `fetch` rejected with.
      *
      * @param original - The original network error
      */
@@ -189,6 +188,80 @@ function throwIfTokenExpired(status, token, url) {
     }
     throw new TokenExpiredError(url, getJwtExpiryMs(token) ?? Date.now());
 }
+/**
+ * Bodies `fetch` sends as they are. Everything else is a JSON value and is
+ * stringified.
+ */
+function isRawBody(body) {
+    return (typeof body === 'string' ||
+        (typeof Blob !== 'undefined' && body instanceof Blob) ||
+        body instanceof ArrayBuffer ||
+        ArrayBuffer.isView(body) ||
+        (typeof URLSearchParams !== 'undefined' &&
+            body instanceof URLSearchParams) ||
+        (typeof ReadableStream !== 'undefined' && body instanceof ReadableStream));
+}
+/**
+ * The response headers as a plain record, keyed in lower case the way
+ * `Headers` reports them.
+ */
+function headersToRecord(headers) {
+    const record = {};
+    headers.forEach((value, name) => {
+        record[name] = value;
+    });
+    return record;
+}
+/**
+ * Reads the body the way `responseType` asks for.
+ */
+async function readBody(response, responseType) {
+    switch (responseType) {
+        case 'text':
+            return response.text();
+        case 'blob':
+            return response.blob();
+        case 'arraybuffer':
+            return response.arrayBuffer();
+        case 'stream':
+            return response.body;
+        default: {
+            const text = await response.text();
+            try {
+                return JSON.parse(text);
+            }
+            catch {
+                return text;
+            }
+        }
+    }
+}
+/**
+ * Sends one request and returns the response when the server accepted it.
+ *
+ * A failure to reach the server at all arrives as `NetworkError`; an abort
+ * through the caller's signal is rethrown as it came, since the caller asked
+ * for it. A non-2xx answer becomes `TokenExpiredError` when a 401 is explained
+ * by the token we sent, and `RunResponseError` otherwise.
+ */
+async function send(url, init, token) {
+    let response;
+    try {
+        response = await fetch(url, init);
+    }
+    catch (error) {
+        // By name: a DOMException is not an `Error` in every realm.
+        if (error?.name === 'AbortError') {
+            throw error;
+        }
+        throw new NetworkError(error instanceof Error ? error : new TypeError(String(error)));
+    }
+    if (!response.ok) {
+        throwIfTokenExpired(response.status, token, url);
+        throw await RunResponseError.create(response);
+    }
+    return response;
+}
 /**
  * Makes authenticated HTTP requests to Datalayer APIs.
  * Handles JSON and FormData, includes auth headers, and manages redirects.
@@ -197,6 +270,7 @@ function throwIfTokenExpired(status, token, url) {
  * @returns Promise resolving to response data
  * @throws {NetworkError} On network failures
  * @throws {RunResponseError} On HTTP error responses
+ * @throws {TokenExpiredError} On a 401 explained by an expired token
  *
  * @example
  * ```typescript
@@ -208,147 +282,109 @@ function throwIfTokenExpired(status, token, url) {
  * ```
  */
 export async function requestDatalayerAPIWithResponse({ url, method, body, token, signal, responseType, headers = {}, }) {
-    // Handle FormData differently from JSON
-    const isFormData = isFormDataBody(body);
-    // Prepare axios config
-    const axiosConfig = {
-        url,
-        method: (method ?? 'GET'),
-        headers: { ...headers },
-        withCredentials: true, // equivalent to credentials: 'include'
-        signal,
-        responseType,
-        // CORS mode is handled automatically by axios
-        // Cache control headers
-    };
-    // In Vitest+jsdom, axios may pick the XHR adapter and fail with browser-like
-    // network restrictions. Force the fetch adapter for integration reliability.
-    if (typeof process !== 'undefined' && process.env.VITEST) {
-        axiosConfig.adapter = 'fetch';
-    }
-    // Add cache control headers only for GET requests (equivalent to cache: 'no-store')
-    if (method === 'GET' || !method) {
-        if (!axiosConfig.headers['Cache-Control']) {
-            axiosConfig.headers['Cache-Control'] =
-                'no-store, no-cache, must-revalidate';
+    const requestMethod = method ?? 'GET';
+    const requestHeaders = new Headers(headers);
+    // A GET must not be answered from a cache (the equivalent of
+    // `cache: 'no-store'`, said in headers so proxies hear it too).
+    if (requestMethod === 'GET') {
+        if (!requestHeaders.has('Cache-Control')) {
+            requestHeaders.set('Cache-Control', 'no-store, no-cache, must-revalidate');
         }
-        if (!axiosConfig.headers['Pragma']) {
-            axiosConfig.headers['Pragma'] = 'no-cache';
+        if (!requestHeaders.has('Pragma')) {
+            requestHeaders.set('Pragma', 'no-cache');
         }
     }
     if (token) {
-        axiosConfig.headers['Authorization'] = `Bearer ${token}`;
+        requestHeaders.set('Authorization', `Bearer ${token}`);
     }
-    if (isFormData) {
-        // For FormData: let axios handle Content-Type automatically
-        axiosConfig.data = body;
-        // Don't set Content-Type - axios will set multipart/form-data with boundary
-        if (!axiosConfig.headers['Accept']) {
-            axiosConfig.headers['Accept'] = 'application/json';
-        }
+    if (!requestHeaders.has('Accept')) {
+        requestHeaders.set('Accept', 'application/json');
+    }
+    let requestBody;
+    if (isFormDataBody(body)) {
+        // No Content-Type: the browser sets multipart/form-data with its
+        // boundary.
+        requestBody = body;
     }
     else {
-        // For regular JSON requests
-        if (!axiosConfig.headers['Accept']) {
-            axiosConfig.headers['Accept'] = 'application/json';
+        if (!requestHeaders.has('Content-Type')) {
+            requestHeaders.set('Content-Type', 'application/json');
         }
-        if (!axiosConfig.headers['Content-Type']) {
-            axiosConfig.headers['Content-Type'] = 'application/json';
+        if (body === undefined) {
+            requestBody = undefined;
         }
-        axiosConfig.data = body;
-    }
-    try {
-        const response = await axios(axiosConfig);
-        if (response.status < 300) {
-            // Handle redirections if needed.
-            if (response.status === 202 && response.headers.location) {
-                const data = await handleAxiosRedirection(response, axiosConfig);
-                return {
-                    data: data,
-                    status: response.status,
-                    statusText: response.statusText,
-                    headers: { ...response.headers },
-                };
-            }
+        else if (isRawBody(body)) {
+            requestBody = body;
         }
         else {
-            throwIfTokenExpired(response.status, token, url);
-            const adaptedResponse = {
-                ok: false,
-                status: response.status,
-                statusText: response.statusText,
-                json: async () => response?.data,
-                text: async () => JSON.stringify(response?.data),
-            };
-            throw await RunResponseError.create(adaptedResponse);
+            requestBody = JSON.stringify(body);
         }
-        return {
-            data: response.data,
-            status: response.status,
-            statusText: response.statusText,
-            headers: { ...response.headers },
-        };
     }
-    catch (error) {
-        if (axios.isAxiosError(error)) {
-            if (error.response) {
-                throwIfTokenExpired(error.response.status, token, url);
-                // Convert axios error to our RunResponseError format
-                const adaptedResponse = {
-                    ok: false,
-                    status: error.response.status,
-                    statusText: error.response.statusText,
-                    json: async () => error.response?.data,
-                    text: async () => JSON.stringify(error.response?.data),
-                };
-                throw await RunResponseError.create(adaptedResponse);
-            }
-            throw new NetworkError(error);
-        }
-        throw error;
+    const init = {
+        method: requestMethod,
+        headers: requestHeaders,
+        body: requestBody,
+        // Sends the browser's cookies along, cross-origin included.
+        credentials: 'include',
+        signal,
+    };
+    let response = await send(url, init, token);
+    // A 202 with a Location is the server saying the work is still running
+    // there: poll it until it is done.
+    if (response.status === 202 && response.headers.get('location')) {
+        response = await followAsyncRedirect(response, init, url, token);
     }
+    return {
+        data: (await readBody(response, responseType)),
+        status: response.status,
+        statusText: response.statusText,
+        headers: headersToRecord(response.headers),
+    };
 }
 export async function requestDatalayerAPI(options) {
     return (await requestDatalayerAPIWithResponse(options)).data;
 }
-async function handleAxiosRedirection(response, originalConfig) {
-    let redirect = response.headers.location;
-    if (redirect) {
-        const baseUrl = originalConfig.url ?? '';
-        const normalizedRedirect = String(redirect).replace(/^([a-z][a-z0-9+.-]*):\/(?!\/)/i, '$1://');
-        try {
-            const resolved = new URL(normalizedRedirect, baseUrl);
-            const base = new URL(baseUrl, typeof window !== 'undefined' ? window.location.origin : undefined);
-            // If a proxy emits an http Location for the same host while the
-            // original request is https, force https to avoid mixed-content errors
-            // that browsers often report as CORS/network failures.
-            if (base.protocol === 'https:' &&
-                resolved.protocol === 'http:' &&
-                resolved.hostname === base.hostname) {
-                resolved.protocol = 'https:';
-                if (resolved.port === '80') {
-                    resolved.port = '';
-                }
+/**
+ * Resolves the Location of a 202 against the request's URL.
+ *
+ * A proxy that emits an http Location for the same host while the original
+ * request was https gets it forced back to https, since the browser would
+ * refuse the mixed content and report it as a CORS or network failure.
+ */
+function resolveLocation(location, baseUrl) {
+    const normalized = location.replace(/^([a-z][a-z0-9+.-]*):\/(?!\/)/i, '$1://');
+    try {
+        const resolved = new URL(normalized, baseUrl);
+        const base = new URL(baseUrl, typeof window !== 'undefined' ? window.location.origin : undefined);
+        if (base.protocol === 'https:' &&
+            resolved.protocol === 'http:' &&
+            resolved.hostname === base.hostname) {
+            resolved.protocol = 'https:';
+            if (resolved.port === '80') {
+                resolved.port = '';
             }
-            redirect = resolved.toString();
-        }
-        catch {
-            const parsedURL = URLExt.parse(baseUrl);
-            const fallbackBase = parsedURL.protocol + '//' + parsedURL.hostname;
-            redirect = URLExt.join(fallbackBase, normalizedRedirect);
         }
+        return resolved.toString();
+    }
+    catch {
+        const parsedURL = URLExt.parse(baseUrl);
+        const fallbackBase = parsedURL.protocol + '//' + parsedURL.hostname;
+        return URLExt.join(fallbackBase, normalized);
     }
+}
+/**
+ * Polls the Location of a 202 with GETs, backing off from a second and
+ * doubling, until the answer is no longer a 202. The polls carry the
+ * original headers and credentials, never the body.
+ */
+async function followAsyncRedirect(response, init, url, token) {
+    const location = resolveLocation(response.headers.get('location'), url);
+    const pollInit = { ...init, method: 'GET', body: undefined };
     let sleepTimeout = 1000;
-    while (response.status === 202 && redirect) {
+    while (response.status === 202) {
         await sleep(sleepTimeout);
         sleepTimeout *= 2;
-        const redirectConfig = {
-            ...originalConfig,
-            url: redirect,
-            method: 'GET',
-            data: undefined, // Don't send body on redirect
-        };
-        response = await axios(redirectConfig);
+        response = await send(location, pollInit, token);
     }
-    return response.data;
+    return response;
 }

package/lib/api/index.d.ts

@@ -8,7 +8,7 @@
  */
 export { requestDatalayerAPI, requestDatalayerAPIWithResponse, RunResponseError, NetworkError, TokenExpiredError, } from './DatalayerApi';
 export type { IRequestDatalayerAPIOptions } from './DatalayerApi';
-export type { IDatalayerAPIResponse } from './DatalayerApi';
+export type { IDatalayerAPIResponse, DatalayerAPIResponseType, } from './DatalayerApi';
 export * as iam from './iam';
 export * as contents from './contents';
 export * as evals from './evals';

package/lib/components/buttons/CopyToClipboardButton.d.ts

@@ -0,0 +1,13 @@
+export type CopyToClipboardButtonProps = {
+    value: string;
+    ariaLabel?: string;
+    successText?: string;
+    errorText?: string;
+    direction?: 'n' | 's' | 'e' | 'w' | 'nw' | 'ne' | 'sw' | 'se';
+    disabled?: boolean;
+    size?: 'small' | 'medium';
+    variant?: 'default' | 'invisible' | 'primary' | 'danger';
+    onResult?: (copied: boolean) => void;
+};
+export declare function CopyToClipboardButton({ value, ariaLabel, successText, errorText, direction, disabled, size, variant, onResult, }: CopyToClipboardButtonProps): import("react").JSX.Element;
+export default CopyToClipboardButton;

package/lib/components/buttons/CopyToClipboardButton.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * A button that copies a value, its tooltip saying what it copies, then
+ * whether it did.
+ *
+ * @module components/buttons/CopyToClipboardButton
+ */
+import { useMemo, useState } from 'react';
+import { IconButton, Tooltip } from '@primer/react';
+import { CopyIcon } from '@primer/octicons-react';
+const ellipsize = (value, max = 96) => {
+    if (!value) {
+        return '';
+    }
+    if (value.length <= max) {
+        return value;
+    }
+    const head = Math.floor((max - 1) / 2);
+    const tail = max - head - 1;
+    return `${value.slice(0, head)}…${value.slice(-tail)}`;
+};
+export function CopyToClipboardButton({ value, ariaLabel = 'Copy to clipboard', successText = 'Copied', errorText = 'Unable to copy', direction = 'n', disabled = false, size = 'small', variant = 'invisible', onResult, }) {
+    const [status, setStatus] = useState('idle');
+    const hasValue = Boolean(value && value.trim());
+    const tooltip = useMemo(() => {
+        if (status === 'success') {
+            return successText;
+        }
+        if (status === 'error') {
+            return errorText;
+        }
+        return hasValue ? `Copy: ${ellipsize(value)}` : 'Nothing to copy';
+    }, [status, successText, errorText, hasValue, value]);
+    const handleClick = async () => {
+        if (!hasValue || disabled) {
+            return;
+        }
+        try {
+            if (!navigator?.clipboard?.writeText) {
+                throw new Error('Clipboard API unavailable');
+            }
+            await navigator.clipboard.writeText(value);
+            setStatus('success');
+            onResult?.(true);
+            window.setTimeout(() => setStatus('idle'), 1500);
+        }
+        catch {
+            setStatus('error');
+            onResult?.(false);
+            window.setTimeout(() => setStatus('idle'), 1800);
+        }
+    };
+    const isDisabled = disabled || !hasValue;
+    const button = (_jsx(IconButton, { "aria-label": ariaLabel, icon: CopyIcon, size: size, variant: variant, disabled: isDisabled, onClick: handleClick }));
+    /*
+     * A disabled button wears no tooltip.
+     *
+     * `Tooltip` only takes interactive content — `button:not([disabled])` — and
+     * throws on anything else, which is what a disabled button is. Nothing is
+     * lost by leaving it out: a disabled element fires no pointer event, so the
+     * tooltip would never have shown. `IconButton` does the same with the one
+     * it renders of its own.
+     */
+    if (isDisabled) {
+        return button;
+    }
+    return (_jsx(Tooltip, { text: tooltip, direction: direction, children: button }));
+}
+export default CopyToClipboardButton;

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

@@ -1,3 +1,4 @@
+export * from './CopyToClipboardButton';
 export * from './DownloadCSVButton';
 export * from './DownloadJsonButton';
 export * from './LongActionButton';

package/lib/components/buttons/index.js

@@ -2,6 +2,7 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
+export * from './CopyToClipboardButton.js';
 export * from './DownloadCSVButton.js';
 export * from './DownloadJsonButton.js';
 export * from './LongActionButton.js';

package/lib/hooks/deckSpec.d.ts

@@ -0,0 +1,2 @@
+/** The value a deck's `model_s` holds, or `undefined` when it holds none. */
+export declare const parseDeckSpec: (text: unknown) => unknown;

package/lib/hooks/deckSpec.js

@@ -0,0 +1,22 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * A deck's specification, as Spacer serves it: YAML.
+ *
+ * `GET /decks/{id}` inlines the specification as `model_s`, the text Spacer
+ * stored — YAML, or JSON for a deck stored before the specification was
+ * YAML, which the same parser reads (JSON is YAML). Saving sends the parsed
+ * value back (`PUT /decks/{id}/model`), and Spacer writes it as YAML.
+ *
+ * @module hooks/deckSpec
+ */
+import { parse } from 'yaml';
+/** The value a deck's `model_s` holds, or `undefined` when it holds none. */
+export const parseDeckSpec = (text) => {
+    if (typeof text !== 'string' || !text.trim()) {
+        return undefined;
+    }
+    return parse(text);
+};

package/lib/hooks/useCache.d.ts

@@ -38,6 +38,27 @@ type IAnySpace = any;
 export type CacheProps = {
     loginRoute?: string;
 };
+/** A deck's video, as Spacer keeps it with the deck (`GET /decks/{id}/video`). */
+export type SavedDeckVideo = {
+    /** Signed: plays it for `expiresIn` seconds. */
+    url: string;
+    /** Signed: downloads it as `<deck name>.mp4`. */
+    downloadUrl: string;
+    /** Signed: its first frame, a PNG. */
+    posterUrl: string;
+    /** Its captions, as WebVTT text. */
+    captions: string;
+    width: number;
+    height: number;
+    bytes: number;
+    madeAt: string;
+    madeBy: string;
+    /** When the deck was last edited, if it says. */
+    editedAt: string;
+    /** The deck has been edited since the video was made. */
+    stale: boolean;
+    expiresIn: number;
+};
 export type ISearchOpts = {
     q: string;
     types: string[];
@@ -282,6 +303,8 @@ export declare const queryKeys: {
         readonly detail: (id: string) => readonly ["decks", "detail", string];
         readonly bySpace: (spaceId: string) => readonly ["decks", "space", string];
         readonly model: (deckId: string) => readonly ["decks", "detail", string, "model"];
+        /** Under the detail: saving the deck refreshes whether it is stale. */
+        readonly video: (deckId: string) => readonly ["decks", "detail", string, "video"];
     };
     readonly cells: {
         readonly all: () => readonly ["cells"];
@@ -803,6 +826,15 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
         spec: unknown;
     }, unknown>;
     useCloneDeck: () => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
+    useSavedDeckVideo: (deckId: string) => import("@tanstack/react-query").UseQueryResult<SavedDeckVideo | null, Error>;
+    useSaveDeckVideo: () => import("@tanstack/react-query").UseMutationResult<SavedDeckVideo, Error, {
+        deckId: string;
+        video: Blob;
+        captions: string;
+        poster: Blob;
+        spec: unknown;
+    }, unknown>;
+    useDeleteDeckVideo: () => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
     useDocument: (documentId: string) => import("@tanstack/react-query").UseQueryResult<any, Error>;
     useDocumentsBySpace: (spaceId: string) => import("@tanstack/react-query").UseQueryResult<any, Error>;
     useCreateDocument: () => import("@tanstack/react-query").UseMutationResult<any, Error, {
@@ -958,6 +990,12 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
         data?: string;
     }, unknown>;
     useResetItemImage: () => import("@tanstack/react-query").UseMutationResult<any, Error, string, unknown>;
+    useSetItemVideo: () => import("@tanstack/react-query").UseMutationResult<any, Error, {
+        itemId: string;
+        video: Blob;
+        captions: string;
+        poster: Blob;
+    }, unknown>;
     useCountItemReuse: () => import("@tanstack/react-query").UseMutationResult<any, Error, {
         itemId: string;
         kind: "clone" | "instantiate";
@@ -975,6 +1013,14 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
             ref?: string;
             data?: string;
         };
+        /**
+         * Publish a deck *as a video*: the video saved with it in its space
+         * becomes the published deck's video — its page plays it and its
+         * shared link announces it (`og:video`). The library copies it in
+         * the same request that publishes, and refuses before publishing a
+         * deck that has none.
+         */
+        video?: boolean;
         /**
          * The publisher's own words for their work, which is what somebody
          * else will search for.
@@ -1415,6 +1461,8 @@ export declare const useCache: ({ loginRoute }?: CacheProps) => {
             readonly detail: (id: string) => readonly ["decks", "detail", string];
             readonly bySpace: (spaceId: string) => readonly ["decks", "space", string];
             readonly model: (deckId: string) => readonly ["decks", "detail", string, "model"];
+            /** Under the detail: saving the deck refreshes whether it is stale. */
+            readonly video: (deckId: string) => readonly ["decks", "detail", string, "video"];
         };
         readonly cells: {
             readonly all: () => readonly ["cells"];

package/lib/hooks/useCache.js

@@ -39,6 +39,7 @@
 import { useQuery, useQueries, useMutation, useQueryClient, } from '@tanstack/react-query';
 import { BOOTSTRAP_USER_ONBOARDING, asContact, asInvite, asOrganization, asSecret, asTeam, asToken, asUser, } from '../models/index.js';
 import { asSpace } from './cacheConverters.js';
+import { parseDeckSpec } from './deckSpec.js';
 import { libraryAppFieldsOf } from './libraryApp.js';
 import { unlinkIAMProvider } from './unlinkIAMProvider.js';
 import { useCoreStore, useIAMStore, profileStore } from '../state/index.js';
@@ -368,6 +369,8 @@ export const queryKeys = {
         detail: (id) => [...queryKeys.decks.details(), id],
         bySpace: (spaceId) => [...queryKeys.decks.all(), 'space', spaceId],
         model: (deckId) => [...queryKeys.decks.detail(deckId), 'model'],
+        /** Under the detail: saving the deck refreshes whether it is stale. */
+        video: (deckId) => [...queryKeys.decks.detail(deckId), 'video'],
     },
     // Cells
     cells: {
@@ -721,6 +724,10 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
             meta.publisher = raw.publisher;
         if (raw.image !== undefined)
             meta.image = raw.image;
+        // A deck's video, made by its owner: `url`, `captionsUrl`, `posterUrl`,
+        // `width`, `height`. Absent when it has none.
+        if (raw.video)
+            meta.video = raw.video;
         /*
          * Where the artifact can be opened for editing.
          *
@@ -1074,7 +1081,8 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
             name: raw.name_t,
             description: raw.description_t,
             tags: Array.isArray(raw.tags_ss) ? raw.tags_ss : [],
-            spec: raw.model_s ? JSON.parse(raw.model_s) : undefined,
+            // YAML, as Spacer stores it (a deck stored as JSON reads the same).
+            spec: parseDeckSpec(raw.model_s),
             public: raw.is_public_b ?? false,
             creationDate: new Date(raw.creation_ts_dt),
             lastUpdateDate: raw.last_update_ts_dt
@@ -2628,6 +2636,77 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
             },
         });
     };
+    /**
+     * The video saved with a deck in its space, or `null` when it has none.
+     *
+     * Signed URLs that read it for a few hours (`url`, `posterUrl`, and
+     * `downloadUrl`, an attachment named after the deck), its captions inline
+     * (WebVTT), its size, when it was made, and `stale` — the deck has been
+     * edited since: its spec is not the one the video was made from.
+     */
+    const useSavedDeckVideo = (deckId) => {
+        return useQuery({
+            queryKey: queryKeys.decks.video(deckId),
+            queryFn: async () => {
+                const resp = await requestDatalayer({
+                    url: `${configuration.spacerUrl}/api/spacer/v1/decks/${encodeURIComponent(deckId)}/video`,
+                    method: 'GET',
+                });
+                if (!resp.success) {
+                    throw new Error(resp.message || 'Failed to read the deck video');
+                }
+                return (resp.video ?? null);
+            },
+            ...DEFAULT_QUERY_OPTIONS,
+            enabled: !!deckId,
+        });
+    };
+    /**
+     * Keep the video the deck engine made of a deck with the deck, in its
+     * space, replacing the one it had: the MP4, its WebVTT captions, its
+     * poster, and the spec it was made from.
+     */
+    const useSaveDeckVideo = () => {
+        return useMutation({
+            mutationFn: async ({ deckId, video, captions, poster, spec, }) => {
+                const body = new FormData();
+                body.append('video', video, 'video.mp4');
+                body.append('captions', new Blob([captions], { type: 'text/vtt' }), 'captions.vtt');
+                body.append('poster', poster, 'poster.png');
+                body.append('spec', JSON.stringify(spec));
+                const resp = await requestDatalayer({
+                    url: `${configuration.spacerUrl}/api/spacer/v1/decks/${encodeURIComponent(deckId)}/video`,
+                    method: 'PUT',
+                    body,
+                });
+                if (!resp.success) {
+                    throw new Error(resp.message || 'Failed to save the video');
+                }
+                return resp.video;
+            },
+            onSuccess: (video, { deckId }) => {
+                queryClient.setQueryData(queryKeys.decks.video(deckId), video);
+            },
+        });
+    };
+    /** The deck without its saved video. */
+    const useDeleteDeckVideo = () => {
+        return useMutation({
+            mutationFn: async (deckId) => {
+                const resp = await requestDatalayer({
+                    url: `${configuration.spacerUrl}/api/spacer/v1/decks/${encodeURIComponent(deckId)}/video`,
+                    method: 'DELETE',
+                });
+                if (!resp.success) {
+                    throw new Error(resp.message || 'Failed to remove the video');
+                }
+                return resp;
+            },
+            onSuccess: (_, deckId) => {
+                queryClient.setQueryData(queryKeys.decks.video(deckId), null);
+            },
+        });
+    };
     /**
      * Clone notebook
      */
@@ -6915,6 +6994,31 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
             onSuccess: invalidateArtifactVisibility,
         });
     };
+    /**
+     * A published deck's video, made in its owner's browser by the deck
+     * engine: the MP4, its WebVTT captions and its poster (the first slide).
+     * Making it again replaces it.
+     */
+    const useSetItemVideo = () => {
+        return useMutation({
+            mutationFn: async ({ itemId, video, captions, poster, }) => {
+                const body = new FormData();
+                body.append('video', video, 'video.mp4');
+                body.append('captions', new Blob([captions], { type: 'text/vtt' }), 'captions.vtt');
+                body.append('poster', poster, 'poster.png');
+                const resp = await requestDatalayer({
+                    url: `${configuration.libraryUrl}/api/library/v1/items/${encodeURIComponent(itemId)}/video`,
+                    method: 'PUT',
+                    body,
+                });
+                if (!resp.success) {
+                    throw new Error(resp.message || 'Failed to set the video');
+                }
+                return resp.video;
+            },
+            onSuccess: invalidateArtifactVisibility,
+        });
+    };
     /** Publish a public artifact natively to LinkedIn through Library's saga. */
     const usePublishLinkedInShare = () => {
         return useMutation({
@@ -7131,7 +7235,7 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
     const usePublishArtifact = () => {
         const setImage = useSetItemImage();
         return useMutation({
-            mutationFn: async ({ itemId, image, tags, description, }) => {
+            mutationFn: async ({ itemId, image, tags, description, video, }) => {
                 /*
                  * Publish first, then dress it.
                  *
@@ -7156,6 +7260,7 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
                         // words must not be able to clear them by omission.
                         ...(tags === undefined ? {} : { tags }),
                         ...(description === undefined ? {} : { description }),
+                        ...(video ? { video: true } : {}),
                     },
                 });
                 if (!resp.success) {
@@ -8584,6 +8689,9 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
         useUpdateDeck,
         useUpdateDeckModel,
         useCloneDeck,
+        useSavedDeckVideo,
+        useSaveDeckVideo,
+        useDeleteDeckVideo,
         // Documents
         useDocument,
         useDocumentsBySpace,
@@ -8655,6 +8763,7 @@ export const useCache = ({ loginRoute = '/login' } = {}) => {
         useSetFeaturedRank,
         useSetItemImage,
         useResetItemImage,
+        useSetItemVideo,
         useCountItemReuse,
         useSyncArtifactCatalogue,
         usePublishArtifact,

package/lib/hooks/useUpload.d.ts

@@ -1,3 +1,10 @@
+/**
+ * Posts a form to `url` through the API transport.
+ *
+ * `progress` is 0 while the upload is in flight and 100 once the server has
+ * answered: `fetch` reports no upload progress, so there is nothing in
+ * between to show.
+ */
 export declare const useUploadForm: (url: string) => {
     uploadAndSubmit: (formData: FormData) => Promise<any>;
     isSuccess: boolean;

package/lib/hooks/useUpload.js

@@ -3,16 +3,20 @@
  * Distributed under the terms of the Modified BSD License.
  */
 import { useState } from 'react';
-import axios from 'axios';
-// import useRun from "./useRun.js";
+import { requestDatalayerAPI } from '../api/DatalayerApi.js';
 import { useIAMStore } from '../state/index.js';
-// TODO reuse useRun hook.
+/**
+ * Posts a form to `url` through the API transport.
+ *
+ * `progress` is 0 while the upload is in flight and 100 once the server has
+ * answered: `fetch` reports no upload progress, so there is nothing in
+ * between to show.
+ */
 export const useUploadForm = (url) => {
     const [isSuccess, setIsSuccess] = useState(false);
     const [isLoading, setIsLoading] = useState(false);
     const [progress, setProgress] = useState(0);
     const { token } = useIAMStore();
-    //  const { requestRun } = useRun();
     const reset = () => {
         setIsSuccess(false);
         setIsLoading(false);
@@ -21,19 +25,11 @@ export const useUploadForm = (url) => {
     const uploadAndSubmit = async (formData) => {
         setIsLoading(true);
         try {
-            const { data } = await axios.post(url, formData, {
-                headers: {
-                    'Content-Type': 'multipart/form-data',
-                    Authorization: `Bearer ${token}`,
-                },
-                onUploadProgress: progressEvent => {
-                    const progress = (progressEvent.loaded / progressEvent.total) * 50;
-                    setProgress(progress);
-                },
-                onDownloadProgress: progressEvent => {
-                    const progress = 50 + (progressEvent.loaded / progressEvent.total) * 50;
-                    setProgress(progress);
-                },
+            const data = await requestDatalayerAPI({
+                url,
+                method: 'POST',
+                body: formData,
+                token,
             });
             setProgress(100);
             await new Promise(resolve => {

package/lib/index.d.ts

@@ -5,7 +5,7 @@ export * from './navigation';
 export * from './hooks';
 export { requestDatalayerAPI, requestDatalayerAPIWithResponse, RunResponseError, NetworkError, } from './api/DatalayerApi';
 export type { IRequestDatalayerAPIOptions } from './api/DatalayerApi';
-export type { IDatalayerAPIResponse } from './api/DatalayerApi';
+export type { IDatalayerAPIResponse, DatalayerAPIResponseType, } from './api/DatalayerApi';
 export { API_BASE_PATHS } from './api/constants';
 export * as iamApi from './api/iam';
 export * as contentsApi from './api/contents';

package/lib/otel/hooks/index.js

@@ -30,7 +30,7 @@ export function setOtelOnUnauthorized(cb) {
 }
 /**
  * Lightweight fetch helper for OTEL API calls.
- * Uses plain `fetch` to avoid pulling in `@jupyterlab/coreutils` / axios.
+ * Uses plain `fetch` to avoid pulling in `@jupyterlab/coreutils`.
  *
  * If the response is **401 Unauthorized** and a global `onUnauthorized`
  * handler has been registered via {@link setOtelOnUnauthorized}, the

package/lib/state/substates/NavigationState.js

@@ -301,8 +301,22 @@ export function viewForRoute(route, current) {
     if (path === '/apps' || path.startsWith('/apps/')) {
         return 'apps';
     }
+    // A space's decks and teaching pages are drawn beside the Agentify sidebar:
+    // filed under the Platform, the Platform button came back to a deck with
+    // the Agentify sidebar beside it (reported 23 October 2026).
+    if (AGENTIFY_SPACE_PAGE.test(path) || AGENTIFY_ACCOUNT_PAGE.test(path)) {
+        return 'agentify';
+    }
     return 'home';
 }
+/**
+ * `/<account>/<space>/<kind>[/…]` for the kinds a space shows beside the
+ * Agentify sidebar — decks, courses and what a course is made of. The
+ * documentation (`/docs/…`) is never an account.
+ */
+const AGENTIFY_SPACE_PAGE = /^\/(?!docs\/)[^/]+\/[^/]+\/(?:decks|courses|course|lessons|exercises|assignments)(?:\/|$)/;
+/** `/<account>/courses`: an account's courses, beside the Agentify sidebar. */
+const AGENTIFY_ACCOUNT_PAGE = /^\/(?!docs\/)[^/]+\/courses$/;
 /** Whether a page may be the one a shell returns to. */
 function isRouteOfView(route, view) {
     return (typeof route === 'string' &&

package/lib/views/profile/UserIdentity.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Who an account is, to be read: its avatar, then its username, display
+ * name, initials, origin and identifier, the identifier with a button that
+ * copies it.
+ *
+ * It is given the identity and fetches nothing, so any host draws it from
+ * what it already holds: the web's profile page beside its form, VS Code's
+ * Profile view from its signed-in user.
+ *
+ * @module views/profile/UserIdentity
+ */
+import type { JSX } from 'react';
+/** What {@link UserIdentity} shows of an account. */
+export interface UserIdentityProfile {
+    /** The account's identifier. */
+    id?: string;
+    username: string;
+    display_name: string;
+    initials: string;
+    /** Its photograph, when it has one. */
+    avatar_url?: string;
+    /** Its chosen picture, which wins over the photograph. */
+    avatar_icon?: string;
+    /** Where the account comes from (the identity provider). */
+    origin?: string;
+}
+export interface UserIdentityProps {
+    identity: UserIdentityProfile;
+    /** Whether the identifier is shown. @default true */
+    displayId?: boolean;
+    /**
+     * Whether the display name and the initials are shown. They are computed
+     * from the first and the last name, so a host showing the form that edits
+     * those states them there instead. @default true
+     */
+    displayComputed?: boolean;
+    /** Rendered under the avatar, typically the button changing it. */
+    avatarAction?: JSX.Element;
+}
+export declare const UserIdentity: ({ identity, displayId, displayComputed, avatarAction, }: UserIdentityProps) => JSX.Element;
+export default UserIdentity;

package/lib/views/profile/UserIdentity.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from '@primer/react';
+import { Box } from '@datalayer/primer-addons';
+import { UserAvatar } from '../../components/avatars/index.js';
+import { CopyToClipboardButton } from '../../components/buttons/index.js';
+/** One row of the list: its label, then its value. */
+const Row = ({ label, children, }) => (_jsxs(_Fragment, { children: [_jsx(Box, { p: 1, children: _jsx(Text, { style: { fontWeight: 'bold' }, children: label }) }), _jsx(Box, { p: 1, display: "flex", alignItems: "center", gap: 1, children: typeof children === 'string' ? _jsx(Text, { children: children }) : children })] }));
+export const UserIdentity = ({ identity, displayId = true, displayComputed = true, avatarAction, }) => (_jsxs(Box, { children: [_jsxs(Box, { display: "flex", flexDirection: "column", alignItems: "flex-start", gap: 2, children: [_jsx(UserAvatar, { avatarUrl: identity.avatar_url, avatar: identity.avatar_icon, size: 100 }), avatarAction] }), _jsxs(Box, { display: "grid", gridTemplateColumns: "1fr 2fr", rowGap: 3, columnGap: 3, maxWidth: 500, mt: 3, children: [_jsx(Row, { label: "Username", children: identity.username }), displayComputed && (_jsxs(_Fragment, { children: [_jsx(Row, { label: "Display name", children: identity.display_name }), _jsx(Row, { label: "Initials", children: identity.initials })] })), identity.origin && _jsx(Row, { label: "Origin", children: identity.origin }), displayId && identity.id && (_jsx(Row, { label: "UID", children: _jsxs(_Fragment, { children: [_jsx(Text, { children: identity.id }), _jsx(CopyToClipboardButton, { value: identity.id, ariaLabel: "Copy the identifier of the account" })] }) }))] })] }));
+export default UserIdentity;

package/lib/views/profile/index.d.ts

@@ -1,2 +1,4 @@
 export { UserBadge } from './UserBadge';
 export type { UserBadgeProps } from './UserBadge';
+export { UserIdentity } from './UserIdentity';
+export type { UserIdentityProfile, UserIdentityProps } from './UserIdentity';

package/lib/views/profile/index.js

@@ -3,3 +3,4 @@
  * Distributed under the terms of the Modified BSD License.
  */
 export { UserBadge } from './UserBadge.js';
+export { UserIdentity } from './UserIdentity.js';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@datalayer/core",
-    "version": "1.2.22",
+    "version": "1.2.24",
     "type": "module",
     "workspaces": [
         ".",
@@ -148,7 +148,6 @@
         "@tanstack/react-query": "^5.90.6",
         "@toon-format/toon": "^1.3.0",
         "ansi-to-html": "^0.7.2",
-        "axios": "^1.7.7",
         "boring-avatars": "^2.0.1",
         "date-fns": "^2.29.3",
         "deepmerge": "^4.3.1",
@@ -178,6 +177,7 @@
         "usehooks-ts": "3.1.1",
         "uuid": "^13.0.0",
         "validator": "^13.7.0",
+        "yaml": "^2.9.1",
         "zod": "^4.1.13",
         "zod-to-json-schema": "^3.25.0",
         "zustand": "^4.4.1"