@jbrowse/plugin-circular-view 1.7.11 → 2.1.0

package/dist/index.js

@@ -1,182 +1,153 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "BaseChordDisplayComponentFactory", {
-  enumerable: true,
-  get: function get() {
-    return _BaseChordDisplay.BaseChordDisplayComponentFactory;
-  }
-});
-Object.defineProperty(exports, "BaseChordDisplayModel", {
-  enumerable: true,
-  get: function get() {
-    return _BaseChordDisplay.BaseChordDisplayModel;
-  }
-});
-Object.defineProperty(exports, "baseChordDisplayConfig", {
-  enumerable: true,
-  get: function get() {
-    return _BaseChordDisplay.baseChordDisplayConfig;
-  }
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+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;
 });
-exports.default = void 0;
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = require("react");
-
-var _mobx = require("mobx");
-
-var _util = require("@jbrowse/core/util");
-
-var _Plugin2 = _interopRequireDefault(require("@jbrowse/core/Plugin"));
-
-var _ViewType = _interopRequireDefault(require("@jbrowse/core/pluggableElementTypes/ViewType"));
-
-var _DataUsage = _interopRequireDefault(require("@material-ui/icons/DataUsage"));
-
-var _CircularView = _interopRequireDefault(require("./CircularView/models/CircularView"));
-
-var _BaseChordDisplay = require("./BaseChordDisplay");
-
-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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var CircularViewPlugin = /*#__PURE__*/function (_Plugin) {
-  (0, _inherits2.default)(CircularViewPlugin, _Plugin);
-
-  var _super = _createSuper(CircularViewPlugin);
-
-  function CircularViewPlugin() {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, CircularViewPlugin);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BaseChordDisplayComponent = exports.baseChordDisplayConfig = exports.BaseChordDisplayModel = void 0;
+var react_1 = require("react");
+var mobx_1 = require("mobx");
+var util_1 = require("@jbrowse/core/util");
+var Plugin_1 = __importDefault(require("@jbrowse/core/Plugin"));
+var ViewType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/ViewType"));
+var DataUsage_1 = __importDefault(require("@mui/icons-material/DataUsage"));
+var CircularView_1 = __importDefault(require("./CircularView/models/CircularView"));
+var CircularViewPlugin = /** @class */ (function (_super) {
+    __extends(CircularViewPlugin, _super);
+    function CircularViewPlugin() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.name = 'CircularViewPlugin';
+        return _this;
     }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "name", 'CircularViewPlugin');
-    return _this;
-  }
-
-  (0, _createClass2.default)(CircularViewPlugin, [{
-    key: "install",
-    value: function install(pluginManager) {
-      pluginManager.addViewType(function () {
-        return new _ViewType.default({
-          ReactComponent: /*#__PURE__*/(0, _react.lazy)(function () {
-            return Promise.resolve().then(function () {
-              return _interopRequireWildcard(require('./CircularView/components/CircularView'));
+    CircularViewPlugin.prototype.install = function (pluginManager) {
+        var _this = this;
+        pluginManager.addViewType(function () {
+            return new ViewType_1.default({
+                ReactComponent: (0, react_1.lazy)(function () { return Promise.resolve().then(function () { return __importStar(require('./CircularView/components/CircularView')); }); }),
+                stateModel: (0, CircularView_1.default)(pluginManager),
+                name: 'CircularView',
             });
-          }),
-          stateModel: (0, _CircularView.default)(pluginManager),
-          name: 'CircularView'
         });
-      });
-      pluginManager.addToExtensionPoint('LaunchView-CircularView',
-      /*#__PURE__*/
-      // @ts-ignore
-      function () {
-        var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref) {
-          var session, assembly, loc, _ref$tracks, tracks, assemblyManager, view, asm;
-
-          return _regenerator.default.wrap(function _callee$(_context) {
-            while (1) {
-              switch (_context.prev = _context.next) {
-                case 0:
-                  session = _ref.session, assembly = _ref.assembly, loc = _ref.loc, _ref$tracks = _ref.tracks, tracks = _ref$tracks === void 0 ? [] : _ref$tracks;
-                  assemblyManager = session.assemblyManager;
-                  view = session.addView('CircularView', {});
-                  _context.next = 5;
-                  return (0, _mobx.when)(function () {
-                    return view.initialized;
-                  });
-
-                case 5:
-                  if (assembly) {
-                    _context.next = 7;
-                    break;
-                  }
-
-                  throw new Error('No assembly provided when launching circular genome view');
-
-                case 7:
-                  _context.next = 9;
-                  return assemblyManager.waitForAssembly(assembly);
-
-                case 9:
-                  asm = _context.sent;
-
-                  if (asm) {
-                    _context.next = 12;
-                    break;
-                  }
-
-                  throw new Error("Assembly \"".concat(assembly, "\" not found when launching circular genome view"));
-
-                case 12:
-                  view.setDisplayedRegions(asm.regions || []);
-                  tracks.forEach(function (track) {
-                    return view.showTrack(track);
-                  });
-
-                case 14:
-                case "end":
-                  return _context.stop();
-              }
-            }
-          }, _callee);
-        }));
-
-        return function (_x) {
-          return _ref2.apply(this, arguments);
-        };
-      }());
-    }
-  }, {
-    key: "configure",
-    value: function configure(pluginManager) {
-      if ((0, _util.isAbstractMenuManager)(pluginManager.rootModel)) {
-        pluginManager.rootModel.appendToSubMenu(['Add'], {
-          label: 'Circular view',
-          icon: _DataUsage.default,
-          onClick: function onClick(session) {
-            session.addView('CircularView', {});
-          }
+        pluginManager.addToExtensionPoint('LaunchView-CircularView', 
+        // @ts-ignore
+        function (_a) {
+            var session = _a.session, assembly = _a.assembly, loc = _a.loc, _b = _a.tracks, tracks = _b === void 0 ? [] : _b;
+            return __awaiter(_this, void 0, void 0, function () {
+                var assemblyManager, view, asm;
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
+                        case 0:
+                            assemblyManager = session.assemblyManager;
+                            view = session.addView('CircularView', {});
+                            return [4 /*yield*/, (0, mobx_1.when)(function () { return view.initialized; })];
+                        case 1:
+                            _c.sent();
+                            if (!assembly) {
+                                throw new Error('No assembly provided when launching circular genome view');
+                            }
+                            return [4 /*yield*/, assemblyManager.waitForAssembly(assembly)];
+                        case 2:
+                            asm = _c.sent();
+                            if (!asm) {
+                                throw new Error("Assembly \"".concat(assembly, "\" not found when launching circular genome view"));
+                            }
+                            view.setDisplayedRegions(asm.regions || []);
+                            tracks.forEach(function (track) { return view.showTrack(track); });
+                            return [2 /*return*/];
+                    }
+                });
+            });
         });
-      }
-    }
-  }]);
-  return CircularViewPlugin;
-}(_Plugin2.default);
-
-exports.default = CircularViewPlugin;
+    };
+    CircularViewPlugin.prototype.configure = function (pluginManager) {
+        if ((0, util_1.isAbstractMenuManager)(pluginManager.rootModel)) {
+            pluginManager.rootModel.appendToSubMenu(['Add'], {
+                label: 'Circular view',
+                icon: DataUsage_1.default,
+                onClick: function (session) {
+                    session.addView('CircularView', {});
+                },
+            });
+        }
+    };
+    return CircularViewPlugin;
+}(Plugin_1.default));
+exports.default = CircularViewPlugin;
+var BaseChordDisplay_1 = require("./BaseChordDisplay");
+Object.defineProperty(exports, "BaseChordDisplayModel", { enumerable: true, get: function () { return BaseChordDisplay_1.BaseChordDisplayModel; } });
+Object.defineProperty(exports, "baseChordDisplayConfig", { enumerable: true, get: function () { return BaseChordDisplay_1.baseChordDisplayConfig; } });
+Object.defineProperty(exports, "BaseChordDisplayComponent", { enumerable: true, get: function () { return BaseChordDisplay_1.BaseChordDisplayComponent; } });
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAA4B;AAC5B,6BAA2B;AAC3B,2CAAgF;AAEhF,gEAAyC;AACzC,0FAAmE;AACnE,4EAAyD;AACzD,oFAG2C;AAI3C;IAAgD,sCAAM;IAAtD;QAAA,qEAiEC;QAhEC,UAAI,GAAG,oBAAoB,CAAA;;IAgE7B,CAAC;IA9DC,oCAAO,GAAP,UAAQ,aAA4B;QAApC,iBAiDC;QAhDC,aAAa,CAAC,WAAW,CACvB;YACE,OAAA,IAAI,kBAAQ,CAAC;gBACX,cAAc,EAAE,IAAA,YAAI,EAClB,cAAM,wEAAO,wCAAwC,QAA/C,CAAgD,CACvD;gBACD,UAAU,EAAE,IAAA,sBAAiB,EAAC,aAAa,CAAC;gBAC5C,IAAI,EAAE,cAAc;aACrB,CAAC;QANF,CAME,CACL,CAAA;QAED,aAAa,CAAC,mBAAmB,CAC/B,yBAAyB;QACzB,aAAa;QACb,UAAO,EAUN;gBATC,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,GAAG,SAAA,EACH,cAAW,EAAX,MAAM,mBAAG,EAAE,KAAA;;;;;;4BAOH,eAAe,GAAK,OAAO,gBAAZ,CAAY;4BAC7B,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,cAAc,EAAE,EAAE,CAAQ,CAAA;4BAEvD,qBAAM,IAAA,WAAI,EAAC,cAAM,OAAA,IAAI,CAAC,WAAW,EAAhB,CAAgB,CAAC,EAAA;;4BAAlC,SAAkC,CAAA;4BAElC,IAAI,CAAC,QAAQ,EAAE;gCACb,MAAM,IAAI,KAAK,CACb,0DAA0D,CAC3D,CAAA;6BACF;4BAEW,qBAAM,eAAe,CAAC,eAAe,CAAC,QAAQ,CAAC,EAAA;;4BAArD,GAAG,GAAG,SAA+C;4BAC3D,IAAI,CAAC,GAAG,EAAE;gCACR,MAAM,IAAI,KAAK,CACb,qBAAa,QAAQ,qDAAiD,CACvE,CAAA;6BACF;4BAED,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,OAAO,IAAI,EAAE,CAAC,CAAA;4BAE3C,MAAM,CAAC,OAAO,CAAC,UAAA,KAAK,IAAI,OAAA,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,EAArB,CAAqB,CAAC,CAAA;;;;;SAC/C,CACF,CAAA;IACH,CAAC;IAED,sCAAS,GAAT,UAAU,aAA4B;QACpC,IAAI,IAAA,4BAAqB,EAAC,aAAa,CAAC,SAAS,CAAC,EAAE;YAClD,aAAa,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,KAAK,CAAC,EAAE;gBAC/C,KAAK,EAAE,eAAe;gBACtB,IAAI,EAAE,mBAAa;gBACnB,OAAO,EAAE,UAAC,OAA6B;oBACrC,OAAO,CAAC,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC,CAAA;gBACrC,CAAC;aACF,CAAC,CAAA;SACH;IACH,CAAC;IACH,yBAAC;AAAD,CAAC,AAjED,CAAgD,gBAAM,GAiErD;;AAED,uDAI2B;AAHzB,yHAAA,qBAAqB,OAAA;AACrB,0HAAA,sBAAsB,OAAA;AACtB,6HAAA,yBAAyB,OAAA"}

package/esm/BaseChordDisplay/components/BaseChordDisplay.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+declare function BaseChordDisplay({ display }: any): JSX.Element;
+declare const _default: typeof BaseChordDisplay;
+export default _default;

package/esm/BaseChordDisplay/components/BaseChordDisplay.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import Loading from './Loading';
+import DisplayError from './DisplayError';
+import RpcRenderedSvgGroup from './RpcRenderedSvgGroup';
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function BaseChordDisplay({ display }) {
+    if (display.error) {
+        return React.createElement(DisplayError, { model: display });
+    }
+    if (!display.filled) {
+        return React.createElement(Loading, { model: display });
+    }
+    return React.createElement(RpcRenderedSvgGroup, { model: display });
+}
+export default observer(BaseChordDisplay);
+//# sourceMappingURL=BaseChordDisplay.js.map

package/esm/BaseChordDisplay/components/BaseChordDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseChordDisplay.js","sourceRoot":"","sources":["../../../src/BaseChordDisplay/components/BaseChordDisplay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,OAAO,MAAM,WAAW,CAAA;AAC/B,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,8DAA8D;AAC9D,SAAS,gBAAgB,CAAC,EAAE,OAAO,EAAO;IACxC,IAAI,OAAO,CAAC,KAAK,EAAE;QACjB,OAAO,oBAAC,YAAY,IAAC,KAAK,EAAE,OAAO,GAAI,CAAA;KACxC;IACD,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;QACnB,OAAO,oBAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,CAAA;KACnC;IACD,OAAO,oBAAC,mBAAmB,IAAC,KAAK,EAAE,OAAO,GAAI,CAAA;AAChD,CAAC;AACD,eAAe,QAAQ,CAAC,gBAAgB,CAAC,CAAA"}

package/esm/BaseChordDisplay/components/DisplayError.d.ts

@@ -0,0 +1,9 @@
+export default DisplayError;
+declare function DisplayError({ model: { renderProps: { radius }, error, }, }: {
+    model: {
+        renderProps: {
+            radius: any;
+        };
+        error: any;
+    };
+}): JSX.Element;

package/esm/BaseChordDisplay/components/DisplayError.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import { makeStyles } from 'tss-react/mui';
+const useStyles = makeStyles()({
+    errorMessage: {},
+    errorBackground: {},
+    errorText: {},
+});
+// 'repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255,255,255,.5) 5px, rgba(255,255,255,.5) 10px)',
+const DisplayError = observer(({ model: { renderProps: { radius }, error, }, }) => {
+    const { classes } = useStyles();
+    return (React.createElement("g", { className: classes.errorMessage },
+        React.createElement("defs", null,
+            React.createElement("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse" },
+                React.createElement("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,0,0,0.5)', strokeWidth: 10 } }))),
+        React.createElement("circle", { className: classes.errorBackground, cx: "0", cy: "0", r: radius, fill: "#ffb4b4" }),
+        React.createElement("circle", { className: classes.errorPattern, cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }),
+        React.createElement("text", { className: classes.errorText, x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle" }, String(error))));
+});
+export default DisplayError;
+//# sourceMappingURL=DisplayError.js.map

package/esm/BaseChordDisplay/components/DisplayError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DisplayError.js","sourceRoot":"","sources":["../../../src/BaseChordDisplay/components/DisplayError.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,YAAY,EAAE,EAAE;IAChB,eAAe,EAAE,EAAE;IACnB,SAAS,EAAE,EAAE;CACd,CAAC,CAAA;AAEF,yHAAyH;AACzH,MAAM,YAAY,GAAG,QAAQ,CAC3B,CAAC,EACC,KAAK,EAAE,EACL,WAAW,EAAE,EAAE,MAAM,EAAE,EACvB,KAAK,GACN,GACF,EAAE,EAAE;IACH,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,OAAO,CACL,2BAAG,SAAS,EAAE,OAAO,CAAC,YAAY;QAChC;YACE,iCACE,EAAE,EAAC,eAAe,EAClB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,gBAAgB,EAAC,gBAAgB,EACjC,YAAY,EAAC,gBAAgB;gBAE7B,8BACE,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,IAAI,EACP,KAAK,EAAE,EAAE,MAAM,EAAE,mBAAmB,EAAE,WAAW,EAAE,EAAE,EAAE,GACvD,CACM,CACL;QACP,gCACE,SAAS,EAAE,OAAO,CAAC,eAAe,EAClC,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,CAAC,EAAE,MAAM,EACT,IAAI,EAAC,SAAS,GACd;QACF,gCACE,SAAS,EAAE,OAAO,CAAC,YAAY,EAC/B,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,CAAC,EAAE,MAAM,EACT,IAAI,EAAC,qBAAqB,GAC1B;QACF,8BACE,SAAS,EAAE,OAAO,CAAC,SAAS,EAC5B,CAAC,EAAC,GAAG,EACL,CAAC,EAAC,GAAG,EACL,SAAS,EAAC,gBAAgB,EAC1B,gBAAgB,EAAC,QAAQ,EACzB,UAAU,EAAC,QAAQ,IAElB,MAAM,CAAC,KAAK,CAAC,CACT,CACL,CACL,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,YAAY,CAAA"}

package/esm/BaseChordDisplay/components/Loading.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+declare const Loading: ({ model: { renderProps: { radius }, }, }: {
+    model: {
+        renderProps: {
+            radius: number;
+        };
+    };
+}) => JSX.Element | null;
+export default Loading;

package/esm/BaseChordDisplay/components/Loading.js

@@ -0,0 +1,66 @@
+import React, { useState, useEffect } from 'react';
+import { makeStyles } from 'tss-react/mui';
+import { observer } from 'mobx-react';
+const useStyles = makeStyles()(theme => {
+    const offset = 2;
+    const duration = 1.4;
+    // @ts-ignore
+    const { primary, secondary, tertiary, quaternary } = theme.palette;
+    return {
+        path: {
+            strokeDasharray: 187,
+            strokeDashoffset: 50,
+            animation: `$dash ${duration}s ease-in-out infinite, $colors ${duration * 4}s ease-in-out infinite`,
+        },
+        '@keyframes colors': {
+            '0%': {
+                stroke: primary.light,
+            },
+            '25%': {
+                stroke: secondary.light,
+            },
+            '50%': {
+                stroke: tertiary.light,
+            },
+            '75%': {
+                stroke: quaternary.light,
+            },
+            '100%': {
+                stroke: primary.light,
+            },
+        },
+        '@keyframes dash': {
+            '0%': {
+                strokeDashoffset: offset,
+            },
+            '50%': {
+                strokeDashoffset: offset / 4,
+                transform: 'rotate(135deg)',
+            },
+            '100%': {
+                strokeDashoffset: offset,
+                transform: 'rotate(720deg)',
+            },
+        },
+    };
+});
+// 'repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255,255,255,.5) 5px, rgba(255,255,255,.5) 10px)',
+const Loading = observer(({ model: { renderProps: { radius }, }, }) => {
+    const { classes } = useStyles();
+    // only show the loading message after 400ms to prevent excessive flickering
+    const [shown, setShown] = useState(false);
+    useEffect(() => {
+        const timeout = setTimeout(() => setShown(true), 400);
+        return () => clearTimeout(timeout);
+    });
+    return !shown ? null : (React.createElement("g", null,
+        React.createElement("defs", null,
+            React.createElement("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse" },
+                React.createElement("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,255,255,0.5)', strokeWidth: 10 } }))),
+        React.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "#f1f1f1" }),
+        React.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }),
+        React.createElement("text", { x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle" }, "Loading\u2026"),
+        React.createElement("circle", { className: classes.path, fill: "none", strokeWidth: "4", strokeLinecap: "round", cx: "0", cy: "0", r: "60" })));
+});
+export default Loading;
+//# sourceMappingURL=Loading.js.map

package/esm/BaseChordDisplay/components/Loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.js","sourceRoot":"","sources":["../../../src/BaseChordDisplay/components/Loading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE;IACrC,MAAM,MAAM,GAAG,CAAC,CAAA;IAChB,MAAM,QAAQ,GAAG,GAAG,CAAA;IAEpB,aAAa;IACb,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,OAAO,CAAA;IAClE,OAAO;QACL,IAAI,EAAE;YACJ,eAAe,EAAE,GAAG;YACpB,gBAAgB,EAAE,EAAE;YACpB,SAAS,EAAE,SAAS,QAAQ,mCAC1B,QAAQ,GAAG,CACb,wBAAwB;SACzB;QACD,mBAAmB,EAAE;YACnB,IAAI,EAAE;gBACJ,MAAM,EAAE,OAAO,CAAC,KAAK;aACtB;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS,CAAC,KAAK;aACxB;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,QAAQ,CAAC,KAAK;aACvB;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,UAAU,CAAC,KAAK;aACzB;YACD,MAAM,EAAE;gBACN,MAAM,EAAE,OAAO,CAAC,KAAK;aACtB;SACF;QACD,iBAAiB,EAAE;YACjB,IAAI,EAAE;gBACJ,gBAAgB,EAAE,MAAM;aACzB;YACD,KAAK,EAAE;gBACL,gBAAgB,EAAE,MAAM,GAAG,CAAC;gBAC5B,SAAS,EAAE,gBAAgB;aAC5B;YACD,MAAM,EAAE;gBACN,gBAAgB,EAAE,MAAM;gBACxB,SAAS,EAAE,gBAAgB;aAC5B;SACF;KACF,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,yHAAyH;AACzH,MAAM,OAAO,GAAG,QAAQ,CACtB,CAAC,EACC,KAAK,EAAE,EACL,WAAW,EAAE,EAAE,MAAM,EAAE,GACxB,GAGF,EAAE,EAAE;IACH,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAE/B,4EAA4E;IAC5E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACzC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;QACrD,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;IACpC,CAAC,CAAC,CAAA;IAEF,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACrB;QACE;YACE,iCACE,EAAE,EAAC,eAAe,EAClB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,gBAAgB,EAAC,gBAAgB,EACjC,YAAY,EAAC,gBAAgB;gBAE7B,8BACE,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,IAAI,EACP,KAAK,EAAE,EAAE,MAAM,EAAE,uBAAuB,EAAE,WAAW,EAAE,EAAE,EAAE,GAC3D,CACM,CACL;QACP,gCAAQ,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAC,SAAS,GAAG;QAClD,gCAAQ,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAC,qBAAqB,GAAG;QAC9D,8BACE,CAAC,EAAC,GAAG,EACL,CAAC,EAAC,GAAG,EACL,SAAS,EAAC,gBAAgB,EAC1B,gBAAgB,EAAC,QAAQ,EACzB,UAAU,EAAC,QAAQ,oBAGd;QACP,gCACE,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,IAAI,EAAC,MAAM,EACX,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,CAAC,EAAC,IAAI,GACN,CACA,CACL,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,OAAO,CAAA"}

package/esm/BaseChordDisplay/components/RpcRenderedSvgGroup.d.ts

@@ -0,0 +1,4 @@
+declare function _default({ model }: {
+    model: any;
+}): JSX.Element;
+export default _default;

package/esm/BaseChordDisplay/components/RpcRenderedSvgGroup.js

@@ -0,0 +1,48 @@
+import React, { useEffect, useRef } from 'react';
+import { isAlive } from 'mobx-state-tree';
+import { observer } from 'mobx-react';
+import { hydrate, unmountComponentAtNode } from 'react-dom';
+import { rIC } from '@jbrowse/core/util';
+function RpcRenderedSvgGroup({ model }) {
+    const { data, html, filled, renderingComponent } = model;
+    const ssrContainerNode = useRef(null);
+    useEffect(() => {
+        const domNode = ssrContainerNode.current;
+        function doHydrate() {
+            if (domNode && filled) {
+                if (domNode.innerHTML) {
+                    domNode.style.display = 'none';
+                    unmountComponentAtNode(domNode);
+                }
+                // setting outline:none fixes react "focusable" element issue. see
+                // https://github.com/GMOD/jbrowse-components/issues/2160
+                domNode.style.outline = 'none';
+                domNode.innerHTML = html;
+                // use requestIdleCallback to defer main-thread rendering
+                // and hydration for when we have some free time. helps
+                // keep the framerate up.
+                rIC(() => {
+                    if (!isAlive(model)) {
+                        return;
+                    }
+                    const mainThreadRendering = React.createElement(renderingComponent, { ...data, ...model.renderProps() }, null);
+                    rIC(() => {
+                        if (!isAlive(model)) {
+                            return;
+                        }
+                        hydrate(mainThreadRendering, domNode);
+                    });
+                });
+            }
+        }
+        doHydrate();
+        return () => {
+            if (domNode) {
+                unmountComponentAtNode(domNode);
+            }
+        };
+    });
+    return React.createElement("g", { ref: ssrContainerNode });
+}
+export default observer(RpcRenderedSvgGroup);
+//# sourceMappingURL=RpcRenderedSvgGroup.js.map

package/esm/BaseChordDisplay/components/RpcRenderedSvgGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RpcRenderedSvgGroup.js","sourceRoot":"","sources":["../../../src/BaseChordDisplay/components/RpcRenderedSvgGroup.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAA;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAA;AAExC,SAAS,mBAAmB,CAAC,EAAE,KAAK,EAAE;IACpC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IAExD,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,gBAAgB,CAAC,OAAO,CAAA;QACxC,SAAS,SAAS;YAChB,IAAI,OAAO,IAAI,MAAM,EAAE;gBACrB,IAAI,OAAO,CAAC,SAAS,EAAE;oBACrB,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;oBAC9B,sBAAsB,CAAC,OAAO,CAAC,CAAA;iBAChC;gBAED,kEAAkE;gBAClE,yDAAyD;gBACzD,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;gBAC9B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAA;gBACxB,yDAAyD;gBACzD,uDAAuD;gBACvD,yBAAyB;gBACzB,GAAG,CAAC,GAAG,EAAE;oBACP,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;wBACnB,OAAM;qBACP;oBACD,MAAM,mBAAmB,GAAG,KAAK,CAAC,aAAa,CAC7C,kBAAkB,EAClB,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC,WAAW,EAAE,EAAE,EACnC,IAAI,CACL,CAAA;oBACD,GAAG,CAAC,GAAG,EAAE;wBACP,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;4BACnB,OAAM;yBACP;wBACD,OAAO,CAAC,mBAAmB,EAAE,OAAO,CAAC,CAAA;oBACvC,CAAC,CAAC,CAAA;gBACJ,CAAC,CAAC,CAAA;aACH;QACH,CAAC;QACD,SAAS,EAAE,CAAA;QACX,OAAO,GAAG,EAAE;YACV,IAAI,OAAO,EAAE;gBACX,sBAAsB,CAAC,OAAO,CAAC,CAAA;aAChC;QACH,CAAC,CAAA;IACH,CAAC,CAAC,CAAA;IAEF,OAAO,2BAAG,GAAG,EAAE,gBAAgB,GAAI,CAAA;AACrC,CAAC;AAED,eAAe,QAAQ,CAAC,mBAAmB,CAAC,CAAA"}

package/esm/BaseChordDisplay/index.d.ts

@@ -0,0 +1,3 @@
+export { default as BaseChordDisplayComponent } from './components/BaseChordDisplay';
+export { BaseChordDisplayModel } from './models/BaseChordDisplayModel';
+export { baseChordDisplayConfig } from './models/baseChordDisplayConfig';

package/esm/BaseChordDisplay/index.js

@@ -0,0 +1,4 @@
+export { default as BaseChordDisplayComponent } from './components/BaseChordDisplay';
+export { BaseChordDisplayModel } from './models/BaseChordDisplayModel';
+export { baseChordDisplayConfig } from './models/baseChordDisplayConfig';
+//# sourceMappingURL=index.js.map

package/esm/BaseChordDisplay/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/BaseChordDisplay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,+BAA+B,CAAA;AACpF,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAA;AACtE,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAA"}