react-msaview 5.9.0 → 6.0.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/bundle/index.js +99 -99
- package/bundle/index.js.map +4 -4
- package/dist/clustalX.js +22 -22
- package/dist/clustalX.js.map +1 -1
- package/dist/components/ConservationTrack.js +21 -16
- package/dist/components/ConservationTrack.js.map +1 -1
- package/dist/components/CopyButton.d.ts +9 -0
- package/dist/components/CopyButton.js +23 -0
- package/dist/components/CopyButton.js.map +1 -0
- package/dist/components/Loading.js +2 -2
- package/dist/components/Loading.js.map +1 -1
- package/dist/components/MSAView.js +18 -24
- package/dist/components/MSAView.js.map +1 -1
- package/dist/components/ResizeHandles.js +24 -40
- package/dist/components/ResizeHandles.js.map +1 -1
- package/dist/components/ScrollbarThumb.d.ts +14 -0
- package/dist/components/ScrollbarThumb.js +28 -0
- package/dist/components/ScrollbarThumb.js.map +1 -0
- package/dist/components/SequenceTextArea.js +3 -10
- package/dist/components/SequenceTextArea.js.map +1 -1
- package/dist/components/TextTrack.js +26 -21
- package/dist/components/TextTrack.js.map +1 -1
- package/dist/components/VerticalScrollbar.js +11 -25
- package/dist/components/VerticalScrollbar.js.map +1 -1
- package/dist/components/dialogs/FeatureDialog.js +3 -3
- package/dist/components/dialogs/FeatureDialog.js.map +1 -1
- package/dist/components/dialogs/{UserProvidedDomainsDialog.d.ts → InterProScanFileDialog.d.ts} +2 -2
- package/dist/components/dialogs/{UserProvidedDomainsDialog.js → InterProScanFileDialog.js} +6 -10
- package/dist/components/dialogs/InterProScanFileDialog.js.map +1 -0
- package/dist/components/dialogs/TrackInfoDialog.d.ts +2 -4
- package/dist/components/dialogs/TrackInfoDialog.js +8 -14
- package/dist/components/dialogs/TrackInfoDialog.js.map +1 -1
- package/dist/components/header/FileMenu.js +3 -3
- package/dist/components/header/FileMenu.js.map +1 -1
- package/dist/components/header/GappynessSlider.js +1 -1
- package/dist/components/header/GappynessSlider.js.map +1 -1
- package/dist/components/header/{getDomainsMenu.d.ts → getAnnotationsMenu.d.ts} +1 -1
- package/dist/components/header/{getDomainsMenu.js → getAnnotationsMenu.js} +10 -9
- package/dist/components/header/getAnnotationsMenu.js.map +1 -0
- package/dist/components/header/settingsMenuItems.js +39 -72
- package/dist/components/header/settingsMenuItems.js.map +1 -1
- package/dist/components/import/ImportForm.js +1 -1
- package/dist/components/import/ImportForm.js.map +1 -1
- package/dist/components/import/ImportFormExamples.js +66 -57
- package/dist/components/import/ImportFormExamples.js.map +1 -1
- package/dist/components/minimap/Minimap.js +11 -22
- package/dist/components/minimap/Minimap.js.map +1 -1
- package/dist/components/minimap/MinimapSVG.d.ts +2 -1
- package/dist/components/minimap/MinimapSVG.js +3 -4
- package/dist/components/minimap/MinimapSVG.js.map +1 -1
- package/dist/components/minimap/minimapLayout.d.ts +10 -1
- package/dist/components/minimap/minimapLayout.js +15 -10
- package/dist/components/minimap/minimapLayout.js.map +1 -1
- package/dist/components/msa/{DomainLegend.d.ts → AnnotationLegend.d.ts} +2 -2
- package/dist/components/msa/{DomainLegend.js → AnnotationLegend.js} +4 -4
- package/dist/components/msa/AnnotationLegend.js.map +1 -0
- package/dist/components/msa/MSACanvas.js +2 -2
- package/dist/components/msa/MSACanvas.js.map +1 -1
- package/dist/components/msa/MSACanvasBlock.js +19 -16
- package/dist/components/msa/MSACanvasBlock.js.map +1 -1
- package/dist/components/msa/MSAMouseoverCanvas.js +14 -8
- package/dist/components/msa/MSAMouseoverCanvas.js.map +1 -1
- package/dist/components/msa/MSAPanel.js +2 -2
- package/dist/components/msa/MSAPanel.js.map +1 -1
- package/dist/components/msa/domainBandCursor.d.ts +17 -0
- package/dist/components/msa/domainBandCursor.js +39 -0
- package/dist/components/msa/domainBandCursor.js.map +1 -0
- package/dist/components/msa/renderBoxFeatureCanvasBlock.js +9 -6
- package/dist/components/msa/renderBoxFeatureCanvasBlock.js.map +1 -1
- package/dist/components/msa/renderMSABlock.js +14 -20
- package/dist/components/msa/renderMSABlock.js.map +1 -1
- package/dist/components/msa/renderMSAMouseover.js +32 -33
- package/dist/components/msa/renderMSAMouseover.js.map +1 -1
- package/dist/components/overlayColors.d.ts +2 -0
- package/dist/components/overlayColors.js +5 -0
- package/dist/components/overlayColors.js.map +1 -1
- package/dist/components/tree/TreeCanvas.js +29 -24
- package/dist/components/tree/TreeCanvas.js.map +1 -1
- package/dist/components/tree/TreeCanvasBlock.js +19 -12
- package/dist/components/tree/TreeCanvasBlock.js.map +1 -1
- package/dist/components/tree/TreeRuler.js +5 -2
- package/dist/components/tree/TreeRuler.js.map +1 -1
- package/dist/components/tree/renderTreeCanvas.d.ts +0 -38
- package/dist/components/tree/renderTreeCanvas.js +17 -17
- package/dist/components/tree/renderTreeCanvas.js.map +1 -1
- package/dist/ggplotPalettes.d.ts +0 -1
- package/dist/ggplotPalettes.js +0 -3
- package/dist/ggplotPalettes.js.map +1 -1
- package/dist/hierarchy.d.ts +2 -6
- package/dist/hierarchy.js +4 -6
- package/dist/hierarchy.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/launchInterProScan.d.ts +0 -23
- package/dist/launchInterProScan.js +2 -5
- package/dist/launchInterProScan.js.map +1 -1
- package/dist/measureTextCanvas.js +21 -6
- package/dist/measureTextCanvas.js.map +1 -1
- package/dist/model.d.ts +50 -100
- package/dist/model.js +209 -219
- package/dist/model.js.map +1 -1
- package/dist/neighborJoining.js +12 -19
- package/dist/neighborJoining.js.map +1 -1
- package/dist/parseAsn1.js +32 -43
- package/dist/parseAsn1.js.map +1 -1
- package/dist/renderToSvg.js +5 -2
- package/dist/renderToSvg.js.map +1 -1
- package/dist/rowCoordinateCalculations.d.ts +13 -17
- package/dist/rowCoordinateCalculations.js +45 -39
- package/dist/rowCoordinateCalculations.js.map +1 -1
- package/dist/seqPosToGlobalCol.d.ts +6 -19
- package/dist/seqPosToGlobalCol.js +6 -33
- package/dist/seqPosToGlobalCol.js.map +1 -1
- package/dist/types.d.ts +4 -11
- package/dist/useCanvasAutorun.d.ts +23 -1
- package/dist/useCanvasAutorun.js +20 -8
- package/dist/useCanvasAutorun.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +5 -5
- package/src/clustalX.ts +22 -22
- package/src/colSpace.test.ts +27 -0
- package/src/components/ConservationTrack.tsx +7 -5
- package/src/components/CopyButton.tsx +44 -0
- package/src/components/Loading.tsx +10 -1
- package/src/components/MSAView.tsx +25 -32
- package/src/components/ResizeHandles.tsx +60 -69
- package/src/components/ScrollbarThumb.tsx +48 -0
- package/src/components/SequenceTextArea.tsx +3 -16
- package/src/components/TextTrack.tsx +7 -12
- package/src/components/VerticalScrollbar.tsx +19 -33
- package/src/components/dialogs/FeatureDialog.tsx +3 -4
- package/src/components/dialogs/{UserProvidedDomainsDialog.tsx → InterProScanFileDialog.tsx} +6 -14
- package/src/components/dialogs/TrackInfoDialog.tsx +18 -20
- package/src/components/header/FileMenu.tsx +3 -3
- package/src/components/header/GappynessSlider.tsx +4 -1
- package/src/components/header/{getDomainsMenu.ts → getAnnotationsMenu.ts} +10 -9
- package/src/components/header/settingsMenuItems.ts +40 -72
- package/src/components/import/ImportForm.tsx +1 -1
- package/src/components/import/ImportFormExamples.tsx +82 -133
- package/src/components/minimap/Minimap.tsx +23 -31
- package/src/components/minimap/MinimapSVG.tsx +32 -31
- package/src/components/minimap/minimapLayout.test.ts +60 -0
- package/src/components/minimap/minimapLayout.ts +15 -10
- package/src/components/msa/{DomainLegend.tsx → AnnotationLegend.tsx} +7 -3
- package/src/components/msa/MSACanvas.tsx +3 -10
- package/src/components/msa/MSACanvasBlock.tsx +16 -21
- package/src/components/msa/MSAMouseoverCanvas.tsx +11 -9
- package/src/components/msa/MSAPanel.tsx +2 -2
- package/src/components/msa/domainBandCursor.ts +41 -0
- package/src/components/msa/renderBoxFeatureCanvasBlock.test.ts +51 -0
- package/src/components/msa/renderBoxFeatureCanvasBlock.ts +13 -8
- package/src/components/msa/renderMSABlock.ts +19 -23
- package/src/components/msa/renderMSAMouseover.ts +38 -35
- package/src/components/overlayColors.ts +6 -0
- package/src/components/tree/TreeCanvas.tsx +6 -4
- package/src/components/tree/TreeCanvasBlock.tsx +11 -12
- package/src/components/tree/TreeRuler.tsx +7 -2
- package/src/components/tree/renderTreeCanvas.test.ts +15 -7
- package/src/components/tree/renderTreeCanvas.ts +20 -17
- package/src/domainBands.test.ts +24 -0
- package/src/domainLetterColor.test.ts +80 -0
- package/src/ggplotPalettes.ts +0 -4
- package/src/hierarchy.test.ts +7 -7
- package/src/hierarchy.ts +6 -9
- package/src/index.ts +4 -1
- package/src/largeTree.test.ts +23 -2
- package/src/launchInterProScan.ts +3 -30
- package/src/loadErrorDisplay.test.tsx +102 -0
- package/src/measureTextCanvas.ts +22 -6
- package/src/model.ts +233 -244
- package/src/modelFilehandleLoaders.test.ts +137 -0
- package/src/neighborJoining.test.ts +12 -0
- package/src/neighborJoining.ts +12 -20
- package/src/parseAsn1.ts +32 -40
- package/src/{renderDomainLegendSvg.test.tsx → renderDomainsSvg.test.tsx} +44 -20
- package/src/renderMinimapSvg.test.tsx +109 -0
- package/src/renderToSvg.tsx +5 -2
- package/src/rowCoordinateCalculations.ts +48 -44
- package/src/seqPosToGlobalCol.test.ts +39 -51
- package/src/seqPosToGlobalCol.ts +6 -41
- package/src/types.ts +10 -15
- package/src/useCanvasAutorun.test.tsx +98 -0
- package/src/useCanvasAutorun.ts +30 -11
- package/src/version.ts +1 -1
- package/src/viewChrome.test.tsx +134 -0
- package/dist/components/dialogs/DomainDialog.d.ts +0 -6
- package/dist/components/dialogs/DomainDialog.js +0 -19
- package/dist/components/dialogs/DomainDialog.js.map +0 -1
- package/dist/components/dialogs/UserProvidedDomainsDialog.js.map +0 -1
- package/dist/components/header/SettingsMenu.d.ts +0 -6
- package/dist/components/header/SettingsMenu.js +0 -40
- package/dist/components/header/SettingsMenu.js.map +0 -1
- package/dist/components/header/getDomainsMenu.js.map +0 -1
- package/dist/components/msa/DomainLegend.js.map +0 -1
- package/src/components/dialogs/DomainDialog.tsx +0 -45
- package/src/components/header/SettingsMenu.tsx +0 -57
|
@@ -3,65 +3,74 @@ import { Link, Typography } from '@mui/material';
|
|
|
3
3
|
import { observer } from 'mobx-react';
|
|
4
4
|
import { smallMSA, smallMSAOnly, smallTree } from './data/seq2.js';
|
|
5
5
|
import { load } from './util.js';
|
|
6
|
-
function ListItem({ onClick, model, children, }) {
|
|
7
|
-
return (React.createElement("li", null,
|
|
8
|
-
React.createElement(Link, { onClick: event => {
|
|
9
|
-
model.setError(undefined);
|
|
10
|
-
event.preventDefault();
|
|
11
|
-
onClick();
|
|
12
|
-
}, href: "#" },
|
|
13
|
-
React.createElement(Typography, { component: "span" }, children))));
|
|
14
|
-
}
|
|
15
6
|
const BASE = 'https://jbrowse.org/genomes/multiple_sequence_alignments';
|
|
7
|
+
const TREES = 'https://jbrowse.org/genomes/newicktrees';
|
|
8
|
+
const examples = [
|
|
9
|
+
{
|
|
10
|
+
label: '230k COVID-19 samples (tree only)',
|
|
11
|
+
tree: `${TREES}/sarscov2phylo.pub.ft.nh`,
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
label: 'Small protein MSA+tree',
|
|
15
|
+
inline: { msa: smallMSA, tree: smallTree },
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
label: 'Small MSA only',
|
|
19
|
+
inline: { msa: smallMSAOnly },
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
label: 'PFAM SARS-CoV2 multi-stockholm',
|
|
23
|
+
msa: `${BASE}/pfam-cov2.stock`,
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
label: 'PFAM SARS-CoV2 multi-stockholm w/ domains loaded',
|
|
27
|
+
msa: `${BASE}/pfam-cov2.stock`,
|
|
28
|
+
gff: `${BASE}/pfam-cov2-domains.gff`,
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
label: 'Lysine stockholm file',
|
|
32
|
+
msa: `${BASE}/Lysine.stock`,
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
label: 'PF01601 stockholm file (SARS-CoV2 spike protein)',
|
|
36
|
+
msa: `${BASE}/PF01601_full.txt`,
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
label: 'Europe COVID full genomes (LR883044.1 and 199 other sequences)',
|
|
40
|
+
msa: `${BASE}/europe_covid.fa`,
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
label: 'MAFFT+VeryFastTree(17.9k samples)',
|
|
44
|
+
msa: `${BASE}/rhv_test-only.aligned_with_mafft_auto.fa`,
|
|
45
|
+
tree: `${BASE}/rhv_test-only.aligned_with_mafft_auto.nh`,
|
|
46
|
+
},
|
|
47
|
+
{
|
|
48
|
+
label: 'Human BLAST results mfa',
|
|
49
|
+
msa: 'https://jbrowse.org/demos/ttc39a.mfa',
|
|
50
|
+
},
|
|
51
|
+
];
|
|
52
|
+
function uri(url) {
|
|
53
|
+
return url ? { uri: url, locationType: 'UriLocation' } : undefined;
|
|
54
|
+
}
|
|
16
55
|
const ImportFormExamples = observer(function ({ model, }) {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
36
|
-
model.setData({ msa: smallMSAOnly });
|
|
37
|
-
} }, "Small MSA only"),
|
|
38
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
39
|
-
loadUris({ msa: `${BASE}/pfam-cov2.stock` });
|
|
40
|
-
} }, "PFAM SARS-CoV2 multi-stockholm"),
|
|
41
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
42
|
-
loadUris({
|
|
43
|
-
msa: `${BASE}/pfam-cov2.stock`,
|
|
44
|
-
gff: `${BASE}/pfam-cov2-domains.gff`,
|
|
45
|
-
});
|
|
46
|
-
} }, "PFAM SARS-CoV2 multi-stockholm w/ domains loaded"),
|
|
47
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
48
|
-
loadUris({ msa: `${BASE}/Lysine.stock` });
|
|
49
|
-
} }, "Lysine stockholm file"),
|
|
50
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
51
|
-
loadUris({ msa: `${BASE}/PF01601_full.txt` });
|
|
52
|
-
} }, "PF01601 stockholm file (SARS-CoV2 spike protein)"),
|
|
53
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
54
|
-
loadUris({ msa: `${BASE}/europe_covid.fa` });
|
|
55
|
-
} }, "Europe COVID full genomes (LR883044.1 and 199 other sequences)"),
|
|
56
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
57
|
-
loadUris({
|
|
58
|
-
msa: `${BASE}/rhv_test-only.aligned_with_mafft_auto.fa`,
|
|
59
|
-
tree: `${BASE}/rhv_test-only.aligned_with_mafft_auto.nh`,
|
|
60
|
-
});
|
|
61
|
-
} }, "MAFFT+VeryFastTree(17.9k samples)"),
|
|
62
|
-
React.createElement(ListItem, { model: model, onClick: () => {
|
|
63
|
-
loadUris({ msa: 'https://jbrowse.org/demos/ttc39a.mfa' });
|
|
64
|
-
} }, "Human BLAST results mfa")));
|
|
56
|
+
return (React.createElement("ul", null, examples.map(({ label, msa, tree, gff, inline }) => (React.createElement("li", { key: label },
|
|
57
|
+
React.createElement(Link, { href: "#", onClick: event => {
|
|
58
|
+
event.preventDefault();
|
|
59
|
+
model.setError(undefined);
|
|
60
|
+
try {
|
|
61
|
+
if (inline) {
|
|
62
|
+
model.setData(inline);
|
|
63
|
+
}
|
|
64
|
+
else {
|
|
65
|
+
load(model, uri(msa), uri(tree), uri(gff));
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
catch (e) {
|
|
69
|
+
console.error(e);
|
|
70
|
+
model.setError(e);
|
|
71
|
+
}
|
|
72
|
+
} },
|
|
73
|
+
React.createElement(Typography, { component: "span" }, label)))))));
|
|
65
74
|
});
|
|
66
75
|
export default ImportFormExamples;
|
|
67
76
|
//# sourceMappingURL=ImportFormExamples.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImportFormExamples.js","sourceRoot":"","sources":["../../../src/components/import/ImportFormExamples.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAClE,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAIhC,
|
|
1
|
+
{"version":3,"file":"ImportFormExamples.js","sourceRoot":"","sources":["../../../src/components/import/ImportFormExamples.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,43 +1,32 @@
|
|
|
1
|
-
import React, { useCallback
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import {
|
|
3
|
+
import ScrollbarThumb, { scrollbarThumbFill } from '../ScrollbarThumb.js';
|
|
4
4
|
import { MINIMAP_BAR_HEIGHT, getMinimapLayout } from './minimapLayout.js';
|
|
5
5
|
const Minimap = observer(function ({ model }) {
|
|
6
|
-
const
|
|
7
|
-
const {
|
|
8
|
-
const
|
|
9
|
-
const fill = 'rgba(66, 119, 127, 0.3)';
|
|
10
|
-
const { startDrag } = useDragScroll('x', useCallback((delta, startScroll) => {
|
|
6
|
+
const { minimapHeight, msaCanvasWidth } = model;
|
|
7
|
+
const { unit, s, w, polygonHeight, polygonPoints } = getMinimapLayout(model, msaCanvasWidth);
|
|
8
|
+
const onDrag = useCallback((delta, startScroll) => {
|
|
11
9
|
model.setScrollX(startScroll - delta / unit);
|
|
12
|
-
}, [model, unit])
|
|
10
|
+
}, [model, unit]);
|
|
13
11
|
return (React.createElement("div", { style: {
|
|
14
12
|
position: 'relative',
|
|
15
13
|
height: minimapHeight,
|
|
16
|
-
width:
|
|
14
|
+
width: msaCanvasWidth,
|
|
15
|
+
flexShrink: 0,
|
|
17
16
|
} },
|
|
18
17
|
React.createElement("div", { style: {
|
|
19
18
|
height: MINIMAP_BAR_HEIGHT,
|
|
20
19
|
boxSizing: 'border-box',
|
|
21
20
|
border: '1px solid #555',
|
|
22
21
|
} }),
|
|
23
|
-
React.createElement("
|
|
24
|
-
position: 'absolute',
|
|
22
|
+
React.createElement(ScrollbarThumb, { axis: "x", getStart: () => model.scrollX, onDrag: onDrag, style: {
|
|
25
23
|
top: 0,
|
|
26
24
|
left: Math.max(0, s),
|
|
27
|
-
background: hovered ? 'rgba(66,119,127,0.6)' : fill,
|
|
28
|
-
cursor: 'pointer',
|
|
29
25
|
height: MINIMAP_BAR_HEIGHT,
|
|
30
26
|
width: w,
|
|
31
|
-
zIndex: 100,
|
|
32
|
-
}, onMouseOver: () => {
|
|
33
|
-
setHovered(true);
|
|
34
|
-
}, onMouseOut: () => {
|
|
35
|
-
setHovered(false);
|
|
36
|
-
}, onMouseDown: event => {
|
|
37
|
-
startDrag(event, model.scrollX);
|
|
38
27
|
} }),
|
|
39
|
-
React.createElement("svg", { height: polygonHeight,
|
|
40
|
-
React.createElement("polygon", { fill:
|
|
28
|
+
React.createElement("svg", { height: polygonHeight, width: msaCanvasWidth },
|
|
29
|
+
React.createElement("polygon", { fill: scrollbarThumbFill, points: polygonPoints }))));
|
|
41
30
|
});
|
|
42
31
|
export default Minimap;
|
|
43
32
|
//# sourceMappingURL=Minimap.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Minimap.js","sourceRoot":"","sources":["../../../src/components/minimap/Minimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Minimap.js","sourceRoot":"","sources":["../../../src/components/minimap/Minimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,cAAc,EAAE,EAAE,kBAAkB,EAAE,MAAM,sBAAuB,CAAA;AAC1E,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAC/C,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,gBAAgB,CACnE,KAAK,EACL,cAAc,CACf,CAAA;IAED,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,KAAa,EAAE,WAAmB,EAAE,EAAE;QACrC,KAAK,CAAC,UAAU,CAAC,WAAW,GAAG,KAAK,GAAG,IAAI,CAAC,CAAA;IAC9C,CAAC,EACD,CAAC,KAAK,EAAE,IAAI,CAAC,CACd,CAAA;IAED,OAAO,CAIL,6BACE,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,aAAa;YACrB,KAAK,EAAE,cAAc;YACrB,UAAU,EAAE,CAAC;SACd;QAED,6BACE,KAAK,EAAE;gBACL,MAAM,EAAE,kBAAkB;gBAC1B,SAAS,EAAE,YAAY;gBACvB,MAAM,EAAE,gBAAgB;aACzB,GACD;QACF,oBAAC,cAAc,IACb,IAAI,EAAC,GAAG,EACR,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,OAAO,EAC7B,MAAM,EAAE,MAAM,EACd,KAAK,EAAE;gBACL,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;gBACpB,MAAM,EAAE,kBAAkB;gBAC1B,KAAK,EAAE,CAAC;aACT,GACD;QAEF,6BAAK,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,cAAc;YAC/C,iCAAS,IAAI,EAAE,kBAAkB,EAAE,MAAM,EAAE,aAAa,GAAI,CACxD,CACF,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MsaViewModel } from '../../model.ts';
|
|
3
|
-
declare const MinimapSVG: ({ model }: {
|
|
3
|
+
declare const MinimapSVG: ({ model, width }: {
|
|
4
4
|
model: MsaViewModel;
|
|
5
|
+
width: number;
|
|
5
6
|
}) => React.JSX.Element;
|
|
6
7
|
export default MinimapSVG;
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
3
|
import { MINIMAP_BAR_HEIGHT, getMinimapLayout } from './minimapLayout.js';
|
|
4
|
-
const MinimapSVG = observer(({ model }) => {
|
|
5
|
-
const {
|
|
6
|
-
const { s, w, polygonPoints } = getMinimapLayout(model);
|
|
4
|
+
const MinimapSVG = observer(({ model, width }) => {
|
|
5
|
+
const { s, w, polygonPoints } = getMinimapLayout(model, width);
|
|
7
6
|
const fillColor = 'rgb(66, 119, 127)';
|
|
8
7
|
const fillOpacity = 0.3;
|
|
9
8
|
return (React.createElement(React.Fragment, null,
|
|
10
|
-
React.createElement("rect", { x: 0, y: 0, width:
|
|
9
|
+
React.createElement("rect", { x: 0, y: 0, width: width, height: MINIMAP_BAR_HEIGHT, stroke: "#555", fill: "none" }),
|
|
11
10
|
React.createElement("rect", { x: Math.max(0, s), y: 0, width: w, height: MINIMAP_BAR_HEIGHT, fill: fillColor, fillOpacity: fillOpacity, stroke: "#555" }),
|
|
12
11
|
React.createElement("g", { transform: `translate(0 ${MINIMAP_BAR_HEIGHT})` },
|
|
13
12
|
React.createElement("polygon", { fill: fillColor, fillOpacity: fillOpacity, points: polygonPoints }))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MinimapSVG.js","sourceRoot":"","sources":["../../../src/components/minimap/MinimapSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,UAAU,GAAG,QAAQ,
|
|
1
|
+
{"version":3,"file":"MinimapSVG.js","sourceRoot":"","sources":["../../../src/components/minimap/MinimapSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAIzE,MAAM,UAAU,GAAG,QAAQ,CACzB,CAAC,EAAE,KAAK,EAAE,KAAK,EAA0C,EAAE,EAAE;IAC3D,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,GAAG,gBAAgB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;IAC9D,MAAM,SAAS,GAAG,mBAAmB,CAAA;IACrC,MAAM,WAAW,GAAG,GAAG,CAAA;IAEvB,OAAO,CACL;QACE,8BACE,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,kBAAkB,EAC1B,MAAM,EAAC,MAAM,EACb,IAAI,EAAC,MAAM,GACX;QACF,8BACE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,EACjB,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,kBAAkB,EAC1B,IAAI,EAAE,SAAS,EACf,WAAW,EAAE,WAAW,EACxB,MAAM,EAAC,MAAM,GACb;QACF,2BAAG,SAAS,EAAE,eAAe,kBAAkB,GAAG;YAChD,iCACE,IAAI,EAAE,SAAS,EACf,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,aAAa,GACrB,CACA,CACH,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
import type { MsaViewModel } from '../../model.ts';
|
|
2
2
|
export declare const MINIMAP_BAR_HEIGHT = 12;
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Viewport-rectangle and trapezoid geometry for a minimap drawn `minimapWidth`
|
|
5
|
+
* pixels wide, shared by the interactive Minimap and the static MinimapSVG.
|
|
6
|
+
*
|
|
7
|
+
* The width is a parameter rather than read off the model because the two
|
|
8
|
+
* differ: on screen the minimap sits over the alignment canvas, while the SVG
|
|
9
|
+
* export lays the whole figure out on its own grid. What the rectangle *marks*
|
|
10
|
+
* is always the on-screen viewport, so that part comes from the model.
|
|
11
|
+
*/
|
|
12
|
+
export declare function getMinimapLayout(model: MsaViewModel, minimapWidth: number): {
|
|
4
13
|
unit: number;
|
|
5
14
|
s: number;
|
|
6
15
|
w: number;
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
export const MINIMAP_BAR_HEIGHT = 12;
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Viewport-rectangle and trapezoid geometry for a minimap drawn `minimapWidth`
|
|
4
|
+
* pixels wide, shared by the interactive Minimap and the static MinimapSVG.
|
|
5
|
+
*
|
|
6
|
+
* The width is a parameter rather than read off the model because the two
|
|
7
|
+
* differ: on screen the minimap sits over the alignment canvas, while the SVG
|
|
8
|
+
* export lays the whole figure out on its own grid. What the rectangle *marks*
|
|
9
|
+
* is always the on-screen viewport, so that part comes from the model.
|
|
10
|
+
*/
|
|
11
|
+
export function getMinimapLayout(model, minimapWidth) {
|
|
12
|
+
const { scrollX, minimapHeight, totalWidth, msaCanvasWidth } = model;
|
|
13
|
+
const unit = totalWidth > 0 ? minimapWidth / totalWidth : 0;
|
|
14
|
+
const s = -scrollX * unit;
|
|
15
|
+
const w = Math.max(msaCanvasWidth * unit, 20);
|
|
11
16
|
const polygonHeight = minimapHeight - MINIMAP_BAR_HEIGHT;
|
|
12
|
-
const polygonPoints = `${s + w},0 ${s},0 0,${polygonHeight} ${
|
|
17
|
+
const polygonPoints = `${s + w},0 ${s},0 0,${polygonHeight} ${minimapWidth},${polygonHeight}`;
|
|
13
18
|
return { unit, s, w, polygonHeight, polygonPoints };
|
|
14
19
|
}
|
|
15
20
|
//# sourceMappingURL=minimapLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minimapLayout.js","sourceRoot":"","sources":["../../../src/components/minimap/minimapLayout.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,kBAAkB,GAAG,EAAE,CAAA;AAEpC
|
|
1
|
+
{"version":3,"file":"minimapLayout.js","sourceRoot":"","sources":["../../../src/components/minimap/minimapLayout.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,kBAAkB,GAAG,EAAE,CAAA;AAEpC;;;;;;;;GAQG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAmB,EAAE,YAAoB;IACxE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IACpE,MAAM,IAAI,GAAG,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAA;IAC3D,MAAM,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAAA;IACzB,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,GAAG,IAAI,EAAE,EAAE,CAAC,CAAA;IAC7C,MAAM,aAAa,GAAG,aAAa,GAAG,kBAAkB,CAAA;IACxD,MAAM,aAAa,GAAG,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,aAAa,IAAI,YAAY,IAAI,aAAa,EAAE,CAAA;IAC7F,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AACrD,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { MsaViewModel } from '../../model.ts';
|
|
3
|
-
declare const
|
|
3
|
+
declare const AnnotationLegend: ({ model, }: {
|
|
4
4
|
model: MsaViewModel;
|
|
5
5
|
}) => React.JSX.Element | null;
|
|
6
|
-
export default
|
|
6
|
+
export default AnnotationLegend;
|
|
@@ -3,7 +3,7 @@ import ExpandLess from '@mui/icons-material/ExpandLess';
|
|
|
3
3
|
import ExpandMore from '@mui/icons-material/ExpandMore';
|
|
4
4
|
import { IconButton, Paper, Typography } from '@mui/material';
|
|
5
5
|
import { observer } from 'mobx-react';
|
|
6
|
-
const
|
|
6
|
+
const AnnotationLegend = observer(function ({ model, }) {
|
|
7
7
|
const { actuallyShowDomains, visibleDomainTypes: visible, fillPalette, showDomainLegend: expanded, } = model;
|
|
8
8
|
const ExpandIcon = expanded ? ExpandLess : ExpandMore;
|
|
9
9
|
return actuallyShowDomains && visible.length > 0 ? (React.createElement(Paper, { elevation: 3, style: {
|
|
@@ -23,7 +23,7 @@ const DomainLegend = observer(function ({ model }) {
|
|
|
23
23
|
justifyContent: 'flex-end',
|
|
24
24
|
padding: '2px 4px 2px 8px',
|
|
25
25
|
} },
|
|
26
|
-
React.createElement(IconButton, { size: "small", title: expanded ? 'Collapse
|
|
26
|
+
React.createElement(IconButton, { size: "small", title: expanded ? 'Collapse key' : 'Expand key', onClick: () => {
|
|
27
27
|
model.setShowDomainLegend(!expanded);
|
|
28
28
|
} },
|
|
29
29
|
React.createElement(ExpandIcon, { fontSize: "small" }))),
|
|
@@ -36,5 +36,5 @@ const DomainLegend = observer(function ({ model }) {
|
|
|
36
36
|
} }),
|
|
37
37
|
React.createElement(Typography, { variant: "caption", noWrap: true }, name)))))) : null)) : null;
|
|
38
38
|
});
|
|
39
|
-
export default
|
|
40
|
-
//# sourceMappingURL=
|
|
39
|
+
export default AnnotationLegend;
|
|
40
|
+
//# sourceMappingURL=AnnotationLegend.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnnotationLegend.js","sourceRoot":"","sources":["../../../src/components/msa/AnnotationLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,UAAU,EAC1C,KAAK,GAGN;IACC,MAAM,EACJ,mBAAmB,EACnB,kBAAkB,EAAE,OAAO,EAC3B,WAAW,EACX,gBAAgB,EAAE,QAAQ,GAC3B,GAAG,KAAK,CAAA;IACT,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAA;IAErD,OAAO,mBAAmB,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACjD,oBAAC,KAAK,IACJ,SAAS,EAAE,CAAC,EACZ,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,GAAG;YACb,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,OAAO,EAAE,IAAI;SACd;QAED,6BACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,UAAU,EAAE,QAAQ;gBACpB,cAAc,EAAE,UAAU;gBAC1B,OAAO,EAAE,iBAAiB;aAC3B;YAED,oBAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,EAC/C,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,mBAAmB,CAAC,CAAC,QAAQ,CAAC,CAAA;gBACtC,CAAC;gBAED,oBAAC,UAAU,IAAC,QAAQ,EAAC,OAAO,GAAG,CACpB,CACT;QACL,QAAQ,CAAC,CAAC,CAAC,CACV,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,IACnD,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACpC,6BACE,GAAG,EAAE,SAAS,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EACxD,KAAK,EAAE,SAAS;YAEhB,6BACE,KAAK,EAAE;oBACL,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,UAAU,EAAE,CAAC;oBACb,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC;iBACnC,GACD;YACF,oBAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,MAAM,UACjC,IAAI,CACM,CACT,CACP,CAAC,CACE,CACP,CAAC,CAAC,CAAC,IAAI,CACF,CACT,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
|
|
@@ -4,7 +4,7 @@ import { useWheelScroll } from '../../useWheelScroll.js';
|
|
|
4
4
|
import Loading from './Loading.js';
|
|
5
5
|
import MSACanvasBlock from './MSACanvasBlock.js';
|
|
6
6
|
const MSACanvas = observer(function ({ model }) {
|
|
7
|
-
const { MSA,
|
|
7
|
+
const { MSA, msaFilehandle, height, msaCanvasWidth, blocks2d, scrollZoom } = model;
|
|
8
8
|
const ref = useRef(null);
|
|
9
9
|
const onScrollX = useCallback((d) => {
|
|
10
10
|
model.doScrollX(d);
|
|
@@ -27,7 +27,7 @@ const MSACanvas = observer(function ({ model }) {
|
|
|
27
27
|
}, style: {
|
|
28
28
|
position: 'relative',
|
|
29
29
|
height,
|
|
30
|
-
width:
|
|
30
|
+
width: msaCanvasWidth,
|
|
31
31
|
overflow: 'hidden',
|
|
32
32
|
} }, !MSA && !msaFilehandle ? null : MSA ? (blocks2d.map(([bx, by]) => (React.createElement(MSACanvasBlock, { key: `${bx}_${by}`, model: model, offsetX: bx, offsetY: by })))) : (React.createElement(Loading, null))));
|
|
33
33
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,OAAO,MAAM,cAAe,CAAA;AACnC,OAAO,cAAc,MAAM,qBAAsB,CAAA;AAIjD,MAAM,SAAS,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACrE,MAAM,
|
|
1
|
+
{"version":3,"file":"MSACanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,OAAO,MAAM,cAAe,CAAA;AACnC,OAAO,cAAc,MAAM,qBAAsB,CAAA;AAIjD,MAAM,SAAS,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACrE,MAAM,EAAE,GAAG,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,GACxE,KAAK,CAAA;IACP,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IACxC,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAS,EAAE,EAAE;QACZ,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;IACpB,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAS,EAAE,EAAE;QACZ,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;IACpB,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,WAAmB,EAAE,OAAe,EAAE,OAAe,EAAE,EAAE;QACxD,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO,CAAC,CAAA;IAChD,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,cAAc,CAAC;QAChD,GAAG;QACH,SAAS;QACT,SAAS;QACT,MAAM;QACN,UAAU;KACX,CAAC,CAAA;IAEF,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,iBAKI,YAAY,EACxB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,KAAK,CAAC,EAAE;YACpB,KAAK,CAAC,cAAc,EAAE,CAAA;QACxB,CAAC,EACD,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM;YACN,KAAK,EAAE,cAAc;YACrB,QAAQ,EAAE,QAAQ;SACnB,IAEA,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CACrC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACzB,oBAAC,cAAc,IACb,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE,EAClB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,EAAE,EACX,OAAO,EAAE,EAAE,GACX,CACH,CAAC,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,OAAO,OAAG,CACZ,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}
|
|
@@ -15,27 +15,30 @@ const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
|
|
|
15
15
|
offsetX,
|
|
16
16
|
offsetY,
|
|
17
17
|
});
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
ctx
|
|
21
|
-
|
|
22
|
-
|
|
18
|
+
const canvasSize = blockSize * highResScaleFactor;
|
|
19
|
+
const ref = useCanvasAutorun({
|
|
20
|
+
draw: ctx => {
|
|
21
|
+
ctx.resetTransform();
|
|
22
|
+
ctx.clearRect(0, 0, canvasSize, canvasSize);
|
|
23
23
|
renderBoxFeatureCanvasBlock({
|
|
24
24
|
ctx,
|
|
25
25
|
offsetX,
|
|
26
26
|
offsetY,
|
|
27
27
|
model,
|
|
28
28
|
});
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
}
|
|
38
|
-
|
|
29
|
+
renderMSABlock({
|
|
30
|
+
ctx,
|
|
31
|
+
theme,
|
|
32
|
+
offsetX,
|
|
33
|
+
offsetY,
|
|
34
|
+
contrastScheme,
|
|
35
|
+
model,
|
|
36
|
+
});
|
|
37
|
+
},
|
|
38
|
+
width: canvasSize,
|
|
39
|
+
height: canvasSize,
|
|
40
|
+
deps: [model, offsetX, offsetY, theme, contrastScheme],
|
|
41
|
+
});
|
|
39
42
|
const { hoveredInsertion, mouseOverDomains, showColumnStats } = model;
|
|
40
43
|
return (React.createElement(React.Fragment, null,
|
|
41
44
|
React.createElement("canvas", { ref: ref, onMouseMove: event => {
|
|
@@ -48,7 +51,7 @@ const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
|
|
|
48
51
|
}
|
|
49
52
|
}, onMouseLeave: () => {
|
|
50
53
|
onMouseLeave();
|
|
51
|
-
}, width:
|
|
54
|
+
}, width: canvasSize, height: canvasSize, style: {
|
|
52
55
|
position: 'absolute',
|
|
53
56
|
top: scrollY + offsetY,
|
|
54
57
|
left: scrollX + offsetX,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSACanvasBlock.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvasBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,WAAW,MAAM,kBAAmB,CAAA;AAC3C,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAA;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAIxD,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EACxC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IAC9E,MAAM,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAA;IAC/D,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,gBAAgB,CAC3E;QACE,KAAK;QACL,OAAO;QACP,OAAO;KACR,CACF,CAAA;IAED,MAAM,
|
|
1
|
+
{"version":3,"file":"MSACanvasBlock.js","sourceRoot":"","sources":["../../../src/components/msa/MSACanvasBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,WAAW,MAAM,kBAAmB,CAAA;AAC3C,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAA;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAIxD,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EACxC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IAC9E,MAAM,EAAE,KAAK,EAAE,cAAc,EAAE,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAA;IAC/D,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,gBAAgB,CAC3E;QACE,KAAK;QACL,OAAO;QACP,OAAO;KACR,CACF,CAAA;IAED,MAAM,UAAU,GAAG,SAAS,GAAG,kBAAkB,CAAA;IACjD,MAAM,GAAG,GAAG,gBAAgB,CAAC;QAC3B,IAAI,EAAE,GAAG,CAAC,EAAE;YACV,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,UAAU,EAAE,UAAU,CAAC,CAAA;YAC3C,2BAA2B,CAAC;gBAC1B,GAAG;gBACH,OAAO;gBACP,OAAO;gBACP,KAAK;aACN,CAAC,CAAA;YACF,cAAc,CAAC;gBACb,GAAG;gBACH,KAAK;gBACL,OAAO;gBACP,OAAO;gBACP,cAAc;gBACd,KAAK;aACN,CAAC,CAAA;QACJ,CAAC;QACD,KAAK,EAAE,UAAU;QACjB,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,cAAc,CAAC;KACvD,CAAC,CAAA;IAEF,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,eAAe,EAAE,GAAG,KAAK,CAAA;IAErE,OAAO,CACL;QACE,gCACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,KAAK,CAAC,EAAE;gBACnB,IAAI,GAAG,CAAC,OAAO,EAAE,CAAC;oBAChB,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;gBACjC,CAAC;YACH,CAAC,EACD,OAAO,EAAE,KAAK,CAAC,EAAE;gBACf,IAAI,GAAG,CAAC,OAAO,EAAE,CAAC;oBAChB,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;gBAC7B,CAAC;YACH,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;gBACjB,YAAY,EAAE,CAAA;YAChB,CAAC,EACD,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,UAAU,EAClB,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,OAAO,GAAG,OAAO;gBACtB,IAAI,EAAE,OAAO,GAAG,OAAO;gBACvB,KAAK,EAAE,SAAS;gBAChB,MAAM,EAAE,SAAS;aAClB,GACD;QACD,YAAY,CAAC,CAAC,CAAC,CACd,oBAAC,WAAW,IACV,WAAW,EAAE,EAAE,CAAC,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,YAAY,CAAC,CAAC,GAAG,EAAE,EAAE,IAEzD,gBAAgB,CAAC,CAAC,CAAC,CAClB;;YACc,gBAAgB,CAAC,OAAO,CAAC,MAAM;YAC1C,KAAK,CAAC,YAAY,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI;;YAAI,GAAG;YACnD,gBAAgB,CAAC,OAAO,CAAC,MAAM,GAAG,EAAE;gBACnC,CAAC,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK;gBAC/C,CAAC,CAAC,gBAAgB,CAAC,OAAO,CAC3B,CACJ,CAAC,CAAC,CAAC,CACF;YACG,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CACzB,6BAAK,GAAG,EAAE,GAAG,CAAC,CAAC,SAAS,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,EAAE;gBAC5C,+BAAI,CAAC,CAAC,IAAI,CAAK;;gBAAG,CAAC,CAAC,SAAS;;gBAAI,CAAC,CAAC,KAAK;;gBAAG,CAAC,CAAC,GAAG;gBAC/C,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CACf;oBACE,+BAAM;oBACL,CAAC,CAAC,WAAW,CACb,CACJ,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;YACD,eAAe,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI,CACtD,CACJ,CACW,CACf,CAAC,CAAC,CAAC,IAAI,CACP,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,cAAc,CAAA"}
|
|
@@ -4,14 +4,20 @@ import { observer } from 'mobx-react';
|
|
|
4
4
|
import { useCanvasAutorun } from '../../useCanvasAutorun.js';
|
|
5
5
|
import { renderMouseover } from './renderMSAMouseover.js';
|
|
6
6
|
const MSAMouseoverCanvas = observer(function ({ model, }) {
|
|
7
|
-
const { height,
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
7
|
+
const { height, msaCanvasWidth: width, highResScaleFactor } = model;
|
|
8
|
+
const canvasWidth = width * highResScaleFactor;
|
|
9
|
+
const canvasHeight = height * highResScaleFactor;
|
|
10
|
+
const ref = useCanvasAutorun({
|
|
11
|
+
draw: ctx => {
|
|
12
|
+
if (isAlive(model)) {
|
|
13
|
+
renderMouseover({ ctx, model });
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
width: canvasWidth,
|
|
17
|
+
height: canvasHeight,
|
|
18
|
+
deps: [model],
|
|
19
|
+
});
|
|
20
|
+
return (React.createElement("canvas", { ref: ref, id: "mouseover", width: canvasWidth, height: canvasHeight, style: {
|
|
15
21
|
position: 'absolute',
|
|
16
22
|
top: 0,
|
|
17
23
|
left: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIzD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,EAAE,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIzD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IACnE,MAAM,WAAW,GAAG,KAAK,GAAG,kBAAkB,CAAA;IAC9C,MAAM,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAA;IAChD,MAAM,GAAG,GAAG,gBAAgB,CAAC;QAC3B,IAAI,EAAE,GAAG,CAAC,EAAE;YACV,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;gBACnB,eAAe,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAA;YACjC,CAAC;QACH,CAAC;QACD,KAAK,EAAE,WAAW;QAClB,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE,CAAC,KAAK,CAAC;KACd,CAAC,CAAA;IAEF,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,YAAY,EACpB,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,KAAK;YACL,MAAM;YACN,MAAM,EAAE,IAAI;YACZ,aAAa,EAAE,MAAM;SACtB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAA"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import
|
|
3
|
+
import AnnotationLegend from './AnnotationLegend.js';
|
|
4
4
|
import MSACanvas from './MSACanvas.js';
|
|
5
5
|
import MSAMouseoverCanvas from './MSAMouseoverCanvas.js';
|
|
6
6
|
const MSAPanel = observer(function ({ model }) {
|
|
7
7
|
return (React.createElement("div", { style: { position: 'relative' } },
|
|
8
8
|
React.createElement(MSACanvas, { model: model }),
|
|
9
9
|
React.createElement(MSAMouseoverCanvas, { model: model }),
|
|
10
|
-
React.createElement(
|
|
10
|
+
React.createElement(AnnotationLegend, { model: model })));
|
|
11
11
|
});
|
|
12
12
|
export default MSAPanel;
|
|
13
13
|
//# sourceMappingURL=MSAPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,
|
|
1
|
+
{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,gBAAgB,MAAM,uBAAwB,CAAA;AACrD,OAAO,SAAS,MAAM,gBAAiB,CAAA;AACvC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AAKzD,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;QAClC,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI;QACpC,oBAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,GAAI,CAC9B,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { DomainBand } from '../../types.ts';
|
|
2
|
+
/**
|
|
3
|
+
* Left-to-right cursor over one row's domain bands, answering "which band is
|
|
4
|
+
* drawn on top at this column" — the fill a letter there has to contrast
|
|
5
|
+
* against.
|
|
6
|
+
*
|
|
7
|
+
* Not simply the first band covering the column. The overlay paints in
|
|
8
|
+
* `domainBands` order, largest first, so where signatures nest — a family
|
|
9
|
+
* enclosing a domain, which InterProScan emits routinely — the box a reader
|
|
10
|
+
* actually sees is the last one painted over that column. `stackIndex` is that
|
|
11
|
+
* paint order.
|
|
12
|
+
*
|
|
13
|
+
* `bands` must be sorted by start column (`domainBandsByStart`), and columns
|
|
14
|
+
* must be visited in increasing order, which is what the block renderer does.
|
|
15
|
+
* Both keep this to one pass over the bands per row rather than a scan per cell.
|
|
16
|
+
*/
|
|
17
|
+
export declare function domainBandCursor(bands: DomainBand[] | undefined): (col: number) => DomainBand | undefined;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Left-to-right cursor over one row's domain bands, answering "which band is
|
|
3
|
+
* drawn on top at this column" — the fill a letter there has to contrast
|
|
4
|
+
* against.
|
|
5
|
+
*
|
|
6
|
+
* Not simply the first band covering the column. The overlay paints in
|
|
7
|
+
* `domainBands` order, largest first, so where signatures nest — a family
|
|
8
|
+
* enclosing a domain, which InterProScan emits routinely — the box a reader
|
|
9
|
+
* actually sees is the last one painted over that column. `stackIndex` is that
|
|
10
|
+
* paint order.
|
|
11
|
+
*
|
|
12
|
+
* `bands` must be sorted by start column (`domainBandsByStart`), and columns
|
|
13
|
+
* must be visited in increasing order, which is what the block renderer does.
|
|
14
|
+
* Both keep this to one pass over the bands per row rather than a scan per cell.
|
|
15
|
+
*/
|
|
16
|
+
export function domainBandCursor(bands) {
|
|
17
|
+
let next = 0;
|
|
18
|
+
let active = [];
|
|
19
|
+
return (col) => {
|
|
20
|
+
if (!bands) {
|
|
21
|
+
return undefined;
|
|
22
|
+
}
|
|
23
|
+
while (next < bands.length && bands[next].startCol <= col) {
|
|
24
|
+
active.push(bands[next]);
|
|
25
|
+
next++;
|
|
26
|
+
}
|
|
27
|
+
if (active.some(band => band.endCol <= col)) {
|
|
28
|
+
active = active.filter(band => band.endCol > col);
|
|
29
|
+
}
|
|
30
|
+
let top;
|
|
31
|
+
for (const band of active) {
|
|
32
|
+
if (!top || band.stackIndex > top.stackIndex) {
|
|
33
|
+
top = band;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return top;
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
//# sourceMappingURL=domainBandCursor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"domainBandCursor.js","sourceRoot":"","sources":["../../../src/components/msa/domainBandCursor.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAA+B;IAC9D,IAAI,IAAI,GAAG,CAAC,CAAA;IACZ,IAAI,MAAM,GAAiB,EAAE,CAAA;IAE7B,OAAO,CAAC,GAAW,EAAE,EAAE;QACrB,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,OAAO,SAAS,CAAA;QAClB,CAAC;QACD,OAAO,IAAI,GAAG,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,IAAI,CAAE,CAAC,QAAQ,IAAI,GAAG,EAAE,CAAC;YAC3D,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAE,CAAC,CAAA;YACzB,IAAI,EAAE,CAAA;QACR,CAAC;QACD,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,CAAC;YAC5C,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,CAAA;QACnD,CAAC;QACD,IAAI,GAA2B,CAAA;QAC/B,KAAK,MAAM,IAAI,IAAI,MAAM,EAAE,CAAC;YAC1B,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,UAAU,EAAE,CAAC;gBAC7C,GAAG,GAAG,IAAI,CAAA;YACZ,CAAC;QACH,CAAC;QACD,OAAO,GAAG,CAAA;IACZ,CAAC,CAAA;AACH,CAAC"}
|