xtralab 0.14.0 → 0.14.1

package/lib/index.js

@@ -9,6 +9,7 @@ import editorIndentPlugin from './editorIndent';
 import gitPlugins from './git';
 import highlightPlugin from './highlight';
 import launcherPlugins from './launcher';
+import menuBarPlugin from './menuBar';
 import menusPlugin from './menus';
 import omniboxPlugin from './omnibox';
 import searchReplacePlugin from './searchReplace';
@@ -39,6 +40,7 @@ const plugins = [
     ...gitPlugins,
     highlightPlugin,
     ...launcherPlugins,
+    menuBarPlugin,
     menusPlugin,
     omniboxPlugin,
     searchReplacePlugin,

package/lib/menuBar/icons.d.ts

@@ -0,0 +1,6 @@
+import { LabIcon } from '@jupyterlab/ui-components';
+/**
+ * Hamburger mark for the collapsed main-menu button, matching the sidebar
+ * toggles in ../topBar/icons.ts.
+ */
+export declare const mainMenuIcon: LabIcon;

package/lib/menuBar/icons.js

@@ -0,0 +1,13 @@
+import { LabIcon } from '@jupyterlab/ui-components';
+/**
+ * Hamburger mark for the collapsed main-menu button, matching the sidebar
+ * toggles in ../topBar/icons.ts.
+ */
+export const mainMenuIcon = new LabIcon({
+    name: 'xtralab:main-menu',
+    svgstr: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+  <line x1="4.5" y1="7" x2="19.5" y2="7" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+  <line x1="4.5" y1="12" x2="19.5" y2="12" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+  <line x1="4.5" y1="17" x2="19.5" y2="17" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+</svg>`
+});

package/lib/menuBar/index.d.ts

@@ -0,0 +1,15 @@
+import { JupyterFrontEndPlugin } from '@jupyterlab/application';
+/**
+ * Collapse the main menu bar into a compact menu button.
+ *
+ * The menu bar is hidden and a hamburger button in the top bar opens the same
+ * menus as a vertical popup. The popup reuses the live `RankedMenu` instances
+ * owned by the `MainMenu`, so menus added or removed at runtime are reflected
+ * without duplication.
+ *
+ * Hiding covers the `jp-menu-panel` container too, which has its own
+ * `min-height` and would otherwise leave an empty strip. The "Show Menu Bar"
+ * toggle restores the classic bar.
+ */
+declare const plugin: JupyterFrontEndPlugin<void>;
+export default plugin;

package/lib/menuBar/index.js

@@ -0,0 +1,164 @@
+import { ILabShell } from '@jupyterlab/application';
+import { ICommandPalette } from '@jupyterlab/apputils';
+import { IMainMenu, MainMenu } from '@jupyterlab/mainmenu';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
+import { ITranslator, nullTranslator } from '@jupyterlab/translation';
+import { CommandToolbarButton, MenuSvg } from '@jupyterlab/ui-components';
+import { Menu } from '@lumino/widgets';
+import { mainMenuIcon } from './icons';
+const PLUGIN_ID = 'xtralab:menu-bar';
+const OPEN_COMMAND = 'xtralab:open-main-menu';
+const TOGGLE_COMMAND = 'xtralab:toggle-menu-bar';
+/**
+ * How long after the popup closes a button press still counts as "close
+ * only". An open Lumino menu closes itself on any outside press from a
+ * document `pointerdown` listener in the capture phase, which runs before
+ * the button's own mousedown handler — so without this window, pressing the
+ * button while the popup is open would close it and instantly reopen it.
+ */
+const REOPEN_GUARD_MS = 250;
+/**
+ * Collapse the main menu bar into a compact menu button.
+ *
+ * The menu bar is hidden and a hamburger button in the top bar opens the same
+ * menus as a vertical popup. The popup reuses the live `RankedMenu` instances
+ * owned by the `MainMenu`, so menus added or removed at runtime are reflected
+ * without duplication.
+ *
+ * Hiding covers the `jp-menu-panel` container too, which has its own
+ * `min-height` and would otherwise leave an empty strip. The "Show Menu Bar"
+ * toggle restores the classic bar.
+ */
+const plugin = {
+    id: PLUGIN_ID,
+    description: 'Collapse the main menu bar into a compact menu button.',
+    autoStart: true,
+    requires: [IMainMenu, ILabShell, ISettingRegistry],
+    optional: [ICommandPalette, ITranslator],
+    activate: (app, mainMenu, labShell, settingRegistry, palette, translator) => {
+        var _a;
+        const { commands } = app;
+        const trans = (translator !== null && translator !== void 0 ? translator : nullTranslator).load('jupyterlab');
+        if (!(mainMenu instanceof MainMenu)) {
+            return;
+        }
+        const menuPanel = () => {
+            var _a, _b;
+            return (_b = (_a = mainMenu.parent) !== null && _a !== void 0 ? _a : Array.from(labShell.widgets('top')).find(w => w.id === 'jp-menu-panel')) !== null && _b !== void 0 ? _b : null;
+        };
+        let visible = false;
+        let button = null;
+        let settings = null;
+        const applyVisibility = (value) => {
+            var _a;
+            visible = value;
+            mainMenu.setHidden(!value);
+            (_a = menuPanel()) === null || _a === void 0 ? void 0 : _a.setHidden(!value);
+            button === null || button === void 0 ? void 0 : button.setHidden(value);
+            commands.notifyCommandChanged(TOGGLE_COMMAND);
+        };
+        mainMenu.hide();
+        (_a = menuPanel()) === null || _a === void 0 ? void 0 : _a.hide();
+        let popup = null;
+        let popupClosedAt = 0;
+        const openMenu = () => {
+            var _a, _b;
+            if (visible) {
+                // The classic bar is on screen; behave like keyboard menu
+                // activation instead of opening a redundant popup that would
+                // compete with the bar for the same Menu instances.
+                mainMenu.activeIndex = 0;
+                mainMenu.openActiveMenu();
+                return;
+            }
+            if (Date.now() - popupClosedAt < REOPEN_GUARD_MS) {
+                return;
+            }
+            // One popup instance, rebuilt from the bar's current menus on every
+            // open so runtime menu changes stay reflected. It is a plain Lumino
+            // Menu rather than a MenuSvg: MenuSvg.insertItem re-wraps each
+            // submenu's renderer and insertItem on every call, which would pile
+            // wrappers onto the shared menus across reopens. The svg renderer and
+            // themed-container class are applied directly instead, matching how
+            // the real menus are constructed in MainMenu.
+            if (popup === null) {
+                popup = new Menu({ commands, renderer: MenuSvg.defaultRenderer });
+                popup.addClass('jp-ThemedContainer');
+                popup.addClass('jp-xtralab-MainMenuPopup');
+                popup.aboutToClose.connect(() => {
+                    popupClosedAt = Date.now();
+                });
+            }
+            else {
+                popup.clearItems();
+            }
+            // Skip empty menus: MenuBar disables their headings, but submenu items
+            // have no such affordance and would open a blank panel.
+            for (const menu of mainMenu.menus) {
+                if (menu.items.length > 0) {
+                    popup.addItem({ type: 'submenu', submenu: menu });
+                }
+            }
+            const anchor = button === null || button === void 0 ? void 0 : button.node.getBoundingClientRect();
+            // The 3px gap matches the detached-dropdown offset chrome.css gives
+            // the real menu bar's dropdowns (.lm-Menu.lm-MenuBar-menu).
+            popup.open((_a = anchor === null || anchor === void 0 ? void 0 : anchor.left) !== null && _a !== void 0 ? _a : 0, ((_b = anchor === null || anchor === void 0 ? void 0 : anchor.bottom) !== null && _b !== void 0 ? _b : 0) + 3);
+        };
+        commands.addCommand(OPEN_COMMAND, {
+            label: trans.__('Open Menu'),
+            caption: trans.__('Open the main menu'),
+            icon: mainMenuIcon,
+            execute: openMenu
+        });
+        commands.addCommand(TOGGLE_COMMAND, {
+            label: trans.__('Show Menu Bar'),
+            caption: trans.__('Toggle the visibility of the main menu bar'),
+            isToggled: () => visible,
+            execute: async () => {
+                applyVisibility(!visible);
+                if (settings !== null) {
+                    try {
+                        await settings.set('visible', visible);
+                    }
+                    catch (reason) {
+                        console.error('xtralab: failed to persist menu bar visibility', reason);
+                    }
+                }
+            }
+        });
+        if (palette) {
+            const category = trans.__('Other');
+            palette.addItem({ command: OPEN_COMMAND, category });
+            palette.addItem({ command: TOGGLE_COMMAND, category });
+        }
+        Promise.all([settingRegistry.load(PLUGIN_ID), app.restored])
+            .then(([loaded]) => {
+            settings = loaded;
+            button = new CommandToolbarButton({
+                commands,
+                id: OPEN_COMMAND,
+                icon: mainMenuIcon,
+                label: '',
+                caption: trans.__('Menu'),
+                noFocusOnClick: true,
+                'aria-haspopup': 'menu'
+            });
+            button.id = 'xtralab-main-menu-button';
+            button.addClass('jp-xtralab-TopBarButton');
+            labShell.add(button, 'top', { rank: 0 });
+            const update = () => {
+                applyVisibility(loaded.get('visible').composite);
+            };
+            update();
+            loaded.changed.connect(update);
+        })
+            .catch(reason => {
+            // Without settings the collapsed state cannot be managed (and the
+            // button was never added) — reveal the stock bar rather than leave
+            // the app with no reachable menus.
+            applyVisibility(true);
+            console.error(`Failed to load settings for ${PLUGIN_ID}`, reason);
+        });
+    }
+};
+export default plugin;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "xtralab",
-    "version": "0.14.0",
+    "version": "0.14.1",
     "description": "An opinionated JupyterLab meta-package that bundles a curated set of extensions, ships a path-first file browser, renders jupyterlab-git's text, notebook and image diffs with its own viewers, and applies a quieter default workspace configuration.",
     "keywords": [
         "jupyter",

package/schema/menu-bar.json

@@ -0,0 +1,37 @@
+{
+  "title": "xtralab menu bar",
+  "description": "Visibility of the main menu bar.",
+  "jupyter.lab.shortcuts": [],
+  "jupyter.lab.menus": {
+    "main": [
+      {
+        "id": "jp-mainmenu-view",
+        "items": [
+          {
+            "type": "submenu",
+            "rank": 1,
+            "submenu": {
+              "id": "jp-mainmenu-view-appearance",
+              "items": [
+                {
+                  "command": "xtralab:toggle-menu-bar",
+                  "rank": 14
+                }
+              ]
+            }
+          }
+        ]
+      }
+    ]
+  },
+  "type": "object",
+  "properties": {
+    "visible": {
+      "type": "boolean",
+      "title": "Show the menu bar",
+      "description": "When false, hides the main menu bar. Its menus stay available from the menu button at the leading edge of the top bar and the bar can be restored from View → Appearance → Show Menu Bar.",
+      "default": false
+    }
+  },
+  "additionalProperties": false
+}

package/src/index.ts

@@ -11,6 +11,7 @@ import editorIndentPlugin from './editorIndent';
 import gitPlugins from './git';
 import highlightPlugin from './highlight';
 import launcherPlugins from './launcher';
+import menuBarPlugin from './menuBar';
 import menusPlugin from './menus';
 import omniboxPlugin from './omnibox';
 import searchReplacePlugin from './searchReplace';
@@ -42,6 +43,7 @@ const plugins: JupyterFrontEndPlugin<unknown>[] = [
   ...gitPlugins,
   highlightPlugin,
   ...launcherPlugins,
+  menuBarPlugin,
   menusPlugin,
   omniboxPlugin,
   searchReplacePlugin,

package/src/menuBar/icons.ts

@@ -0,0 +1,14 @@
+import { LabIcon } from '@jupyterlab/ui-components';
+
+/**
+ * Hamburger mark for the collapsed main-menu button, matching the sidebar
+ * toggles in ../topBar/icons.ts.
+ */
+export const mainMenuIcon = new LabIcon({
+  name: 'xtralab:main-menu',
+  svgstr: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+  <line x1="4.5" y1="7" x2="19.5" y2="7" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+  <line x1="4.5" y1="12" x2="19.5" y2="12" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+  <line x1="4.5" y1="17" x2="19.5" y2="17" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/>
+</svg>`
+});

package/src/menuBar/index.ts

@@ -0,0 +1,195 @@
+import {
+  ILabShell,
+  JupyterFrontEnd,
+  JupyterFrontEndPlugin
+} from '@jupyterlab/application';
+import { ICommandPalette } from '@jupyterlab/apputils';
+import { IMainMenu, MainMenu } from '@jupyterlab/mainmenu';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
+import { ITranslator, nullTranslator } from '@jupyterlab/translation';
+import { CommandToolbarButton, MenuSvg } from '@jupyterlab/ui-components';
+import { Menu, Widget } from '@lumino/widgets';
+
+import { mainMenuIcon } from './icons';
+
+const PLUGIN_ID = 'xtralab:menu-bar';
+
+const OPEN_COMMAND = 'xtralab:open-main-menu';
+const TOGGLE_COMMAND = 'xtralab:toggle-menu-bar';
+
+/**
+ * How long after the popup closes a button press still counts as "close
+ * only". An open Lumino menu closes itself on any outside press from a
+ * document `pointerdown` listener in the capture phase, which runs before
+ * the button's own mousedown handler — so without this window, pressing the
+ * button while the popup is open would close it and instantly reopen it.
+ */
+const REOPEN_GUARD_MS = 250;
+
+/**
+ * Collapse the main menu bar into a compact menu button.
+ *
+ * The menu bar is hidden and a hamburger button in the top bar opens the same
+ * menus as a vertical popup. The popup reuses the live `RankedMenu` instances
+ * owned by the `MainMenu`, so menus added or removed at runtime are reflected
+ * without duplication.
+ *
+ * Hiding covers the `jp-menu-panel` container too, which has its own
+ * `min-height` and would otherwise leave an empty strip. The "Show Menu Bar"
+ * toggle restores the classic bar.
+ */
+const plugin: JupyterFrontEndPlugin<void> = {
+  id: PLUGIN_ID,
+  description: 'Collapse the main menu bar into a compact menu button.',
+  autoStart: true,
+  requires: [IMainMenu, ILabShell, ISettingRegistry],
+  optional: [ICommandPalette, ITranslator],
+  activate: (
+    app: JupyterFrontEnd,
+    mainMenu: IMainMenu,
+    labShell: ILabShell,
+    settingRegistry: ISettingRegistry,
+    palette: ICommandPalette | null,
+    translator: ITranslator | null
+  ): void => {
+    const { commands } = app;
+    const trans = (translator ?? nullTranslator).load('jupyterlab');
+
+    if (!(mainMenu instanceof MainMenu)) {
+      return;
+    }
+
+    const menuPanel = (): Widget | null =>
+      mainMenu.parent ??
+      Array.from(labShell.widgets('top')).find(w => w.id === 'jp-menu-panel') ??
+      null;
+
+    let visible = false;
+    let button: CommandToolbarButton | null = null;
+    let settings: ISettingRegistry.ISettings | null = null;
+
+    const applyVisibility = (value: boolean): void => {
+      visible = value;
+      mainMenu.setHidden(!value);
+      menuPanel()?.setHidden(!value);
+      button?.setHidden(value);
+      commands.notifyCommandChanged(TOGGLE_COMMAND);
+    };
+
+    mainMenu.hide();
+    menuPanel()?.hide();
+
+    let popup: Menu | null = null;
+    let popupClosedAt = 0;
+
+    const openMenu = (): void => {
+      if (visible) {
+        // The classic bar is on screen; behave like keyboard menu
+        // activation instead of opening a redundant popup that would
+        // compete with the bar for the same Menu instances.
+        mainMenu.activeIndex = 0;
+        mainMenu.openActiveMenu();
+        return;
+      }
+      if (Date.now() - popupClosedAt < REOPEN_GUARD_MS) {
+        return;
+      }
+
+      // One popup instance, rebuilt from the bar's current menus on every
+      // open so runtime menu changes stay reflected. It is a plain Lumino
+      // Menu rather than a MenuSvg: MenuSvg.insertItem re-wraps each
+      // submenu's renderer and insertItem on every call, which would pile
+      // wrappers onto the shared menus across reopens. The svg renderer and
+      // themed-container class are applied directly instead, matching how
+      // the real menus are constructed in MainMenu.
+      if (popup === null) {
+        popup = new Menu({ commands, renderer: MenuSvg.defaultRenderer });
+        popup.addClass('jp-ThemedContainer');
+        popup.addClass('jp-xtralab-MainMenuPopup');
+        popup.aboutToClose.connect(() => {
+          popupClosedAt = Date.now();
+        });
+      } else {
+        popup.clearItems();
+      }
+
+      // Skip empty menus: MenuBar disables their headings, but submenu items
+      // have no such affordance and would open a blank panel.
+      for (const menu of mainMenu.menus) {
+        if (menu.items.length > 0) {
+          popup.addItem({ type: 'submenu', submenu: menu });
+        }
+      }
+
+      const anchor = button?.node.getBoundingClientRect();
+      // The 3px gap matches the detached-dropdown offset chrome.css gives
+      // the real menu bar's dropdowns (.lm-Menu.lm-MenuBar-menu).
+      popup.open(anchor?.left ?? 0, (anchor?.bottom ?? 0) + 3);
+    };
+
+    commands.addCommand(OPEN_COMMAND, {
+      label: trans.__('Open Menu'),
+      caption: trans.__('Open the main menu'),
+      icon: mainMenuIcon,
+      execute: openMenu
+    });
+
+    commands.addCommand(TOGGLE_COMMAND, {
+      label: trans.__('Show Menu Bar'),
+      caption: trans.__('Toggle the visibility of the main menu bar'),
+      isToggled: () => visible,
+      execute: async () => {
+        applyVisibility(!visible);
+        if (settings !== null) {
+          try {
+            await settings.set('visible', visible);
+          } catch (reason) {
+            console.error(
+              'xtralab: failed to persist menu bar visibility',
+              reason
+            );
+          }
+        }
+      }
+    });
+
+    if (palette) {
+      const category = trans.__('Other');
+      palette.addItem({ command: OPEN_COMMAND, category });
+      palette.addItem({ command: TOGGLE_COMMAND, category });
+    }
+
+    Promise.all([settingRegistry.load(PLUGIN_ID), app.restored])
+      .then(([loaded]) => {
+        settings = loaded;
+
+        button = new CommandToolbarButton({
+          commands,
+          id: OPEN_COMMAND,
+          icon: mainMenuIcon,
+          label: '',
+          caption: trans.__('Menu'),
+          noFocusOnClick: true,
+          'aria-haspopup': 'menu'
+        });
+        button.id = 'xtralab-main-menu-button';
+        button.addClass('jp-xtralab-TopBarButton');
+        labShell.add(button, 'top', { rank: 0 });
+
+        const update = (): void => {
+          applyVisibility(loaded.get('visible').composite as boolean);
+        };
+        update();
+        loaded.changed.connect(update);
+      })
+      .catch(reason => {
+        // Without settings the collapsed state cannot be managed (and the
+        // button was never added) — reveal the stock bar rather than leave
+        // the app with no reachable menus.
+        applyVisibility(true);
+        console.error(`Failed to load settings for ${PLUGIN_ID}`, reason);
+      });
+  }
+};
+
+export default plugin;