@jbrowse/plugin-linear-genome-view 1.7.8 → 1.7.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/BaseLinearDisplay/components/BaseLinearDisplay.d.ts +1 -5
- package/dist/BaseLinearDisplay/components/BaseLinearDisplay.js +32 -120
- package/dist/BaseLinearDisplay/components/Tooltip.d.ts +8 -0
- package/dist/BaseLinearDisplay/components/Tooltip.js +125 -0
- package/dist/BaseLinearDisplay/models/BaseLinearDisplayModel.d.ts +4 -4
- package/dist/BaseLinearDisplay/models/BaseLinearDisplayModel.js +3 -2
- package/dist/LinearBareDisplay/model.d.ts +1 -1
- package/dist/LinearBasicDisplay/model.d.ts +1 -2
- package/dist/LinearBasicDisplay/model.js +2 -2
- package/dist/LinearGenomeView/components/ExportSvgDialog.js +35 -25
- package/dist/LinearGenomeView/components/Header.d.ts +0 -1
- package/dist/LinearGenomeView/components/Header.js +3 -1
- package/dist/LinearGenomeView/components/HelpDialog.js +2 -3
- package/dist/LinearGenomeView/components/ImportForm.d.ts +0 -1
- package/dist/LinearGenomeView/components/ImportForm.js +40 -70
- package/dist/LinearGenomeView/components/LinearGenomeView.js +6 -2
- package/dist/LinearGenomeView/components/LinearGenomeView.test.js +2 -2
- package/dist/LinearGenomeView/components/OverviewScaleBar.d.ts +21 -5
- package/dist/LinearGenomeView/components/OverviewScaleBar.js +25 -18
- package/dist/LinearGenomeView/components/ScaleBar.d.ts +6 -2
- package/dist/LinearGenomeView/components/ScaleBar.js +8 -3
- package/dist/LinearGenomeView/components/SearchBox.js +36 -72
- package/dist/LinearGenomeView/components/SearchResultsDialog.d.ts +1 -1
- package/dist/LinearGenomeView/components/SearchResultsDialog.js +0 -1
- package/dist/LinearGenomeView/components/TrackLabel.js +25 -41
- package/dist/LinearGenomeView/components/util.d.ts +12 -0
- package/dist/LinearGenomeView/components/util.js +59 -0
- package/dist/LinearGenomeView/index.d.ts +7 -11
- package/dist/LinearGenomeView/index.js +60 -33
- package/dist/LinearGenomeView/index.test.js +22 -5
- package/dist/index.d.ts +3 -3
- package/dist/index.js +22 -11
- package/package.json +3 -2
- package/src/BaseLinearDisplay/components/BaseLinearDisplay.tsx +4 -89
- package/src/BaseLinearDisplay/components/Tooltip.tsx +97 -0
- package/src/BaseLinearDisplay/models/BaseLinearDisplayModel.tsx +11 -4
- package/src/LinearBasicDisplay/model.ts +2 -4
- package/src/LinearGenomeView/components/ExportSvgDialog.tsx +24 -11
- package/src/LinearGenomeView/components/Header.tsx +2 -1
- package/src/LinearGenomeView/components/HelpDialog.tsx +5 -4
- package/src/LinearGenomeView/components/ImportForm.tsx +18 -25
- package/src/LinearGenomeView/components/LinearGenomeView.test.js +2 -2
- package/src/LinearGenomeView/components/LinearGenomeView.tsx +16 -10
- package/src/LinearGenomeView/components/OverviewScaleBar.tsx +42 -34
- package/src/LinearGenomeView/components/ScaleBar.tsx +6 -9
- package/src/LinearGenomeView/components/SearchBox.tsx +18 -29
- package/src/LinearGenomeView/components/SearchResultsDialog.tsx +0 -1
- package/src/LinearGenomeView/components/TrackLabel.tsx +25 -28
- package/src/LinearGenomeView/components/__snapshots__/LinearGenomeView.test.js.snap +4 -21
- package/src/LinearGenomeView/components/util.ts +43 -0
- package/src/LinearGenomeView/index.test.ts +20 -5
- package/src/LinearGenomeView/index.tsx +56 -27
- package/src/index.ts +35 -30
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import Tooltip from './Tooltip';
|
|
2
3
|
import { BaseLinearDisplayModel } from '../models/BaseLinearDisplayModel';
|
|
3
|
-
declare const Tooltip: ({ model, clientMouseCoord, }: {
|
|
4
|
-
model: BaseLinearDisplayModel;
|
|
5
|
-
clientMouseCoord: Coord;
|
|
6
|
-
}) => JSX.Element | null;
|
|
7
|
-
declare type Coord = [number, number];
|
|
8
4
|
declare const BaseLinearDisplay: (props: {
|
|
9
5
|
model: BaseLinearDisplayModel;
|
|
10
6
|
children?: React.ReactNode;
|
|
@@ -7,11 +7,13 @@ var _typeof = require("@babel/runtime/helpers/typeof");
|
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
10
|
-
exports
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
Object.defineProperty(exports, "Tooltip", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _Tooltip.default;
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
exports.default = void 0;
|
|
15
17
|
|
|
16
18
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
19
|
|
|
@@ -25,7 +27,7 @@ var _configuration = require("@jbrowse/core/configuration");
|
|
|
25
27
|
|
|
26
28
|
var _ui = require("@jbrowse/core/ui");
|
|
27
29
|
|
|
28
|
-
var
|
|
30
|
+
var _Tooltip = _interopRequireDefault(require("./Tooltip"));
|
|
29
31
|
|
|
30
32
|
var _LinearBlocks = _interopRequireDefault(require("./LinearBlocks"));
|
|
31
33
|
|
|
@@ -33,130 +35,40 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
33
35
|
|
|
34
36
|
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; }
|
|
35
37
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
return {
|
|
46
|
-
display: {
|
|
47
|
-
position: 'relative',
|
|
48
|
-
whiteSpace: 'nowrap',
|
|
49
|
-
textAlign: 'left',
|
|
50
|
-
width: '100%',
|
|
51
|
-
minHeight: '100%'
|
|
52
|
-
},
|
|
53
|
-
// these styles come from
|
|
54
|
-
// https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Tooltip/Tooltip.js
|
|
55
|
-
tooltip: {
|
|
56
|
-
pointerEvents: 'none',
|
|
57
|
-
backgroundColor: (0, _core.alpha)(theme.palette.grey[700], 0.9),
|
|
58
|
-
borderRadius: theme.shape.borderRadius,
|
|
59
|
-
color: theme.palette.common.white,
|
|
60
|
-
fontFamily: theme.typography.fontFamily,
|
|
61
|
-
padding: '4px 8px',
|
|
62
|
-
fontSize: theme.typography.pxToRem(12),
|
|
63
|
-
lineHeight: "".concat(round(14 / 10), "em"),
|
|
64
|
-
maxWidth: 300,
|
|
65
|
-
wordWrap: 'break-word'
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
});
|
|
69
|
-
|
|
70
|
-
var TooltipContents = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
71
|
-
var message = _ref.message;
|
|
72
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
73
|
-
ref: ref
|
|
74
|
-
}, message);
|
|
38
|
+
// locals
|
|
39
|
+
var useStyles = (0, _core.makeStyles)({
|
|
40
|
+
display: {
|
|
41
|
+
position: 'relative',
|
|
42
|
+
whiteSpace: 'nowrap',
|
|
43
|
+
textAlign: 'left',
|
|
44
|
+
width: '100%',
|
|
45
|
+
minHeight: '100%'
|
|
46
|
+
}
|
|
75
47
|
});
|
|
76
|
-
|
|
77
|
-
var Tooltip = (0, _mobxReact.observer)(function (_ref2) {
|
|
78
|
-
var model = _ref2.model,
|
|
79
|
-
clientMouseCoord = _ref2.clientMouseCoord;
|
|
48
|
+
var BaseLinearDisplay = (0, _mobxReact.observer)(function (props) {
|
|
80
49
|
var classes = useStyles();
|
|
81
|
-
var
|
|
50
|
+
var theme = (0, _core.useTheme)();
|
|
51
|
+
var ref = (0, _react.useRef)(null);
|
|
82
52
|
|
|
83
|
-
var _useState = (0, _react.useState)(
|
|
53
|
+
var _useState = (0, _react.useState)(),
|
|
84
54
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
85
|
-
|
|
86
|
-
|
|
55
|
+
clientRect = _useState2[0],
|
|
56
|
+
setClientRect = _useState2[1];
|
|
87
57
|
|
|
88
|
-
var _useState3 = (0, _react.useState)(
|
|
58
|
+
var _useState3 = (0, _react.useState)([0, 0]),
|
|
89
59
|
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
var virtElement = (0, _react.useMemo)(function () {
|
|
95
|
-
return {
|
|
96
|
-
getBoundingClientRect: function getBoundingClientRect() {
|
|
97
|
-
var x = clientMouseCoord[0] + width / 2 + 20;
|
|
98
|
-
var y = clientMouseCoord[1];
|
|
99
|
-
return {
|
|
100
|
-
top: y,
|
|
101
|
-
left: x,
|
|
102
|
-
bottom: y,
|
|
103
|
-
right: x,
|
|
104
|
-
width: 0,
|
|
105
|
-
height: 0,
|
|
106
|
-
x: x,
|
|
107
|
-
y: y,
|
|
108
|
-
toJSON: function toJSON() {}
|
|
109
|
-
};
|
|
110
|
-
}
|
|
111
|
-
};
|
|
112
|
-
}, [clientMouseCoord, width]);
|
|
113
|
-
|
|
114
|
-
var _usePopper = (0, _reactPopper.usePopper)(virtElement, popperElt),
|
|
115
|
-
styles = _usePopper.styles,
|
|
116
|
-
attributes = _usePopper.attributes;
|
|
117
|
-
|
|
118
|
-
var contents = featureUnderMouse ? (0, _configuration.getConf)(model, 'mouseover', {
|
|
119
|
-
feature: featureUnderMouse
|
|
120
|
-
}) : undefined;
|
|
121
|
-
return featureUnderMouse && contents ? /*#__PURE__*/_react.default.createElement(_core.Portal, null, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
122
|
-
ref: setPopperElt,
|
|
123
|
-
className: classes.tooltip // zIndex needed to go over widget drawer
|
|
124
|
-
,
|
|
125
|
-
style: _objectSpread(_objectSpread({}, styles.popper), {}, {
|
|
126
|
-
zIndex: 100000
|
|
127
|
-
})
|
|
128
|
-
}, attributes.popper), /*#__PURE__*/_react.default.createElement(TooltipContents, {
|
|
129
|
-
ref: function ref(elt) {
|
|
130
|
-
return setWidth((elt === null || elt === void 0 ? void 0 : elt.getBoundingClientRect().width) || 0);
|
|
131
|
-
},
|
|
132
|
-
message: contents
|
|
133
|
-
}))) : null;
|
|
134
|
-
});
|
|
135
|
-
exports.Tooltip = Tooltip;
|
|
136
|
-
var BaseLinearDisplay = (0, _mobxReact.observer)(function (props) {
|
|
137
|
-
var classes = useStyles();
|
|
138
|
-
var theme = (0, _core.useTheme)();
|
|
139
|
-
var ref = (0, _react.useRef)(null);
|
|
60
|
+
offsetMouseCoord = _useState4[0],
|
|
61
|
+
setOffsetMouseCoord = _useState4[1];
|
|
140
62
|
|
|
141
|
-
var _useState5 = (0, _react.useState)(),
|
|
63
|
+
var _useState5 = (0, _react.useState)([0, 0]),
|
|
142
64
|
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
143
|
-
|
|
144
|
-
|
|
65
|
+
clientMouseCoord = _useState6[0],
|
|
66
|
+
setClientMouseCoord = _useState6[1];
|
|
145
67
|
|
|
146
|
-
var _useState7 = (0, _react.useState)(
|
|
68
|
+
var _useState7 = (0, _react.useState)(),
|
|
147
69
|
_useState8 = (0, _slicedToArray2.default)(_useState7, 2),
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
var _useState9 = (0, _react.useState)([0, 0]),
|
|
152
|
-
_useState10 = (0, _slicedToArray2.default)(_useState9, 2),
|
|
153
|
-
clientMouseCoord = _useState10[0],
|
|
154
|
-
setClientMouseCoord = _useState10[1];
|
|
155
|
-
|
|
156
|
-
var _useState11 = (0, _react.useState)(),
|
|
157
|
-
_useState12 = (0, _slicedToArray2.default)(_useState11, 2),
|
|
158
|
-
contextCoord = _useState12[0],
|
|
159
|
-
setContextCoord = _useState12[1];
|
|
70
|
+
contextCoord = _useState8[0],
|
|
71
|
+
setContextCoord = _useState8[1];
|
|
160
72
|
|
|
161
73
|
var model = props.model,
|
|
162
74
|
children = props.children;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { BaseLinearDisplayModel } from '../models/BaseLinearDisplayModel';
|
|
3
|
+
declare type Coord = [number, number];
|
|
4
|
+
declare const Tooltip: ({ model, clientMouseCoord, }: {
|
|
5
|
+
model: BaseLinearDisplayModel;
|
|
6
|
+
clientMouseCoord: Coord;
|
|
7
|
+
}) => JSX.Element | null;
|
|
8
|
+
export default Tooltip;
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
|
|
14
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
+
|
|
16
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
|
+
|
|
18
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
+
|
|
20
|
+
var _configuration = require("@jbrowse/core/configuration");
|
|
21
|
+
|
|
22
|
+
var _mobxReact = require("mobx-react");
|
|
23
|
+
|
|
24
|
+
var _core = require("@material-ui/core");
|
|
25
|
+
|
|
26
|
+
var _reactPopper = require("react-popper");
|
|
27
|
+
|
|
28
|
+
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); }
|
|
29
|
+
|
|
30
|
+
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; }
|
|
31
|
+
|
|
32
|
+
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; }
|
|
33
|
+
|
|
34
|
+
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; }
|
|
35
|
+
|
|
36
|
+
function round(value) {
|
|
37
|
+
return Math.round(value * 1e5) / 1e5;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
var useStyles = (0, _core.makeStyles)(function (theme) {
|
|
41
|
+
return {
|
|
42
|
+
// these styles come from
|
|
43
|
+
// https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Tooltip/Tooltip.js
|
|
44
|
+
tooltip: {
|
|
45
|
+
pointerEvents: 'none',
|
|
46
|
+
backgroundColor: (0, _core.alpha)(theme.palette.grey[700], 0.9),
|
|
47
|
+
borderRadius: theme.shape.borderRadius,
|
|
48
|
+
color: theme.palette.common.white,
|
|
49
|
+
fontFamily: theme.typography.fontFamily,
|
|
50
|
+
padding: '4px 8px',
|
|
51
|
+
fontSize: theme.typography.pxToRem(12),
|
|
52
|
+
lineHeight: "".concat(round(14 / 10), "em"),
|
|
53
|
+
maxWidth: 300,
|
|
54
|
+
wordWrap: 'break-word'
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
var TooltipContents = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
60
|
+
var message = _ref.message;
|
|
61
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
62
|
+
ref: ref
|
|
63
|
+
}, message);
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
var Tooltip = (0, _mobxReact.observer)(function (_ref2) {
|
|
67
|
+
var model = _ref2.model,
|
|
68
|
+
clientMouseCoord = _ref2.clientMouseCoord;
|
|
69
|
+
var classes = useStyles();
|
|
70
|
+
var featureUnderMouse = model.featureUnderMouse;
|
|
71
|
+
|
|
72
|
+
var _useState = (0, _react.useState)(0),
|
|
73
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
74
|
+
width = _useState2[0],
|
|
75
|
+
setWidth = _useState2[1];
|
|
76
|
+
|
|
77
|
+
var _useState3 = (0, _react.useState)(null),
|
|
78
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
79
|
+
popperElt = _useState4[0],
|
|
80
|
+
setPopperElt = _useState4[1]; // must be memoized a la https://github.com/popperjs/react-popper/issues/391
|
|
81
|
+
|
|
82
|
+
|
|
83
|
+
var virtElement = (0, _react.useMemo)(function () {
|
|
84
|
+
return {
|
|
85
|
+
getBoundingClientRect: function getBoundingClientRect() {
|
|
86
|
+
var x = clientMouseCoord[0] + width / 2 + 20;
|
|
87
|
+
var y = clientMouseCoord[1];
|
|
88
|
+
return {
|
|
89
|
+
top: y,
|
|
90
|
+
left: x,
|
|
91
|
+
bottom: y,
|
|
92
|
+
right: x,
|
|
93
|
+
width: 0,
|
|
94
|
+
height: 0,
|
|
95
|
+
x: x,
|
|
96
|
+
y: y,
|
|
97
|
+
toJSON: function toJSON() {}
|
|
98
|
+
};
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
}, [clientMouseCoord, width]);
|
|
102
|
+
|
|
103
|
+
var _usePopper = (0, _reactPopper.usePopper)(virtElement, popperElt),
|
|
104
|
+
styles = _usePopper.styles,
|
|
105
|
+
attributes = _usePopper.attributes;
|
|
106
|
+
|
|
107
|
+
var contents = featureUnderMouse ? (0, _configuration.getConf)(model, 'mouseover', {
|
|
108
|
+
feature: featureUnderMouse
|
|
109
|
+
}) : undefined;
|
|
110
|
+
return featureUnderMouse && contents ? /*#__PURE__*/_react.default.createElement(_core.Portal, null, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
111
|
+
ref: setPopperElt,
|
|
112
|
+
className: classes.tooltip // zIndex needed to go over widget drawer
|
|
113
|
+
,
|
|
114
|
+
style: _objectSpread(_objectSpread({}, styles.popper), {}, {
|
|
115
|
+
zIndex: 100000
|
|
116
|
+
})
|
|
117
|
+
}, attributes.popper), /*#__PURE__*/_react.default.createElement(TooltipContents, {
|
|
118
|
+
ref: function ref(elt) {
|
|
119
|
+
return setWidth((elt === null || elt === void 0 ? void 0 : elt.getBoundingClientRect().width) || 0);
|
|
120
|
+
},
|
|
121
|
+
message: contents
|
|
122
|
+
}))) : null;
|
|
123
|
+
});
|
|
124
|
+
var _default = Tooltip;
|
|
125
|
+
exports.default = _default;
|
|
@@ -130,7 +130,7 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
|
|
|
130
130
|
estimatedRegionStatsP: Promise<Stats> | undefined;
|
|
131
131
|
estimatedRegionStats: Stats | undefined;
|
|
132
132
|
} & {
|
|
133
|
-
readonly blockType: "
|
|
133
|
+
readonly blockType: "dynamicBlocks" | "staticBlocks";
|
|
134
134
|
readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
|
|
135
135
|
} & {
|
|
136
136
|
/**
|
|
@@ -172,8 +172,8 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
|
|
|
172
172
|
signal?: AbortSignal;
|
|
173
173
|
filters?: string[];
|
|
174
174
|
}): Promise<{}>;
|
|
175
|
-
setRegionStatsP(p?: Promise<Stats>
|
|
176
|
-
setRegionStats(estimatedRegionStats?: Stats
|
|
175
|
+
setRegionStatsP(p?: Promise<Stats>): void;
|
|
176
|
+
setRegionStats(estimatedRegionStats?: Stats): void;
|
|
177
177
|
clearRegionStats(): void;
|
|
178
178
|
setHeight(displayHeight: number): number;
|
|
179
179
|
resizeHeight(distance: number): number;
|
|
@@ -186,7 +186,7 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
|
|
|
186
186
|
clearFeatureSelection(): void;
|
|
187
187
|
setFeatureIdUnderMouse(feature: string | undefined): void;
|
|
188
188
|
reload(): void;
|
|
189
|
-
setContextMenuFeature(feature?: Feature
|
|
189
|
+
setContextMenuFeature(feature?: Feature): void;
|
|
190
190
|
} & {
|
|
191
191
|
readonly regionTooLarge: boolean;
|
|
192
192
|
readonly regionTooLargeReason: string;
|
|
@@ -371,8 +371,9 @@ var BaseLinearDisplay = _mobxStateTree.types.compose('BaseLinearDisplay', _model
|
|
|
371
371
|
|
|
372
372
|
if ((0, _util.isSessionModelWithWidgets)(session)) {
|
|
373
373
|
var featureWidget = session.addWidget('BaseFeatureWidget', 'baseFeature', {
|
|
374
|
-
|
|
375
|
-
|
|
374
|
+
view: (0, _util.getContainingView)(self),
|
|
375
|
+
track: (0, _util.getContainingTrack)(self),
|
|
376
|
+
featureData: feature.toJSON()
|
|
376
377
|
});
|
|
377
378
|
session.showWidget(featureWidget);
|
|
378
379
|
}
|
|
@@ -118,7 +118,7 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
|
|
|
118
118
|
estimatedRegionStatsP: Promise<import("@jbrowse/core/data_adapters/BaseAdapter").Stats> | undefined;
|
|
119
119
|
estimatedRegionStats: import("@jbrowse/core/data_adapters/BaseAdapter").Stats | undefined;
|
|
120
120
|
} & {
|
|
121
|
-
readonly blockType: "
|
|
121
|
+
readonly blockType: "dynamicBlocks" | "staticBlocks";
|
|
122
122
|
readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
|
|
123
123
|
} & {
|
|
124
124
|
readonly renderDelay: number;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
|
|
3
2
|
import { MenuItem } from '@jbrowse/core/ui';
|
|
4
3
|
import { Instance } from 'mobx-state-tree';
|
|
@@ -124,7 +123,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
|
|
|
124
123
|
estimatedRegionStatsP: Promise<import("@jbrowse/core/data_adapters/BaseAdapter").Stats> | undefined;
|
|
125
124
|
estimatedRegionStats: import("@jbrowse/core/data_adapters/BaseAdapter").Stats | undefined;
|
|
126
125
|
} & {
|
|
127
|
-
readonly blockType: "
|
|
126
|
+
readonly blockType: "dynamicBlocks" | "staticBlocks";
|
|
128
127
|
readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
|
|
129
128
|
} & {
|
|
130
129
|
readonly renderDelay: number;
|
|
@@ -62,7 +62,7 @@ var stateModelFactory = function stateModelFactory(configSchema) {
|
|
|
62
62
|
get showDescriptions() {
|
|
63
63
|
var _self$trackShowDescri;
|
|
64
64
|
|
|
65
|
-
return (_self$trackShowDescri = self.trackShowDescriptions) !== null && _self$trackShowDescri !== void 0 ? _self$trackShowDescri : (0, _configuration.getConf)(self, ['renderer', '
|
|
65
|
+
return (_self$trackShowDescri = self.trackShowDescriptions) !== null && _self$trackShowDescri !== void 0 ? _self$trackShowDescri : (0, _configuration.getConf)(self, ['renderer', 'showDescriptions']);
|
|
66
66
|
},
|
|
67
67
|
|
|
68
68
|
get maxHeight() {
|
|
@@ -129,7 +129,7 @@ var stateModelFactory = function stateModelFactory(configSchema) {
|
|
|
129
129
|
type: 'checkbox',
|
|
130
130
|
checked: self.showDescriptions,
|
|
131
131
|
onClick: function onClick() {
|
|
132
|
-
self.toggleShowDescriptions();
|
|
132
|
+
return self.toggleShowDescriptions();
|
|
133
133
|
}
|
|
134
134
|
}, {
|
|
135
135
|
label: 'Display mode',
|
|
@@ -17,17 +17,17 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
17
17
|
|
|
18
18
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
19
|
|
|
20
|
-
var _styles = require("@material-ui/core/styles");
|
|
21
|
-
|
|
22
20
|
var _core = require("@material-ui/core");
|
|
23
21
|
|
|
22
|
+
var _ui = require("@jbrowse/core/ui");
|
|
23
|
+
|
|
24
24
|
var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
|
|
25
25
|
|
|
26
26
|
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); }
|
|
27
27
|
|
|
28
28
|
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; }
|
|
29
29
|
|
|
30
|
-
var useStyles = (0,
|
|
30
|
+
var useStyles = (0, _core.makeStyles)(function (theme) {
|
|
31
31
|
return {
|
|
32
32
|
closeButton: {
|
|
33
33
|
position: 'absolute',
|
|
@@ -38,6 +38,17 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
|
|
|
38
38
|
};
|
|
39
39
|
});
|
|
40
40
|
|
|
41
|
+
function LoadingMessage() {
|
|
42
|
+
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_core.CircularProgress, {
|
|
43
|
+
size: 20,
|
|
44
|
+
style: {
|
|
45
|
+
marginRight: 20
|
|
46
|
+
}
|
|
47
|
+
}), /*#__PURE__*/_react.default.createElement(_core.Typography, {
|
|
48
|
+
display: "inline"
|
|
49
|
+
}, "Creating SVG"));
|
|
50
|
+
}
|
|
51
|
+
|
|
41
52
|
function ExportSvgDlg(_ref) {
|
|
42
53
|
var model = _ref.model,
|
|
43
54
|
handleClose = _ref.handleClose;
|
|
@@ -54,10 +65,15 @@ function ExportSvgDlg(_ref) {
|
|
|
54
65
|
loading = _useState4[0],
|
|
55
66
|
setLoading = _useState4[1];
|
|
56
67
|
|
|
57
|
-
var _useState5 = (0, _react.useState)(),
|
|
68
|
+
var _useState5 = (0, _react.useState)('jbrowse.svg'),
|
|
58
69
|
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
59
|
-
|
|
60
|
-
|
|
70
|
+
filename = _useState6[0],
|
|
71
|
+
setFilename = _useState6[1];
|
|
72
|
+
|
|
73
|
+
var _useState7 = (0, _react.useState)(),
|
|
74
|
+
_useState8 = (0, _slicedToArray2.default)(_useState7, 2),
|
|
75
|
+
error = _useState8[0],
|
|
76
|
+
setError = _useState8[1];
|
|
61
77
|
|
|
62
78
|
var classes = useStyles();
|
|
63
79
|
return /*#__PURE__*/_react.default.createElement(_core.Dialog, {
|
|
@@ -66,18 +82,15 @@ function ExportSvgDlg(_ref) {
|
|
|
66
82
|
}, /*#__PURE__*/_react.default.createElement(_core.DialogTitle, null, "Export SVG", /*#__PURE__*/_react.default.createElement(_core.IconButton, {
|
|
67
83
|
className: classes.closeButton,
|
|
68
84
|
onClick: handleClose
|
|
69
|
-
}, /*#__PURE__*/_react.default.createElement(_Close.default, null))), /*#__PURE__*/_react.default.createElement(_core.DialogContent, null, error ? /*#__PURE__*/_react.default.createElement(
|
|
70
|
-
|
|
71
|
-
|
|
85
|
+
}, /*#__PURE__*/_react.default.createElement(_Close.default, null))), /*#__PURE__*/_react.default.createElement(_core.DialogContent, null, error ? /*#__PURE__*/_react.default.createElement(_ui.ErrorMessage, {
|
|
86
|
+
error: error
|
|
87
|
+
}) : loading ? /*#__PURE__*/_react.default.createElement(LoadingMessage, null) : null, /*#__PURE__*/_react.default.createElement(_core.TextField, {
|
|
88
|
+
helperText: "filename",
|
|
89
|
+
value: filename,
|
|
90
|
+
onChange: function onChange(event) {
|
|
91
|
+
return setFilename(event.target.value);
|
|
72
92
|
}
|
|
73
|
-
},
|
|
74
|
-
size: 20,
|
|
75
|
-
style: {
|
|
76
|
-
marginRight: 20
|
|
77
|
-
}
|
|
78
|
-
}), /*#__PURE__*/_react.default.createElement(_core.Typography, {
|
|
79
|
-
display: "inline"
|
|
80
|
-
}, "Creating SVG")) : null, offscreenCanvas ? /*#__PURE__*/_react.default.createElement(_core.FormControlLabel, {
|
|
93
|
+
}), offscreenCanvas ? /*#__PURE__*/_react.default.createElement(_core.FormControlLabel, {
|
|
81
94
|
control: /*#__PURE__*/_react.default.createElement(_core.Checkbox, {
|
|
82
95
|
checked: rasterizeLayers,
|
|
83
96
|
onChange: function onChange() {
|
|
@@ -107,12 +120,13 @@ function ExportSvgDlg(_ref) {
|
|
|
107
120
|
_context.prev = 2;
|
|
108
121
|
_context.next = 5;
|
|
109
122
|
return model.exportSvg({
|
|
110
|
-
rasterizeLayers: rasterizeLayers
|
|
123
|
+
rasterizeLayers: rasterizeLayers,
|
|
124
|
+
filename: filename
|
|
111
125
|
});
|
|
112
126
|
|
|
113
127
|
case 5:
|
|
114
128
|
handleClose();
|
|
115
|
-
_context.next =
|
|
129
|
+
_context.next = 13;
|
|
116
130
|
break;
|
|
117
131
|
|
|
118
132
|
case 8:
|
|
@@ -120,18 +134,14 @@ function ExportSvgDlg(_ref) {
|
|
|
120
134
|
_context.t0 = _context["catch"](2);
|
|
121
135
|
console.error(_context.t0);
|
|
122
136
|
setError(_context.t0);
|
|
123
|
-
|
|
124
|
-
case 12:
|
|
125
|
-
_context.prev = 12;
|
|
126
137
|
setLoading(false);
|
|
127
|
-
return _context.finish(12);
|
|
128
138
|
|
|
129
|
-
case
|
|
139
|
+
case 13:
|
|
130
140
|
case "end":
|
|
131
141
|
return _context.stop();
|
|
132
142
|
}
|
|
133
143
|
}
|
|
134
|
-
}, _callee, null, [[2, 8
|
|
144
|
+
}, _callee, null, [[2, 8]]);
|
|
135
145
|
}))
|
|
136
146
|
}, "Submit")));
|
|
137
147
|
}
|
|
@@ -13,6 +13,8 @@ var _mobxReact = require("mobx-react");
|
|
|
13
13
|
|
|
14
14
|
var _core = require("@material-ui/core");
|
|
15
15
|
|
|
16
|
+
var _util = require("@jbrowse/core/util");
|
|
17
|
+
|
|
16
18
|
var _SearchBox = _interopRequireDefault(require("./SearchBox"));
|
|
17
19
|
|
|
18
20
|
var _Icons = require("@jbrowse/core/ui/Icons");
|
|
@@ -102,7 +104,7 @@ var RegionWidth = (0, _mobxReact.observer)(function (_ref3) {
|
|
|
102
104
|
variant: "body2",
|
|
103
105
|
color: "textSecondary",
|
|
104
106
|
className: classes.bp
|
|
105
|
-
},
|
|
107
|
+
}, (0, _util.getBpDisplayStr)(coarseTotalBp));
|
|
106
108
|
});
|
|
107
109
|
|
|
108
110
|
var Controls = function Controls(_ref4) {
|
|
@@ -34,12 +34,11 @@ function HelpDialog(_ref) {
|
|
|
34
34
|
maxWidth: "xl",
|
|
35
35
|
onClose: handleClose
|
|
36
36
|
}, /*#__PURE__*/_react.default.createElement(_core.DialogTitle, null, "Using the search box", handleClose ? /*#__PURE__*/_react.default.createElement(_core.IconButton, {
|
|
37
|
-
"data-testid": "close-resultsDialog",
|
|
38
37
|
className: classes.closeButton,
|
|
39
38
|
onClick: function onClick() {
|
|
40
|
-
handleClose();
|
|
39
|
+
return handleClose();
|
|
41
40
|
}
|
|
42
|
-
}, /*#__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, {
|
|
41
|
+
}, /*#__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("li", null, /*#__PURE__*/_react.default.createElement("code", null, "chr1 100 200"), " - use whitespace separated refname, start, end"))), /*#__PURE__*/_react.default.createElement(_core.Divider, null), /*#__PURE__*/_react.default.createElement(_core.DialogActions, null, /*#__PURE__*/_react.default.createElement(_core.Button, {
|
|
43
42
|
onClick: function onClick() {
|
|
44
43
|
return handleClose();
|
|
45
44
|
},
|