@jbrowse/core 2.17.0 → 3.0.0

package/BaseFeatureWidget/BaseFeatureDetail/index.js

@@ -4,44 +4,36 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FeatureDetails = exports.BaseCard = exports.BaseAttributes = exports.BaseCoreDetails = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const mobx_react_1 = require("mobx-react");
-// utils
-const ui_1 = require("../../ui");
 const util_1 = require("./util");
 const util_2 = require("../util");
-// locals
 const Attributes_1 = __importDefault(require("./Attributes"));
 const BaseCard_1 = __importDefault(require("./BaseCard"));
 const CoreDetails_1 = __importDefault(require("./CoreDetails"));
 const FeatureDetails_1 = __importDefault(require("./FeatureDetails"));
+const ui_1 = require("../../ui");
 const BaseCoreDetails = (props) => {
     const { title = 'Primary data' } = props;
-    return (react_1.default.createElement(BaseCard_1.default, { ...props, title: title },
-        react_1.default.createElement(CoreDetails_1.default, { ...props })));
+    return ((0, jsx_runtime_1.jsx)(BaseCard_1.default, { ...props, title: title, children: (0, jsx_runtime_1.jsx)(CoreDetails_1.default, { ...props }) }));
 };
 exports.BaseCoreDetails = BaseCoreDetails;
 const BaseAttributes = (props) => {
     const { feature } = props;
-    return (react_1.default.createElement(BaseCard_1.default, { ...props, title: "Attributes" },
-        react_1.default.createElement(Attributes_1.default, { ...props, attributes: feature })));
+    return ((0, jsx_runtime_1.jsx)(BaseCard_1.default, { ...props, title: "Attributes", children: (0, jsx_runtime_1.jsx)(Attributes_1.default, { ...props, attributes: feature }) }));
 };
 exports.BaseAttributes = BaseAttributes;
 const BaseFeatureDetail = (0, mobx_react_1.observer)(function ({ model }) {
     const { error, featureData } = model;
     if (error) {
-        return react_1.default.createElement(ui_1.ErrorMessage, { error: error });
+        return (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error });
     }
     else if (!featureData) {
         return null;
     }
     else {
-        // replacing undefined with null helps with allowing fields to be hidden,
-        // setting null is not allowed by jexl so we set it to undefined to hide.
-        // see config guide. this replacement happens both here and when
-        // snapshotting the featureData
         const featureData2 = (0, util_2.replaceUndefinedWithNull)(featureData);
-        return (0, util_1.isEmpty)(featureData2) ? null : (react_1.default.createElement(FeatureDetails_1.default, { model: model, feature: featureData2 }));
+        return (0, util_1.isEmpty)(featureData2) ? null : ((0, jsx_runtime_1.jsx)(FeatureDetails_1.default, { model: model, feature: featureData2 }));
     }
 });
 exports.default = BaseFeatureDetail;

package/BaseFeatureWidget/BaseFeatureDetail/util.js

@@ -1,13 +1,9 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isEmpty = isEmpty;
 exports.generateTitle = generateTitle;
 exports.generateMaxWidth = generateMaxWidth;
 exports.accessNested = accessNested;
-const is_object_1 = __importDefault(require("is-object"));
 const util_1 = require("../../util");
 const util_2 = require("../util");
 function isEmpty(obj) {
@@ -21,21 +17,16 @@ function generateTitle(name, id, type) {
 function generateMaxWidth(array, prefix) {
     return (Math.ceil((0, util_1.max)(array.map(key => (0, util_1.measureText)([...prefix, key[0]].join('.'), 12)))) + 10);
 }
-// pick using a path from an object, similar to _.get from lodash with special
-// logic for Descriptions from e.g. VCF headers
-//
-// @param arr  example ['a','b'], obj = {a:{b:'hello}}
-// @returns hello (with special addition to grab description also)
 function accessNested(arr, obj = {}) {
     let obj2 = obj;
-    arr.forEach(elt => {
-        if ((0, is_object_1.default)(obj2)) {
+    for (const elt of arr) {
+        if ((0, util_1.isObject)(obj2)) {
             obj2 = obj2[elt];
         }
-    });
+    }
     return typeof obj2 === 'string'
         ? obj2
-        : (0, is_object_1.default)(obj2) && typeof obj2.Description === 'string'
+        : (0, util_1.isObject)(obj2) && typeof obj2.Description === 'string'
             ? obj2.Description
             : undefined;
 }

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceContents.d.ts

@@ -0,0 +1,10 @@
+import type { SequenceFeatureDetailsModel } from './model';
+import type { SimpleFeatureSerialized } from '../../util';
+import type { SeqState } from '../util';
+declare const SequenceContents: ({ mode, feature, sequence, model, }: {
+    mode: string;
+    feature: SimpleFeatureSerialized;
+    sequence: SeqState;
+    model: SequenceFeatureDetailsModel;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SequenceContents;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceContents.js

@@ -0,0 +1,48 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const mobx_react_1 = require("mobx-react");
+const util_1 = require("../../util");
+const util_2 = require("../util");
+const CDNASequence_1 = __importDefault(require("./seqtypes/CDNASequence"));
+const CDSSequence_1 = __importDefault(require("./seqtypes/CDSSequence"));
+const GenomicSequence_1 = __importDefault(require("./seqtypes/GenomicSequence"));
+const ProteinSequence_1 = __importDefault(require("./seqtypes/ProteinSequence"));
+const SequenceContents = (0, mobx_react_1.observer)(function ({ mode, feature, sequence, model, }) {
+    var _a;
+    let { seq, upstream = '', downstream = '' } = sequence;
+    const children = ((_a = feature.subfeatures) === null || _a === void 0 ? void 0 : _a.sort((a, b) => a.start - b.start).map(sub => ({
+        ...sub,
+        start: sub.start - feature.start,
+        end: sub.end - feature.start,
+    }))) || [];
+    let cds = (0, util_2.dedupe)(children.filter(sub => sub.type === 'CDS'));
+    let utr = (0, util_2.dedupe)(children.filter(sub => { var _a; return (_a = sub.type) === null || _a === void 0 ? void 0 : _a.match(/utr/i); }));
+    let exons = (0, util_2.dedupe)(children.filter(sub => sub.type === 'exon'));
+    if (!utr.length && cds.length && exons.length) {
+        utr = (0, util_2.calculateUTRs)(cds, exons);
+    }
+    if (!utr.length && cds.length && !exons.length) {
+        utr = (0, util_2.calculateUTRs2)(cds, {
+            start: 0,
+            end: feature.end - feature.start,
+            type: 'gene',
+        });
+    }
+    if (feature.strand === -1) {
+        ;
+        [seq, upstream, downstream] = [
+            (0, util_1.revcom)(seq),
+            (0, util_1.revcom)(downstream),
+            (0, util_1.revcom)(upstream),
+        ];
+        cds = (0, util_2.revlist)(cds, seq.length);
+        exons = (0, util_2.revlist)(exons, seq.length);
+        utr = (0, util_2.revlist)(utr, seq.length);
+    }
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: mode === 'genomic' ? ((0, jsx_runtime_1.jsx)(GenomicSequence_1.default, { feature: feature, model: model, sequence: seq })) : mode === 'genomic_sequence_updownstream' ? ((0, jsx_runtime_1.jsx)(GenomicSequence_1.default, { model: model, feature: feature, sequence: seq, upstream: upstream, downstream: downstream })) : mode === 'cds' ? ((0, jsx_runtime_1.jsx)(CDSSequence_1.default, { model: model, cds: cds, sequence: seq })) : mode === 'cdna' ? ((0, jsx_runtime_1.jsx)(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, utr: utr, sequence: seq })) : mode === 'protein' ? ((0, jsx_runtime_1.jsx)(ProteinSequence_1.default, { model: model, cds: cds, codonTable: (0, util_1.generateCodonTable)(util_1.defaultCodonTable), sequence: seq })) : mode === 'gene' ? ((0, jsx_runtime_1.jsx)(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, utr: utr, sequence: seq, includeIntrons: true })) : mode === 'gene_collapsed_intron' ? ((0, jsx_runtime_1.jsx)(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, includeIntrons: true, collapseIntron: true })) : mode === 'gene_updownstream' ? ((0, jsx_runtime_1.jsx)(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, upstream: upstream, downstream: downstream, includeIntrons: true })) : mode === 'gene_updownstream_collapsed_intron' ? ((0, jsx_runtime_1.jsx)(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, upstream: upstream, downstream: downstream, includeIntrons: true, collapseIntron: true })) : ((0, jsx_runtime_1.jsx)("div", { children: "Unknown type" })) }));
+});
+exports.default = SequenceContents;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceFeatureDetails.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
-import { SimpleFeatureSerialized } from '../../util';
-import { BaseFeatureWidgetModel } from '../stateModelFactory';
+import type { SimpleFeatureSerialized } from '../../util';
+import type { BaseFeatureWidgetModel } from '../stateModelFactory';
 declare const SequenceFeatureDetails: ({ model, feature, }: {
     model: BaseFeatureWidgetModel;
     feature: SimpleFeatureSerialized;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SequenceFeatureDetails;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceFeatureDetails.js

@@ -15,31 +15,37 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : 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 __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
-// locals
 const hooks_1 = require("./hooks");
 const ui_1 = require("../../ui");
-// icons
 const SequenceFeatureMenu_1 = __importDefault(require("./dialogs/SequenceFeatureMenu"));
 const SequenceTypeSelector_1 = __importDefault(require("./dialogs/SequenceTypeSelector"));
-// lazies
 const SequencePanel = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./SequencePanel'))));
 const SequenceDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./dialogs/SequenceDialog'))));
-// set the key on this component to feature.id to clear state after new feature
-// is selected
 const SequenceFeatureDetails = (0, mobx_react_1.observer)(function ({ model, feature, }) {
     const { sequenceFeatureDetails } = model;
     const { upDownBp } = sequenceFeatureDetails;
@@ -50,33 +56,19 @@ const SequenceFeatureDetails = (0, mobx_react_1.observer)(function ({ model, fea
     (0, react_1.useEffect)(() => {
         sequenceFeatureDetails.setFeature(feature);
     }, [sequenceFeatureDetails, feature]);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", null,
-            react_1.default.createElement(SequenceTypeSelector_1.default, { model: sequenceFeatureDetails }),
-            react_1.default.createElement(SequenceFeatureMenu_1.default, { ref: seqPanelRef, model: sequenceFeatureDetails, extraItems: [
-                    {
-                        label: 'Open in dialog',
-                        onClick: () => {
-                            // this is given a setTimeout because it allows the menu to
-                            // close before dialog opens
-                            setTimeout(() => {
-                                setOpenInDialog(true);
-                            }, 1);
-                        },
-                    },
-                ] })),
-        openInDialog ? (react_1.default.createElement("div", null,
-            "Open in dialog...",
-            react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement(ui_1.LoadingEllipses, null) },
-                react_1.default.createElement(SequenceDialog, { model: model, feature: feature, handleClose: () => {
-                        setOpenInDialog(false);
-                    } })))) : (react_1.default.createElement("div", null,
-            feature.type === 'gene' ? (react_1.default.createElement(material_1.Typography, null, "Note: inspect subfeature sequences for protein/CDS computations")) : null,
-            error ? (react_1.default.createElement(ui_1.ErrorMessage, { error: error })) : !sequence ? (react_1.default.createElement(ui_1.LoadingEllipses, null)) : 'error' in sequence ? (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(material_1.Typography, { color: "error" }, sequence.error),
-                react_1.default.createElement(material_1.Button, { variant: "contained", color: "inherit", onClick: () => {
-                        setForce(true);
-                    } }, "Force load"))) : (react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement(ui_1.LoadingEllipses, null) },
-                react_1.default.createElement(SequencePanel, { ref: seqPanelRef, feature: feature, sequence: sequence, model: sequenceFeatureDetails })))))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(SequenceTypeSelector_1.default, { model: sequenceFeatureDetails }), (0, jsx_runtime_1.jsx)(SequenceFeatureMenu_1.default, { ref: seqPanelRef, model: sequenceFeatureDetails, extraItems: [
+                            {
+                                label: 'Open in dialog',
+                                onClick: () => {
+                                    setTimeout(() => {
+                                        setOpenInDialog(true);
+                                    }, 1);
+                                },
+                            },
+                        ] })] }), openInDialog ? ((0, jsx_runtime_1.jsxs)("div", { children: ["Open in dialog...", (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, {}), children: (0, jsx_runtime_1.jsx)(SequenceDialog, { model: model, feature: feature, handleClose: () => {
+                                setOpenInDialog(false);
+                            } }) })] })) : ((0, jsx_runtime_1.jsxs)("div", { children: [feature.type === 'gene' ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Note: inspect subfeature sequences for protein/CDS computations" })) : null, error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : !sequence ? ((0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, {})) : 'error' in sequence ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { color: "error", children: sequence.error }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "inherit", onClick: () => {
+                                    setForce(true);
+                                }, children: "Force load" })] })) : ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, {}), children: (0, jsx_runtime_1.jsx)(SequencePanel, { ref: seqPanelRef, feature: feature, sequence: sequence, model: sequenceFeatureDetails }) }))] }))] }));
 });
 exports.default = SequenceFeatureDetails;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceFeaturePanel.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
-import { BaseFeatureWidgetModel } from '../stateModelFactory';
-import { SimpleFeatureSerialized } from '../../util';
+import type { SimpleFeatureSerialized } from '../../util';
+import type { BaseFeatureWidgetModel } from '../stateModelFactory';
 declare const SequenceFeaturePanel: ({ model, feature, }: {
     model: BaseFeatureWidgetModel;
     feature: SimpleFeatureSerialized;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SequenceFeaturePanel;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceFeaturePanel.js

@@ -15,27 +15,35 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : 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 __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Help_1 = __importDefault(require("@mui/icons-material/Help"));
 const material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
 const mui_1 = require("tss-react/mui");
-// locals
 const ui_1 = require("../../ui");
 const util_1 = require("../../util");
-// icons
-const Help_1 = __importDefault(require("@mui/icons-material/Help"));
-// lazies
 const SequenceFeatureDetails = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./SequenceFeatureDetails'))));
 const HelpDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./dialogs/HelpDialog'))));
 const useStyles = (0, mui_1.makeStyles)()(theme => ({
@@ -47,25 +55,18 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
         marginBottom: theme.spacing(4),
     },
 }));
-// display the stitched-together sequence of a gene's CDS, cDNA, or protein
-// sequence. this is a best effort and weird genomic phenomena could lead these
-// to not be 100% accurate
 const SequenceFeaturePanel = (0, mobx_react_1.observer)(function ({ model, feature, }) {
     const { classes } = useStyles();
     const [shown, setShown] = (0, react_1.useState)(false);
-    return (react_1.default.createElement("div", { className: classes.container },
-        react_1.default.createElement(material_1.FormControl, { className: classes.formControl },
-            react_1.default.createElement(material_1.Button, { variant: "contained", onClick: () => {
-                    setShown(!shown);
-                } }, shown ? 'Hide feature sequence' : 'Show feature sequence')),
-        react_1.default.createElement(material_1.IconButton, { onClick: () => {
-                (0, util_1.getSession)(model).queueDialog(handleClose => [
-                    HelpDialog,
-                    { handleClose },
-                ]);
-            } },
-            react_1.default.createElement(Help_1.default, null)),
-        shown ? (react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement(ui_1.LoadingEllipses, null) },
-            react_1.default.createElement(SequenceFeatureDetails, { key: feature.uniqueId, model: model, feature: feature }))) : null));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: classes.container, children: [(0, jsx_runtime_1.jsx)(material_1.FormControl, { className: classes.formControl, children: (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
+                        setShown(!shown);
+                    }, children: shown ? 'Hide feature sequence' : 'Show feature sequence' }) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => {
+                    (0, util_1.getSession)(model).queueDialog(handleClose => [
+                        HelpDialog,
+                        {
+                            handleClose,
+                        },
+                    ]);
+                }, children: (0, jsx_runtime_1.jsx)(Help_1.default, {}) }), shown ? ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(ui_1.LoadingEllipses, {}), children: (0, jsx_runtime_1.jsx)(SequenceFeatureDetails, { model: model, feature: feature }, feature.uniqueId) })) : null] }));
 });
 exports.default = SequenceFeaturePanel;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceName.d.ts

@@ -0,0 +1,8 @@
+import type { SequenceFeatureDetailsModel } from './model';
+import type { SimpleFeatureSerialized } from '../../util';
+declare const SequenceName: ({ mode, model, feature, }: {
+    model: SequenceFeatureDetailsModel;
+    mode: string;
+    feature: SimpleFeatureSerialized;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SequenceName;

package/BaseFeatureWidget/SequenceFeatureDetails/SequenceName.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const mobx_react_1 = require("mobx-react");
+const util_1 = require("../../util");
+function getStrand(strand) {
+    if (strand === -1) {
+        return '(-)';
+    }
+    else if (strand === 1) {
+        return '(+)';
+    }
+    else {
+        return '';
+    }
+}
+const SequenceName = (0, mobx_react_1.observer)(function ({ mode, model, feature, }) {
+    return ((0, jsx_runtime_1.jsx)("div", { style: { background: 'white' }, children: `>${[
+            [feature.name || feature.id, mode].filter(f => !!f).join('-'),
+            `${feature.refName}:${(0, util_1.toLocale)(feature.start + 1)}-${(0, util_1.toLocale)(feature.end)}${getStrand(feature.strand)}`,
+            mode.endsWith('updownstream')
+                ? `+/- ${(0, util_1.toLocale)(model.upDownBp)} up/downstream bp`
+                : '',
+        ]
+            .filter(f => !!f)
+            .join(' ')}\n` }));
+});
+exports.default = SequenceName;

package/BaseFeatureWidget/SequenceFeatureDetails/SequencePanel.d.ts

@@ -1,11 +1,3 @@
-import React from 'react';
-import { SimpleFeatureSerialized } from '../../util';
-import { SeqState } from '../util';
-import { SequenceFeatureDetailsModel } from './model';
-interface SequencePanelProps {
-    sequence: SeqState;
-    feature: SimpleFeatureSerialized;
-    model: SequenceFeatureDetailsModel;
-}
-declare const SequencePanel: React.ForwardRefExoticComponent<SequencePanelProps & React.RefAttributes<HTMLDivElement>>;
+import type { SequencePanelProps } from './types';
+declare const SequencePanel: import("react").ForwardRefExoticComponent<SequencePanelProps & import("react").RefAttributes<HTMLDivElement>>;
 export default SequencePanel;

package/BaseFeatureWidget/SequenceFeatureDetails/SequencePanel.js

@@ -3,106 +3,32 @@ 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 jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const mobx_react_1 = require("mobx-react");
-// locals
-const util_1 = require("../../util");
-const util_2 = require("../util");
-// panel types
-const CDNASequence_1 = __importDefault(require("./seqtypes/CDNASequence"));
-const ProteinSequence_1 = __importDefault(require("./seqtypes/ProteinSequence"));
-const GenomicSequence_1 = __importDefault(require("./seqtypes/GenomicSequence"));
-const CDSSequence_1 = __importDefault(require("./seqtypes/CDSSequence"));
-function getStrand(strand) {
-    if (strand === -1) {
-        return '(-)';
-    }
-    else if (strand === 1) {
-        return '(+)';
-    }
-    else {
-        return '';
-    }
-}
+const SequenceContents_1 = __importDefault(require("./SequenceContents"));
+const SequenceName_1 = __importDefault(require("./SequenceName"));
 function WordWrap({ children }) {
-    return (react_1.default.createElement("pre", { style: {
-            /* raw styles instead of className so that html copy works */
+    return ((0, jsx_runtime_1.jsx)("pre", { style: {
             fontFamily: 'monospace',
             color: 'black',
             fontSize: 11,
-        } }, children));
+        }, children: children }));
 }
 function NoWordWrap({ children }) {
-    return (react_1.default.createElement("div", { style: {
-            /* raw styles instead of className so that html copy works */
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
             fontFamily: 'monospace',
             color: 'black',
             fontSize: 11,
             maxWidth: 600,
             whiteSpace: 'wrap',
             wordBreak: 'break-all',
-        } }, children));
+        }, children: children }));
 }
-const SequencePanel = (0, mobx_react_1.observer)(react_1.default.forwardRef(function S(props, ref) {
-    const { model, feature } = props;
+const SequencePanel = (0, mobx_react_1.observer)((0, react_1.forwardRef)(function S(props, ref) {
+    const { sequence, model, feature } = props;
     const { showCoordinates, mode } = model;
-    let { sequence: { seq, upstream = '', downstream = '' }, } = props;
-    const { subfeatures = [] } = feature;
-    const children = subfeatures
-        .sort((a, b) => a.start - b.start)
-        .map(sub => ({
-        ...sub,
-        start: sub.start - feature.start,
-        end: sub.end - feature.start,
-    }));
-    // we filter duplicate entries in cds and exon lists duplicate entries
-    // may be rare but was seen in Gencode v36 track NCList, likely a bug
-    // on GFF3 or probably worth ignoring here (produces broken protein
-    // translations if included)
-    //
-    // position 1:224,800,006..225,203,064 gene ENSG00000185842.15 first
-    // transcript ENST00000445597.6
-    //
-    // http://localhost:3000/?config=test_data%2Fconfig.json&session=share-FUl7G1isvF&password=HXh5Y
-    let cds = (0, util_2.dedupe)(children.filter(sub => sub.type === 'CDS'));
-    let utr = (0, util_2.dedupe)(children.filter(sub => { var _a; return (_a = sub.type) === null || _a === void 0 ? void 0 : _a.match(/utr/i); }));
-    let exons = (0, util_2.dedupe)(children.filter(sub => sub.type === 'exon'));
-    if (!utr.length && cds.length && exons.length) {
-        utr = (0, util_2.calculateUTRs)(cds, exons);
-    }
-    if (!utr.length && cds.length && !exons.length) {
-        utr = (0, util_2.calculateUTRs2)(cds, {
-            start: 0,
-            end: feature.end - feature.start,
-            type: 'gene',
-        });
-    }
-    if (feature.strand === -1) {
-        // doing this in a single assignment is needed because downstream and
-        // upstream are swapped so this avoids a temp variable
-        ;
-        [seq, upstream, downstream] = [
-            (0, util_1.revcom)(seq),
-            (0, util_1.revcom)(downstream),
-            (0, util_1.revcom)(upstream),
-        ];
-        cds = (0, util_2.revlist)(cds, seq.length);
-        exons = (0, util_2.revlist)(exons, seq.length);
-        utr = (0, util_2.revlist)(utr, seq.length);
-    }
-    const codonTable = (0, util_1.generateCodonTable)(util_1.defaultCodonTable);
     const Container = showCoordinates ? WordWrap : NoWordWrap;
-    return (react_1.default.createElement("div", { "data-testid": "sequence_panel", ref: ref, style: { maxHeight: 300, overflow: 'auto' } },
-        react_1.default.createElement(Container, null,
-            react_1.default.createElement("div", { style: { background: 'white' } }, `>${[
-                `${feature.name || feature.id}-${mode}`,
-                `${feature.refName}:${(0, util_1.toLocale)(feature.start + 1)}-${(0, util_1.toLocale)(feature.end)}${getStrand(feature.strand)}`,
-                mode.endsWith('updownstream')
-                    ? `+/- ${(0, util_1.toLocale)(model.upDownBp)} up/downstream bp`
-                    : '',
-            ]
-                .filter(f => !!f)
-                .join(' ')}\n`),
-            mode === 'genomic' ? (react_1.default.createElement(GenomicSequence_1.default, { feature: feature, model: model, sequence: seq })) : mode === 'genomic_sequence_updownstream' ? (react_1.default.createElement(GenomicSequence_1.default, { model: model, feature: feature, sequence: seq, upstream: upstream, downstream: downstream })) : mode === 'cds' ? (react_1.default.createElement(CDSSequence_1.default, { model: model, cds: cds, sequence: seq })) : mode === 'cdna' ? (react_1.default.createElement(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, utr: utr, sequence: seq })) : mode === 'protein' ? (react_1.default.createElement(ProteinSequence_1.default, { model: model, cds: cds, codonTable: codonTable, sequence: seq })) : mode === 'gene' ? (react_1.default.createElement(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, utr: utr, sequence: seq, includeIntrons: true })) : mode === 'gene_collapsed_intron' ? (react_1.default.createElement(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, includeIntrons: true, collapseIntron: true })) : mode === 'gene_updownstream' ? (react_1.default.createElement(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, upstream: upstream, downstream: downstream, includeIntrons: true })) : mode === 'gene_updownstream_collapsed_intron' ? (react_1.default.createElement(CDNASequence_1.default, { model: model, exons: exons, feature: feature, cds: cds, sequence: seq, utr: utr, upstream: upstream, downstream: downstream, includeIntrons: true, collapseIntron: true })) : (react_1.default.createElement("div", null, "Unknown type")))));
+    return ((0, jsx_runtime_1.jsx)("div", { "data-testid": "sequence_panel", ref: ref, style: { maxHeight: 300, overflow: 'auto' }, children: (0, jsx_runtime_1.jsxs)(Container, { children: [(0, jsx_runtime_1.jsx)(SequenceName_1.default, { model: model, mode: mode, feature: feature }), (0, jsx_runtime_1.jsx)(SequenceContents_1.default, { model: model, mode: mode, feature: feature, sequence: sequence })] }) }));
 }));
 exports.default = SequencePanel;

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/HelpDialog.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 export default function HelpDialog({ handleClose, }: {
     handleClose: () => void;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/HelpDialog.js

@@ -4,33 +4,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = HelpDialog;
-const react_1 = __importDefault(require("react"));
-const material_1 = require("@mui/material");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const ui_1 = require("@jbrowse/core/ui");
-// icons
 const Settings_1 = __importDefault(require("@mui/icons-material/Settings"));
+const material_1 = require("@mui/material");
 function HelpDialog({ handleClose, }) {
-    return (react_1.default.createElement(ui_1.Dialog, { maxWidth: "xl", open: true, onClose: () => {
+    return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { maxWidth: "xl", open: true, onClose: () => {
             handleClose();
-        }, title: "Feature sequence panel help" },
-        react_1.default.createElement(material_1.DialogContent, null,
-            react_1.default.createElement(material_1.Typography, { paragraph: true }, "The \"Feature sequence\" panel shows the underlying genomic sequence for a given feature, fetched from the reference genome."),
-            react_1.default.createElement(material_1.Typography, null, "For gene features, this panel does special calculations to e.g. stitch together the coding sequence, the options are:"),
-            react_1.default.createElement("ul", null,
-                react_1.default.createElement("li", null, "CDS - shows the stitched together CDS sequences"),
-                react_1.default.createElement("li", null, "Protein - the translated coding sequence, with the \"standard\" genetic code"),
-                react_1.default.createElement("li", null, "cDNA - shows the 'copy DNA' of transcript, formed from exon sequences"),
-                react_1.default.createElement("li", null, "Genomic w/ introns +/- Nbp up+down stream - the sequence underlying the entire gene including including introns, with UTR and CDS highlighted")),
-            react_1.default.createElement(material_1.Typography, { paragraph: true }, "For other feature types, the options are:"),
-            react_1.default.createElement("ul", null,
-                react_1.default.createElement("li", null, "Genomic +/- Nbp up+down stream - the reference genome sequence underlying the feature, with the up and downstream sequence")),
-            react_1.default.createElement(material_1.Typography, null,
-                "Note 1: you can use the \"gear icon\" ",
-                react_1.default.createElement(Settings_1.default, null),
-                " to edit the number of bp displayed up/downstream and in the intron region"),
-            react_1.default.createElement(material_1.Typography, null, "Note 2: The 'Copy HTML' function retains the colors from the sequence panel but cannot be pasted into some programs like notepad that only expect plain text.")),
-        react_1.default.createElement(material_1.DialogActions, null,
-            react_1.default.createElement(material_1.Button, { onClick: () => {
-                    handleClose();
-                }, autoFocus: true, variant: "contained" }, "Close"))));
+        }, title: "Feature sequence panel help", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { paragraph: true, children: "The \"Feature sequence\" panel shows the underlying genomic sequence for a given feature, fetched from the reference genome." }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: "For gene features, this panel does special calculations to e.g. stitch together the coding sequence, the options are:" }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "CDS - shows the stitched together CDS sequences" }), (0, jsx_runtime_1.jsx)("li", { children: "Protein - the translated coding sequence, with the \"standard\" genetic code" }), (0, jsx_runtime_1.jsx)("li", { children: "cDNA - shows the 'copy DNA' of transcript, formed from exon sequences" }), (0, jsx_runtime_1.jsx)("li", { children: "Genomic w/ introns +/- Nbp up+down stream - the sequence underlying the entire gene including including introns, with UTR and CDS highlighted" })] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { paragraph: true, children: "For other feature types, the options are:" }), (0, jsx_runtime_1.jsx)("ul", { children: (0, jsx_runtime_1.jsx)("li", { children: "Genomic +/- Nbp up+down stream - the reference genome sequence underlying the feature, with the up and downstream sequence" }) }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { children: ["Note 1: you can use the \"gear icon\" ", (0, jsx_runtime_1.jsx)(Settings_1.default, {}), " to edit the number of bp displayed up/downstream and in the intron region"] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Note 2: The 'Copy HTML' function retains the colors from the sequence panel but cannot be pasted into some programs like notepad that only expect plain text." })] }), (0, jsx_runtime_1.jsx)(material_1.DialogActions, { children: (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
+                        handleClose();
+                    }, autoFocus: true, variant: "contained", children: "Close" }) })] }));
 }

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/SequenceDialog.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
-import { SimpleFeatureSerialized } from '../../../util';
-import { BaseFeatureWidgetModel } from '../../stateModelFactory';
+import type { SimpleFeatureSerialized } from '../../../util';
+import type { BaseFeatureWidgetModel } from '../../stateModelFactory';
 declare const SequenceDialog: ({ handleClose, model, feature, }: {
     handleClose: () => void;
     feature: SimpleFeatureSerialized;
     model: BaseFeatureWidgetModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SequenceDialog;