@jbrowse/plugin-linear-genome-view 1.6.9 → 1.7.3

package/dist/LinearGenomeView/components/CenterLine.js

@@ -0,0 +1,80 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _styles = require("@material-ui/core/styles");
+
+var _mobxReact = require("mobx-react");
+
+var _react = _interopRequireWildcard(require("react"));
+
+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; }
+
+var useStyles = (0, _styles.makeStyles)(function () {
+  return {
+    centerLineContainer: {
+      background: 'transparent',
+      height: '100%',
+      zIndex: 5,
+      // above the track but under menu
+      position: 'absolute',
+      border: '1px black dashed',
+      borderTop: 'none',
+      borderBottom: 'none',
+      pointerEvents: 'none'
+    },
+    centerLineText: {
+      position: 'absolute',
+      pointerEvents: 'none',
+      whiteSpace: 'nowrap',
+      fontWeight: 'bold'
+    }
+  };
+});
+
+function CenterLine(_ref) {
+  var model = _ref.model;
+  var bpPerPx = model.bpPerPx,
+      centerLineInfo = model.centerLineInfo,
+      trackHeights = model.trackHeights,
+      tracks = model.tracks,
+      width = model.width;
+  var ref = (0, _react.useRef)(null);
+  var classes = useStyles();
+  var startingPosition = width / 2;
+  return tracks.length ? /*#__PURE__*/_react["default"].createElement("div", {
+    "data-testid": "centerline_container",
+    className: classes.centerLineContainer,
+    role: "presentation",
+    ref: ref,
+    style: {
+      left: "".concat(startingPosition, "px"),
+      width: Math.max(1 / bpPerPx, 1)
+    }
+  }, centerLineInfo && /*#__PURE__*/_react["default"].createElement("div", {
+    // text that indicates what bp is center, positioned
+    // at the bottom right of the center line
+    "data-testid": "centerline_text",
+    className: classes.centerLineText,
+    role: "presentation",
+    style: {
+      left: Math.max(1 / bpPerPx, 1) + 5,
+      top: trackHeights
+    }
+  }, centerLineInfo.refName, ":", ' ', Math.max(Math.round(centerLineInfo.offset) + 1, 0))) : null;
+}
+
+CenterLine.propTypes = {
+  model: _mobxReact.PropTypes.objectOrObservableObject.isRequired
+};
+
+var _default = (0, _mobxReact.observer)(CenterLine);
+
+exports["default"] = _default;

package/dist/LinearGenomeView/components/ExportSvgDialog.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import { LinearGenomeViewModel as LGV } from '..';
-export default function ExportSvgDlg({ model, handleClose, }: {
-    model: LGV;
-    handleClose: () => void;
-}): JSX.Element;
+/// <reference types="react" />
+import { LinearGenomeViewModel as LGV } from '..';
+export default function ExportSvgDlg({ model, handleClose, }: {
+    model: LGV;
+    handleClose: () => void;
+}): JSX.Element;

package/dist/LinearGenomeView/components/ExportSvgDialog.js

@@ -0,0 +1,137 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = ExportSvgDlg;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _core = require("@material-ui/core");
+
+var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
+
+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; }
+
+var useStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    closeButton: {
+      position: 'absolute',
+      right: theme.spacing(1),
+      top: theme.spacing(1),
+      color: theme.palette.grey[500]
+    }
+  };
+});
+
+function ExportSvgDlg(_ref) {
+  var model = _ref.model,
+      handleClose = _ref.handleClose;
+  // @ts-ignore
+  var offscreenCanvas = typeof OffscreenCanvas !== 'undefined';
+
+  var _useState = (0, _react.useState)(offscreenCanvas),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      rasterizeLayers = _useState2[0],
+      setRasterizeLayers = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+      loading = _useState4[0],
+      setLoading = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(),
+      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+      error = _useState6[0],
+      setError = _useState6[1];
+
+  var classes = useStyles();
+  return /*#__PURE__*/_react["default"].createElement(_core.Dialog, {
+    open: true,
+    onClose: handleClose
+  }, /*#__PURE__*/_react["default"].createElement(_core.DialogTitle, null, "Export SVG", /*#__PURE__*/_react["default"].createElement(_core.IconButton, {
+    className: classes.closeButton,
+    onClick: handleClose
+  }, /*#__PURE__*/_react["default"].createElement(_Close["default"], null))), /*#__PURE__*/_react["default"].createElement(_core.DialogContent, null, error ? /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      color: 'red'
+    }
+  }, "".concat(error)) : loading ? /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_core.CircularProgress, {
+    size: 20,
+    style: {
+      marginRight: 20
+    }
+  }), /*#__PURE__*/_react["default"].createElement(_core.Typography, {
+    display: "inline"
+  }, "Creating SVG")) : null, offscreenCanvas ? /*#__PURE__*/_react["default"].createElement(_core.FormControlLabel, {
+    control: /*#__PURE__*/_react["default"].createElement(_core.Checkbox, {
+      checked: rasterizeLayers,
+      onChange: function onChange() {
+        return setRasterizeLayers(function (val) {
+          return !val;
+        });
+      }
+    }),
+    label: "Rasterize canvas based tracks? File may be much larger if this is turned off"
+  }) : /*#__PURE__*/_react["default"].createElement(_core.Typography, null, "Note: rasterizing layers not yet supported in this browser, so SVG size may be large")), /*#__PURE__*/_react["default"].createElement(_core.DialogActions, null, /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    variant: "contained",
+    color: "secondary",
+    onClick: function onClick() {
+      return handleClose();
+    }
+  }, "Cancel"), /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    variant: "contained",
+    color: "primary",
+    type: "submit",
+    onClick: /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setLoading(true);
+              setError(undefined);
+              _context.prev = 2;
+              _context.next = 5;
+              return model.exportSvg({
+                rasterizeLayers: rasterizeLayers
+              });
+
+            case 5:
+              handleClose();
+              _context.next = 12;
+              break;
+
+            case 8:
+              _context.prev = 8;
+              _context.t0 = _context["catch"](2);
+              console.error(_context.t0);
+              setError(_context.t0);
+
+            case 12:
+              _context.prev = 12;
+              setLoading(false);
+              return _context.finish(12);
+
+            case 15:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[2, 8, 12, 15]]);
+    }))
+  }, "Submit")));
+}

package/dist/LinearGenomeView/components/Header.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import { LinearGenomeViewModel } from '..';
-declare type LGV = LinearGenomeViewModel;
-declare const LinearGenomeViewHeader: ({ model }: {
-    model: LGV;
-}) => JSX.Element;
-export default LinearGenomeViewHeader;
+/// <reference types="react" />
+import { LinearGenomeViewModel } from '..';
+declare type LGV = LinearGenomeViewModel;
+declare const LinearGenomeViewHeader: ({ model }: {
+    model: LGV;
+}) => JSX.Element;
+export default LinearGenomeViewHeader;

package/dist/LinearGenomeView/components/Header.js

@@ -0,0 +1,144 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _mobxReact = require("mobx-react");
+
+var _core = require("@material-ui/core");
+
+var _SearchBox = _interopRequireDefault(require("./SearchBox"));
+
+var _Icons = require("@jbrowse/core/ui/Icons");
+
+var _ArrowForward = _interopRequireDefault(require("@material-ui/icons/ArrowForward"));
+
+var _ArrowBack = _interopRequireDefault(require("@material-ui/icons/ArrowBack"));
+
+var _ = require("..");
+
+var _OverviewScaleBar = _interopRequireDefault(require("./OverviewScaleBar"));
+
+var _ZoomControls = _interopRequireDefault(require("./ZoomControls"));
+
+// icons
+// locals
+var useStyles = (0, _core.makeStyles)(function (theme) {
+  return {
+    headerBar: {
+      height: _.HEADER_BAR_HEIGHT,
+      display: 'flex'
+    },
+    headerForm: {
+      flexWrap: 'nowrap',
+      marginRight: 7
+    },
+    spacer: {
+      flexGrow: 1
+    },
+    panButton: {
+      background: (0, _core.alpha)(theme.palette.background.paper, 0.8),
+      height: _.WIDGET_HEIGHT,
+      margin: _.SPACING
+    },
+    bp: {
+      display: 'flex',
+      alignItems: 'center',
+      marginLeft: 5
+    },
+    toggleButton: {
+      height: 44,
+      border: 'none',
+      margin: theme.spacing(0.5)
+    },
+    buttonSpacer: {
+      marginRight: theme.spacing(2)
+    }
+  };
+});
+var HeaderButtons = (0, _mobxReact.observer)(function (_ref) {
+  var model = _ref.model;
+  var classes = useStyles();
+  return /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    onClick: model.activateTrackSelector,
+    className: classes.toggleButton,
+    title: "Open track selector",
+    value: "track_select",
+    color: "secondary"
+  }, /*#__PURE__*/_react["default"].createElement(_Icons.TrackSelector, {
+    className: classes.buttonSpacer
+  }));
+});
+
+function PanControls(_ref2) {
+  var model = _ref2.model;
+  var classes = useStyles();
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    variant: "outlined",
+    className: classes.panButton,
+    onClick: function onClick() {
+      return model.slide(-0.9);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_ArrowBack["default"], null)), /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    variant: "outlined",
+    className: classes.panButton,
+    onClick: function onClick() {
+      return model.slide(0.9);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_ArrowForward["default"], null)));
+}
+
+var RegionWidth = (0, _mobxReact.observer)(function (_ref3) {
+  var model = _ref3.model;
+  var classes = useStyles();
+  var coarseTotalBp = model.coarseTotalBp;
+  return /*#__PURE__*/_react["default"].createElement(_core.Typography, {
+    variant: "body2",
+    color: "textSecondary",
+    className: classes.bp
+  }, Math.round(coarseTotalBp).toLocaleString('en-US'), " bp");
+});
+
+var Controls = function Controls(_ref4) {
+  var model = _ref4.model;
+  var classes = useStyles();
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.headerBar
+  }, /*#__PURE__*/_react["default"].createElement(HeaderButtons, {
+    model: model
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.spacer
+  }), /*#__PURE__*/_react["default"].createElement(_core.FormGroup, {
+    row: true,
+    className: classes.headerForm
+  }, /*#__PURE__*/_react["default"].createElement(PanControls, {
+    model: model
+  }), /*#__PURE__*/_react["default"].createElement(_SearchBox["default"], {
+    model: model
+  })), /*#__PURE__*/_react["default"].createElement(RegionWidth, {
+    model: model
+  }), /*#__PURE__*/_react["default"].createElement(_ZoomControls["default"], {
+    model: model
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.spacer
+  }));
+};
+
+var LinearGenomeViewHeader = (0, _mobxReact.observer)(function (_ref5) {
+  var model = _ref5.model;
+  return model.hideHeaderOverview ? /*#__PURE__*/_react["default"].createElement(Controls, {
+    model: model
+  }) : /*#__PURE__*/_react["default"].createElement(_OverviewScaleBar["default"], {
+    model: model
+  }, /*#__PURE__*/_react["default"].createElement(Controls, {
+    model: model
+  }));
+});
+var _default = LinearGenomeViewHeader;
+exports["default"] = _default;

package/dist/LinearGenomeView/components/HelpDialog.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
-export declare const useStyles: (props?: any) => Record<"closeButton", string>;
-export default function HelpDialog({ handleClose, }: {
-    handleClose: () => void;
-}): JSX.Element;
+/// <reference types="react" />
+export declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"closeButton">;
+export default function HelpDialog({ handleClose, }: {
+    handleClose: () => void;
+}): JSX.Element;

package/dist/LinearGenomeView/components/HelpDialog.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = HelpDialog;
+exports.useStyles = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@material-ui/core");
+
+var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
+
+var useStyles = (0, _core.makeStyles)(function (theme) {
+  return {
+    closeButton: {
+      position: 'absolute',
+      right: theme.spacing(1),
+      top: theme.spacing(1),
+      color: theme.palette.grey[500]
+    }
+  };
+});
+exports.useStyles = useStyles;
+
+function HelpDialog(_ref) {
+  var handleClose = _ref.handleClose;
+  var classes = useStyles();
+  return /*#__PURE__*/_react["default"].createElement(_core.Dialog, {
+    open: true,
+    maxWidth: "xl",
+    onClose: handleClose
+  }, /*#__PURE__*/_react["default"].createElement(_core.DialogTitle, null, "Using the search box", handleClose ? /*#__PURE__*/_react["default"].createElement(_core.IconButton, {
+    "data-testid": "close-resultsDialog",
+    className: classes.closeButton,
+    onClick: function onClick() {
+      handleClose();
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Close["default"], null)) : null), /*#__PURE__*/_react["default"].createElement(_core.Divider, null), /*#__PURE__*/_react["default"].createElement(_core.DialogContent, null, /*#__PURE__*/_react["default"].createElement("h3", null, "Searching"), /*#__PURE__*/_react["default"].createElement("ul", null, /*#__PURE__*/_react["default"].createElement("li", null, "Jump to a feature or reference sequence by typing its name in the location box and pressing Enter."), /*#__PURE__*/_react["default"].createElement("li", null, "Jump to a specific region by typing the region into the location box as: ", /*#__PURE__*/_react["default"].createElement("code", null, "ref:start..end"), " or ", /*#__PURE__*/_react["default"].createElement("code", null, "ref:start-end"), ". Commas are allowed in the start and end coordinates. A space-separated list of locstrings can be used to open up multiple chromosomes at a time")), /*#__PURE__*/_react["default"].createElement("h3", null, "Example Searches"), /*#__PURE__*/_react["default"].createElement("ul", null, /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "BRCA"), " - searches for the feature named BRCA"), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "chr4"), " - jumps to chromosome 4"), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "chr4:79,500,000..80,000,000"), " - jumps the region on chromosome 4 between 79.5Mb and 80Mb."), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "chr1:1-100 chr2:1-100"), " - create a split view of chr1:1-100 and chr2:1-100"), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "chr1 chr2 chr3"), " - open up multiple chromosomes at once"), /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("code", null, "chr1:1-100[rev] chr2:1-100"), " - open up the first region in the horizontally flipped orientation"))), /*#__PURE__*/_react["default"].createElement(_core.Divider, null), /*#__PURE__*/_react["default"].createElement(_core.DialogActions, null, /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    onClick: function onClick() {
+      return handleClose();
+    },
+    color: "primary"
+  }, "Close")));
+}

package/dist/LinearGenomeView/components/ImportForm.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import { LinearGenomeViewModel } from '..';
-declare type LGV = LinearGenomeViewModel;
-declare const ImportForm: ({ model }: {
-    model: LGV;
-}) => JSX.Element;
-export default ImportForm;
+/// <reference types="react" />
+import { LinearGenomeViewModel } from '..';
+declare type LGV = LinearGenomeViewModel;
+declare const ImportForm: ({ model }: {
+    model: LGV;
+}) => JSX.Element;
+export default ImportForm;