@datalayer/core 1.0.24 → 1.1.41

package/lib/components/students/StudentResultCircle.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { useMemo } from 'react';
+import { useTheme, Tooltip } from '@primer/react';
+import { Box } from '@datalayer/primer-addons';
+/**
+ * A small green/yellow/red/neutral result circle with an explanatory tooltip.
+ *
+ * Standalone component reused across the course progress and report views so
+ * the meaning of the green (success) / red (failure) / empty (no result yet)
+ * status is discoverable on hover and focus.
+ */
+export const StudentResultCircle = (props) => {
+    const { status, label } = props;
+    const { theme } = useTheme();
+    const okColor = useMemo(() => theme?.colorSchemes.light.colors.success.muted, [theme]);
+    const nokColor = useMemo(() => theme?.colorSchemes.light.colors.severe.muted, [theme]);
+    const partialColor = useMemo(() => theme?.colorSchemes.light.colors.attention.muted, [theme]);
+    const isNone = status === 'none';
+    return (_jsx(Tooltip, { text: label, "aria-label": label, children: _jsx(Box, { as: "button", type: "button", "aria-label": label, onClick: event => {
+                event.preventDefault();
+                event.stopPropagation();
+            }, onMouseDown: event => {
+                event.preventDefault();
+                event.stopPropagation();
+            }, sx: {
+                display: 'inline-block',
+                flex: 'none',
+                appearance: 'none',
+                p: 0,
+                bg: 'transparent',
+                cursor: 'default',
+                lineHeight: 0,
+                border: 'none',
+                outline: 'none',
+            }, children: _jsx(Box, { as: "span", role: "img", "aria-hidden": true, sx: {
+                    display: 'inline-block',
+                    flex: 'none',
+                    width: '14px',
+                    height: '14px',
+                    borderRadius: 3,
+                    ml: 1,
+                    pointerEvents: 'auto',
+                    boxSizing: 'border-box',
+                    backgroundColor: isNone
+                        ? 'transparent'
+                        : status === 'pass'
+                            ? okColor
+                            : status === 'partial'
+                                ? partialColor
+                                : nokColor,
+                    border: isNone ? '1px solid' : 'none',
+                    borderColor: isNone ? 'border.default' : 'transparent',
+                } }) }) }));
+};
+export default StudentResultCircle;

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

@@ -1 +1 @@
-export * from './StudentItemStatus';
+export * from './StudentResultCircle';

package/lib/components/students/index.js

@@ -2,4 +2,4 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-export * from './StudentItemStatus.js';
+export * from './StudentResultCircle.js';

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

@@ -0,0 +1,14 @@
+type ILiveRelativeTimeProps = {
+    value?: Date | string | number;
+    refreshIntervalMs?: number;
+    fallback?: string;
+    showTooltip?: boolean;
+};
+/**
+ * Display a live-updating relative time label (e.g. "5m ago", "in 2m").
+ *
+ * When `showTooltip` is true, a Primer tooltip shows ISO + localized datetime
+ * details with timezone information.
+ */
+export declare function LiveRelativeTime({ value, refreshIntervalMs, fallback, showTooltip, }: ILiveRelativeTimeProps): JSX.Element;
+export {};

package/lib/components/time/LiveRelativeTime.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { useEffect, useMemo, useState } from 'react';
+import { Tooltip } from '@primer/react';
+import { formatDateTimeDetails, formatRelativeTime } from '../../utils/index.js';
+/**
+ * Display a live-updating relative time label (e.g. "5m ago", "in 2m").
+ *
+ * When `showTooltip` is true, a Primer tooltip shows ISO + localized datetime
+ * details with timezone information.
+ */
+export function LiveRelativeTime({ value, refreshIntervalMs = 30_000, fallback = '—', showTooltip = true, }) {
+    const [now, setNow] = useState(() => new Date());
+    useEffect(() => {
+        const timer = window.setInterval(() => {
+            setNow(new Date());
+        }, refreshIntervalMs);
+        return () => window.clearInterval(timer);
+    }, [refreshIntervalMs]);
+    const label = useMemo(() => formatRelativeTime(value, now), [value, now]);
+    const tooltip = useMemo(() => formatDateTimeDetails(value), [value]);
+    const content = (_jsx("button", { type: "button", "aria-label": tooltip || 'Date and time details', style: {
+            border: 'none',
+            background: 'transparent',
+            padding: 0,
+            margin: 0,
+            font: 'inherit',
+            color: 'inherit',
+            cursor: 'inherit',
+            lineHeight: 'inherit',
+        }, children: label ?? fallback }));
+    if (!showTooltip || !tooltip) {
+        return content;
+    }
+    return _jsx(Tooltip, { text: tooltip, children: content });
+}

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

@@ -0,0 +1 @@
+export * from './LiveRelativeTime';

package/lib/components/time/index.js

@@ -0,0 +1,9 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './LiveRelativeTime.js';

package/lib/components/timeline/Timeline.d.ts

@@ -0,0 +1,20 @@
+import { type ReactNode } from 'react';
+export type TimelineStatus = 'done' | 'current' | 'pending' | 'failed' | 'neutral';
+export type TimelineItem = {
+    id: string;
+    title: string;
+    timestamp?: string;
+    status?: TimelineStatus;
+    subtitle?: ReactNode;
+};
+export type TimelineProps = {
+    items: TimelineItem[];
+    renderTimestamp?: (value?: string) => ReactNode;
+};
+/**
+ * Horizontal metro-style timeline with connected markers and labels.
+ *
+ * The first item is rendered on the left. Pass items in the desired order
+ * (for example: newest to oldest).
+ */
+export declare const Timeline: ({ items, renderTimestamp }: TimelineProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/components/timeline/Timeline.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from '@primer/react';
+const statusStyles = {
+    done: {
+        dotBackground: 'success.emphasis',
+        dotBorder: 'success.emphasis',
+        lineColor: 'success.muted',
+        titleColor: 'fg.default',
+    },
+    current: {
+        dotBackground: 'attention.emphasis',
+        dotBorder: 'attention.emphasis',
+        lineColor: 'attention.muted',
+        titleColor: 'fg.default',
+    },
+    pending: {
+        dotBackground: 'canvas.default',
+        dotBorder: 'border.default',
+        lineColor: 'border.default',
+        titleColor: 'fg.muted',
+    },
+    failed: {
+        dotBackground: 'danger.emphasis',
+        dotBorder: 'danger.emphasis',
+        lineColor: 'danger.muted',
+        titleColor: 'danger.fg',
+    },
+    neutral: {
+        dotBackground: 'accent.emphasis',
+        dotBorder: 'accent.emphasis',
+        lineColor: 'accent.muted',
+        titleColor: 'fg.default',
+    },
+};
+/**
+ * Horizontal metro-style timeline with connected markers and labels.
+ *
+ * The first item is rendered on the left. Pass items in the desired order
+ * (for example: newest to oldest).
+ */
+export const Timeline = ({ items, renderTimestamp }) => {
+    if (!items.length) {
+        return null;
+    }
+    return (_jsx(Box, { sx: {
+            overflowX: 'auto',
+            pb: 1,
+        }, children: _jsx(Box, { sx: {
+                display: 'flex',
+                alignItems: 'stretch',
+                minWidth: 'max-content',
+            }, children: items.map((item, index) => {
+                const status = item.status || 'neutral';
+                const style = statusStyles[status];
+                const hasNext = index < items.length - 1;
+                return (_jsxs(Box, { sx: {
+                        display: 'flex',
+                        flexDirection: 'column',
+                        minWidth: 220,
+                        flex: hasNext ? '0 0 220px' : '0 0 auto',
+                        pr: hasNext ? 0 : 1,
+                    }, children: [_jsxs(Box, { sx: {
+                                display: 'flex',
+                                alignItems: 'center',
+                                minHeight: 28,
+                                mb: 2,
+                            }, children: [_jsx(Box, { sx: {
+                                        width: 16,
+                                        height: 16,
+                                        borderRadius: '50%',
+                                        border: '2px solid',
+                                        borderColor: style.dotBorder,
+                                        bg: style.dotBackground,
+                                        boxShadow: 'inset 0 0 0 1px rgba(255,255,255,0.2)',
+                                    } }), hasNext ? (_jsx(Box, { sx: {
+                                        flex: 1,
+                                        height: 4,
+                                        ml: 2,
+                                        mr: 2,
+                                        borderRadius: 999,
+                                        bg: style.lineColor,
+                                    } })) : null] }), _jsx(Text, { as: "p", sx: { fontWeight: 600, color: style.titleColor, mb: 1 }, children: item.title }), _jsx(Text, { as: "p", sx: {
+                                fontSize: 0,
+                                color: 'fg.muted',
+                                mb: item.subtitle ? 1 : 0,
+                            }, children: renderTimestamp
+                                ? renderTimestamp(item.timestamp)
+                                : item.timestamp || 'n/a' }), item.subtitle ? (_jsx(Text, { as: "p", sx: { fontSize: 0, color: 'fg.subtle' }, children: item.subtitle })) : null] }, item.id));
+            }) }) }));
+};

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

@@ -0,0 +1 @@
+export * from './Timeline';

package/lib/components/timeline/index.js

@@ -0,0 +1,9 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/*
+ * Copyright (c) 2023-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './Timeline.js';

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

@@ -1 +1 @@
-export * from './SpaceVariantToken';
+export {};

package/lib/components/tokens/index.js

@@ -2,4 +2,4 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-export * from './SpaceVariantToken.js';
+export {};

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

@@ -1,3 +1 @@
-export * from './AssignmentEditorToolbar';
-export * from './DocumentEditorToolbar';
-export * from './NotebookEditorToolbar';
+export {};

package/lib/components/toolbars/index.js

@@ -2,6 +2,4 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-export * from './AssignmentEditorToolbar.js';
-export * from './DocumentEditorToolbar.js';
-export * from './NotebookEditorToolbar.js';
+export {};

package/lib/hooks/cacheConverters.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Convert a raw code sandbox snapshot payload into its client shape.
+ *
+ * @param s - The raw snapshot payload from the API.
+ * @returns The converted snapshot object.
+ */
+export declare function asCodeSandboxSnapshot(s: any): any;
+/**
+ * Convert a raw page payload into its client shape.
+ *
+ * @param s - The raw page payload from the API.
+ * @returns The converted page object.
+ */
+export declare const asPage: (s: any) => any;
+/**
+ * Convert a raw space payload into its client shape.
+ *
+ * @param raw_space - The raw space payload from the API.
+ * @returns The converted space object.
+ */
+export declare const asSpace: (raw_space: any) => any;

package/lib/hooks/cacheConverters.js

@@ -0,0 +1,110 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * Local response converters for the core cache hook.
+ *
+ * The rich content models (Space, Page, CodeSandboxSnapshot) live in the
+ * runtime/content package (`@datalayer/agent-runtimes`). The core cache still
+ * fetches this data over raw HTTP, so these converters are kept here with
+ * loosened (structural) types to preserve runtime behaviour without depending
+ * on the content models.
+ *
+ * @module hooks/cacheConverters
+ */
+import { asUser } from '../models/index.js';
+import { asArray } from '../utils/index.js';
+/**
+ * Convert a raw code sandbox snapshot payload into its client shape.
+ *
+ * @param s - The raw snapshot payload from the API.
+ * @returns The converted snapshot object.
+ */
+export function asCodeSandboxSnapshot(s) {
+    const { uid, updated_at, format_version, ...others } = s;
+    return {
+        ...others,
+        id: uid,
+        updatedAt: new Date(updated_at),
+        formatVersion: format_version,
+    };
+}
+/**
+ * Convert a raw page payload into its client shape.
+ *
+ * @param s - The raw page payload from the API.
+ * @returns The converted page object.
+ */
+export const asPage = (s) => {
+    return {
+        id: s.uid,
+        type: 'page',
+        variant: s.variant_s,
+        name: s.name_t,
+        description: s.description_t,
+        theme: s.theme_s,
+        nbformat: s.nbformat_s ? JSON.parse(s.nbformat_s) : undefined,
+        screenCapture: s.screen_capture_cdn_url_s || s.screen_capture_s,
+        tags: s.tags_ss ?? [],
+        creator: s.creator ? asUser(s.creator) : undefined,
+        creatorId: s.creator_uid,
+        kernelSnapshot: s.kernel_snapshot
+            ? asCodeSandboxSnapshot(s.kernel_snapshot)
+            : undefined,
+        kernelSnapshotId: s.kernel_snapshot_uid,
+    };
+};
+/**
+ * Convert a raw space payload into its client shape.
+ *
+ * @param raw_space - The raw space payload from the API.
+ * @returns The converted space object.
+ */
+export const asSpace = (raw_space) => {
+    const sharedOwnerUserUids = asArray(raw_space?.shared_owner_user_uids_ss ||
+        raw_space?.shared_ower_user_uids_ss ||
+        []).filter((uid) => typeof uid === 'string' && uid.length > 0);
+    const organizationHandle = raw_space?.organization?.handle;
+    const owner = raw_space?.owner
+        ? asUser(raw_space.owner)
+        : {
+            id: '',
+            handle: '',
+            email: '',
+            firstName: '',
+            lastName: '',
+            initials: '',
+            displayName: '',
+            roles: [],
+            iamProviders: [],
+            setRoles: () => { },
+            unsubscribedFromOutbounds: false,
+            onboarding: {},
+            events: [],
+            settings: {},
+        };
+    let members = [];
+    if (raw_space.members) {
+        members = asArray(raw_space.members).map((m) => asUser(m));
+    }
+    const space = {
+        id: raw_space.uid,
+        handle: raw_space.handle_s,
+        type: 'space',
+        variant: raw_space.variant_s,
+        name: raw_space.name_t,
+        description: raw_space.description_t,
+        public: raw_space.public_b,
+        members,
+        creationDate: new Date(raw_space.creation_ts_dt),
+        owner,
+        organization: organizationHandle
+            ? { handle: organizationHandle }
+            : undefined,
+        sharedOwnerUserUids,
+        // Preserve raw Solr fields so consumers can access dynamic fields.
+        ...raw_space,
+    };
+    return space;
+};

package/lib/hooks/index.d.ts

@@ -20,12 +20,10 @@ export * from './useNavigate';
 export * from './useParams';
 export * from './useOnClickOutside';
 export * from './useRef';
-export * from './useRuntimes';
 export * from './useScreencapture';
 export * from './useToast';
 export * from './useUpload';
 export * from './useUser';
-export * from './useProjects';
 export * from './useProjectStore';
 export * from './useMobile';
 export * from './useUsageRefreshStore';

package/lib/hooks/index.js

@@ -25,12 +25,10 @@ export * from './useNavigate.js';
 export * from './useParams.js';
 export * from './useOnClickOutside.js';
 export * from './useRef.js';
-export * from './useRuntimes.js';
 export * from './useScreencapture.js';
 export * from './useToast.js';
 export * from './useUpload.js';
 export * from './useUser.js';
-export * from './useProjects.js';
 export * from './useProjectStore.js';
 export * from './useMobile.js';
 export * from './useUsageRefreshStore.js';