@jbrowse/plugin-circular-view 2.8.0 → 2.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/BaseChordDisplay/models/model.d.ts +1 -1
- package/dist/BaseChordDisplay/models/model.js +2 -1
- package/dist/CircularView/components/CircularView.d.ts +1 -1
- package/dist/CircularView/components/Controls.d.ts +1 -1
- package/dist/CircularView/components/ExportSvgDialog.d.ts +1 -1
- package/dist/CircularView/components/Ruler.d.ts +1 -1
- package/dist/CircularView/index.js +2 -2
- package/dist/CircularView/models/{CircularView.d.ts → model.d.ts} +6 -3
- package/dist/CircularView/models/{CircularView.js → model.js} +4 -3
- package/dist/CircularView/svgcomponents/SVGCircularView.d.ts +1 -1
- package/dist/CircularView/svgcomponents/SVGCircularView.js +5 -3
- package/dist/index.d.ts +1 -1
- package/esm/BaseChordDisplay/models/model.d.ts +1 -1
- package/esm/BaseChordDisplay/models/model.js +2 -1
- package/esm/CircularView/components/CircularView.d.ts +1 -1
- package/esm/CircularView/components/Controls.d.ts +1 -1
- package/esm/CircularView/components/ExportSvgDialog.d.ts +1 -1
- package/esm/CircularView/components/Ruler.d.ts +1 -1
- package/esm/CircularView/index.js +1 -1
- package/esm/CircularView/models/{CircularView.d.ts → model.d.ts} +6 -3
- package/esm/CircularView/models/{CircularView.js → model.js} +4 -3
- package/esm/CircularView/svgcomponents/SVGCircularView.d.ts +1 -1
- package/esm/CircularView/svgcomponents/SVGCircularView.js +5 -3
- package/esm/index.d.ts +1 -1
- package/package.json +2 -2
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import RendererType from '@jbrowse/core/pluggableElementTypes/renderers/RendererType';
|
|
3
3
|
import { AnyReactComponentType, Feature } from '@jbrowse/core/util';
|
|
4
|
-
import { ExportSvgOptions } from '../../CircularView/models/
|
|
4
|
+
import { ExportSvgOptions } from '../../CircularView/models/model';
|
|
5
5
|
import { ThemeOptions } from '@mui/material';
|
|
6
6
|
export declare const BaseChordDisplayModel: import("mobx-state-tree").IModelType<{
|
|
7
7
|
id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
@@ -18,7 +18,8 @@ const renderReaction_1 = require("./renderReaction");
|
|
|
18
18
|
const configSchema_1 = require("./configSchema");
|
|
19
19
|
/**
|
|
20
20
|
* #stateModel BaseChordDisplay
|
|
21
|
-
* extends
|
|
21
|
+
* extends
|
|
22
|
+
* - [BaseDisplay](../basedisplay)
|
|
22
23
|
*/
|
|
23
24
|
function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
|
|
24
25
|
exports.BaseChordDisplayModel = mobx_state_tree_1.types
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ExportSvgOptions } from '../models/
|
|
2
|
+
import { ExportSvgOptions } from '../models/model';
|
|
3
3
|
export default function ExportSvgDlg({ model, handleClose, }: {
|
|
4
4
|
model: {
|
|
5
5
|
exportSvg(opts: ExportSvgOptions): Promise<void>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Slice } from '../models/slices';
|
|
3
|
-
import { CircularViewModel } from '../models/
|
|
3
|
+
import { CircularViewModel } from '../models/model';
|
|
4
4
|
declare const Ruler: ({ model, slice, }: {
|
|
5
5
|
model: CircularViewModel;
|
|
6
6
|
slice: Slice;
|
|
@@ -28,11 +28,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
const react_1 = require("react");
|
|
30
30
|
const ViewType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/ViewType"));
|
|
31
|
-
const
|
|
31
|
+
const model_1 = __importDefault(require("./models/model"));
|
|
32
32
|
exports.default = (pluginManager) => {
|
|
33
33
|
pluginManager.addViewType(() => new ViewType_1.default({
|
|
34
34
|
ReactComponent: (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/CircularView')))),
|
|
35
|
-
stateModel: (0,
|
|
35
|
+
stateModel: (0, model_1.default)(pluginManager),
|
|
36
36
|
name: 'CircularView',
|
|
37
37
|
displayName: 'Circular view',
|
|
38
38
|
}));
|
|
@@ -8,12 +8,15 @@ import { SliceRegion } from './slices';
|
|
|
8
8
|
export interface ExportSvgOptions {
|
|
9
9
|
rasterizeLayers?: boolean;
|
|
10
10
|
filename?: string;
|
|
11
|
-
Wrapper?: React.FC<
|
|
11
|
+
Wrapper?: React.FC<{
|
|
12
|
+
children: React.ReactNode;
|
|
13
|
+
}>;
|
|
12
14
|
themeName?: string;
|
|
13
15
|
}
|
|
14
16
|
/**
|
|
15
17
|
* #stateModel CircularView
|
|
16
|
-
* extends
|
|
18
|
+
* extends
|
|
19
|
+
* - [BaseViewModel](../baseviewmodel)
|
|
17
20
|
*/
|
|
18
21
|
declare function stateModelFactory(pluginManager: PluginManager): import("mobx-state-tree").IModelType<{
|
|
19
22
|
id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
@@ -219,7 +222,7 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
|
|
|
219
222
|
/**
|
|
220
223
|
* #action
|
|
221
224
|
*/
|
|
222
|
-
toggleTrack(trackId: string):
|
|
225
|
+
toggleTrack(trackId: string): boolean;
|
|
223
226
|
/**
|
|
224
227
|
* #action
|
|
225
228
|
*/
|
|
@@ -45,7 +45,8 @@ const viewportVisibleRegion_1 = require("./viewportVisibleRegion");
|
|
|
45
45
|
const ExportSvgDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('../components/ExportSvgDialog'))));
|
|
46
46
|
/**
|
|
47
47
|
* #stateModel CircularView
|
|
48
|
-
* extends
|
|
48
|
+
* extends
|
|
49
|
+
* - [BaseViewModel](../baseviewmodel)
|
|
49
50
|
*/
|
|
50
51
|
function stateModelFactory(pluginManager) {
|
|
51
52
|
const minHeight = 40;
|
|
@@ -455,12 +456,12 @@ function stateModelFactory(pluginManager) {
|
|
|
455
456
|
* #action
|
|
456
457
|
*/
|
|
457
458
|
toggleTrack(trackId) {
|
|
458
|
-
// if we have any tracks with that configuration, turn them off
|
|
459
459
|
const hiddenCount = this.hideTrack(trackId);
|
|
460
|
-
// if none had that configuration, turn one on
|
|
461
460
|
if (!hiddenCount) {
|
|
462
461
|
this.showTrack(trackId);
|
|
462
|
+
return true;
|
|
463
463
|
}
|
|
464
|
+
return false;
|
|
464
465
|
},
|
|
465
466
|
/**
|
|
466
467
|
* #action
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ExportSvgOptions, CircularViewModel } from '../models/
|
|
1
|
+
import { ExportSvgOptions, CircularViewModel } from '../models/model';
|
|
2
2
|
type CGV = CircularViewModel;
|
|
3
3
|
export declare function renderToSvg(model: CGV, opts: ExportSvgOptions): Promise<string>;
|
|
4
4
|
export {};
|
|
@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
exports.renderToSvg = void 0;
|
|
7
7
|
const react_1 = __importDefault(require("react"));
|
|
8
8
|
const material_1 = require("@mui/material");
|
|
9
|
-
const server_1 = require("react-dom/server");
|
|
10
9
|
const mobx_1 = require("mobx");
|
|
11
10
|
const util_1 = require("@jbrowse/core/util");
|
|
12
11
|
const ui_1 = require("@jbrowse/core/ui");
|
|
12
|
+
const mobx_state_tree_1 = require("mobx-state-tree");
|
|
13
13
|
const SVGBackground_1 = __importDefault(require("./SVGBackground"));
|
|
14
14
|
const Ruler_1 = __importDefault(require("../components/Ruler"));
|
|
15
15
|
async function renderToSvg(model, opts) {
|
|
@@ -18,6 +18,8 @@ async function renderToSvg(model, opts) {
|
|
|
18
18
|
const { themeName = 'default', Wrapper = ({ children }) => react_1.default.createElement(react_1.default.Fragment, null, children) } = opts;
|
|
19
19
|
const session = (0, util_1.getSession)(model);
|
|
20
20
|
const theme = (_a = session.allThemes) === null || _a === void 0 ? void 0 : _a.call(session)[themeName];
|
|
21
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
22
|
+
const { createRootFn } = (0, mobx_state_tree_1.getRoot)(model);
|
|
21
23
|
const { width, tracks, height } = model;
|
|
22
24
|
const shift = 50;
|
|
23
25
|
const displayResults = await Promise.all(tracks.map(async (track) => {
|
|
@@ -28,12 +30,12 @@ async function renderToSvg(model, opts) {
|
|
|
28
30
|
const { staticSlices, offsetRadians, centerXY } = model;
|
|
29
31
|
const deg = (0, util_1.radToDeg)(offsetRadians);
|
|
30
32
|
// the xlink namespace is used for rendering <image> tag
|
|
31
|
-
return (0,
|
|
33
|
+
return (0, util_1.renderToStaticMarkup)(react_1.default.createElement(material_1.ThemeProvider, { theme: (0, ui_1.createJBrowseTheme)(theme) },
|
|
32
34
|
react_1.default.createElement(Wrapper, null,
|
|
33
35
|
react_1.default.createElement("svg", { width: width, height: height, xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: [0, 0, width + shift * 2, height].toString() },
|
|
34
36
|
react_1.default.createElement(SVGBackground_1.default, { width: width, height: height, shift: shift }),
|
|
35
37
|
react_1.default.createElement("g", { transform: `translate(${centerXY}) rotate(${deg})` },
|
|
36
38
|
staticSlices.map((slice, i) => (react_1.default.createElement(Ruler_1.default, { key: i, model: model, slice: slice }))),
|
|
37
|
-
displayResults.map(({ result }, i) => (react_1.default.createElement(react_1.default.Fragment, { key: i }, result))))))));
|
|
39
|
+
displayResults.map(({ result }, i) => (react_1.default.createElement(react_1.default.Fragment, { key: i }, result))))))), createRootFn);
|
|
38
40
|
}
|
|
39
41
|
exports.renderToSvg = renderToSvg;
|
package/dist/index.d.ts
CHANGED
|
@@ -6,4 +6,4 @@ export default class CircularViewPlugin extends Plugin {
|
|
|
6
6
|
configure(pluginManager: PluginManager): void;
|
|
7
7
|
}
|
|
8
8
|
export { baseChordDisplayConfig, BaseChordDisplayModel, BaseChordDisplayComponent, } from './BaseChordDisplay';
|
|
9
|
-
export { type CircularViewModel, type CircularViewStateModel, } from './CircularView/models/
|
|
9
|
+
export { type CircularViewModel, type CircularViewStateModel, } from './CircularView/models/model';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import RendererType from '@jbrowse/core/pluggableElementTypes/renderers/RendererType';
|
|
3
3
|
import { AnyReactComponentType, Feature } from '@jbrowse/core/util';
|
|
4
|
-
import { ExportSvgOptions } from '../../CircularView/models/
|
|
4
|
+
import { ExportSvgOptions } from '../../CircularView/models/model';
|
|
5
5
|
import { ThemeOptions } from '@mui/material';
|
|
6
6
|
export declare const BaseChordDisplayModel: import("mobx-state-tree").IModelType<{
|
|
7
7
|
id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
@@ -12,7 +12,8 @@ import { renderReactionData, renderReactionEffect } from './renderReaction';
|
|
|
12
12
|
import { baseChordDisplayConfig } from './configSchema';
|
|
13
13
|
/**
|
|
14
14
|
* #stateModel BaseChordDisplay
|
|
15
|
-
* extends
|
|
15
|
+
* extends
|
|
16
|
+
* - [BaseDisplay](../basedisplay)
|
|
16
17
|
*/
|
|
17
18
|
function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
|
|
18
19
|
export const BaseChordDisplayModel = types
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ExportSvgOptions } from '../models/
|
|
2
|
+
import { ExportSvgOptions } from '../models/model';
|
|
3
3
|
export default function ExportSvgDlg({ model, handleClose, }: {
|
|
4
4
|
model: {
|
|
5
5
|
exportSvg(opts: ExportSvgOptions): Promise<void>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Slice } from '../models/slices';
|
|
3
|
-
import { CircularViewModel } from '../models/
|
|
3
|
+
import { CircularViewModel } from '../models/model';
|
|
4
4
|
declare const Ruler: ({ model, slice, }: {
|
|
5
5
|
model: CircularViewModel;
|
|
6
6
|
slice: Slice;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { lazy } from 'react';
|
|
2
2
|
import ViewType from '@jbrowse/core/pluggableElementTypes/ViewType';
|
|
3
|
-
import stateModelFactory from './models/
|
|
3
|
+
import stateModelFactory from './models/model';
|
|
4
4
|
export default (pluginManager) => {
|
|
5
5
|
pluginManager.addViewType(() => new ViewType({
|
|
6
6
|
ReactComponent: lazy(() => import('./components/CircularView')),
|
|
@@ -8,12 +8,15 @@ import { SliceRegion } from './slices';
|
|
|
8
8
|
export interface ExportSvgOptions {
|
|
9
9
|
rasterizeLayers?: boolean;
|
|
10
10
|
filename?: string;
|
|
11
|
-
Wrapper?: React.FC<
|
|
11
|
+
Wrapper?: React.FC<{
|
|
12
|
+
children: React.ReactNode;
|
|
13
|
+
}>;
|
|
12
14
|
themeName?: string;
|
|
13
15
|
}
|
|
14
16
|
/**
|
|
15
17
|
* #stateModel CircularView
|
|
16
|
-
* extends
|
|
18
|
+
* extends
|
|
19
|
+
* - [BaseViewModel](../baseviewmodel)
|
|
17
20
|
*/
|
|
18
21
|
declare function stateModelFactory(pluginManager: PluginManager): import("mobx-state-tree").IModelType<{
|
|
19
22
|
id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
|
|
@@ -219,7 +222,7 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
|
|
|
219
222
|
/**
|
|
220
223
|
* #action
|
|
221
224
|
*/
|
|
222
|
-
toggleTrack(trackId: string):
|
|
225
|
+
toggleTrack(trackId: string): boolean;
|
|
223
226
|
/**
|
|
224
227
|
* #action
|
|
225
228
|
*/
|
|
@@ -17,7 +17,8 @@ import { viewportVisibleSection } from './viewportVisibleRegion';
|
|
|
17
17
|
const ExportSvgDialog = lazy(() => import('../components/ExportSvgDialog'));
|
|
18
18
|
/**
|
|
19
19
|
* #stateModel CircularView
|
|
20
|
-
* extends
|
|
20
|
+
* extends
|
|
21
|
+
* - [BaseViewModel](../baseviewmodel)
|
|
21
22
|
*/
|
|
22
23
|
function stateModelFactory(pluginManager) {
|
|
23
24
|
const minHeight = 40;
|
|
@@ -427,12 +428,12 @@ function stateModelFactory(pluginManager) {
|
|
|
427
428
|
* #action
|
|
428
429
|
*/
|
|
429
430
|
toggleTrack(trackId) {
|
|
430
|
-
// if we have any tracks with that configuration, turn them off
|
|
431
431
|
const hiddenCount = this.hideTrack(trackId);
|
|
432
|
-
// if none had that configuration, turn one on
|
|
433
432
|
if (!hiddenCount) {
|
|
434
433
|
this.showTrack(trackId);
|
|
434
|
+
return true;
|
|
435
435
|
}
|
|
436
|
+
return false;
|
|
436
437
|
},
|
|
437
438
|
/**
|
|
438
439
|
* #action
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ExportSvgOptions, CircularViewModel } from '../models/
|
|
1
|
+
import { ExportSvgOptions, CircularViewModel } from '../models/model';
|
|
2
2
|
type CGV = CircularViewModel;
|
|
3
3
|
export declare function renderToSvg(model: CGV, opts: ExportSvgOptions): Promise<string>;
|
|
4
4
|
export {};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ThemeProvider } from '@mui/material';
|
|
3
|
-
import { renderToStaticMarkup } from 'react-dom/server';
|
|
4
3
|
import { when } from 'mobx';
|
|
5
|
-
import { getSession, radToDeg } from '@jbrowse/core/util';
|
|
4
|
+
import { getSession, radToDeg, renderToStaticMarkup } from '@jbrowse/core/util';
|
|
6
5
|
import { createJBrowseTheme } from '@jbrowse/core/ui';
|
|
6
|
+
import { getRoot } from 'mobx-state-tree';
|
|
7
7
|
import SVGBackground from './SVGBackground';
|
|
8
8
|
import Ruler from '../components/Ruler';
|
|
9
9
|
export async function renderToSvg(model, opts) {
|
|
@@ -12,6 +12,8 @@ export async function renderToSvg(model, opts) {
|
|
|
12
12
|
const { themeName = 'default', Wrapper = ({ children }) => React.createElement(React.Fragment, null, children) } = opts;
|
|
13
13
|
const session = getSession(model);
|
|
14
14
|
const theme = (_a = session.allThemes) === null || _a === void 0 ? void 0 : _a.call(session)[themeName];
|
|
15
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
16
|
+
const { createRootFn } = getRoot(model);
|
|
15
17
|
const { width, tracks, height } = model;
|
|
16
18
|
const shift = 50;
|
|
17
19
|
const displayResults = await Promise.all(tracks.map(async (track) => {
|
|
@@ -28,5 +30,5 @@ export async function renderToSvg(model, opts) {
|
|
|
28
30
|
React.createElement(SVGBackground, { width: width, height: height, shift: shift }),
|
|
29
31
|
React.createElement("g", { transform: `translate(${centerXY}) rotate(${deg})` },
|
|
30
32
|
staticSlices.map((slice, i) => (React.createElement(Ruler, { key: i, model: model, slice: slice }))),
|
|
31
|
-
displayResults.map(({ result }, i) => (React.createElement(React.Fragment, { key: i }, result))))))));
|
|
33
|
+
displayResults.map(({ result }, i) => (React.createElement(React.Fragment, { key: i }, result))))))), createRootFn);
|
|
32
34
|
}
|
package/esm/index.d.ts
CHANGED
|
@@ -6,4 +6,4 @@ export default class CircularViewPlugin extends Plugin {
|
|
|
6
6
|
configure(pluginManager: PluginManager): void;
|
|
7
7
|
}
|
|
8
8
|
export { baseChordDisplayConfig, BaseChordDisplayModel, BaseChordDisplayComponent, } from './BaseChordDisplay';
|
|
9
|
-
export { type CircularViewModel, type CircularViewStateModel, } from './CircularView/models/
|
|
9
|
+
export { type CircularViewModel, type CircularViewStateModel, } from './CircularView/models/model';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jbrowse/plugin-circular-view",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.10.0",
|
|
4
4
|
"description": "JBrowse 2 circular view",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"jbrowse",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"distModule": "esm/index.js",
|
|
58
58
|
"srcModule": "src/index.ts",
|
|
59
59
|
"module": "esm/index.js",
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "223d8bfb68fd1bacaf22852639ad5920f1b7f43b"
|
|
61
61
|
}
|