@datalayer/core 0.0.3 → 0.0.5

package/lib/components/runtimes/RuntimeUtils.js

@@ -36,7 +36,7 @@ export function getGroupedRuntimeDescs(multiServiceManager, kernelId, translator
         .map(session => {
         const spec = multiServiceManager.browser.kernelspecs.specs.kernelspecs[session.kernel.name];
         return {
-            id: "", // TODO Assign a proper ID.
+            id: '', // TODO Assign a proper ID.
             kernelId: session.kernel.id,
             name: spec.name,
             language: spec.language,
@@ -62,7 +62,9 @@ export function getGroupedRuntimeDescs(multiServiceManager, kernelId, translator
         .concat((multiServiceManager.remote?.runtimesManager.get() ?? [])
         .filter(k => k.id && !listedAsSession.includes(k.id))
         .map(runtime => {
-        const environment = multiServiceManager.remote.environments.get().find(env => env.name === runtime.environment_name);
+        const environment = multiServiceManager
+            .remote.environments.get()
+            .find(env => env.name === runtime.environment_name);
         return {
             kernelId: runtime.id,
             name: environment.name,
@@ -82,16 +84,15 @@ export function getGroupedRuntimeDescs(multiServiceManager, kernelId, translator
             name: spec.name,
             language: spec.language,
             displayName: spec.display_name,
-            location: 'browser'
+            location: 'browser',
         };
     }))
         .filter(filterKernels);
     runningSessions.push(...runningKernels);
     if (runningSessions.length) {
-        const key = (variant === 'cell') ?
-            ASSIGN_EXISTING_REMOTE_RUNTIME_LABEL
-            :
-                ASSIGN_EXISTING_RUNTIME_LABEL;
+        const key = variant === 'cell'
+            ? ASSIGN_EXISTING_REMOTE_RUNTIME_LABEL
+            : ASSIGN_EXISTING_RUNTIME_LABEL;
         kernels[key] = runningSessions;
     }
     // Environments.
@@ -113,15 +114,18 @@ export function getGroupedRuntimeDescs(multiServiceManager, kernelId, translator
         displayName: spec.title,
         location: 'remote',
         gpu: spec.resources?.['nvidia.com/gpu'],
-        burningRate: spec.burning_rate
+        burningRate: spec.burning_rate,
     }))
         .filter(filterKernels) ?? []));
-    environments.push(...Object.values(multiServiceManager.browser?.kernelspecs.specs?.kernelspecs ?? {}).filter(spec => !!spec).map(spec => ({
+    environments.push(...Object.values(multiServiceManager.browser?.kernelspecs.specs?.kernelspecs ?? {})
+        .filter(spec => !!spec)
+        .map(spec => ({
         name: spec.name,
         language: spec.language,
         displayName: spec.display_name,
-        location: 'browser'
-    })).filter(filterKernels));
+        location: 'browser',
+    }))
+        .filter(filterKernels));
     if (environments.length) {
         kernels[trans.__(ASSIGN_NEW_RUNTIME_LABEL)] = environments;
     }
@@ -160,7 +164,13 @@ export function getDefaultKernelName(selector) {
     }
     if (matches.length === 1) {
         const specName = matches[0];
-        console.warn('No exact match found for ' + specName + ', using runtime ' + specName + ' that matches ' + 'language=' + language);
+        console.warn('No exact match found for ' +
+            specName +
+            ', using runtime ' +
+            specName +
+            ' that matches ' +
+            'language=' +
+            language);
         return specName;
     }
     // No matches found.

package/lib/components/runtimes/RuntimeVariables.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { useMemo } from 'react';
 import { IconButton, ToggleSwitch, FormControl } from '@primer/react';
-import { Box } from "@datalayer/primer-addons";
+import { Box } from '@datalayer/primer-addons';
 import { Blankslate, DataTable, Table } from '@primer/react/experimental';
 import { nullTranslator } from '@jupyterlab/translation';
 import { checkIcon } from '@jupyterlab/ui-components';
@@ -13,7 +13,7 @@ import { checkIcon } from '@jupyterlab/ui-components';
  * Runtime variables selector component.
  */
 export function RuntimeVariables(props) {
-    const { className, translator, selectedVariables, setSelectVariable, transferVariables, setTransferVariable, kernelVariables } = props;
+    const { className, translator, selectedVariables, setSelectVariable, transferVariables, setTransferVariable, kernelVariables, } = props;
     const trans = useMemo(() => (translator ?? nullTranslator).load('jupyterlab'), [translator]);
     const nRows = Object.keys(kernelVariables ?? {}).length;
     // Sorting and actions does not play nice together :'(
@@ -21,11 +21,11 @@ export function RuntimeVariables(props) {
         {
             header: trans.__('Name'),
             field: 'name',
-            rowHeader: true
+            rowHeader: true,
         },
         {
             header: trans.__('Type'),
-            field: 'type'
+            field: 'type',
         },
         {
             id: 'select',
@@ -63,10 +63,10 @@ export function RuntimeVariables(props) {
                             setSelectVariable([...selectedVariables, row.name]);
                         }
                     } }));
-            }
-        }
+            },
+        },
     ];
-    return (_jsxs(Box, { className: className, sx: { paddingTop: "10px" }, children: [_jsxs(FormControl, { layout: "horizontal", children: [_jsx(FormControl.Label, { children: trans.__('Transfer variables') }), _jsx(ToggleSwitch, { checked: transferVariables, size: "small", onClick: (e) => {
+    return (_jsxs(Box, { className: className, sx: { paddingTop: '10px' }, children: [_jsxs(FormControl, { layout: "horizontal", children: [_jsx(FormControl.Label, { children: trans.__('Transfer variables') }), _jsx(ToggleSwitch, { checked: transferVariables, size: "small", onClick: e => {
                             e.preventDefault();
                             setTransferVariable(!transferVariables);
                         }, "aria-labelledby": "kernel-toggle-variables" })] }), transferVariables && (_jsxs(Table.Container, { sx: { flex: '1 1 auto', marginTop: 3 }, children: [_jsx(Table.Subtitle, { as: "p", id: "dla-kernel-variables-subtitle", children: trans.__('The list of transferable runtime variables.') }), kernelVariables ? (Object.keys(kernelVariables ?? {}).length ? (_jsx(DataTable, { "aria-labelledby": "dla-kernel-variables", "aria-describedby": "dla-kernel-variables-subtitle", data: Object.entries(kernelVariables ?? {})

package/lib/components/screenshot/ScreenCapture.js

@@ -45,7 +45,7 @@ export class ScreenCapture extends Component {
     };
     handStartCapture = () => this.setState({ on: true });
     handleMouseMove = (e) => {
-        const { isMouseDown, windowWidth, windowHeight, startX, startY, borderWidth } = this.state;
+        const { isMouseDown, windowWidth, windowHeight, startX, startY, borderWidth, } = this.state;
         let cropPositionTop = startY;
         let cropPositionLeft = startX;
         const endX = e.clientX;
@@ -63,28 +63,24 @@ export class ScreenCapture extends Component {
         let cropHeigth = 0;
         if (isMouseDown) {
             if (isStartTopLeft) {
-                newBorderWidth = `${startY}px ${windowWidth - endX}px ${windowHeight -
-                    endY}px ${startX}px`;
+                newBorderWidth = `${startY}px ${windowWidth - endX}px ${windowHeight - endY}px ${startX}px`;
                 cropWidth = endX - startX;
                 cropHeigth = endY - startY;
             }
             if (isStartTopRight) {
-                newBorderWidth = `${startY}px ${windowWidth - startX}px ${windowHeight -
-                    endY}px ${endX}px`;
+                newBorderWidth = `${startY}px ${windowWidth - startX}px ${windowHeight - endY}px ${endX}px`;
                 cropWidth = startX - endX;
                 cropHeigth = endY - startY;
                 cropPositionLeft = endX;
             }
             if (isStartBottomLeft) {
-                newBorderWidth = `${endY}px ${windowWidth - endX}px ${windowHeight -
-                    startY}px ${startX}px`;
+                newBorderWidth = `${endY}px ${windowWidth - endX}px ${windowHeight - startY}px ${startX}px`;
                 cropWidth = endX - startX;
                 cropHeigth = startY - endY;
                 cropPositionTop = endY;
             }
             if (isStartBottomRight) {
-                newBorderWidth = `${endY}px ${windowWidth - startX}px ${windowHeight -
-                    startY}px ${endX}px`;
+                newBorderWidth = `${endY}px ${windowWidth - startX}px ${windowHeight - startY}px ${endX}px`;
                 cropWidth = startX - endX;
                 cropHeigth = startY - endY;
                 cropPositionLeft = endX;
@@ -131,7 +127,7 @@ export class ScreenCapture extends Component {
             html2canvas(body, {
                 width: windowWidth,
                 height: windowHeight,
-                scale: scale
+                scale: scale,
             }).then(canvas => {
                 const croppedCanvas = document.createElement('canvas');
                 const croppedCanvasContext = croppedCanvas.getContext('2d');
@@ -156,7 +152,7 @@ export class ScreenCapture extends Component {
     renderChild = () => {
         const { children } = this.props;
         const props = {
-            onStartCapture: this.handStartCapture
+            onStartCapture: this.handStartCapture,
         };
         if (typeof children === 'function') {
             return children(props);
@@ -164,11 +160,11 @@ export class ScreenCapture extends Component {
         return children;
     };
     render() {
-        const { on, crossHairsTop, crossHairsLeft, borderWidth, isMouseDown, } = this.state;
+        const { on, crossHairsTop, crossHairsLeft, borderWidth, isMouseDown } = this.state;
         if (!on) {
             return this.renderChild();
         }
-        return (_jsxs("div", { onMouseMove: this.handleMouseMove, onMouseDown: this.handleMouseDown, onMouseUp: this.handleMouseUp, children: [this.renderChild(), _jsx("div", { className: `overlay ${isMouseDown && 'highlighting'}`, style: { borderWidth: `${borderWidth}` } }), _jsx("div", { className: 'crosshairs', style: { left: crossHairsLeft + 'px', top: crossHairsTop + 'px' } })] }));
+        return (_jsxs("div", { onMouseMove: this.handleMouseMove, onMouseDown: this.handleMouseDown, onMouseUp: this.handleMouseUp, children: [this.renderChild(), _jsx("div", { className: `overlay ${isMouseDown && 'highlighting'}`, style: { borderWidth: `${borderWidth}` } }), _jsx("div", { className: "crosshairs", style: { left: crossHairsLeft + 'px', top: crossHairsTop + 'px' } })] }));
     }
 }
 export default ScreenCapture;

package/lib/components/screenshot/ScreenCaptureButton.d.ts

@@ -1,3 +1,3 @@
-import { PropsWithChildren } from "react";
+import { PropsWithChildren } from 'react';
 export declare const ScreenCaptureButton: (props: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
 export default ScreenCaptureButton;

package/lib/components/screenshot/ScreenCaptureButton.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Link, Tooltip, Button } from "@primer/react";
-import { ScreenFullIcon } from "@primer/octicons-react";
-import { lazyWithPreload, WithSuspense } from "../../utils";
-import { useToast } from "../../hooks";
-import { useLayoutStore } from "../../state";
-const ScreenCapture = WithSuspense(lazyWithPreload(() => import("../screenshot/ScreenCapture")));
+import { Link, Tooltip, Button } from '@primer/react';
+import { ScreenFullIcon } from '@primer/octicons-react';
+import { lazyWithPreload, WithSuspense } from '../../utils';
+import { useToast } from '../../hooks';
+import { useLayoutStore } from '../../state';
+const ScreenCapture = WithSuspense(lazyWithPreload(() => import('../screenshot/ScreenCapture')));
 export const ScreenCaptureButton = (props) => {
     const { enqueueToast } = useToast();
     const { setScreenCapture, hideScreenshot } = useLayoutStore();
@@ -15,7 +15,13 @@ export const ScreenCaptureButton = (props) => {
     };
     return (_jsx(ScreenCapture, { onEndCapture: handleScreenCapture, children: ({ onStartCapture }) => (_jsx(Tooltip, { text: "Take a screen capture", direction: "s", children: _jsx(Button, { variant: "invisible", children: _jsx(Link, { href: "javascript: return false;", sx: {
                         color: 'fg.muted',
-                        ':hover, :focus, &[aria-expanded=true]': { background: 'none !important', color: 'accent.fg' }
-                    }, onClick: e => { e.preventDefault(); onStartCapture(); }, children: _jsx(ScreenFullIcon, {}) }) }) })) }));
+                        ':hover, :focus, &[aria-expanded=true]': {
+                            background: 'none !important',
+                            color: 'accent.fg',
+                        },
+                    }, onClick: e => {
+                        e.preventDefault();
+                        onStartCapture();
+                    }, children: _jsx(ScreenFullIcon, {}) }) }) })) }));
 };
 export default ScreenCaptureButton;

package/lib/components/snapshots/RuntimeSnapshotMenu.js

@@ -3,12 +3,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useState, } from 'react';
 import { CameraIcon } from '@datalayer/icons-react';
-import { ActionList, ActionMenu, Box, Flash, FormControl, Select, Spinner } from '@primer/react';
+import { ActionList, ActionMenu, Box, Flash, FormControl, Select, Spinner, } from '@primer/react';
 import { Dialog } from '@primer/react/experimental';
 import { useToast } from '../../hooks';
-import { createRuntimeSnapshot, getRuntimeSnapshots, loadBrowserRuntimeSnapshot, loadRuntimeSnapshot } from '../../api';
+import { createRuntimeSnapshot, getRuntimeSnapshots, loadBrowserRuntimeSnapshot, loadRuntimeSnapshot, } from '../../api';
 import { useRuntimesStore } from '../../state';
 import { createRuntimeSnapshotName } from '../../utils';
 /**
@@ -16,7 +16,7 @@ import { createRuntimeSnapshotName } from '../../utils';
  */
 export function RuntimeSnapshotMenu(props) {
     const { children, connection, podName, multiServiceManager, disabled } = props;
-    const { addRuntimeSnapshot, runtimesRunUrl, runtimeSnapshots, setRuntimeSnapshots } = useRuntimesStore();
+    const { addRuntimeSnapshot, runtimesRunUrl, runtimeSnapshots, setRuntimeSnapshots, } = useRuntimesStore();
     const { trackAsyncTask } = useToast();
     const [openLoadDialog, setOpenLoadDialog] = useState(false);
     const [loadingKernelSnapshot, setLoadingKernelSnapshot] = useState(false);
@@ -42,7 +42,7 @@ export function RuntimeSnapshotMenu(props) {
     const onKerenelSnapshotChanged = useCallback(event => {
         setSelection(event.target.value);
     }, []);
-    const onLoadKernelSnapshotSubmit = useCallback(async ({ id, connection, podName }) => {
+    const onLoadKernelSnapshotSubmit = useCallback(async ({ id, connection, podName, }) => {
         if (podName) {
             await loadRuntimeSnapshot({ id: podName, from: id });
         }
@@ -63,7 +63,7 @@ export function RuntimeSnapshotMenu(props) {
                     podName,
                     name: snapshotName,
                     description: snapshotName,
-                    stop: false
+                    stop: false,
                 });
                 ref = podName.split('-', 2).reverse()[0];
                 task.then(s => {
@@ -77,7 +77,7 @@ export function RuntimeSnapshotMenu(props) {
                 let isPending = true;
                 task = createRuntimeSnapshot({
                     connection: multiServiceManager.browser.kernels.connectTo({
-                        model
+                        model,
                     }),
                     metadata: { filename: `${snapshotName}.data` },
                     onUploadProgress: () => {
@@ -88,7 +88,7 @@ export function RuntimeSnapshotMenu(props) {
                                 snapshot = snapshots.find(s => s.name === snapshotName);
                             });
                         }
-                    }
+                    },
                 });
             }
             if (task) {
@@ -99,12 +99,12 @@ export function RuntimeSnapshotMenu(props) {
                                 ? `Runtime ${ref} will not be snapshotted as it does not contain any serializable state.`
                                 : `Failed to pause runtime ${ref} - ${reason}`;
                             return msg;
-                        }
+                        },
                     },
                     pending: { message: `Taking a snapshot of runtime ${ref}…` },
                     success: {
-                        message: () => `Runtime ${ref} successfully snapshotted as ${snapshotName}.`
-                    }
+                        message: () => `Runtime ${ref} successfully snapshotted as ${snapshotName}.`,
+                    },
                 });
                 await task;
                 if (snapshot) {
@@ -116,7 +116,9 @@ export function RuntimeSnapshotMenu(props) {
             setTakingSnapshot(false);
         }
     }, [connection, podName, multiServiceManager]);
-    return (_jsxs(_Fragment, { children: [_jsxs(ActionMenu, { children: [_jsx(ActionMenu.Button, { leadingVisual: CameraIcon, variant: "invisible", size: "small", disabled: loadingKernelSnapshot || takingKernelSnapshot || disabled, children: children }), _jsx(ActionMenu.Overlay, { children: _jsxs(ActionList, { children: [_jsx(ActionList.Item, { onSelect: onLoadKernelSnapshot, disabled: loadingKernelSnapshot || runtimeSnapshots.length === 0, children: "Load a runtime snapshot\u2026" }), _jsx(ActionList.Item, { onSelect: onTakeKernelSnapshot, disabled: takingKernelSnapshot, children: "Take a runtime snapshot" })] }) })] }), openLoadDialog && (_jsx(Dialog, { title: "Choose a runtime snapshot to load", onClose: () => { setOpenLoadDialog(false); }, footerButtons: [
+    return (_jsxs(_Fragment, { children: [_jsxs(ActionMenu, { children: [_jsx(ActionMenu.Button, { leadingVisual: CameraIcon, variant: "invisible", size: "small", disabled: loadingKernelSnapshot || takingKernelSnapshot || disabled, children: children }), _jsx(ActionMenu.Overlay, { children: _jsxs(ActionList, { children: [_jsx(ActionList.Item, { onSelect: onLoadKernelSnapshot, disabled: loadingKernelSnapshot || runtimeSnapshots.length === 0, children: "Load a runtime snapshot\u2026" }), _jsx(ActionList.Item, { onSelect: onTakeKernelSnapshot, disabled: takingKernelSnapshot, children: "Take a runtime snapshot" })] }) })] }), openLoadDialog && (_jsx(Dialog, { title: "Choose a runtime snapshot to load", onClose: () => {
+                    setOpenLoadDialog(false);
+                }, footerButtons: [
                     {
                         buttonType: 'default',
                         content: 'Cancel',
@@ -125,11 +127,11 @@ export function RuntimeSnapshotMenu(props) {
                                 event.preventDefault();
                                 setOpenLoadDialog(false);
                             }
-                        }
+                        },
                     },
                     {
                         buttonType: 'primary',
-                        content: loadingKernelSnapshot ? _jsx(Spinner, { size: "small" }) : 'Load',
+                        content: loadingKernelSnapshot ? (_jsx(Spinner, { size: "small" })) : ('Load'),
                         disabled: loadingKernelSnapshot,
                         onClick: async (event) => {
                             if (!event.defaultPrevented) {
@@ -142,7 +144,7 @@ export function RuntimeSnapshotMenu(props) {
                                         await onLoadKernelSnapshotSubmit({
                                             connection,
                                             id: snapshot.id,
-                                            podName
+                                            podName,
                                         });
                                     }
                                     else {
@@ -155,8 +157,8 @@ export function RuntimeSnapshotMenu(props) {
                                 }
                             }
                         },
-                        autoFocus: true
-                    }
+                        autoFocus: true,
+                    },
                 ], children: _jsxs(Box, { as: "form", children: [_jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Snapshot" }), _jsx(Select, { name: "snapshot", value: selection, onChange: onKerenelSnapshotChanged, block: true, children: runtimeSnapshots.map(s => (_jsx(Select.Option, { value: s.id, children: s.name ? `${s.name} (${s.id})` : s.id }, s.id))) })] }), error && _jsx(Flash, { variant: "danger", children: error })] }) }))] }));
 }
 RuntimeSnapshotMenu.defaultProps = {

package/lib/components/snippets/SnippetDialog.js

@@ -6,14 +6,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from 'react';
 import { nullTranslator } from '@jupyterlab/translation';
 import { FormControl, Select, Text } from '@primer/react';
-import { Box } from "@datalayer/primer-addons";
+import { Box } from '@datalayer/primer-addons';
 import { Dialog } from '@primer/react/experimental';
 import { Markdown } from '../display';
 /**
  * Dialog to inject snippet in a cell.
  */
 export function SnippetDialog(props) {
-    const { model, onClose, language, snippets, markdownParser, sanitizer, translator } = props;
+    const { model, onClose, language, snippets, markdownParser, sanitizer, translator, } = props;
     const [selection, setSelection] = useState(snippets[0]);
     const trans = useMemo(() => (translator ?? nullTranslator).load('jupyterlab'), [translator]);
     const onSelectionChange = useCallback((e) => {
@@ -29,14 +29,14 @@ export function SnippetDialog(props) {
             {
                 buttonType: 'default',
                 content: trans.__('Cancel'),
-                onClick: onClose
+                onClick: onClose,
             },
             {
                 buttonType: 'primary',
                 content: trans.__('Inject snippet'),
                 onClick: injectSnippet,
-                autoFocus: true
-            }
+                autoFocus: true,
+            },
         ], children: _jsx(Box, { as: "form", children: _jsxs(FormControl, { children: [_jsx(FormControl.Label, {}), _jsx(Select, { block: true, onChange: onSelectionChange, children: snippets.map((snippet, index) => (_jsx(Select.Option, { value: `${index}`, children: snippet.title }, index))) }), _jsxs(FormControl.Caption, { children: [selection.description && (_jsx(Text, { as: "p", children: selection.description })), markdownParser ? (_jsx(Markdown, { markdownParser: markdownParser, sanitizer: sanitizer, text: `\`\`\`${language}\n${selection.code}\`\`\`` })) : (_jsx("code", { children: selection.code }))] })] }) }) }));
 }
 export default SnippetDialog;

package/lib/components/storage/ContentsBrowser.js

@@ -6,14 +6,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useCallback, useEffect, useState } from 'react';
 import { PathExt } from '@jupyterlab/coreutils';
 import { PromiseDelegate } from '@lumino/coreutils';
-import { ActionList, ActionMenu, Heading, IconButton, Spinner, TreeView } from '@primer/react';
-import { Box } from "@datalayer/primer-addons";
+import { ActionList, ActionMenu, Heading, IconButton, Spinner, TreeView, } from '@primer/react';
+import { Box } from '@datalayer/primer-addons';
 import { Blankslate, Dialog } from '@primer/react/experimental';
 import { CounterClockWiseIcon } from '@datalayer/icons-react';
 import { useIsMounted } from 'usehooks-ts';
 import { useToast } from '../../hooks';
 import { UploadIconButton } from '../buttons';
-import { DirectoryItem, TreeItem, modelToView } from './ContentsItems';
+import { DirectoryItem, TreeItem, modelToView, } from './ContentsItems';
 /**
  * The maximum upload size (in bytes) for notebook version < 5.1.0
  */
@@ -36,7 +36,8 @@ export function ContentsBrowser(props) {
     const [openDeleteConfirmation, setOpenDeleteConfirmation] = useState(false);
     const [copyToLocalConfirmation, setCopyToLocalConfirmation] = useState(false);
     const refresh = useCallback(() => {
-        contents.get('')
+        contents
+            .get('')
             .then(model => {
             setIsLoading(false);
             setChildren(modelToView(model.content, documentRegistry));
@@ -98,10 +99,10 @@ export function ContentsBrowser(props) {
                     const msg = `Failed to upload ${file.name}.`;
                     console.error(msg, reason);
                     return msg;
-                }
+                },
             },
             pending: { message: `Uploading ${file.name}…` },
-            success: { message: () => `${file.name} uploaded.` }
+            success: { message: () => `${file.name} uploaded.` },
         };
         if (chunked) {
             const task = new PromiseDelegate();
@@ -162,11 +163,12 @@ export function ContentsBrowser(props) {
             trackAsyncTask(task, {
                 success: { message: () => `${selectedItem.path} deleted.` },
                 pending: { message: `Deleting ${selectedItem.path}…` },
-                error: { message: reason => {
+                error: {
+                    message: reason => {
                         const msg = `Failed to delete ${selectedItem.path}.`;
                         console.error(msg, reason);
                         return msg;
-                    }
+                    },
                 },
             });
             task.finally(() => {
@@ -180,16 +182,17 @@ export function ContentsBrowser(props) {
     }, []);
     const copyToLocal = useCallback(() => {
         if (selectedItem && localContents) {
-            contents.get(selectedItem.path).then((model) => {
+            contents.get(selectedItem.path).then(model => {
                 const copyTask = localContents?.save(model.path, model);
                 trackAsyncTask(copyTask, {
                     success: { message: () => `${selectedItem.path} copied to local.` },
                     pending: { message: `Copying to local ${selectedItem.path}…` },
-                    error: { message: reason => {
+                    error: {
+                        message: reason => {
                             const msg = `Failed to copy to local ${selectedItem.path}.`;
                             console.error(msg, reason);
                             return msg;
-                        }
+                        },
                     },
                 });
                 copyTask.finally(() => {
@@ -206,50 +209,54 @@ export function ContentsBrowser(props) {
                             fontSize: 'var(--text-title-size-small)',
                             lineHeight: 'var(--text-title-lineHeight-medium)',
                             fontWeight: 'var(--text-title-weight-medium)',
-                            flex: '1 1 auto'
-                        }, children: "Contents Browser" }), _jsxs(Box, { children: [_jsx(IconButton, { variant: "invisible", "aria-label": 'Refresh contents browser.', title: 'Refresh contents browser.', icon: CounterClockWiseIcon, onClick: refresh }), _jsx(UploadIconButton, { label: 'Upload a file', multiple: true, upload: upload })] })] }), isLoading ?
-                _jsx(Box, { sx: {
-                        gridArea: 'content',
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        minHeight: '40px',
-                        height: '100vh'
-                    }, children: _jsx(Spinner, {}) })
-                :
-                    _jsx(Box, { sx: { gridArea: 'content' }, children: children ?
-                            _jsxs(_Fragment, { children: [_jsx(TreeView, { children: children?.map(child => {
-                                            return child.type === 'directory' ?
-                                                _jsx(DirectoryItem, { item: child, contents: contents, current: selectedItem, documentRegistry: documentRegistry, onContextMenu: onContextMenu, onSelect: onSelect }, child.name)
-                                                :
-                                                    _jsx(TreeItem, { item: child, current: selectedItem?.path === child.path, onSelect: item => { onSelect(item, refresh); }, onContextMenu: onContextMenu }, child.name);
-                                        }) }), _jsx(ActionMenu, { anchorRef: contextMenuAnchor ?? undefined, open: contextMenuAnchor?.current !== null, onOpenChange: () => { setContextMenuAnchor(null); }, children: _jsx(ActionMenu.Overlay, { children: _jsxs(ActionList, { children: [_jsx(ActionList.Item, { title: "Delete the active item.", onSelect: onSelectDelete, children: "Delete\u2026" }), localContents &&
-                                                        _jsx(ActionList.Item, { title: "Copy the active item to the local drive.", onSelect: onSelectCopyToLocal, children: "Copy to local drive\u2026" })] }) }) }), openDeleteConfirmation &&
-                                        _jsx(Dialog, { title: "Confirm deletion", onClose: () => { setOpenDeleteConfirmation(false); }, footerButtons: [
-                                                {
-                                                    buttonType: 'default',
-                                                    content: 'Cancel',
-                                                    onClick: () => { setOpenDeleteConfirmation(false); }
-                                                },
-                                                {
-                                                    buttonType: 'danger',
-                                                    content: 'Delete',
-                                                    onClick: () => { deleteItem(); }
-                                                }
-                                            ], children: `Are you sure you want to delete ${selectedItem?.path}?` }), copyToLocalConfirmation &&
-                                        _jsx(Dialog, { title: "Confirm copy to local", onClose: () => { setCopyToLocalConfirmation(false); }, footerButtons: [
-                                                {
-                                                    buttonType: 'default',
-                                                    content: 'Cancel',
-                                                    onClick: () => { setCopyToLocalConfirmation(false); }
-                                                },
-                                                {
-                                                    buttonType: 'danger',
-                                                    content: 'Copy to local',
-                                                    onClick: () => { copyToLocal(); }
-                                                }
-                                            ], children: `Are you sure you want to copy to local ${selectedItem?.path}?` })] })
-                            :
-                                _jsx(Blankslate, { children: _jsx(Blankslate.Heading, { children: "No contents" }) }) })] }));
+                            flex: '1 1 auto',
+                        }, children: "Contents Browser" }), _jsxs(Box, { children: [_jsx(IconButton, { variant: "invisible", "aria-label": 'Refresh contents browser.', title: 'Refresh contents browser.', icon: CounterClockWiseIcon, onClick: refresh }), _jsx(UploadIconButton, { label: 'Upload a file', multiple: true, upload: upload })] })] }), isLoading ? (_jsx(Box, { sx: {
+                    gridArea: 'content',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    minHeight: '40px',
+                    height: '100vh',
+                }, children: _jsx(Spinner, {}) })) : (_jsx(Box, { sx: { gridArea: 'content' }, children: children ? (_jsxs(_Fragment, { children: [_jsx(TreeView, { children: children?.map(child => {
+                                return child.type === 'directory' ? (_jsx(DirectoryItem, { item: child, contents: contents, current: selectedItem, documentRegistry: documentRegistry, onContextMenu: onContextMenu, onSelect: onSelect }, child.name)) : (_jsx(TreeItem, { item: child, current: selectedItem?.path === child.path, onSelect: item => {
+                                        onSelect(item, refresh);
+                                    }, onContextMenu: onContextMenu }, child.name));
+                            }) }), _jsx(ActionMenu, { anchorRef: contextMenuAnchor ?? undefined, open: contextMenuAnchor?.current !== null, onOpenChange: () => {
+                                setContextMenuAnchor(null);
+                            }, children: _jsx(ActionMenu.Overlay, { children: _jsxs(ActionList, { children: [_jsx(ActionList.Item, { title: "Delete the active item.", onSelect: onSelectDelete, children: "Delete\u2026" }), localContents && (_jsx(ActionList.Item, { title: "Copy the active item to the local drive.", onSelect: onSelectCopyToLocal, children: "Copy to local drive\u2026" }))] }) }) }), openDeleteConfirmation && (_jsx(Dialog, { title: "Confirm deletion", onClose: () => {
+                                setOpenDeleteConfirmation(false);
+                            }, footerButtons: [
+                                {
+                                    buttonType: 'default',
+                                    content: 'Cancel',
+                                    onClick: () => {
+                                        setOpenDeleteConfirmation(false);
+                                    },
+                                },
+                                {
+                                    buttonType: 'danger',
+                                    content: 'Delete',
+                                    onClick: () => {
+                                        deleteItem();
+                                    },
+                                },
+                            ], children: `Are you sure you want to delete ${selectedItem?.path}?` })), copyToLocalConfirmation && (_jsx(Dialog, { title: "Confirm copy to local", onClose: () => {
+                                setCopyToLocalConfirmation(false);
+                            }, footerButtons: [
+                                {
+                                    buttonType: 'default',
+                                    content: 'Cancel',
+                                    onClick: () => {
+                                        setCopyToLocalConfirmation(false);
+                                    },
+                                },
+                                {
+                                    buttonType: 'danger',
+                                    content: 'Copy to local',
+                                    onClick: () => {
+                                        copyToLocal();
+                                    },
+                                },
+                            ], children: `Are you sure you want to copy to local ${selectedItem?.path}?` }))] })) : (_jsx(Blankslate, { children: _jsx(Blankslate.Heading, { children: "No contents" }) })) }))] }));
 }
 export default ContentsBrowser;

package/lib/components/storage/ContentsItems.js

@@ -9,7 +9,7 @@ import { FileIcon } from '@primer/octicons-react';
 export function modelToView(models, docRegistry) {
     let items = models.map(model => ({
         ...model,
-        fileType: docRegistry?.getFileTypeForModel(model)
+        fileType: docRegistry?.getFileTypeForModel(model),
     }));
     items = items.filter(model => !model.name.startsWith('.'));
     items.sort((a, b) => {
@@ -33,7 +33,8 @@ export function DirectoryItem(props) {
     const [isLoading, setIsLoading] = useState(false);
     const refresh = useCallback(() => {
         setIsLoading(true);
-        contents.get(item.path)
+        contents
+            .get(item.path)
             .then(model => {
             setIsLoading(false);
             setChildren(modelToView(model.content, documentRegistry));
@@ -47,7 +48,9 @@ export function DirectoryItem(props) {
             refresh();
         }
     }, [children, item, contents]);
-    return (_jsxs(TreeView.Item, { ref: ref, id: `${item.type}-${item.name}`, onExpandedChange: onExpandedChange, onSelect: () => { onSelect(item, refresh); }, current: item.path === current?.path, children: [_jsx(TreeView.LeadingVisual, { children: _jsx(TreeView.DirectoryIcon, {}) }), _jsx("span", { onContextMenu: event => {
+    return (_jsxs(TreeView.Item, { ref: ref, id: `${item.type}-${item.name}`, onExpandedChange: onExpandedChange, onSelect: () => {
+            onSelect(item, refresh);
+        }, current: item.path === current?.path, children: [_jsx(TreeView.LeadingVisual, { children: _jsx(TreeView.DirectoryIcon, {}) }), _jsx("span", { onContextMenu: event => {
                     event.preventDefault();
                     if (current?.path !== item.path) {
                         onSelect(item, refresh);
@@ -58,17 +61,16 @@ export function DirectoryItem(props) {
                     : (children?.length ?? -1) >= 0
                         ? 'done'
                         : 'initial', children: children?.map(child => {
-                    return child.type === 'directory' ?
-                        _jsx(DirectoryItem, { item: child, contents: contents, current: current, documentRegistry: documentRegistry, onContextMenu: onContextMenu, onSelect: onSelect }, child.name)
-                        :
-                            _jsx(TreeItem, { item: child, current: child.path === current?.path, onSelect: item => onSelect(item, refresh), onContextMenu: onContextMenu }, child.name);
+                    return child.type === 'directory' ? (_jsx(DirectoryItem, { item: child, contents: contents, current: current, documentRegistry: documentRegistry, onContextMenu: onContextMenu, onSelect: onSelect }, child.name)) : (_jsx(TreeItem, { item: child, current: child.path === current?.path, onSelect: item => onSelect(item, refresh), onContextMenu: onContextMenu }, child.name));
                 }) })] }));
 }
 export function TreeItem(props) {
     const { item, current, onSelect, onContextMenu } = props;
     const ref = useRef(null);
     const icon = item.fileType?.icon;
-    return (_jsxs(TreeView.Item, { ref: ref, id: `${item.type}-${item.name}`, current: current, onSelect: () => { onSelect(item); }, children: [_jsx(TreeView.LeadingVisual, { children: icon ? _jsx(icon.react, { tag: 'span' }) : _jsx(FileIcon, {}) }), _jsx("span", { onContextMenu: event => {
+    return (_jsxs(TreeView.Item, { ref: ref, id: `${item.type}-${item.name}`, current: current, onSelect: () => {
+            onSelect(item);
+        }, children: [_jsx(TreeView.LeadingVisual, { children: icon ? _jsx(icon.react, { tag: 'span' }) : _jsx(FileIcon, {}) }), _jsx("span", { onContextMenu: event => {
                     event.preventDefault();
                     if (!current) {
                         onSelect(item);

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

@@ -1,4 +1,4 @@
-import { IStudent, IStudentItem } from "../../models";
+import { IStudent, IStudentItem } from '../../models';
 type Props = {
     student?: IStudent;
     studentItem?: IStudentItem;