@jupyter-notebook/application 7.0.0-alpha.9 → 7.0.0-beta.0

package/lib/app.js

@@ -1,6 +1,6 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
-import { JupyterFrontEnd } from '@jupyterlab/application';
+import { JupyterFrontEnd, } from '@jupyterlab/application';
 import { Base64ModelFactory } from '@jupyterlab/docregistry';
 import { createRendermimePlugins } from '@jupyterlab/application/lib/mimerenderers';
 import { LabStatus } from '@jupyterlab/application/lib/status';
@@ -65,7 +65,7 @@ export class NotebookApp extends JupyterFrontEnd {
                 hubHost: PageConfig.getOption('hubHost') || undefined,
                 hubPrefix: PageConfig.getOption('hubPrefix') || undefined,
                 hubUser: PageConfig.getOption('hubUser') || undefined,
-                hubServerName: PageConfig.getOption('hubServerName') || undefined
+                hubServerName: PageConfig.getOption('hubServerName') || undefined,
             },
             directories: {
                 appSettings: PageConfig.getOption('appSettingsDir'),
@@ -75,8 +75,8 @@ export class NotebookApp extends JupyterFrontEnd {
                 themes: PageConfig.getOption('themesDir'),
                 userSettings: PageConfig.getOption('userSettingsDir'),
                 serverRoot: PageConfig.getOption('serverRoot'),
-                workspaces: PageConfig.getOption('workspacesDir')
-            }
+                workspaces: PageConfig.getOption('workspacesDir'),
+            },
         };
     }
     /**
@@ -104,7 +104,7 @@ export class NotebookApp extends JupyterFrontEnd {
         if (!Array.isArray(data)) {
             data = [data];
         }
-        data.forEach(item => {
+        data.forEach((item) => {
             try {
                 this.registerPlugin(item);
             }
@@ -119,7 +119,7 @@ export class NotebookApp extends JupyterFrontEnd {
      * @param mods - The plugin modules to register.
      */
     registerPluginModules(mods) {
-        mods.forEach(mod => {
+        mods.forEach((mod) => {
             this.registerPluginModule(mod);
         });
     }

package/lib/panelhandler.d.ts

@@ -18,7 +18,7 @@ export declare class PanelHandler {
      */
     addWidget(widget: Widget, rank: number): void;
     /**
-     * A message hook for child add/remove messages on the main area dock panel.
+     * A message hook for child remove messages on the panel handler.
      */
     private _panelChildHook;
     protected _items: Private.IRankItem[];
@@ -60,6 +60,10 @@ export declare class SidePanelHandler extends PanelHandler {
      * Signal fired when a widget is removed from the panel
      */
     get widgetRemoved(): ISignal<SidePanelHandler, Widget>;
+    /**
+     * Get the close button element.
+     */
+    get closeButton(): HTMLButtonElement;
     /**
      * Expand the sidebar.
      *
@@ -118,6 +122,7 @@ export declare class SidePanelHandler extends PanelHandler {
     private _widgetPanel;
     private _currentWidget;
     private _lastCurrentWidget;
+    private _closeButton;
     private _widgetAdded;
     private _widgetRemoved;
 }
@@ -154,7 +159,7 @@ export declare class SidePanelPalette {
     _commandPalette: ICommandPalette;
     _items: SidePanelPaletteItem[];
 }
-declare type SidePanelPaletteItem = {
+type SidePanelPaletteItem = {
     /**
      * The ID of the widget associated to the command palette.
      */
@@ -171,7 +176,7 @@ declare type SidePanelPaletteItem = {
 /**
  * An interface for the options to include in SideBarPalette constructor.
  */
-declare type SidePanelPaletteOption = {
+type SidePanelPaletteOption = {
     /**
      * The commands palette.
      */

package/lib/panelhandler.js

@@ -11,26 +11,14 @@ import { Panel, StackedPanel, Widget } from '@lumino/widgets';
 export class PanelHandler {
     constructor() {
         /**
-         * A message hook for child add/remove messages on the main area dock panel.
+         * A message hook for child remove messages on the panel handler.
          */
         this._panelChildHook = (handler, msg) => {
             switch (msg.type) {
-                case 'child-added':
-                    {
-                        const widget = msg.child;
-                        // If we already know about this widget, we're done
-                        if (this._items.find(v => v.widget === widget)) {
-                            break;
-                        }
-                        // Otherwise, add to the end by default
-                        const rank = this._items[this._items.length - 1].rank;
-                        this._items.push({ widget, rank });
-                    }
-                    break;
                 case 'child-removed':
                     {
                         const widget = msg.child;
-                        ArrayExt.removeFirstWhere(this._items, v => v.widget === widget);
+                        ArrayExt.removeFirstWhere(this._items, (v) => v.widget === widget);
                     }
                     break;
                 default:
@@ -79,18 +67,19 @@ export class SidePanelHandler extends PanelHandler {
         this._lastCurrentWidget = null;
         this._widgetPanel = new StackedPanel();
         this._widgetPanel.widgetRemoved.connect(this._onWidgetRemoved, this);
-        const closeButton = document.createElement('button');
+        this._closeButton = document.createElement('button');
         closeIcon.element({
-            container: closeButton,
+            container: this._closeButton,
             height: '16px',
-            width: 'auto'
+            width: 'auto',
         });
-        closeButton.onclick = () => {
+        this._closeButton.onclick = () => {
             this.collapse();
             this.hide();
         };
-        closeButton.className = 'jp-Button jp-SidePanel-collapse';
-        const icon = new Widget({ node: closeButton });
+        this._closeButton.className = 'jp-Button jp-SidePanel-collapse';
+        this._closeButton.title = 'Collapse side panel';
+        const icon = new Widget({ node: this._closeButton });
         this._panel.addWidget(icon);
         this._panel.addWidget(this._widgetPanel);
     }
@@ -124,7 +113,7 @@ export class SidePanelHandler extends PanelHandler {
      * Get the widgets list.
      */
     get widgets() {
-        return this._items.map(obj => obj.widget);
+        return this._items.map((obj) => obj.widget);
     }
     /**
      * Signal fired when a widget is added to the panel
@@ -138,6 +127,12 @@ export class SidePanelHandler extends PanelHandler {
     get widgetRemoved() {
         return this._widgetRemoved;
     }
+    /**
+     * Get the close button element.
+     */
+    get closeButton() {
+        return this._closeButton;
+    }
     /**
      * Expand the sidebar.
      *
@@ -226,13 +221,13 @@ export class SidePanelHandler extends PanelHandler {
      * Find the index of the item with the given widget, or `-1`.
      */
     _findWidgetIndex(widget) {
-        return ArrayExt.findFirstIndex(this._items, i => i.widget === widget);
+        return ArrayExt.findFirstIndex(this._items, (i) => i.widget === widget);
     }
     /**
      * Find the widget with the given id, or `null`.
      */
     _findWidgetByID(id) {
-        const item = find(this._items, value => value.widget.id === id);
+        const item = find(this._items, (value) => value.widget.id === id);
         return item ? item.widget : null;
     }
     /**
@@ -293,15 +288,15 @@ export class SidePanelPalette {
             args: {
                 side: area,
                 title: `Show ${widget.title.caption}`,
-                id: widget.id
-            }
+                id: widget.id,
+            },
         });
         // Keep the disposableDelegate objet to be able to dispose of the item if the widget
         // is remove from the side panel.
         this._items.push({
             widgetId: widget.id,
             area: area,
-            disposable: disposableDelegate
+            disposable: disposableDelegate,
         });
     }
     /**

package/lib/shell.d.ts

@@ -1,5 +1,6 @@
 import { JupyterFrontEnd } from '@jupyterlab/application';
 import { DocumentRegistry } from '@jupyterlab/docregistry';
+import { ITranslator } from '@jupyterlab/translation';
 import { Token } from '@lumino/coreutils';
 import { ISignal } from '@lumino/signaling';
 import { Widget } from '@lumino/widgets';
@@ -54,6 +55,11 @@ export declare class NotebookShell extends Widget implements JupyterFrontEnd.ISh
      * Promise that resolves when the main widget is loaded
      */
     get restored(): Promise<void>;
+    /**
+     * Getter and setter for the translator.
+     */
+    get translator(): ITranslator;
+    set translator(value: ITranslator);
     /**
      * Activate a widget in its area.
      */
@@ -106,8 +112,10 @@ export declare class NotebookShell extends Widget implements JupyterFrontEnd.ISh
     private _menuHandler;
     private _leftHandler;
     private _rightHandler;
-    private _spacer;
+    private _spacer_top;
+    private _spacer_bottom;
     private _main;
+    private _translator;
     private _currentChanged;
     private _mainWidgetLoaded;
 }

package/lib/shell.js

@@ -1,5 +1,6 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
+import { nullTranslator } from '@jupyterlab/translation';
 import { find } from '@lumino/algorithm';
 import { PromiseDelegate, Token } from '@lumino/coreutils';
 import { Signal } from '@lumino/signaling';
@@ -19,6 +20,7 @@ const DEFAULT_RANK = 900;
 export class NotebookShell extends Widget {
     constructor() {
         super();
+        this._translator = nullTranslator;
         this._currentChanged = new Signal(this);
         this._mainWidgetLoaded = new PromiseDelegate();
         this.id = 'main';
@@ -30,10 +32,15 @@ export class NotebookShell extends Widget {
         const topWrapper = (this._topWrapper = new Panel());
         const menuWrapper = (this._menuWrapper = new Panel());
         this._topHandler.panel.id = 'top-panel';
+        this._topHandler.panel.node.setAttribute('role', 'banner');
         this._menuHandler.panel.id = 'menu-panel';
+        this._menuHandler.panel.node.setAttribute('role', 'navigation');
         this._main.id = 'main-panel';
-        this._spacer = new Widget();
-        this._spacer.id = 'spacer-widget';
+        this._main.node.setAttribute('role', 'main');
+        this._spacer_top = new Widget();
+        this._spacer_top.id = 'spacer-widget-top';
+        this._spacer_bottom = new Widget();
+        this._spacer_bottom.id = 'spacer-widget-bottom';
         // create wrappers around the top and menu areas
         topWrapper.id = 'top-panel-wrapper';
         topWrapper.addWidget(this._topHandler.panel);
@@ -43,13 +50,15 @@ export class NotebookShell extends Widget {
         const leftHandler = this._leftHandler;
         const rightHandler = this._rightHandler;
         leftHandler.panel.id = 'jp-left-stack';
+        leftHandler.panel.node.setAttribute('role', 'complementary');
         rightHandler.panel.id = 'jp-right-stack';
+        rightHandler.panel.node.setAttribute('role', 'complementary');
         // Hide the side panels by default.
         leftHandler.hide();
         rightHandler.hide();
         const middleLayout = new BoxLayout({
             spacing: 0,
-            direction: 'top-to-bottom'
+            direction: 'top-to-bottom',
         });
         BoxLayout.setStretch(this._topWrapper, 0);
         BoxLayout.setStretch(this._menuWrapper, 0);
@@ -57,8 +66,9 @@ export class NotebookShell extends Widget {
         const middlePanel = new Panel({ layout: middleLayout });
         middlePanel.addWidget(this._topWrapper);
         middlePanel.addWidget(this._menuWrapper);
-        middlePanel.addWidget(this._spacer);
+        middlePanel.addWidget(this._spacer_top);
         middlePanel.addWidget(this._main);
+        middlePanel.addWidget(this._spacer_bottom);
         middlePanel.layout = middleLayout;
         // TODO: Consider storing this as an attribute this._hsplitPanel if saving/restoring layout needed
         const hsplitPanel = new SplitPanel();
@@ -134,13 +144,28 @@ export class NotebookShell extends Widget {
     get restored() {
         return this._mainWidgetLoaded.promise;
     }
+    /**
+     * Getter and setter for the translator.
+     */
+    get translator() {
+        var _a;
+        return (_a = this._translator) !== null && _a !== void 0 ? _a : nullTranslator;
+    }
+    set translator(value) {
+        if (value !== this._translator) {
+            this._translator = value;
+            const trans = value.load('notebook');
+            this._leftHandler.closeButton.title = trans.__('Collapse %1 side panel', this._leftHandler.area);
+            this._rightHandler.closeButton.title = trans.__('Collapse %1 side panel', this._rightHandler.area);
+        }
+    }
     /**
      * Activate a widget in its area.
      */
     activateById(id) {
         // Search all areas that can have widgets for this widget, starting with main.
         for (const area of ['main', 'top', 'left', 'right', 'menu']) {
-            const widget = find(this.widgets(area), w => w.id === id);
+            const widget = find(this.widgets(area), (w) => w.id === id);
             if (widget) {
                 if (area === 'left') {
                     this.expandLeft(id);
@@ -197,14 +222,14 @@ export class NotebookShell extends Widget {
      */
     collapseTop() {
         this._topWrapper.setHidden(true);
-        this._spacer.setHidden(true);
+        this._spacer_top.setHidden(true);
     }
     /**
      * Expand the top area to show the header and the spacer.
      */
     expandTop() {
         this._topWrapper.setHidden(false);
-        this._spacer.setHidden(false);
+        this._spacer_top.setHidden(false);
     }
     /**
      * Return the list of widgets for the given area.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupyter-notebook/application",
-  "version": "7.0.0-alpha.9",
+  "version": "7.0.0-beta.0",
   "description": "Jupyter Notebook - Application",
   "homepage": "https://github.com/jupyter/notebook",
   "bugs": {
@@ -35,7 +35,6 @@
     "build:test": "tsc --build tsconfig.test.json",
     "clean": "rimraf lib && rimraf tsconfig.tsbuildinfo",
     "docs": "typedoc src",
-    "prepublishOnly": "npm run build",
     "test": "jest",
     "test:cov": "jest --collect-coverage",
     "test:debug": "node --inspect-brk node_modules/.bin/jest --runInBand",
@@ -43,27 +42,27 @@
     "watch": "tsc -b --watch"
   },
   "dependencies": {
-    "@jupyterlab/application": "^4.0.0-alpha.16",
-    "@jupyterlab/coreutils": "^6.0.0-alpha.16",
-    "@jupyterlab/docregistry": "^4.0.0-alpha.16",
-    "@jupyterlab/rendermime-interfaces": "^3.8.0-alpha.16",
-    "@jupyterlab/ui-components": "^4.0.0-alpha.31",
-    "@lumino/algorithm": "^2.0.0-alpha.6",
-    "@lumino/coreutils": "^2.0.0-alpha.6",
-    "@lumino/messaging": "^2.0.0-alpha.6",
-    "@lumino/polling": "^2.0.0-alpha.6",
-    "@lumino/signaling": "^2.0.0-alpha.6",
-    "@lumino/widgets": "^2.0.0-alpha.6"
+    "@jupyterlab/application": "^4.0.0-beta.0",
+    "@jupyterlab/coreutils": "^6.0.0-beta.0",
+    "@jupyterlab/docregistry": "^4.0.0-beta.0",
+    "@jupyterlab/rendermime-interfaces": "^3.8.0-beta.0",
+    "@jupyterlab/ui-components": "^4.0.0-beta.0",
+    "@lumino/algorithm": "^2.0.0",
+    "@lumino/coreutils": "^2.0.0",
+    "@lumino/messaging": "^2.0.0",
+    "@lumino/polling": "^2.0.0",
+    "@lumino/signaling": "^2.0.0",
+    "@lumino/widgets": "^2.0.1"
   },
   "devDependencies": {
     "@babel/core": "^7.11.6",
     "@babel/preset-env": "^7.12.1",
-    "@jupyterlab/testutils": "^4.0.0-alpha.16",
-    "@types/jest": "^26.0.10",
-    "jest": "^26.4.2",
+    "@jupyterlab/testutils": "^4.0.0-beta.0",
+    "@types/jest": "^29.2.5",
+    "jest": "^29.3.1",
     "rimraf": "^3.0.2",
-    "ts-jest": "^26.3.0",
-    "typescript": "~4.7.3"
+    "ts-jest": "^29.0.3",
+    "typescript": "~5.0.2"
   },
   "publishConfig": {
     "access": "public"

package/style/base.css

@@ -59,24 +59,33 @@ body {
 }
 
 #main-panel {
-  box-shadow: var(--jp-elevation-z4);
   margin-left: auto;
   margin-right: auto;
   max-width: var(--jp-notebook-max-width);
 }
 
-#spacer-widget {
+#spacer-widget-top {
+  min-height: 16px;
+}
+
+/* Only edit pages should have a bottom space */
+
+body[data-notebook='edit'] #spacer-widget-bottom {
   min-height: 16px;
 }
 
 /* Special case notebooks as document oriented pages */
 
+[data-notebook]:not(body[data-notebook='notebooks']) #main-panel {
+  box-shadow: var(--jp-elevation-z4);
+}
+
 body[data-notebook='notebooks'] #main-panel {
   margin-left: unset;
   margin-right: unset;
   max-width: unset;
 }
 
-body[data-notebook='notebooks'] #spacer-widget {
+body[data-notebook='notebooks'] #spacer-widget-top {
   min-height: unset;
 }