@jbrowse/plugin-circular-view 2.18.0 → 3.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 (45) hide show
  1. package/dist/BaseChordDisplay/components/BaseChordDisplay.d.ts +1 -2
  2. package/dist/BaseChordDisplay/components/BaseChordDisplay.js +3 -3
  3. package/dist/BaseChordDisplay/components/DisplayError.d.ts +1 -2
  4. package/dist/BaseChordDisplay/components/DisplayError.js +2 -11
  5. package/dist/BaseChordDisplay/components/Loading.d.ts +1 -2
  6. package/dist/BaseChordDisplay/components/Loading.js +3 -32
  7. package/dist/BaseChordDisplay/model.d.ts +1 -2
  8. package/dist/BaseChordDisplay/model.js +2 -5
  9. package/dist/CircularView/components/CircularView.d.ts +1 -2
  10. package/dist/CircularView/components/CircularView.js +20 -28
  11. package/dist/CircularView/components/Controls.d.ts +1 -2
  12. package/dist/CircularView/components/Controls.js +22 -58
  13. package/dist/CircularView/components/ExportSvgDialog.d.ts +1 -2
  14. package/dist/CircularView/components/ExportSvgDialog.js +31 -64
  15. package/dist/CircularView/components/ImportForm.d.ts +1 -2
  16. package/dist/CircularView/components/ImportForm.js +9 -39
  17. package/dist/CircularView/components/Ruler.d.ts +1 -2
  18. package/dist/CircularView/components/Ruler.js +17 -30
  19. package/dist/CircularView/index.js +17 -7
  20. package/dist/CircularView/model.js +17 -7
  21. package/dist/CircularView/svgcomponents/SVGBackground.d.ts +1 -2
  22. package/dist/CircularView/svgcomponents/SVGBackground.js +2 -5
  23. package/dist/CircularView/svgcomponents/SVGCircularView.js +3 -10
  24. package/esm/BaseChordDisplay/components/BaseChordDisplay.d.ts +1 -2
  25. package/esm/BaseChordDisplay/components/BaseChordDisplay.js +3 -3
  26. package/esm/BaseChordDisplay/components/DisplayError.d.ts +1 -2
  27. package/esm/BaseChordDisplay/components/DisplayError.js +2 -8
  28. package/esm/BaseChordDisplay/components/Loading.d.ts +1 -2
  29. package/esm/BaseChordDisplay/components/Loading.js +3 -9
  30. package/esm/BaseChordDisplay/model.d.ts +1 -2
  31. package/esm/BaseChordDisplay/model.js +2 -2
  32. package/esm/CircularView/components/CircularView.d.ts +1 -2
  33. package/esm/CircularView/components/CircularView.js +20 -28
  34. package/esm/CircularView/components/Controls.d.ts +1 -2
  35. package/esm/CircularView/components/Controls.js +22 -35
  36. package/esm/CircularView/components/ExportSvgDialog.d.ts +1 -2
  37. package/esm/CircularView/components/ExportSvgDialog.js +31 -41
  38. package/esm/CircularView/components/ImportForm.d.ts +1 -2
  39. package/esm/CircularView/components/ImportForm.js +9 -16
  40. package/esm/CircularView/components/Ruler.d.ts +1 -2
  41. package/esm/CircularView/components/Ruler.js +17 -27
  42. package/esm/CircularView/svgcomponents/SVGBackground.d.ts +1 -2
  43. package/esm/CircularView/svgcomponents/SVGBackground.js +2 -2
  44. package/esm/CircularView/svgcomponents/SVGCircularView.js +3 -10
  45. package/package.json +2 -2
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  declare const BaseChordDisplay: ({ display, }: {
3
2
  display: {
4
3
  filled: boolean;
@@ -8,5 +7,5 @@ declare const BaseChordDisplay: ({ display, }: {
8
7
  radius: number;
9
8
  };
10
9
  };
11
- }) => React.JSX.Element;
10
+ }) => import("react/jsx-runtime").JSX.Element;
12
11
  export default BaseChordDisplay;
@@ -3,16 +3,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
7
  const mobx_react_1 = require("mobx-react");
8
8
  const DisplayError_1 = __importDefault(require("./DisplayError"));
9
9
  const Loading_1 = __importDefault(require("./Loading"));
10
10
  const BaseChordDisplay = (0, mobx_react_1.observer)(function ({ display, }) {
11
11
  if (display.error) {
12
- return react_1.default.createElement(DisplayError_1.default, { model: display });
12
+ return (0, jsx_runtime_1.jsx)(DisplayError_1.default, { model: display });
13
13
  }
14
14
  else if (!display.filled) {
15
- return react_1.default.createElement(Loading_1.default, { model: display });
15
+ return (0, jsx_runtime_1.jsx)(Loading_1.default, { model: display });
16
16
  }
17
17
  else {
18
18
  return display.reactElement;
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  declare const DisplayError: ({ model, }: {
3
2
  model: {
4
3
  renderProps: {
@@ -6,5 +5,5 @@ declare const DisplayError: ({ model, }: {
6
5
  };
7
6
  error: unknown;
8
7
  };
9
- }) => React.JSX.Element;
8
+ }) => import("react/jsx-runtime").JSX.Element;
10
9
  export default DisplayError;
@@ -1,18 +1,9 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
4
  const mobx_react_1 = require("mobx-react");
8
5
  const DisplayError = (0, mobx_react_1.observer)(function ({ model, }) {
9
6
  const { renderProps: { radius }, error, } = model;
10
- return (react_1.default.createElement("g", null,
11
- react_1.default.createElement("defs", null,
12
- react_1.default.createElement("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse" },
13
- react_1.default.createElement("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,0,0,0.5)', strokeWidth: 10 } }))),
14
- react_1.default.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "#ffb4b4" }),
15
- react_1.default.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }),
16
- react_1.default.createElement("text", { x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle" }, String(error))));
7
+ return ((0, jsx_runtime_1.jsxs)("g", { children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse", children: (0, jsx_runtime_1.jsx)("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,0,0,0.5)', strokeWidth: 10 } }) }) }), (0, jsx_runtime_1.jsx)("circle", { cx: "0", cy: "0", r: radius, fill: "#ffb4b4" }), (0, jsx_runtime_1.jsx)("circle", { cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }), (0, jsx_runtime_1.jsx)("text", { x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle", children: String(error) })] }));
17
8
  });
18
9
  exports.default = DisplayError;
@@ -1,9 +1,8 @@
1
- import React from 'react';
2
1
  declare const Loading: ({ model: { renderProps: { radius }, }, }: {
3
2
  model: {
4
3
  renderProps: {
5
4
  radius: number;
6
5
  };
7
6
  };
8
- }) => React.JSX.Element | null;
7
+ }) => import("react/jsx-runtime").JSX.Element | null;
9
8
  export default Loading;
@@ -1,29 +1,7 @@
1
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 (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  Object.defineProperty(exports, "__esModule", { value: true });
26
- const react_1 = __importStar(require("react"));
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
4
+ const react_1 = require("react");
27
5
  const mobx_react_1 = require("mobx-react");
28
6
  const mui_1 = require("tss-react/mui");
29
7
  const useStyles = (0, mui_1.makeStyles)()(theme => {
@@ -79,13 +57,6 @@ const Loading = (0, mobx_react_1.observer)(function ({ model: { renderProps: { r
79
57
  clearTimeout(timeout);
80
58
  };
81
59
  });
82
- return !shown ? null : (react_1.default.createElement("g", null,
83
- react_1.default.createElement("defs", null,
84
- react_1.default.createElement("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse" },
85
- react_1.default.createElement("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,255,255,0.5)', strokeWidth: 10 } }))),
86
- react_1.default.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "#f1f1f1" }),
87
- react_1.default.createElement("circle", { cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }),
88
- react_1.default.createElement("text", { x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle" }, "Loading\u2026"),
89
- react_1.default.createElement("circle", { className: classes.path, fill: "none", strokeWidth: "4", strokeLinecap: "round", cx: "0", cy: "0", r: "60" })));
60
+ return !shown ? null : ((0, jsx_runtime_1.jsxs)("g", { children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("pattern", { id: "diagonalHatch", width: "10", height: "10", patternTransform: "rotate(45 0 0)", patternUnits: "userSpaceOnUse", children: (0, jsx_runtime_1.jsx)("line", { x1: "0", y1: "0", x2: "0", y2: "10", style: { stroke: 'rgba(255,255,255,0.5)', strokeWidth: 10 } }) }) }), (0, jsx_runtime_1.jsx)("circle", { cx: "0", cy: "0", r: radius, fill: "#f1f1f1" }), (0, jsx_runtime_1.jsx)("circle", { cx: "0", cy: "0", r: radius, fill: "url(#diagonalHatch)" }), (0, jsx_runtime_1.jsx)("text", { x: "0", y: "0", transform: "rotate(90 0 0)", dominantBaseline: "middle", textAnchor: "middle", children: "Loading\u2026" }), (0, jsx_runtime_1.jsx)("circle", { className: classes.path, fill: "none", strokeWidth: "4", strokeLinecap: "round", cx: "0", cy: "0", r: "60" })] }));
90
61
  });
91
62
  exports.default = Loading;
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import type { ExportSvgOptions } from '../CircularView/model';
3
2
  import type { AnyReactComponentType, Feature } from '@jbrowse/core/util';
4
3
  import type { ThemeOptions } from '@mui/material';
@@ -106,5 +105,5 @@ export declare const BaseChordDisplayModel: import("mobx-state-tree").IModelType
106
105
  } & {
107
106
  renderSvg(opts: ExportSvgOptions & {
108
107
  theme?: ThemeOptions;
109
- }): Promise<React.JSX.Element>;
108
+ }): Promise<import("react/jsx-runtime").JSX.Element>;
110
109
  }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.BaseChordDisplayModel = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const configuration_1 = require("@jbrowse/core/configuration");
9
6
  const models_1 = require("@jbrowse/core/pluggableElementTypes/models");
10
7
  const util_1 = require("@jbrowse/core/util");
@@ -164,6 +161,6 @@ exports.BaseChordDisplayModel = mobx_state_tree_1.types
164
161
  exportSVG: opts,
165
162
  theme: opts.theme || data.renderProps.theme,
166
163
  });
167
- return react_1.default.createElement(util_1.ReactRendering, { rendering: rendering });
164
+ return (0, jsx_runtime_1.jsx)(util_1.ReactRendering, { rendering: rendering });
168
165
  },
169
166
  }));
@@ -1,6 +1,5 @@
1
- import React from 'react';
2
1
  import type { CircularViewModel } from '../model';
3
2
  declare const CircularView: ({ model }: {
4
3
  model: CircularViewModel;
5
- }) => React.JSX.Element | null;
4
+ }) => import("react/jsx-runtime").JSX.Element | null;
6
5
  export default CircularView;
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
7
  const ui_1 = require("@jbrowse/core/ui");
8
8
  const util_1 = require("@jbrowse/core/util");
9
9
  const mobx_react_1 = require("mobx-react");
@@ -23,12 +23,10 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
23
23
  },
24
24
  }));
25
25
  const Slices = (0, mobx_react_1.observer)(({ model }) => {
26
- return (react_1.default.createElement(react_1.default.Fragment, null,
27
- model.staticSlices.map(slice => (react_1.default.createElement(Ruler_1.default, { key: (0, util_1.assembleLocString)(slice.region.elided ? slice.region.regions[0] : slice.region), model: model, slice: slice }))),
28
- model.tracks.map(track => {
29
- const display = track.displays[0];
30
- return (react_1.default.createElement(display.RenderingComponent, { key: display.id, display: display, view: model }));
31
- })));
26
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [model.staticSlices.map(slice => ((0, jsx_runtime_1.jsx)(Ruler_1.default, { model: model, slice: slice }, (0, util_1.assembleLocString)(slice.region.elided ? slice.region.regions[0] : slice.region)))), model.tracks.map(track => {
27
+ const display = track.displays[0];
28
+ return ((0, jsx_runtime_1.jsx)(display.RenderingComponent, { display: display, view: model }, display.id));
29
+ })] }));
32
30
  });
33
31
  const CircularView = (0, mobx_react_1.observer)(({ model }) => {
34
32
  const initialized = !!model.displayedRegions.length &&
@@ -37,32 +35,26 @@ const CircularView = (0, mobx_react_1.observer)(({ model }) => {
37
35
  model.initialized;
38
36
  const showImportForm = !initialized && !model.disableImportForm;
39
37
  const showFigure = initialized && !showImportForm;
40
- return showImportForm || model.error ? (react_1.default.createElement(ImportForm_1.default, { model: model })) : showFigure ? (react_1.default.createElement(CircularViewLoaded, { model: model })) : null;
38
+ return showImportForm || model.error ? ((0, jsx_runtime_1.jsx)(ImportForm_1.default, { model: model })) : showFigure ? ((0, jsx_runtime_1.jsx)(CircularViewLoaded, { model: model })) : null;
41
39
  });
42
40
  const CircularViewLoaded = (0, mobx_react_1.observer)(function ({ model, }) {
43
41
  const { width, height, id, offsetRadians, centerXY, figureWidth, figureHeight, hideVerticalResizeHandle, } = model;
44
42
  const { classes } = useStyles();
45
- return (react_1.default.createElement("div", { className: classes.root, style: { width, height }, "data-testid": id },
46
- react_1.default.createElement("div", { className: classes.scroller, style: { width, height } },
47
- react_1.default.createElement("svg", { style: {
48
- transform: `rotate(${offsetRadians}rad)`,
49
- transition: 'transform 0.5s',
50
- transformOrigin: centerXY.map(x => `${x}px`).join(' '),
43
+ return ((0, jsx_runtime_1.jsxs)("div", { className: classes.root, style: { width, height }, "data-testid": id, children: [(0, jsx_runtime_1.jsx)("div", { className: classes.scroller, style: { width, height }, children: (0, jsx_runtime_1.jsx)("svg", { style: {
44
+ transform: `rotate(${offsetRadians}rad)`,
45
+ transition: 'transform 0.5s',
46
+ transformOrigin: centerXY.map(x => `${x}px`).join(' '),
47
+ position: 'absolute',
48
+ left: 0,
49
+ top: 0,
50
+ }, width: figureWidth, height: figureHeight, children: (0, jsx_runtime_1.jsx)("g", { transform: `translate(${centerXY})`, children: (0, jsx_runtime_1.jsx)(Slices, { model: model }) }) }) }), (0, jsx_runtime_1.jsx)(Controls_1.default, { model: model }), hideVerticalResizeHandle ? null : ((0, jsx_runtime_1.jsx)(ui_1.ResizeHandle, { onDrag: model.resizeHeight, style: {
51
+ height: dragHandleHeight,
51
52
  position: 'absolute',
53
+ bottom: 0,
52
54
  left: 0,
53
- top: 0,
54
- }, width: figureWidth, height: figureHeight },
55
- react_1.default.createElement("g", { transform: `translate(${centerXY})` },
56
- react_1.default.createElement(Slices, { model: model })))),
57
- react_1.default.createElement(Controls_1.default, { model: model }),
58
- hideVerticalResizeHandle ? null : (react_1.default.createElement(ui_1.ResizeHandle, { onDrag: model.resizeHeight, style: {
59
- height: dragHandleHeight,
60
- position: 'absolute',
61
- bottom: 0,
62
- left: 0,
63
- background: '#ccc',
64
- boxSizing: 'border-box',
65
- borderTop: '1px solid #fafafa',
66
- } }))));
55
+ background: '#ccc',
56
+ boxSizing: 'border-box',
57
+ borderTop: '1px solid #fafafa',
58
+ } }))] }));
67
59
  });
68
60
  exports.default = CircularView;
@@ -1,6 +1,5 @@
1
- import React from 'react';
2
1
  import type { CircularViewModel } from '../model';
3
2
  declare const Controls: ({ model }: {
4
3
  model: CircularViewModel;
5
- }) => React.JSX.Element;
4
+ }) => import("react/jsx-runtime").JSX.Element;
6
5
  export default Controls;
@@ -1,32 +1,10 @@
1
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 (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  var __importDefault = (this && this.__importDefault) || function (mod) {
26
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
27
4
  };
28
5
  Object.defineProperty(exports, "__esModule", { value: true });
29
- const react_1 = __importStar(require("react"));
6
+ const jsx_runtime_1 = require("react/jsx-runtime");
7
+ const react_1 = require("react");
30
8
  const Icons_1 = require("@jbrowse/core/ui/Icons");
31
9
  const Menu_1 = __importDefault(require("@jbrowse/core/ui/Menu"));
32
10
  const util_1 = require("@jbrowse/core/util");
@@ -54,40 +32,26 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
54
32
  const Controls = (0, mobx_react_1.observer)(function ({ model }) {
55
33
  const { classes } = useStyles();
56
34
  const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
57
- return (react_1.default.createElement("div", { className: classes.controls },
58
- react_1.default.createElement(material_1.IconButton, { onClick: model.zoomOutButton, title: model.lockedFitToWindow ? 'unlock to zoom out' : 'zoom out', disabled: model.atMaxBpPerPx || model.lockedFitToWindow },
59
- react_1.default.createElement(ZoomOut_1.default, null)),
60
- react_1.default.createElement(material_1.IconButton, { onClick: model.zoomInButton, disabled: model.atMinBpPerPx, title: "zoom in" },
61
- react_1.default.createElement(ZoomIn_1.default, null)),
62
- react_1.default.createElement(material_1.IconButton, { onClick: model.rotateCounterClockwiseButton, title: "rotate counter-clockwise" },
63
- react_1.default.createElement(RotateLeft_1.default, null)),
64
- react_1.default.createElement(material_1.IconButton, { onClick: model.rotateClockwiseButton, title: "rotate clockwise" },
65
- react_1.default.createElement(RotateRight_1.default, null)),
66
- react_1.default.createElement(material_1.IconButton, { onClick: model.toggleFitToWindowLock, title: model.lockedFitToWindow
67
- ? 'locked model to window size'
68
- : 'unlocked model to zoom further', disabled: model.tooSmallToLock }, model.lockedFitToWindow ? react_1.default.createElement(Lock_1.default, null) : react_1.default.createElement(LockOpen_1.default, null)),
69
- react_1.default.createElement(material_1.IconButton, { onClick: event => {
70
- setAnchorEl(event.currentTarget);
71
- } },
72
- react_1.default.createElement(MoreVert_1.default, null)),
73
- model.hideTrackSelectorButton ? null : (react_1.default.createElement(material_1.IconButton, { onClick: model.activateTrackSelector, title: "Open track selector", "data-testid": "circular_track_select" },
74
- react_1.default.createElement(Icons_1.TrackSelector, null))),
75
- anchorEl ? (react_1.default.createElement(Menu_1.default, { anchorEl: anchorEl, menuItems: [
76
- {
77
- label: 'Export SVG',
78
- icon: PhotoCamera_1.default,
79
- onClick: () => {
80
- (0, util_1.getSession)(model).queueDialog(handleClose => [
81
- ExportSvgDialog_1.default,
82
- { model, handleClose },
83
- ]);
35
+ return ((0, jsx_runtime_1.jsxs)("div", { className: classes.controls, children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.zoomOutButton, title: model.lockedFitToWindow ? 'unlock to zoom out' : 'zoom out', disabled: model.atMaxBpPerPx || model.lockedFitToWindow, children: (0, jsx_runtime_1.jsx)(ZoomOut_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.zoomInButton, disabled: model.atMinBpPerPx, title: "zoom in", children: (0, jsx_runtime_1.jsx)(ZoomIn_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.rotateCounterClockwiseButton, title: "rotate counter-clockwise", children: (0, jsx_runtime_1.jsx)(RotateLeft_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.rotateClockwiseButton, title: "rotate clockwise", children: (0, jsx_runtime_1.jsx)(RotateRight_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.toggleFitToWindowLock, title: model.lockedFitToWindow
36
+ ? 'locked model to window size'
37
+ : 'unlocked model to zoom further', disabled: model.tooSmallToLock, children: model.lockedFitToWindow ? (0, jsx_runtime_1.jsx)(Lock_1.default, {}) : (0, jsx_runtime_1.jsx)(LockOpen_1.default, {}) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: event => {
38
+ setAnchorEl(event.currentTarget);
39
+ }, children: (0, jsx_runtime_1.jsx)(MoreVert_1.default, {}) }), model.hideTrackSelectorButton ? null : ((0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: model.activateTrackSelector, title: "Open track selector", "data-testid": "circular_track_select", children: (0, jsx_runtime_1.jsx)(Icons_1.TrackSelector, {}) })), anchorEl ? ((0, jsx_runtime_1.jsx)(Menu_1.default, { anchorEl: anchorEl, menuItems: [
40
+ {
41
+ label: 'Export SVG',
42
+ icon: PhotoCamera_1.default,
43
+ onClick: () => {
44
+ (0, util_1.getSession)(model).queueDialog(handleClose => [
45
+ ExportSvgDialog_1.default,
46
+ { model, handleClose },
47
+ ]);
48
+ },
84
49
  },
85
- },
86
- ], onMenuItemClick: (_event, callback) => {
87
- callback();
88
- setAnchorEl(null);
89
- }, open: Boolean(anchorEl), onClose: () => {
90
- setAnchorEl(null);
91
- } })) : null));
50
+ ], onMenuItemClick: (_event, callback) => {
51
+ callback();
52
+ setAnchorEl(null);
53
+ }, open: Boolean(anchorEl), onClose: () => {
54
+ setAnchorEl(null);
55
+ } })) : null] }));
92
56
  });
93
57
  exports.default = Controls;
@@ -1,8 +1,7 @@
1
- import React from 'react';
2
1
  import type { ExportSvgOptions } from '../model';
3
2
  export default function ExportSvgDialog({ model, handleClose, }: {
4
3
  model: {
5
4
  exportSvg(opts: ExportSvgOptions): Promise<void>;
6
5
  };
7
6
  handleClose: () => void;
8
- }): React.JSX.Element;
7
+ }): import("react/jsx-runtime").JSX.Element;
@@ -1,41 +1,16 @@
1
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 (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  Object.defineProperty(exports, "__esModule", { value: true });
26
3
  exports.default = ExportSvgDialog;
27
- const react_1 = __importStar(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
28
6
  const ui_1 = require("@jbrowse/core/ui");
29
7
  const util_1 = require("@jbrowse/core/util");
30
8
  const material_1 = require("@mui/material");
31
9
  function LoadingMessage() {
32
- return (react_1.default.createElement("div", null,
33
- react_1.default.createElement(material_1.CircularProgress, { size: 20, style: { marginRight: 20 } }),
34
- react_1.default.createElement(material_1.Typography, { display: "inline" }, "Creating SVG")));
10
+ return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20, style: { marginRight: 20 } }), (0, jsx_runtime_1.jsx)(material_1.Typography, { display: "inline", children: "Creating SVG" })] }));
35
11
  }
36
12
  function TextField2({ children, ...rest }) {
37
- return (react_1.default.createElement("div", null,
38
- react_1.default.createElement(material_1.TextField, { ...rest }, children)));
13
+ return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { ...rest, children: children }) }));
39
14
  }
40
15
  function useSvgLocal(key, val) {
41
16
  return (0, util_1.useLocalStorage)(`svg-${key}`, val);
@@ -48,39 +23,31 @@ function ExportSvgDialog({ model, handleClose, }) {
48
23
  const [error, setError] = (0, react_1.useState)();
49
24
  const [filename, setFilename] = useSvgLocal('file', 'jbrowse.svg');
50
25
  const [themeName, setThemeName] = useSvgLocal('theme', session.themeName || 'default');
51
- return (react_1.default.createElement(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG" },
52
- react_1.default.createElement(material_1.DialogContent, null,
53
- error ? (react_1.default.createElement(ui_1.ErrorMessage, { error: error })) : loading ? (react_1.default.createElement(LoadingMessage, null)) : null,
54
- react_1.default.createElement(TextField2, { helperText: "filename", value: filename, onChange: event => {
55
- setFilename(event.target.value);
56
- } }),
57
- session.allThemes ? (react_1.default.createElement(TextField2, { select: true, label: "Theme", value: themeName, onChange: event => {
58
- setThemeName(event.target.value);
59
- } }, Object.entries(session.allThemes()).map(([key, val]) => (react_1.default.createElement(material_1.MenuItem, { key: key, value: key }, val.name || '(Unknown name)'))))) : null,
60
- offscreenCanvas ? (react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, { checked: rasterizeLayers, onChange: () => {
61
- setRasterizeLayers(val => !val);
62
- } }), 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"))),
63
- react_1.default.createElement(material_1.DialogActions, null,
64
- react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
65
- handleClose();
66
- } }, "Cancel"),
67
- react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", onClick: async () => {
68
- setLoading(true);
69
- setError(undefined);
70
- try {
71
- await model.exportSvg({
72
- rasterizeLayers,
73
- filename,
74
- themeName,
75
- });
76
- handleClose();
77
- }
78
- catch (e) {
79
- console.error(e);
80
- setError(e);
81
- }
82
- finally {
83
- setLoading(false);
84
- }
85
- } }, "Submit"))));
26
+ return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : loading ? ((0, jsx_runtime_1.jsx)(LoadingMessage, {})) : null, (0, jsx_runtime_1.jsx)(TextField2, { helperText: "filename", value: filename, onChange: event => {
27
+ setFilename(event.target.value);
28
+ } }), session.allThemes ? ((0, jsx_runtime_1.jsx)(TextField2, { select: true, label: "Theme", value: themeName, onChange: event => {
29
+ setThemeName(event.target.value);
30
+ }, children: Object.entries(session.allThemes()).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: key, children: val.name || '(Unknown name)' }, key))) })) : null, offscreenCanvas ? ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { checked: rasterizeLayers, onChange: () => {
31
+ setRasterizeLayers(val => !val);
32
+ } }), label: "Rasterize canvas based tracks? File may be much larger if this is turned off" })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Note: rasterizing layers not yet supported in this browser, so SVG size may be large" }))] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
33
+ handleClose();
34
+ }, children: "Cancel" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", type: "submit", onClick: async () => {
35
+ setLoading(true);
36
+ setError(undefined);
37
+ try {
38
+ await model.exportSvg({
39
+ rasterizeLayers,
40
+ filename,
41
+ themeName,
42
+ });
43
+ handleClose();
44
+ }
45
+ catch (e) {
46
+ console.error(e);
47
+ setError(e);
48
+ }
49
+ finally {
50
+ setLoading(false);
51
+ }
52
+ }, children: "Submit" })] })] }));
86
53
  }
@@ -1,6 +1,5 @@
1
- import React from 'react';
2
1
  import type { CircularViewModel } from '../model';
3
2
  declare const ImportForm: ({ model }: {
4
3
  model: CircularViewModel;
5
- }) => React.JSX.Element;
4
+ }) => import("react/jsx-runtime").JSX.Element;
6
5
  export default ImportForm;
@@ -1,29 +1,7 @@
1
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 (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
2
  Object.defineProperty(exports, "__esModule", { value: true });
26
- const react_1 = __importStar(require("react"));
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
4
+ const react_1 = require("react");
27
5
  const ui_1 = require("@jbrowse/core/ui");
28
6
  const util_1 = require("@jbrowse/core/util");
29
7
  const material_1 = require("@mui/material");
@@ -46,20 +24,12 @@ const ImportForm = (0, mobx_react_1.observer)(function ({ model }) {
46
24
  : 'No configured assemblies';
47
25
  const regions = (assembly === null || assembly === void 0 ? void 0 : assembly.regions) || [];
48
26
  const err = assemblyError || error;
49
- return (react_1.default.createElement(material_1.Container, { className: classes.importFormContainer },
50
- err ? (react_1.default.createElement(material_1.Grid, { container: true, spacing: 1, justifyContent: "center", alignItems: "center" },
51
- react_1.default.createElement(material_1.Grid, { item: true },
52
- react_1.default.createElement(ui_1.ErrorMessage, { error: err })))) : null,
53
- react_1.default.createElement(material_1.Grid, { container: true, spacing: 1, justifyContent: "center", alignItems: "center" },
54
- react_1.default.createElement(material_1.Grid, { item: true },
55
- react_1.default.createElement(ui_1.AssemblySelector, { onChange: val => {
56
- model.setError(undefined);
57
- setSelectedAsm(val);
58
- }, session: session, selected: selectedAsm })),
59
- react_1.default.createElement(material_1.Grid, { item: true },
60
- react_1.default.createElement(material_1.Button, { disabled: !regions.length, onClick: () => {
61
- model.setError(undefined);
62
- model.setDisplayedRegions(regions);
63
- }, variant: "contained", color: "primary" }, regions.length || err ? 'Open' : 'Loading...')))));
27
+ return ((0, jsx_runtime_1.jsxs)(material_1.Container, { className: classes.importFormContainer, children: [err ? ((0, jsx_runtime_1.jsx)(material_1.Grid, { container: true, spacing: 1, justifyContent: "center", alignItems: "center", children: (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: err }) }) })) : null, (0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 1, justifyContent: "center", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(ui_1.AssemblySelector, { onChange: val => {
28
+ model.setError(undefined);
29
+ setSelectedAsm(val);
30
+ }, session: session, selected: selectedAsm }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, children: (0, jsx_runtime_1.jsx)(material_1.Button, { disabled: !regions.length, onClick: () => {
31
+ model.setError(undefined);
32
+ model.setDisplayedRegions(regions);
33
+ }, variant: "contained", color: "primary", children: regions.length || err ? 'Open' : 'Loading...' }) })] })] }));
64
34
  });
65
35
  exports.default = ImportForm;
@@ -1,8 +1,7 @@
1
- import React from 'react';
2
1
  import type { CircularViewModel } from '../model';
3
2
  import type { Slice } from '../slices';
4
3
  declare const Ruler: ({ model, slice, }: {
5
4
  model: CircularViewModel;
6
5
  slice: Slice;
7
- }) => React.JSX.Element;
6
+ }) => import("react/jsx-runtime").JSX.Element;
8
7
  export default Ruler;