@datalayer/core 1.0.2 → 1.0.11

package/lib/views/otel/SqlView.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from '@primer/react';
+import { OtelSqlView } from '../../otel';
+export const SqlView = ({ baseUrl = '', token }) => (_jsx(Box, { sx: { display: 'flex', flex: 1, minHeight: 0, overflow: 'hidden' }, children: _jsx(OtelSqlView, { baseUrl: baseUrl, token: token }) }));

package/lib/views/otel/SystemView.d.ts

@@ -0,0 +1,9 @@
+/**
+ * SystemView – OTEL system/infrastructure view.
+ */
+import React from 'react';
+export interface SystemViewProps {
+    baseUrl?: string;
+    token?: string;
+}
+export declare const SystemView: React.FC<SystemViewProps>;

package/lib/views/otel/SystemView.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from '@primer/react';
+import { OtelSystemView } from '../../otel';
+export const SystemView = ({ baseUrl = '', token, }) => (_jsx(Box, { sx: { display: 'flex', flex: 1, minHeight: 0, overflow: 'hidden' }, children: _jsx(OtelSystemView, { baseUrl: baseUrl, token: token }) }));

package/lib/views/otel/TracesView.d.ts

@@ -0,0 +1,12 @@
+/**
+ * TracesView – Standalone traces-only view.
+ * Renders OtelLive defaulting to the traces signal.
+ */
+import React from 'react';
+export interface TracesViewProps {
+    baseUrl?: string;
+    token?: string;
+    autoRefreshMs?: number;
+    limit?: number;
+}
+export declare const TracesView: React.FC<TracesViewProps>;

package/lib/views/otel/TracesView.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from '@primer/react';
+import { OtelLive } from '../../otel';
+export const TracesView = ({ baseUrl = '', token, autoRefreshMs = 5000, limit = 200, }) => (_jsx(Box, { sx: { display: 'flex', flex: 1, minHeight: 0, overflow: 'hidden' }, children: _jsx(OtelLive, { baseUrl: baseUrl, token: token, autoRefreshMs: autoRefreshMs, defaultSignal: "traces", limit: limit }) }));

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

@@ -0,0 +1,16 @@
+export { DashboardView } from './DashboardView';
+export type { DashboardViewProps } from './DashboardView';
+export { TracesView } from './TracesView';
+export type { TracesViewProps } from './TracesView';
+export { LogsView } from './LogsView';
+export type { LogsViewProps } from './LogsView';
+export { MetricsView } from './MetricsView';
+export type { MetricsViewProps } from './MetricsView';
+export { SqlView } from './SqlView';
+export type { SqlViewProps } from './SqlView';
+export { SystemView } from './SystemView';
+export type { SystemViewProps } from './SystemView';
+export { OtelHeader } from './OtelHeader';
+export type { OtelHeaderProps } from './OtelHeader';
+export { useSimpleAuthStore } from './simpleAuthStore';
+export type { SimpleAuthState } from './simpleAuthStore';

package/lib/views/otel/index.js

@@ -0,0 +1,12 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export { DashboardView } from './DashboardView';
+export { TracesView } from './TracesView';
+export { LogsView } from './LogsView';
+export { MetricsView } from './MetricsView';
+export { SqlView } from './SqlView';
+export { SystemView } from './SystemView';
+export { OtelHeader } from './OtelHeader';
+export { useSimpleAuthStore } from './simpleAuthStore';

package/lib/views/otel/simpleAuthStore.d.ts

@@ -0,0 +1,21 @@
+export interface SimpleAuthState {
+    /** JWT bearer token (from IAM login). */
+    token: string | null;
+    /** Authenticated user's handle. */
+    handle: string | null;
+    /** Set credentials after successful login. */
+    setAuth: (token: string, handle: string) => void;
+    /** Clear credentials (logout). */
+    clearAuth: () => void;
+}
+export declare const useSimpleAuthStore: import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<SimpleAuthState>, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<SimpleAuthState, SimpleAuthState>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void> | void;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: SimpleAuthState) => void) => () => void;
+        onFinishHydration: (fn: (state: SimpleAuthState) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<SimpleAuthState, SimpleAuthState>>;
+    };
+}>;

package/lib/views/otel/simpleAuthStore.js

@@ -0,0 +1,22 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * Minimal token-based authentication store.
+ *
+ * Persists a JWT bearer token and a user handle to localStorage so the
+ * session survives page refreshes.  Intended for demo / example apps that
+ * need a lightweight auth layer without a full IAM integration.
+ *
+ * Import via the `@datalayer/core/views/otel` subpath:
+ *   import { useSimpleAuthStore } from '@datalayer/core/views/otel';
+ */
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+export const useSimpleAuthStore = create()(persist((set) => ({
+    token: null,
+    handle: null,
+    setAuth: (token, handle) => set({ token, handle }),
+    clearAuth: () => set({ token: null, handle: null }),
+}), { name: 'datalayer-simple-auth' }));

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

@@ -0,0 +1,20 @@
+/**
+ * UserBadge – Shows the authenticated user's display name.
+ *
+ * On hover, reveals a JWT details popover with email, handle, UID,
+ * issued/expiry timestamps, roles, and the raw decoded claims.
+ *
+ * The trigger text and the popover share a single container so the
+ * popover stays open while the mouse travels from the label into it.
+ *
+ * @module views/profile
+ */
+import React from 'react';
+export interface UserBadgeProps {
+    /** Raw JWT bearer token. */
+    token: string;
+    /** Display variant for the claims overlay. */
+    variant?: 'full' | 'small';
+}
+export declare const UserBadge: React.FC<UserBadgeProps>;
+export default UserBadge;

package/lib/views/profile/UserBadge.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * UserBadge – Shows the authenticated user's display name.
+ *
+ * On hover, reveals a JWT details popover with email, handle, UID,
+ * issued/expiry timestamps, roles, and the raw decoded claims.
+ *
+ * The trigger text and the popover share a single container so the
+ * popover stays open while the mouse travels from the label into it.
+ *
+ * @module views/profile
+ */
+import { useState, useRef, useCallback } from 'react';
+import { Box, Text } from '@primer/react';
+import { parseJwtPayload, getDatalayerJwtUser, getDatalayerDisplayName, } from '../../utils/Jwt';
+// ── Component ─────────────────────────────────────────────────────
+export const UserBadge = ({ token, variant = 'full', }) => {
+    const [open, setOpen] = useState(false);
+    const closeTimer = useRef(null);
+    const handleEnter = useCallback(() => {
+        if (closeTimer.current)
+            clearTimeout(closeTimer.current);
+        setOpen(true);
+    }, []);
+    const handleLeave = useCallback(() => {
+        // Small delay so the mouse can travel from the label into the popover
+        // without it closing.
+        closeTimer.current = setTimeout(() => setOpen(false), 120);
+    }, []);
+    const user = getDatalayerJwtUser(token);
+    const displayName = getDatalayerDisplayName(user, user?.handle ?? '');
+    const claims = parseJwtPayload(token);
+    return (_jsxs(Box, { sx: { position: 'relative' }, onMouseEnter: handleEnter, onMouseLeave: handleLeave, children: [_jsx(Text, { sx: {
+                    fontSize: 1,
+                    color: 'fg.muted',
+                    cursor: 'default',
+                    borderBottom: '1px dashed',
+                    borderColor: 'border.muted',
+                    pb: '1px',
+                    userSelect: 'none',
+                }, children: displayName }), open && claims && (_jsxs(Box, { sx: {
+                    position: 'absolute',
+                    top: 'calc(100% + 4px)',
+                    right: 0,
+                    zIndex: 100,
+                    width: '400px',
+                    bg: 'canvas.overlay',
+                    border: '1px solid',
+                    borderColor: 'border.default',
+                    borderRadius: 2,
+                    boxShadow: 'shadow.large',
+                    overflow: 'hidden',
+                }, children: [_jsx(Box, { sx: {
+                            px: 3,
+                            py: 2,
+                            bg: 'canvas.subtle',
+                            borderBottom: '1px solid',
+                            borderColor: 'border.default',
+                        }, children: _jsx(Text, { sx: { fontWeight: 'bold', fontSize: 1 }, children: "JWT Claims" }) }), claims.user && (_jsx(Box, { sx: {
+                            px: 3,
+                            py: 2,
+                            borderBottom: '1px solid',
+                            borderColor: 'border.muted',
+                        }, children: _jsxs(Box, { sx: {
+                                display: 'grid',
+                                gridTemplateColumns: '90px 1fr',
+                                gap: 1,
+                                fontSize: 0,
+                            }, children: [claims.user.email && (_jsxs(_Fragment, { children: [_jsx(Text, { sx: { color: 'fg.muted' }, children: "Email" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: claims.user.email })] })), _jsx(Text, { sx: { color: 'fg.muted' }, children: "Handle" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: claims.user.handle }), _jsx(Text, { sx: { color: 'fg.muted' }, children: "UID" }), _jsx(Text, { sx: { fontFamily: 'mono', wordBreak: 'break-all' }, children: claims.user.uid }), _jsx(Text, { sx: { color: 'fg.muted' }, children: "Issued" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: new Date(claims.iat * 1000).toISOString() }), _jsx(Text, { sx: { color: 'fg.muted' }, children: "Expires" }), _jsx(Text, { sx: { fontFamily: 'mono' }, children: new Date(claims.exp * 1000).toISOString() })] }) })), (claims.user?.roles ?? claims.roles ?? []).length > 0 && (_jsxs(Box, { sx: {
+                            px: 3,
+                            py: 2,
+                            borderBottom: '1px solid',
+                            borderColor: 'border.muted',
+                        }, children: [_jsx(Text, { sx: { fontSize: 0, color: 'fg.muted', display: 'block', mb: 1 }, children: "Roles" }), _jsx(Box, { sx: { display: 'flex', flexWrap: 'wrap', gap: 1 }, children: (claims.user?.roles ?? claims.roles ?? []).map(r => (_jsx(Box, { sx: {
+                                        fontSize: 0,
+                                        fontFamily: 'mono',
+                                        px: 1,
+                                        py: '1px',
+                                        bg: 'accent.subtle',
+                                        color: 'accent.fg',
+                                        borderRadius: 1,
+                                        border: '1px solid',
+                                        borderColor: 'accent.muted',
+                                    }, children: r }, r))) })] })), variant === 'full' && (_jsx(Box, { as: "pre", sx: {
+                            m: 0,
+                            px: 3,
+                            py: 2,
+                            fontFamily: 'mono',
+                            fontSize: 0,
+                            color: 'fg.default',
+                            bg: 'canvas.inset',
+                            overflow: 'auto',
+                            maxHeight: '220px',
+                            whiteSpace: 'pre',
+                        }, children: JSON.stringify(claims, null, 2) }))] }))] }));
+};
+export default UserBadge;

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

@@ -0,0 +1,2 @@
+export { UserBadge } from './UserBadge';
+export type { UserBadgeProps } from './UserBadge';

package/lib/views/profile/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export { UserBadge } from './UserBadge';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datalayer/core",
-  "version": "1.0.2",
+  "version": "1.0.11",
   "type": "module",
   "workspaces": [
     ".",
@@ -54,7 +54,7 @@
     "build": "npm run clean && gulp resources-to-lib && tsc -b && vite build",
     "build:lib": "npm run clean:lib && gulp resources-to-lib && tsc -b && node scripts/fix-esm-imports.cjs",
     "build:types": "npm run clean:lib && tsc -b",
-    "build:nextjs": "npm run build --workspace=nextjs-notebook-example",
+    "build:nextjs": "npm run build --workspace=nextjj-example",
     "build:examples": "npm run build:nextjs",
     "build:all": "npm run build && npm run build:examples",
     "lint": "eslint . --quiet",
@@ -90,7 +90,7 @@
     "type-check:watch": "tsc -b -w --noEmit",
     "examples": "run-p jupyter:start examples:vite",
     "examples:vite": "VITE_DATALAYER_RUN_URL=http://localhost:8888 vite --config vite.examples.config.ts",
-    "examples:nextjs": "npm run dev --workspace=nextjs-notebook-example",
+    "examples:nextjs": "npm run dev --workspace=nextjj-example",
     "jupyter:start": "./dev/sh/start-jupyter-server.sh",
     "prepare": "husky || true",
     "kill": "./dev/sh/kill.sh || true",
@@ -196,7 +196,6 @@
     "@types/node": "^20.11.0",
     "@types/react": "18.3.20",
     "@types/react-dom": "18.3.6",
-    "@types/react-syntax-highlighter": "^15.5.13",
     "@vitejs/plugin-react": "^4.5.2",
     "@vitest/browser": "^3.2.4",
     "@vitest/coverage-v8": "^3.2.4",