jupyter-specta 0.3.4 → 0.4.0

package/README.md

@@ -52,6 +52,8 @@ jupyter lite build
 
 Then serve the contents of the output directory (by default `./_output`) using any static file server. You can access the `Specta` app at the `/specta/` path.
 
+If you want to disable specta loading spinner, you can set the environment variable `SPECTA_NO_LOADING_SCREEN` to `1`before calling jupyterlite build command
+
 ## Specta Configuration
 
 ### Available layouts

package/lib/components/icon/gear.js

@@ -12,6 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 export const GearIcon = (_a) => {
     var props = __rest(_a, []);
-    return (React.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px" }, props),
-        React.createElement("path", { d: "m370-80-16-128q-13-5-24.5-12T307-235l-119 50L78-375l103-78q-1-7-1-13.5v-27q0-6.5 1-13.5L78-585l110-190 119 50q11-8 23-15t24-12l16-128h220l16 128q13 5 24.5 12t22.5 15l119-50 110 190-103 78q1 7 1 13.5v27q0 6.5-2 13.5l103 78-110 190-118-50q-11 8-23 15t-24 12L590-80H370Zm70-80h79l14-106q31-8 57.5-23.5T639-327l99 41 39-68-86-65q5-14 7-29.5t2-31.5q0-16-2-31.5t-7-29.5l86-65-39-68-99 42q-22-23-48.5-38.5T533-694l-13-106h-79l-14 106q-31 8-57.5 23.5T321-633l-99-41-39 68 86 64q-5 15-7 30t-2 32q0 16 2 31t7 30l-86 65 39 68 99-42q22 23 48.5 38.5T427-266l13 106Zm42-180q58 0 99-41t41-99q0-58-41-99t-99-41q-59 0-99.5 41T342-480q0 58 40.5 99t99.5 41Zm-2-140Z" })));
+    return (React.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, props),
+        React.createElement("path", { d: "M4 5h16" }),
+        React.createElement("path", { d: "M4 12h16" }),
+        React.createElement("path", { d: "M4 19h16" })));
 };

package/lib/document/factory.js

@@ -34,7 +34,7 @@ export class NotebookGridWidgetFactory extends ABCWidgetFactory {
                 else {
                     // Specta app, add topbar to layout
                     topbar.id = 'specta-topbar-widget';
-                    this._shell.add(topbar, 'top');
+                    this._shell.add(topbar, 'top', { rank: 100 });
                 }
             }
             else if (isSpecta) {

package/lib/document/plugin.d.ts

@@ -1,5 +1,6 @@
 import { ILabShell, JupyterFrontEndPlugin } from '@jupyterlab/application';
 import { IWidgetTracker } from '@jupyterlab/apputils';
-import { ISpectaShell } from '../token';
+import { ISpectaShell, ISpectaUrlFactory } from '../token';
 export declare const spectaDocument: JupyterFrontEndPlugin<IWidgetTracker, ISpectaShell>;
+export declare const spectaUrlFactory: JupyterFrontEndPlugin<ISpectaUrlFactory>;
 export declare const spectaOpener: JupyterFrontEndPlugin<void, ILabShell>;

package/lib/document/plugin.js

@@ -1,13 +1,13 @@
 import { IThemeManager, WidgetTracker } from '@jupyterlab/apputils';
 import { IEditorServices } from '@jupyterlab/codeeditor';
-import { PathExt } from '@jupyterlab/coreutils';
+import { PageConfig, PathExt, URLExt } from '@jupyterlab/coreutils';
 import { IDocumentManager } from '@jupyterlab/docmanager';
 import { IDefaultFileBrowser } from '@jupyterlab/filebrowser';
 import { INotebookTracker, NotebookPanel } from '@jupyterlab/notebook';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { IKernelSpecManager } from '@jupyterlab/services';
 import { Widget } from '@lumino/widgets';
-import { ISpectaDocTracker, ISpectaLayoutRegistry } from '../token';
+import { ISpectaDocTracker, ISpectaLayoutRegistry, ISpectaUrlFactoryToken } from '../token';
 import { configLabLayout, createFileBrowser, hideAppLoadingIndicator, isSpectaApp, readSpectaConfig, registerDocumentFactory } from '../tool';
 const activate = (app, rendermime, tracker, editorServices, contentFactory, spectaLayoutRegistry, themeManager) => {
     const namespace = 'specta';
@@ -39,6 +39,29 @@ export const spectaDocument = {
     activate,
     provides: ISpectaDocTracker
 };
+export const spectaUrlFactory = {
+    id: 'specta/application-extension:urlFactory',
+    autoStart: true,
+    provides: ISpectaUrlFactoryToken,
+    activate() {
+        const urlFactory = (path) => {
+            const baseUrl = PageConfig.getBaseUrl();
+            let appUrl = PageConfig.getOption('appUrl');
+            if (!appUrl.endsWith('/')) {
+                appUrl = `${appUrl}/`;
+            }
+            const url = new URL(URLExt.join(baseUrl, appUrl));
+            url.searchParams.set('path', path);
+            const queries = PageConfig.getOption('query').split('&').filter(Boolean);
+            queries.forEach(query => {
+                const [key, value] = query.split('=');
+                url.searchParams.set(key, value);
+            });
+            return url.toString();
+        };
+        return urlFactory;
+    }
+};
 export const spectaOpener = {
     id: 'specta/application-extension:opener',
     autoStart: true,
@@ -48,14 +71,13 @@ export const spectaOpener = {
         ISpectaDocTracker,
         IKernelSpecManager
     ],
-    activate: async (app, docManager, defaultBrowser) => {
+    optional: [ISpectaUrlFactoryToken],
+    activate: async (app, docManager, defaultBrowser, tracker, kernelSpecManager, urlFactory) => {
         const urlParams = new URLSearchParams(window.location.search);
-        const path = urlParams.get('path');
         if (!isSpectaApp()) {
+            // Not a specta app
+            const path = urlParams.get('specta-path');
             if (!path) {
-                app.restored.then(async () => {
-                    await app.commands.execute('application:reset-layout');
-                });
                 return;
             }
             app.restored.then(async () => {
@@ -74,12 +96,13 @@ export const spectaOpener = {
                     }
                 }
             });
-            // Not a specta app
             return;
         }
         else {
+            //  Specta app
+            const path = urlParams.get('path');
             if (!path) {
-                const browser = createFileBrowser({ defaultBrowser });
+                const browser = createFileBrowser({ defaultBrowser, urlFactory });
                 app.shell.add(browser, 'main', { rank: 100 });
                 hideAppLoadingIndicator();
             }

package/lib/extension_plugins.d.ts

@@ -1,4 +1,4 @@
 export * from './tool';
 export * from './token';
-declare const _default: (import("@jupyterlab/application").JupyterFrontEndPlugin<import("@jupyterlab/apputils").IWidgetTracker<import("@lumino/widgets").Widget>, import("./token").ISpectaShell> | import("@jupyterlab/application").JupyterFrontEndPlugin<void, import("@jupyterlab/application").ILabShell> | import("@jupyterlab/application").JupyterFrontEndPlugin<import("./token").ISpectaLayoutRegistry> | import("@jupyterlab/application").JupyterFrontEndPlugin<void, import("./token").ISpectaShell>)[];
+declare const _default: (import("@jupyterlab/application").JupyterFrontEndPlugin<import("@jupyterlab/apputils").IWidgetTracker<import("@lumino/widgets").Widget>, import("./token").ISpectaShell> | import("@jupyterlab/application").JupyterFrontEndPlugin<import("./token").ISpectaUrlFactory> | import("@jupyterlab/application").JupyterFrontEndPlugin<void, import("@jupyterlab/application").ILabShell> | import("@jupyterlab/application").JupyterFrontEndPlugin<import("./token").ISpectaLayoutRegistry> | import("@jupyterlab/application").JupyterFrontEndPlugin<void, import("./token").ISpectaShell>)[];
 export default _default;

package/lib/extension_plugins.js

@@ -1,4 +1,4 @@
-import { spectaDocument, spectaOpener } from './document/plugin';
+import { spectaDocument, spectaOpener, spectaUrlFactory } from './document/plugin';
 import { spectaLayoutRegistry } from './layout';
 import { appMeta, cellMeta } from './metadata';
 import { topbarPlugin } from './topbar';
@@ -10,5 +10,6 @@ export default [
     spectaLayoutRegistry,
     topbarPlugin,
     appMeta,
-    cellMeta
+    cellMeta,
+    spectaUrlFactory
 ];

package/lib/token.d.ts

@@ -64,5 +64,7 @@ export interface ISpectaCellConfig {
     showOutput?: boolean;
     outputSize?: 'Small' | 'Big' | 'Full';
 }
+export type ISpectaUrlFactory = (path: string) => string;
 export declare const ISpectaLayoutRegistry: Token<ISpectaLayoutRegistry>;
 export declare const ISpectaDocTracker: Token<IWidgetTracker<Widget>>;
+export declare const ISpectaUrlFactoryToken: Token<ISpectaUrlFactory>;

package/lib/token.js

@@ -1,3 +1,4 @@
 import { Token } from '@lumino/coreutils';
 export const ISpectaLayoutRegistry = new Token('specta:ISpectaLayoutRegistry');
 export const ISpectaDocTracker = new Token('exampleDocTracker');
+export const ISpectaUrlFactoryToken = new Token('specta:ISpectaUrlFactoryToken');

package/lib/tool.d.ts

@@ -6,7 +6,7 @@ import { ICell, INotebookMetadata } from '@jupyterlab/nbformat';
 import { INotebookTracker, NotebookPanel } from '@jupyterlab/notebook';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { CommandRegistry } from '@lumino/commands';
-import { ISpectaAppConfig, ISpectaCellConfig, ISpectaLayoutRegistry, ISpectaShell } from './token';
+import { ISpectaAppConfig, ISpectaCellConfig, ISpectaLayoutRegistry, ISpectaShell, ISpectaUrlFactory } from './token';
 export declare function registerDocumentFactory(options: {
     factoryName: string;
     app: JupyterFrontEnd<ISpectaShell>;
@@ -20,6 +20,7 @@ export declare function registerDocumentFactory(options: {
 }): void;
 export declare function createFileBrowser(options: {
     defaultBrowser: IDefaultFileBrowser;
+    urlFactory: ISpectaUrlFactory | null;
 }): any;
 export declare function hideAppLoadingIndicator(): void;
 export declare function mergeObjects(...objects: Record<string, any>[]): Record<string, any>;

package/lib/tool.js

@@ -42,27 +42,31 @@ export function registerDocumentFactory(options) {
     });
 }
 export function createFileBrowser(options) {
-    const { defaultBrowser } = options;
+    const { defaultBrowser, urlFactory } = options;
     const browser = defaultBrowser;
     browser.singleClickNavigation = true;
     browser.showFileCheckboxes = false;
     browser.showLastModifiedColumn = false;
     browser.addClass('specta-file-browser');
-    const urlFactory = (path) => {
-        const baseUrl = PageConfig.getBaseUrl();
-        let appUrl = PageConfig.getOption('appUrl');
-        if (!appUrl.endsWith('/')) {
-            appUrl = `${appUrl}/`;
-        }
-        const url = new URL(URLExt.join(baseUrl, appUrl));
-        url.searchParams.set('path', path);
-        const queries = PageConfig.getOption('query').split('&').filter(Boolean);
-        queries.forEach(query => {
-            const [key, value] = query.split('=');
-            url.searchParams.set(key, value);
-        });
-        return url.toString();
-    };
+    const urlFactoryFn = urlFactory
+        ? urlFactory
+        : (path) => {
+            const baseUrl = PageConfig.getBaseUrl();
+            let appUrl = PageConfig.getOption('appUrl');
+            if (!appUrl.endsWith('/')) {
+                appUrl = `${appUrl}/`;
+            }
+            const url = new URL(URLExt.join(baseUrl, appUrl));
+            url.searchParams.set('path', path);
+            const queries = PageConfig.getOption('query')
+                .split('&')
+                .filter(Boolean);
+            queries.forEach(query => {
+                const [key, value] = query.split('=');
+                url.searchParams.set(key, value);
+            });
+            return url.toString();
+        };
     const oldHandler = browser.listing.handleOpen.bind(browser.listing);
     browser.listing.handleOpen = (item) => {
         if (item.type === 'directory') {
@@ -70,7 +74,7 @@ export function createFileBrowser(options) {
             return;
         }
         else {
-            window.open(urlFactory(item.path), '_blank');
+            window.open(urlFactoryFn(item.path), '_blank');
         }
     };
     return browser;
@@ -107,7 +111,7 @@ export function isSpectaApp() {
     return !!document.querySelector('meta[name="specta-config"]');
 }
 export function readSpectaConfig({ nbMetadata, nbPath }) {
-    var _a;
+    var _a, _b;
     let rawConfig = PageConfig.getOption('spectaConfig');
     if (!rawConfig || rawConfig.length === 0) {
         rawConfig = '{}';
@@ -117,10 +121,12 @@ export function readSpectaConfig({ nbMetadata, nbPath }) {
     if (paths && paths.length > 1) {
         pathWithoutDrive = paths[1];
     }
-    const _b = JSON.parse(rawConfig), { perFileConfig } = _b, globalConfig = __rest(_b, ["perFileConfig"]);
+    const _c = JSON.parse(rawConfig), { perFileConfig } = _c, globalConfig = __rest(_c, ["perFileConfig"]);
     let spectaConfig = Object.assign({}, (globalConfig !== null && globalConfig !== void 0 ? globalConfig : {}));
+    let fileConfig = {};
     if (perFileConfig && pathWithoutDrive && perFileConfig[pathWithoutDrive]) {
-        spectaConfig = Object.assign(Object.assign({}, spectaConfig), perFileConfig[pathWithoutDrive]);
+        fileConfig = perFileConfig[pathWithoutDrive];
+        spectaConfig = Object.assign(Object.assign({}, spectaConfig), fileConfig);
     }
     const spectaMetadata = JSON.parse(JSON.stringify((_a = nbMetadata === null || nbMetadata === void 0 ? void 0 : nbMetadata.specta) !== null && _a !== void 0 ? _a : {}));
     if (spectaMetadata.hideTopbar === 'Yes') {
@@ -132,11 +138,29 @@ export function readSpectaConfig({ nbMetadata, nbPath }) {
     else {
         if (spectaConfig.hideTopbar === null ||
             spectaConfig.hideTopbar === undefined) {
-            // Hide topbar by default if not specified in the global config
+            // Show topbar by default if not specified in the global config
             // and notebook metadata
-            spectaMetadata.hideTopbar = true;
+            spectaMetadata.hideTopbar = false;
+        }
+    }
+    if (!spectaMetadata.hideTopbar) {
+        spectaMetadata.topBar = {};
+        if (spectaMetadata.topbarTitle && spectaMetadata.topbarTitle !== '') {
+            spectaMetadata.topBar.title = spectaMetadata.topbarTitle;
+            delete spectaMetadata.topbarTitle;
+        }
+        else if (!((_b = fileConfig === null || fileConfig === void 0 ? void 0 : fileConfig.topBar) === null || _b === void 0 ? void 0 : _b.title)) {
+            spectaMetadata.topBar.title = pathWithoutDrive;
+        }
+        if (spectaMetadata.topbarThemeToggle === 'No') {
+            spectaMetadata.topBar.themeToggle = false;
+        }
+        else {
+            spectaMetadata.topBar.themeToggle = true;
         }
+        delete spectaMetadata.topbarThemeToggle;
     }
+    // merge spectaConfig and spectaMetadata (spectaMetadata has higher priority
     return mergeObjects(spectaConfig, spectaMetadata);
 }
 export function readCellConfig(cell) {

package/lib/topbar/widget.js

@@ -7,7 +7,7 @@ export function TopbarElement(props) {
     const config = React.useMemo(() => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         return {
-            background: (_b = (_a = props.config) === null || _a === void 0 ? void 0 : _a.background) !== null && _b !== void 0 ? _b : 'var(--jp-layout-color2)',
+            background: (_b = (_a = props.config) === null || _a === void 0 ? void 0 : _a.background) !== null && _b !== void 0 ? _b : 'var(--jp-layout-color1)',
             title: (_d = (_c = props.config) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : 'Specta',
             themeToggle: Boolean((_e = props.config) === null || _e === void 0 ? void 0 : _e.themeToggle),
             kernelActivity: Boolean((_f = props.config) === null || _f === void 0 ? void 0 : _f.kernelActivity),
@@ -30,7 +30,7 @@ export function TopbarElement(props) {
         document.addEventListener('mousedown', handleClickOutside);
         return () => document.removeEventListener('mousedown', handleClickOutside);
     }, []);
-    return (React.createElement("div", { className: "specta-topbar", style: { background: (_a = config.background) !== null && _a !== void 0 ? _a : 'var(--jp-layout-color2)' } },
+    return (React.createElement("div", { className: "specta-topbar", style: { background: (_a = config.background) !== null && _a !== void 0 ? _a : 'var(--jp-layout-color1)' } },
         React.createElement("div", { className: "specta-topbar-left" },
             React.createElement("div", { className: "specta-topbar-icon-container" }, config.icon && React.createElement("img", { style: { height: '100%' }, src: config.icon })),
             React.createElement("div", { className: "specta-topbar-title", style: { color: (_b = config.textColor) !== null && _b !== void 0 ? _b : 'var(--jp-ui-font-color1)' } }, config.title)),

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "jupyter-specta",
-    "version": "0.3.4",
+    "version": "0.4.0",
     "description": "",
     "keywords": [],
     "homepage": "https://github.com/trungleduc/specta",
@@ -78,7 +78,7 @@
         "@jupyterlab/outputarea": "^4.5.0",
         "@jupyterlab/rendermime": "^4.5.0",
         "@jupyterlab/rendermime-extension": "^4.5.0",
-        "@jupyterlab/services": "^7.2.4",
+        "@jupyterlab/services": "^7.5.1",
         "@jupyterlab/services-extension": "^4.5.0",
         "@jupyterlab/settingeditor-extension": "^4.5.0",
         "@jupyterlab/settingregistry": "^4.5.0",

package/schema/app-meta.json

@@ -9,6 +9,17 @@
       "metadataSchema": {
         "type": "object",
         "properties": {
+          "/specta/topbarTitle": {
+            "title": "Top Bar Title",
+            "type": "string",
+            "default": ""
+          },
+          "/specta/topbarThemeToggle": {
+            "title": "Top Bar Theme Toggle",
+            "type": "string",
+            "enum": ["Yes", "No"],
+            "default": "Yes"
+          },
           "/specta/defaultLayout": {
             "title": "Page layout",
             "type": "string",
@@ -55,6 +66,14 @@
         "/specta/slidesTheme": {
           "metadataLevel": "notebook",
           "writeDefault": false
+        },
+        "/specta/topbarTitle": {
+          "metadataLevel": "notebook",
+          "writeDefault": false
+        },
+        "/specta/topbarThemeToggle": {
+          "metadataLevel": "notebook",
+          "writeDefault": false
         }
       }
     }

package/style/base.css

@@ -69,11 +69,13 @@
 }
 
 #specta-top-panel {
-  min-height: 36px;
+  min-height: 28px;
   display: flex;
   box-shadow: unset !important;
   z-index: 100;
   contain: unset !important;
+  border-bottom: var(--jp-border-width) solid var(--jp-border-color0);
+  background: var(--jp-layout-color1);
 }
 
 .specta-topbar-element {
@@ -84,7 +86,7 @@
 .specta-topbar {
   display: flex;
   flex-direction: row;
-  height: 36px;
+  height: 28px;
   width: calc(100% + 20px);
   border-bottom: solid 0.5px var(--jp-border-color1);
   gap: 10px;
@@ -128,7 +130,9 @@
   border-radius: 50% !important;
   transition: background 0.2s ease;
   background: transparent;
+  padding: 0 !important;
 }
+
 .specta-icon-button:hover {
   background-color: var('--jp-layout-color3');
 }

package/style/style.css

@@ -6,6 +6,7 @@
 
 .specta-document-viewer #jp-main-content-panel jp-toolbar:first-of-type {
   display: none;
+  height: 0px !important;
 }
 
 .specta-file-browser {
@@ -28,6 +29,6 @@
 }
 
 .specta-main-content-panel {
-  padding-left: 5px;
-  padding-right: 5px;
+  padding-left: 0px;
+  padding-right: 0px;
 }