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

package/dist/BaseLinearDisplay/components/BaseLinearDisplay.js

@@ -1,144 +1,124 @@
 "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, "Tooltip", {
-  enumerable: true,
-  get: function get() {
-    return _Tooltip.default;
-  }
-});
-exports.default = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _mobxReact = require("mobx-react");
-
-var _core = require("@material-ui/core");
-
-var _configuration = require("@jbrowse/core/configuration");
-
-var _ui = require("@jbrowse/core/ui");
-
-var _Tooltip = _interopRequireDefault(require("./Tooltip"));
-
-var _LinearBlocks = _interopRequireDefault(require("./LinearBlocks"));
-
-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; }
-
-// locals
-var useStyles = (0, _core.makeStyles)({
-  display: {
-    position: 'relative',
-    whiteSpace: 'nowrap',
-    textAlign: 'left',
-    width: '100%',
-    minHeight: '100%'
-  }
+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 BaseLinearDisplay = (0, _mobxReact.observer)(function (props) {
-  var classes = useStyles();
-  var theme = (0, _core.useTheme)();
-  var ref = (0, _react.useRef)(null);
-
-  var _useState = (0, _react.useState)(),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      clientRect = _useState2[0],
-      setClientRect = _useState2[1];
-
-  var _useState3 = (0, _react.useState)([0, 0]),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      offsetMouseCoord = _useState4[0],
-      setOffsetMouseCoord = _useState4[1];
-
-  var _useState5 = (0, _react.useState)([0, 0]),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      clientMouseCoord = _useState6[0],
-      setClientMouseCoord = _useState6[1];
-
-  var _useState7 = (0, _react.useState)(),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      contextCoord = _useState8[0],
-      setContextCoord = _useState8[1];
-
-  var model = props.model,
-      children = props.children;
-  var TooltipComponent = model.TooltipComponent,
-      DisplayMessageComponent = model.DisplayMessageComponent,
-      contextMenuItems = model.contextMenuItems,
-      height = model.height,
-      setContextMenuFeature = model.setContextMenuFeature;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
-    "data-testid": "display-".concat((0, _configuration.getConf)(model, 'displayId')),
-    className: classes.display,
-    onContextMenu: function onContextMenu(event) {
-      event.preventDefault();
-
-      if (contextCoord) {
-        // There's already a context menu open, so close it
-        setContextCoord(undefined);
-      } else if (ref.current) {
-        setContextCoord([event.clientX, event.clientY]);
-      }
-    },
-    onMouseMove: function onMouseMove(event) {
-      if (!ref.current) {
-        return;
-      }
-
-      var rect = ref.current.getBoundingClientRect();
-      var left = rect.left,
-          top = rect.top;
-      setOffsetMouseCoord([event.clientX - left, event.clientY - top]);
-      setClientMouseCoord([event.clientX, event.clientY]);
-      setClientRect(rect);
+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 __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);
     }
-  }, DisplayMessageComponent ? /*#__PURE__*/_react.default.createElement(DisplayMessageComponent, {
-    model: model
-  }) : /*#__PURE__*/_react.default.createElement(_LinearBlocks.default, props), children, /*#__PURE__*/_react.default.createElement(TooltipComponent, {
-    model: model,
-    height: height,
-    offsetMouseCoord: offsetMouseCoord,
-    clientMouseCoord: clientMouseCoord,
-    clientRect: clientRect,
-    mouseCoord: offsetMouseCoord
-  }), /*#__PURE__*/_react.default.createElement(_ui.Menu, {
-    open: Boolean(contextCoord) && Boolean(contextMenuItems().length),
-    onMenuItemClick: function onMenuItemClick(_, callback) {
-      callback();
-      setContextCoord(undefined);
-    },
-    onClose: function onClose() {
-      setContextCoord(undefined);
-      setContextMenuFeature(undefined);
-    },
-    TransitionProps: {
-      onExit: function onExit() {
-        setContextCoord(undefined);
-        setContextMenuFeature(undefined);
-      }
-    },
-    anchorReference: "anchorPosition",
-    anchorPosition: contextCoord ? {
-      top: contextCoord[1],
-      left: contextCoord[0]
-    } : undefined,
-    style: {
-      zIndex: theme.zIndex.tooltip
+    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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tooltip = void 0;
+var react_1 = __importStar(require("react"));
+var mobx_react_1 = require("mobx-react");
+var material_1 = require("@mui/material");
+var mui_1 = require("tss-react/mui");
+var configuration_1 = require("@jbrowse/core/configuration");
+var ui_1 = require("@jbrowse/core/ui");
+// locals
+var Tooltip_1 = __importDefault(require("./Tooltip"));
+exports.Tooltip = Tooltip_1.default;
+var LinearBlocks_1 = __importDefault(require("./LinearBlocks"));
+var useStyles = (0, mui_1.makeStyles)()({
+    display: {
+        position: 'relative',
+        whiteSpace: 'nowrap',
+        textAlign: 'left',
+        width: '100%',
+        minHeight: '100%',
     },
-    menuItems: contextMenuItems(),
-    "data-testid": "base_linear_display_context_menu"
-  }));
 });
-var _default = BaseLinearDisplay;
-exports.default = _default;
+var BaseLinearDisplay = (0, mobx_react_1.observer)(function (props) {
+    var classes = useStyles().classes;
+    var theme = (0, material_1.useTheme)();
+    var ref = (0, react_1.useRef)(null);
+    var _a = __read((0, react_1.useState)(), 2), clientRect = _a[0], setClientRect = _a[1];
+    var _b = __read((0, react_1.useState)([0, 0]), 2), offsetMouseCoord = _b[0], setOffsetMouseCoord = _b[1];
+    var _c = __read((0, react_1.useState)([0, 0]), 2), clientMouseCoord = _c[0], setClientMouseCoord = _c[1];
+    var _d = __read((0, react_1.useState)(), 2), contextCoord = _d[0], setContextCoord = _d[1];
+    var model = props.model, children = props.children;
+    var TooltipComponent = model.TooltipComponent, DisplayMessageComponent = model.DisplayMessageComponent, contextMenuItems = model.contextMenuItems, height = model.height, setContextMenuFeature = model.setContextMenuFeature;
+    return (react_1.default.createElement("div", { ref: ref, "data-testid": "display-".concat((0, configuration_1.getConf)(model, 'displayId')), className: classes.display, onContextMenu: function (event) {
+            event.preventDefault();
+            if (contextCoord) {
+                // There's already a context menu open, so close it
+                setContextCoord(undefined);
+            }
+            else if (ref.current) {
+                setContextCoord([event.clientX, event.clientY]);
+            }
+        }, onMouseMove: function (event) {
+            if (!ref.current) {
+                return;
+            }
+            var rect = ref.current.getBoundingClientRect();
+            var left = rect.left, top = rect.top;
+            setOffsetMouseCoord([event.clientX - left, event.clientY - top]);
+            setClientMouseCoord([event.clientX, event.clientY]);
+            setClientRect(rect);
+        } },
+        DisplayMessageComponent ? (react_1.default.createElement(DisplayMessageComponent, { model: model })) : (react_1.default.createElement(LinearBlocks_1.default, __assign({}, props))),
+        children,
+        react_1.default.createElement(TooltipComponent, { model: model, height: height, offsetMouseCoord: offsetMouseCoord, clientMouseCoord: clientMouseCoord, clientRect: clientRect, mouseCoord: offsetMouseCoord }),
+        react_1.default.createElement(ui_1.Menu, { open: Boolean(contextCoord) && Boolean(contextMenuItems().length), onMenuItemClick: function (_, callback) {
+                callback();
+                setContextCoord(undefined);
+            }, onClose: function () {
+                setContextCoord(undefined);
+                setContextMenuFeature(undefined);
+            }, TransitionProps: {
+                onExit: function () {
+                    setContextCoord(undefined);
+                    setContextMenuFeature(undefined);
+                },
+            }, anchorReference: "anchorPosition", anchorPosition: contextCoord
+                ? { top: contextCoord[1], left: contextCoord[0] }
+                : undefined, style: { zIndex: theme.zIndex.tooltip }, menuItems: contextMenuItems(), "data-testid": "base_linear_display_context_menu" })));
+});
+exports.default = BaseLinearDisplay;
+//# sourceMappingURL=BaseLinearDisplay.js.map

package/dist/BaseLinearDisplay/components/BaseLinearDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseLinearDisplay.js","sourceRoot":"","sources":["../../../src/BaseLinearDisplay/components/BaseLinearDisplay.tsx"],"names":[],"mappings":"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"}

package/dist/BaseLinearDisplay/components/Block.js

@@ -1,86 +1,65 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ContentBlock = void 0;
-exports.ElidedBlock = ElidedBlock;
-exports.InterRegionPaddingBlock = InterRegionPaddingBlock;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _mobxReact = require("mobx-react");
-
-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; }
-
-var useStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InterRegionPaddingBlock = exports.ElidedBlock = exports.ContentBlock = void 0;
+var react_1 = __importDefault(require("react"));
+var mui_1 = require("tss-react/mui");
+var mobx_react_1 = require("mobx-react");
+var useStyles = (0, mui_1.makeStyles)()(function (theme) { return ({
     contentBlock: {
-      position: 'relative',
-      minHeight: '100%',
-      boxSizing: 'border-box',
-      whiteSpace: 'nowrap',
-      overflow: 'hidden'
+        position: 'relative',
+        minHeight: '100%',
+        boxSizing: 'border-box',
+        whiteSpace: 'nowrap',
+        overflow: 'hidden',
     },
     elidedBlock: {
-      minHeight: '100%',
-      boxSizing: 'border-box',
-      backgroundColor: '#999',
-      backgroundImage: 'repeating-linear-gradient(90deg, transparent, transparent 1px, rgba(255,255,255,.5) 1px, rgba(255,255,255,.5) 3px)'
+        minHeight: '100%',
+        boxSizing: 'border-box',
+        backgroundColor: '#999',
+        backgroundImage: 'repeating-linear-gradient(90deg, transparent, transparent 1px, rgba(255,255,255,.5) 1px, rgba(255,255,255,.5) 3px)',
     },
     interRegionPaddingBlock: {
-      minHeight: '100%',
-      backgroundColor: theme.palette.text.primary
+        minHeight: '100%',
+        backgroundColor: theme.palette.text.primary,
     },
     boundaryPaddingBlock: {
-      minHeight: '100%',
-      backgroundColor: theme.palette.action.disabledBackground
-    }
-  };
-});
-var ContentBlock = (0, _mobxReact.observer)(function (_ref) {
-  var block = _ref.block,
-      children = _ref.children;
-  var classes = useStyles();
-  var widthPx = block.widthPx;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      width: widthPx
+        minHeight: '100%',
+        backgroundColor: theme.palette.action.disabledBackground,
     },
-    className: classes.contentBlock
-  }, children);
+}); });
+var ContentBlock = (0, mobx_react_1.observer)(function (_a) {
+    var block = _a.block, children = _a.children;
+    var classes = useStyles().classes;
+    var widthPx = block.widthPx;
+    return (react_1.default.createElement("div", { style: { width: widthPx }, className: classes.contentBlock }, children));
 });
 exports.ContentBlock = ContentBlock;
-
-function ElidedBlock(_ref2) {
-  var width = _ref2.width;
-  var classes = useStyles();
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.elidedBlock,
-    style: {
-      width: width
-    }
-  });
+function ElidedBlock(_a) {
+    var width = _a.width;
+    var classes = useStyles().classes;
+    return react_1.default.createElement("div", { className: classes.elidedBlock, style: { width: width } });
 }
-
-function InterRegionPaddingBlock(_ref3) {
-  var boundary = _ref3.boundary,
-      width = _ref3.width,
-      _ref3$style = _ref3.style,
-      style = _ref3$style === void 0 ? {} : _ref3$style;
-  var classes = useStyles();
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: _objectSpread(_objectSpread({}, style), {}, {
-      width: width
-    }),
-    className: boundary ? classes.boundaryPaddingBlock : classes.interRegionPaddingBlock
-  });
-}
+exports.ElidedBlock = ElidedBlock;
+function InterRegionPaddingBlock(_a) {
+    var boundary = _a.boundary, width = _a.width, _b = _a.style, style = _b === void 0 ? {} : _b;
+    var classes = useStyles().classes;
+    return (react_1.default.createElement("div", { style: __assign(__assign({}, style), { width: width }), className: boundary
+            ? classes.boundaryPaddingBlock
+            : classes.interRegionPaddingBlock }));
+}
+exports.InterRegionPaddingBlock = InterRegionPaddingBlock;
+//# sourceMappingURL=Block.js.map

package/dist/BaseLinearDisplay/components/Block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Block.js","sourceRoot":"","sources":["../../../src/BaseLinearDisplay/components/Block.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AAEzB,qCAA0C;AAC1C,yCAAqC;AAErC,IAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,CAAC,UAAA,KAAK,IAAI,OAAA,CAAC;IACvC,YAAY,EAAE;QACZ,QAAQ,EAAE,UAAU;QACpB,SAAS,EAAE,MAAM;QACjB,SAAS,EAAE,YAAY;QACvB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,QAAQ;KACnB;IACD,WAAW,EAAE;QACX,SAAS,EAAE,MAAM;QACjB,SAAS,EAAE,YAAY;QACvB,eAAe,EAAE,MAAM;QACvB,eAAe,EACb,oHAAoH;KACvH;IACD,uBAAuB,EAAE;QACvB,SAAS,EAAE,MAAM;QACjB,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;KAC5C;IACD,oBAAoB,EAAE;QACpB,SAAS,EAAE,MAAM;QACjB,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,kBAAkB;KACzD;CACF,CAAC,EAvBsC,CAuBtC,CAAC,CAAA;AAEH,IAAM,YAAY,GAAG,IAAA,qBAAQ,EAC3B,UAAC,EAAoE;QAAlE,KAAK,WAAA,EAAE,QAAQ,cAAA;IACR,IAAA,OAAO,GAAK,SAAS,EAAE,QAAhB,CAAgB;IACvB,IAAA,OAAO,GAAK,KAAK,QAAV,CAAU;IACzB,OAAO,CACL,uCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,YAAY,IAC5D,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAgCQ,oCAAY;AA9BrB,SAAS,WAAW,CAAC,EAA4B;QAA1B,KAAK,WAAA;IAClB,IAAA,OAAO,GAAK,SAAS,EAAE,QAAhB,CAAgB;IAC/B,OAAO,uCAAK,SAAS,EAAE,OAAO,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,KAAK,OAAA,EAAE,GAAI,CAAA;AAClE,CAAC;AA2BsB,kCAAW;AAzBlC,SAAS,uBAAuB,CAAC,EAQhC;QAPC,QAAQ,cAAA,EACR,KAAK,WAAA,EACL,aAAU,EAAV,KAAK,mBAAG,EAAE,KAAA;IAMF,IAAA,OAAO,GAAK,SAAS,EAAE,QAAhB,CAAgB;IAC/B,OAAO,CACL,uCACE,KAAK,wBACA,KAAK,KACR,KAAK,OAAA,KAEP,SAAS,EACP,QAAQ;YACN,CAAC,CAAC,OAAO,CAAC,oBAAoB;YAC9B,CAAC,CAAC,OAAO,CAAC,uBAAuB,GAErC,CACH,CAAA;AACH,CAAC;AAEmC,0DAAuB"}

package/dist/BaseLinearDisplay/components/LinearBlocks.d.ts

@@ -1,6 +1,16 @@
 /// <reference types="react" />
 import { BaseLinearDisplayModel } from '../models/BaseLinearDisplayModel';
-declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"linearBlocks" | "heightOverflowed">;
+declare const useStyles: (params: void, styleOverrides?: {
+    props: {
+        classes?: Record<string, string> | undefined;
+    } & Record<string, unknown>;
+    ownerState?: Record<string, unknown> | undefined;
+} | undefined) => {
+    classes: Record<"linearBlocks" | "heightOverflowed", string>;
+    theme: import("@mui/material").Theme;
+    css: import("tss-react/types").Css;
+    cx: import("tss-react/types").Cx;
+};
 declare const RenderedBlocks: ({ model }: {
     model: BaseLinearDisplayModel;
 }) => JSX.Element;

package/dist/BaseLinearDisplay/components/LinearBlocks.js

@@ -1,110 +1,71 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useStyles = exports.default = exports.RenderedBlocks = void 0;
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _util = require("@jbrowse/core/util");
-
-var _mobxReact = require("mobx-react");
-
-var _blockTypes = require("@jbrowse/core/util/blockTypes");
-
-var _Block = require("./Block");
-
-var useStyles = (0, _styles.makeStyles)({
-  linearBlocks: {
-    whiteSpace: 'nowrap',
-    textAlign: 'left',
-    position: 'absolute',
-    minHeight: '100%',
-    display: 'flex'
-  },
-  heightOverflowed: {
-    position: 'absolute',
-    color: 'rgb(77,77,77)',
-    borderBottom: '2px solid rgb(77,77,77)',
-    textShadow: 'white 0px 0px 1px',
-    whiteSpace: 'nowrap',
-    width: '100%',
-    fontWeight: 'bold',
-    textAlign: 'center',
-    zIndex: 2000,
-    boxSizing: 'border-box'
-  }
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = exports.RenderedBlocks = void 0;
+var react_1 = __importDefault(require("react"));
+var mui_1 = require("tss-react/mui");
+var util_1 = require("@jbrowse/core/util");
+var mobx_react_1 = require("mobx-react");
+var blockTypes_1 = require("@jbrowse/core/util/blockTypes");
+var Block_1 = require("./Block");
+var useStyles = (0, mui_1.makeStyles)()({
+    linearBlocks: {
+        whiteSpace: 'nowrap',
+        textAlign: 'left',
+        position: 'absolute',
+        minHeight: '100%',
+        display: 'flex',
+    },
+    heightOverflowed: {
+        position: 'absolute',
+        color: 'rgb(77,77,77)',
+        borderBottom: '2px solid rgb(77,77,77)',
+        textShadow: 'white 0px 0px 1px',
+        whiteSpace: 'nowrap',
+        width: '100%',
+        fontWeight: 'bold',
+        textAlign: 'center',
+        zIndex: 2000,
+        boxSizing: 'border-box',
+    },
 });
 exports.useStyles = useStyles;
-var RenderedBlocks = (0, _mobxReact.observer)(function (_ref) {
-  var model = _ref.model;
-  var classes = useStyles();
-  var blockDefinitions = model.blockDefinitions,
-      blockState = model.blockState;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, blockDefinitions.map(function (block) {
-    if (block instanceof _blockTypes.ContentBlock) {
-      var state = blockState.get(block.key);
-      return /*#__PURE__*/_react.default.createElement(_Block.ContentBlock, {
-        block: block,
-        key: "".concat(model.id, "-").concat(block.key)
-      }, state && state.ReactComponent ? /*#__PURE__*/_react.default.createElement(state.ReactComponent, {
-        model: state
-      }) : null, state && state.maxHeightReached ? /*#__PURE__*/_react.default.createElement("div", {
-        className: classes.heightOverflowed,
-        style: {
-          top: state.layout.getTotalHeight() - 16,
-          pointerEvents: 'none',
-          height: 16
+var RenderedBlocks = (0, mobx_react_1.observer)(function (_a) {
+    var model = _a.model;
+    var classes = useStyles().classes;
+    var blockDefinitions = model.blockDefinitions, blockState = model.blockState;
+    return (react_1.default.createElement(react_1.default.Fragment, null, blockDefinitions.map(function (block) {
+        if (block instanceof blockTypes_1.ContentBlock) {
+            var state = blockState.get(block.key);
+            return (react_1.default.createElement(Block_1.ContentBlock, { block: block, key: "".concat(model.id, "-").concat(block.key) },
+                state && state.ReactComponent ? (react_1.default.createElement(state.ReactComponent, { model: state })) : null,
+                state && state.maxHeightReached ? (react_1.default.createElement("div", { className: classes.heightOverflowed, style: {
+                        top: state.layout.getTotalHeight() - 16,
+                        pointerEvents: 'none',
+                        height: 16,
+                    } }, "Max height reached")) : null));
+        }
+        if (block instanceof blockTypes_1.ElidedBlock) {
+            return (react_1.default.createElement(Block_1.ElidedBlock, { key: "".concat(model.id, "-").concat(block.key), width: block.widthPx }));
+        }
+        if (block instanceof blockTypes_1.InterRegionPaddingBlock) {
+            return (react_1.default.createElement(Block_1.InterRegionPaddingBlock, { key: block.key, width: block.widthPx, style: { background: 'none' }, boundary: block.variant === 'boundary' }));
         }
-      }, "Max height reached") : null);
-    }
-
-    if (block instanceof _blockTypes.ElidedBlock) {
-      return /*#__PURE__*/_react.default.createElement(_Block.ElidedBlock, {
-        key: "".concat(model.id, "-").concat(block.key),
-        width: block.widthPx
-      });
-    }
-
-    if (block instanceof _blockTypes.InterRegionPaddingBlock) {
-      return /*#__PURE__*/_react.default.createElement(_Block.InterRegionPaddingBlock, {
-        key: block.key,
-        width: block.widthPx,
-        style: {
-          background: 'none'
-        },
-        boundary: block.variant === 'boundary'
-      });
-    }
-
-    throw new Error("invalid block type ".concat((0, _typeof2.default)(block)));
-  }));
+        throw new Error("invalid block type ".concat(typeof block));
+    })));
 });
 exports.RenderedBlocks = RenderedBlocks;
-
-function LinearBlocks(_ref2) {
-  var model = _ref2.model;
-  var classes = useStyles();
-  var blockDefinitions = model.blockDefinitions;
-  var viewModel = (0, _util.getContainingView)(model);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": "Blockset",
-    className: classes.linearBlocks,
-    style: {
-      left: blockDefinitions.offsetPx - viewModel.offsetPx
-    }
-  }, /*#__PURE__*/_react.default.createElement(RenderedBlocks, {
-    model: model
-  }));
+function LinearBlocks(_a) {
+    var model = _a.model;
+    var classes = useStyles().classes;
+    var blockDefinitions = model.blockDefinitions;
+    var viewModel = (0, util_1.getContainingView)(model);
+    return (react_1.default.createElement("div", { "data-testid": "Blockset", className: classes.linearBlocks, style: {
+            left: blockDefinitions.offsetPx - viewModel.offsetPx,
+        } },
+        react_1.default.createElement(RenderedBlocks, { model: model })));
 }
-
-var _default = (0, _mobxReact.observer)(LinearBlocks);
-
-exports.default = _default;
+exports.default = (0, mobx_react_1.observer)(LinearBlocks);
+//# sourceMappingURL=LinearBlocks.js.map

package/dist/BaseLinearDisplay/components/LinearBlocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinearBlocks.js","sourceRoot":"","sources":["../../../src/BaseLinearDisplay/components/LinearBlocks.tsx"],"names":[],"mappings":"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"}