@jbrowse/plugin-dotplot-view 3.7.0 → 4.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.
Files changed (224) hide show
  1. package/esm/ComparativeRenderer/index.d.ts +10 -10
  2. package/esm/ComparativeRenderer/index.js +4 -17
  3. package/esm/DiagonalizeDotplotRpc.js +9 -12
  4. package/esm/DotplotDisplay/components/DotplotDisplay.d.ts +1 -1
  5. package/esm/DotplotDisplay/index.d.ts +3 -3
  6. package/esm/DotplotDisplay/index.js +4 -4
  7. package/esm/DotplotDisplay/renderDotplotBlock.d.ts +2 -1
  8. package/esm/DotplotDisplay/renderDotplotBlock.js +6 -4
  9. package/esm/DotplotDisplay/stateModelFactory.d.ts +143 -30
  10. package/esm/DotplotDisplay/stateModelFactory.js +5 -14
  11. package/esm/DotplotReadVsRef/DotplotReadVsRef.js +5 -6
  12. package/esm/DotplotReadVsRef/index.js +1 -1
  13. package/esm/DotplotRenderer/DotplotRenderer.d.ts +30 -39
  14. package/esm/DotplotRenderer/DotplotRenderer.js +55 -22
  15. package/esm/DotplotRenderer/components/DotplotRendering.d.ts +1 -1
  16. package/esm/DotplotRenderer/components/DotplotRendering.js +1 -1
  17. package/esm/DotplotRenderer/configSchema.d.ts +3 -3
  18. package/esm/DotplotRenderer/configSchema.js +1 -1
  19. package/esm/DotplotRenderer/drawDotplot.d.ts +3 -3
  20. package/esm/DotplotRenderer/drawDotplot.js +5 -6
  21. package/esm/DotplotRenderer/index.js +4 -4
  22. package/esm/DotplotView/1dview.d.ts +25 -25
  23. package/esm/DotplotView/1dview.js +13 -3
  24. package/esm/DotplotView/components/Axes.d.ts +1 -1
  25. package/esm/DotplotView/components/Axes.js +31 -41
  26. package/esm/DotplotView/components/ColorBySelector.d.ts +1 -1
  27. package/esm/DotplotView/components/ColorBySelector.js +3 -4
  28. package/esm/DotplotView/components/DiagonalizationProgressDialog.d.ts +1 -1
  29. package/esm/DotplotView/components/DiagonalizationProgressDialog.js +1 -1
  30. package/esm/DotplotView/components/DotplotControls.d.ts +1 -1
  31. package/esm/DotplotView/components/DotplotControls.js +7 -8
  32. package/esm/DotplotView/components/DotplotGrid.d.ts +6 -0
  33. package/esm/DotplotView/components/{Grid.js → DotplotGrid.js} +19 -20
  34. package/esm/DotplotView/components/DotplotGridWrapper.d.ts +6 -0
  35. package/esm/DotplotView/components/DotplotGridWrapper.js +8 -0
  36. package/esm/DotplotView/components/DotplotTooltipClick.d.ts +2 -2
  37. package/esm/DotplotView/components/DotplotTooltipClick.js +4 -4
  38. package/esm/DotplotView/components/DotplotTooltipMouseover.d.ts +1 -1
  39. package/esm/DotplotView/components/DotplotTooltipMouseover.js +2 -2
  40. package/esm/DotplotView/components/DotplotTooltips.d.ts +1 -1
  41. package/esm/DotplotView/components/DotplotTooltips.js +2 -2
  42. package/esm/DotplotView/components/DotplotView.d.ts +2 -2
  43. package/esm/DotplotView/components/DotplotView.js +23 -21
  44. package/esm/DotplotView/components/DotplotWarnings.d.ts +1 -1
  45. package/esm/DotplotView/components/DotplotWarnings.js +3 -3
  46. package/esm/DotplotView/components/ExportSvgDialog.d.ts +1 -1
  47. package/esm/DotplotView/components/Header.d.ts +1 -1
  48. package/esm/DotplotView/components/Header.js +5 -5
  49. package/esm/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.d.ts +1 -1
  50. package/esm/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.js +6 -5
  51. package/esm/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.d.ts +1 -1
  52. package/esm/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.js +2 -3
  53. package/esm/DotplotView/components/ImportForm/TrackSelector.d.ts +10 -1
  54. package/esm/DotplotView/components/ImportForm/TrackSelector.js +8 -4
  55. package/esm/DotplotView/components/ImportForm/index.d.ts +1 -1
  56. package/esm/DotplotView/components/ImportForm/index.js +4 -9
  57. package/esm/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.d.ts +1 -1
  58. package/esm/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.js +2 -2
  59. package/esm/DotplotView/components/ImportForm/selectors/PifGzSelector.d.ts +1 -1
  60. package/esm/DotplotView/components/ImportForm/selectors/PifGzSelector.js +2 -2
  61. package/esm/DotplotView/components/ImportForm/selectors/SwapAssemblies.js +3 -3
  62. package/esm/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.d.ts +1 -1
  63. package/esm/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.js +3 -3
  64. package/esm/DotplotView/components/ImportForm/selectors/index.d.ts +3 -3
  65. package/esm/DotplotView/components/ImportForm/selectors/index.js +3 -3
  66. package/esm/DotplotView/components/MinLengthSlider.d.ts +1 -1
  67. package/esm/DotplotView/components/MinLengthSlider.js +7 -7
  68. package/esm/DotplotView/components/MouseInteractionLayer.d.ts +3 -3
  69. package/esm/DotplotView/components/MouseInteractionLayer.js +6 -4
  70. package/esm/DotplotView/components/OpacitySlider.d.ts +1 -1
  71. package/esm/DotplotView/components/OpacitySlider.js +5 -6
  72. package/esm/DotplotView/components/PanButtons.d.ts +1 -1
  73. package/esm/DotplotView/components/PanButtons.js +1 -1
  74. package/esm/DotplotView/components/SelectionContextMenu.d.ts +1 -1
  75. package/esm/DotplotView/components/WarningDialog.js +1 -1
  76. package/esm/DotplotView/components/util.d.ts +1 -1
  77. package/esm/DotplotView/components/util.js +17 -5
  78. package/esm/DotplotView/index.js +2 -2
  79. package/esm/DotplotView/model.d.ts +208 -90
  80. package/esm/DotplotView/model.js +118 -79
  81. package/esm/DotplotView/svgcomponents/SVGDotplotView.d.ts +1 -1
  82. package/esm/DotplotView/svgcomponents/SVGDotplotView.js +5 -6
  83. package/esm/DotplotView/types.d.ts +7 -1
  84. package/esm/LaunchDotplotView.js +6 -36
  85. package/esm/ServerSideRenderedBlockContent.js +2 -6
  86. package/esm/ServerSideSyntenyRendering.d.ts +1 -1
  87. package/esm/ServerSideSyntenyRendering.js +1 -1
  88. package/esm/index.d.ts +1 -0
  89. package/esm/index.js +8 -11
  90. package/esm/util.d.ts +1 -1
  91. package/package.json +28 -35
  92. package/dist/ComparativeRenderer/index.d.ts +0 -22
  93. package/dist/ComparativeRenderer/index.js +0 -53
  94. package/dist/DiagonalizeDotplotRpc.d.ts +0 -30
  95. package/dist/DiagonalizeDotplotRpc.js +0 -156
  96. package/dist/DotplotDisplay/components/DotplotDisplay.d.ts +0 -6
  97. package/dist/DotplotDisplay/components/DotplotDisplay.js +0 -18
  98. package/dist/DotplotDisplay/index.d.ts +0 -5
  99. package/dist/DotplotDisplay/index.js +0 -36
  100. package/dist/DotplotDisplay/renderDotplotBlock.d.ts +0 -11
  101. package/dist/DotplotDisplay/renderDotplotBlock.js +0 -52
  102. package/dist/DotplotDisplay/stateModelFactory.d.ts +0 -108
  103. package/dist/DotplotDisplay/stateModelFactory.js +0 -134
  104. package/dist/DotplotReadVsRef/DotplotReadVsRef.d.ts +0 -3
  105. package/dist/DotplotReadVsRef/DotplotReadVsRef.js +0 -100
  106. package/dist/DotplotReadVsRef/index.d.ts +0 -2
  107. package/dist/DotplotReadVsRef/index.js +0 -41
  108. package/dist/DotplotRenderer/ComparativeRenderRpc.d.ts +0 -22
  109. package/dist/DotplotRenderer/ComparativeRenderRpc.js +0 -53
  110. package/dist/DotplotRenderer/DotplotRenderer.d.ts +0 -65
  111. package/dist/DotplotRenderer/DotplotRenderer.js +0 -102
  112. package/dist/DotplotRenderer/clamp.d.ts +0 -7
  113. package/dist/DotplotRenderer/clamp.js +0 -62
  114. package/dist/DotplotRenderer/components/DotplotRendering.d.ts +0 -3
  115. package/dist/DotplotRenderer/components/DotplotRendering.js +0 -9
  116. package/dist/DotplotRenderer/configSchema.d.ts +0 -40
  117. package/dist/DotplotRenderer/configSchema.js +0 -57
  118. package/dist/DotplotRenderer/drawDotplot.d.ts +0 -22
  119. package/dist/DotplotRenderer/drawDotplot.js +0 -209
  120. package/dist/DotplotRenderer/index.d.ts +0 -2
  121. package/dist/DotplotRenderer/index.js +0 -17
  122. package/dist/DotplotView/1dview.d.ts +0 -199
  123. package/dist/DotplotView/1dview.js +0 -65
  124. package/dist/DotplotView/components/Axes.d.ts +0 -13
  125. package/dist/DotplotView/components/Axes.js +0 -107
  126. package/dist/DotplotView/components/ColorBySelector.d.ts +0 -5
  127. package/dist/DotplotView/components/ColorBySelector.js +0 -79
  128. package/dist/DotplotView/components/CursorIcon.d.ts +0 -3
  129. package/dist/DotplotView/components/CursorIcon.js +0 -15
  130. package/dist/DotplotView/components/DiagonalizationProgressDialog.d.ts +0 -6
  131. package/dist/DotplotView/components/DiagonalizationProgressDialog.js +0 -125
  132. package/dist/DotplotView/components/DotplotControls.d.ts +0 -5
  133. package/dist/DotplotView/components/DotplotControls.js +0 -187
  134. package/dist/DotplotView/components/DotplotTooltipClick.d.ts +0 -10
  135. package/dist/DotplotView/components/DotplotTooltipClick.js +0 -17
  136. package/dist/DotplotView/components/DotplotTooltipMouseover.d.ts +0 -9
  137. package/dist/DotplotView/components/DotplotTooltipMouseover.js +0 -16
  138. package/dist/DotplotView/components/DotplotTooltips.d.ts +0 -15
  139. package/dist/DotplotView/components/DotplotTooltips.js +0 -43
  140. package/dist/DotplotView/components/DotplotView.d.ts +0 -5
  141. package/dist/DotplotView/components/DotplotView.js +0 -100
  142. package/dist/DotplotView/components/DotplotWarnings.d.ts +0 -5
  143. package/dist/DotplotView/components/DotplotWarnings.js +0 -53
  144. package/dist/DotplotView/components/ExportSvgDialog.d.ts +0 -7
  145. package/dist/DotplotView/components/ExportSvgDialog.js +0 -53
  146. package/dist/DotplotView/components/Grid.d.ts +0 -9
  147. package/dist/DotplotView/components/Grid.js +0 -47
  148. package/dist/DotplotView/components/Header.d.ts +0 -9
  149. package/dist/DotplotView/components/Header.js +0 -33
  150. package/dist/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.d.ts +0 -7
  151. package/dist/DotplotView/components/ImportForm/ImportSyntenyOpenCustomTrack.js +0 -78
  152. package/dist/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.d.ts +0 -7
  153. package/dist/DotplotView/components/ImportForm/ImportSyntenyTrackSelector.js +0 -42
  154. package/dist/DotplotView/components/ImportForm/TrackSelector.d.ts +0 -7
  155. package/dist/DotplotView/components/ImportForm/TrackSelector.js +0 -23
  156. package/dist/DotplotView/components/ImportForm/getAdapter.d.ts +0 -117
  157. package/dist/DotplotView/components/ImportForm/getAdapter.js +0 -68
  158. package/dist/DotplotView/components/ImportForm/index.d.ts +0 -5
  159. package/dist/DotplotView/components/ImportForm/index.js +0 -75
  160. package/dist/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.d.ts +0 -3
  161. package/dist/DotplotView/components/ImportForm/selectors/AnchorsFileSelector.js +0 -23
  162. package/dist/DotplotView/components/ImportForm/selectors/PifGzSelector.d.ts +0 -3
  163. package/dist/DotplotView/components/ImportForm/selectors/PifGzSelector.js +0 -13
  164. package/dist/DotplotView/components/ImportForm/selectors/SelectorTypes.d.ts +0 -23
  165. package/dist/DotplotView/components/ImportForm/selectors/SelectorTypes.js +0 -10
  166. package/dist/DotplotView/components/ImportForm/selectors/SwapAssemblies.d.ts +0 -13
  167. package/dist/DotplotView/components/ImportForm/selectors/SwapAssemblies.js +0 -32
  168. package/dist/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.d.ts +0 -3
  169. package/dist/DotplotView/components/ImportForm/selectors/SyntenyFileSelector.js +0 -24
  170. package/dist/DotplotView/components/ImportForm/selectors/index.d.ts +0 -3
  171. package/dist/DotplotView/components/ImportForm/selectors/index.js +0 -12
  172. package/dist/DotplotView/components/ImportForm/util.d.ts +0 -10
  173. package/dist/DotplotView/components/ImportForm/util.js +0 -24
  174. package/dist/DotplotView/components/MinLengthSlider.d.ts +0 -5
  175. package/dist/DotplotView/components/MinLengthSlider.js +0 -44
  176. package/dist/DotplotView/components/MouseInteractionLayer.d.ts +0 -17
  177. package/dist/DotplotView/components/MouseInteractionLayer.js +0 -18
  178. package/dist/DotplotView/components/OpacitySlider.d.ts +0 -5
  179. package/dist/DotplotView/components/OpacitySlider.js +0 -43
  180. package/dist/DotplotView/components/PanButtons.d.ts +0 -5
  181. package/dist/DotplotView/components/PanButtons.js +0 -47
  182. package/dist/DotplotView/components/SelectionContextMenu.d.ts +0 -13
  183. package/dist/DotplotView/components/SelectionContextMenu.js +0 -42
  184. package/dist/DotplotView/components/SliderTooltip.d.ts +0 -2
  185. package/dist/DotplotView/components/SliderTooltip.js +0 -9
  186. package/dist/DotplotView/components/WarningDialog.d.ts +0 -16
  187. package/dist/DotplotView/components/WarningDialog.js +0 -39
  188. package/dist/DotplotView/components/hooks/useCtrlKeyTracking.d.ts +0 -1
  189. package/dist/DotplotView/components/hooks/useCtrlKeyTracking.js +0 -24
  190. package/dist/DotplotView/components/hooks/useCursorMode.d.ts +0 -7
  191. package/dist/DotplotView/components/hooks/useCursorMode.js +0 -19
  192. package/dist/DotplotView/components/hooks/useMouseCoordinates.d.ts +0 -29
  193. package/dist/DotplotView/components/hooks/useMouseCoordinates.js +0 -52
  194. package/dist/DotplotView/components/hooks/useMouseMoveHandler.d.ts +0 -6
  195. package/dist/DotplotView/components/hooks/useMouseMoveHandler.js +0 -27
  196. package/dist/DotplotView/components/hooks/useMouseUpHandler.d.ts +0 -3
  197. package/dist/DotplotView/components/hooks/useMouseUpHandler.js +0 -31
  198. package/dist/DotplotView/components/hooks/useWheelHandler.d.ts +0 -8
  199. package/dist/DotplotView/components/hooks/useWheelHandler.js +0 -47
  200. package/dist/DotplotView/components/util.d.ts +0 -14
  201. package/dist/DotplotView/components/util.js +0 -80
  202. package/dist/DotplotView/index.d.ts +0 -2
  203. package/dist/DotplotView/index.js +0 -52
  204. package/dist/DotplotView/model.d.ts +0 -440
  205. package/dist/DotplotView/model.js +0 -502
  206. package/dist/DotplotView/svgcomponents/SVGBackground.d.ts +0 -4
  207. package/dist/DotplotView/svgcomponents/SVGBackground.js +0 -10
  208. package/dist/DotplotView/svgcomponents/SVGDotplotView.d.ts +0 -2
  209. package/dist/DotplotView/svgcomponents/SVGDotplotView.js +0 -30
  210. package/dist/DotplotView/types.d.ts +0 -12
  211. package/dist/DotplotView/types.js +0 -2
  212. package/dist/LaunchDotplotView.d.ts +0 -2
  213. package/dist/LaunchDotplotView.js +0 -43
  214. package/dist/ServerSideRenderedBlockContent.d.ts +0 -12
  215. package/dist/ServerSideRenderedBlockContent.js +0 -48
  216. package/dist/ServerSideSyntenyRendering.d.ts +0 -13
  217. package/dist/ServerSideSyntenyRendering.js +0 -23
  218. package/dist/index.d.ts +0 -7
  219. package/dist/index.js +0 -42
  220. package/dist/util.d.ts +0 -9
  221. package/dist/util.js +0 -7
  222. package/esm/DotplotRenderer/ComparativeRenderRpc.d.ts +0 -22
  223. package/esm/DotplotRenderer/ComparativeRenderRpc.js +0 -47
  224. package/esm/DotplotView/components/Grid.d.ts +0 -9
@@ -1,79 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const jsx_runtime_1 = require("react/jsx-runtime");
7
- const CascadingMenuButton_1 = __importDefault(require("@jbrowse/core/ui/CascadingMenuButton"));
8
- const Palette_1 = __importDefault(require("@mui/icons-material/Palette"));
9
- const mobx_react_1 = require("mobx-react");
10
- const ColorBySelector = (0, mobx_react_1.observer)(function ({ model, }) {
11
- var _a, _b;
12
- const firstDisplay = (_a = model.tracks[0]) === null || _a === void 0 ? void 0 : _a.displays[0];
13
- const colorBy = (_b = firstDisplay === null || firstDisplay === void 0 ? void 0 : firstDisplay.colorBy) !== null && _b !== void 0 ? _b : 'default';
14
- const setColorBy = (value) => {
15
- for (const track of model.tracks) {
16
- for (const display of track.displays) {
17
- ;
18
- display.setColorBy(value);
19
- }
20
- }
21
- };
22
- return ((0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
23
- {
24
- label: 'Default',
25
- type: 'radio',
26
- checked: colorBy === 'default',
27
- onClick: () => {
28
- setColorBy('default');
29
- },
30
- helpText: 'Use the default color scheme specified in the track configuration. This respects the color settings defined in the config file.',
31
- },
32
- {
33
- label: 'Identity',
34
- type: 'radio',
35
- checked: colorBy === 'identity',
36
- onClick: () => {
37
- setColorBy('identity');
38
- },
39
- helpText: 'Color alignments by sequence identity percentage. Higher identity matches appear in warmer colors, while lower identity matches appear cooler. Useful for identifying highly conserved vs. divergent regions.',
40
- },
41
- {
42
- label: 'Mean Query Identity',
43
- type: 'radio',
44
- checked: colorBy === 'meanQueryIdentity',
45
- onClick: () => {
46
- setColorBy('meanQueryIdentity');
47
- },
48
- helpText: 'Color alignments based on the mean identity across the query sequence. This provides a smoothed view of overall alignment quality, reducing noise from local variations. For instance, a single long query of e.g. a contig of an assembly, when aligned to the target, may get split into many smaller "hits". This score aggregates across them, and colors them all the same. Similar code exists in the program dotPlotly',
49
- },
50
- {
51
- label: 'Mapping Quality',
52
- type: 'radio',
53
- checked: colorBy === 'mappingQuality',
54
- onClick: () => {
55
- setColorBy('mappingQuality');
56
- },
57
- helpText: 'Color alignments by mapping quality score (MAPQ). Higher quality mappings (more unique/confident) appear in darker colors. Useful for identifying ambiguous or multi-mapping regions.',
58
- },
59
- {
60
- label: 'Strand',
61
- type: 'radio',
62
- checked: colorBy === 'strand',
63
- onClick: () => {
64
- setColorBy('strand');
65
- },
66
- helpText: 'Color alignments by strand orientation. Forward strand alignments and reverse strand alignments are shown in different colors, making it easy to identify inversions and strand-specific patterns.',
67
- },
68
- {
69
- label: 'Query',
70
- type: 'radio',
71
- checked: colorBy === 'query',
72
- onClick: () => {
73
- setColorBy('query');
74
- },
75
- helpText: 'Color alignments by query sequence name. Each unique query sequence is assigned a consistent color based on its name, making it easy to visually distinguish between different sequences.',
76
- },
77
- ], children: (0, jsx_runtime_1.jsx)(Palette_1.default, {}) }));
78
- });
79
- exports.default = ColorBySelector;
@@ -1,3 +0,0 @@
1
- import type { SvgIconProps } from '@mui/material/SvgIcon';
2
- export declare function CursorMove(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
3
- export declare function CursorMouse(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
@@ -1,15 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.CursorMove = CursorMove;
7
- exports.CursorMouse = CursorMouse;
8
- const jsx_runtime_1 = require("react/jsx-runtime");
9
- const SvgIcon_1 = __importDefault(require("@mui/material/SvgIcon"));
10
- function CursorMove(props) {
11
- return ((0, jsx_runtime_1.jsx)(SvgIcon_1.default, { ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M13,6V11H18V7.75L22.25,12L18,16.25V13H13V18H16.25L12,22.25L7.75,18H11V13H6V16.25L1.75,12L6,7.75V11H11V6H7.75L12,1.75L16.25,6H13Z" }) }));
12
- }
13
- function CursorMouse(props) {
14
- return ((0, jsx_runtime_1.jsx)(SvgIcon_1.default, { ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M10.07,14.27C10.57,14.03 11.16,14.25 11.4,14.75L13.7,19.74L15.5,18.89L13.19,13.91C12.95,13.41 13.17,12.81 13.67,12.58L13.95,12.5L16.25,12.05L8,5.12V15.9L9.82,14.43L10.07,14.27M13.64,21.97C13.14,22.21 12.54,22 12.31,21.5L10.13,16.76L7.62,18.78C7.45,18.92 7.24,19 7,19A1,1 0 0,1 6,18V3A1,1 0 0,1 7,2C7.24,2 7.47,2.09 7.64,2.23L7.65,2.22L19.14,11.86C19.57,12.22 19.62,12.85 19.27,13.27C19.12,13.45 18.91,13.57 18.7,13.61L15.54,14.23L17.74,18.96C18,19.46 17.76,20.05 17.26,20.28L13.64,21.97Z" }) }));
15
- }
@@ -1,6 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- declare const DiagonalizationProgressDialog: ({ handleClose, model, }: {
3
- handleClose: () => void;
4
- model: Pick<DotplotViewModel, "tracks" | "hview" | "vview" | "id" | "type" | "displayName">;
5
- }) => import("react/jsx-runtime").JSX.Element;
6
- export default DiagonalizationProgressDialog;
@@ -1,125 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- const jsx_runtime_1 = require("react/jsx-runtime");
4
- const react_1 = require("react");
5
- const ui_1 = require("@jbrowse/core/ui");
6
- const util_1 = require("@jbrowse/core/util");
7
- const stopToken_1 = require("@jbrowse/core/util/stopToken");
8
- const material_1 = require("@mui/material");
9
- const mobx_1 = require("mobx");
10
- const mobx_react_1 = require("mobx-react");
11
- async function runDiagonalization({ model, session, stopToken, setProgress, setMessage, }) {
12
- setProgress(0);
13
- setMessage('Preparing diagonalization...');
14
- const track = model.tracks[0];
15
- if (!track) {
16
- throw new Error('No tracks found');
17
- }
18
- const display = track.displays[0];
19
- if (!display) {
20
- throw new Error('No display found');
21
- }
22
- const result = (await session.rpcManager.call(model.id, 'DiagonalizeDotplot', {
23
- sessionId: `diagonalize-${Date.now()}`,
24
- view: {
25
- hview: model.hview,
26
- vview: model.vview,
27
- },
28
- adapterConfig: display.adapterConfig,
29
- stopToken,
30
- statusCallback: (msg) => {
31
- setMessage(msg);
32
- if (msg.includes('Initializing')) {
33
- setProgress(5);
34
- }
35
- else if (msg.includes('Getting renderer')) {
36
- setProgress(10);
37
- }
38
- else if (msg.includes('Fetching features')) {
39
- setProgress(20);
40
- }
41
- else if (msg.includes('Extracting')) {
42
- setProgress(30);
43
- }
44
- else if (msg.includes('Running diagonalization')) {
45
- setProgress(40);
46
- }
47
- else if (msg.includes('Grouping')) {
48
- setProgress(50);
49
- }
50
- else if (msg.includes('Determining')) {
51
- setProgress(65);
52
- }
53
- else if (msg.includes('Sorting')) {
54
- setProgress(80);
55
- }
56
- else if (msg.includes('Building')) {
57
- setProgress(90);
58
- }
59
- else if (msg.includes('complete')) {
60
- setProgress(100);
61
- }
62
- },
63
- }));
64
- setMessage('Applying new layout...');
65
- setProgress(95);
66
- if (result.newRegions.length > 0) {
67
- (0, mobx_1.transaction)(() => {
68
- model.vview.setDisplayedRegions(result.newRegions);
69
- });
70
- setProgress(100);
71
- setMessage(`Diagonalization complete! Reordered ${result.stats.regionsReordered} regions, reversed ${result.stats.regionsReversed}`);
72
- return result;
73
- }
74
- else {
75
- throw new Error('No regions to reorder');
76
- }
77
- }
78
- const DiagonalizationProgressDialog = (0, mobx_react_1.observer)(function ({ handleClose, model, }) {
79
- const [progress, setProgress] = (0, react_1.useState)(0);
80
- const [message, setMessage] = (0, react_1.useState)('Ready to start diagonalization');
81
- const [error, setError] = (0, react_1.useState)();
82
- const [isRunning, setIsRunning] = (0, react_1.useState)(false);
83
- const [stopToken, setStopToken] = (0, react_1.useState)();
84
- const handleStart = async () => {
85
- const session = (0, util_1.getSession)(model);
86
- const token = (0, stopToken_1.createStopToken)();
87
- setStopToken(token);
88
- try {
89
- setIsRunning(true);
90
- await runDiagonalization({
91
- model,
92
- session,
93
- stopToken: token,
94
- setProgress,
95
- setMessage,
96
- });
97
- setTimeout(() => {
98
- handleClose();
99
- }, 2000);
100
- }
101
- catch (err) {
102
- console.error(err);
103
- setError(err);
104
- }
105
- finally {
106
- setIsRunning(false);
107
- }
108
- };
109
- const handleCancel = () => {
110
- if (stopToken) {
111
- (0, stopToken_1.stopStopToken)(stopToken);
112
- setStopToken(undefined);
113
- }
114
- handleClose();
115
- };
116
- const handleDialogClose = () => {
117
- if (!isRunning) {
118
- handleClose();
119
- }
120
- };
121
- return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { open: true, title: "Diagonalize Dotplot", onClose: handleDialogClose, maxWidth: "lg", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { style: { minWidth: 400 }, children: [message ? (0, jsx_runtime_1.jsx)(material_1.Typography, { children: message }) : null, error ? (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error }) : null, isRunning ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.LinearProgress, { variant: "determinate", value: progress, style: { marginTop: 16 }, color: error ? 'error' : 'primary' }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "caption", color: "textSecondary", style: { marginTop: 8, display: 'block' }, children: [Math.round(progress), "% complete"] })] })) : null] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [!isRunning ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleClose, color: "secondary", variant: "contained", children: "Cancel" }), (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
122
- handleStart();
123
- }, color: "primary", variant: "contained", children: "Start" })] })) : null, isRunning ? ((0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleCancel, color: "secondary", variant: "contained", children: "Cancel" })) : null] })] }));
124
- });
125
- exports.default = DiagonalizationProgressDialog;
@@ -1,5 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- declare const DotplotControls: ({ model, }: {
3
- model: DotplotViewModel;
4
- }) => import("react/jsx-runtime").JSX.Element;
5
- export default DotplotControls;
@@ -1,187 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- var __importDefault = (this && this.__importDefault) || function (mod) {
36
- return (mod && mod.__esModule) ? mod : { "default": mod };
37
- };
38
- Object.defineProperty(exports, "__esModule", { value: true });
39
- const jsx_runtime_1 = require("react/jsx-runtime");
40
- const react_1 = require("react");
41
- const CascadingMenuButton_1 = __importDefault(require("@jbrowse/core/ui/CascadingMenuButton"));
42
- const Icons_1 = require("@jbrowse/core/ui/Icons");
43
- const util_1 = require("@jbrowse/core/util");
44
- const MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
45
- const Shuffle_1 = __importDefault(require("@mui/icons-material/Shuffle"));
46
- const ZoomIn_1 = __importDefault(require("@mui/icons-material/ZoomIn"));
47
- const ZoomOut_1 = __importDefault(require("@mui/icons-material/ZoomOut"));
48
- const material_1 = require("@mui/material");
49
- const mobx_react_1 = require("mobx-react");
50
- const ColorBySelector_1 = __importDefault(require("./ColorBySelector"));
51
- const CursorIcon_1 = require("./CursorIcon");
52
- const MinLengthSlider_1 = __importDefault(require("./MinLengthSlider"));
53
- const OpacitySlider_1 = __importDefault(require("./OpacitySlider"));
54
- const DiagonalizationProgressDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./DiagonalizationProgressDialog'))));
55
- const DotplotControls = (0, mobx_react_1.observer)(function ({ model, }) {
56
- var _a;
57
- const [showDynamicControls, setShowDynamicControls] = (0, react_1.useState)(true);
58
- const hasDisplays = (_a = model.tracks[0]) === null || _a === void 0 ? void 0 : _a.displays[0];
59
- return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', alignItems: 'center', gap: '4px' }, children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => {
60
- model.zoomOut();
61
- }, children: (0, jsx_runtime_1.jsx)(ZoomOut_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => {
62
- model.zoomIn();
63
- }, children: (0, jsx_runtime_1.jsx)(ZoomIn_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => model.activateTrackSelector(), title: "Open track selector", children: (0, jsx_runtime_1.jsx)(Icons_1.TrackSelector, {}) }), (0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
64
- {
65
- label: 'Square view - same bp per pixel',
66
- onClick: () => {
67
- model.squareView();
68
- },
69
- helpText: 'Makes both views use the same zoom level (bp per pixel), adjusting to the average of each. This ensures features are displayed at comparable scales for easier visual comparison.',
70
- },
71
- {
72
- label: 'Rectangular view - same total bp',
73
- onClick: () => {
74
- model.squareViewProportional();
75
- },
76
- helpText: 'Adjusts zoom levels proportionally so both views show the same total number of base pairs. This accounts for different view widths while maintaining the same total genomic span.',
77
- },
78
- {
79
- label: 'Show all regions',
80
- onClick: () => {
81
- model.showAllRegions();
82
- },
83
- helpText: 'Zooms out to display all genome assemblies in their entirety. Useful for getting a high-level overview or resetting the view after zooming into specific regions.',
84
- },
85
- {
86
- label: 'Re-order chromosomes',
87
- icon: Shuffle_1.default,
88
- onClick: () => {
89
- (0, util_1.getSession)(model).queueDialog(handleClose => [
90
- DiagonalizationProgressDialog,
91
- {
92
- handleClose,
93
- model,
94
- },
95
- ]);
96
- },
97
- helpText: 'Diagonalization algorithmically reorders and reorients chromosomes to minimize crossing synteny lines, creating a more diagonal pattern. This makes it easier to identify large-scale genomic rearrangements, inversions, and translocations. The process runs on the webworker for better performance.',
98
- },
99
- {
100
- type: 'checkbox',
101
- label: 'Draw CIGAR',
102
- checked: model.drawCigar,
103
- onClick: () => {
104
- model.setDrawCigar(!model.drawCigar);
105
- },
106
- helpText: 'Toggle detailed CIGAR string visualization showing matches, insertions, and deletions in alignments. Disable for a cleaner view that shows only broad syntenic blocks.',
107
- },
108
- {
109
- label: 'Show pan buttons',
110
- type: 'checkbox',
111
- checked: model.showPanButtons,
112
- onClick: () => {
113
- model.setShowPanButtons(!model.showPanButtons);
114
- },
115
- helpText: 'Show or hide directional pan buttons that allow you to navigate the dotplot view by clicking arrows. Useful for precise navigation without using mouse drag.',
116
- },
117
- {
118
- label: 'Show dynamic controls',
119
- type: 'checkbox',
120
- checked: showDynamicControls,
121
- onClick: () => {
122
- setShowDynamicControls(!showDynamicControls);
123
- },
124
- helpText: 'Toggle visibility of dynamic controls like opacity and minimum length sliders. These controls allow you to adjust dotplot visualization parameters in real-time.',
125
- },
126
- {
127
- label: 'Click and drag mode',
128
- helpText: 'Configure how clicking and dragging behaves in the dotplot view. Choose between panning and region selection as the default action.',
129
- subMenu: [
130
- {
131
- label: 'Pan by default',
132
- icon: CursorIcon_1.CursorMove,
133
- type: 'radio',
134
- checked: model.cursorMode === 'move',
135
- onClick: () => {
136
- model.setCursorMode('move');
137
- },
138
- helpText: 'Click and drag to pan the view. Hold Ctrl/Cmd while dragging to select a region for zooming or creating a linear synteny view.',
139
- },
140
- {
141
- label: 'Select region by default',
142
- icon: CursorIcon_1.CursorMouse,
143
- type: 'radio',
144
- checked: model.cursorMode === 'crosshair',
145
- onClick: () => {
146
- model.setCursorMode('crosshair');
147
- },
148
- helpText: 'Click and drag to select a region for zooming or creating a linear synteny view. Hold Ctrl/Cmd while dragging to pan the view instead.',
149
- },
150
- ],
151
- },
152
- {
153
- label: 'Wheel scroll mode',
154
- helpText: 'Configure how mouse wheel scrolling behaves in the dotplot view.',
155
- subMenu: [
156
- {
157
- label: 'Pan view',
158
- type: 'radio',
159
- checked: model.wheelMode === 'pan',
160
- onClick: () => {
161
- model.setWheelMode('pan');
162
- },
163
- helpText: 'Mouse wheel scrolling will pan the view up/down. Useful for navigating through the genome without changing zoom level.',
164
- },
165
- {
166
- label: 'Zoom view',
167
- type: 'radio',
168
- checked: model.wheelMode === 'zoom',
169
- onClick: () => {
170
- model.setWheelMode('zoom');
171
- },
172
- helpText: 'Mouse wheel scrolling will zoom in/out of the view. Provides quick zoom control for detailed inspection of regions.',
173
- },
174
- {
175
- label: 'Disable',
176
- type: 'radio',
177
- checked: model.wheelMode === 'none',
178
- onClick: () => {
179
- model.setWheelMode('none');
180
- },
181
- helpText: 'Mouse wheel scrolling will be disabled for the dotplot view. Use this to prevent accidental zoom or pan when scrolling the page.',
182
- },
183
- ],
184
- },
185
- ], children: (0, jsx_runtime_1.jsx)(MoreVert_1.default, {}) }), (0, jsx_runtime_1.jsx)(ColorBySelector_1.default, { model: model }), hasDisplays && showDynamicControls ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(OpacitySlider_1.default, { model: model }), (0, jsx_runtime_1.jsx)(MinLengthSlider_1.default, { model: model })] })) : null] }));
186
- });
187
- exports.default = DotplotControls;
@@ -1,10 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- type Coord = [number, number] | undefined;
3
- export declare const DotplotTooltipClick: ({ model, mousedown, mousedownClient, xdistance, ydistance, }: {
4
- model: DotplotViewModel;
5
- mousedown: Coord;
6
- mousedownClient: Coord;
7
- xdistance: number;
8
- ydistance: number;
9
- }) => import("react/jsx-runtime").JSX.Element | null;
10
- export default DotplotTooltipClick;
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.DotplotTooltipClick = void 0;
7
- const jsx_runtime_1 = require("react/jsx-runtime");
8
- const BaseTooltip_1 = __importDefault(require("@jbrowse/core/ui/BaseTooltip"));
9
- const mobx_react_1 = require("mobx-react");
10
- const util_1 = require("./util");
11
- exports.DotplotTooltipClick = (0, mobx_react_1.observer)(function ({ model, mousedown, mousedownClient, xdistance, ydistance, }) {
12
- const { hview, vview, viewHeight } = model;
13
- const x = ((mousedownClient === null || mousedownClient === void 0 ? void 0 : mousedownClient[0]) || 0) - (xdistance < 0 ? 0 : 0);
14
- const y = ((mousedownClient === null || mousedownClient === void 0 ? void 0 : mousedownClient[1]) || 0) - (ydistance < 0 ? 0 : 0);
15
- return mousedown && Math.abs(xdistance) > 3 && Math.abs(ydistance) > 3 ? ((0, jsx_runtime_1.jsxs)(BaseTooltip_1.default, { placement: xdistance < 0 ? 'right' : 'left', clientPoint: { x, y }, children: [`x - ${(0, util_1.locstr)(mousedown[0], hview)}`, (0, jsx_runtime_1.jsx)("br", {}), `y - ${(0, util_1.locstr)(viewHeight - mousedown[1], vview)}`, (0, jsx_runtime_1.jsx)("br", {})] })) : null;
16
- });
17
- exports.default = exports.DotplotTooltipClick;
@@ -1,9 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- type Coord = [number, number] | undefined;
3
- declare const DotplotTooltipMouseover: ({ model, mouserect, mouserectClient, xdistance, }: {
4
- model: DotplotViewModel;
5
- mouserect: Coord;
6
- mouserectClient: Coord;
7
- xdistance: number;
8
- }) => import("react/jsx-runtime").JSX.Element | null;
9
- export default DotplotTooltipMouseover;
@@ -1,16 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const jsx_runtime_1 = require("react/jsx-runtime");
7
- const BaseTooltip_1 = __importDefault(require("@jbrowse/core/ui/BaseTooltip"));
8
- const mobx_react_1 = require("mobx-react");
9
- const util_1 = require("./util");
10
- const DotplotTooltipMouseover = (0, mobx_react_1.observer)(function ({ model, mouserect, mouserectClient, xdistance, }) {
11
- const { hview, vview, viewHeight } = model;
12
- return mouserect ? ((0, jsx_runtime_1.jsxs)(BaseTooltip_1.default, { placement: xdistance < 0 ? 'left' : 'right', clientPoint: mouserectClient
13
- ? { x: mouserectClient[0], y: mouserectClient[1] }
14
- : undefined, children: [`x - ${(0, util_1.locstr)(mouserect[0], hview)}`, (0, jsx_runtime_1.jsx)("br", {}), `y - ${(0, util_1.locstr)(viewHeight - mouserect[1], vview)}`, (0, jsx_runtime_1.jsx)("br", {})] })) : null;
15
- });
16
- exports.default = DotplotTooltipMouseover;
@@ -1,15 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- type Coord = [number, number] | undefined;
3
- interface DotplotTooltipsProps {
4
- model: DotplotViewModel;
5
- mouseOvered: boolean;
6
- validSelect: boolean;
7
- mouserect: Coord;
8
- mouserectClient: Coord;
9
- xdistance: number;
10
- mousedown: Coord;
11
- mousedownClient: Coord;
12
- ydistance: number;
13
- }
14
- export default function DotplotTooltips({ model, mouseOvered, validSelect, mouserect, mouserectClient, xdistance, mousedown, mousedownClient, ydistance, }: DotplotTooltipsProps): import("react/jsx-runtime").JSX.Element;
15
- export {};
@@ -1,43 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.default = DotplotTooltips;
37
- const jsx_runtime_1 = require("react/jsx-runtime");
38
- const react_1 = require("react");
39
- const TooltipWhereClicked = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./DotplotTooltipClick'))));
40
- const TooltipWhereMouseovered = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./DotplotTooltipMouseover'))));
41
- function DotplotTooltips({ model, mouseOvered, validSelect, mouserect, mouserectClient, xdistance, mousedown, mousedownClient, ydistance, }) {
42
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [mouseOvered && validSelect ? ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(TooltipWhereMouseovered, { model: model, mouserect: mouserect, mouserectClient: mouserectClient, xdistance: xdistance }) })) : null, validSelect ? ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(TooltipWhereClicked, { model: model, mousedown: mousedown, mousedownClient: mousedownClient, xdistance: xdistance, ydistance: ydistance }) })) : null] }));
43
- }
@@ -1,5 +0,0 @@
1
- import type { DotplotViewModel } from '../model';
2
- declare const DotplotView: ({ model }: {
3
- model: DotplotViewModel;
4
- }) => import("react/jsx-runtime").JSX.Element;
5
- export default DotplotView;