@datalayer/core 1.1.60 → 1.2.10

package/lib/components/storage/ContentsTable.d.ts

@@ -0,0 +1,50 @@
+import type { JSX } from 'react';
+import { type MutableRefObject } from 'react';
+import { IContentsView } from './ContentsItems';
+/**
+ * Contents table component properties.
+ */
+export interface IContentsTableProps {
+    /**
+     * Path of the folder listed by the table; the empty string is the root.
+     */
+    path: string;
+    /**
+     * Items of the listed folder.
+     */
+    items: IContentsView[];
+    /**
+     * Currently selected item.
+     */
+    current: IContentsView | null;
+    /**
+     * Whether the folder content is being (re)fetched; a spinner replaces the
+     * rows while it is.
+     */
+    loading?: boolean;
+    /**
+     * Callback when a folder is opened, either from a row, the `..` row or the
+     * path bar. Navigating to the listed folder reloads it.
+     */
+    onNavigate: (path: string) => void;
+    /**
+     * Callback on item selection.
+     */
+    onSelect: (item: IContentsView) => void;
+    /**
+     * Callback on context menu event.
+     */
+    onContextMenu: (ref: MutableRefObject<HTMLElement | null>) => void;
+}
+/**
+ * Format a byte count for display.
+ */
+export declare function formatSize(size?: number | null): string;
+/**
+ * Table listing the content of one folder.
+ *
+ * Folder rows open the folder, the `..` row goes to the parent folder and
+ * the path bar jumps to any ancestor (or reloads the listed folder).
+ */
+export declare function ContentsTable(props: IContentsTableProps): JSX.Element;
+export default ContentsTable;

package/lib/components/storage/ContentsTable.js

@@ -0,0 +1,134 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, useRef, } from 'react';
+import { PathExt } from '@jupyterlab/coreutils';
+import { Link, RelativeTime, Spinner, Text } from '@primer/react';
+import { Table } from '@primer/react/experimental';
+import { Box } from '@datalayer/primer-addons';
+import { FileDirectoryFillIcon, FileDirectoryIcon, FileIcon, } from '@primer/octicons-react';
+const SIZE_UNITS = ['B', 'KB', 'MB', 'GB', 'TB'];
+/**
+ * Format a byte count for display.
+ */
+export function formatSize(size) {
+    if (size === undefined || size === null) {
+        return '';
+    }
+    let value = size;
+    let unit = 0;
+    while (value >= 1024 && unit < SIZE_UNITS.length - 1) {
+        value /= 1024;
+        unit += 1;
+    }
+    return `${unit === 0 ? value : value.toFixed(1)} ${SIZE_UNITS[unit]}`;
+}
+/**
+ * Split a folder path into its ancestors, root first.
+ */
+function pathSegments(path) {
+    const segments = [];
+    if (path) {
+        path.split('/').forEach(name => {
+            const parent = segments[segments.length - 1]?.path ?? '';
+            segments.push({
+                name,
+                path: parent ? PathExt.join(parent, name) : name,
+            });
+        });
+    }
+    return segments;
+}
+/**
+ * One clickable part of the path bar.
+ */
+function PathSegment(props) {
+    const { name, path, current, title, onNavigate } = props;
+    return (_jsx(Link, { as: "button", type: "button", title: title, "aria-current": current ? 'location' : undefined, onClick: () => onNavigate(path), sx: current ? { color: 'fg.default', fontWeight: 'semibold' } : undefined, children: name }));
+}
+const ROW_STYLE = { cursor: 'pointer' };
+const SELECTED_ROW_STYLE = {
+    ...ROW_STYLE,
+    backgroundColor: 'var(--bgColor-accent-muted)',
+};
+function isActivationKey(event) {
+    return event.key === 'Enter' || event.key === ' ';
+}
+/**
+ * The `..` row navigating to the parent folder.
+ */
+function ParentRow(props) {
+    const { path, onNavigate } = props;
+    const goUp = () => onNavigate(path);
+    return (_jsxs(Table.Row, { tabIndex: 0, style: ROW_STYLE, title: "Go to the parent folder.", onClick: goUp, onKeyDown: event => {
+            if (isActivationKey(event)) {
+                event.preventDefault();
+                goUp();
+            }
+        }, children: [_jsx(Table.Cell, { scope: "row", children: _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2 }, children: [_jsx(FileDirectoryIcon, {}), _jsx("span", { children: ".." })] }) }), _jsx(Table.Cell, {}), _jsx(Table.Cell, {})] }));
+}
+/**
+ * A folder or file row.
+ */
+function ContentsRow(props) {
+    const { item, current, onNavigate, onSelect, onContextMenu } = props;
+    const ref = useRef(null);
+    const isDirectory = item.type === 'directory';
+    const icon = item.fileType?.icon;
+    const activate = () => {
+        if (isDirectory) {
+            onNavigate(item.path);
+        }
+        else {
+            onSelect(item);
+        }
+    };
+    return (_jsxs(Table.Row, { tabIndex: 0, "aria-selected": current, style: current ? SELECTED_ROW_STYLE : ROW_STYLE, title: isDirectory ? `Open ${item.path}` : item.path, onClick: activate, onKeyDown: event => {
+            if (isActivationKey(event)) {
+                event.preventDefault();
+                activate();
+            }
+        }, onContextMenu: (event) => {
+            event.preventDefault();
+            if (!current) {
+                onSelect(item);
+            }
+            onContextMenu(ref);
+        }, children: [_jsx(Table.Cell, { scope: "row", children: _jsxs(Box, { ref: ref, sx: { display: 'flex', alignItems: 'center', gap: 2, minWidth: 0 }, children: [isDirectory ? (_jsx(FileDirectoryFillIcon, {})) : icon ? (_jsx(icon.react, { tag: 'span' })) : (_jsx(FileIcon, {})), _jsx("span", { style: {
+                                overflow: 'hidden',
+                                textOverflow: 'ellipsis',
+                                whiteSpace: 'nowrap',
+                            }, children: item.name })] }) }), _jsx(Table.Cell, { children: item.last_modified ? (_jsx(RelativeTime, { date: new Date(item.last_modified) })) : null }), _jsx(Table.Cell, { align: "end", children: isDirectory ? '' : formatSize(item.size) })] }));
+}
+/**
+ * Table listing the content of one folder.
+ *
+ * Folder rows open the folder, the `..` row goes to the parent folder and
+ * the path bar jumps to any ancestor (or reloads the listed folder).
+ */
+export function ContentsTable(props) {
+    const { path, items, current, loading = false, onNavigate, onSelect, onContextMenu, } = props;
+    const segments = pathSegments(path);
+    const label = path ? `Contents of ${path}` : 'Contents of the root folder';
+    return (_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsx(Box, { sx: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: 2,
+                    minWidth: 0,
+                    overflow: 'hidden',
+                }, children: _jsxs(Box, { role: "navigation", "aria-label": "Folder path", sx: {
+                        display: 'flex',
+                        alignItems: 'center',
+                        flexWrap: 'wrap',
+                        gap: 1,
+                        minWidth: 0,
+                        fontSize: 1,
+                    }, children: [_jsx(PathSegment, { name: "/", path: "", current: segments.length === 0, title: "Go to the root folder.", onNavigate: onNavigate }), segments.map((segment, index) => (_jsxs(Fragment, { children: [index > 0 && _jsx(Text, { sx: { color: 'fg.muted' }, children: "/" }), _jsx(PathSegment, { name: segment.name, path: segment.path, current: index === segments.length - 1, title: index === segments.length - 1
+                                        ? `Reload ${segment.path}`
+                                        : `Go to ${segment.path}`, onNavigate: onNavigate })] }, segment.path)))] }) }), loading ? (_jsx(Box, { sx: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    minHeight: '40px',
+                    padding: 3,
+                }, children: _jsx(Spinner, { "aria-label": "Loading folder\u2026" }) })) : (_jsx(Table.Container, { children: _jsxs(Table, { "aria-label": label, cellPadding: "condensed", gridTemplateColumns: "minmax(0, 1fr) max-content max-content", children: [_jsx(Table.Head, { children: _jsxs(Table.Row, { children: [_jsx(Table.Header, { children: "Name" }), _jsx(Table.Header, { children: "Last modified" }), _jsx(Table.Header, { align: "end", children: "Size" })] }) }), _jsxs(Table.Body, { children: [path && (_jsx(ParentRow, { path: PathExt.dirname(path), onNavigate: onNavigate })), items.map(item => (_jsx(ContentsRow, { item: item, current: item.path === current?.path, onNavigate: onNavigate, onSelect: onSelect, onContextMenu: onContextMenu }, item.path)))] })] }) }))] }));
+}
+export default ContentsTable;

package/lib/components/storage/HomeFolderDrive.d.ts

@@ -0,0 +1,71 @@
+/**
+ * The caller's Home Folders as a JupyterLab drive.
+ *
+ * One implementation of `Contents.IDrive`, so JupyterLab's file browser, the
+ * shared `ContentsBrowser` and VS Code's file system provider all read the
+ * same listing and write through the same transfer — `uploadHomeFolderFile`,
+ * verified, resumable — rather than each carrying an upload of its own.
+ *
+ * The tree is two levels of one address space: the root names the folders the
+ * caller reaches — their own, and one per organization and team — and
+ * everything below is a path inside one of them.
+ *
+ * @module components/storage/HomeFolderDrive
+ */
+import type { Contents, ServerConnection } from '@jupyterlab/services';
+import { ISignal } from '@lumino/signaling';
+export type HomeFolderDriveOptions = {
+    /** Where the Contents service is reached. */
+    contentsUrl: string;
+    /** The caller's token; the reachable folders are resolved from it. */
+    token: string;
+    /** The drive's name in JupyterLab, the prefix before `:` in a path. */
+    name?: string;
+};
+/**
+ * The Home Folders, as one JupyterLab drive.
+ *
+ * Reads come from the shared filesystem — what a sandbox wrote as well as what
+ * was uploaded. Writes go through the transfer contract: a file the browser
+ * hands over in chunks is gathered and sent whole, created, its parts
+ * checksummed, then completed; an interrupted upload resumes from the parts
+ * the service verified. Checkpoints are the immutable versions the catalog
+ * keeps of every object, so there is nothing to create here.
+ */
+export declare class HomeFolderDrive implements Contents.IDrive {
+    readonly name: string;
+    readonly serverSettings: ServerConnection.ISettings;
+    private readonly _token;
+    private readonly _base;
+    private readonly _fileChanged;
+    private readonly _pending;
+    private _isDisposed;
+    constructor(options: HomeFolderDriveOptions);
+    get fileChanged(): ISignal<Contents.IDrive, Contents.IChangedArgs>;
+    get isDisposed(): boolean;
+    dispose(): void;
+    get(localPath: string, options?: Contents.IFetchOptions): Promise<Contents.IModel>;
+    getDownloadUrl(localPath: string): Promise<string>;
+    newUntitled(options?: Contents.ICreateOptions): Promise<Contents.IModel>;
+    delete(localPath: string): Promise<void>;
+    rename(oldLocalPath: string, newLocalPath: string): Promise<Contents.IModel>;
+    /**
+     * Upload, through the same transfer the CLI and the objects view use.
+     *
+     * A file is chunked by the browser — Jupyter's protocol numbers the chunks
+     * and marks the last one `-1` — and whole by the transfer contract, so the
+     * chunks are gathered and sent when the last one arrives. One idempotency
+     * key per file and size, so the retry of an interrupted upload resumes the
+     * transfer it started rather than opening a second.
+     */
+    save(localPath: string, model?: Partial<Contents.IModel>): Promise<Contents.IModel>;
+    copy(localPath: string, toLocalDir: string): Promise<Contents.IModel>;
+    /** Every version the catalog keeps is a checkpoint already; nothing to create. */
+    createCheckpoint(localPath: string): Promise<Contents.ICheckpointModel>;
+    listCheckpoints(): Promise<Contents.ICheckpointModel[]>;
+    restoreCheckpoint(): Promise<void>;
+    deleteCheckpoint(): Promise<void>;
+    private _directory;
+    private _bytes;
+}
+export default HomeFolderDrive;

package/lib/components/storage/HomeFolderDrive.js

@@ -0,0 +1,248 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { Signal } from '@lumino/signaling';
+import { deleteHomeFolderObject, listHomeFolderFiles, readHomeFolderFile, statHomeFolderObject, uploadHomeFolderFile, } from '../../api/contents/index.js';
+import { API_BASE_PATHS } from '../../api/constants.js';
+/**
+ * A folder that has never been written to has no timestamp: it is created the
+ * first time a sandbox mounts it. Jupyter's model wants a date, and an
+ * unparseable one throws where it is rendered.
+ */
+const EPOCH = new Date(0).toISOString();
+const TEXT_EXTENSIONS = new Set([
+    'txt', 'md', 'py', 'js', 'ts', 'tsx', 'jsx', 'json', 'csv', 'tsv', 'yaml', 'yml',
+    'toml', 'html', 'css', 'xml', 'sh', 'sql', 'r', 'jl', 'rst', 'cfg', 'ini', 'log',
+]);
+const extension = (path) => (path.split('/').pop() ?? '').split('.').pop()?.toLowerCase() ?? '';
+const basename = (path) => path.split('/').filter(Boolean).pop() ?? '';
+const dirname = (path) => {
+    const parts = path.split('/').filter(Boolean);
+    parts.pop();
+    return parts.join('/');
+};
+const decodeBase64 = (value) => {
+    const binary = atob(value);
+    const bytes = new Uint8Array(binary.length);
+    for (let index = 0; index < binary.length; index += 1) {
+        bytes[index] = binary.charCodeAt(index);
+    }
+    return bytes;
+};
+const encodeBase64 = (bytes) => {
+    let binary = '';
+    for (let index = 0; index < bytes.byteLength; index += 1) {
+        binary += String.fromCharCode(bytes[index]);
+    }
+    return btoa(binary);
+};
+const joinChunks = (chunks) => {
+    const total = chunks.reduce((size, chunk) => size + chunk.byteLength, 0);
+    const joined = new Uint8Array(total);
+    let offset = 0;
+    for (const chunk of chunks) {
+        joined.set(chunk, offset);
+        offset += chunk.byteLength;
+    }
+    return joined;
+};
+const fileModel = (entry) => ({
+    name: entry.name,
+    path: entry.path,
+    type: entry.isDirectory ? 'directory' : extension(entry.path) === 'ipynb' ? 'notebook' : 'file',
+    writable: true,
+    created: entry.modifiedAt || EPOCH,
+    last_modified: entry.modifiedAt || EPOCH,
+    mimetype: '',
+    content: null,
+    format: null,
+    size: entry.size,
+});
+/**
+ * The Home Folders, as one JupyterLab drive.
+ *
+ * Reads come from the shared filesystem — what a sandbox wrote as well as what
+ * was uploaded. Writes go through the transfer contract: a file the browser
+ * hands over in chunks is gathered and sent whole, created, its parts
+ * checksummed, then completed; an interrupted upload resumes from the parts
+ * the service verified. Checkpoints are the immutable versions the catalog
+ * keeps of every object, so there is nothing to create here.
+ */
+export class HomeFolderDrive {
+    name;
+    serverSettings;
+    _token;
+    _base;
+    _fileChanged = new Signal(this);
+    _pending = new Map();
+    _isDisposed = false;
+    constructor(options) {
+        this.name = options.name ?? 'home-folder';
+        this._token = options.token;
+        this._base = String(options.contentsUrl).replace(/\/$/, '');
+        // The browser reads `appUrl` in one error message and nothing else; the
+        // requests themselves carry the token explicitly.
+        this.serverSettings = {
+            baseUrl: this._base,
+            appUrl: `${this._base}${API_BASE_PATHS.CONTENTS}/sources/home-folder/`,
+            wsUrl: '',
+            token: '',
+            appendToken: false,
+            init: {},
+        };
+    }
+    get fileChanged() {
+        return this._fileChanged;
+    }
+    get isDisposed() {
+        return this._isDisposed;
+    }
+    dispose() {
+        if (this._isDisposed) {
+            return;
+        }
+        this._isDisposed = true;
+        Signal.clearData(this);
+    }
+    async get(localPath, options) {
+        const path = localPath.replace(/^\/+/, '');
+        if (path === '') {
+            return this._directory('');
+        }
+        // A folder answers the listing; a file does not, and is found in its parent.
+        try {
+            return await this._directory(path);
+        }
+        catch {
+            // Not a folder: fall through.
+        }
+        const parent = await listHomeFolderFiles(this._token, dirname(path), this._base);
+        const entry = parent.items.find(item => basename(item.path) === basename(path));
+        if (!entry || entry.isDirectory) {
+            throw new Error(`No file at ${path} in the Home Folder`);
+        }
+        const model = fileModel(entry);
+        if (options?.content === false) {
+            return model;
+        }
+        const { body } = await readHomeFolderFile(this._token, path, {}, this._base);
+        const bytes = new Uint8Array(body);
+        if (model.type === 'notebook') {
+            return { ...model, content: JSON.parse(new TextDecoder().decode(bytes)), format: 'json', mimetype: 'application/x-ipynb+json' };
+        }
+        if (options?.format === 'base64' || !TEXT_EXTENSIONS.has(extension(path))) {
+            return { ...model, content: encodeBase64(bytes), format: 'base64', mimetype: 'application/octet-stream' };
+        }
+        return { ...model, content: new TextDecoder().decode(bytes), format: 'text', mimetype: 'text/plain' };
+    }
+    getDownloadUrl(localPath) {
+        return Promise.resolve(`${this._base}${API_BASE_PATHS.CONTENTS}/sources/home-folder/files/content?path=${encodeURIComponent(localPath.replace(/^\/+/, ''))}`);
+    }
+    async newUntitled(options = {}) {
+        const type = options.type ?? 'file';
+        if (type === 'directory') {
+            throw new Error('A folder appears in the Home Folder when a file is saved into it.');
+        }
+        const parent = (options.path ?? '').replace(/^\/+|\/+$/g, '');
+        const name = type === 'notebook' ? 'Untitled.ipynb' : `untitled${options.ext ?? '.txt'}`;
+        const path = parent ? `${parent}/${name}` : name;
+        const content = type === 'notebook'
+            ? JSON.stringify({ cells: [], metadata: {}, nbformat: 4, nbformat_minor: 5 })
+            : '';
+        return this.save(path, { type, format: 'text', content });
+    }
+    async delete(localPath) {
+        const path = localPath.replace(/^\/+/, '');
+        const object = await statHomeFolderObject(this._token, path, this._base);
+        await deleteHomeFolderObject(this._token, object.uid, this._base);
+        this._fileChanged.emit({ type: 'delete', oldValue: { path }, newValue: null });
+    }
+    async rename(oldLocalPath, newLocalPath) {
+        const current = await this.get(oldLocalPath, { content: true, format: 'base64' });
+        const moved = await this.save(newLocalPath, { type: current.type, format: current.format, content: current.content });
+        await this.delete(oldLocalPath);
+        this._fileChanged.emit({ type: 'rename', oldValue: current, newValue: moved });
+        return moved;
+    }
+    /**
+     * Upload, through the same transfer the CLI and the objects view use.
+     *
+     * A file is chunked by the browser — Jupyter's protocol numbers the chunks
+     * and marks the last one `-1` — and whole by the transfer contract, so the
+     * chunks are gathered and sent when the last one arrives. One idempotency
+     * key per file and size, so the retry of an interrupted upload resumes the
+     * transfer it started rather than opening a second.
+     */
+    async save(localPath, model = {}) {
+        const path = localPath.replace(/^\/+/, '');
+        if (model.type === 'directory') {
+            throw new Error('A folder appears in the Home Folder when a file is saved into it.');
+        }
+        const bytes = this._bytes(model);
+        const chunk = model.chunk;
+        if (chunk !== undefined && chunk !== -1) {
+            this._pending.set(path, [...(this._pending.get(path) ?? []), bytes]);
+            return { ...fileModel({ name: basename(path), path, isDirectory: false, size: 0, modifiedAt: null }), chunk };
+        }
+        const content = joinChunks([...(this._pending.get(path) ?? []), bytes]);
+        this._pending.delete(path);
+        const transfer = await uploadHomeFolderFile(this._token, path, content, {
+            idempotencyKey: `home-folder-drive:${path}:${content.byteLength}`,
+            mediaType: model.mimetype || 'application/octet-stream',
+            overwrite: 'new-version',
+        }, this._base);
+        const saved = fileModel({
+            name: basename(path),
+            path,
+            isDirectory: false,
+            size: transfer.expectedSize ?? content.byteLength,
+            modifiedAt: transfer.completedAt ?? null,
+        });
+        this._fileChanged.emit({ type: 'save', oldValue: null, newValue: saved });
+        return saved;
+    }
+    async copy(localPath, toLocalDir) {
+        const current = await this.get(localPath, { content: true, format: 'base64' });
+        const target = `${toLocalDir.replace(/^\/+|\/+$/g, '')}/${basename(localPath)}`.replace(/^\//, '');
+        return this.save(target, { type: current.type, format: current.format, content: current.content });
+    }
+    /** Every version the catalog keeps is a checkpoint already; nothing to create. */
+    createCheckpoint(localPath) {
+        return Promise.resolve({ id: `latest:${localPath}`, last_modified: new Date().toISOString() });
+    }
+    listCheckpoints() {
+        return Promise.resolve([]);
+    }
+    restoreCheckpoint() {
+        return Promise.resolve();
+    }
+    deleteCheckpoint() {
+        return Promise.resolve();
+    }
+    async _directory(path) {
+        const listing = await listHomeFolderFiles(this._token, path, this._base);
+        return {
+            name: basename(path),
+            path,
+            type: 'directory',
+            writable: true,
+            created: EPOCH,
+            last_modified: EPOCH,
+            mimetype: '',
+            content: listing.items.map(fileModel),
+            format: 'json',
+            size: undefined,
+        };
+    }
+    _bytes(model) {
+        if (model.content === null || model.content === undefined) {
+            return new Uint8Array(0);
+        }
+        if (typeof model.content !== 'string') {
+            return new TextEncoder().encode(JSON.stringify(model.content, null, 1));
+        }
+        return model.format === 'base64' ? decodeBase64(model.content) : new TextEncoder().encode(model.content);
+    }
+}
+export default HomeFolderDrive;

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

@@ -1,2 +1,4 @@
 export * from './ContentsBrowser';
 export * from './ContentsItems';
+export * from './ContentsTable';
+export * from './HomeFolderDrive';

package/lib/components/storage/index.js

@@ -4,3 +4,5 @@
  */
 export * from './ContentsBrowser.js';
 export * from './ContentsItems.js';
+export * from './ContentsTable.js';
+export * from './HomeFolderDrive.js';

package/lib/components/students/StudentItemStatus.d.ts

@@ -29,5 +29,5 @@ type Props = {
     student?: IStudent;
     studentItem?: IStudentItemStatusData;
 };
-export declare const StudentItemStatus: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const StudentItemStatus: (props: Props) => import("react").JSX.Element;
 export default StudentItemStatus;

package/lib/components/students/StudentResultCircle.d.ts

@@ -17,5 +17,5 @@ type Props = {
  * the meaning of the green (success) / red (failure) / empty (no result yet)
  * status is discoverable on hover and focus.
  */
-export declare const StudentResultCircle: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const StudentResultCircle: (props: Props) => import("react").JSX.Element;
 export default StudentResultCircle;

package/lib/components/subnav/SubNav.d.ts

@@ -9,7 +9,7 @@ import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/compone
 export declare const SubNavSubMenuVariants: readonly ["dropdown", "anchor"];
 type SubMenuVariants = (typeof SubNavSubMenuVariants)[number];
 type SubNavContextType = {
-    portalRef: RefObject<HTMLDivElement>;
+    portalRef: RefObject<HTMLDivElement | null>;
 };
 export declare const useSubNavContext: () => SubNavContextType;
 export type SubNavProps = {
@@ -34,7 +34,7 @@ type SubNavLinkProps = {
 type SubMenuProps = {
     variant?: SubMenuVariants;
 } & React.HTMLAttributes<HTMLUListElement> & BaseProps<HTMLUListElement>;
-declare function SubMenu({ children, className, variant, ...props }: SubMenuProps): import("react/jsx-runtime").JSX.Element;
+declare function SubMenu({ children, className, variant, ...props }: SubMenuProps): React.JSX.Element;
 type SubNavActionProps = {
     /**
      * Required path or location for the action button to link to.
@@ -49,7 +49,7 @@ type SubNavActionProps = {
      */
     variant?: (typeof ButtonVariants)[number];
 } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>;
-declare function _SubNavAction({ children, href, variant, size, ...rest }: SubNavActionProps): import("react/jsx-runtime").JSX.Element;
+declare function _SubNavAction({ children, href, variant, size, ...rest }: SubNavActionProps): React.JSX.Element;
 /**
  * Use SubNav to display a secondary navigation beneath a primary header.
  * @see https://primer.style/brand/components/SubNav
@@ -65,9 +65,9 @@ export declare const SubNav: React.NamedExoticComponent<{
 } & BaseProps<HTMLElement> & {
     children?: ReactNode | undefined;
 }> & {
-    readonly type: ({ id, children, className, "data-testid": testId, fullWidth, hasShadow, }: SubNavProps) => import("react/jsx-runtime").JSX.Element;
+    readonly type: ({ id, children, className, "data-testid": testId, fullWidth, hasShadow, }: SubNavProps) => React.JSX.Element;
 } & {
-    Heading: ({ href, children, className, "data-testid": testID, ...props }: SubNavHeadingProps) => import("react/jsx-runtime").JSX.Element;
+    Heading: ({ href, children, className, "data-testid": testID, ...props }: SubNavHeadingProps) => React.JSX.Element;
     Link: React.ForwardRefExoticComponent<Omit<SubNavLinkProps, "ref"> & React.RefAttributes<HTMLAnchorElement | HTMLDivElement>>;
     Action: typeof _SubNavAction;
     SubMenu: typeof SubMenu;

package/lib/components/subnav/SubNav.js

@@ -106,7 +106,8 @@ const _SubNavRoot = memo(({ id, children, className, 'data-testid': testId, full
     useEffect(() => {
         // check if there is an anchored nav in the SubNav.SubMenu child
         const hasAnchorVariant = childrenArr.some(child => {
-            if (isValidElement(child) && child.type === SubNavLink) {
+            if (isValidElement(child) &&
+                child.type === SubNavLink) {
                 const [, subMenu] = child.props.children;
                 if (subMenu?.props?.variant === 'anchor') {
                     return true;
@@ -144,12 +145,15 @@ const _SubNavRoot = memo(({ id, children, className, 'data-testid': testId, full
         }
         return acc;
     }, { heading: undefined, links: [], action: undefined });
-    const activeLinklabel = typeof activeLink?.props.children === 'string'
-        ? activeLink.props.children
-        : activeLink?.props.children[0];
+    const activeLinkChildren = activeLink?.props.children;
+    const activeLinklabel = typeof activeLinkChildren === 'string'
+        ? activeLinkChildren
+        : activeLinkChildren?.[0];
     // needed to prevent rendering of anchor subnav inside the narrow <Button variant="invisible"> element
-    const MaybeSubNav = activeLink?.props.children?.[1]?.props?.variant === 'anchor' &&
-        activeLink.props.children?.[1];
+    const activeLinkSubMenu = typeof activeLinkChildren === 'string'
+        ? undefined
+        : activeLinkChildren?.[1];
+    const MaybeSubNav = activeLinkSubMenu?.props?.variant === 'anchor' && activeLinkSubMenu;
     return (_jsx("div", { className: clsx(styles['SubNav__container'], hasAnchoredNav && styles['SubNav__container--with-anchor-nav']), children: _jsx(SubNavProvider, { children: _jsx("nav", { ref: navRef, id: id, className: clsx(styles.SubNav, isOpenAtNarrow && styles['SubNav--open'], hasShadow && styles['SubNav--has-shadow'], fullWidth && styles['SubNav--full-width'], className), "data-testid": testId || testIds.root, children: _jsxs("div", { ref: rootRef, className: styles['SubNav--header-container-outer'], children: [_jsxs("div", { className: styles['SubNav__header-container'], children: [HeadingChild && (_jsx("div", { className: styles['SubNav__heading-container'], children: HeadingChild })), !isLarge && (_jsxs("button", { className: clsx(styles['SubNav__overlay-toggle'], isOpenAtNarrow && styles['SubNav__overlay-toggle--open']), "data-testid": testIds.button, onClick: isOpenAtNarrow ? closeMenuCallback : handleMenuToggle, "aria-expanded": isOpenAtNarrow ? 'true' : 'false', "aria-controls": idForLinkContainer, children: [activeLinklabel && (_jsxs("span", { className: "visually-hidden", children: ["Navigation menu. Current page:", ' '] })), _jsxs("span", { className: clsx(styles['SubNav__overlay-toggle-content'], !activeLinklabel &&
                                                 styles['SubNav__overlay-toggle-content--end']), children: [activeLinklabel && (_jsx(Text, { as: "span", size: "200", children: activeLinklabel })), isOpenAtNarrow ? (_jsx(ChevronUpIcon, { className: styles['SubNav__overlay-toggle-icon'], size: 24 })) : (_jsx(ChevronDownIcon, { className: styles['SubNav__overlay-toggle-icon'], size: 24 }))] })] })), MaybeSubNav && MaybeSubNav] }), LinkChildren.length && (_jsxs("ul", { ref: overlayRef, id: idForLinkContainer, className: clsx(styles['SubNav__links-overlay'], isOpenAtNarrow && styles['SubNav__links-overlay--open']), "data-testid": testIds.overlay, children: [ActionChild ? (_jsx("li", { className: styles['SubNav__action-container'], children: ActionChild })) : (_jsx("li", { className: styles['SubNav__action-container'] })), LinkChildren, _jsx(ButtonGroup, { buttonSize: "small", children: _jsx(Button, { href: "#", onClick: e => {
                                             window.location.assign('https://datalayer.ai');
@@ -251,9 +255,7 @@ function SubMenu({ children, className, variant = 'dropdown', ...props }) {
                     if (isValidElement(child)) {
                         return React.cloneElement(child, {
                             onClick: e => {
-                                if (child.props.onClick) {
-                                    child.props.onClick(e);
-                                }
+                                child.props.onClick?.(e);
                             },
                         });
                     }

package/lib/components/tables/DataTable.d.ts

@@ -1,5 +1,5 @@
 type IDataTableProps = {
     data: Array<any>;
 };
-export declare const DataTable: (props: IDataTableProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DataTable: (props: IDataTableProps) => import("react").JSX.Element;
 export default DataTable;

package/lib/components/text-reveal/TextRevealAnimation.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { BaseProps } from '@datalayer/primer-addons';
 export type TextRevealAnimationProps = BaseProps<HTMLSpanElement> & Omit<React.HTMLAttributes<HTMLSpanElement>, 'children'> & {
-    children: React.ReactChild;
+    children: React.ReactElement | string | number;
 };
-export declare function TextRevealAnimation({ children, ...rest }: TextRevealAnimationProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function TextRevealAnimation({ children, ...rest }: TextRevealAnimationProps): React.JSX.Element | null;

package/lib/components/text-reveal/useTextRevealAnimationLines.d.ts

@@ -1,4 +1,4 @@
 export declare const useTextRevealAnimationLines: (text?: string) => {
-    ref: import("react").RefObject<HTMLElement>;
+    ref: import("react").RefObject<HTMLElement | null>;
     lines: string[] | undefined;
 };

package/lib/components/time/LiveRelativeTime.d.ts

@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 type ILiveRelativeTimeProps = {
     value?: Date | string | number;
     refreshIntervalMs?: number;