@datalayer/core 0.0.2 → 0.0.4

package/lib/hooks/useCellOutputshot.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useState } from 'react';
 import { useCellStore } from '../state';
 import { takeHTMLNodeScreenshot } from '../utils/Screenshot';
@@ -15,7 +10,8 @@ const useCellOutputshot = () => {
     const [error, setError] = useState();
     const { update } = useCellStore();
     const takeOutputshot = (node) => {
-        takeHTMLNodeScreenshot(node).then(outputshotData => {
+        takeHTMLNodeScreenshot(node)
+            .then(outputshotData => {
             setOutputshot(outputshotData);
             update({
                 outputshotData,
@@ -24,10 +20,6 @@ const useCellOutputshot = () => {
         })
             .catch(reason => setError(reason));
     };
-    return [
-        outputshot,
-        takeOutputshot,
-        { error }
-    ];
+    return [outputshot, takeOutputshot, { error }];
 };
 export default useCellOutputshot;

package/lib/hooks/useContainsFocus.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useCallback, useEffect, useState } from 'react';
 /**
  * Determine if a child element of the provided ref is currently focussed.
@@ -31,7 +26,8 @@ export const useContainsFocus = (containerRef, onFocusChange) => {
             updateState(true);
         };
         const handleFocusOut = (event) => {
-            if (containerRef.current && !containerRef.current.contains(event.relatedTarget)) {
+            if (containerRef.current &&
+                !containerRef.current.contains(event.relatedTarget)) {
                 updateState(false);
             }
         };

package/lib/hooks/useDatalayer.d.ts

@@ -0,0 +1,21 @@
+import type { IRequestDatalayerAPIOptions } from '../api';
+export type IDatalayerRequestProps = {
+    /**
+     * React router login route
+     *
+     * @default '/login'
+     */
+    loginRoute?: string;
+    /**
+     * Notify user through toast on errors.
+     *
+     * @default true
+     */
+    notifyOnError?: boolean;
+};
+export interface DatalayerRequest extends IDatalayerRequestProps, IRequestDatalayerAPIOptions {
+}
+export declare function useDatalayer(props?: IDatalayerRequestProps): {
+    requestDatalayer: <T = any>(request: DatalayerRequest) => Promise<T>;
+};
+export default useDatalayer;

package/lib/hooks/{useRun.js → useDatalayer.js}

@@ -2,32 +2,30 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
-import { useLocation } from 'react-router-dom';
+import { useLocation } from './useLocation';
 import { useNavigate } from './useNavigate';
 import { useToast } from './useToast';
-import { useRunMock } from './../mocks';
-import { useIAMStore, useCoreStore } from '../state';
-import { requestRunAPI } from '../api';
-export function useRun(props = {}) {
+// import { useRuMnock } from './../mocks';
+import { useIAMStore } from '../state';
+import { requestDatalayerAPI } from '../api';
+export function useDatalayer(props = {}) {
     const { loginRoute = '/login', notifyOnError = true } = props;
     const location = useLocation();
+    /*
+    // TODO Fix the conditional hook call.
     const coreStore = useCoreStore();
     // Don't remove === true for the test, otherwise it will always be true???
     if (coreStore.configuration.useMock === true) {
-        return useRunMock();
+      return useDatalayerMock();
     }
+    */
     const { enqueueToast } = useToast();
     const iamStore = useIAMStore();
     const navigate = useNavigate();
-    const requestRun = async (request) => {
+    const requestDatalayer = async (request) => {
         const { loginRoute: loginRoute_ = loginRoute, notifyOnError: notifyOnError_ = notifyOnError, ...apiRequest } = request;
         const token = apiRequest.token ?? iamStore.token;
-        return requestRunAPI({
+        return requestDatalayerAPI({
             ...apiRequest,
             token,
         })
@@ -59,7 +57,9 @@ export function useRun(props = {}) {
                             enqueueToast(`API Error`, { variant: 'error' });
                         }
                         if (responseError.exceptionMessage) {
-                            enqueueToast(`${responseError.exceptionMessage}`, { variant: 'error' });
+                            enqueueToast(`${responseError.exceptionMessage}`, {
+                                variant: 'error',
+                            });
                         }
                     }
                 }
@@ -78,8 +78,6 @@ export function useRun(props = {}) {
             throw error;
         });
     };
-    return {
-        requestRun
-    };
+    return { requestDatalayer };
 }
-export default useRun;
+export default useDatalayer;

package/lib/hooks/useError.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 export declare const ErrorMessage: React.FC<{
     message: Array<string> | string | null;
 }>;

package/lib/hooks/useError.js

@@ -3,16 +3,11 @@ 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) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
-import { useState } from "react";
+import { useState } from 'react';
 import { Flash } from '@primer/react';
 export const ErrorMessage = ({ message }) => {
     if (message instanceof Array) {
-        return _jsx("div", { children: message.map((m, i) => _jsx(Flash, { variant: "danger", children: m }, i)) });
+        return (_jsx("div", { children: message.map((m, i) => (_jsx(Flash, { variant: "danger", children: m }, i))) }));
     }
     else {
         return _jsx(Flash, { variant: "danger", children: message });

package/lib/hooks/useExternalScript.js

@@ -2,17 +2,12 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
-import { useEffect } from "react";
+import { useEffect } from 'react';
 const useExternalScript = (url) => {
     useEffect(() => {
-        const head = document.querySelector("head");
-        const script = document.createElement("script");
-        script.setAttribute("src", url);
+        const head = document.querySelector('head');
+        const script = document.createElement('script');
+        script.setAttribute('src', url);
         head.appendChild(script);
         return () => {
             head.removeChild(script);

package/lib/hooks/useFocusTrap.d.ts

@@ -22,7 +22,7 @@ export interface FocusTrapHookSettings {
 /**
  * Hook used to trap focus inside a container. Returns a ref that can be added to the container
  * that should trap focus.
- * @param settings {FocusTrapHookSettings}
+ * @param settings {FocusTrapHookSettings}
  */
 export declare function useFocusTrap(settings?: FocusTrapHookSettings, dependencies?: React.DependencyList): {
     containerRef: React.RefObject<HTMLElement> | undefined;

package/lib/hooks/useFocusTrap.js

@@ -2,17 +2,12 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import React from 'react';
 import { focusTrap } from '@primer/behaviors';
 /**
  * Hook used to trap focus inside a container. Returns a ref that can be added to the container
  * that should trap focus.
- * @param settings {FocusTrapHookSettings}
+ * @param settings {FocusTrapHookSettings}
  */
 export function useFocusTrap(settings, dependencies = []) {
     const containerRef = settings?.containerRef;
@@ -29,7 +24,8 @@ export function useFocusTrap(settings, dependencies = []) {
     // to the previously-focused element (if necessary).
     function disableTrap() {
         abortController.current?.abort();
-        if (settings?.restoreFocusOnCleanUp && previousFocusedElement.current instanceof HTMLElement) {
+        if (settings?.restoreFocusOnCleanUp &&
+            previousFocusedElement.current instanceof HTMLElement) {
             previousFocusedElement.current.focus();
             previousFocusedElement.current = null;
         }

package/lib/hooks/useIAM.js

@@ -2,16 +2,11 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useEffect, useState } from 'react';
 import { useCache } from './useCache';
-import { coreStore, useIAMStore, useLayoutStore, useOrganizationStore, useSpaceStore } from '../state';
-import { asUser, ANONYMOUS_USER, ANONYMOUS_USER_TOKEN } from '../models';
-import { requestRunAPI } from '../api';
+import { coreStore, useIAMStore, useLayoutStore, useOrganizationStore, useSpaceStore, } from '../state';
+import { asUser, ANONYMOUS_USER, ANONYMOUS_USER_TOKEN, } from '../models';
+import { requestDatalayerAPI } from '../api';
 export const useIAM = (props = { user: undefined, token: undefined }) => {
     const { token } = props;
     const [iamState, setIAMState] = useState(props);
@@ -22,7 +17,7 @@ export const useIAM = (props = { user: undefined, token: undefined }) => {
     const { clearAllCaches, whoami } = useCache();
     const loginAndNavigate = async (token, logout, refresh, navigate, homeRoute) => {
         try {
-            const resp = await requestRunAPI({
+            const resp = await requestDatalayerAPI({
                 url: `${iamStore.iamRunUrl}/api/iam/v1/login`,
                 method: 'POST',
                 body: { token },
@@ -70,8 +65,7 @@ export const useIAM = (props = { user: undefined, token: undefined }) => {
     };
     useEffect(() => {
         if (token) {
-            whoami()
-                .then(resp => {
+            whoami().then(resp => {
                 if (resp.success) {
                     const user = asUser(resp.profile);
                     setIAMState({ user, token });
@@ -92,7 +86,7 @@ export const useIAM = (props = { user: undefined, token: undefined }) => {
         token: iamState.token,
         loginAndNavigate,
         setLogin,
-        logout
+        logout,
     };
 };
 export default useIAM;

package/lib/hooks/useId.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 /*
  * Welcome to @reach/auto-id!
 
@@ -63,8 +58,8 @@
  * server hydration and never again, SO BACK OFF ALRIGHT?
  */
 /* eslint-disable react-hooks/rules-of-hooks */
-import * as React from "react";
-import { useLayoutEffect } from "react";
+import * as React from 'react';
+import { useLayoutEffect } from 'react';
 let serverHandoffComplete = false;
 let id = 0;
 function genId() {
@@ -72,16 +67,16 @@ function genId() {
 }
 // Workaround for https://github.com/webpack/webpack/issues/14814
 // https://github.com/eps1lon/material-ui/blob/8d5f135b4d7a58253a99ab56dce4ac8de61f5dc1/packages/mui-utils/src/useId.ts#L21
-const maybeReactUseId = React["useId".toString()];
+const maybeReactUseId = React['useId'.toString()];
 function useId(providedId) {
     if (maybeReactUseId !== undefined) {
-        let generatedId = maybeReactUseId();
+        const generatedId = maybeReactUseId();
         return providedId ?? generatedId;
     }
     // If this instance isn't part of the initial render, we don't have to do the
     // double render/patch-up dance. We can just generate the ID and return it.
-    let initialId = providedId ?? (serverHandoffComplete ? genId() : null);
-    let [id, setId] = React.useState(initialId);
+    const initialId = providedId ?? (serverHandoffComplete ? genId() : null);
+    const [id, setId] = React.useState(initialId);
     useLayoutEffect(() => {
         if (id === null) {
             // Patch the ID after render. We do this in `useLayoutEffect` to avoid any

package/lib/hooks/useIsomorphicLayoutEffect.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useEffect, useLayoutEffect } from 'react';
 const useIsomorphicLayoutEffect = typeof window !== 'undefined' &&
     typeof window.document !== 'undefined' &&

package/lib/hooks/useJupyterLabTheme.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useEffect, useState } from 'react';
 export var JupyterLabTheme;
 (function (JupyterLabTheme) {
@@ -14,7 +9,9 @@ export var JupyterLabTheme;
     JupyterLabTheme["DARK"] = "JupyterLab Dark";
 })(JupyterLabTheme || (JupyterLabTheme = {}));
 export const useJupyterLabTheme = (themeManager) => {
-    const isLight = themeManager && themeManager.theme ? themeManager.isLight(themeManager.theme) : true;
+    const isLight = themeManager && themeManager.theme
+        ? themeManager.isLight(themeManager.theme)
+        : true;
     const [theme, setTheme] = useState(isLight ? JupyterLabTheme.LIGHT : JupyterLabTheme.DARK);
     useEffect(() => {
         const handleThemeChange = (newTheme, event) => {

package/lib/hooks/useKeyboardEscape.js

@@ -2,11 +2,6 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
 import { useCallback, useEffect } from 'react';
 export function useKeyboardEscape(handler) {
     const handleKeyboardEscape = useCallback(event => {

package/lib/hooks/useLocation.d.ts

@@ -0,0 +1,22 @@
+export interface Location {
+    pathname: string;
+    search: string;
+    hash: string;
+    state: any;
+    key: string;
+}
+/**
+ * Hook to get current location
+ * Detects and uses React Router when available, falls back to native browser location
+ */
+export declare const useLocation: () => Location;
+/**
+ * Hook to get history functions
+ * Detects and uses React Router history when available, falls back to browser history
+ */
+export declare const useHistory: () => {
+    back: () => void;
+    forward: () => void;
+    replace: (to: string, state?: any) => void;
+    push: (to: string, state?: any) => void;
+};

package/lib/hooks/useLocation.js

@@ -0,0 +1,149 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { useEffect, useState } from 'react';
+// Import React Router hooks from our wrapper
+import { useLocationRR, useNavigateRR, } from '../navigation/adapters/react-router';
+// Import Next.js hooks from our wrapper
+// Currently not used but kept for future Next.js support
+// import {
+//   usePathnameNext,
+//   useSearchParamsNext,
+// } from '../navigation/adapters/nextjs';
+/**
+ * Hook to get current location
+ * Detects and uses React Router when available, falls back to native browser location
+ */
+export const useLocation = () => {
+    // Native location state for fallback
+    const [nativeLocation, setNativeLocation] = useState(() => {
+        if (typeof window === 'undefined') {
+            return {
+                pathname: '/',
+                search: '',
+                hash: '',
+                state: null,
+                key: 'default',
+            };
+        }
+        return {
+            pathname: window.location.pathname,
+            search: window.location.search,
+            hash: window.location.hash,
+            state: window.history.state,
+            key: 'default',
+        };
+    });
+    // Detect environment
+    const isNextJs = typeof window !== 'undefined' && !!window.__NEXT_DATA__;
+    const isClient = typeof window !== 'undefined';
+    // Try to use React Router if available
+    let routerLocation = null;
+    let isReactRouter = false;
+    try {
+        // Only actually use the hook if we have it and not in Next.js
+        if (!isNextJs && useLocationRR && isClient) {
+            // eslint-disable-next-line react-hooks/rules-of-hooks
+            routerLocation = useLocationRR();
+            isReactRouter = !!routerLocation;
+        }
+    }
+    catch {
+        // Not in a Router context, fallback to native
+    }
+    useEffect(() => {
+        // Only set up native listeners if not using React Router
+        if (isReactRouter)
+            return;
+        // Listen to popstate for browser navigation changes
+        const handleLocationChange = () => {
+            setNativeLocation({
+                pathname: window.location.pathname,
+                search: window.location.search,
+                hash: window.location.hash,
+                state: window.history.state,
+                key: 'native-' + Date.now(),
+            });
+        };
+        window.addEventListener('popstate', handleLocationChange);
+        // Also listen for custom navigation events if needed
+        window.addEventListener('pushstate', handleLocationChange);
+        window.addEventListener('replacestate', handleLocationChange);
+        return () => {
+            window.removeEventListener('popstate', handleLocationChange);
+            window.removeEventListener('pushstate', handleLocationChange);
+            window.removeEventListener('replacestate', handleLocationChange);
+        };
+    }, [isReactRouter]);
+    // Return React Router location if available, otherwise native location
+    return isReactRouter && routerLocation ? routerLocation : nativeLocation;
+};
+/**
+ * Hook to get history functions
+ * Detects and uses React Router history when available, falls back to browser history
+ */
+export const useHistory = () => {
+    // Detect environment
+    const isNextJs = typeof window !== 'undefined' && !!window.__NEXT_DATA__;
+    const isClient = typeof window !== 'undefined';
+    // Try to use React Router if available
+    let routerNavigate = null;
+    let isReactRouter = false;
+    try {
+        if (!isNextJs && useNavigateRR && isClient) {
+            // eslint-disable-next-line react-hooks/rules-of-hooks
+            routerNavigate = useNavigateRR();
+            isReactRouter = true;
+        }
+    }
+    catch {
+        // Not in a Router context
+    }
+    if (isReactRouter && routerNavigate) {
+        // Use React Router navigation
+        return {
+            back: () => {
+                routerNavigate(-1);
+            },
+            forward: () => {
+                routerNavigate(1);
+            },
+            replace: (to, state) => {
+                routerNavigate(to, { replace: true, state });
+            },
+            push: (to, state) => {
+                routerNavigate(to, { state });
+            },
+        };
+    }
+    // Fall back to native browser history
+    return {
+        back: () => {
+            if (typeof window !== 'undefined') {
+                window.history.back();
+            }
+        },
+        forward: () => {
+            if (typeof window !== 'undefined') {
+                window.history.forward();
+            }
+        },
+        replace: (to, state) => {
+            if (typeof window !== 'undefined') {
+                const url = new URL(to, window.location.href);
+                window.history.replaceState(state || null, '', url.href);
+                // Dispatch custom event for location hooks
+                window.dispatchEvent(new Event('replacestate'));
+            }
+        },
+        push: (to, state) => {
+            if (typeof window !== 'undefined') {
+                const url = new URL(to, window.location.href);
+                window.history.pushState(state || null, '', url.href);
+                // Dispatch custom event for location hooks
+                window.dispatchEvent(new Event('pushstate'));
+            }
+        },
+    };
+};

package/lib/hooks/useLocationHandles.d.ts

@@ -3,8 +3,8 @@ export declare const useLocationHandles: () => {
     spaceHandler: string | undefined;
     spaceHandle?: undefined;
 } | {
-    accountHandle: string | undefined;
-    spaceHandle: string | undefined;
+    accountHandle: string;
+    spaceHandle: string;
     spaceHandler?: undefined;
 };
 export default useLocationHandles;

package/lib/hooks/useLocationHandles.js

@@ -2,18 +2,15 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-/*
- * Copyright (c) 2021-2024 Datalayer, Inc.
- *
- * Datalayer License
- */
-import { useLocation, useParams } from "react-router-dom";
-import { useRunStore } from "../state";
+import { useLocation } from './useLocation';
+import { useParams } from './useParams';
+import { useRunStore } from '../state';
 export const useLocationHandles = () => {
-    const { accountHandle, spaceHandle } = useParams();
+    const params = useParams();
+    const { accountHandle, spaceHandle } = params;
     const { pathname } = useLocation();
     const runStore = useRunStore();
-    if (pathname.startsWith("/public")) {
+    if (pathname.startsWith('/public')) {
         return {
             accountHandle: runStore.iam().user?.handle,
             spaceHandler: runStore.layout().space?.handle,

package/lib/hooks/useNavigate.d.ts

@@ -1,2 +1,6 @@
-export declare const useNavigate: () => (location: string, e?: any, resetPortals?: boolean, options?: any) => void;
+/**
+ * Main navigation hook that provides a universal navigate function
+ * Works with React Router, Next.js, or native browser navigation
+ */
+export declare const useNavigate: () => (location: string, optionsOrEvent?: any, resetPortals?: boolean, extraOptions?: any) => void;
 export default useNavigate;