@jbrowse/plugin-linear-genome-view 1.4.4 → 1.5.0

package/dist/plugin-linear-genome-view.esm.js

@@ -15,13 +15,14 @@ import Typography from '@material-ui/core/Typography';
 import MenuOpenIcon from '@material-ui/icons/MenuOpen';
 import { autorun, when, transaction } from 'mobx';
 import { getParent, types, cast, isAlive, addDisposer, getEnv, resolveIdentifier, getRoot, getSnapshot } from 'mobx-state-tree';
-import { useTheme, makeStyles as makeStyles$1, alpha, Portal, TextField, CircularProgress, InputAdornment, Typography as Typography$1, Popper, Tooltip as Tooltip$1, Popover, Dialog, DialogTitle, IconButton as IconButton$1, Divider, DialogContent, DialogContentText, TableContainer, Paper as Paper$1, Table, TableHead, TableRow, TableCell, TableBody, Button as Button$1, DialogActions, Container, Grid, FormControlLabel, Checkbox } from '@material-ui/core';
+import { useTheme, makeStyles as makeStyles$1, alpha, Portal, TextField, Typography as Typography$1, Popper, CircularProgress, InputAdornment, Tooltip as Tooltip$1, Popover, FormGroup, Button as Button$1, Dialog, DialogTitle, IconButton as IconButton$1, Divider, DialogContent, DialogContentText, TableContainer, Paper as Paper$1, Table, TableHead, TableRow, TableCell, TableBody, DialogActions, Container, Grid, FormControlLabel, Checkbox } from '@material-ui/core';
 import { Menu, ResizeHandle } from '@jbrowse/core/ui';
 import { observer, PropTypes } from 'mobx-react';
 import { usePopper } from 'react-popper';
 import { makeStyles, alpha as alpha$1, useTheme as useTheme$1 } from '@material-ui/core/styles';
 import { ContentBlock as ContentBlock$1, ElidedBlock as ElidedBlock$1, InterRegionPaddingBlock as InterRegionPaddingBlock$1 } from '@jbrowse/core/util/blockTypes';
 import { Region, ElementId } from '@jbrowse/core/util/types/mst';
+import { isRetryException } from '@jbrowse/core/util/types';
 import RefreshIcon from '@material-ui/icons/Refresh';
 import { ConfigurationReference } from '@jbrowse/core/configuration/configurationSchema';
 import calculateDynamicBlocks from '@jbrowse/core/util/calculateDynamicBlocks';
@@ -37,7 +38,6 @@ import ZoomIn from '@material-ui/icons/ZoomIn';
 import clone from 'clone';
 import { saveAs } from 'file-saver';
 import { renderToStaticMarkup } from 'react-dom/server';
-import FormGroup from '@material-ui/core/FormGroup';
 import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
 import ArrowBackIcon from '@material-ui/icons/ArrowBack';
 import BaseResult, { RefSequenceResult } from '@jbrowse/core/TextSearch/BaseResults';
@@ -282,6 +282,8 @@ function _assertThisInitialized(self) {
 function _possibleConstructorReturn(self, call) {
   if (call && (typeof call === "object" || typeof call === "function")) {
     return call;
+  } else if (call !== void 0) {
+    throw new TypeError("Derived constructors may only return object or undefined");
   }
 
   return _assertThisInitialized(self);
@@ -545,11 +547,9 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
 
 
     var IteratorPrototype = {};
-
-    IteratorPrototype[iteratorSymbol] = function () {
+    define(IteratorPrototype, iteratorSymbol, function () {
       return this;
-    };
-
+    });
     var getProto = Object.getPrototypeOf;
     var NativeIteratorPrototype = getProto && getProto(getProto(values([])));
 
@@ -560,8 +560,9 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
     }
 
     var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
-    GeneratorFunction.prototype = Gp.constructor = GeneratorFunctionPrototype;
-    GeneratorFunctionPrototype.constructor = GeneratorFunction;
+    GeneratorFunction.prototype = GeneratorFunctionPrototype;
+    define(Gp, "constructor", GeneratorFunctionPrototype);
+    define(GeneratorFunctionPrototype, "constructor", GeneratorFunction);
     GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"); // Helper for defining the .next, .throw, and .return methods of the
     // Iterator interface in terms of a single ._invoke method.
 
@@ -666,11 +667,9 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
     }
 
     defineIteratorMethods(AsyncIterator.prototype);
-
-    AsyncIterator.prototype[asyncIteratorSymbol] = function () {
+    define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
       return this;
-    };
-
+    });
     exports.AsyncIterator = AsyncIterator; // Note that simple async functions are implemented on top of
     // AsyncIterator objects; they just return a Promise for the value of
     // the final result produced by the iterator.
@@ -847,13 +846,12 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
     // object to not be returned from this call. This ensures that doesn't happen.
     // See https://github.com/facebook/regenerator/issues/274 for more details.
 
-    Gp[iteratorSymbol] = function () {
+    define(Gp, iteratorSymbol, function () {
       return this;
-    };
-
-    Gp.toString = function () {
+    });
+    define(Gp, "toString", function () {
       return "[object Generator]";
-    };
+    });
 
     function pushTryEntry(locs) {
       var entry = {
@@ -1165,14 +1163,19 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
   } catch (accidentalStrictMode) {
     // This module should not be running in strict mode, so the above
     // assignment should always work unless something is misconfigured. Just
-    // in case runtime.js accidentally runs in strict mode, we can escape
+    // in case runtime.js accidentally runs in strict mode, in modern engines
+    // we can explicitly access globalThis. In older engines we can escape
     // strict mode using a global Function call. This could conceivably fail
     // if a Content Security Policy forbids using Function, but in that case
     // the proper solution is to fix the accidental strict mode problem. If
     // you've misconfigured your bundler to force strict mode and applied a
     // CSP to forbid Function, and you're not willing to fix either of those
     // problems, please detail your unique predicament in a GitHub issue.
-    Function("r", "regeneratorRuntime = r")(runtime);
+    if (typeof globalThis === "object") {
+      globalThis.regeneratorRuntime = runtime;
+    } else {
+      Function("r", "regeneratorRuntime = r")(runtime);
+    }
   }
 });
 
@@ -1390,7 +1393,10 @@ var Tooltip = /*#__PURE__*/observer(function (_ref2) {
           bottom: y,
           right: x,
           width: 0,
-          height: 0
+          height: 0,
+          x: x,
+          y: y,
+          toJSON: function toJSON() {}
         };
       }
     };
@@ -1776,6 +1782,10 @@ var blockState = /*#__PURE__*/types.model('BlockState', {
       self.error = error;
       self.renderProps = undefined;
       renderInProgress = undefined;
+
+      if (isRetryException(error)) {
+        this.reload();
+      }
     },
     reload: function reload() {
       self.renderInProgress = undefined;
@@ -2411,8 +2421,8 @@ function stateModelFactory(configSchema) {
 function fetchResults(_x, _x2, _x3) {
   return _fetchResults.apply(this, arguments);
 } // the logic of this method is to only apply a filter to RefSequenceResults
-// because they do not have a matchedObject. the trix search results
-// already filter so don't need re-filtering
+// because they do not have a matchedObject. the trix search results already
+// filter so don't need re-filtering
 
 
 function _fetchResults() {
@@ -2494,10 +2504,15 @@ function RefNameAutocomplete(_ref) {
       currentSearch = _useState6[0],
       setCurrentSearch = _useState6[1];
 
-  var _useState7 = useState([]),
+  var _useState7 = useState(''),
       _useState8 = _slicedToArray(_useState7, 2),
-      searchOptions = _useState8[0],
-      setSearchOptions = _useState8[1];
+      inputValue = _useState8[0],
+      setInputValue = _useState8[1];
+
+  var _useState9 = useState([]),
+      _useState10 = _slicedToArray(_useState9, 2),
+      searchOptions = _useState10[0],
+      setSearchOptions = _useState10[1];
 
   var debouncedSearch = useDebounce(currentSearch, 300);
   var coarseVisibleLocStrings = model.coarseVisibleLocStrings,
@@ -2542,20 +2557,23 @@ function RefNameAutocomplete(_ref) {
             case 6:
               results = _context.sent;
 
-              if (results && results.length >= 0 && active) {
-                setSearchOptions(results.map(function (result) {
-                  return {
-                    result: result
-                  };
-                }));
+              if (active) {
+                if (results && results.length >= 0) {
+                  setSearchOptions(results.map(function (result) {
+                    return {
+                      result: result
+                    };
+                  }));
+                }
+
+                setLoaded(true);
               }
 
-              setLoaded(true);
-              _context.next = 15;
+              _context.next = 14;
               break;
 
-            case 11:
-              _context.prev = 11;
+            case 10:
+              _context.prev = 10;
               _context.t0 = _context["catch"](0);
               console.error(_context.t0);
 
@@ -2563,12 +2581,12 @@ function RefNameAutocomplete(_ref) {
                 session.notify("".concat(_context.t0), 'error');
               }
 
-            case 15:
+            case 14:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 11]]);
+      }, _callee, null, [[0, 10]]);
     }))();
 
     return function () {
@@ -2578,9 +2596,7 @@ function RefNameAutocomplete(_ref) {
   var inputBoxVal = coarseVisibleLocStrings || value || ''; // heuristic, text width + icon width, minimum 200
 
   var width = Math.min(Math.max(measureText(inputBoxVal, 16) + 25, 200), 550); // notes on implementation:
-  // selectOnFocus helps highlight the field when clicked
-  // blurOnSelect helps it so that when the user-re-clicks on the textfield,
-  // that selectOnFocus re-activates
+  // The selectOnFocus setting helps highlight the field when clicked
 
   return /*#__PURE__*/React.createElement(Autocomplete, {
     id: "refNameAutocomplete-".concat(model.id),
@@ -2592,12 +2608,15 @@ function RefNameAutocomplete(_ref) {
     freeSolo: true,
     includeInputInList: true,
     selectOnFocus: true,
-    blurOnSelect: true,
     style: _objectSpread2(_objectSpread2({}, style), {}, {
       width: width
     }),
     value: inputBoxVal,
     loading: !loaded,
+    inputValue: inputValue,
+    onInputChange: function onInputChange(event, newInputValue) {
+      return setInputValue(newInputValue);
+    },
     loadingText: "loading results",
     open: open,
     onOpen: function onOpen() {
@@ -2619,14 +2638,14 @@ function RefNameAutocomplete(_ref) {
 
       if (typeof selectedOption === 'string') {
         // handles string inputs on keyPress enter
-        var newResult = new BaseResult({
+        onSelect(new BaseResult({
           label: selectedOption
-        });
-        onSelect(newResult);
+        }));
       } else {
-        var result = selectedOption.result;
-        onSelect(result);
+        onSelect(selectedOption.result);
       }
+
+      setInputValue(inputBoxVal);
     },
     options: searchOptions.length === 0 ? options : searchOptions,
     getOptionDisabled: function getOptionDisabled(option) {
@@ -2646,7 +2665,13 @@ function RefNameAutocomplete(_ref) {
       var helperText = TextFieldProps.helperText,
           _TextFieldProps$Input = TextFieldProps.InputProps,
           InputProps = _TextFieldProps$Input === void 0 ? {} : _TextFieldProps$Input;
-      return /*#__PURE__*/React.createElement(TextField, Object.assign({}, params, TextFieldProps, {
+      return /*#__PURE__*/React.createElement(TextField, Object.assign({
+        onBlur: function onBlur() {
+          // this is used to restore a refName or the non-user-typed input
+          // to the box on blurring
+          setInputValue(inputBoxVal);
+        }
+      }, params, TextFieldProps, {
         helperText: helperText,
         InputProps: _objectSpread2(_objectSpread2(_objectSpread2({}, params.InputProps), InputProps), {}, {
           endAdornment: /*#__PURE__*/React.createElement(React.Fragment, null, regions.length === 0 ? /*#__PURE__*/React.createElement(CircularProgress, {
@@ -3328,9 +3353,17 @@ function ZoomControls(_ref) {
 
 var ZoomControls$1 = /*#__PURE__*/observer(ZoomControls);
 
+function dedupe(results) {
+  return results === null || results === void 0 ? void 0 : results.filter(function (elem, index, self) {
+    return index === self.findIndex(function (t) {
+      return t.getId() === elem.getId();
+    });
+  });
+}
+
 var WIDGET_HEIGHT = 32;
 var SPACING = 7;
-var useStyles$7 = /*#__PURE__*/makeStyles(function (theme) {
+var useStyles$7 = /*#__PURE__*/makeStyles$1(function (theme) {
   return {
     headerBar: {
       height: HEADER_BAR_HEIGHT,
@@ -3348,7 +3381,7 @@ var useStyles$7 = /*#__PURE__*/makeStyles(function (theme) {
       minWidth: 100
     },
     panButton: {
-      background: alpha$1(theme.palette.background.paper, 0.8),
+      background: alpha(theme.palette.background.paper, 0.8),
       height: WIDGET_HEIGHT,
       margin: SPACING
     },
@@ -3370,7 +3403,7 @@ var useStyles$7 = /*#__PURE__*/makeStyles(function (theme) {
 var Controls = /*#__PURE__*/observer(function (_ref) {
   var model = _ref.model;
   var classes = useStyles$7();
-  return /*#__PURE__*/React.createElement(Button, {
+  return /*#__PURE__*/React.createElement(Button$1, {
     onClick: model.activateTrackSelector,
     className: classes.toggleButton,
     title: "Open track selector",
@@ -3384,13 +3417,13 @@ var Controls = /*#__PURE__*/observer(function (_ref) {
 function PanControls(_ref2) {
   var model = _ref2.model;
   var classes = useStyles$7();
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button$1, {
     variant: "outlined",
     className: classes.panButton,
     onClick: function onClick() {
       return model.slide(-0.9);
     }
-  }, /*#__PURE__*/React.createElement(ArrowBackIcon, null)), /*#__PURE__*/React.createElement(Button, {
+  }, /*#__PURE__*/React.createElement(ArrowBackIcon, null)), /*#__PURE__*/React.createElement(Button$1, {
     variant: "outlined",
     className: classes.panButton,
     onClick: function onClick() {
@@ -3403,7 +3436,7 @@ var RegionWidth = /*#__PURE__*/observer(function (_ref3) {
   var model = _ref3.model;
   var classes = useStyles$7();
   var coarseTotalBp = model.coarseTotalBp;
-  return /*#__PURE__*/React.createElement(Typography, {
+  return /*#__PURE__*/React.createElement(Typography$1, {
     variant: "body2",
     color: "textSecondary",
     className: classes.bp
@@ -3412,43 +3445,19 @@ var RegionWidth = /*#__PURE__*/observer(function (_ref3) {
 var LinearGenomeViewHeader = /*#__PURE__*/observer(function (_ref4) {
   var model = _ref4.model;
   var classes = useStyles$7();
-  var theme = useTheme$1();
+  var theme = useTheme();
   var session = getSession(model);
-  var assemblyManager = session.assemblyManager,
-      textSearchManager = session.textSearchManager;
-  var contentBlocks = model.coarseDynamicBlocks,
-      displayedRegions = model.displayedRegions,
+  var textSearchManager = session.textSearchManager,
+      assemblyManager = session.assemblyManager;
+  var assemblyNames = model.assemblyNames,
       rankSearchResults = model.rankSearchResults;
-
-  var _ref5 = contentBlocks[0] || {
-    refName: ''
-  },
-      assemblyName = _ref5.assemblyName,
-      refName = _ref5.refName;
-
-  var assembly = assemblyName ? assemblyManager.get(assemblyName) : undefined;
-  var regions = (assembly === null || assembly === void 0 ? void 0 : assembly.regions) || [];
+  var assemblyName = assemblyNames[0];
+  var assembly = assemblyManager.get(assemblyName);
   var searchScope = model.searchScope(assemblyName);
 
   function fetchResults(_x) {
     return _fetchResults.apply(this, arguments);
   }
-  /**
-   * We first check to see if the identifier/label is an appropriate region,
-   * if it is then we set that as our displayed region
-   * if the label was not a valid region, then
-   *  1) we get the trackId and the location/locStr of the option we chose
-   *  2) we then use the label to try and fetch for exact matches through our
-   * textSearchManager
-   *  3) if we get any hits by requerying the textSearchManager, then we either
-   *  navigate to the single hit location or pop open the the dialog with all
-   *  the results from the search
-   *  4) if there were no hits from requerying, then we use (1) the chosen options'
-   *  trackId and locStr to navigate and show that track
-   *  5) error handling
-   * @param result - result chosen from dropdown
-   */
-
 
   function _fetchResults() {
     _fetchResults = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(queryString) {
@@ -3469,11 +3478,7 @@ var LinearGenomeViewHeader = /*#__PURE__*/observer(function (_ref4) {
 
             case 3:
               results = _context.sent;
-              return _context.abrupt("return", results === null || results === void 0 ? void 0 : results.filter(function (elem, index, self) {
-                return index === self.findIndex(function (t) {
-                  return t.getId() === elem.getId();
-                });
-              }));
+              return _context.abrupt("return", dedupe(results));
 
             case 5:
             case "end":
@@ -3485,84 +3490,78 @@ var LinearGenomeViewHeader = /*#__PURE__*/observer(function (_ref4) {
     return _fetchResults.apply(this, arguments);
   }
 
-  function setDisplayedRegion(_x2) {
-    return _setDisplayedRegion.apply(this, arguments);
+  function handleSelectedRegion(_x2) {
+    return _handleSelectedRegion.apply(this, arguments);
   }
 
-  function _setDisplayedRegion() {
-    _setDisplayedRegion = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(result) {
-      var label, newRegion, location, trackId, results;
+  function _handleSelectedRegion() {
+    _handleSelectedRegion = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(option) {
+      var trackId, location, label, _assembly$refNames, results;
+
       return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              if (!result) {
-                _context2.next = 14;
-                break;
-              }
+              trackId = option.getTrackId();
+              location = option.getLocation();
+              label = option.getLabel();
+              _context2.prev = 3;
 
-              label = result.getLabel();
-              newRegion = regions.find(function (region) {
-                return label === region.refName;
-              });
-
-              if (!newRegion) {
+              if (!(assembly !== null && assembly !== void 0 && (_assembly$refNames = assembly.refNames) !== null && _assembly$refNames !== void 0 && _assembly$refNames.includes(location))) {
                 _context2.next = 8;
                 break;
               }
 
-              model.setDisplayedRegions([newRegion]); // we use showAllRegions after setDisplayedRegions to make the entire
-              // region visible, xref #1703
-
-              model.showAllRegions();
-              _context2.next = 14;
+              model.navToLocString(location);
+              _context2.next = 19;
               break;
 
             case 8:
-              location = result.getLocation();
-              trackId = result.getTrackId();
-              _context2.next = 12;
+              _context2.next = 10;
               return fetchResults(label);
 
-            case 12:
+            case 10:
               results = _context2.sent;
 
-              if (results && results.length > 1) {
-                model.setSearchResults(results, label.toLowerCase());
-              } else {
-                if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
-                  location = results[0].getLocation();
-                  trackId = results[0].getTrackId();
-                }
+              if (!(results && results.length > 1)) {
+                _context2.next = 16;
+                break;
+              }
 
-                try {
-                  label !== '' && model.navToLocString(location);
-                } catch (e) {
-                  if ("".concat(e) === "Error: Unknown reference sequence \"".concat(label, "\"")) {
-                    model.setSearchResults(results, label.toLowerCase());
-                  } else {
-                    console.warn(e);
-                    session.notify("".concat(e), 'warning');
-                  }
-                }
+              model.setSearchResults(results, label.toLowerCase());
+              return _context2.abrupt("return");
 
-                try {
-                  if (trackId) {
-                    model.showTrack(trackId);
-                  }
-                } catch (e) {
-                  console.warn("'".concat(e, "' occurred while attempting to show track: ").concat(trackId));
-                }
+            case 16:
+              if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
+                location = results[0].getLocation();
+                trackId = results[0].getTrackId();
               }
 
-            case 14:
+            case 17:
+              model.navToLocString(location, assemblyName);
+
+              if (trackId) {
+                model.showTrack(trackId);
+              }
+
+            case 19:
+              _context2.next = 25;
+              break;
+
+            case 21:
+              _context2.prev = 21;
+              _context2.t0 = _context2["catch"](3);
+              console.error(_context2.t0);
+              session.notify("".concat(_context2.t0), 'warning');
+
+            case 25:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2);
+      }, _callee2, null, [[3, 21]]);
     }));
-    return _setDisplayedRegion.apply(this, arguments);
+    return _handleSelectedRegion.apply(this, arguments);
   }
 
   var controls = /*#__PURE__*/React.createElement("div", {
@@ -3577,9 +3576,8 @@ var LinearGenomeViewHeader = /*#__PURE__*/observer(function (_ref4) {
   }, /*#__PURE__*/React.createElement(PanControls, {
     model: model
   }), /*#__PURE__*/React.createElement(RefNameAutocomplete$1, {
-    onSelect: setDisplayedRegion,
+    onSelect: handleSelectedRegion,
     assemblyName: assemblyName,
-    value: displayedRegions.length > 1 ? '' : refName,
     model: model,
     TextFieldProps: {
       variant: 'outlined',
@@ -3592,7 +3590,7 @@ var LinearGenomeViewHeader = /*#__PURE__*/observer(function (_ref4) {
         style: {
           padding: 0,
           height: WIDGET_HEIGHT,
-          background: alpha$1(theme.palette.background.paper, 0.8)
+          background: alpha(theme.palette.background.paper, 0.8)
         }
       }
     }
@@ -4802,7 +4800,7 @@ var ErrorDisplay = /*#__PURE__*/observer(function (_ref) {
   }, "".concat(error));
 });
 var ImportForm = /*#__PURE__*/observer(function (_ref2) {
-  var _regions$;
+  var _regions$, _regions$2;
 
   var model = _ref2.model;
   var classes = useStyles$g();
@@ -4833,37 +4831,26 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
 
   var _useState5 = useState(),
       _useState6 = _slicedToArray(_useState5, 2),
-      mySelectedRegion = _useState6[0],
-      setSelectedRegion = _useState6[1];
+      myOption = _useState6[0],
+      setOption = _useState6[1]; // use this instead of useState initializer because the useState initializer
+  // won't update in response to an observable
 
-  var _useState7 = useState(),
-      _useState8 = _slicedToArray(_useState7, 2),
-      optionTrackId = _useState8[0],
-      setOptionTrackId = _useState8[1];
 
-  var _useState9 = useState(),
-      _useState10 = _slicedToArray(_useState9, 2),
-      optionLocation = _useState10[0],
-      setOptionLocation = _useState10[1];
-
-  var selectedRegion = mySelectedRegion || ((_regions$ = regions[0]) === null || _regions$ === void 0 ? void 0 : _regions$.refName);
+  var option = myOption || new RefSequenceResult({
+    refName: (_regions$ = regions[0]) === null || _regions$ === void 0 ? void 0 : _regions$.refName,
+    label: (_regions$2 = regions[0]) === null || _regions$2 === void 0 ? void 0 : _regions$2.refName
+  });
+  var selectedRegion = option === null || option === void 0 ? void 0 : option.getLocation();
 
   function fetchResults(_x) {
     return _fetchResults.apply(this, arguments);
   }
   /**
-   * We first check to see if the identifier/label is an appropriate region,
-   * if it is then we set that as our displayed region
-   * if the label was not a valid region, then
-   *  1) we get the trackId and the location/locStr of the option we chose
-   *  2) we then use the label to try and fetch for exact matches through our
-   * textSearchManager
-   *  3) if we get any hits by requerying the textSearchManager, then we either
-   *  navigate to single hit's location or pop open the the dialog with all the results
-   *  4) if there were no hits from requerying, then we use (1) the chosen options'
-   *  trackId and locStr to navigate and show that track
-   *  5) error handling
-   * @param input - selectedRegion/result label
+   * gets a string as input, or use stored option results from previous query,
+   * then re-query and
+   * 1) if it has multiple results: pop a dialog
+   * 2) if it's a single result navigate to it
+   * 3) else assume it's a locstring and navigate to it
    */
 
 
@@ -4886,11 +4873,7 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
 
             case 3:
               results = _context.sent;
-              return _context.abrupt("return", results === null || results === void 0 ? void 0 : results.filter(function (elem, index, self) {
-                return index === self.findIndex(function (t) {
-                  return t.getId() === elem.getId();
-                });
-              }));
+              return _context.abrupt("return", dedupe(results));
 
             case 5:
             case "end":
@@ -4904,76 +4887,83 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
 
   function handleSelectedRegion(_x2) {
     return _handleSelectedRegion.apply(this, arguments);
-  }
+  } // implementation notes:
+  // having this wrapped in a form allows intuitive use of enter key to submit
+
 
   function _handleSelectedRegion() {
     _handleSelectedRegion = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(input) {
-      var trackId, location, newRegion, results;
+      var trackId, location, _assembly$refNames, results;
+
       return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              trackId = optionTrackId;
-              location = optionLocation;
-              newRegion = regions.find(function (r) {
-                return selectedRegion === r.refName;
-              });
-
-              if (!newRegion) {
-                _context2.next = 8;
+              if (option) {
+                _context2.next = 2;
                 break;
               }
 
-              model.setDisplayedRegions([newRegion]); // we use showAllRegions after setDisplayedRegions to make the entire
-              // region visible, xref #1703
+              return _context2.abrupt("return");
 
-              model.showAllRegions();
-              _context2.next = 12;
+            case 2:
+              trackId = option.getTrackId();
+              location = input || option.getLocation() || '';
+              _context2.prev = 4;
+
+              if (!(assembly !== null && assembly !== void 0 && (_assembly$refNames = assembly.refNames) !== null && _assembly$refNames !== void 0 && _assembly$refNames.includes(location))) {
+                _context2.next = 9;
+                break;
+              }
+
+              model.navToLocString(location, selectedAsm);
+              _context2.next = 20;
               break;
 
-            case 8:
-              _context2.next = 10;
+            case 9:
+              _context2.next = 11;
               return fetchResults(input);
 
-            case 10:
+            case 11:
               results = _context2.sent;
 
-              if (results && results.length > 1) {
-                model.setSearchResults(results, input.toLowerCase());
-              } else {
-                if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
-                  location = results[0].getLocation();
-                  trackId = results[0].getTrackId();
-                }
+              if (!(results && results.length > 1)) {
+                _context2.next = 17;
+                break;
+              }
 
-                try {
-                  if (location) {
-                    model.navToLocString(location, selectedAsm);
-                  }
-                } catch (e) {
-                  if ("".concat(e) === "Error: Unknown reference sequence \"".concat(input, "\"")) {
-                    model.setSearchResults(results, input.toLocaleLowerCase());
-                  } else {
-                    console.warn(e);
-                    session.notify("".concat(e), 'warning');
-                  }
-                }
+              model.setSearchResults(results, input.toLowerCase());
+              return _context2.abrupt("return");
 
-                try {
-                  if (trackId) {
-                    model.showTrack(trackId);
-                  }
-                } catch (e) {
-                  console.warn("'".concat(e, "' occurred while attempting to show track: ").concat(trackId));
-                }
+            case 17:
+              if ((results === null || results === void 0 ? void 0 : results.length) === 1) {
+                location = results[0].getLocation();
+                trackId = results[0].getTrackId();
+              }
+
+            case 18:
+              model.navToLocString(location, selectedAsm);
+
+              if (trackId) {
+                model.showTrack(trackId);
               }
 
-            case 12:
+            case 20:
+              _context2.next = 26;
+              break;
+
+            case 22:
+              _context2.prev = 22;
+              _context2.t0 = _context2["catch"](4);
+              console.error(_context2.t0);
+              session.notify("".concat(_context2.t0), 'warning');
+
+            case 26:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2);
+      }, _callee2, null, [[4, 22]]);
     }));
     return _handleSelectedRegion.apply(this, arguments);
   }
@@ -4982,6 +4972,10 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
     error: err
   }) : null, /*#__PURE__*/React.createElement(Container, {
     className: classes.importFormContainer
+  }, /*#__PURE__*/React.createElement("form", {
+    onSubmit: function onSubmit(event) {
+      event.preventDefault();
+    }
   }, /*#__PURE__*/React.createElement(Grid, {
     container: true,
     spacing: 1,
@@ -5005,30 +4999,12 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
     assemblyName: message ? undefined : selectedAsm,
     value: selectedRegion,
     onSelect: function onSelect(option) {
-      setSelectedRegion(option.getLabel());
-      setOptionTrackId(option.getTrackId() || '');
-      setOptionLocation(option.getLocation());
+      setOption(option);
     },
     TextFieldProps: {
       margin: 'normal',
       variant: 'outlined',
-      helperText: 'Enter a sequence or location',
-      onBlur: function onBlur(event) {
-        if (event.target.value !== '') {
-          setSelectedRegion(event.target.value);
-        } else {
-          setSelectedRegion(regions[0].refName);
-        }
-      },
-      onKeyPress: function onKeyPress(event) {
-        var elt = event.target; // maybe check regular expression here to see if it's a
-        // locstring try defaulting exact matches to first exact
-        // match
-
-        if (event.key === 'Enter') {
-          handleSelectedRegion(elt.value);
-        }
-      }
+      helperText: 'Enter a sequence or location'
     }
   }) : /*#__PURE__*/React.createElement(CircularProgress, {
     role: "progressbar",
@@ -5037,6 +5013,7 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
   }) : null), /*#__PURE__*/React.createElement(Grid, {
     item: true
   }, /*#__PURE__*/React.createElement(Button$1, {
+    type: "submit",
     disabled: !selectedRegion,
     className: classes.button,
     onClick: function onClick() {
@@ -5057,7 +5034,7 @@ var ImportForm = /*#__PURE__*/observer(function (_ref2) {
     },
     variant: "contained",
     color: "secondary"
-  }, "Show all regions in assembly")))), isSearchDialogDisplayed ? /*#__PURE__*/React.createElement(SearchResultsDialog, {
+  }, "Show all regions in assembly"))))), isSearchDialogDisplayed ? /*#__PURE__*/React.createElement(SearchResultsDialog, {
     model: model,
     optAssemblyName: selectedAsm,
     handleClose: function handleClose() {
@@ -5385,20 +5362,17 @@ function mathPower(num) {
 }
 
 var useStyles$i = /*#__PURE__*/makeStyles(function () {
-  return (
-    /* theme */
-    {
-      majorTickLabel: {
-        fontSize: '11px'
-      },
-      majorTick: {
-        stroke: '#555'
-      },
-      minorTick: {
-        stroke: '#999'
-      }
+  return {
+    majorTickLabel: {
+      fontSize: '11px'
+    },
+    majorTick: {
+      stroke: '#555'
+    },
+    minorTick: {
+      stroke: '#999'
     }
-  );
+  };
 });
 
 function Ruler(_ref) {
@@ -5817,8 +5791,10 @@ var useStyles$k = /*#__PURE__*/makeStyles(function (theme) {
 function ExportSvgDlg(_ref) {
   var model = _ref.model,
       handleClose = _ref.handleClose;
+  // @ts-ignore
+  var offscreenCanvas = typeof OffscreenCanvas !== 'undefined';
 
-  var _useState = useState(typeof OffscreenCanvas !== 'undefined'),
+  var _useState = useState(offscreenCanvas),
       _useState2 = _slicedToArray(_useState, 2),
       rasterizeLayers = _useState2[0],
       setRasterizeLayers = _useState2[1];
@@ -5851,7 +5827,7 @@ function ExportSvgDlg(_ref) {
     }
   }), /*#__PURE__*/React.createElement(Typography$1, {
     display: "inline"
-  }, "Creating SVG")) : null, typeof OffscreenCanvas !== 'undefined' ? /*#__PURE__*/React.createElement(FormControlLabel, {
+  }, "Creating SVG")) : null, offscreenCanvas ? /*#__PURE__*/React.createElement(FormControlLabel, {
     control: /*#__PURE__*/React.createElement(Checkbox, {
       checked: rasterizeLayers,
       onChange: function onChange() {
@@ -5887,25 +5863,26 @@ function ExportSvgDlg(_ref) {
 
               case 5:
                 handleClose();
-                _context.next = 11;
+                _context.next = 12;
                 break;
 
               case 8:
                 _context.prev = 8;
                 _context.t0 = _context["catch"](2);
+                console.error(_context.t0);
                 setError(_context.t0);
 
-              case 11:
-                _context.prev = 11;
+              case 12:
+                _context.prev = 12;
                 setLoading(false);
-                return _context.finish(11);
+                return _context.finish(12);
 
-              case 14:
+              case 15:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[2, 8, 11, 14]]);
+        }, _callee, null, [[2, 8, 12, 15]]);
       }));
 
       function onClick() {
@@ -7018,8 +6995,7 @@ function stateModelFactory$1(pluginManager) {
       self.zoomTo(self.bpPerPx);
 
       if ( // already zoomed all the way in
-      targetBpPerPx < self.bpPerPx && self.bpPerPx === self.minBpPerPx || // already zoomed all the way out
-      targetBpPerPx > self.bpPerPx && self.bpPerPx === self.maxBpPerPx) {
+      targetBpPerPx < self.bpPerPx && self.bpPerPx === self.minBpPerPx || targetBpPerPx > self.bpPerPx && self.bpPerPx === self.maxBpPerPx) {
         return;
       }
 
@@ -7049,8 +7025,11 @@ function stateModelFactory$1(pluginManager) {
         var menuItems = [{
           label: 'Return to import form',
           onClick: function onClick() {
-            getSession(self).setDialogComponent(ReturnToImportFormDlg, {
-              model: self
+            getSession(self).queueDialog(function (doneCallback) {
+              return [ReturnToImportFormDlg, {
+                model: self,
+                handleClose: doneCallback
+              }];
             });
           },
           icon: FolderOpenIcon
@@ -7058,8 +7037,11 @@ function stateModelFactory$1(pluginManager) {
           label: 'Export SVG',
           icon: PhotoCameraIcon,
           onClick: function onClick() {
-            getSession(self).setDialogComponent(ExportSvgDlg, {
-              model: self
+            getSession(self).queueDialog(function (doneCallback) {
+              return [ExportSvgDlg, {
+                model: self,
+                handleClose: doneCallback
+              }];
             });
           }
         }, {
@@ -7278,6 +7260,7 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
   return types.compose('LinearBasicDisplay', BaseLinearDisplay$1, types.model({
     type: types.literal('LinearBasicDisplay'),
     trackShowLabels: types.maybe(types["boolean"]),
+    trackShowDescriptions: types.maybe(types["boolean"]),
     trackDisplayMode: types.maybe(types.string),
     trackMaxHeight: types.maybe(types.number),
     configuration: ConfigurationReference$1(configSchema)
@@ -7292,6 +7275,11 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
         return self.trackShowLabels !== undefined ? self.trackShowLabels : showLabels;
       },
 
+      get showDescriptions() {
+        var showDescriptions = getConf(self, ['renderer', 'showLabels']);
+        return self.trackShowDescriptions !== undefined ? self.trackShowDescriptions : showDescriptions;
+      },
+
       get maxHeight() {
         var maxHeight = getConf(self, ['renderer', 'maxHeight']);
         return self.trackMaxHeight !== undefined ? self.trackMaxHeight : maxHeight;
@@ -7306,6 +7294,7 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
         var configBlob = getConf(self, ['renderer']) || {};
         return self.rendererType.configSchema.create(_objectSpread2(_objectSpread2({}, configBlob), {}, {
           showLabels: this.showLabels,
+          showDescriptions: this.showDescriptions,
           displayMode: this.displayMode,
           maxHeight: this.maxHeight
         }), getEnv(self));
@@ -7317,6 +7306,9 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
       toggleShowLabels: function toggleShowLabels() {
         self.trackShowLabels = !self.showLabels;
       },
+      toggleShowDescriptions: function toggleShowDescriptions() {
+        self.trackShowDescriptions = !self.showDescriptions;
+      },
       setDisplayMode: function setDisplayMode(val) {
         self.trackDisplayMode = val;
       },
@@ -7343,6 +7335,14 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
           onClick: function onClick() {
             self.toggleShowLabels();
           }
+        }, {
+          label: 'Show descriptions',
+          icon: VisibilityIcon,
+          type: 'checkbox',
+          checked: self.showDescriptions,
+          onClick: function onClick() {
+            self.toggleShowDescriptions();
+          }
         }, {
           label: 'Display mode',
           icon: VisibilityIcon,
@@ -7357,8 +7357,11 @@ var stateModelFactory$2 = function stateModelFactory(configSchema) {
         }, {
           label: 'Set max height',
           onClick: function onClick() {
-            getSession(self).setDialogComponent(SetMaxHeightDlg, {
-              model: self
+            getSession(self).queueDialog(function (doneCallback) {
+              return [SetMaxHeightDlg, {
+                model: self,
+                handleClose: doneCallback
+              }];
             });
           }
         }]);
@@ -7469,7 +7472,7 @@ var LinearGenomeViewPlugin = /*#__PURE__*/function (_Plugin) {
     key: "configure",
     value: function configure(pluginManager) {
       if (isAbstractMenuManager(pluginManager.rootModel)) {
-        pluginManager.rootModel.appendToSubMenu(['File', 'Add'], {
+        pluginManager.rootModel.appendToSubMenu(['Add'], {
           label: 'Linear genome view',
           icon: LineStyleIcon,
           onClick: function onClick(session) {
@@ -7553,5 +7556,5 @@ var SetMaxHeight$1 = {
 };
 
 export default LinearGenomeViewPlugin;
-export { BaseLinearDisplay$1 as BaseLinearDisplay, BaseLinearDisplay as BaseLinearDisplayComponent, baseLinearDisplayConfigSchema, configSchemaFactory as linearBareDisplayConfigSchemaFactory, configSchemaFactory$1 as linearBasicDisplayConfigSchemaFactory, stateModelFactory$2 as linearBasicDisplayModelFactory, renderToSvg };
+export { BaseLinearDisplay$1 as BaseLinearDisplay, BaseLinearDisplay as BaseLinearDisplayComponent, RefNameAutocomplete$1 as RefNameAutocomplete, baseLinearDisplayConfigSchema, configSchemaFactory as linearBareDisplayConfigSchemaFactory, configSchemaFactory$1 as linearBasicDisplayConfigSchemaFactory, stateModelFactory$2 as linearBasicDisplayModelFactory, renderToSvg };
 //# sourceMappingURL=plugin-linear-genome-view.esm.js.map