@jbrowse/product-core 5.0.0-beta.1 → 5.0.0-beta.11

package/esm/Session/DrawerWidgets.d.ts

@@ -39,6 +39,12 @@ export declare function DrawerWidgetSessionMixin(pluginManager: PluginManager):
      * modal, with no drawer behind it, is disorienting
      */
     poppedOut: boolean;
+    /**
+     * #volatile
+     * set by a host with no room for a drawer column beside its views (a
+     * phone), so every widget shows in a modal instead
+     */
+    modalWidgets: boolean;
 } & {
     /**
      * #getter
@@ -51,6 +57,12 @@ export declare function DrawerWidgetSessionMixin(pluginManager: PluginManager):
      * the modal and the drawer at once.
      */
     readonly drawerVisible: boolean;
+    /**
+     * #getter
+     * whether the visible widget shows in a modal: popped out of the drawer,
+     * or on a host with no room for one
+     */
+    readonly modalWidgetVisible: boolean;
 } & {
     /**
      * #action
@@ -74,6 +86,8 @@ export declare function DrawerWidgetSessionMixin(pluginManager: PluginManager):
     showWidget(widget: any): void;
     /**
      * #action
+     * closes the widget, and removes it from the session when its type sets
+     * `discardOnClose`. Minimizing the drawer is not closing.
      */
     hideWidget(widget: any): void;
     /**
@@ -93,10 +107,28 @@ export declare function DrawerWidgetSessionMixin(pluginManager: PluginManager):
      * #action
      */
     returnWidgetToDrawer(): void;
+    /**
+     * #action
+     */
+    setModalWidgets(flag: boolean): void;
     /**
      * #action
      */
     hideAllWidgets(): void;
+    afterAttach(): void;
+} & {
+    /**
+     * #action
+     * the modal's close button: a popped-out widget goes back to the drawer,
+     * and with no drawer to go back to the widget closes
+     */
+    closeModalWidget(): void;
+    /**
+     * #action
+     * adds the widget, replacing one with the same id, and shows it
+     */
+    openWidget(typeName: string, id: string, initialState?: any, conf?: unknown): any;
+} & {
     /**
      * #action
      * opens a configuration editor to configure the given thing,
@@ -108,7 +140,6 @@ export declare function DrawerWidgetSessionMixin(pluginManager: PluginManager):
     }, opts?: {
         expandedDisplayId?: string;
     }): void;
-    afterAttach(): void;
 }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree").ModelSnapshotType<{
     /**
      * #property

package/esm/Session/DrawerWidgets.js

@@ -1,6 +1,6 @@
 import { isConfigurationModel } from '@jbrowse/core/configuration';
-import { localStorageGetItem, localStorageSetItem } from '@jbrowse/core/util';
-import { addDisposer, getEnv, isAlive, isStateTreeNode, types, } from '@jbrowse/mobx-state-tree';
+import { localStorageGetItem, localStorageSetItem, scheduleDetachedDestroy, } from '@jbrowse/core/util';
+import { addDisposer, detach, getEnv, isAlive, isStateTreeNode, types, } from '@jbrowse/mobx-state-tree';
 import { autorun } from 'mobx';
 import { isBaseSession } from './BaseSession.js';
 const minDrawerWidth = 128;
@@ -89,6 +89,12 @@ export function DrawerWidgetSessionMixin(pluginManager) {
          * modal, with no drawer behind it, is disorienting
          */
         poppedOut: false,
+        /**
+         * #volatile
+         * set by a host with no room for a drawer column beside its views (a
+         * phone), so every widget shows in a modal instead
+         */
+        modalWidgets: false,
     }))
         .views(self => ({
         /**
@@ -102,7 +108,20 @@ export function DrawerWidgetSessionMixin(pluginManager) {
          * the modal and the drawer at once.
          */
         get drawerVisible() {
-            return Boolean(self.visibleWidget) && !self.minimized && !self.poppedOut;
+            return (Boolean(self.visibleWidget) &&
+                !self.minimized &&
+                !self.poppedOut &&
+                !self.modalWidgets);
+        },
+        /**
+         * #getter
+         * whether the visible widget shows in a modal: popped out of the drawer,
+         * or on a host with no room for one
+         */
+        get modalWidgetVisible() {
+            return (Boolean(self.visibleWidget) &&
+                !self.minimized &&
+                (self.poppedOut || self.modalWidgets));
         },
     }))
         .actions(self => ({
@@ -152,12 +171,19 @@ export function DrawerWidgetSessionMixin(pluginManager) {
         },
         /**
          * #action
+         * closes the widget, and removes it from the session when its type sets
+         * `discardOnClose`. Minimizing the drawer is not closing.
          */
         hideWidget(widget) {
             self.activeWidgets.delete(widget.id);
             if (self.activeWidgets.size === 0) {
                 self.poppedOut = false;
             }
+            if (self.widgets.get(widget.id) === widget &&
+                pluginManager.getWidgetType(widget.type).discardOnClose) {
+                detach(widget);
+                scheduleDetachedDestroy(widget);
+            }
         },
         /**
          * #action
@@ -184,13 +210,53 @@ export function DrawerWidgetSessionMixin(pluginManager) {
         returnWidgetToDrawer() {
             self.poppedOut = false;
         },
+        /**
+         * #action
+         */
+        setModalWidgets(flag) {
+            self.modalWidgets = flag;
+        },
         /**
          * #action
          */
         hideAllWidgets() {
-            self.activeWidgets.clear();
+            for (const widget of [...self.activeWidgets.values()]) {
+                this.hideWidget(widget);
+            }
             self.poppedOut = false;
         },
+        afterAttach() {
+            addDisposer(self, autorun(function drawerPositionAutorun() {
+                localStorageSetItem('drawerPosition', self.drawerPosition);
+            }, { name: 'DrawerPosition' }));
+        },
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         * the modal's close button: a popped-out widget goes back to the drawer,
+         * and with no drawer to go back to the widget closes
+         */
+        closeModalWidget() {
+            const widget = self.visibleWidget;
+            if (self.modalWidgets && widget) {
+                self.hideWidget(widget);
+            }
+            else {
+                self.returnWidgetToDrawer();
+            }
+        },
+        /**
+         * #action
+         * adds the widget, replacing one with the same id, and shows it
+         */
+        openWidget(typeName, id, initialState = {}, conf) {
+            const widget = self.addWidget(typeName, id, initialState, conf);
+            self.showWidget(widget);
+            return widget;
+        },
+    }))
+        .actions(self => ({
         /**
          * #action
          * opens a configuration editor to configure the given thing,
@@ -212,16 +278,10 @@ export function DrawerWidgetSessionMixin(pluginManager) {
             else {
                 throw new Error('must pass a configuration model or frozen config with trackId to editConfiguration');
             }
-            const editor = this.addWidget('ConfigurationEditorWidget', 'configEditor', {});
+            const editor = self.openWidget('ConfigurationEditorWidget', 'configEditor');
             // Set target via action since it's now volatile
             editor.setTarget(targetConfig);
             editor.setExpandedDisplayId(opts?.expandedDisplayId);
-            this.showWidget(editor);
-        },
-        afterAttach() {
-            addDisposer(self, autorun(function drawerPositionAutorun() {
-                localStorageSetItem('drawerPosition', self.drawerPosition);
-            }, { name: 'DrawerPosition' }));
         },
     }))
         .postProcessSnapshot(snap => {