@jupyter-notebook/notebook-extension 7.0.0-alpha.2 → 7.0.0-alpha.5

package/lib/index.js

@@ -1,15 +1,14 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
-import { DOMUtils } from '@jupyterlab/apputils';
+import { DOMUtils, IToolbarWidgetRegistry } from '@jupyterlab/apputils';
 import { Text, Time } from '@jupyterlab/coreutils';
 import { IDocumentManager } from '@jupyterlab/docmanager';
-import { IMainMenu } from '@jupyterlab/mainmenu';
 import { NotebookPanel, INotebookTracker } from '@jupyterlab/notebook';
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 import { ITranslator } from '@jupyterlab/translation';
 import { INotebookShell } from '@jupyter-notebook/application';
 import { Poll } from '@lumino/polling';
-import { Menu, Widget } from '@lumino/widgets';
+import { Widget } from '@lumino/widgets';
 /**
  * The class for kernel status errors.
  */
@@ -37,14 +36,19 @@ const checkpoints = {
     id: '@jupyter-notebook/notebook-extension:checkpoints',
     autoStart: true,
     requires: [IDocumentManager, ITranslator],
-    optional: [INotebookShell],
-    activate: (app, docManager, translator, notebookShell) => {
+    optional: [INotebookShell, IToolbarWidgetRegistry],
+    activate: (app, docManager, translator, notebookShell, toolbarRegistry) => {
         const { shell } = app;
         const trans = translator.load('notebook');
-        const widget = new Widget();
-        widget.id = DOMUtils.createDomID();
-        widget.addClass('jp-NotebookCheckpoint');
-        app.shell.add(widget, 'top', { rank: 100 });
+        const node = document.createElement('div');
+        if (toolbarRegistry) {
+            toolbarRegistry.addFactory('TopBar', 'checkpoint', toolbar => {
+                const widget = new Widget({ node });
+                widget.id = DOMUtils.createDomID();
+                widget.addClass('jp-NotebookCheckpoint');
+                return widget;
+            });
+        }
         const onChange = async () => {
             const current = shell.currentWidget;
             if (!current) {
@@ -58,7 +62,7 @@ const checkpoints = {
                 return;
             }
             const checkpoint = checkpoints[checkpoints.length - 1];
-            widget.node.textContent = trans.__('Last Checkpoint: %1', Time.formatHuman(new Date(checkpoint.last_modified)));
+            node.textContent = trans.__('Last Checkpoint: %1', Time.formatHuman(new Date(checkpoint.last_modified)));
         };
         if (notebookShell) {
             notebookShell.currentChanged.connect(onChange);
@@ -81,15 +85,14 @@ const kernelLogo = {
     id: '@jupyter-notebook/notebook-extension:kernel-logo',
     autoStart: true,
     requires: [INotebookShell],
-    activate: (app, shell) => {
+    optional: [IToolbarWidgetRegistry],
+    activate: (app, shell, toolbarRegistry) => {
         const { serviceManager } = app;
-        let widget;
+        const node = document.createElement('div');
+        const img = document.createElement('img');
+        node.appendChild(img);
         const onChange = async () => {
             var _a, _b, _c, _d, _e;
-            if (widget) {
-                widget.dispose();
-                widget.parent = null;
-            }
             const current = shell.currentWidget;
             if (!(current instanceof NotebookPanel)) {
                 return;
@@ -106,15 +109,16 @@ const kernelLogo = {
             if (!kernelIconUrl) {
                 return;
             }
-            const node = document.createElement('div');
-            const img = document.createElement('img');
             img.src = kernelIconUrl;
             img.title = spec.display_name;
-            node.appendChild(img);
-            widget = new Widget({ node });
-            widget.addClass('jp-NotebookKernelLogo');
-            app.shell.add(widget, 'top', { rank: 10010 });
         };
+        if (toolbarRegistry) {
+            toolbarRegistry.addFactory('TopBar', 'kernelLogo', toolbar => {
+                const widget = new Widget({ node });
+                widget.addClass('jp-NotebookKernelLogo');
+                return widget;
+            });
+        }
         app.started.then(() => {
             shell.currentChanged.connect(onChange);
         });
@@ -173,36 +177,6 @@ const kernelStatus = {
         shell.currentChanged.connect(onChange);
     }
 };
-/**
- * A plugin to customize notebook related menu entries
- * TODO: switch to settings define menus when fixed upstream: https://github.com/jupyterlab/jupyterlab/issues/11754
- */
-const menuPlugin = {
-    id: '@jupyter-notebook/notebook-extension:menu-plugin',
-    autoStart: true,
-    requires: [IMainMenu, ITranslator],
-    activate: (app, mainMenu, translator) => {
-        const { commands } = app;
-        const trans = translator.load('notebook');
-        const cellTypeSubmenu = new Menu({ commands });
-        cellTypeSubmenu.title.label = trans._p('menu', 'Cell Type');
-        [
-            'notebook:change-cell-to-code',
-            'notebook:change-cell-to-markdown',
-            'notebook:change-cell-to-raw'
-        ].forEach(command => {
-            cellTypeSubmenu.addItem({
-                command
-            });
-        });
-        mainMenu.runMenu.addItem({ type: 'separator', rank: 1000 });
-        mainMenu.runMenu.addItem({
-            type: 'submenu',
-            submenu: cellTypeSubmenu,
-            rank: 1010
-        });
-    }
-};
 /**
  * A plugin to enable scrolling for outputs by default.
  * Mimic the logic from the classic notebook, as found here:
@@ -288,7 +262,6 @@ const plugins = [
     checkpoints,
     kernelLogo,
     kernelStatus,
-    menuPlugin,
     scrollOutput
 ];
 export default plugins;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupyter-notebook/notebook-extension",
-  "version": "7.0.0-alpha.2",
+  "version": "7.0.0-alpha.5",
   "description": "Jupyter Notebook - Notebook Extension",
   "homepage": "https://github.com/jupyter/notebook",
   "bugs": {
@@ -39,20 +39,20 @@
     "watch": "tsc -b --watch"
   },
   "dependencies": {
-    "@jupyter-notebook/application": "^7.0.0-alpha.2",
-    "@jupyterlab/application": "^4.0.0-alpha.7",
-    "@jupyterlab/apputils": "^4.0.0-alpha.7",
-    "@jupyterlab/cells": "^4.0.0-alpha.7",
-    "@jupyterlab/docmanager": "^4.0.0-alpha.7",
-    "@jupyterlab/notebook": "^4.0.0-alpha.7",
-    "@jupyterlab/settingregistry": "^4.0.0-alpha.7",
-    "@jupyterlab/translation": "^4.0.0-alpha.7",
+    "@jupyter-notebook/application": "^7.0.0-alpha.5",
+    "@jupyterlab/application": "^4.0.0-alpha.10",
+    "@jupyterlab/apputils": "^4.0.0-alpha.10",
+    "@jupyterlab/cells": "^4.0.0-alpha.10",
+    "@jupyterlab/docmanager": "^4.0.0-alpha.10",
+    "@jupyterlab/notebook": "^4.0.0-alpha.10",
+    "@jupyterlab/settingregistry": "^4.0.0-alpha.10",
+    "@jupyterlab/translation": "^4.0.0-alpha.10",
     "@lumino/polling": "^1.10.0",
-    "@lumino/widgets": "^1.31.1"
+    "@lumino/widgets": "^1.32.0"
   },
   "devDependencies": {
     "rimraf": "~3.0.0",
-    "typescript": "~4.1.3"
+    "typescript": "~4.6.3"
   },
   "publishConfig": {
     "access": "public"

package/schema/checkpoints.json

@@ -0,0 +1,10 @@
+{
+  "title": "Notebook checkpoint indicator",
+  "description": "Notebook checkpoint indicator",
+  "jupyter.lab.toolbars": {
+    "TopBar": [{ "name": "checkpoint", "rank": 20 }]
+  },
+  "properties": {},
+  "additionalProperties": false,
+  "type": "object"
+}

package/schema/kernel-logo.json

@@ -0,0 +1,10 @@
+{
+  "title": "Kernel logo",
+  "description": "Kernel logo in the top area",
+  "jupyter.lab.toolbars": {
+    "TopBar": [{ "name": "kernelLogo", "rank": 110 }]
+  },
+  "properties": {},
+  "additionalProperties": false,
+  "type": "object"
+}

package/style/base.css

@@ -29,6 +29,23 @@ body[data-notebook='notebooks'] .jp-Notebook > *:first-child {
   margin-top: var(--jp-notebook-toolbar-margin-bottom);
 }
 
+body[data-notebook='notebooks'] .jp-Notebook > *:first-child:not(:last-child) {
+  box-shadow: 0px 0px 12px 1px rgb(87 87 87 / 20%);
+}
+
+body[data-notebook='notebooks']
+  .jp-Notebook
+  > *:first-child:last-child::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  box-shadow: 0px 0px 12px 1px rgb(87 87 87 / 20%);
+  margin-bottom: -11px;
+}
+
 body[data-notebook='notebooks'] .jp-Notebook {
   padding-top: unset;
   padding-bottom: unset;
@@ -43,6 +60,49 @@ body[data-notebook='notebooks'] .jp-Notebook {
 
 body[data-notebook='notebooks'] .jp-Notebook.jp-mod-scrollPastEnd::after {
   background: var(--jp-layout-color0);
+  min-height: var(--jp-notebook-padding);
+  box-shadow: 0px 0px 12px 1px rgb(87 87 87 / 20%);
+}
+
+body[data-notebook='notebooks']
+  .jp-Notebook
+  .jp-Notebook-cell:not(:first-child)::after,
+body[data-notebook='notebooks']
+  .jp-Notebook
+  .jp-Notebook-cell:not(:first-child)::before {
+  content: ' ';
+  height: 100%;
+  position: absolute;
+  top: 0;
+  width: 11px;
+}
+
+body[data-notebook='notebooks']
+  .jp-Notebook
+  .jp-Notebook-cell:not(:first-child)::before {
+  box-shadow: -11px 0 11px -11px rgb(87 87 87 / 20%) inset;
+  left: -11px;
+}
+
+body[data-notebook='notebooks']
+  .jp-Notebook
+  .jp-Notebook-cell:not(:first-child)::after {
+  box-shadow: 12px 0 11px -11px rgb(87 87 87 / 20%) inset;
+  right: -11px;
+}
+
+/* Cell toolbar adjustements */
+
+body[data-notebook='notebooks'] .jp-cell-toolbar {
+  background: unset;
+  top: unset;
+  box-shadow: unset;
+}
+
+@media only screen and (max-width: 760px) {
+  body[data-notebook='notebooks'] .jp-cell-toolbar {
+    top: 5px;
+  }
 }
 
 /* ---- */