@jbrowse/plugin-linear-genome-view 1.6.7 → 1.7.0

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

@@ -14,8 +14,8 @@ import { isFeature } from '@jbrowse/core/util/simpleFeature';
 import { getParentRenderProps, getTrackAssemblyNames, getRpcSessionId } from '@jbrowse/core/util/tracks';
 import { getParent, types, cast, isAlive, addDisposer, getEnv, resolveIdentifier, getRoot, getSnapshot } from 'mobx-state-tree';
 import MenuOpenIcon from '@material-ui/icons/MenuOpen';
-import { Menu, ResizeHandle, ReturnToImportFormDialog } from '@jbrowse/core/ui';
 import { observer, PropTypes } from 'mobx-react';
+import { Menu, ResizeHandle, ReturnToImportFormDialog } from '@jbrowse/core/ui';
 import { usePopper } from 'react-popper';
 import { makeStyles } from '@material-ui/core/styles';
 import { ContentBlock as ContentBlock$1, ElidedBlock as ElidedBlock$1, InterRegionPaddingBlock as InterRegionPaddingBlock$1 } from '@jbrowse/core/util/blockTypes';
@@ -1459,14 +1459,17 @@ var BaseLinearDisplay = /*#__PURE__*/observer(function (props) {
       }
     },
     onMouseMove: function onMouseMove(event) {
-      if (ref.current) {
-        var rect = ref.current.getBoundingClientRect();
-        setOffsetMouseCoord([event.clientX - rect.left, event.clientY - rect.top]);
-        setClientMouseCoord([event.clientX, event.clientY]);
-        setClientRect(rect);
+      if (!ref.current) {
+        return;
       }
-    },
-    role: "presentation"
+
+      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 ? /*#__PURE__*/React.createElement(DisplayMessageComponent, {
     model: model
   }) : /*#__PURE__*/React.createElement(LinearBlocks$1, Object.assign({}, props)), children, /*#__PURE__*/React.createElement(TooltipComponent, {
@@ -4663,7 +4666,7 @@ var TrackLabel$1 = /*#__PURE__*/observer(TrackLabel);
 var useStyles$c = /*#__PURE__*/makeStyles(function (theme) {
   return {
     root: {
-      margin: 2
+      marginTop: 2
     },
     resizeHandle: {
       height: RESIZE_HANDLE_HEIGHT,
@@ -4683,6 +4686,15 @@ var useStyles$c = /*#__PURE__*/makeStyles(function (theme) {
     trackLabel: {
       zIndex: 3
     },
+    // aligns with block bounderies. check for example the breakpoint split view
+    // demo to see if features align if wanting to change things
+    renderingComponentContainer: {
+      position: 'absolute',
+      // -1 offset because of the 1px border of the Paper
+      left: -1,
+      height: '100%',
+      width: '100%'
+    },
     trackLabelInline: {
       position: 'relative',
       display: 'inline-block'
@@ -4696,13 +4708,11 @@ var useStyles$c = /*#__PURE__*/makeStyles(function (theme) {
       whiteSpace: 'nowrap',
       position: 'relative',
       background: 'none',
-      zIndex: 2,
-      boxSizing: 'content-box'
+      zIndex: 2
     }
   };
 });
-
-function TrackContainerLabel(_ref) {
+var TrackContainerLabel = /*#__PURE__*/observer(function (_ref) {
   var model = _ref.model,
       view = _ref.view;
   var classes = useStyles$c();
@@ -4711,7 +4721,7 @@ function TrackContainerLabel(_ref) {
     track: model,
     className: clsx(classes.trackLabel, labelStyle)
   }) : null;
-}
+});
 
 function TrackContainer(_ref2) {
   var model = _ref2.model,
@@ -4764,6 +4774,7 @@ function TrackContainer(_ref2) {
     role: "presentation"
   }, /*#__PURE__*/React.createElement("div", {
     ref: ref,
+    className: classes.renderingComponentContainer,
     style: {
       transform: "scaleX(".concat(model.scaleFactor, ")")
     }
@@ -8056,26 +8067,30 @@ function SetMaxHeightDlg$1(props) {
     "aria-label": "close",
     className: classes.closeButton,
     onClick: handleClose
-  }, /*#__PURE__*/React.createElement(CloseIcon, null))), /*#__PURE__*/React.createElement(DialogContent, null, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(CloseIcon, null))), /*#__PURE__*/React.createElement(DialogContent, {
     className: classes.root
-  }, /*#__PURE__*/React.createElement(Typography$1, null, "Set max height for the track"), /*#__PURE__*/React.createElement(TextField, {
+  }, /*#__PURE__*/React.createElement(Typography$1, null, "Set max height for the track. For example, you can increase this if the layout says \"Max height reached\""), /*#__PURE__*/React.createElement(TextField, {
     value: max,
     onChange: function onChange(event) {
-      setMax(event.target.value);
+      return setMax(event.target.value);
     },
     placeholder: "Enter max score"
-  }), /*#__PURE__*/React.createElement(Button$1, {
+  }), /*#__PURE__*/React.createElement(DialogActions, null, /*#__PURE__*/React.createElement(Button$1, {
     variant: "contained",
     color: "primary",
     type: "submit",
-    style: {
-      marginLeft: 20
-    },
+    autoFocus: true,
     onClick: function onClick() {
       model.setMaxHeight(max !== '' && !Number.isNaN(+max) ? +max : undefined);
       handleClose();
     }
-  }, "Submit"))));
+  }, "Submit"), /*#__PURE__*/React.createElement(Button$1, {
+    variant: "contained",
+    color: "secondary",
+    onClick: function onClick() {
+      return handleClose();
+    }
+  }, "Cancel"))));
 }
 
 var SetMaxHeight = /*#__PURE__*/observer(SetMaxHeightDlg$1);