@jbrowse/plugin-arc 2.10.2 → 2.11.0

package/dist/ArcRenderer/ArcRendering.js

@@ -48,10 +48,8 @@ function Arc({ selectedFeatureId, region, bpPerPx, config, onFeatureClick, featu
     const ref = react_1.default.createRef();
     const t = 0.5;
     // formula: https://en.wikipedia.org/wiki/B%C3%A9zier_curve#Cubic_B%C3%A9zier_curves
-    const textYCoord = (1 - t) * (1 - t) * (1 - t) * 0 +
-        3 * ((1 - t) * (1 - t)) * (t * height) +
-        3 * (1 - t) * (t * t) * height +
-        t * t * t * 0;
+    const t1 = 1 - t;
+    const textYCoord = 3 * (t1 * t1) * (t * height) + 3 * t1 * (t * t) * height;
     return (react_1.default.createElement("g", null,
         react_1.default.createElement("path", { d: `M ${left} 0 C ${left} ${height}, ${right} ${height}, ${right} 0`, stroke: stroke, strokeWidth: strokeWidth, fill: "transparent", onClick: e => onFeatureClick === null || onFeatureClick === void 0 ? void 0 : onFeatureClick(e, featureId), onMouseOver: () => setIsMouseOvered(true), onMouseLeave: () => setIsMouseOvered(false), ref: ref, pointerEvents: "stroke" }),
         isMouseOvered ? react_1.default.createElement(ArcTooltip_1.default, { contents: caption }) : null,
@@ -110,6 +108,6 @@ const ArcRendering = (0, mobx_react_1.observer)(function ({ features, config, re
     return (react_1.default.createElement(Wrapper, { exportSVG: exportSVG, width: width, height: height }, [...features.values()].map(f => semicircles ? (react_1.default.createElement(SemiCircles, { key: f.id(), config: config, region: region, bpPerPx: bpPerPx, selectedFeatureId: selectedFeatureId, feature: f })) : (react_1.default.createElement(Arc, { key: f.id(), config: config, region: region, bpPerPx: bpPerPx, selectedFeatureId: selectedFeatureId, feature: f })))));
 });
 function Wrapper({ exportSVG, width, height, children, }) {
-    return exportSVG ? (react_1.default.createElement(react_1.default.Fragment, null, children)) : (react_1.default.createElement("svg", { width: width, height: height }, children));
+    return exportSVG ? (children) : (react_1.default.createElement("svg", { width: width, height: height }, children));
 }
 exports.default = ArcRendering;

package/dist/ArcTooltip.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 declare const ArcTooltip: ({ contents }: {
-    contents?: string | undefined;
+    contents?: string;
 }) => React.JSX.Element | null;
 export default ArcTooltip;

package/dist/LinearArcDisplay/model.d.ts

@@ -43,8 +43,18 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         message: string | undefined;
         maxHeightReached: boolean;
         ReactComponent: ({ model, }: {
-            model: any;
-        }) => any;
+            /**
+             * #getter
+             */
+            model: {
+                error?: unknown;
+                reload: () => void;
+                message: import("react").ReactNode;
+                filled?: boolean | undefined;
+                status?: string | undefined;
+                reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+            };
+        }) => import("react").JSX.Element | undefined;
         renderProps: any;
     } & {
         doReload(): void;
@@ -323,8 +333,18 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         message: string | undefined;
         maxHeightReached: boolean;
         ReactComponent: ({ model, }: {
-            model: any;
-        }) => any;
+            /**
+             * #getter
+             */
+            model: {
+                error?: unknown;
+                reload: () => void;
+                message: import("react").ReactNode;
+                filled?: boolean | undefined;
+                status?: string | undefined;
+                reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+            };
+        }) => import("react").JSX.Element | undefined;
         renderProps: any;
     } & {
         doReload(): void;

package/dist/LinearPairedArcDisplay/components/Arcs.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { LinearArcDisplayModel } from '../model';
 declare const Arcs: ({ model, exportSVG, }: {
     model: LinearArcDisplayModel;
-    exportSVG?: boolean | undefined;
+    exportSVG?: boolean;
 }) => React.JSX.Element | null;
 export default Arcs;

package/dist/LinearPairedArcDisplay/components/Arcs.js

@@ -67,7 +67,7 @@ const Wrapper = (0, mobx_react_1.observer)(function ({ model, exportSVG, childre
     const { height } = model;
     const view = (0, util_1.getContainingView)(model);
     const width = Math.round(view.dynamicBlocks.totalWidthPx);
-    return exportSVG ? (react_1.default.createElement(react_1.default.Fragment, null, children)) : (react_1.default.createElement("svg", { width: width, height: height }, children));
+    return exportSVG ? (children) : (react_1.default.createElement("svg", { width: width, height: height }, children));
 });
 const Arcs = (0, mobx_react_1.observer)(function ({ model, exportSVG, }) {
     const view = (0, util_1.getContainingView)(model);

package/dist/LinearPairedArcDisplay/components/BaseDisplayComponent.js

@@ -1,13 +1,42 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
 const ui_1 = require("@jbrowse/core/ui");
 const plugin_linear_genome_view_1 = require("@jbrowse/plugin-linear-genome-view");
 const mui_1 = require("tss-react/mui");
 const mobx_react_1 = require("mobx-react");
+// icons
+const Refresh_1 = __importDefault(require("@mui/icons-material/Refresh"));
+const Report_1 = __importDefault(require("@mui/icons-material/Report"));
+const util_1 = require("@jbrowse/core/util");
+const ErrorMessageStackTraceDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('@jbrowse/core/ui/ErrorMessageStackTraceDialog'))));
 const useStyles = (0, mui_1.makeStyles)()(theme => ({
     loading: {
         backgroundColor: theme.palette.background.default,
@@ -23,7 +52,18 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
 }));
 const BaseDisplayComponent = (0, mobx_react_1.observer)(function ({ model, children, }) {
     const { error, regionTooLarge } = model;
-    return error ? (react_1.default.createElement(plugin_linear_genome_view_1.BlockMsg, { message: `${error}`, severity: "error", buttonText: "Reload", action: model.reload })) : regionTooLarge ? (model.regionCannotBeRendered()) : (react_1.default.createElement(DataDisplay, { model: model }, children));
+    return error ? (react_1.default.createElement(plugin_linear_genome_view_1.BlockMsg, { message: `${error}`, severity: "error", action: react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(material_1.Tooltip, { title: "Reload" },
+                react_1.default.createElement(material_1.IconButton, { "data-testid": "reload_button", onClick: () => model.reload() },
+                    react_1.default.createElement(Refresh_1.default, null))),
+            react_1.default.createElement(material_1.Tooltip, { title: "Show stack trace" },
+                react_1.default.createElement(material_1.IconButton, { onClick: () => {
+                        (0, util_1.getSession)(model).queueDialog(onClose => [
+                            ErrorMessageStackTraceDialog,
+                            { onClose, error: model.error },
+                        ]);
+                    } },
+                    react_1.default.createElement(Report_1.default, null)))) })) : regionTooLarge ? (model.regionCannotBeRendered()) : (react_1.default.createElement(DataDisplay, { model: model }, children));
 });
 const DataDisplay = (0, mobx_react_1.observer)(function ({ model, children, }) {
     const { loading } = model;

package/dist/LinearPairedArcDisplay/components/ReactComponent.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { LinearArcDisplayModel } from '../model';
 declare const LinearArcReactComponent: ({ model, exportSVG, }: {
     model: LinearArcDisplayModel;
-    exportSVG?: boolean | undefined;
+    exportSVG?: boolean;
 }) => React.JSX.Element;
 export default LinearArcReactComponent;

package/dist/LinearPairedArcDisplay/components/util.js

@@ -6,7 +6,7 @@ const util_1 = require("@jbrowse/core/util");
 function makeFeaturePair(feature, alt) {
     var _a, _b, _c, _d;
     const bnd = alt ? (0, vcf_1.parseBreakend)(alt) : undefined;
-    let start = feature.get('start');
+    const start = feature.get('start');
     let end = feature.get('end');
     const strand = feature.get('strand');
     const mate = feature.get('mate');
@@ -29,7 +29,6 @@ function makeFeaturePair(feature, alt) {
         mateStart = e - 1;
         // re-adjust the arc to be from start to end of feature by re-assigning end
         // to the 'mate'
-        start = start;
         end = start + 1;
     }
     else if (bnd === null || bnd === void 0 ? void 0 : bnd.MatePosition) {

package/esm/ArcRenderer/ArcRendering.js

@@ -20,10 +20,8 @@ function Arc({ selectedFeatureId, region, bpPerPx, config, onFeatureClick, featu
     const ref = React.createRef();
     const t = 0.5;
     // formula: https://en.wikipedia.org/wiki/B%C3%A9zier_curve#Cubic_B%C3%A9zier_curves
-    const textYCoord = (1 - t) * (1 - t) * (1 - t) * 0 +
-        3 * ((1 - t) * (1 - t)) * (t * height) +
-        3 * (1 - t) * (t * t) * height +
-        t * t * t * 0;
+    const t1 = 1 - t;
+    const textYCoord = 3 * (t1 * t1) * (t * height) + 3 * t1 * (t * t) * height;
     return (React.createElement("g", null,
         React.createElement("path", { d: `M ${left} 0 C ${left} ${height}, ${right} ${height}, ${right} 0`, stroke: stroke, strokeWidth: strokeWidth, fill: "transparent", onClick: e => onFeatureClick === null || onFeatureClick === void 0 ? void 0 : onFeatureClick(e, featureId), onMouseOver: () => setIsMouseOvered(true), onMouseLeave: () => setIsMouseOvered(false), ref: ref, pointerEvents: "stroke" }),
         isMouseOvered ? React.createElement(ArcTooltip, { contents: caption }) : null,
@@ -82,6 +80,6 @@ const ArcRendering = observer(function ({ features, config, regions, bpPerPx, he
     return (React.createElement(Wrapper, { exportSVG: exportSVG, width: width, height: height }, [...features.values()].map(f => semicircles ? (React.createElement(SemiCircles, { key: f.id(), config: config, region: region, bpPerPx: bpPerPx, selectedFeatureId: selectedFeatureId, feature: f })) : (React.createElement(Arc, { key: f.id(), config: config, region: region, bpPerPx: bpPerPx, selectedFeatureId: selectedFeatureId, feature: f })))));
 });
 function Wrapper({ exportSVG, width, height, children, }) {
-    return exportSVG ? (React.createElement(React.Fragment, null, children)) : (React.createElement("svg", { width: width, height: height }, children));
+    return exportSVG ? (children) : (React.createElement("svg", { width: width, height: height }, children));
 }
 export default ArcRendering;

package/esm/ArcTooltip.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 declare const ArcTooltip: ({ contents }: {
-    contents?: string | undefined;
+    contents?: string;
 }) => React.JSX.Element | null;
 export default ArcTooltip;

package/esm/LinearArcDisplay/model.d.ts

@@ -43,8 +43,18 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         message: string | undefined;
         maxHeightReached: boolean;
         ReactComponent: ({ model, }: {
-            model: any;
-        }) => any;
+            /**
+             * #getter
+             */
+            model: {
+                error?: unknown;
+                reload: () => void;
+                message: import("react").ReactNode;
+                filled?: boolean | undefined;
+                status?: string | undefined;
+                reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+            };
+        }) => import("react").JSX.Element | undefined;
         renderProps: any;
     } & {
         doReload(): void;
@@ -323,8 +333,18 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         message: string | undefined;
         maxHeightReached: boolean;
         ReactComponent: ({ model, }: {
-            model: any;
-        }) => any;
+            /**
+             * #getter
+             */
+            model: {
+                error?: unknown;
+                reload: () => void;
+                message: import("react").ReactNode;
+                filled?: boolean | undefined;
+                status?: string | undefined;
+                reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+            };
+        }) => import("react").JSX.Element | undefined;
         renderProps: any;
     } & {
         doReload(): void;

package/esm/LinearPairedArcDisplay/components/Arcs.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { LinearArcDisplayModel } from '../model';
 declare const Arcs: ({ model, exportSVG, }: {
     model: LinearArcDisplayModel;
-    exportSVG?: boolean | undefined;
+    exportSVG?: boolean;
 }) => React.JSX.Element | null;
 export default Arcs;

package/esm/LinearPairedArcDisplay/components/Arcs.js

@@ -39,7 +39,7 @@ const Wrapper = observer(function ({ model, exportSVG, children, }) {
     const { height } = model;
     const view = getContainingView(model);
     const width = Math.round(view.dynamicBlocks.totalWidthPx);
-    return exportSVG ? (React.createElement(React.Fragment, null, children)) : (React.createElement("svg", { width: width, height: height }, children));
+    return exportSVG ? (children) : (React.createElement("svg", { width: width, height: height }, children));
 });
 const Arcs = observer(function ({ model, exportSVG, }) {
     const view = getContainingView(model);

package/esm/LinearPairedArcDisplay/components/BaseDisplayComponent.js

@@ -1,8 +1,14 @@
-import React from 'react';
+import React, { lazy } from 'react';
+import { IconButton, Tooltip } from '@mui/material';
 import { LoadingEllipses } from '@jbrowse/core/ui';
 import { BlockMsg } from '@jbrowse/plugin-linear-genome-view';
 import { makeStyles } from 'tss-react/mui';
 import { observer } from 'mobx-react';
+// icons
+import RefreshIcon from '@mui/icons-material/Refresh';
+import ReportIcon from '@mui/icons-material/Report';
+import { getSession } from '@jbrowse/core/util';
+const ErrorMessageStackTraceDialog = lazy(() => import('@jbrowse/core/ui/ErrorMessageStackTraceDialog'));
 const useStyles = makeStyles()(theme => ({
     loading: {
         backgroundColor: theme.palette.background.default,
@@ -18,7 +24,18 @@ const useStyles = makeStyles()(theme => ({
 }));
 const BaseDisplayComponent = observer(function ({ model, children, }) {
     const { error, regionTooLarge } = model;
-    return error ? (React.createElement(BlockMsg, { message: `${error}`, severity: "error", buttonText: "Reload", action: model.reload })) : regionTooLarge ? (model.regionCannotBeRendered()) : (React.createElement(DataDisplay, { model: model }, children));
+    return error ? (React.createElement(BlockMsg, { message: `${error}`, severity: "error", action: React.createElement(React.Fragment, null,
+            React.createElement(Tooltip, { title: "Reload" },
+                React.createElement(IconButton, { "data-testid": "reload_button", onClick: () => model.reload() },
+                    React.createElement(RefreshIcon, null))),
+            React.createElement(Tooltip, { title: "Show stack trace" },
+                React.createElement(IconButton, { onClick: () => {
+                        getSession(model).queueDialog(onClose => [
+                            ErrorMessageStackTraceDialog,
+                            { onClose, error: model.error },
+                        ]);
+                    } },
+                    React.createElement(ReportIcon, null)))) })) : regionTooLarge ? (model.regionCannotBeRendered()) : (React.createElement(DataDisplay, { model: model }, children));
 });
 const DataDisplay = observer(function ({ model, children, }) {
     const { loading } = model;

package/esm/LinearPairedArcDisplay/components/ReactComponent.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { LinearArcDisplayModel } from '../model';
 declare const LinearArcReactComponent: ({ model, exportSVG, }: {
     model: LinearArcDisplayModel;
-    exportSVG?: boolean | undefined;
+    exportSVG?: boolean;
 }) => React.JSX.Element;
 export default LinearArcReactComponent;

package/esm/LinearPairedArcDisplay/components/util.js

@@ -3,7 +3,7 @@ import { assembleLocString } from '@jbrowse/core/util';
 export function makeFeaturePair(feature, alt) {
     var _a, _b, _c, _d;
     const bnd = alt ? parseBreakend(alt) : undefined;
-    let start = feature.get('start');
+    const start = feature.get('start');
     let end = feature.get('end');
     const strand = feature.get('strand');
     const mate = feature.get('mate');
@@ -26,7 +26,6 @@ export function makeFeaturePair(feature, alt) {
         mateStart = e - 1;
         // re-adjust the arc to be from start to end of feature by re-assigning end
         // to the 'mate'
-        start = start;
         end = start + 1;
     }
     else if (bnd === null || bnd === void 0 ? void 0 : bnd.MatePosition) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-arc",
-  "version": "2.10.2",
+  "version": "2.11.0",
   "description": "JBrowse 2 arc adapters, tracks, etc.",
   "keywords": [
     "jbrowse",
@@ -53,5 +53,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7ca3b7db337ebd88853e2d96cdab940ed550c4fb"
+  "gitHead": "3d43a820b9274a6160aa4dc15616147f390d9094"
 }