@jbrowse/core 2.18.0 → 3.0.0

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/SequenceFeatureMenu.js

@@ -15,18 +15,29 @@ 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 MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
 const Settings_1 = __importDefault(require("@mui/icons-material/Settings"));
 const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
@@ -34,100 +45,97 @@ const file_saver_1 = require("file-saver");
 const mobx_react_1 = require("mobx-react");
 const CascadingMenuButton_1 = __importDefault(require("../../../ui/CascadingMenuButton"));
 const SequenceFeatureSettingsDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./SettingsDialog'))));
-const SequenceFeatureMenu = (0, mobx_react_1.observer)(react_1.default.forwardRef(function SequenceFeatureMenu2({ model, extraItems = [] }, ref) {
+const SequenceFeatureMenu = (0, mobx_react_1.observer)((0, react_1.forwardRef)(function SequenceFeatureMenu2({ model, extraItems = [] }, ref) {
     if (typeof ref === 'function') {
         throw new Error('needs a non function ref');
     }
     const [showSettings, setShowSettings] = (0, react_1.useState)(false);
     const { showCoordinatesSetting, showGenomicCoordsOption } = model;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(CascadingMenuButton_1.default, { menuItems: [
-                {
-                    label: 'Copy plaintext',
-                    onClick: () => {
-                        const r = ref === null || ref === void 0 ? void 0 : ref.current;
-                        if (r) {
-                            (0, copy_to_clipboard_1.default)(r.textContent || '', { format: 'text/plain' });
-                        }
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
+                    {
+                        label: 'Copy plaintext',
+                        onClick: () => {
+                            const r = ref === null || ref === void 0 ? void 0 : ref.current;
+                            if (r) {
+                                (0, copy_to_clipboard_1.default)(r.textContent || '', { format: 'text/plain' });
+                            }
+                        },
                     },
-                },
-                {
-                    label: 'Copy HTML',
-                    onClick: () => {
-                        const r = ref === null || ref === void 0 ? void 0 : ref.current;
-                        if (r) {
-                            (0, copy_to_clipboard_1.default)(r.outerHTML, { format: 'text/html' });
-                        }
+                    {
+                        label: 'Copy HTML',
+                        onClick: () => {
+                            const r = ref === null || ref === void 0 ? void 0 : ref.current;
+                            if (r) {
+                                (0, copy_to_clipboard_1.default)(r.outerHTML, { format: 'text/html' });
+                            }
+                        },
                     },
-                },
-                {
-                    label: 'Download plaintext',
-                    onClick: () => {
-                        const r = ref === null || ref === void 0 ? void 0 : ref.current;
-                        if (r) {
-                            (0, file_saver_1.saveAs)(new Blob([r.textContent || ''], {
-                                type: 'text/plain;charset=utf-8',
-                            }), 'sequence.txt');
-                        }
+                    {
+                        label: 'Download plaintext',
+                        onClick: () => {
+                            const r = ref === null || ref === void 0 ? void 0 : ref.current;
+                            if (r) {
+                                (0, file_saver_1.saveAs)(new Blob([r.textContent || ''], {
+                                    type: 'text/plain;charset=utf-8',
+                                }), 'sequence.txt');
+                            }
+                        },
                     },
-                },
-                {
-                    label: 'Download HTML',
-                    onClick: () => {
-                        const r = ref === null || ref === void 0 ? void 0 : ref.current;
-                        if (r) {
-                            (0, file_saver_1.saveAs)(new Blob([r.outerHTML || ''], {
-                                type: 'text/html;charset=utf-8',
-                            }), 'sequence.html');
-                        }
+                    {
+                        label: 'Download HTML',
+                        onClick: () => {
+                            const r = ref === null || ref === void 0 ? void 0 : ref.current;
+                            if (r) {
+                                (0, file_saver_1.saveAs)(new Blob([r.outerHTML || ''], {
+                                    type: 'text/html;charset=utf-8',
+                                }), 'sequence.html');
+                            }
+                        },
                     },
-                },
-                ...extraItems,
-                {
-                    label: 'Show coordinates?',
-                    type: 'subMenu',
-                    subMenu: [
-                        {
-                            label: 'No coordinates',
-                            type: 'radio',
-                            checked: showCoordinatesSetting === 'none',
-                            onClick: () => {
-                                model.setShowCoordinates('none');
+                    ...extraItems,
+                    {
+                        label: 'Show coordinates?',
+                        type: 'subMenu',
+                        subMenu: [
+                            {
+                                label: 'No coordinates',
+                                type: 'radio',
+                                checked: showCoordinatesSetting === 'none',
+                                onClick: () => {
+                                    model.setShowCoordinates('none');
+                                },
                             },
-                        },
-                        {
-                            label: 'Coordinates relative to feature start',
-                            type: 'radio',
-                            checked: showCoordinatesSetting === 'relative',
-                            onClick: () => {
-                                model.setShowCoordinates('relative');
+                            {
+                                label: 'Coordinates relative to feature start',
+                                type: 'radio',
+                                checked: showCoordinatesSetting === 'relative',
+                                onClick: () => {
+                                    model.setShowCoordinates('relative');
+                                },
                             },
-                        },
-                        ...(showGenomicCoordsOption
-                            ? [
-                                {
-                                    label: 'Coordinates relative to genome (only available for continuous genome based sequence types)',
-                                    type: 'radio',
-                                    checked: showCoordinatesSetting === 'genomic',
-                                    onClick: () => {
-                                        model.setShowCoordinates('genomic');
+                            ...(showGenomicCoordsOption
+                                ? [
+                                    {
+                                        label: 'Coordinates relative to genome (only available for continuous genome based sequence types)',
+                                        type: 'radio',
+                                        checked: showCoordinatesSetting === 'genomic',
+                                        onClick: () => {
+                                            model.setShowCoordinates('genomic');
+                                        },
                                     },
-                                },
-                            ]
-                            : []),
-                    ],
-                },
-                {
-                    label: 'Settings',
-                    icon: Settings_1.default,
-                    onClick: () => {
-                        setShowSettings(true);
+                                ]
+                                : []),
+                        ],
+                    },
+                    {
+                        label: 'Settings',
+                        icon: Settings_1.default,
+                        onClick: () => {
+                            setShowSettings(true);
+                        },
                     },
-                },
-            ] },
-            react_1.default.createElement(MoreVert_1.default, null)),
-        showSettings ? (react_1.default.createElement(SequenceFeatureSettingsDialog, { model: model, handleClose: () => {
-                setShowSettings(false);
-            } })) : null));
+                ], children: (0, jsx_runtime_1.jsx)(MoreVert_1.default, {}) }), showSettings ? ((0, jsx_runtime_1.jsx)(SequenceFeatureSettingsDialog, { model: model, handleClose: () => {
+                    setShowSettings(false);
+                } })) : null] }));
 }));
 exports.default = SequenceFeatureMenu;

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

@@ -1,6 +1,5 @@
-import React from 'react';
 import type { SequenceFeatureDetailsModel } from '../model';
 declare const SequenceTypeSelector: ({ model, }: {
     model: SequenceFeatureDetailsModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SequenceTypeSelector;

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/SequenceTypeSelector.js

@@ -1,9 +1,6 @@
 "use strict";
-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 material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
 const mui_1 = require("tss-react/mui");
@@ -16,55 +13,54 @@ const useStyles = (0, mui_1.makeStyles)()({
 const SequenceTypeSelector = (0, mobx_react_1.observer)(function ({ model, }) {
     const { classes } = useStyles();
     const { intronBp, upDownBp, mode, hasCDS, hasExonOrCDS } = model;
-    return (react_1.default.createElement(material_1.FormControl, { className: classes.formControl },
-        react_1.default.createElement(material_1.Select, { size: "small", value: mode, onChange: event => {
+    return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { className: classes.formControl, children: (0, jsx_runtime_1.jsx)(material_1.Select, { size: "small", value: mode, onChange: event => {
                 model.setMode(event.target.value);
-            } }, Object.entries({
-            ...(hasCDS
-                ? {
-                    cds: 'CDS',
-                }
-                : {}),
-            ...(hasCDS
-                ? {
-                    protein: 'Protein',
-                }
-                : {}),
-            ...(hasExonOrCDS
-                ? {
-                    cdna: 'cDNA',
-                }
-                : {}),
-            ...(hasExonOrCDS
-                ? {
-                    gene: 'Genomic w/ full introns',
-                }
-                : {}),
-            ...(hasExonOrCDS
-                ? {
-                    gene_updownstream: `Genomic w/ full introns +/- ${upDownBp}bp up+down stream`,
-                }
-                : {}),
-            ...(hasExonOrCDS
-                ? {
-                    gene_collapsed_intron: `Genomic w/ ${intronBp}bp intron`,
-                }
-                : {}),
-            ...(hasExonOrCDS
-                ? {
-                    gene_updownstream_collapsed_intron: `Genomic w/ ${intronBp}bp intron +/- ${upDownBp}bp up+down stream `,
-                }
-                : {}),
-            ...(!hasExonOrCDS
-                ? {
-                    genomic: 'Genomic',
-                }
-                : {}),
-            ...(!hasExonOrCDS
-                ? {
-                    genomic_sequence_updownstream: `Genomic +/- ${upDownBp}bp up+down stream`,
-                }
-                : {}),
-        }).map(([key, val]) => (react_1.default.createElement(material_1.MenuItem, { key: key, value: key }, val))))));
+            }, children: Object.entries({
+                ...(hasCDS
+                    ? {
+                        cds: 'CDS',
+                    }
+                    : {}),
+                ...(hasCDS
+                    ? {
+                        protein: 'Protein',
+                    }
+                    : {}),
+                ...(hasExonOrCDS
+                    ? {
+                        cdna: 'cDNA',
+                    }
+                    : {}),
+                ...(hasExonOrCDS
+                    ? {
+                        gene: 'Genomic w/ full introns',
+                    }
+                    : {}),
+                ...(hasExonOrCDS
+                    ? {
+                        gene_updownstream: `Genomic w/ full introns +/- ${upDownBp}bp up+down stream`,
+                    }
+                    : {}),
+                ...(hasExonOrCDS
+                    ? {
+                        gene_collapsed_intron: `Genomic w/ ${intronBp}bp intron`,
+                    }
+                    : {}),
+                ...(hasExonOrCDS
+                    ? {
+                        gene_updownstream_collapsed_intron: `Genomic w/ ${intronBp}bp intron +/- ${upDownBp}bp up+down stream `,
+                    }
+                    : {}),
+                ...(!hasExonOrCDS
+                    ? {
+                        genomic: 'Genomic',
+                    }
+                    : {}),
+                ...(!hasExonOrCDS
+                    ? {
+                        genomic_sequence_updownstream: `Genomic +/- ${upDownBp}bp up+down stream`,
+                    }
+                    : {}),
+            }).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: key, children: val }, key))) }) }));
 });
 exports.default = SequenceTypeSelector;

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

@@ -1,7 +1,6 @@
-import React from 'react';
 import type { SequenceFeatureDetailsModel } from '../model';
 declare const SequenceFeatureSettingsDialog: ({ handleClose, model, }: {
     handleClose: () => void;
     model: SequenceFeatureDetailsModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SequenceFeatureSettingsDialog;

package/BaseFeatureWidget/SequenceFeatureDetails/dialogs/SettingsDialog.js

@@ -1,29 +1,7 @@
 "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;
-};
 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 ui_1 = require("@jbrowse/core/ui");
 const material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
@@ -41,12 +19,10 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
     },
 }));
 function TextField2(props) {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(material_1.TextField, { ...props })));
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { ...props }) }));
 }
 function FormControl2({ children }) {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(material_1.FormControl, null, children)));
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.FormControl, { children: children }) }));
 }
 const SequenceFeatureSettingsDialog = (0, mobx_react_1.observer)(function ({ handleClose, model, }) {
     const { classes } = useStyles();
@@ -55,31 +31,20 @@ const SequenceFeatureSettingsDialog = (0, mobx_react_1.observer)(function ({ han
     const [upDownBp, setUpDownBp] = (0, react_1.useState)(`${model.upDownBp}`);
     const intronBpValid = !Number.isNaN(+intronBp);
     const upDownBpValid = !Number.isNaN(+upDownBp);
-    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 settings" },
-        react_1.default.createElement(material_1.DialogContent, { className: classes.dialogContent },
-            react_1.default.createElement(TextField2, { label: "Number of intronic bases around splice site to display", className: classes.formElt, value: intronBp, helperText: !intronBpValid ? 'Not a number' : '', error: !intronBpValid, onChange: event => {
-                    setIntronBp(event.target.value);
-                } }),
-            react_1.default.createElement(TextField2, { label: "Number of bases up/down stream of feature to display", className: classes.formElt, value: upDownBp, helperText: !upDownBpValid ? 'Not a number' : '', error: !upDownBpValid, onChange: event => {
-                    setUpDownBp(event.target.value);
-                } }),
-            react_1.default.createElement(FormControl2, null,
-                react_1.default.createElement(material_1.FormLabel, null, "Sequence capitalization"),
-                react_1.default.createElement(material_1.RadioGroup, { value: upperCaseCDS ? 'cds' : 'unchanged', onChange: e => {
-                        model.setUpperCaseCDS(e.target.value === 'cds');
-                    } },
-                    react_1.default.createElement(material_1.FormControlLabel, { value: "cds", control: react_1.default.createElement(material_1.Radio, { className: classes.root, size: "small" }), label: "Capitalize CDS and lower case everything else" }),
-                    react_1.default.createElement(material_1.FormControlLabel, { value: "unchanged", control: react_1.default.createElement(material_1.Radio, { className: classes.root, size: "small" }), label: "Capitalization from reference genome sequence" })))),
-        react_1.default.createElement(material_1.DialogActions, null,
-            react_1.default.createElement(material_1.Button, { onClick: () => {
-                    model.setIntronBp(+intronBp);
-                    model.setUpDownBp(+upDownBp);
-                    handleClose();
-                }, disabled: !intronBpValid || !upDownBpValid, color: "primary", variant: "contained" }, "Submit"),
-            react_1.default.createElement(material_1.Button, { onClick: () => {
-                    handleClose();
-                }, color: "secondary", autoFocus: true, variant: "contained" }, "Cancel"))));
+        }, title: "Feature sequence settings", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { className: classes.dialogContent, children: [(0, jsx_runtime_1.jsx)(TextField2, { label: "Number of intronic bases around splice site to display", className: classes.formElt, value: intronBp, helperText: !intronBpValid ? 'Not a number' : '', error: !intronBpValid, onChange: event => {
+                            setIntronBp(event.target.value);
+                        } }), (0, jsx_runtime_1.jsx)(TextField2, { label: "Number of bases up/down stream of feature to display", className: classes.formElt, value: upDownBp, helperText: !upDownBpValid ? 'Not a number' : '', error: !upDownBpValid, onChange: event => {
+                            setUpDownBp(event.target.value);
+                        } }), (0, jsx_runtime_1.jsxs)(FormControl2, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: "Sequence capitalization" }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, { value: upperCaseCDS ? 'cds' : 'unchanged', onChange: e => {
+                                    model.setUpperCaseCDS(e.target.value === 'cds');
+                                }, children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: "cds", control: (0, jsx_runtime_1.jsx)(material_1.Radio, { className: classes.root, size: "small" }), label: "Capitalize CDS and lower case everything else" }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: "unchanged", control: (0, jsx_runtime_1.jsx)(material_1.Radio, { className: classes.root, size: "small" }), label: "Capitalization from reference genome sequence" })] })] })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
+                            model.setIntronBp(+intronBp);
+                            model.setUpDownBp(+upDownBp);
+                            handleClose();
+                        }, disabled: !intronBpValid || !upDownBpValid, color: "primary", variant: "contained", children: "Submit" }), (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
+                            handleClose();
+                        }, color: "secondary", autoFocus: true, variant: "contained", children: "Cancel" })] })] }));
 });
 exports.default = SequenceFeatureSettingsDialog;

package/BaseFeatureWidget/SequenceFeatureDetails/model.js

@@ -4,13 +4,6 @@ exports.SequenceFeatureDetailsF = SequenceFeatureDetailsF;
 const mobx_1 = require("mobx");
 const mobx_state_tree_1 = require("mobx-state-tree");
 const util_1 = require("../../util");
-function localStorageGetNumber(key, defaultVal) {
-    var _a;
-    return +((_a = (0, util_1.localStorageGetItem)(key)) !== null && _a !== void 0 ? _a : defaultVal);
-}
-function localStorageGetBoolean(key, defaultVal) {
-    return Boolean(JSON.parse((0, util_1.localStorageGetItem)(key) || JSON.stringify(defaultVal)));
-}
 function localStorageSetNumber(key, value) {
     (0, util_1.localStorageSetItem)(key, JSON.stringify(value));
 }
@@ -23,9 +16,9 @@ function SequenceFeatureDetailsF() {
         .model('SequenceFeatureDetails')
         .volatile(() => ({
         showCoordinatesSetting: (0, util_1.localStorageGetItem)(`${p}-showCoordinatesSetting`) || 'none',
-        intronBp: localStorageGetNumber(`${p}-intronBp`, 10),
-        upDownBp: localStorageGetNumber(`${p}-upDownBp`, 100),
-        upperCaseCDS: localStorageGetBoolean(`${p}-upperCaseCDS`, true),
+        intronBp: (0, util_1.localStorageGetNumber)(`${p}-intronBp`, 10),
+        upDownBp: (0, util_1.localStorageGetNumber)(`${p}-upDownBp`, 100),
+        upperCaseCDS: (0, util_1.localStorageGetBoolean)(`${p}-upperCaseCDS`, true),
         charactersPerRow: 100,
         feature: undefined,
         mode: '',

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/CDNASequence.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { SimpleFeatureSerialized } from '../../../util';
 import type { Feat } from '../../util';
 import type { SequenceFeatureDetailsModel } from '../model';
@@ -13,5 +12,5 @@ declare const CDNASequence: ({ utr, cds, exons, sequence, upstream, downstream,
     includeIntrons?: boolean;
     collapseIntron?: boolean;
     model: SequenceFeatureDetailsModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default CDNASequence;

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/CDNASequence.js

@@ -3,7 +3,7 @@ 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 mobx_react_1 = require("mobx-react");
 const util_1 = require("../util");
 const SequenceDisplay_1 = __importDefault(require("./SequenceDisplay"));
@@ -31,7 +31,7 @@ const CDNASequence = (0, mobx_react_1.observer)(function ({ utr, cds, exons, seq
             charactersPerRow,
             showCoordinates,
         });
-        upstreamChunk = (react_1.default.createElement(SequenceDisplay_1.default, { model: model, color: util_1.updownstreamColor, strand: mult, start: currStart, coordStart: coordStart, chunks: segments }));
+        upstreamChunk = ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, color: util_1.updownstreamColor, strand: mult, start: currStart, coordStart: coordStart, chunks: segments }));
         currRemainder = remainder;
         currStart = currStart + upstream.length * mult;
         coordStart = coordStart + upstream.length * mult;
@@ -51,7 +51,7 @@ const CDNASequence = (0, mobx_react_1.observer)(function ({ utr, cds, exons, seq
             currRemainder,
             showCoordinates,
         });
-        middleChunks.push(react_1.default.createElement(SequenceDisplay_1.default, { key: `${JSON.stringify(chunk)}-mid`, model: model, color: chunk.type === 'CDS' ? util_1.cdsColor : util_1.utrColor, strand: mult, start: currStart, coordStart: coordStart, chunks: segments }));
+        middleChunks.push((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, color: chunk.type === 'CDS' ? util_1.cdsColor : util_1.utrColor, strand: mult, start: currStart, coordStart: coordStart, chunks: segments }, `${JSON.stringify(chunk)}-mid`));
         currRemainder = remainder;
         currStart = currStart + s.length * mult;
         coordStart = coordStart + s.length * mult;
@@ -66,7 +66,7 @@ const CDNASequence = (0, mobx_react_1.observer)(function ({ utr, cds, exons, seq
                 showCoordinates,
             });
             if (segments.length) {
-                middleChunks.push(react_1.default.createElement(SequenceDisplay_1.default, { key: `${JSON.stringify(chunk)}-intron`, model: model, strand: mult, coordStart: coordStart, start: currStart, chunks: segments }));
+                middleChunks.push((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, strand: mult, coordStart: coordStart, start: currStart, chunks: segments }, `${JSON.stringify(chunk)}-intron`));
                 currRemainder = remainder;
                 currStart = currStart + str.length * mult;
                 coordStart = coordStart + str.length * mult;
@@ -81,11 +81,8 @@ const CDNASequence = (0, mobx_react_1.observer)(function ({ utr, cds, exons, seq
             currRemainder,
             showCoordinates,
         });
-        downstreamChunk = (react_1.default.createElement(SequenceDisplay_1.default, { start: currStart, model: model, strand: mult, chunks: segments, coordStart: coordStart, color: util_1.updownstreamColor }));
+        downstreamChunk = ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { start: currStart, model: model, strand: mult, chunks: segments, coordStart: coordStart, color: util_1.updownstreamColor }));
     }
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        upstreamChunk,
-        middleChunks,
-        downstreamChunk));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [upstreamChunk, middleChunks, downstreamChunk] }));
 });
 exports.default = CDNASequence;

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/CDSSequence.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import type { Feat } from '../../util';
 import type { SequenceFeatureDetailsModel } from '../model';
 declare const CDSSequence: ({ cds, sequence, model, }: {
     cds: Feat[];
     sequence: string;
     model: SequenceFeatureDetailsModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default CDSSequence;

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/CDSSequence.js

@@ -3,7 +3,7 @@ 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 mobx_react_1 = require("mobx-react");
 const util_1 = require("../../util");
 const util_2 = require("../util");
@@ -15,6 +15,6 @@ const CDSSequence = (0, mobx_react_1.observer)(function ({ cds, sequence, model,
         charactersPerRow,
         showCoordinates,
     });
-    return (react_1.default.createElement(SequenceDisplay_1.default, { model: model, color: util_2.cdsColor, chunks: segments, start: 0 }));
+    return ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, color: util_2.cdsColor, chunks: segments, start: 0 }));
 });
 exports.default = CDSSequence;

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/GenomicSequence.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { SimpleFeatureSerialized } from '../../../util';
 import type { SequenceFeatureDetailsModel } from '../model';
 declare const GenomicSequence: ({ sequence, upstream, feature, downstream, model, }: {
@@ -7,5 +6,5 @@ declare const GenomicSequence: ({ sequence, upstream, feature, downstream, model
     upstream?: string;
     downstream?: string;
     model: SequenceFeatureDetailsModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default GenomicSequence;

package/BaseFeatureWidget/SequenceFeatureDetails/seqtypes/GenomicSequence.js

@@ -3,7 +3,7 @@ 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 mobx_react_1 = require("mobx-react");
 const util_1 = require("../util");
 const SequenceDisplay_1 = __importDefault(require("./SequenceDisplay"));
@@ -26,7 +26,7 @@ const GenomicSequence = (0, mobx_react_1.observer)(function ({ sequence, upstrea
             charactersPerRow,
             showCoordinates,
         });
-        upstreamChunk = (react_1.default.createElement(SequenceDisplay_1.default, { model: model, color: util_1.updownstreamColor, start: currStart, coordStart: coordStart, chunks: segments }));
+        upstreamChunk = ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, color: util_1.updownstreamColor, start: currStart, coordStart: coordStart, chunks: segments }));
         currRemainder = remainder;
         currStart = currStart + upstream.length * mult;
         coordStart = coordStart + upstream.length * mult;
@@ -37,7 +37,7 @@ const GenomicSequence = (0, mobx_react_1.observer)(function ({ sequence, upstrea
         showCoordinates,
         currRemainder,
     });
-    const middleChunk = (react_1.default.createElement(SequenceDisplay_1.default, { model: model, color: util_1.genomeColor, start: currStart, coordStart: coordStart, chunks: segments }));
+    const middleChunk = ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { model: model, color: util_1.genomeColor, start: currStart, coordStart: coordStart, chunks: segments }));
     currRemainder = remainder;
     currStart += sequence.length * mult;
     coordStart = coordStart + sequence.length * mult;
@@ -49,11 +49,8 @@ const GenomicSequence = (0, mobx_react_1.observer)(function ({ sequence, upstrea
             currRemainder,
             showCoordinates,
         });
-        downstreamChunk = (react_1.default.createElement(SequenceDisplay_1.default, { start: currStart, model: model, chunks: segments, coordStart: coordStart, color: util_1.updownstreamColor }));
+        downstreamChunk = ((0, jsx_runtime_1.jsx)(SequenceDisplay_1.default, { start: currStart, model: model, chunks: segments, coordStart: coordStart, color: util_1.updownstreamColor }));
     }
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        upstreamChunk,
-        middleChunk,
-        downstreamChunk));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [upstreamChunk, middleChunk, downstreamChunk] }));
 });
 exports.default = GenomicSequence;