@jupyter-notebook/application 7.0.0-alpha.8 → 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/index.d.ts

@@ -1,2 +1,3 @@
 export * from './app';
 export * from './shell';
+export * from './panelhandler';

package/lib/index.js

@@ -2,3 +2,4 @@
 // Distributed under the terms of the Modified BSD License.
 export * from './app';
 export * from './shell';
+export * from './panelhandler';

package/lib/panelhandler.d.ts

@@ -0,0 +1,217 @@
+import { ICommandPalette } from '@jupyterlab/apputils';
+import { IDisposable } from '@lumino/disposable';
+import { ISignal } from '@lumino/signaling';
+import { Panel, Widget } from '@lumino/widgets';
+/**
+ * A class which manages a panel and sorts its widgets by rank.
+ */
+export declare class PanelHandler {
+    constructor();
+    /**
+     * Get the panel managed by the handler.
+     */
+    get panel(): Panel;
+    /**
+     * Add a widget to the panel.
+     *
+     * If the widget is already added, it will be moved.
+     */
+    addWidget(widget: Widget, rank: number): void;
+    /**
+     * A message hook for child remove messages on the panel handler.
+     */
+    private _panelChildHook;
+    protected _items: Private.IRankItem[];
+    protected _panel: Panel;
+}
+/**
+ * A class which manages a side panel that can show at most one widget at a time.
+ */
+export declare class SidePanelHandler extends PanelHandler {
+    /**
+     * Construct a new side panel handler.
+     */
+    constructor(area: SidePanel.Area);
+    /**
+     * Get the current widget in the sidebar panel.
+     */
+    get currentWidget(): Widget | null;
+    /**
+     * Get the area of the side panel
+     */
+    get area(): SidePanel.Area;
+    /**
+     * Whether the panel is visible
+     */
+    get isVisible(): boolean;
+    /**
+     * Get the stacked panel managed by the handler
+     */
+    get panel(): Panel;
+    /**
+     * Get the widgets list.
+     */
+    get widgets(): Readonly<Widget[]>;
+    /**
+     * Signal fired when a widget is added to the panel
+     */
+    get widgetAdded(): ISignal<SidePanelHandler, Widget>;
+    /**
+     * 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.
+     *
+     * #### Notes
+     * This will open the most recently used widget, or the first widget
+     * if there is no most recently used.
+     */
+    expand(id?: string): void;
+    /**
+     * Activate a widget residing in the stacked panel by ID.
+     *
+     * @param id - The widget's unique ID.
+     */
+    activate(id: string): void;
+    /**
+     * Test whether the sidebar has the given widget by id.
+     */
+    has(id: string): boolean;
+    /**
+     * Collapse the sidebar so no items are expanded.
+     */
+    collapse(): void;
+    /**
+     * Add a widget and its title to the stacked panel.
+     *
+     * If the widget is already added, it will be moved.
+     */
+    addWidget(widget: Widget, rank: number): void;
+    /**
+     * Hide the side panel
+     */
+    hide(): void;
+    /**
+     * Show the side panel
+     */
+    show(): void;
+    /**
+     * Find the insertion index for a rank item.
+     */
+    private _findInsertIndex;
+    /**
+     * Find the index of the item with the given widget, or `-1`.
+     */
+    private _findWidgetIndex;
+    /**
+     * Find the widget with the given id, or `null`.
+     */
+    private _findWidgetByID;
+    /**
+     * Refresh the visibility of the stacked panel.
+     */
+    private _refreshVisibility;
+    private _onWidgetRemoved;
+    private _area;
+    private _isHiddenByUser;
+    private _widgetPanel;
+    private _currentWidget;
+    private _lastCurrentWidget;
+    private _closeButton;
+    private _widgetAdded;
+    private _widgetRemoved;
+}
+/**
+ * A name space for SideBarPanel functions.
+ */
+export declare namespace SidePanel {
+    /**
+     * The areas of the sidebar panel
+     */
+    type Area = 'left' | 'right';
+}
+/**
+ * A class to manages the palette entries associated to the side panels.
+ */
+export declare class SidePanelPalette {
+    /**
+     * Construct a new side panel palette.
+     */
+    constructor(options: SidePanelPaletteOption);
+    /**
+     * Get a command palette item from the widget id and the area.
+     */
+    getItem(widget: Readonly<Widget>, area: 'left' | 'right'): SidePanelPaletteItem | null;
+    /**
+     * Add an item to the command palette.
+     */
+    addItem(widget: Readonly<Widget>, area: 'left' | 'right'): void;
+    /**
+     * Remove an item from the command palette.
+     */
+    removeItem(widget: Readonly<Widget>, area: 'left' | 'right'): void;
+    _command: string;
+    _commandPalette: ICommandPalette;
+    _items: SidePanelPaletteItem[];
+}
+type SidePanelPaletteItem = {
+    /**
+     * The ID of the widget associated to the command palette.
+     */
+    widgetId: string;
+    /**
+     * The area of the panel associated to the command palette.
+     */
+    area: 'left' | 'right';
+    /**
+     * The disposable object to remove the item from command palette.
+     */
+    disposable: IDisposable;
+};
+/**
+ * An interface for the options to include in SideBarPalette constructor.
+ */
+type SidePanelPaletteOption = {
+    /**
+     * The commands palette.
+     */
+    commandPalette: ICommandPalette;
+    /**
+     * The command to call from each side panel menu entry.
+     *
+     * ### Notes
+     * That command required 3 args :
+     *      side: 'left' | 'right', the area to toggle
+     *      title: string, label of the command
+     *      id: string, id of the widget to activate
+     */
+    command: string;
+};
+/**
+ * A namespace for private module data.
+ */
+declare namespace Private {
+    /**
+     * An object which holds a widget and its sort rank.
+     */
+    interface IRankItem {
+        /**
+         * The widget for the item.
+         */
+        widget: Widget;
+        /**
+         * The sort rank of the widget.
+         */
+        rank: number;
+    }
+    /**
+     * A less-than comparison function for side bar rank items.
+     */
+    function itemCmp(first: IRankItem, second: IRankItem): number;
+}
+export {};

package/lib/panelhandler.js

@@ -0,0 +1,324 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+import { closeIcon } from '@jupyterlab/ui-components';
+import { ArrayExt, find } from '@lumino/algorithm';
+import { MessageLoop } from '@lumino/messaging';
+import { Signal } from '@lumino/signaling';
+import { Panel, StackedPanel, Widget } from '@lumino/widgets';
+/**
+ * A class which manages a panel and sorts its widgets by rank.
+ */
+export class PanelHandler {
+    constructor() {
+        /**
+         * A message hook for child remove messages on the panel handler.
+         */
+        this._panelChildHook = (handler, msg) => {
+            switch (msg.type) {
+                case 'child-removed':
+                    {
+                        const widget = msg.child;
+                        ArrayExt.removeFirstWhere(this._items, (v) => v.widget === widget);
+                    }
+                    break;
+                default:
+                    break;
+            }
+            return true;
+        };
+        this._items = new Array();
+        this._panel = new Panel();
+        MessageLoop.installMessageHook(this._panel, this._panelChildHook);
+    }
+    /**
+     * Get the panel managed by the handler.
+     */
+    get panel() {
+        return this._panel;
+    }
+    /**
+     * Add a widget to the panel.
+     *
+     * If the widget is already added, it will be moved.
+     */
+    addWidget(widget, rank) {
+        widget.parent = null;
+        const item = { widget, rank };
+        const index = ArrayExt.upperBound(this._items, item, Private.itemCmp);
+        ArrayExt.insert(this._items, index, item);
+        this._panel.insertWidget(index, widget);
+    }
+}
+/**
+ * A class which manages a side panel that can show at most one widget at a time.
+ */
+export class SidePanelHandler extends PanelHandler {
+    /**
+     * Construct a new side panel handler.
+     */
+    constructor(area) {
+        super();
+        this._isHiddenByUser = false;
+        this._widgetAdded = new Signal(this);
+        this._widgetRemoved = new Signal(this);
+        this._area = area;
+        this._panel.hide();
+        this._currentWidget = null;
+        this._lastCurrentWidget = null;
+        this._widgetPanel = new StackedPanel();
+        this._widgetPanel.widgetRemoved.connect(this._onWidgetRemoved, this);
+        this._closeButton = document.createElement('button');
+        closeIcon.element({
+            container: this._closeButton,
+            height: '16px',
+            width: 'auto',
+        });
+        this._closeButton.onclick = () => {
+            this.collapse();
+            this.hide();
+        };
+        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);
+    }
+    /**
+     * Get the current widget in the sidebar panel.
+     */
+    get currentWidget() {
+        return (this._currentWidget ||
+            this._lastCurrentWidget ||
+            (this._items.length > 0 ? this._items[0].widget : null));
+    }
+    /**
+     * Get the area of the side panel
+     */
+    get area() {
+        return this._area;
+    }
+    /**
+     * Whether the panel is visible
+     */
+    get isVisible() {
+        return this._panel.isVisible;
+    }
+    /**
+     * Get the stacked panel managed by the handler
+     */
+    get panel() {
+        return this._panel;
+    }
+    /**
+     * Get the widgets list.
+     */
+    get widgets() {
+        return this._items.map((obj) => obj.widget);
+    }
+    /**
+     * Signal fired when a widget is added to the panel
+     */
+    get widgetAdded() {
+        return this._widgetAdded;
+    }
+    /**
+     * Signal fired when a widget is removed from the panel
+     */
+    get widgetRemoved() {
+        return this._widgetRemoved;
+    }
+    /**
+     * Get the close button element.
+     */
+    get closeButton() {
+        return this._closeButton;
+    }
+    /**
+     * Expand the sidebar.
+     *
+     * #### Notes
+     * This will open the most recently used widget, or the first widget
+     * if there is no most recently used.
+     */
+    expand(id) {
+        if (this._currentWidget) {
+            this.collapse();
+        }
+        if (id) {
+            this.activate(id);
+        }
+        else {
+            const visibleWidget = this.currentWidget;
+            if (visibleWidget) {
+                this._currentWidget = visibleWidget;
+                this.activate(visibleWidget.id);
+            }
+        }
+    }
+    /**
+     * Activate a widget residing in the stacked panel by ID.
+     *
+     * @param id - The widget's unique ID.
+     */
+    activate(id) {
+        const widget = this._findWidgetByID(id);
+        if (widget) {
+            this._currentWidget = widget;
+            widget.show();
+            widget.activate();
+        }
+    }
+    /**
+     * Test whether the sidebar has the given widget by id.
+     */
+    has(id) {
+        return this._findWidgetByID(id) !== null;
+    }
+    /**
+     * Collapse the sidebar so no items are expanded.
+     */
+    collapse() {
+        var _a;
+        (_a = this._currentWidget) === null || _a === void 0 ? void 0 : _a.hide();
+        this._currentWidget = null;
+    }
+    /**
+     * Add a widget and its title to the stacked panel.
+     *
+     * If the widget is already added, it will be moved.
+     */
+    addWidget(widget, rank) {
+        widget.parent = null;
+        widget.hide();
+        const item = { widget, rank };
+        const index = this._findInsertIndex(item);
+        ArrayExt.insert(this._items, index, item);
+        this._widgetPanel.insertWidget(index, widget);
+        this._refreshVisibility();
+        this._widgetAdded.emit(widget);
+    }
+    /**
+     * Hide the side panel
+     */
+    hide() {
+        this._isHiddenByUser = true;
+        this._refreshVisibility();
+    }
+    /**
+     * Show the side panel
+     */
+    show() {
+        this._isHiddenByUser = false;
+        this._refreshVisibility();
+    }
+    /**
+     * Find the insertion index for a rank item.
+     */
+    _findInsertIndex(item) {
+        return ArrayExt.upperBound(this._items, item, Private.itemCmp);
+    }
+    /**
+     * Find the index of the item with the given widget, or `-1`.
+     */
+    _findWidgetIndex(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);
+        return item ? item.widget : null;
+    }
+    /**
+     * Refresh the visibility of the stacked panel.
+     */
+    _refreshVisibility() {
+        this._panel.setHidden(this._isHiddenByUser);
+    }
+    /*
+     * Handle the `widgetRemoved` signal from the panel.
+     */
+    _onWidgetRemoved(sender, widget) {
+        if (widget === this._lastCurrentWidget) {
+            this._lastCurrentWidget = null;
+        }
+        ArrayExt.removeAt(this._items, this._findWidgetIndex(widget));
+        this._refreshVisibility();
+        this._widgetRemoved.emit(widget);
+    }
+}
+/**
+ * A class to manages the palette entries associated to the side panels.
+ */
+export class SidePanelPalette {
+    /**
+     * Construct a new side panel palette.
+     */
+    constructor(options) {
+        this._items = [];
+        this._commandPalette = options.commandPalette;
+        this._command = options.command;
+    }
+    /**
+     * Get a command palette item from the widget id and the area.
+     */
+    getItem(widget, area) {
+        const itemList = this._items;
+        for (let i = 0; i < itemList.length; i++) {
+            const item = itemList[i];
+            if (item.widgetId === widget.id && item.area === area) {
+                return item;
+            }
+        }
+        return null;
+    }
+    /**
+     * Add an item to the command palette.
+     */
+    addItem(widget, area) {
+        // Check if the item does not already exist.
+        if (this.getItem(widget, area)) {
+            return;
+        }
+        // Add a new item in command palette.
+        const disposableDelegate = this._commandPalette.addItem({
+            command: this._command,
+            category: 'View',
+            args: {
+                side: area,
+                title: `Show ${widget.title.caption}`,
+                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,
+        });
+    }
+    /**
+     * Remove an item from the command palette.
+     */
+    removeItem(widget, area) {
+        const item = this.getItem(widget, area);
+        if (item) {
+            item.disposable.dispose();
+        }
+    }
+}
+/**
+ * A namespace for private module data.
+ */
+var Private;
+(function (Private) {
+    /**
+     * A less-than comparison function for side bar rank items.
+     */
+    function itemCmp(first, second) {
+        return first.rank - second.rank;
+    }
+    Private.itemCmp = itemCmp;
+})(Private || (Private = {}));

package/lib/shell.d.ts

@@ -1,8 +1,10 @@
 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 { Panel, Widget } from '@lumino/widgets';
+import { Widget } from '@lumino/widgets';
+import { SidePanelHandler } from './panelhandler';
 /**
  * The Jupyter Notebook application shell token.
  */
@@ -36,11 +38,11 @@ export declare class NotebookShell extends Widget implements JupyterFrontEnd.ISh
     /**
      * Get the left area handler
      */
-    get leftHandler(): SideBarHandler;
+    get leftHandler(): SidePanelHandler;
     /**
      * Get the right area handler
      */
-    get rightHandler(): SideBarHandler;
+    get rightHandler(): SidePanelHandler;
     /**
      * Is the left sidebar visible?
      */
@@ -53,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.
      */
@@ -105,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;
 }
@@ -119,111 +128,3 @@ export declare namespace Shell {
      */
     type Area = 'main' | 'top' | 'left' | 'right' | 'menu';
 }
-/**
- * A name space for SideBarPanel functions.
- */
-export declare namespace SideBarPanel {
-    /**
-     * The areas of the sidebar panel
-     */
-    type Area = 'left' | 'right';
-}
-/**
- * A class which manages a side bar that can show at most one widget at a time.
- */
-export declare class SideBarHandler {
-    /**
-     * Construct a new side bar handler.
-     */
-    constructor(area: SideBarPanel.Area);
-    /**
-     * Get the current widget in the sidebar panel.
-     */
-    get currentWidget(): Widget | null;
-    /**
-     * Get the area of the side panel
-     */
-    get area(): SideBarPanel.Area;
-    /**
-     * Whether the panel is visible
-     */
-    get isVisible(): boolean;
-    /**
-     * Get the stacked panel managed by the handler
-     */
-    get panel(): Panel;
-    /**
-     * Get the widgets list.
-     */
-    get widgets(): Readonly<Widget[]>;
-    /**
-     * Signal fired when a widget is added to the panel
-     */
-    get widgetAdded(): ISignal<SideBarHandler, Widget>;
-    /**
-     * Signal fired when a widget is removed from the panel
-     */
-    get widgetRemoved(): ISignal<SideBarHandler, Widget>;
-    /**
-     * Expand the sidebar.
-     *
-     * #### Notes
-     * This will open the most recently used widget, or the first widget
-     * if there is no most recently used.
-     */
-    expand(id?: string): void;
-    /**
-     * Activate a widget residing in the stacked panel by ID.
-     *
-     * @param id - The widget's unique ID.
-     */
-    activate(id: string): void;
-    /**
-     * Test whether the sidebar has the given widget by id.
-     */
-    has(id: string): boolean;
-    /**
-     * Collapse the sidebar so no items are expanded.
-     */
-    collapse(): void;
-    /**
-     * Add a widget and its title to the stacked panel.
-     *
-     * If the widget is already added, it will be moved.
-     */
-    addWidget(widget: Widget, rank: number): void;
-    /**
-     * Hide the side panel
-     */
-    hide(): void;
-    /**
-     * Show the side panel
-     */
-    show(): void;
-    /**
-     * Find the insertion index for a rank item.
-     */
-    private _findInsertIndex;
-    /**
-     * Find the index of the item with the given widget, or `-1`.
-     */
-    private _findWidgetIndex;
-    /**
-     * Find the widget with the given id, or `null`.
-     */
-    private _findWidgetByID;
-    /**
-     * Refresh the visibility of the stacked panel.
-     */
-    private _refreshVisibility;
-    private _onWidgetRemoved;
-    private _area;
-    private _isHiddenByUser;
-    private _items;
-    private _panel;
-    private _widgetPanel;
-    private _currentWidget;
-    private _lastCurrentWidget;
-    private _widgetAdded;
-    private _widgetRemoved;
-}

package/lib/shell.js

@@ -1,11 +1,11 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
-import { closeIcon } from '@jupyterlab/ui-components';
-import { ArrayExt, find } from '@lumino/algorithm';
+import { nullTranslator } from '@jupyterlab/translation';
+import { find } from '@lumino/algorithm';
 import { PromiseDelegate, Token } from '@lumino/coreutils';
-import { MessageLoop } from '@lumino/messaging';
 import { Signal } from '@lumino/signaling';
-import { BoxLayout, Panel, SplitPanel, StackedPanel, Widget } from '@lumino/widgets';
+import { BoxLayout, Panel, SplitPanel, Widget } from '@lumino/widgets';
+import { PanelHandler, SidePanelHandler } from './panelhandler';
 /**
  * The Jupyter Notebook application shell token.
  */
@@ -20,21 +20,27 @@ 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';
-        this._topHandler = new Private.PanelHandler();
-        this._menuHandler = new Private.PanelHandler();
-        this._leftHandler = new SideBarHandler('left');
-        this._rightHandler = new SideBarHandler('right');
+        this._topHandler = new PanelHandler();
+        this._menuHandler = new PanelHandler();
+        this._leftHandler = new SidePanelHandler('left');
+        this._rightHandler = new SidePanelHandler('right');
         this._main = new Panel();
         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);
@@ -44,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);
@@ -58,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();
@@ -135,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);
@@ -198,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.
@@ -263,266 +287,3 @@ export class NotebookShell extends Widget {
         this._rightHandler.panel.hide();
     }
 }
-/**
- * A class which manages a side bar that can show at most one widget at a time.
- */
-export class SideBarHandler {
-    /**
-     * Construct a new side bar handler.
-     */
-    constructor(area) {
-        this._isHiddenByUser = false;
-        this._items = new Array();
-        this._widgetAdded = new Signal(this);
-        this._widgetRemoved = new Signal(this);
-        this._area = area;
-        this._panel = new Panel();
-        this._panel.hide();
-        this._currentWidget = null;
-        this._lastCurrentWidget = null;
-        this._widgetPanel = new StackedPanel();
-        this._widgetPanel.widgetRemoved.connect(this._onWidgetRemoved, this);
-        const closeButton = document.createElement('button');
-        closeIcon.element({
-            container: closeButton,
-            height: '16px',
-            width: 'auto'
-        });
-        closeButton.onclick = () => {
-            this.collapse();
-            this.hide();
-        };
-        closeButton.className = 'jp-Button jp-SidePanel-collapse';
-        const icon = new Widget({ node: closeButton });
-        this._panel.addWidget(icon);
-        this._panel.addWidget(this._widgetPanel);
-    }
-    /**
-     * Get the current widget in the sidebar panel.
-     */
-    get currentWidget() {
-        return (this._currentWidget ||
-            this._lastCurrentWidget ||
-            (this._items.length > 0 ? this._items[0].widget : null));
-    }
-    /**
-     * Get the area of the side panel
-     */
-    get area() {
-        return this._area;
-    }
-    /**
-     * Whether the panel is visible
-     */
-    get isVisible() {
-        return this._panel.isVisible;
-    }
-    /**
-     * Get the stacked panel managed by the handler
-     */
-    get panel() {
-        return this._panel;
-    }
-    /**
-     * Get the widgets list.
-     */
-    get widgets() {
-        return this._items.map(obj => obj.widget);
-    }
-    /**
-     * Signal fired when a widget is added to the panel
-     */
-    get widgetAdded() {
-        return this._widgetAdded;
-    }
-    /**
-     * Signal fired when a widget is removed from the panel
-     */
-    get widgetRemoved() {
-        return this._widgetRemoved;
-    }
-    /**
-     * Expand the sidebar.
-     *
-     * #### Notes
-     * This will open the most recently used widget, or the first widget
-     * if there is no most recently used.
-     */
-    expand(id) {
-        if (this._currentWidget) {
-            this.collapse();
-        }
-        if (id) {
-            this.activate(id);
-        }
-        else {
-            const visibleWidget = this.currentWidget;
-            if (visibleWidget) {
-                this._currentWidget = visibleWidget;
-                this.activate(visibleWidget.id);
-            }
-        }
-    }
-    /**
-     * Activate a widget residing in the stacked panel by ID.
-     *
-     * @param id - The widget's unique ID.
-     */
-    activate(id) {
-        const widget = this._findWidgetByID(id);
-        if (widget) {
-            this._currentWidget = widget;
-            widget.show();
-            widget.activate();
-        }
-    }
-    /**
-     * Test whether the sidebar has the given widget by id.
-     */
-    has(id) {
-        return this._findWidgetByID(id) !== null;
-    }
-    /**
-     * Collapse the sidebar so no items are expanded.
-     */
-    collapse() {
-        var _a;
-        (_a = this._currentWidget) === null || _a === void 0 ? void 0 : _a.hide();
-        this._currentWidget = null;
-    }
-    /**
-     * Add a widget and its title to the stacked panel.
-     *
-     * If the widget is already added, it will be moved.
-     */
-    addWidget(widget, rank) {
-        widget.parent = null;
-        widget.hide();
-        const item = { widget, rank };
-        const index = this._findInsertIndex(item);
-        ArrayExt.insert(this._items, index, item);
-        this._widgetPanel.insertWidget(index, widget);
-        this._refreshVisibility();
-        this._widgetAdded.emit(widget);
-    }
-    /**
-     * Hide the side panel
-     */
-    hide() {
-        this._isHiddenByUser = true;
-        this._refreshVisibility();
-    }
-    /**
-     * Show the side panel
-     */
-    show() {
-        this._isHiddenByUser = false;
-        this._refreshVisibility();
-    }
-    /**
-     * Find the insertion index for a rank item.
-     */
-    _findInsertIndex(item) {
-        return ArrayExt.upperBound(this._items, item, Private.itemCmp);
-    }
-    /**
-     * Find the index of the item with the given widget, or `-1`.
-     */
-    _findWidgetIndex(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);
-        return item ? item.widget : null;
-    }
-    /**
-     * Refresh the visibility of the stacked panel.
-     */
-    _refreshVisibility() {
-        this._panel.setHidden(this._isHiddenByUser);
-    }
-    /*
-     * Handle the `widgetRemoved` signal from the panel.
-     */
-    _onWidgetRemoved(sender, widget) {
-        if (widget === this._lastCurrentWidget) {
-            this._lastCurrentWidget = null;
-        }
-        ArrayExt.removeAt(this._items, this._findWidgetIndex(widget));
-        this._refreshVisibility();
-        this._widgetRemoved.emit(widget);
-    }
-}
-/**
- * A namespace for private module data.
- */
-var Private;
-(function (Private) {
-    /**
-     * A less-than comparison function for side bar rank items.
-     */
-    function itemCmp(first, second) {
-        return first.rank - second.rank;
-    }
-    Private.itemCmp = itemCmp;
-    /**
-     * A class which manages a panel and sorts its widgets by rank.
-     */
-    class PanelHandler {
-        constructor() {
-            /**
-             * A message hook for child add/remove messages on the main area dock panel.
-             */
-            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);
-                        }
-                        break;
-                    default:
-                        break;
-                }
-                return true;
-            };
-            this._items = new Array();
-            this._panel = new Panel();
-            MessageLoop.installMessageHook(this._panel, this._panelChildHook);
-        }
-        /**
-         * Get the panel managed by the handler.
-         */
-        get panel() {
-            return this._panel;
-        }
-        /**
-         * Add a widget to the panel.
-         *
-         * If the widget is already added, it will be moved.
-         */
-        addWidget(widget, rank) {
-            widget.parent = null;
-            const item = { widget, rank };
-            const index = ArrayExt.upperBound(this._items, item, Private.itemCmp);
-            ArrayExt.insert(this._items, index, item);
-            this._panel.insertWidget(index, widget);
-        }
-    }
-    Private.PanelHandler = PanelHandler;
-})(Private || (Private = {}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupyter-notebook/application",
-  "version": "7.0.0-alpha.8",
+  "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.15",
-    "@jupyterlab/coreutils": "^6.0.0-alpha.15",
-    "@jupyterlab/docregistry": "^4.0.0-alpha.15",
-    "@jupyterlab/rendermime-interfaces": "^3.8.0-alpha.15",
-    "@jupyterlab/ui-components": "^4.0.0-alpha.30",
-    "@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.15",
-    "@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;
 }