@jbrowse/plugin-linear-comparative-view 2.13.1 → 2.14.0
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/LGVSyntenyDisplay/components/LaunchSyntenyViewDialog.js +9 -3
- package/dist/LGVSyntenyDisplay/components/util.js +4 -3
- package/dist/LGVSyntenyDisplay/model.d.ts +4 -3
- package/dist/LaunchLinearSyntenyView.js +7 -3
- package/dist/LinearComparativeDisplay/configSchemaF.js +0 -1
- package/dist/LinearComparativeDisplay/stateModelFactory.d.ts +3 -3
- package/dist/LinearComparativeDisplay/stateModelFactory.js +2 -2
- package/dist/LinearComparativeView/components/Header.js +6 -2
- package/dist/LinearComparativeView/components/Rubberband.js +9 -9
- package/dist/LinearComparativeView/model.d.ts +9 -16
- package/dist/LinearComparativeView/model.js +10 -14
- package/dist/LinearReadVsRef/LinearReadVsRef.js +6 -4
- package/dist/LinearSyntenyDisplay/afterAttach.js +2 -2
- package/dist/LinearSyntenyDisplay/components/Component.js +6 -2
- package/dist/LinearSyntenyDisplay/components/LinearSyntenyRendering.js +29 -15
- package/dist/LinearSyntenyDisplay/components/SyntenyContextMenu.d.ts +4 -1
- package/dist/LinearSyntenyDisplay/components/SyntenyContextMenu.js +2 -6
- package/dist/LinearSyntenyDisplay/components/SyntenyTooltip.js +1 -1
- package/dist/LinearSyntenyDisplay/components/util.d.ts +3 -1
- package/dist/LinearSyntenyDisplay/drawSynteny.d.ts +1 -1
- package/dist/LinearSyntenyDisplay/drawSynteny.js +16 -8
- package/dist/LinearSyntenyDisplay/model.d.ts +9 -5
- package/dist/LinearSyntenyView/components/ExportSvgDialog.js +16 -6
- package/dist/LinearSyntenyView/components/ImportForm/ImportCustomTrack.js +14 -4
- package/dist/LinearSyntenyView/components/ImportForm/ImportSyntenyTrackSelector.js +3 -1
- package/dist/LinearSyntenyView/components/ImportForm/index.js +15 -5
- package/dist/LinearSyntenyView/model.d.ts +9 -11
- package/dist/LinearSyntenyView/model.js +3 -1
- package/dist/LinearSyntenyView/svgcomponents/SVGLinearSyntenyView.js +9 -7
- package/dist/SyntenyFeatureDetail/SyntenyFeatureDetail.js +3 -1
- package/dist/util.js +4 -3
- package/esm/LGVSyntenyDisplay/components/LaunchSyntenyViewDialog.js +9 -3
- package/esm/LGVSyntenyDisplay/components/util.js +4 -3
- package/esm/LGVSyntenyDisplay/model.d.ts +4 -3
- package/esm/LaunchLinearSyntenyView.js +7 -3
- package/esm/LinearComparativeDisplay/configSchemaF.js +0 -1
- package/esm/LinearComparativeDisplay/stateModelFactory.d.ts +3 -3
- package/esm/LinearComparativeDisplay/stateModelFactory.js +2 -2
- package/esm/LinearComparativeView/components/Header.js +6 -2
- package/esm/LinearComparativeView/components/Rubberband.js +9 -9
- package/esm/LinearComparativeView/model.d.ts +9 -16
- package/esm/LinearComparativeView/model.js +11 -15
- package/esm/LinearReadVsRef/LinearReadVsRef.js +6 -4
- package/esm/LinearSyntenyDisplay/afterAttach.js +2 -2
- package/esm/LinearSyntenyDisplay/components/Component.js +6 -2
- package/esm/LinearSyntenyDisplay/components/LinearSyntenyRendering.js +29 -15
- package/esm/LinearSyntenyDisplay/components/SyntenyContextMenu.d.ts +4 -1
- package/esm/LinearSyntenyDisplay/components/SyntenyContextMenu.js +2 -6
- package/esm/LinearSyntenyDisplay/components/SyntenyTooltip.js +1 -1
- package/esm/LinearSyntenyDisplay/components/util.d.ts +3 -1
- package/esm/LinearSyntenyDisplay/drawSynteny.d.ts +1 -1
- package/esm/LinearSyntenyDisplay/drawSynteny.js +16 -8
- package/esm/LinearSyntenyDisplay/model.d.ts +9 -5
- package/esm/LinearSyntenyView/components/ExportSvgDialog.js +16 -6
- package/esm/LinearSyntenyView/components/ImportForm/ImportCustomTrack.js +14 -4
- package/esm/LinearSyntenyView/components/ImportForm/ImportSyntenyTrackSelector.js +3 -1
- package/esm/LinearSyntenyView/components/ImportForm/index.js +15 -5
- package/esm/LinearSyntenyView/model.d.ts +9 -11
- package/esm/LinearSyntenyView/model.js +3 -1
- package/esm/LinearSyntenyView/svgcomponents/SVGLinearSyntenyView.js +9 -7
- package/esm/SyntenyFeatureDetail/SyntenyFeatureDetail.js +3 -1
- package/esm/util.js +4 -3
- package/package.json +3 -3
|
@@ -99,7 +99,7 @@ function drawRef(model, ctx1, ctx3) {
|
|
|
99
99
|
// cx1/cx2 are the current x positions on top and bottom rows
|
|
100
100
|
let cx1 = k1;
|
|
101
101
|
let cx2 = s1 === -1 ? x22 : x21;
|
|
102
|
-
if (
|
|
102
|
+
if (cigar.length && drawCIGAR) {
|
|
103
103
|
// continuingFlag skips drawing commands on very small CIGAR features
|
|
104
104
|
let continuingFlag = false;
|
|
105
105
|
// px1/px2 are the previous x positions on the top and bottom rows
|
|
@@ -123,6 +123,7 @@ function drawRef(model, ctx1, ctx3) {
|
|
|
123
123
|
else if (op === 'D' || op === 'N') {
|
|
124
124
|
cx1 += d1 * rev1;
|
|
125
125
|
}
|
|
126
|
+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
|
|
126
127
|
else if (op === 'I') {
|
|
127
128
|
cx2 += d2 * rev2;
|
|
128
129
|
}
|
|
@@ -140,12 +141,12 @@ function drawRef(model, ctx1, ctx3) {
|
|
|
140
141
|
continuingFlag = true;
|
|
141
142
|
}
|
|
142
143
|
else {
|
|
143
|
-
|
|
144
|
-
//
|
|
145
|
-
//
|
|
146
|
-
// feature, else just use match
|
|
144
|
+
// allow rendering the dominant color when using continuing flag
|
|
145
|
+
// if the last element of continuing was a large feature, else
|
|
146
|
+
// just use match
|
|
147
147
|
ctx1.fillStyle =
|
|
148
148
|
colorMap[(continuingFlag && d1 > 1) || d2 > 1 ? op : 'M'];
|
|
149
|
+
continuingFlag = false;
|
|
149
150
|
(0, util_2.draw)(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
|
|
150
151
|
if (ctx3) {
|
|
151
152
|
ctx3.fillStyle = makeColor(idx);
|
|
@@ -173,7 +174,9 @@ function drawRef(model, ctx1, ctx3) {
|
|
|
173
174
|
ctx2.fillStyle = makeColor(idx);
|
|
174
175
|
// too many click map false positives with colored stroked lines
|
|
175
176
|
(0, util_2.drawMatchSimple)({
|
|
176
|
-
cb: ctx =>
|
|
177
|
+
cb: ctx => {
|
|
178
|
+
ctx.fill();
|
|
179
|
+
},
|
|
177
180
|
feature,
|
|
178
181
|
ctx: ctx2,
|
|
179
182
|
drawCurves,
|
|
@@ -184,6 +187,7 @@ function drawRef(model, ctx1, ctx3) {
|
|
|
184
187
|
height,
|
|
185
188
|
});
|
|
186
189
|
}
|
|
190
|
+
return undefined;
|
|
187
191
|
}
|
|
188
192
|
function drawMouseoverSynteny(model) {
|
|
189
193
|
var _a;
|
|
@@ -205,7 +209,9 @@ function drawMouseoverSynteny(model) {
|
|
|
205
209
|
if (feature1) {
|
|
206
210
|
ctx.fillStyle = 'rgb(0,0,0,0.1)';
|
|
207
211
|
(0, util_2.drawMatchSimple)({
|
|
208
|
-
cb: ctx =>
|
|
212
|
+
cb: ctx => {
|
|
213
|
+
ctx.fill();
|
|
214
|
+
},
|
|
209
215
|
feature: feature1,
|
|
210
216
|
ctx,
|
|
211
217
|
oobLimit,
|
|
@@ -219,7 +225,9 @@ function drawMouseoverSynteny(model) {
|
|
|
219
225
|
if (feature2) {
|
|
220
226
|
ctx.strokeStyle = 'rgb(0, 0, 0, 0.9)';
|
|
221
227
|
(0, util_2.drawMatchSimple)({
|
|
222
|
-
cb: ctx =>
|
|
228
|
+
cb: ctx => {
|
|
229
|
+
ctx.stroke();
|
|
230
|
+
},
|
|
223
231
|
feature: feature2,
|
|
224
232
|
ctx,
|
|
225
233
|
oobLimit,
|
|
@@ -57,7 +57,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
57
57
|
error: unknown;
|
|
58
58
|
message: string | undefined;
|
|
59
59
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
60
|
-
onHorizontalScroll?:
|
|
60
|
+
onHorizontalScroll?: () => void;
|
|
61
61
|
blockState?: Record<string, any>;
|
|
62
62
|
}>;
|
|
63
63
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -77,7 +77,9 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
77
77
|
rendererTypeName: string;
|
|
78
78
|
error: unknown;
|
|
79
79
|
message: string | undefined;
|
|
80
|
-
}, import("mobx-state-tree"
|
|
80
|
+
}, import("mobx-state-tree" /**
|
|
81
|
+
* #action
|
|
82
|
+
*/)._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
81
83
|
}> | null;
|
|
82
84
|
readonly adapterConfig: any;
|
|
83
85
|
readonly parentTrack: any;
|
|
@@ -138,7 +140,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
138
140
|
error: unknown;
|
|
139
141
|
message: string | undefined;
|
|
140
142
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
141
|
-
onHorizontalScroll?:
|
|
143
|
+
onHorizontalScroll?: () => void;
|
|
142
144
|
blockState?: Record<string, any>;
|
|
143
145
|
}>;
|
|
144
146
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -158,7 +160,9 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
158
160
|
rendererTypeName: string;
|
|
159
161
|
error: unknown;
|
|
160
162
|
message: string | undefined;
|
|
161
|
-
}, import("mobx-state-tree"
|
|
163
|
+
}, import("mobx-state-tree" /**
|
|
164
|
+
* #action
|
|
165
|
+
*/)._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
162
166
|
}> | null;
|
|
163
167
|
readonly adapterConfig: any;
|
|
164
168
|
readonly parentTrack: any;
|
|
@@ -208,7 +212,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
208
212
|
error: unknown;
|
|
209
213
|
message: string | undefined;
|
|
210
214
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
211
|
-
onHorizontalScroll?:
|
|
215
|
+
onHorizontalScroll?: () => void;
|
|
212
216
|
blockState?: Record<string, any>;
|
|
213
217
|
}>;
|
|
214
218
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -34,7 +34,7 @@ function LoadingMessage() {
|
|
|
34
34
|
react_1.default.createElement(material_1.Typography, { display: "inline" }, "Creating SVG")));
|
|
35
35
|
}
|
|
36
36
|
function useSvgLocal(key, val) {
|
|
37
|
-
return (0, util_1.useLocalStorage)(
|
|
37
|
+
return (0, util_1.useLocalStorage)(`svg-${key}`, val);
|
|
38
38
|
}
|
|
39
39
|
function TextField2({ children, ...rest }) {
|
|
40
40
|
return (react_1.default.createElement("div", null,
|
|
@@ -52,19 +52,29 @@ function ExportSvgDialog({ model, handleClose, }) {
|
|
|
52
52
|
return (react_1.default.createElement(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG" },
|
|
53
53
|
react_1.default.createElement(material_1.DialogContent, null,
|
|
54
54
|
error ? (react_1.default.createElement(ui_1.ErrorMessage, { error: error })) : loading ? (react_1.default.createElement(LoadingMessage, null)) : null,
|
|
55
|
-
react_1.default.createElement(TextField2, { helperText: "filename", value: filename, onChange: event =>
|
|
56
|
-
|
|
55
|
+
react_1.default.createElement(TextField2, { helperText: "filename", value: filename, onChange: event => {
|
|
56
|
+
setFilename(event.target.value);
|
|
57
|
+
} }),
|
|
58
|
+
react_1.default.createElement(TextField2, { select: true, label: "Track label positioning", variant: "outlined", value: trackLabels, style: { width: 150 }, onChange: event => {
|
|
59
|
+
setTrackLabels(event.target.value);
|
|
60
|
+
} },
|
|
57
61
|
react_1.default.createElement(material_1.MenuItem, { value: "offset" }, "Offset"),
|
|
58
62
|
react_1.default.createElement(material_1.MenuItem, { value: "overlay" }, "Overlay"),
|
|
59
63
|
react_1.default.createElement(material_1.MenuItem, { value: "left" }, "Left"),
|
|
60
64
|
react_1.default.createElement(material_1.MenuItem, { value: "none" }, "None")),
|
|
61
65
|
react_1.default.createElement("br", null),
|
|
62
|
-
session.allThemes ? (react_1.default.createElement(TextField2, { select: true, label: "Theme", variant: "outlined", value: themeName, onChange: event =>
|
|
66
|
+
session.allThemes ? (react_1.default.createElement(TextField2, { select: true, label: "Theme", variant: "outlined", value: themeName, onChange: event => {
|
|
67
|
+
setThemeName(event.target.value);
|
|
68
|
+
} }, Object.entries(session.allThemes()).map(([key, val]) => (react_1.default.createElement(material_1.MenuItem, { key: key, value: key },
|
|
63
69
|
// @ts-expect-error
|
|
64
70
|
val.name || '(Unknown name)'))))) : null,
|
|
65
|
-
offscreenCanvas ? (react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, { checked: rasterizeLayers, onChange: () =>
|
|
71
|
+
offscreenCanvas ? (react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, { checked: rasterizeLayers, onChange: () => {
|
|
72
|
+
setRasterizeLayers(val => !val);
|
|
73
|
+
} }), label: "Rasterize canvas based tracks? File may be much larger if this is turned off" })) : (react_1.default.createElement(material_1.Typography, null, "Note: rasterizing layers not yet supported in this browser, so SVG size may be large"))),
|
|
66
74
|
react_1.default.createElement(material_1.DialogActions, null,
|
|
67
|
-
react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () =>
|
|
75
|
+
react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
|
|
76
|
+
handleClose();
|
|
77
|
+
} }, "Cancel"),
|
|
68
78
|
react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", onClick: async () => {
|
|
69
79
|
setLoading(true);
|
|
70
80
|
setError(undefined);
|
|
@@ -130,7 +130,9 @@ const OpenTrack = (0, mobx_react_1.observer)(({ assembly1, assembly2, setSession
|
|
|
130
130
|
return (react_1.default.createElement(material_1.Paper, { style: { padding: 12 } },
|
|
131
131
|
error ? react_1.default.createElement(ui_1.ErrorMessage, { error: error }) : null,
|
|
132
132
|
react_1.default.createElement(material_1.Typography, { style: { textAlign: 'center' } }, "Add a .paf, .out (MashMap), .delta (Mummer), .chain, .anchors or .anchors.simple (MCScan) file to view in the dotplot. These file types can also be gzipped. The first assembly should be the query sequence (e.g. left column of the PAF) and the second assembly should be the target sequence (e.g. right column of the PAF)"),
|
|
133
|
-
react_1.default.createElement(material_1.RadioGroup, { value: radioOption, onChange: event =>
|
|
133
|
+
react_1.default.createElement(material_1.RadioGroup, { value: radioOption, onChange: event => {
|
|
134
|
+
setValue(event.target.value);
|
|
135
|
+
} },
|
|
134
136
|
react_1.default.createElement(material_1.Grid, { container: true, justifyContent: "center" },
|
|
135
137
|
react_1.default.createElement(material_1.Grid, { item: true },
|
|
136
138
|
react_1.default.createElement(material_1.FormControlLabel, { value: ".paf", control: react_1.default.createElement(material_1.Radio, null), label: ".paf" })),
|
|
@@ -154,10 +156,18 @@ const OpenTrack = (0, mobx_react_1.observer)(({ assembly1, assembly2, setSession
|
|
|
154
156
|
react_1.default.createElement("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)" }, "(more info)")),
|
|
155
157
|
react_1.default.createElement("div", { style: { display: 'flex' } },
|
|
156
158
|
react_1.default.createElement("div", null,
|
|
157
|
-
react_1.default.createElement(ui_1.FileSelector, { name: ".anchors file", description: "", location: fileLocation, setLocation: loc =>
|
|
159
|
+
react_1.default.createElement(ui_1.FileSelector, { name: ".anchors file", description: "", location: fileLocation, setLocation: loc => {
|
|
160
|
+
setFileLocation(loc);
|
|
161
|
+
} })),
|
|
158
162
|
react_1.default.createElement("div", null,
|
|
159
|
-
react_1.default.createElement(ui_1.FileSelector, { name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc =>
|
|
163
|
+
react_1.default.createElement(ui_1.FileSelector, { name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => {
|
|
164
|
+
setBed1Location(loc);
|
|
165
|
+
} })),
|
|
160
166
|
react_1.default.createElement("div", null,
|
|
161
|
-
react_1.default.createElement(ui_1.FileSelector, { name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc =>
|
|
167
|
+
react_1.default.createElement(ui_1.FileSelector, { name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => {
|
|
168
|
+
setBed2Location(loc);
|
|
169
|
+
} }))))) : (react_1.default.createElement(ui_1.FileSelector, { name: value ? `${value} location` : '', description: "", location: fileLocation, setLocation: loc => {
|
|
170
|
+
setFileLocation(loc);
|
|
171
|
+
} }))))));
|
|
162
172
|
});
|
|
163
173
|
exports.default = OpenTrack;
|
|
@@ -57,6 +57,8 @@ const Selector = (0, mobx_react_1.observer)(({ model, assembly1, assembly2, setS
|
|
|
57
57
|
}, [value, setShowTrackId]);
|
|
58
58
|
return (react_1.default.createElement(material_1.Paper, { style: { padding: 12 } },
|
|
59
59
|
react_1.default.createElement(material_1.Typography, { paragraph: true }, "Select a track from the select box below, the track will be shown when you hit \"Launch\"."),
|
|
60
|
-
filteredTracks.length ? (react_1.default.createElement(material_1.Select, { value: value, onChange: event =>
|
|
60
|
+
filteredTracks.length ? (react_1.default.createElement(material_1.Select, { value: value, onChange: event => {
|
|
61
|
+
setValue(event.target.value);
|
|
62
|
+
} }, filteredTracks.map(track => (react_1.default.createElement(material_1.MenuItem, { key: track.trackId, value: track.trackId }, (0, tracks_1.getTrackName)(track, session)))))) : (react_1.default.createElement(ui_1.ErrorMessage, { error: `No synteny tracks found for ${assembly1},${assembly2}` }))));
|
|
61
63
|
});
|
|
62
64
|
exports.default = Selector;
|
|
@@ -55,7 +55,9 @@ function TrackSelector({ setSessionTrackData, setShowTrackId, sessionTrackData,
|
|
|
55
55
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
56
56
|
react_1.default.createElement(material_1.FormControl, null,
|
|
57
57
|
react_1.default.createElement(material_1.FormLabel, { id: "group-label" }, "(Optional) Select or add a synteny track"),
|
|
58
|
-
react_1.default.createElement(material_1.RadioGroup, { row: true, value: choice, onChange: event =>
|
|
58
|
+
react_1.default.createElement(material_1.RadioGroup, { row: true, value: choice, onChange: event => {
|
|
59
|
+
setChoice(event.target.value);
|
|
60
|
+
}, "aria-labelledby": "group-label" },
|
|
59
61
|
react_1.default.createElement(material_1.FormControlLabel, { value: "none", control: react_1.default.createElement(material_1.Radio, null), label: "None" }),
|
|
60
62
|
react_1.default.createElement(material_1.FormControlLabel, { value: "tracklist", control: react_1.default.createElement(material_1.Radio, null), label: "Existing track" }),
|
|
61
63
|
react_1.default.createElement(material_1.FormControlLabel, { value: "custom", control: react_1.default.createElement(material_1.Radio, null), label: "New track" }))),
|
|
@@ -92,8 +94,12 @@ const LinearSyntenyViewImportForm = (0, mobx_react_1.observer)(function ({ model
|
|
|
92
94
|
displayedRegions: asm.regions,
|
|
93
95
|
};
|
|
94
96
|
})));
|
|
95
|
-
model.views.forEach(view =>
|
|
96
|
-
|
|
97
|
+
model.views.forEach(view => {
|
|
98
|
+
view.setWidth(model.width);
|
|
99
|
+
});
|
|
100
|
+
model.views.forEach(view => {
|
|
101
|
+
view.showAllRegions();
|
|
102
|
+
});
|
|
97
103
|
if (sessionTrackData) {
|
|
98
104
|
session.addTrackConf(sessionTrackData);
|
|
99
105
|
model.toggleTrack(sessionTrackData.trackId);
|
|
@@ -117,9 +123,13 @@ const LinearSyntenyViewImportForm = (0, mobx_react_1.observer)(function ({ model
|
|
|
117
123
|
react_1.default.createElement("p", { style: { textAlign: 'center' } }, "Select assemblies for linear synteny view"),
|
|
118
124
|
react_1.default.createElement(material_1.Grid, { container: true, spacing: 1, justifyContent: "center", alignItems: "center" },
|
|
119
125
|
react_1.default.createElement(material_1.Grid, { item: true },
|
|
120
|
-
react_1.default.createElement(ui_1.AssemblySelector, { selected: assembly1, onChange: val =>
|
|
126
|
+
react_1.default.createElement(ui_1.AssemblySelector, { selected: assembly1, onChange: val => {
|
|
127
|
+
setAssembly1(val);
|
|
128
|
+
}, session: session })),
|
|
121
129
|
react_1.default.createElement(material_1.Grid, { item: true },
|
|
122
|
-
react_1.default.createElement(ui_1.AssemblySelector, { selected: assembly2, onChange: val =>
|
|
130
|
+
react_1.default.createElement(ui_1.AssemblySelector, { selected: assembly2, onChange: val => {
|
|
131
|
+
setAssembly2(val);
|
|
132
|
+
}, session: session })),
|
|
123
133
|
react_1.default.createElement(material_1.Grid, { item: true },
|
|
124
134
|
react_1.default.createElement(material_1.FormControl, null,
|
|
125
135
|
react_1.default.createElement(material_1.Button, { onClick: onOpenClick, variant: "contained", color: "primary" }, "Launch"))))),
|
|
@@ -54,7 +54,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
54
54
|
showCytobandsSetting: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
55
55
|
trackLabels: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
56
56
|
showGridlines: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
|
|
57
|
-
highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<
|
|
57
|
+
highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType, import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType, import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType>>, [undefined]>;
|
|
58
58
|
colorByCDS: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
59
59
|
showTrackOutlines: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
60
60
|
}, {
|
|
@@ -70,7 +70,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
70
70
|
minimumBlockWidth: number;
|
|
71
71
|
draggingTrackId: undefined | string;
|
|
72
72
|
volatileError: unknown;
|
|
73
|
-
afterDisplayedRegionsSetCallbacks:
|
|
73
|
+
afterDisplayedRegionsSetCallbacks: (() => void)[];
|
|
74
74
|
scaleFactor: number;
|
|
75
75
|
trackRefs: Record<string, HTMLDivElement>;
|
|
76
76
|
coarseDynamicBlocks: import("@jbrowse/core/util/blockTypes").BaseBlock[];
|
|
@@ -83,7 +83,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
83
83
|
readonly interRegionPaddingWidth: number;
|
|
84
84
|
readonly assemblyNames: string[];
|
|
85
85
|
} & {
|
|
86
|
-
scaleBarDisplayPrefix(): string;
|
|
86
|
+
scaleBarDisplayPrefix(): string | undefined;
|
|
87
87
|
MiniControlsComponent(): React.FC<any>;
|
|
88
88
|
HeaderComponent(): React.FC<any>;
|
|
89
89
|
readonly assemblyErrors: string;
|
|
@@ -98,7 +98,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
98
98
|
readonly totalBp: number;
|
|
99
99
|
readonly maxBpPerPx: number;
|
|
100
100
|
readonly minBpPerPx: number;
|
|
101
|
-
readonly error:
|
|
101
|
+
readonly error: unknown;
|
|
102
102
|
readonly maxOffset: number;
|
|
103
103
|
readonly minOffset: number;
|
|
104
104
|
readonly displayedRegionsTotalPx: number;
|
|
@@ -122,9 +122,9 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
122
122
|
setHideHeaderOverview(b: boolean): void;
|
|
123
123
|
setHideNoTracksActive(b: boolean): void;
|
|
124
124
|
setShowGridlines(b: boolean): void;
|
|
125
|
-
addToHighlights(highlight:
|
|
126
|
-
setHighlight(highlight
|
|
127
|
-
removeHighlight(highlight:
|
|
125
|
+
addToHighlights(highlight: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType): void;
|
|
126
|
+
setHighlight(highlight?: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType[]): void;
|
|
127
|
+
removeHighlight(highlight: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType): void;
|
|
128
128
|
scrollTo(offsetPx: number): number;
|
|
129
129
|
zoomTo(bpPerPx: number, offset?: number, centerAtOffset?: boolean): number;
|
|
130
130
|
setOffsets(left?: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").BpOffset, right?: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").BpOffset): void;
|
|
@@ -139,7 +139,6 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
139
139
|
moveTrackToTop(id: string): void;
|
|
140
140
|
moveTrackToBottom(id: string): void;
|
|
141
141
|
moveTrack(movingId: string, targetId: string): void;
|
|
142
|
-
closeView(): void;
|
|
143
142
|
toggleTrack(trackId: string): boolean;
|
|
144
143
|
setTrackLabels(setting: "overlapping" | "offset" | "hidden"): void;
|
|
145
144
|
setShowCenterLine(b: boolean): void;
|
|
@@ -159,7 +158,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
159
158
|
variant?: string;
|
|
160
159
|
isLeftEndOfDisplayedRegion?: boolean;
|
|
161
160
|
}[];
|
|
162
|
-
afterDisplayedRegionsSet(cb:
|
|
161
|
+
afterDisplayedRegionsSet(cb: () => void): void;
|
|
163
162
|
horizontalScroll(distance: number): number;
|
|
164
163
|
center(): void;
|
|
165
164
|
showAllRegions(): void;
|
|
@@ -252,7 +251,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
252
251
|
showCytobandsSetting: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
253
252
|
trackLabels: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
254
253
|
showGridlines: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
|
|
255
|
-
highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<
|
|
254
|
+
highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType, import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType, import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").HighlightType>>, [undefined]>;
|
|
256
255
|
colorByCDS: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
257
256
|
showTrackOutlines: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
|
|
258
257
|
}>>, import("mobx-state-tree")._NotCustomized>>;
|
|
@@ -282,7 +281,6 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
|
|
|
282
281
|
setWidth(newWidth: number): void;
|
|
283
282
|
setViews(views: import("mobx-state-tree").SnapshotIn<import("@jbrowse/plugin-linear-genome-view").LinearGenomeViewModel>[]): void;
|
|
284
283
|
removeView(view: import("@jbrowse/plugin-linear-genome-view").LinearGenomeViewModel): void;
|
|
285
|
-
closeView(): void;
|
|
286
284
|
setMiddleComparativeHeight(n: number): number;
|
|
287
285
|
activateTrackSelector(): import("@jbrowse/core/util").Widget | undefined;
|
|
288
286
|
toggleTrack(trackId: string): boolean;
|
|
@@ -80,7 +80,9 @@ function stateModelFactory(pluginManager) {
|
|
|
80
80
|
*/
|
|
81
81
|
showAllRegions() {
|
|
82
82
|
(0, mobx_1.transaction)(() => {
|
|
83
|
-
self.views.forEach(view =>
|
|
83
|
+
self.views.forEach(view => {
|
|
84
|
+
view.showAllRegionsInAssembly();
|
|
85
|
+
});
|
|
84
86
|
});
|
|
85
87
|
},
|
|
86
88
|
}))
|
|
@@ -25,7 +25,6 @@ async function renderToSvg(model, opts) {
|
|
|
25
25
|
const { width, views, middleComparativeHeight: synH, tracks } = model;
|
|
26
26
|
const shift = 50;
|
|
27
27
|
const offset = headerHeight + rulerHeight;
|
|
28
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
29
28
|
const { createRootFn } = (0, mobx_state_tree_1.getRoot)(model);
|
|
30
29
|
const heights = views.map(v => (0, plugin_linear_genome_view_1.totalHeight)(v.tracks, textHeight, trackLabels) + offset);
|
|
31
30
|
const totalHeightSvg = (0, util_1.sum)(heights) + synH + 100;
|
|
@@ -43,11 +42,14 @@ async function renderToSvg(model, opts) {
|
|
|
43
42
|
const renderings = await Promise.all(tracks.map(async (track) => {
|
|
44
43
|
const d = track.displays[0];
|
|
45
44
|
await (0, mobx_1.when)(() => (d.ready !== undefined ? d.ready : true));
|
|
46
|
-
const r = await (0, util_1.renderToAbstractCanvas)(width, synH, { exportSVG: opts }, ctx =>
|
|
45
|
+
const r = await (0, util_1.renderToAbstractCanvas)(width, synH, { exportSVG: opts }, ctx => {
|
|
46
|
+
(0, drawSynteny_1.drawRef)(d, ctx);
|
|
47
|
+
return undefined;
|
|
48
|
+
});
|
|
47
49
|
if ('imageData' in r) {
|
|
48
50
|
throw new Error('found a canvas in svg export, probably a bug');
|
|
49
51
|
}
|
|
50
|
-
|
|
52
|
+
if ('canvasRecordedData' in r) {
|
|
51
53
|
return {
|
|
52
54
|
html: await (0, util_1.getSerializedSvg)({
|
|
53
55
|
...r,
|
|
@@ -56,9 +58,7 @@ async function renderToSvg(model, opts) {
|
|
|
56
58
|
}),
|
|
57
59
|
};
|
|
58
60
|
}
|
|
59
|
-
|
|
60
|
-
return r;
|
|
61
|
-
}
|
|
61
|
+
return r;
|
|
62
62
|
}));
|
|
63
63
|
const trackLabelMaxLen = (0, util_1.max)(views.flatMap(view => view.tracks.map(t => (0, util_1.measureText)((0, tracks_1.getTrackName)(t.configuration, session), fontSize))), 0) + 40;
|
|
64
64
|
const trackLabelOffset = trackLabels === 'left' ? trackLabelMaxLen : 0;
|
|
@@ -77,7 +77,9 @@ async function renderToSvg(model, opts) {
|
|
|
77
77
|
react_1.default.createElement("defs", null,
|
|
78
78
|
react_1.default.createElement("clipPath", { id: 'synclip' },
|
|
79
79
|
react_1.default.createElement("rect", { x: 0, y: 0, width: width, height: synH }))),
|
|
80
|
-
react_1.default.createElement("g", { transform: `translate(${shift + trackLabelOffset} ${fontSize + heights[0]})`, clipPath:
|
|
80
|
+
react_1.default.createElement("g", { transform: `translate(${shift + trackLabelOffset} ${fontSize + heights[0]})`, clipPath: 'url(#synclip)' }, renderings.map((r, i) => (
|
|
81
|
+
/* biome-ignore lint/suspicious/noArrayIndexKey: */
|
|
82
|
+
react_1.default.createElement(util_1.ReactRendering, { key: i, rendering: r })))),
|
|
81
83
|
react_1.default.createElement("g", { transform: `translate(${shift} ${fontSize + heights[0] + synH})` },
|
|
82
84
|
react_1.default.createElement("g", { transform: `translate(${trackLabelOffset})` },
|
|
83
85
|
react_1.default.createElement("text", { x: 0, fontSize: fontSize, ...(0, util_1.getFillProps)(theme.palette.text.primary) }, views[1].assemblyNames.join(', ')),
|
|
@@ -44,7 +44,9 @@ function Formatter({ value }) {
|
|
|
44
44
|
setCopied(false);
|
|
45
45
|
}, 700);
|
|
46
46
|
} }, copied ? 'Copied to clipboard' : 'Copy'),
|
|
47
|
-
react_1.default.createElement("button", { type: "button", onClick: () =>
|
|
47
|
+
react_1.default.createElement("button", { type: "button", onClick: () => {
|
|
48
|
+
setShow(val => !val);
|
|
49
|
+
} }, show ? 'Show less' : 'Show more'),
|
|
48
50
|
react_1.default.createElement("div", null, show ? display : `${display.slice(0, 100)}...`)));
|
|
49
51
|
}
|
|
50
52
|
return react_1.default.createElement("div", null, display);
|
package/dist/util.js
CHANGED
|
@@ -15,10 +15,11 @@ function heightFromSpecificLevel(views, trackConfigId, level) {
|
|
|
15
15
|
.slice(0, level)
|
|
16
16
|
.map(v => v.height + 7)
|
|
17
17
|
.reduce((a, b) => a + b, 0);
|
|
18
|
+
const v = views[level];
|
|
18
19
|
return (heightUpUntilThisPoint +
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
getTrackPos(
|
|
20
|
+
v.headerHeight +
|
|
21
|
+
v.scaleBarHeight +
|
|
22
|
+
getTrackPos(v, trackConfigId) +
|
|
22
23
|
1);
|
|
23
24
|
}
|
|
24
25
|
function getTrackPos(view, trackConfigId) {
|
|
@@ -17,8 +17,12 @@ export default function LaunchSyntenyViewDialog({ model, feature, handleClose, }
|
|
|
17
17
|
const [windowSize, setWindowSize] = useState('1000');
|
|
18
18
|
return (React.createElement(Dialog, { open: true, title: "Launch synteny view", onClose: handleClose },
|
|
19
19
|
React.createElement(DialogContent, null,
|
|
20
|
-
inverted ? (React.createElement(FormControlLabel, { className: classes.padding, control: React.createElement(Checkbox, { checked: horizontallyFlip, onChange: event =>
|
|
21
|
-
|
|
20
|
+
inverted ? (React.createElement(FormControlLabel, { className: classes.padding, control: React.createElement(Checkbox, { checked: horizontallyFlip, onChange: event => {
|
|
21
|
+
setHorizontallyFlip(event.target.checked);
|
|
22
|
+
} }), label: "Note: The feature is inverted in orientation on the target\n sequence. This will result in the lower panel having genomic\n coordinates decreasing left to right. Horizontally flip?" })) : null,
|
|
23
|
+
React.createElement(TextField, { label: "Add window size in bp", value: windowSize, onChange: event => {
|
|
24
|
+
setWindowSize(event.target.value);
|
|
25
|
+
} })),
|
|
22
26
|
React.createElement(DialogActions, null,
|
|
23
27
|
React.createElement(Button, { variant: "contained", onClick: () => {
|
|
24
28
|
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
|
@@ -39,5 +43,7 @@ export default function LaunchSyntenyViewDialog({ model, feature, handleClose, }
|
|
|
39
43
|
})();
|
|
40
44
|
handleClose();
|
|
41
45
|
} }, "Submit"),
|
|
42
|
-
React.createElement(Button, { variant: "contained", color: "secondary", onClick: () =>
|
|
46
|
+
React.createElement(Button, { variant: "contained", color: "secondary", onClick: () => {
|
|
47
|
+
handleClose();
|
|
48
|
+
} }, "Cancel"))));
|
|
43
49
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { getSession, getContainingTrack, getContainingView, } from '@jbrowse/core/util';
|
|
2
2
|
import { MismatchParser } from '@jbrowse/plugin-alignments';
|
|
3
|
-
import { when } from 'mobx';
|
|
4
3
|
const { parseCigar } = MismatchParser;
|
|
5
4
|
function f(n) {
|
|
6
5
|
return Math.floor(n);
|
|
@@ -15,7 +14,7 @@ function findPosInCigar(cigar, startX) {
|
|
|
15
14
|
if (featX >= startX) {
|
|
16
15
|
break;
|
|
17
16
|
}
|
|
18
|
-
|
|
17
|
+
if (op === 'I') {
|
|
19
18
|
mateX += len;
|
|
20
19
|
}
|
|
21
20
|
else if (op === 'D') {
|
|
@@ -33,6 +32,9 @@ export async function navToSynteny({ feature, windowSize: ws, model, horizontall
|
|
|
33
32
|
const track = getContainingTrack(model);
|
|
34
33
|
const view = getContainingView(model);
|
|
35
34
|
const reg = view.dynamicBlocks.contentBlocks[0];
|
|
35
|
+
if (!reg) {
|
|
36
|
+
throw new Error('no visible region');
|
|
37
|
+
}
|
|
36
38
|
const cigar = feature.get('CIGAR');
|
|
37
39
|
const strand = feature.get('strand');
|
|
38
40
|
const regStart = reg.start;
|
|
@@ -99,7 +101,6 @@ export async function navToSynteny({ feature, windowSize: ws, model, horizontall
|
|
|
99
101
|
const m1 = Math.min(rMateStart, rMateEnd);
|
|
100
102
|
const m2 = Math.max(rMateStart, rMateEnd);
|
|
101
103
|
const l2 = `${mateRef}:${f(m1 - ws)}-${f(m2 + ws)}${horizontallyFlip ? '[rev]' : ''}`;
|
|
102
|
-
await when(() => view2.width !== undefined);
|
|
103
104
|
await Promise.all([
|
|
104
105
|
view2.views[0].navToLocString(l1, featAsm),
|
|
105
106
|
view2.views[1].navToLocString(l2, mateAsm),
|
|
@@ -117,7 +117,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
|
|
|
117
117
|
readName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
|
|
118
118
|
tagFilter: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
|
|
119
119
|
tag: import("mobx-state-tree").ISimpleType<string>;
|
|
120
|
-
value: import("mobx-state-tree").ISimpleType<string
|
|
120
|
+
value: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
|
|
121
121
|
}, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
122
122
|
}, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>, [undefined]>;
|
|
123
123
|
jexlFilters: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").ISimpleType<string>>, [undefined]>;
|
|
@@ -153,7 +153,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
|
|
|
153
153
|
error: unknown;
|
|
154
154
|
message: string | undefined;
|
|
155
155
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
156
|
-
onHorizontalScroll?:
|
|
156
|
+
onHorizontalScroll?: () => void;
|
|
157
157
|
blockState?: Record<string, any>;
|
|
158
158
|
}>;
|
|
159
159
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -263,7 +263,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
|
|
|
263
263
|
readonly autorunReady: boolean;
|
|
264
264
|
} & {
|
|
265
265
|
setTagsReady(flag: boolean): void;
|
|
266
|
-
setMaxHeight(n
|
|
266
|
+
setMaxHeight(n?: number): void;
|
|
267
267
|
setFeatureHeight(n?: number): void;
|
|
268
268
|
setNoSpacing(flag?: boolean): void;
|
|
269
269
|
setColorScheme(colorScheme: {
|
|
@@ -329,6 +329,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
|
|
|
329
329
|
icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
|
|
330
330
|
muiName: string;
|
|
331
331
|
};
|
|
332
|
+
priority: number;
|
|
332
333
|
onClick: () => void;
|
|
333
334
|
})[];
|
|
334
335
|
} & {
|
|
@@ -30,9 +30,13 @@ export default function LaunchLinearSyntenyView(pluginManager) {
|
|
|
30
30
|
throw new Error(`Assembly ${data.assembly} failed to load`);
|
|
31
31
|
}
|
|
32
32
|
await view.navToSearchString({ input: loc, assembly: asm });
|
|
33
|
-
tracks.forEach(track =>
|
|
33
|
+
tracks.forEach(track => {
|
|
34
|
+
tryTrack(view, track, idsNotFound);
|
|
35
|
+
});
|
|
34
36
|
}));
|
|
35
|
-
tracks.forEach(track =>
|
|
37
|
+
tracks.forEach(track => {
|
|
38
|
+
tryTrack(model, track, idsNotFound);
|
|
39
|
+
});
|
|
36
40
|
if (idsNotFound.length) {
|
|
37
41
|
throw new Error(`Could not resolve identifiers: ${idsNotFound.join(',')}`);
|
|
38
42
|
}
|
|
@@ -48,7 +52,7 @@ function tryTrack(model, trackId, idsNotFound) {
|
|
|
48
52
|
model.showTrack(trackId);
|
|
49
53
|
}
|
|
50
54
|
catch (e) {
|
|
51
|
-
if (
|
|
55
|
+
if (/Could not resolve identifier/.exec(`${e}`)) {
|
|
52
56
|
idsNotFound.push(trackId);
|
|
53
57
|
}
|
|
54
58
|
else {
|
|
@@ -39,7 +39,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
39
39
|
error: unknown;
|
|
40
40
|
message: string | undefined;
|
|
41
41
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
42
|
-
onHorizontalScroll?:
|
|
42
|
+
onHorizontalScroll?: () => void;
|
|
43
43
|
blockState?: Record<string, any>;
|
|
44
44
|
}>;
|
|
45
45
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -125,7 +125,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
125
125
|
error: unknown;
|
|
126
126
|
message: string | undefined;
|
|
127
127
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
128
|
-
onHorizontalScroll?:
|
|
128
|
+
onHorizontalScroll?: () => void;
|
|
129
129
|
blockState?: Record<string, any>;
|
|
130
130
|
}>;
|
|
131
131
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -195,7 +195,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
|
|
|
195
195
|
error: unknown;
|
|
196
196
|
message: string | undefined;
|
|
197
197
|
}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
|
|
198
|
-
onHorizontalScroll?:
|
|
198
|
+
onHorizontalScroll?: () => void;
|
|
199
199
|
blockState?: Record<string, any>;
|
|
200
200
|
}>;
|
|
201
201
|
readonly DisplayBlurb: import("react").FC<{
|
|
@@ -75,8 +75,8 @@ function stateModelFactory(configSchema) {
|
|
|
75
75
|
}
|
|
76
76
|
const { features } = args;
|
|
77
77
|
const existingFeatures = self.features || [];
|
|
78
|
-
const featIds = new Set(existingFeatures.map(f => f.id())
|
|
79
|
-
const newFeatIds = new Set(
|
|
78
|
+
const featIds = new Set(existingFeatures.map(f => f.id()));
|
|
79
|
+
const newFeatIds = new Set(features.map(f => f.id()));
|
|
80
80
|
let foundNewFeatureNotInExistingMap = false;
|
|
81
81
|
let foundExistingFeatureNotInNewMap = false;
|
|
82
82
|
for (const feat of features) {
|
|
@@ -50,7 +50,9 @@ const Header = observer(function ({ model }) {
|
|
|
50
50
|
const anyShowHeaders = model.views.some(view => !view.hideHeader);
|
|
51
51
|
return (React.createElement("div", { className: classes.headerBar },
|
|
52
52
|
React.createElement(TrackSelector, { model: model }),
|
|
53
|
-
React.createElement(IconButton, { onClick: event =>
|
|
53
|
+
React.createElement(IconButton, { onClick: event => {
|
|
54
|
+
setMenuAnchorEl(event.currentTarget);
|
|
55
|
+
}, className: classes.iconButton },
|
|
54
56
|
React.createElement(MoreVertIcon, null)),
|
|
55
57
|
!anyShowHeaders
|
|
56
58
|
? model.views.map(view => (React.createElement("div", { key: view.id, className: classes.searchBox },
|
|
@@ -65,6 +67,8 @@ const Header = observer(function ({ model }) {
|
|
|
65
67
|
menuAnchorEl ? (React.createElement(Menu, { anchorEl: menuAnchorEl, open: true, onMenuItemClick: (_event, callback) => {
|
|
66
68
|
callback();
|
|
67
69
|
setMenuAnchorEl(undefined);
|
|
68
|
-
}, menuItems: model.headerMenuItems(), onClose: () =>
|
|
70
|
+
}, menuItems: model.headerMenuItems(), onClose: () => {
|
|
71
|
+
setMenuAnchorEl(undefined);
|
|
72
|
+
} })) : null));
|
|
69
73
|
});
|
|
70
74
|
export default Header;
|