@jbrowse/plugin-linear-genome-view 1.7.9 → 2.0.0

package/dist/BaseLinearDisplay/models/BaseLinearDisplayModel.js

@@ -1,582 +1,555 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
 });
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.BaseLinearDisplay = void 0;
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _core = require("@material-ui/core");
-
-var _models = require("@jbrowse/core/pluggableElementTypes/models");
-
-var _configuration = require("@jbrowse/core/configuration");
-
-var _util = require("@jbrowse/core/util");
-
-var _compositeMap = _interopRequireDefault(require("@jbrowse/core/util/compositeMap"));
-
-var _simpleFeature = require("@jbrowse/core/util/simpleFeature");
-
-var _tracks = require("@jbrowse/core/util/tracks");
-
-var _mobx = require("mobx");
-
-var _mobxStateTree = require("mobx-state-tree");
-
-var _MenuOpen = _interopRequireDefault(require("@material-ui/icons/MenuOpen"));
-
-var _BaseLinearDisplay = require("../components/BaseLinearDisplay");
-
-var _serverSideRenderedBlock = _interopRequireWildcard(require("./serverSideRenderedBlock"));
-
-var _excluded = ["blockState"];
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
+/* eslint-disable @typescript-eslint/no-explicit-any */
+var react_1 = __importDefault(require("react"));
+var material_1 = require("@mui/material");
+var models_1 = require("@jbrowse/core/pluggableElementTypes/models");
+var configuration_1 = require("@jbrowse/core/configuration");
+var util_1 = require("@jbrowse/core/util");
+var compositeMap_1 = __importDefault(require("@jbrowse/core/util/compositeMap"));
+var simpleFeature_1 = require("@jbrowse/core/util/simpleFeature");
+var tracks_1 = require("@jbrowse/core/util/tracks");
+var mobx_1 = require("mobx");
+var mobx_state_tree_1 = require("mobx-state-tree");
+// icons
+var MenuOpen_1 = __importDefault(require("@mui/icons-material/MenuOpen"));
+var BaseLinearDisplay_1 = require("../components/BaseLinearDisplay");
+var serverSideRenderedBlock_1 = __importStar(require("./serverSideRenderedBlock"));
 // stabilize clipid under test for snapshot
 function getId(id, index) {
-  var isJest = typeof jest === 'undefined';
-  return "clip-".concat(isJest ? id : 'jest', "-").concat(index);
+    var isJest = typeof jest === 'undefined';
+    return "clip-".concat(isJest ? id : 'jest', "-").concat(index);
 }
-
 function getDisplayStr(totalBytes) {
-  var displayBp;
-
-  if (Math.floor(totalBytes / 1000000) > 0) {
-    displayBp = "".concat(parseFloat((totalBytes / 1000000).toPrecision(3)), " Mb");
-  } else if (Math.floor(totalBytes / 1000) > 0) {
-    displayBp = "".concat(parseFloat((totalBytes / 1000).toPrecision(3)), " Kb");
-  } else {
-    displayBp = "".concat(Math.floor(totalBytes), " bytes");
-  }
-
-  return displayBp;
+    var displayBp;
+    if (Math.floor(totalBytes / 1000000) > 0) {
+        displayBp = "".concat(parseFloat((totalBytes / 1000000).toPrecision(3)), " Mb");
+    }
+    else if (Math.floor(totalBytes / 1000) > 0) {
+        displayBp = "".concat(parseFloat((totalBytes / 1000).toPrecision(3)), " Kb");
+    }
+    else {
+        displayBp = "".concat(Math.floor(totalBytes), " bytes");
+    }
+    return displayBp;
 }
-
 var minDisplayHeight = 20;
 var defaultDisplayHeight = 100;
-
-var BaseLinearDisplay = _mobxStateTree.types.compose('BaseLinearDisplay', _models.BaseDisplay, _mobxStateTree.types.model({
-  height: _mobxStateTree.types.optional(_mobxStateTree.types.refinement('displayHeight', _mobxStateTree.types.number, function (n) {
-    return n >= minDisplayHeight;
-  }), defaultDisplayHeight),
-  blockState: _mobxStateTree.types.map(_serverSideRenderedBlock.default),
-  userBpPerPxLimit: _mobxStateTree.types.maybe(_mobxStateTree.types.number),
-  userByteSizeLimit: _mobxStateTree.types.maybe(_mobxStateTree.types.number)
-})).volatile(function () {
-  return {
+exports.BaseLinearDisplay = mobx_state_tree_1.types
+    .compose('BaseLinearDisplay', models_1.BaseDisplay, mobx_state_tree_1.types.model({
+    height: mobx_state_tree_1.types.optional(mobx_state_tree_1.types.refinement('displayHeight', mobx_state_tree_1.types.number, function (n) { return n >= minDisplayHeight; }), defaultDisplayHeight),
+    blockState: mobx_state_tree_1.types.map(serverSideRenderedBlock_1.default),
+    userBpPerPxLimit: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.number),
+    userByteSizeLimit: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.number),
+}))
+    .volatile(function () { return ({
     currBpPerPx: 0,
     message: '',
     featureIdUnderMouse: undefined,
     contextMenuFeature: undefined,
     scrollTop: 0,
     estimatedRegionStatsP: undefined,
-    estimatedRegionStats: undefined
-  };
-}).views(function (self) {
-  return {
+    estimatedRegionStats: undefined,
+}); })
+    .views(function (self) { return ({
     get blockType() {
-      return 'staticBlocks';
+        return 'staticBlocks';
     },
-
     get blockDefinitions() {
-      var blockType = this.blockType;
-      var view = (0, _util.getContainingView)(self);
-
-      if (!view.initialized) {
-        throw new Error('view not initialized yet');
-      }
-
-      return view[blockType];
-    }
-
-  };
-}).views(function (self) {
-  return {
+        var blockType = this.blockType;
+        var view = (0, util_1.getContainingView)(self);
+        if (!view.initialized) {
+            throw new Error('view not initialized yet');
+        }
+        return view[blockType];
+    },
+}); })
+    .views(function (self) { return ({
     /**
      * how many milliseconds to wait for the display to
      * "settle" before re-rendering a block
      */
     get renderDelay() {
-      return 50;
+        return 50;
     },
-
     get TooltipComponent() {
-      return _BaseLinearDisplay.Tooltip;
+        return BaseLinearDisplay_1.Tooltip;
     },
-
     /**
      * returns a string feature ID if the globally-selected object
      * is probably a feature
      */
     get selectedFeatureId() {
-      if ((0, _mobxStateTree.isAlive)(self)) {
-        var _getSession = (0, _util.getSession)(self),
-            selection = _getSession.selection; // does it quack like a feature?
-
-
-        if ((0, _simpleFeature.isFeature)(selection)) {
-          return selection.id();
+        if ((0, mobx_state_tree_1.isAlive)(self)) {
+            var selection = (0, util_1.getSession)(self).selection;
+            // does it quack like a feature?
+            if ((0, simpleFeature_1.isFeature)(selection)) {
+                return selection.id();
+            }
         }
-      }
-
-      return undefined;
+        return undefined;
     },
-
     /**
      * if a display-level message should be displayed instead of the blocks,
      * make this return a react component
      */
     get DisplayMessageComponent() {
-      return undefined;
-    }
-
-  };
-}).views(function (self) {
-  return {
+        return undefined;
+    },
+}); })
+    .views(function (self) { return ({
     /**
      * a CompositeMap of `featureId -> feature obj` that
      * just looks in all the block data for that feature
      */
     get features() {
-      var featureMaps = [];
-
-      var _iterator = _createForOfIteratorHelper(self.blockState.values()),
-          _step;
-
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var block = _step.value;
-
-          if (block && block.features) {
-            featureMaps.push(block.features);
-          }
+        var e_1, _a;
+        var featureMaps = [];
+        try {
+            for (var _b = __values(self.blockState.values()), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var block = _c.value;
+                if (block && block.features) {
+                    featureMaps.push(block.features);
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_1) throw e_1.error; }
         }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-
-      return new _compositeMap.default(featureMaps);
-    },
-
+        return new compositeMap_1.default(featureMaps);
+    },
     get featureUnderMouse() {
-      var feat = self.featureIdUnderMouse;
-      return feat ? this.features.get(feat) : undefined;
+        var feat = self.featureIdUnderMouse;
+        return feat ? this.features.get(feat) : undefined;
     },
-
-    getFeatureOverlapping: function getFeatureOverlapping(blockKey, x, y) {
-      var _self$blockState$get, _self$blockState$get$;
-
-      return (_self$blockState$get = self.blockState.get(blockKey)) === null || _self$blockState$get === void 0 ? void 0 : (_self$blockState$get$ = _self$blockState$get.layout) === null || _self$blockState$get$ === void 0 ? void 0 : _self$blockState$get$.getByCoord(x, y);
+    getFeatureOverlapping: function (blockKey, x, y) {
+        var _a, _b;
+        return (_b = (_a = self.blockState.get(blockKey)) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.getByCoord(x, y);
     },
-    getFeatureByID: function getFeatureByID(blockKey, id) {
-      var _self$blockState$get2, _self$blockState$get3;
-
-      return (_self$blockState$get2 = self.blockState.get(blockKey)) === null || _self$blockState$get2 === void 0 ? void 0 : (_self$blockState$get3 = _self$blockState$get2.layout) === null || _self$blockState$get3 === void 0 ? void 0 : _self$blockState$get3.getByID(id);
+    getFeatureByID: function (blockKey, id) {
+        var _a, _b;
+        return (_b = (_a = self.blockState.get(blockKey)) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.getByID(id);
     },
     // if block key is not supplied, can look at all blocks
-    searchFeatureByID: function searchFeatureByID(id) {
-      var ret;
-      self.blockState.forEach(function (block) {
-        var _block$layout;
-
-        var val = block === null || block === void 0 ? void 0 : (_block$layout = block.layout) === null || _block$layout === void 0 ? void 0 : _block$layout.getByID(id);
-
-        if (val) {
-          ret = val;
-        }
-      });
-      return ret;
+    searchFeatureByID: function (id) {
+        var ret;
+        self.blockState.forEach(function (block) {
+            var _a;
+            var val = (_a = block === null || block === void 0 ? void 0 : block.layout) === null || _a === void 0 ? void 0 : _a.getByID(id);
+            if (val) {
+                ret = val;
+            }
+        });
+        return ret;
     },
-
     get currentBytesRequested() {
-      var _self$estimatedRegion;
-
-      return ((_self$estimatedRegion = self.estimatedRegionStats) === null || _self$estimatedRegion === void 0 ? void 0 : _self$estimatedRegion.bytes) || 0;
+        var _a;
+        return ((_a = self.estimatedRegionStats) === null || _a === void 0 ? void 0 : _a.bytes) || 0;
     },
-
     get currentFeatureScreenDensity() {
-      var _self$estimatedRegion2;
-
-      var view = (0, _util.getContainingView)(self);
-      return (((_self$estimatedRegion2 = self.estimatedRegionStats) === null || _self$estimatedRegion2 === void 0 ? void 0 : _self$estimatedRegion2.featureDensity) || 0) * view.bpPerPx;
+        var _a;
+        var view = (0, util_1.getContainingView)(self);
+        return (((_a = self.estimatedRegionStats) === null || _a === void 0 ? void 0 : _a.featureDensity) || 0) * view.bpPerPx;
     },
-
     get maxFeatureScreenDensity() {
-      return (0, _configuration.getConf)(self, 'maxFeatureScreenDensity');
+        return (0, configuration_1.getConf)(self, 'maxFeatureScreenDensity');
     },
-
     get estimatedStatsReady() {
-      return !!self.estimatedRegionStats;
+        return !!self.estimatedRegionStats;
     },
-
     get maxAllowableBytes() {
-      var _self$estimatedRegion3;
-
-      return self.userByteSizeLimit || ((_self$estimatedRegion3 = self.estimatedRegionStats) === null || _self$estimatedRegion3 === void 0 ? void 0 : _self$estimatedRegion3.fetchSizeLimit) || (0, _configuration.getConf)(self, 'fetchSizeLimit');
-    }
-
-  };
-}).actions(function (self) {
-  return {
+        var _a;
+        return (self.userByteSizeLimit ||
+            ((_a = self.estimatedRegionStats) === null || _a === void 0 ? void 0 : _a.fetchSizeLimit) ||
+            (0, configuration_1.getConf)(self, 'fetchSizeLimit'));
+    },
+}); })
+    .actions(function (self) { return ({
     // base display reload does nothing, see specialized displays for details
-    setMessage: function setMessage(message) {
-      self.message = message;
-    },
-    afterAttach: function afterAttach() {
-      var _this = this;
-
-      // watch the parent's blocks to update our block state when they change,
-      // then we recreate the blocks on our own model (creating and deleting to
-      // match the parent blocks)
-      var blockWatchDisposer = (0, _mobx.autorun)(function () {
-        var blocksPresent = {};
-        var view = (0, _util.getContainingView)(self);
-
-        if (view.initialized) {
-          self.blockDefinitions.contentBlocks.forEach(function (block) {
-            blocksPresent[block.key] = true;
-
-            if (!self.blockState.has(block.key)) {
-              _this.addBlock(block.key, block);
-            }
-          });
-          self.blockState.forEach(function (_, key) {
-            if (!blocksPresent[key]) {
-              _this.deleteBlock(key);
+    setMessage: function (message) {
+        self.message = message;
+    },
+    afterAttach: function () {
+        var _this = this;
+        // watch the parent's blocks to update our block state when they change,
+        // then we recreate the blocks on our own model (creating and deleting to
+        // match the parent blocks)
+        var blockWatchDisposer = (0, mobx_1.autorun)(function () {
+            var blocksPresent = {};
+            var view = (0, util_1.getContainingView)(self);
+            if (view.initialized) {
+                self.blockDefinitions.contentBlocks.forEach(function (block) {
+                    blocksPresent[block.key] = true;
+                    if (!self.blockState.has(block.key)) {
+                        _this.addBlock(block.key, block);
+                    }
+                });
+                self.blockState.forEach(function (_, key) {
+                    if (!blocksPresent[key]) {
+                        _this.deleteBlock(key);
+                    }
+                });
             }
-          });
-        }
-      });
-      (0, _mobxStateTree.addDisposer)(self, blockWatchDisposer);
+        });
+        (0, mobx_state_tree_1.addDisposer)(self, blockWatchDisposer);
     },
-    estimateRegionsStats: function estimateRegionsStats(regions, opts) {
-      var _this2 = this;
-
-      if (self.estimatedRegionStatsP) {
-        return self.estimatedRegionStatsP;
-      }
-
-      var _getSession2 = (0, _util.getSession)(self),
-          rpcManager = _getSession2.rpcManager;
-
-      var adapterConfig = self.adapterConfig;
-
-      if (!adapterConfig) {
-        // A track extending the base track might not have an adapter config
-        // e.g. Apollo tracks don't use adapters
-        return Promise.resolve({});
-      }
-
-      var sessionId = (0, _tracks.getRpcSessionId)(self);
-
-      var params = _objectSpread({
-        sessionId: sessionId,
-        regions: regions,
-        adapterConfig: adapterConfig,
-        statusCallback: function statusCallback(message) {
-          if ((0, _mobxStateTree.isAlive)(self)) {
-            _this2.setMessage(message);
-          }
+    estimateRegionsStats: function (regions, opts) {
+        var _this = this;
+        if (self.estimatedRegionStatsP) {
+            return self.estimatedRegionStatsP;
+        }
+        var rpcManager = (0, util_1.getSession)(self).rpcManager;
+        var adapterConfig = self.adapterConfig;
+        if (!adapterConfig) {
+            // A track extending the base track might not have an adapter config
+            // e.g. Apollo tracks don't use adapters
+            return Promise.resolve({});
         }
-      }, opts);
-
-      self.estimatedRegionStatsP = rpcManager.call(sessionId, 'CoreEstimateRegionStats', params).catch(function (e) {
-        _this2.setRegionStatsP(undefined);
-
-        throw e;
-      });
-      return self.estimatedRegionStatsP;
-    },
-    setRegionStatsP: function setRegionStatsP(p) {
-      self.estimatedRegionStatsP = p;
-    },
-    setRegionStats: function setRegionStats(estimatedRegionStats) {
-      self.estimatedRegionStats = estimatedRegionStats;
-    },
-    clearRegionStats: function clearRegionStats() {
-      self.estimatedRegionStatsP = undefined;
-      self.estimatedRegionStats = undefined;
-    },
-    setHeight: function setHeight(displayHeight) {
-      if (displayHeight > minDisplayHeight) {
-        self.height = displayHeight;
-      } else {
-        self.height = minDisplayHeight;
-      }
-
-      return self.height;
-    },
-    resizeHeight: function resizeHeight(distance) {
-      var oldHeight = self.height;
-      var newHeight = this.setHeight(self.height + distance);
-      return newHeight - oldHeight;
-    },
-    setScrollTop: function setScrollTop(scrollTop) {
-      self.scrollTop = scrollTop;
-    },
-    updateStatsLimit: function updateStatsLimit(stats) {
-      var view = (0, _util.getContainingView)(self);
-
-      if (stats.bytes) {
-        self.userByteSizeLimit = stats.bytes;
-      } else {
-        self.userBpPerPxLimit = view.bpPerPx;
-      }
-    },
-    addBlock: function addBlock(key, block) {
-      self.blockState.set(key, _serverSideRenderedBlock.default.create({
-        key: key,
-        region: block.toRegion()
-      }));
-    },
-    setCurrBpPerPx: function setCurrBpPerPx(n) {
-      self.currBpPerPx = n;
-    },
-    deleteBlock: function deleteBlock(key) {
-      self.blockState.delete(key);
-    },
-    selectFeature: function selectFeature(feature) {
-      var session = (0, _util.getSession)(self);
-
-      if ((0, _util.isSessionModelWithWidgets)(session)) {
-        var featureWidget = session.addWidget('BaseFeatureWidget', 'baseFeature', {
-          featureData: feature.toJSON(),
-          view: (0, _util.getContainingView)(self)
+        var sessionId = (0, tracks_1.getRpcSessionId)(self);
+        var params = __assign({ sessionId: sessionId, regions: regions, adapterConfig: adapterConfig, statusCallback: function (message) {
+                if ((0, mobx_state_tree_1.isAlive)(self)) {
+                    _this.setMessage(message);
+                }
+            } }, opts);
+        self.estimatedRegionStatsP = rpcManager
+            .call(sessionId, 'CoreEstimateRegionStats', params)
+            .catch(function (e) {
+            _this.setRegionStatsP(undefined);
+            throw e;
         });
-        session.showWidget(featureWidget);
-      }
-
-      if ((0, _util.isSelectionContainer)(session)) {
-        session.setSelection(feature);
-      }
-    },
-    clearFeatureSelection: function clearFeatureSelection() {
-      var session = (0, _util.getSession)(self);
-      session.clearSelection();
-    },
-    setFeatureIdUnderMouse: function setFeatureIdUnderMouse(feature) {
-      self.featureIdUnderMouse = feature;
-    },
-    reload: function reload() {
-      ;
-      (0, _toConsumableArray2.default)(self.blockState.values()).map(function (val) {
-        return val.doReload();
-      });
-    },
-    setContextMenuFeature: function setContextMenuFeature(feature) {
-      self.contextMenuFeature = feature;
-    }
-  };
-}).views(function (self) {
-  return {
+        return self.estimatedRegionStatsP;
+    },
+    setRegionStatsP: function (p) {
+        self.estimatedRegionStatsP = p;
+    },
+    setRegionStats: function (estimatedRegionStats) {
+        self.estimatedRegionStats = estimatedRegionStats;
+    },
+    clearRegionStats: function () {
+        self.estimatedRegionStatsP = undefined;
+        self.estimatedRegionStats = undefined;
+    },
+    setHeight: function (displayHeight) {
+        if (displayHeight > minDisplayHeight) {
+            self.height = displayHeight;
+        }
+        else {
+            self.height = minDisplayHeight;
+        }
+        return self.height;
+    },
+    resizeHeight: function (distance) {
+        var oldHeight = self.height;
+        var newHeight = this.setHeight(self.height + distance);
+        return newHeight - oldHeight;
+    },
+    setScrollTop: function (scrollTop) {
+        self.scrollTop = scrollTop;
+    },
+    updateStatsLimit: function (stats) {
+        var view = (0, util_1.getContainingView)(self);
+        if (stats.bytes) {
+            self.userByteSizeLimit = stats.bytes;
+        }
+        else {
+            self.userBpPerPxLimit = view.bpPerPx;
+        }
+    },
+    addBlock: function (key, block) {
+        self.blockState.set(key, serverSideRenderedBlock_1.default.create({
+            key: key,
+            region: block.toRegion(),
+        }));
+    },
+    setCurrBpPerPx: function (n) {
+        self.currBpPerPx = n;
+    },
+    deleteBlock: function (key) {
+        self.blockState.delete(key);
+    },
+    selectFeature: function (feature) {
+        var session = (0, util_1.getSession)(self);
+        if ((0, util_1.isSessionModelWithWidgets)(session)) {
+            var featureWidget = session.addWidget('BaseFeatureWidget', 'baseFeature', {
+                view: (0, util_1.getContainingView)(self),
+                track: (0, util_1.getContainingTrack)(self),
+                featureData: feature.toJSON(),
+            });
+            session.showWidget(featureWidget);
+        }
+        if ((0, util_1.isSelectionContainer)(session)) {
+            session.setSelection(feature);
+        }
+    },
+    clearFeatureSelection: function () {
+        var session = (0, util_1.getSession)(self);
+        session.clearSelection();
+    },
+    setFeatureIdUnderMouse: function (feature) {
+        self.featureIdUnderMouse = feature;
+    },
+    reload: function () {
+        ;
+        __spreadArray([], __read(self.blockState.values()), false).map(function (val) { return val.doReload(); });
+    },
+    setContextMenuFeature: function (feature) {
+        self.contextMenuFeature = feature;
+    },
+}); })
+    .views(function (self) { return ({
     // region is too large if:
     // - stats are ready
     // - region is greater than 20kb (don't warn when zoomed in less than that)
     // - and bytes > max allowed bytes || curr density>max density
     get regionTooLarge() {
-      var view = (0, _util.getContainingView)(self);
-
-      if (!self.estimatedStatsReady || view.dynamicBlocks.totalBp < 20000) {
-        return false;
-      }
-
-      var bpLimitOrDensity = self.userBpPerPxLimit ? view.bpPerPx > self.userBpPerPxLimit : self.currentFeatureScreenDensity > self.maxFeatureScreenDensity;
-      return self.currentBytesRequested > self.maxAllowableBytes || bpLimitOrDensity;
-    },
-
+        var view = (0, util_1.getContainingView)(self);
+        if (!self.estimatedStatsReady || view.dynamicBlocks.totalBp < 20000) {
+            return false;
+        }
+        var bpLimitOrDensity = self.userBpPerPxLimit
+            ? view.bpPerPx > self.userBpPerPxLimit
+            : self.currentFeatureScreenDensity > self.maxFeatureScreenDensity;
+        return (self.currentBytesRequested > self.maxAllowableBytes || bpLimitOrDensity);
+    },
     // only shows a message of bytes requested is defined, the feature density
     // based stats don't produce any helpful message besides to zoom in
     get regionTooLargeReason() {
-      var req = self.currentBytesRequested;
-      var max = self.maxAllowableBytes;
-      return req && req > max ? "Requested too much data (".concat(getDisplayStr(req), ")") : '';
-    }
-
-  };
-}).actions(function (self) {
-  var superReload = self.reload;
-  return {
-    reload: function reload() {
-      return (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        var aborter, view, estimatedRegionStats;
-        return _regenerator.default.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                self.setError();
-                aborter = new AbortController();
-                view = (0, _util.getContainingView)(self); // extra check for contentBlocks.length
-                // https://github.com/GMOD/jbrowse-components/issues/2694
-
-                if (!(!view.initialized || !view.staticBlocks.contentBlocks.length)) {
-                  _context.next = 5;
-                  break;
-                }
-
-                return _context.abrupt("return");
-
-              case 5:
-                _context.prev = 5;
-                self.estimatedRegionStatsP = self.estimateRegionsStats(view.staticBlocks.contentBlocks, {
-                  signal: aborter.signal
+        var req = self.currentBytesRequested;
+        var max = self.maxAllowableBytes;
+        return req && req > max
+            ? "Requested too much data (".concat(getDisplayStr(req), ")")
+            : '';
+    },
+}); })
+    .actions(function (self) {
+    var superReload = self.reload;
+    return {
+        reload: function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var aborter, view, estimatedRegionStats, e_2;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            self.setError();
+                            aborter = new AbortController();
+                            view = (0, util_1.getContainingView)(self);
+                            // extra check for contentBlocks.length
+                            // https://github.com/GMOD/jbrowse-components/issues/2694
+                            if (!view.initialized || !view.staticBlocks.contentBlocks.length) {
+                                return [2 /*return*/];
+                            }
+                            _a.label = 1;
+                        case 1:
+                            _a.trys.push([1, 3, , 4]);
+                            self.estimatedRegionStatsP = self.estimateRegionsStats(view.staticBlocks.contentBlocks, { signal: aborter.signal });
+                            return [4 /*yield*/, self.estimatedRegionStatsP];
+                        case 2:
+                            estimatedRegionStats = _a.sent();
+                            if ((0, mobx_state_tree_1.isAlive)(self)) {
+                                self.setRegionStats(estimatedRegionStats);
+                                superReload();
+                            }
+                            else {
+                                return [2 /*return*/];
+                            }
+                            return [3 /*break*/, 4];
+                        case 3:
+                            e_2 = _a.sent();
+                            console.error(e_2);
+                            self.setError(e_2);
+                            return [3 /*break*/, 4];
+                        case 4: return [2 /*return*/];
+                    }
                 });
-                _context.next = 9;
-                return self.estimatedRegionStatsP;
-
-              case 9:
-                estimatedRegionStats = _context.sent;
-
-                if (!(0, _mobxStateTree.isAlive)(self)) {
-                  _context.next = 15;
-                  break;
-                }
-
-                self.setRegionStats(estimatedRegionStats);
-                superReload();
-                _context.next = 16;
-                break;
-
-              case 15:
-                return _context.abrupt("return");
-
-              case 16:
-                _context.next = 22;
-                break;
-
-              case 18:
-                _context.prev = 18;
-                _context.t0 = _context["catch"](5);
-                console.error(_context.t0);
-                self.setError(_context.t0);
-
-              case 22:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee, null, [[5, 18]]);
-      }))();
-    },
-    afterAttach: function afterAttach() {
-      // this autorun performs stats estimation
-      //
-      // the chain of events calls estimateRegionsStats against the data
-      // adapter which by default uses featureDensity, but can also respond
-      // with a byte size estimate and fetch size limit (data adapter can
-      // define what is too much data)
-      (0, _mobxStateTree.addDisposer)(self, (0, _mobx.autorun)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-        var _self$estimatedRegion4, aborter, view, statsP, estimatedRegionStats;
-
-        return _regenerator.default.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                _context2.prev = 0;
-                aborter = new AbortController();
-                view = (0, _util.getContainingView)(self); // extra check for contentBlocks.length
-                // https://github.com/GMOD/jbrowse-components/issues/2694
-
-                if (!(!view.initialized || !view.staticBlocks.contentBlocks.length)) {
-                  _context2.next = 5;
-                  break;
-                }
-
-                return _context2.abrupt("return");
-
-              case 5:
-                if (!(((_self$estimatedRegion4 = self.estimatedRegionStats) === null || _self$estimatedRegion4 === void 0 ? void 0 : _self$estimatedRegion4.featureDensity) !== undefined)) {
-                  _context2.next = 8;
-                  break;
-                }
-
-                self.setCurrBpPerPx(view.bpPerPx);
-                return _context2.abrupt("return");
-
-              case 8:
-                if (!(view.bpPerPx === self.currBpPerPx)) {
-                  _context2.next = 10;
-                  break;
-                }
-
-                return _context2.abrupt("return");
-
-              case 10:
-                self.clearRegionStats();
-                self.setCurrBpPerPx(view.bpPerPx);
-                statsP = self.estimateRegionsStats(view.staticBlocks.contentBlocks, {
-                  signal: aborter.signal
+            });
+        },
+        afterAttach: function () {
+            var _this = this;
+            // this autorun performs stats estimation
+            //
+            // the chain of events calls estimateRegionsStats against the data
+            // adapter which by default uses featureDensity, but can also respond
+            // with a byte size estimate and fetch size limit (data adapter can
+            // define what is too much data)
+            (0, mobx_state_tree_1.addDisposer)(self, (0, mobx_1.autorun)(function () { return __awaiter(_this, void 0, void 0, function () {
+                var aborter, view, statsP, estimatedRegionStats, e_3;
+                var _a;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            _b.trys.push([0, 2, , 3]);
+                            aborter = new AbortController();
+                            view = (0, util_1.getContainingView)(self);
+                            // extra check for contentBlocks.length
+                            // https://github.com/GMOD/jbrowse-components/issues/2694
+                            if (!view.initialized ||
+                                !view.staticBlocks.contentBlocks.length) {
+                                return [2 /*return*/];
+                            }
+                            // don't re-estimate featureDensity even if zoom level changes,
+                            // jbrowse1-style assume it's sort of representative
+                            if (((_a = self.estimatedRegionStats) === null || _a === void 0 ? void 0 : _a.featureDensity) !== undefined) {
+                                self.setCurrBpPerPx(view.bpPerPx);
+                                return [2 /*return*/];
+                            }
+                            // we estimate stats once at a given zoom level
+                            if (view.bpPerPx === self.currBpPerPx) {
+                                return [2 /*return*/];
+                            }
+                            self.clearRegionStats();
+                            self.setCurrBpPerPx(view.bpPerPx);
+                            statsP = self.estimateRegionsStats(view.staticBlocks.contentBlocks, { signal: aborter.signal });
+                            self.setRegionStatsP(statsP);
+                            return [4 /*yield*/, statsP];
+                        case 1:
+                            estimatedRegionStats = _b.sent();
+                            if ((0, mobx_state_tree_1.isAlive)(self)) {
+                                self.setRegionStats(estimatedRegionStats);
+                            }
+                            return [3 /*break*/, 3];
+                        case 2:
+                            e_3 = _b.sent();
+                            if (!(0, util_1.isAbortException)(e_3) && (0, mobx_state_tree_1.isAlive)(self)) {
+                                console.error(e_3);
+                                self.setError(e_3);
+                            }
+                            return [3 /*break*/, 3];
+                        case 3: return [2 /*return*/];
+                    }
                 });
-                self.setRegionStatsP(statsP);
-                _context2.next = 16;
-                return statsP;
-
-              case 16:
-                estimatedRegionStats = _context2.sent;
-
-                if ((0, _mobxStateTree.isAlive)(self)) {
-                  self.setRegionStats(estimatedRegionStats);
-                }
-
-                _context2.next = 23;
-                break;
-
-              case 20:
-                _context2.prev = 20;
-                _context2.t0 = _context2["catch"](0);
-
-                if (!(0, _util.isAbortException)(_context2.t0) && (0, _mobxStateTree.isAlive)(self)) {
-                  console.error(_context2.t0);
-                  self.setError(_context2.t0);
-                }
-
-              case 23:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, null, [[0, 20]]);
-      })), {
-        delay: 500
-      }));
-    }
-  };
-}).views(function (self) {
-  return {
-    regionCannotBeRenderedText: function regionCannotBeRenderedText(_region) {
-      return self.regionTooLarge ? 'Force load to see features' : '';
+            }); }, { delay: 500 }));
+        },
+    };
+})
+    .views(function (self) { return ({
+    regionCannotBeRenderedText: function (_region) {
+        return self.regionTooLarge ? 'Force load to see features' : '';
     },
-
     /**
      * @param region -
      * @returns falsy if the region is fine to try rendering. Otherwise,
@@ -584,186 +557,135 @@ var BaseLinearDisplay = _mobxStateTree.types.compose('BaseLinearDisplay', _model
      *  string of text describes why it cannot be rendered
      *  react node allows user to force load at current setting
      */
-    regionCannotBeRendered: function regionCannotBeRendered(_region) {
-      var regionTooLarge = self.regionTooLarge,
-          regionTooLargeReason = self.regionTooLargeReason;
-
-      if (regionTooLarge) {
-        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_core.Typography, {
-          component: "span",
-          variant: "body2"
-        }, regionTooLargeReason ? regionTooLargeReason + '. ' : '', "Zoom in to see features or", ' '), /*#__PURE__*/_react.default.createElement(_core.Button, {
-          "data-testid": "force_reload_button",
-          onClick: function onClick() {
-            if (!self.estimatedRegionStats) {
-              console.error('No global stats?');
-            } else {
-              self.updateStatsLimit(self.estimatedRegionStats);
-              self.reload();
-            }
-          },
-          variant: "outlined"
-        }, "Force Load"), /*#__PURE__*/_react.default.createElement(_core.Typography, {
-          component: "span",
-          variant: "body2"
-        }, "(force load may be slow)"));
-      }
-
-      return undefined;
-    },
-    trackMenuItems: function trackMenuItems() {
-      return [];
-    },
-    contextMenuItems: function contextMenuItems() {
-      return self.contextMenuFeature ? [{
-        label: 'Open feature details',
-        icon: _MenuOpen.default,
-        onClick: function onClick() {
-          if (self.contextMenuFeature) {
-            self.selectFeature(self.contextMenuFeature);
-          }
-        }
-      }] : [];
-    },
-    renderProps: function renderProps() {
-      var view = (0, _util.getContainingView)(self);
-      return _objectSpread(_objectSpread({}, (0, _tracks.getParentRenderProps)(self)), {}, {
-        notReady: self.currBpPerPx !== view.bpPerPx || !self.estimatedRegionStats,
-        rpcDriverName: self.rpcDriverName,
-        displayModel: self,
-        onFeatureClick: function onFeatureClick(_, featureId) {
-          var f = featureId || self.featureIdUnderMouse;
-
-          if (!f) {
-            self.clearFeatureSelection();
-          } else {
-            var feature = self.features.get(f);
-
-            if (feature) {
-              self.selectFeature(feature);
-            }
-          }
-        },
-        onClick: function onClick() {
-          self.clearFeatureSelection();
-        },
-        // similar to click but opens a menu with further options
-        onFeatureContextMenu: function onFeatureContextMenu(_, featureId) {
-          var f = featureId || self.featureIdUnderMouse;
-
-          if (!f) {
-            self.clearFeatureSelection();
-          } else {
-            // feature id under mouse passed to context menu
-            self.setContextMenuFeature(self.features.get(f));
-          }
-        },
-        onMouseMove: function onMouseMove(_, featureId) {
-          self.setFeatureIdUnderMouse(featureId);
-        },
-        onMouseLeave: function onMouseLeave(_) {
-          self.setFeatureIdUnderMouse(undefined);
-        },
-        onContextMenu: function onContextMenu() {
-          self.setContextMenuFeature(undefined);
-          self.clearFeatureSelection();
+    regionCannotBeRendered: function (_region) {
+        var regionTooLarge = self.regionTooLarge, regionTooLargeReason = self.regionTooLargeReason;
+        if (regionTooLarge) {
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(material_1.Typography, { component: "span", variant: "body2" },
+                    regionTooLargeReason ? regionTooLargeReason + '. ' : '',
+                    "Zoom in to see features or",
+                    ' '),
+                react_1.default.createElement(material_1.Button, { "data-testid": "force_reload_button", onClick: function () {
+                        if (!self.estimatedRegionStats) {
+                            console.error('No global stats?');
+                        }
+                        else {
+                            self.updateStatsLimit(self.estimatedRegionStats);
+                            self.reload();
+                        }
+                    }, variant: "outlined" }, "Force Load"),
+                react_1.default.createElement(material_1.Typography, { component: "span", variant: "body2" }, "(force load may be slow)")));
         }
-      });
-    }
-  };
-}).actions(function (self) {
-  return {
-    renderSvg: function renderSvg(opts) {
-      return (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
-        var height, id, overrideHeight, view, viewOffsetPx, roundedDynamicBlocks, width, renderings;
-        return _regenerator.default.wrap(function _callee3$(_context3) {
-          while (1) {
-            switch (_context3.prev = _context3.next) {
-              case 0:
-                height = self.height, id = self.id;
-                overrideHeight = opts.overrideHeight;
-                view = (0, _util.getContainingView)(self);
-                viewOffsetPx = view.offsetPx, roundedDynamicBlocks = view.roundedDynamicBlocks, width = view.width;
-                _context3.next = 6;
-                return Promise.all(roundedDynamicBlocks.map(function (block) {
-                  var blockState = _serverSideRenderedBlock.default.create({
-                    key: block.key,
-                    region: block
-                  }); // regionCannotBeRendered can return jsx so look for plaintext
-                  // version, or just get the default if none available
-
-
-                  var cannotBeRenderedReason = self.regionCannotBeRenderedText(block) || self.regionCannotBeRendered(block);
-
-                  if (cannotBeRenderedReason) {
-                    return {
-                      reactElement: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("rect", {
-                        x: 0,
-                        y: 0,
-                        width: width,
-                        height: 20,
-                        fill: "#aaa"
-                      }), /*#__PURE__*/_react.default.createElement("text", {
-                        x: 0,
-                        y: 15
-                      }, cannotBeRenderedReason))
-                    };
-                  }
-
-                  var _renderBlockData = (0, _serverSideRenderedBlock.renderBlockData)(blockState, self),
-                      rpcManager = _renderBlockData.rpcManager,
-                      renderArgs = _renderBlockData.renderArgs,
-                      renderProps = _renderBlockData.renderProps,
-                      rendererType = _renderBlockData.rendererType;
-
-                  return rendererType.renderInClient(rpcManager, _objectSpread(_objectSpread(_objectSpread({}, renderArgs), renderProps), {}, {
-                    viewParams: (0, _util.getViewParams)(self, true),
-                    exportSVG: opts
-                  }));
-                }));
-
-              case 6:
-                renderings = _context3.sent;
-                return _context3.abrupt("return", /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderings.map(function (rendering, index) {
-                  var offsetPx = roundedDynamicBlocks[index].offsetPx;
-                  var offset = offsetPx - viewOffsetPx;
-                  var clipid = getId(id, index);
-                  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
-                    key: "frag-".concat(index)
-                  }, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
-                    id: clipid
-                  }, /*#__PURE__*/_react.default.createElement("rect", {
-                    x: 0,
-                    y: 0,
-                    width: width,
-                    height: overrideHeight || height
-                  }))), /*#__PURE__*/_react.default.createElement("g", {
-                    transform: "translate(".concat(offset, " 0)")
-                  }, /*#__PURE__*/_react.default.createElement("g", {
-                    clipPath: "url(#".concat(clipid, ")")
-                  }, /*#__PURE__*/_react.default.isValidElement(rendering.reactElement) ? rendering.reactElement :
-                  /*#__PURE__*/
-                  // eslint-disable-next-line react/no-danger
-                  _react.default.createElement("g", {
-                    dangerouslySetInnerHTML: {
-                      __html: rendering.html
+        return undefined;
+    },
+    trackMenuItems: function () {
+        return [];
+    },
+    contextMenuItems: function () {
+        return self.contextMenuFeature
+            ? [
+                {
+                    label: 'Open feature details',
+                    icon: MenuOpen_1.default,
+                    onClick: function () {
+                        if (self.contextMenuFeature) {
+                            self.selectFeature(self.contextMenuFeature);
+                        }
+                    },
+                },
+            ]
+            : [];
+    },
+    renderProps: function () {
+        var view = (0, util_1.getContainingView)(self);
+        return __assign(__assign({}, (0, tracks_1.getParentRenderProps)(self)), { notReady: self.currBpPerPx !== view.bpPerPx || !self.estimatedRegionStats, rpcDriverName: self.rpcDriverName, displayModel: self, onFeatureClick: function (_, featureId) {
+                var f = featureId || self.featureIdUnderMouse;
+                if (!f) {
+                    self.clearFeatureSelection();
+                }
+                else {
+                    var feature = self.features.get(f);
+                    if (feature) {
+                        self.selectFeature(feature);
                     }
-                  }))));
-                })));
-
-              case 8:
-              case "end":
-                return _context3.stop();
-            }
-          }
-        }, _callee3);
-      }))();
-    }
-  };
-}).postProcessSnapshot(function (self) {
-  var blockState = self.blockState,
-      rest = (0, _objectWithoutProperties2.default)(self, _excluded);
-  return rest;
+                }
+            }, onClick: function () {
+                self.clearFeatureSelection();
+            }, 
+            // similar to click but opens a menu with further options
+            onFeatureContextMenu: function (_, featureId) {
+                var f = featureId || self.featureIdUnderMouse;
+                if (!f) {
+                    self.clearFeatureSelection();
+                }
+                else {
+                    // feature id under mouse passed to context menu
+                    self.setContextMenuFeature(self.features.get(f));
+                }
+            }, onMouseMove: function (_, featureId) {
+                self.setFeatureIdUnderMouse(featureId);
+            }, onMouseLeave: function (_) {
+                self.setFeatureIdUnderMouse(undefined);
+            }, onContextMenu: function () {
+                self.setContextMenuFeature(undefined);
+                self.clearFeatureSelection();
+            } });
+    },
+}); })
+    .actions(function (self) { return ({
+    renderSvg: function (opts) {
+        return __awaiter(this, void 0, void 0, function () {
+            var height, id, overrideHeight, view, viewOffsetPx, roundedDynamicBlocks, width, renderings;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        height = self.height, id = self.id;
+                        overrideHeight = opts.overrideHeight;
+                        view = (0, util_1.getContainingView)(self);
+                        viewOffsetPx = view.offsetPx, roundedDynamicBlocks = view.roundedDynamicBlocks, width = view.width;
+                        return [4 /*yield*/, Promise.all(roundedDynamicBlocks.map(function (block) {
+                                var blockState = serverSideRenderedBlock_1.default.create({
+                                    key: block.key,
+                                    region: block,
+                                });
+                                // regionCannotBeRendered can return jsx so look for plaintext
+                                // version, or just get the default if none available
+                                var cannotBeRenderedReason = self.regionCannotBeRenderedText(block) ||
+                                    self.regionCannotBeRendered(block);
+                                if (cannotBeRenderedReason) {
+                                    return {
+                                        reactElement: (react_1.default.createElement(react_1.default.Fragment, null,
+                                            react_1.default.createElement("rect", { x: 0, y: 0, width: width, height: 20, fill: "#aaa" }),
+                                            react_1.default.createElement("text", { x: 0, y: 15 }, cannotBeRenderedReason))),
+                                    };
+                                }
+                                var _a = (0, serverSideRenderedBlock_1.renderBlockData)(blockState, self), rpcManager = _a.rpcManager, renderArgs = _a.renderArgs, renderProps = _a.renderProps, rendererType = _a.rendererType;
+                                return rendererType.renderInClient(rpcManager, __assign(__assign(__assign({}, renderArgs), renderProps), { viewParams: (0, util_1.getViewParams)(self, true), exportSVG: opts }));
+                            }))];
+                    case 1:
+                        renderings = _a.sent();
+                        return [2 /*return*/, (react_1.default.createElement(react_1.default.Fragment, null, renderings.map(function (rendering, index) {
+                                var offsetPx = roundedDynamicBlocks[index].offsetPx;
+                                var offset = offsetPx - viewOffsetPx;
+                                var clipid = getId(id, index);
+                                return (react_1.default.createElement(react_1.default.Fragment, { key: "frag-".concat(index) },
+                                    react_1.default.createElement("defs", null,
+                                        react_1.default.createElement("clipPath", { id: clipid },
+                                            react_1.default.createElement("rect", { x: 0, y: 0, width: width, height: overrideHeight || height }))),
+                                    react_1.default.createElement("g", { transform: "translate(".concat(offset, " 0)") },
+                                        react_1.default.createElement("g", { clipPath: "url(#".concat(clipid, ")") }, react_1.default.isValidElement(rendering.reactElement) ? (rendering.reactElement) : (
+                                        // eslint-disable-next-line react/no-danger
+                                        react_1.default.createElement("g", { dangerouslySetInnerHTML: { __html: rendering.html } }))))));
+                            })))];
+                }
+            });
+        });
+    },
+}); })
+    .postProcessSnapshot(function (self) {
+    // xref https://github.com/mobxjs/mobx-state-tree/issues/1524 for Omit
+    var r = self;
+    var blockState = r.blockState, rest = __rest(r, ["blockState"]);
+    return rest;
 });
-
-exports.BaseLinearDisplay = BaseLinearDisplay;
+//# sourceMappingURL=BaseLinearDisplayModel.js.map