@jbrowse/plugin-wiggle 1.6.8 → 1.7.1

package/dist/LinearWiggleDisplay/models/model.js

@@ -0,0 +1,706 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.YSCALEBAR_LABEL_OFFSET = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _configuration = require("@jbrowse/core/configuration");
+
+var _util = require("@jbrowse/core/util");
+
+var _tracks = require("@jbrowse/core/util/tracks");
+
+var _pluginLinearGenomeView = require("@jbrowse/plugin-linear-genome-view");
+
+var _mobx = require("mobx");
+
+var _mobxStateTree = require("mobx-state-tree");
+
+var _reactD3AxisMod = require("react-d3-axis-mod");
+
+var _util2 = require("../../util");
+
+var _Tooltip = _interopRequireDefault(require("../components/Tooltip"));
+
+var _WiggleDisplayComponent = require("../components/WiggleDisplayComponent");
+
+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 _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 || (0, _typeof2["default"])(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; }
+
+var SetMinMaxDlg = /*#__PURE__*/(0, _react.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require('../components/SetMinMaxDialog'));
+  });
+});
+var SetColorDlg = /*#__PURE__*/(0, _react.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require('../components/SetColorDialog'));
+  });
+}); // fudge factor for making all labels on the YScalebar visible
+
+var YSCALEBAR_LABEL_OFFSET = 5; // using a map because it preserves order
+
+exports.YSCALEBAR_LABEL_OFFSET = YSCALEBAR_LABEL_OFFSET;
+var rendererTypes = new Map([['xyplot', 'XYPlotRenderer'], ['density', 'DensityRenderer'], ['line', 'LinePlotRenderer']]);
+
+var stateModelFactory = function stateModelFactory(pluginManager, configSchema) {
+  return _mobxStateTree.types.compose('LinearWiggleDisplay', _pluginLinearGenomeView.BaseLinearDisplay, _mobxStateTree.types.model({
+    type: _mobxStateTree.types.literal('LinearWiggleDisplay'),
+    configuration: (0, _configuration.ConfigurationReference)(configSchema),
+    selectedRendering: _mobxStateTree.types.optional(_mobxStateTree.types.string, ''),
+    resolution: _mobxStateTree.types.optional(_mobxStateTree.types.number, 1),
+    fill: _mobxStateTree.types.maybe(_mobxStateTree.types["boolean"]),
+    color: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    posColor: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    negColor: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    summaryScoreMode: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    rendererTypeNameState: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    scale: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    autoscale: _mobxStateTree.types.maybe(_mobxStateTree.types.string),
+    displayCrossHatches: _mobxStateTree.types.maybe(_mobxStateTree.types["boolean"]),
+    constraints: _mobxStateTree.types.optional(_mobxStateTree.types.model({
+      max: _mobxStateTree.types.maybe(_mobxStateTree.types.number),
+      min: _mobxStateTree.types.maybe(_mobxStateTree.types.number)
+    }), {})
+  }))["volatile"](function () {
+    return {
+      statsReady: false,
+      message: undefined,
+      stats: {
+        scoreMin: 0,
+        scoreMax: 50
+      },
+      statsFetchInProgress: undefined
+    };
+  }).actions(function (self) {
+    return {
+      updateStats: function updateStats(_ref) {
+        var scoreMin = _ref.scoreMin,
+            scoreMax = _ref.scoreMax;
+
+        if (self.stats.scoreMin !== scoreMin || self.stats.scoreMax !== scoreMax) {
+          self.stats = {
+            scoreMin: scoreMin,
+            scoreMax: scoreMax
+          };
+        }
+
+        self.statsReady = true;
+      },
+      setColor: function setColor(color) {
+        self.color = color;
+      },
+      setPosColor: function setPosColor(color) {
+        self.posColor = color;
+      },
+      setNegColor: function setNegColor(color) {
+        self.negColor = color;
+      },
+      setLoading: function setLoading(aborter) {
+        var statsFetch = self.statsFetchInProgress;
+
+        if (statsFetch !== undefined && !statsFetch.signal.aborted) {
+          statsFetch.abort();
+        }
+
+        self.statsFetchInProgress = aborter;
+      },
+      // this overrides the BaseLinearDisplayModel to avoid popping up a
+      // feature detail display, but still sets the feature selection on the
+      // model so listeners can detect a click
+      selectFeature: function selectFeature(feature) {
+        var session = (0, _util.getSession)(self);
+
+        if ((0, _util.isSelectionContainer)(session)) {
+          session.setSelection(feature);
+        }
+      },
+      setResolution: function setResolution(res) {
+        self.resolution = res;
+      },
+      setFill: function setFill(fill) {
+        self.fill = fill;
+      },
+      toggleLogScale: function toggleLogScale() {
+        if (self.scale !== 'log') {
+          self.scale = 'log';
+        } else {
+          self.scale = 'linear';
+        }
+      },
+      setScaleType: function setScaleType(scale) {
+        self.scale = scale;
+      },
+      setSummaryScoreMode: function setSummaryScoreMode(val) {
+        self.summaryScoreMode = val;
+      },
+      setAutoscale: function setAutoscale(val) {
+        self.autoscale = val;
+      },
+      setMaxScore: function setMaxScore(val) {
+        self.constraints.max = val;
+      },
+      setRendererType: function setRendererType(val) {
+        self.rendererTypeNameState = val;
+      },
+      setMinScore: function setMinScore(val) {
+        self.constraints.min = val;
+      },
+      toggleCrossHatches: function toggleCrossHatches() {
+        self.displayCrossHatches = !self.displayCrossHatches;
+      },
+      setCrossHatches: function setCrossHatches(cross) {
+        self.displayCrossHatches = cross;
+      }
+    };
+  }).views(function (self) {
+    return {
+      get TooltipComponent() {
+        return _Tooltip["default"];
+      },
+
+      get adapterTypeName() {
+        return self.adapterConfig.type;
+      },
+
+      get rendererTypeName() {
+        var viewName = self.rendererTypeNameState || (0, _configuration.getConf)(self, 'defaultRendering');
+        var rendererType = rendererTypes.get(viewName);
+
+        if (!rendererType) {
+          throw new Error("unknown alignments view name ".concat(viewName));
+        }
+
+        return rendererType;
+      },
+
+      // subclasses can define these, as snpcoverage track does
+      get filters() {
+        return undefined;
+      },
+
+      get scaleType() {
+        return self.scale || (0, _configuration.getConf)(self, 'scaleType');
+      },
+
+      get maxScore() {
+        var max = self.constraints.max;
+        return max !== undefined ? max : (0, _configuration.getConf)(self, 'maxScore');
+      },
+
+      get minScore() {
+        var min = self.constraints.min;
+        return min !== undefined ? min : (0, _configuration.getConf)(self, 'minScore');
+      }
+
+    };
+  }).views(function (self) {
+    return {
+      get rendererConfig() {
+        var configBlob = (0, _configuration.getConf)(self, ['renderers', self.rendererTypeName]) || {};
+        return self.rendererType.configSchema.create(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, configBlob), {}, {
+          filled: self.fill,
+          scaleType: self.scaleType,
+          displayCrossHatches: self.displayCrossHatches,
+          summaryScoreMode: self.summaryScoreMode
+        }, self.color ? {
+          color: self.color
+        } : {}), self.negColor ? {
+          negColor: self.negColor
+        } : {}), self.posColor ? {
+          posColor: self.posColor
+        } : {}), (0, _mobxStateTree.getEnv)(self));
+      }
+
+    };
+  }).views(function (self) {
+    var oldDomain = [0, 0];
+    return {
+      get filled() {
+        return typeof self.fill !== 'undefined' ? self.fill : (0, _configuration.readConfObject)(self.rendererConfig, 'filled');
+      },
+
+      get summaryScoreModeSetting() {
+        return self.summaryScoreMode || (0, _configuration.readConfObject)(self.rendererConfig, 'summaryScoreMode');
+      },
+
+      get domain() {
+        var stats = self.stats,
+            scaleType = self.scaleType,
+            minScore = self.minScore,
+            maxScore = self.maxScore;
+        var scoreMin = stats.scoreMin,
+            scoreMax = stats.scoreMax;
+        var ret = (0, _util2.getNiceDomain)({
+          domain: [scoreMin, scoreMax],
+          bounds: [minScore, maxScore],
+          scaleType: scaleType
+        }); // avoid weird scalebar if log value and empty region displayed
+
+        if (scaleType === 'log' && ret[1] === Number.MIN_VALUE) {
+          return [0, Number.MIN_VALUE];
+        } // avoid returning a new object if it matches the old value
+
+
+        if (JSON.stringify(oldDomain) !== JSON.stringify(ret)) {
+          oldDomain = ret;
+        }
+
+        return oldDomain;
+      },
+
+      get needsScalebar() {
+        return self.rendererTypeName === 'XYPlotRenderer' || self.rendererTypeName === 'LinePlotRenderer';
+      },
+
+      get scaleOpts() {
+        return {
+          domain: this.domain,
+          stats: self.stats,
+          autoscaleType: this.autoscaleType,
+          scaleType: self.scaleType,
+          inverted: (0, _configuration.getConf)(self, 'inverted')
+        };
+      },
+
+      get canHaveFill() {
+        return self.rendererTypeName === 'XYPlotRenderer';
+      },
+
+      get autoscaleType() {
+        return self.autoscale || (0, _configuration.getConf)(self, 'autoscale');
+      },
+
+      get displayCrossHatchesSetting() {
+        return self.displayCrossHatches || (0, _configuration.readConfObject)(self.rendererConfig, 'displayCrossHatches');
+      }
+
+    };
+  }).views(function (self) {
+    return {
+      get ticks() {
+        var scaleType = self.scaleType,
+            domain = self.domain,
+            height = self.height;
+        var minimalTicks = (0, _configuration.getConf)(self, 'minimalTicks');
+        var range = [height - YSCALEBAR_LABEL_OFFSET, YSCALEBAR_LABEL_OFFSET];
+        var scale = (0, _util2.getScale)({
+          scaleType: scaleType,
+          domain: domain,
+          range: range,
+          inverted: (0, _configuration.getConf)(self, 'inverted')
+        });
+        var ticks = (0, _reactD3AxisMod.axisPropsFromTickScale)(scale, 4);
+        return height < 100 || minimalTicks ? _objectSpread(_objectSpread({}, ticks), {}, {
+          values: domain
+        }) : ticks;
+      }
+
+    };
+  }).views(function (self) {
+    var superRenderProps = self.renderProps;
+    return {
+      renderProps: function renderProps() {
+        var superProps = superRenderProps();
+        return _objectSpread(_objectSpread({}, superProps), {}, {
+          notReady: superProps.notReady || !self.statsReady,
+          rpcDriverName: self.rpcDriverName,
+          displayModel: self,
+          config: self.rendererConfig,
+          scaleOpts: self.scaleOpts,
+          resolution: self.resolution,
+          height: self.height,
+          ticks: self.ticks,
+          displayCrossHatches: self.displayCrossHatches,
+          filters: self.filters
+        });
+      },
+
+      get adapterCapabilities() {
+        return pluginManager.getAdapterType(self.adapterTypeName).adapterCapabilities;
+      },
+
+      get hasResolution() {
+        return this.adapterCapabilities.includes('hasResolution');
+      },
+
+      get hasGlobalStats() {
+        return this.adapterCapabilities.includes('hasGlobalStats');
+      }
+
+    };
+  }).views(function (self) {
+    var superTrackMenuItems = self.trackMenuItems;
+    return {
+      trackMenuItems: function trackMenuItems() {
+        return [].concat((0, _toConsumableArray2["default"])(superTrackMenuItems()), (0, _toConsumableArray2["default"])(self.hasResolution ? [{
+          label: 'Resolution',
+          subMenu: [{
+            label: 'Finer resolution',
+            onClick: function onClick() {
+              self.setResolution(self.resolution * 5);
+            }
+          }, {
+            label: 'Coarser resolution',
+            onClick: function onClick() {
+              self.setResolution(self.resolution / 5);
+            }
+          }]
+        }, {
+          label: 'Summary score mode',
+          subMenu: ['min', 'max', 'avg', 'whiskers'].map(function (elt) {
+            return {
+              label: elt,
+              onClick: function onClick() {
+                return self.setSummaryScoreMode(elt);
+              }
+            };
+          })
+        }] : []), (0, _toConsumableArray2["default"])(self.canHaveFill ? [{
+          label: self.filled ? 'Turn off histogram fill' : 'Turn on histogram fill',
+          onClick: function onClick() {
+            self.setFill(!self.filled);
+          }
+        }] : []), [{
+          label: self.scaleType === 'log' ? 'Set linear scale' : 'Set log scale',
+          onClick: function onClick() {
+            self.toggleLogScale();
+          }
+        }, {
+          type: 'checkbox',
+          label: 'Draw cross hatches',
+          checked: self.displayCrossHatchesSetting,
+          onClick: function onClick() {
+            self.toggleCrossHatches();
+          }
+        }], (0, _toConsumableArray2["default"])(Object.keys((0, _configuration.getConf)(self, 'renderers') || {}).length > 1 ? [{
+          label: 'Renderer type',
+          subMenu: (0, _toConsumableArray2["default"])(rendererTypes.keys()).map(function (key) {
+            return {
+              label: key,
+              onClick: function onClick() {
+                return self.setRendererType(key);
+              }
+            };
+          })
+        }] : []), [{
+          label: 'Autoscale type',
+          subMenu: [['local', 'Local']].concat((0, _toConsumableArray2["default"])(self.hasGlobalStats ? [['global', 'Global'], ['globalsd', 'Global ± 3σ']] : []), [['localsd', 'Local ± 3σ']]).map(function (_ref2) {
+            var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
+                val = _ref3[0],
+                label = _ref3[1];
+
+            return {
+              label: label,
+              onClick: function onClick() {
+                self.setAutoscale(val);
+              }
+            };
+          })
+        }, {
+          label: 'Set min/max score',
+          onClick: function onClick() {
+            (0, _util.getSession)(self).queueDialog(function (doneCallback) {
+              return [SetMinMaxDlg, {
+                model: self,
+                handleClose: doneCallback
+              }];
+            });
+          }
+        }, {
+          label: 'Set color',
+          onClick: function onClick() {
+            (0, _util.getSession)(self).queueDialog(function (doneCallback) {
+              return [SetColorDlg, {
+                model: self,
+                handleClose: doneCallback
+              }];
+            });
+          }
+        }]);
+      }
+    };
+  }).actions(function (self) {
+    var superReload = self.reload,
+        superRenderSvg = self.renderSvg;
+
+    function getStats(_x) {
+      return _getStats.apply(this, arguments);
+    }
+
+    function _getStats() {
+      _getStats = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(opts) {
+        var _getSession, rpcManager, nd, adapterConfig, autoscaleType, sessionId, params, results, scoreMin, scoreMean, scoreStdDev, _ref6, dynamicBlocks, bpPerPx, _results, _scoreMin, _scoreMean, _scoreStdDev;
+
+        return _regenerator["default"].wrap(function _callee4$(_context4) {
+          while (1) {
+            switch (_context4.prev = _context4.next) {
+              case 0:
+                _getSession = (0, _util.getSession)(self), rpcManager = _getSession.rpcManager;
+                nd = (0, _configuration.getConf)(self, 'numStdDev') || 3;
+                adapterConfig = self.adapterConfig, autoscaleType = self.autoscaleType;
+                sessionId = (0, _tracks.getRpcSessionId)(self);
+                params = _objectSpread({
+                  sessionId: sessionId,
+                  adapterConfig: adapterConfig,
+                  statusCallback: function statusCallback(message) {
+                    if ((0, _mobxStateTree.isAlive)(self)) {
+                      self.setMessage(message);
+                    }
+                  }
+                }, opts);
+
+                if (!(autoscaleType === 'global' || autoscaleType === 'globalsd')) {
+                  _context4.next = 11;
+                  break;
+                }
+
+                _context4.next = 8;
+                return rpcManager.call(sessionId, 'WiggleGetGlobalStats', params);
+
+              case 8:
+                results = _context4.sent;
+                scoreMin = results.scoreMin, scoreMean = results.scoreMean, scoreStdDev = results.scoreStdDev; // globalsd uses heuristic to avoid unnecessary scoreMin<0
+                // if the scoreMin is never less than 0
+                // helps with most coverage bigwigs just being >0
+
+                return _context4.abrupt("return", autoscaleType === 'globalsd' ? _objectSpread(_objectSpread({}, results), {}, {
+                  scoreMin: scoreMin >= 0 ? 0 : scoreMean - nd * scoreStdDev,
+                  scoreMax: scoreMean + nd * scoreStdDev
+                }) : results);
+
+              case 11:
+                if (!(autoscaleType === 'local' || autoscaleType === 'localsd')) {
+                  _context4.next = 18;
+                  break;
+                }
+
+                _ref6 = (0, _util.getContainingView)(self), dynamicBlocks = _ref6.dynamicBlocks, bpPerPx = _ref6.bpPerPx;
+                _context4.next = 15;
+                return rpcManager.call(sessionId, 'WiggleGetMultiRegionStats', _objectSpread(_objectSpread({}, params), {}, {
+                  regions: dynamicBlocks.contentBlocks.map(function (region) {
+                    var start = region.start,
+                        end = region.end;
+                    return _objectSpread(_objectSpread({}, JSON.parse(JSON.stringify(region))), {}, {
+                      start: Math.floor(start),
+                      end: Math.ceil(end)
+                    });
+                  }),
+                  bpPerPx: bpPerPx
+                }));
+
+              case 15:
+                _results = _context4.sent;
+                _scoreMin = _results.scoreMin, _scoreMean = _results.scoreMean, _scoreStdDev = _results.scoreStdDev; // localsd uses heuristic to avoid unnecessary scoreMin<0 if the
+                // scoreMin is never less than 0 helps with most coverage bigwigs
+                // just being >0
+
+                return _context4.abrupt("return", autoscaleType === 'localsd' ? _objectSpread(_objectSpread({}, _results), {}, {
+                  scoreMin: _scoreMin >= 0 ? 0 : _scoreMean - nd * _scoreStdDev,
+                  scoreMax: _scoreMean + nd * _scoreStdDev
+                }) : _results);
+
+              case 18:
+                if (!(autoscaleType === 'zscale')) {
+                  _context4.next = 20;
+                  break;
+                }
+
+                return _context4.abrupt("return", rpcManager.call(sessionId, 'WiggleGetGlobalStats', params));
+
+              case 20:
+                throw new Error("invalid autoscaleType '".concat(autoscaleType, "'"));
+
+              case 21:
+              case "end":
+                return _context4.stop();
+            }
+          }
+        }, _callee4);
+      }));
+      return _getStats.apply(this, arguments);
+    }
+
+    return {
+      // re-runs stats and refresh whole display on reload
+      reload: function reload() {
+        return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+          var aborter, stats;
+          return _regenerator["default"].wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  self.setError();
+                  aborter = new AbortController();
+                  _context.prev = 2;
+                  _context.next = 5;
+                  return getStats(_objectSpread({
+                    signal: aborter.signal
+                  }, self.renderProps()));
+
+                case 5:
+                  stats = _context.sent;
+
+                  if ((0, _mobxStateTree.isAlive)(self)) {
+                    self.updateStats(stats);
+                    superReload();
+                  }
+
+                  _context.next = 12;
+                  break;
+
+                case 9:
+                  _context.prev = 9;
+                  _context.t0 = _context["catch"](2);
+                  self.setError(_context.t0);
+
+                case 12:
+                case "end":
+                  return _context.stop();
+              }
+            }
+          }, _callee, null, [[2, 9]]);
+        }))();
+      },
+      afterAttach: function afterAttach() {
+        (0, _mobxStateTree.addDisposer)(self, (0, _mobx.autorun)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+          var aborter, view, wiggleStats;
+          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);
+                  self.setLoading(aborter);
+
+                  if (view.initialized) {
+                    _context2.next = 6;
+                    break;
+                  }
+
+                  return _context2.abrupt("return");
+
+                case 6:
+                  if (self.estimatedStatsReady) {
+                    _context2.next = 8;
+                    break;
+                  }
+
+                  return _context2.abrupt("return");
+
+                case 8:
+                  if (!self.regionTooLarge) {
+                    _context2.next = 10;
+                    break;
+                  }
+
+                  return _context2.abrupt("return");
+
+                case 10:
+                  _context2.next = 12;
+                  return getStats(_objectSpread({
+                    signal: aborter.signal
+                  }, self.renderProps()));
+
+                case 12:
+                  wiggleStats = _context2.sent;
+
+                  if ((0, _mobxStateTree.isAlive)(self)) {
+                    self.updateStats(wiggleStats);
+                  }
+
+                  _context2.next = 19;
+                  break;
+
+                case 16:
+                  _context2.prev = 16;
+                  _context2.t0 = _context2["catch"](0);
+
+                  if (!(0, _util.isAbortException)(_context2.t0) && (0, _mobxStateTree.isAlive)(self)) {
+                    console.error(_context2.t0);
+                    self.setError(_context2.t0);
+                  }
+
+                case 19:
+                case "end":
+                  return _context2.stop();
+              }
+            }
+          }, _callee2, null, [[0, 16]]);
+        })), {
+          delay: 1000
+        }));
+      },
+      renderSvg: function renderSvg(opts) {
+        return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+          var needsScalebar, stats, _ref5, offsetPx;
+
+          return _regenerator["default"].wrap(function _callee3$(_context3) {
+            while (1) {
+              switch (_context3.prev = _context3.next) {
+                case 0:
+                  _context3.next = 2;
+                  return (0, _mobx.when)(function () {
+                    return self.statsReady && !!self.regionCannotBeRenderedText;
+                  });
+
+                case 2:
+                  needsScalebar = self.needsScalebar, stats = self.stats;
+                  _ref5 = (0, _util.getContainingView)(self), offsetPx = _ref5.offsetPx;
+                  _context3.t0 = _react["default"];
+                  _context3.t1 = _react["default"].Fragment;
+                  _context3.t2 = _react["default"];
+                  _context3.t3 = {
+                    id: "snpcov"
+                  };
+                  _context3.next = 10;
+                  return superRenderSvg(opts);
+
+                case 10:
+                  _context3.t4 = _context3.sent;
+                  _context3.t5 = _context3.t2.createElement.call(_context3.t2, "g", _context3.t3, _context3.t4);
+                  _context3.t6 = needsScalebar && stats ? /*#__PURE__*/_react["default"].createElement("g", {
+                    transform: "translate(".concat(Math.max(-offsetPx, 0), ")")
+                  }, /*#__PURE__*/_react["default"].createElement(_WiggleDisplayComponent.YScaleBar, {
+                    model: self,
+                    orientation: "left"
+                  })) : null;
+                  return _context3.abrupt("return", _context3.t0.createElement.call(_context3.t0, _context3.t1, null, _context3.t5, _context3.t6));
+
+                case 14:
+                case "end":
+                  return _context3.stop();
+              }
+            }
+          }, _callee3);
+        }))();
+      }
+    };
+  });
+};
+
+var _default = stateModelFactory;
+exports["default"] = _default;