@jbrowse/plugin-linear-comparative-view 2.17.0 → 3.0.0

package/dist/LGVSyntenyDisplay/model.js

@@ -15,13 +15,23 @@ 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;
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = require("react");
 const configuration_1 = require("@jbrowse/core/configuration");
@@ -29,32 +39,15 @@ const util_1 = require("@jbrowse/core/util");
 const plugin_alignments_1 = require("@jbrowse/plugin-alignments");
 const mobx_state_tree_1 = require("mobx-state-tree");
 const LaunchSyntenyViewDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/LaunchSyntenyViewDialog'))));
-/**
- * #stateModel LGVSyntenyDisplay
- * displays location of "synteny" feature in a plain LGV, allowing linking out
- * to external synteny views
- *
- * extends
- * - [SharedLinearPileupDisplayMixin](../sharedlinearpileupdisplaymixin)
- */
 function stateModelFactory(schema) {
     return mobx_state_tree_1.types
         .compose('LGVSyntenyDisplay', (0, plugin_alignments_1.SharedLinearPileupDisplayMixin)(schema), mobx_state_tree_1.types.model({
-        /**
-         * #property
-         */
         type: mobx_state_tree_1.types.literal('LGVSyntenyDisplay'),
-        /**
-         * #property
-         */
         configuration: (0, configuration_1.ConfigurationReference)(schema),
     }))
         .views(self => {
         const superContextMenuItems = self.contextMenuItems;
         return {
-            /**
-             * #method
-             */
             contextMenuItems() {
                 const feature = self.contextMenuFeature;
                 return [
@@ -67,9 +60,10 @@ function stateModelFactory(schema) {
                                     (0, util_1.getSession)(self).queueDialog(handleClose => [
                                         LaunchSyntenyViewDialog,
                                         {
-                                            model: self,
+                                            view: (0, util_1.getContainingView)(self),
                                             trackId: (0, configuration_1.getConf)((0, util_1.getContainingTrack)(self), 'trackId'),
                                             handleClose,
+                                            session: (0, util_1.getSession)(self),
                                             feature,
                                         },
                                     ]);
@@ -84,9 +78,6 @@ function stateModelFactory(schema) {
         .views(self => {
         const { trackMenuItems: superTrackMenuItems, colorSchemeSubMenuItems: superColorSchemeSubMenuItems, } = self;
         return {
-            /**
-             * #method
-             */
             trackMenuItems() {
                 return [
                     ...superTrackMenuItems(),
@@ -99,9 +90,6 @@ function stateModelFactory(schema) {
         };
     })
         .actions(self => ({
-        /**
-         * #action
-         */
         selectFeature(feature) {
             const session = (0, util_1.getSession)(self);
             if ((0, util_1.isSessionModelWithWidgets)(session)) {
@@ -121,12 +109,7 @@ function stateModelFactory(schema) {
             session.setSelection(feature);
         },
         afterCreate() {
-            // use color by stand to help indicate inversions better on first load,
-            // otherwise use selected orientation
-            if (self.colorBy) {
-                self.setColorScheme({ ...self.colorBy });
-            }
-            else {
+            if (!self.colorBySetting && self.colorBy.type === 'normal') {
                 self.setColorScheme({ type: 'strand' });
             }
         },

package/dist/LaunchLinearSyntenyView.d.ts

@@ -1,2 +1,2 @@
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 export default function LaunchLinearSyntenyView(pluginManager: PluginManager): void;

package/dist/LaunchLinearSyntenyView.js

@@ -7,9 +7,7 @@ function makeMultiDimArray(str) {
     return Array.isArray(str[0]) ? str : [str];
 }
 function LaunchLinearSyntenyView(pluginManager) {
-    pluginManager.addToExtensionPoint('LaunchView-LinearSyntenyView', 
-    // @ts-expect-error
-    async ({ session, views, tracks = [], }) => {
+    pluginManager.addToExtensionPoint('LaunchView-LinearSyntenyView', async ({ session, views, tracks = [], }) => {
         try {
             const { assemblyManager } = session;
             const model = session.addView('LinearSyntenyView', {});

package/dist/LinearComparativeDisplay/configSchemaF.d.ts

@@ -1,5 +1,2 @@
-/**
- * #config LinearComparativeDisplay
- */
 declare function configSchemaFactory(_pluginManager: any): import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 export default configSchemaFactory;

package/dist/LinearComparativeDisplay/configSchemaF.js

@@ -1,15 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-/**
- * #config LinearComparativeDisplay
- */
 function configSchemaFactory(_pluginManager) {
     return (0, configuration_1.ConfigurationSchema)('LinearComparativeDisplay', {}, {
         explicitlyTyped: true,
-        /**
-         * #identifier
-         */
         explicitIdentifier: 'displayId',
     });
 }

package/dist/LinearComparativeDisplay/index.d.ts

@@ -1,2 +1,2 @@
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 export default function LinearComparativeDisplayF(pluginManager: PluginManager): void;

package/dist/LinearComparativeDisplay/stateModelFactory.d.ts

@@ -1,23 +1,12 @@
-import { AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
-import { Instance } from 'mobx-state-tree';
-import { Feature } from '@jbrowse/core/util';
-/**
- * #stateModel LinearComparativeDisplay
- * extends
- * - [BaseDisplay](../basedisplay)
- */
+import type { AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
+import type { Feature } from '@jbrowse/core/util';
+import type { Instance } from 'mobx-state-tree';
 declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): import("mobx-state-tree").IModelType<{
     id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
     type: import("mobx-state-tree").ISimpleType<string>;
     rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
 } & {
-    /**
-     * #property
-     */
     type: import("mobx-state-tree").ISimpleType<"LinearComparativeDisplay">;
-    /**
-     * #property
-     */
     configuration: AnyConfigurationSchemaType;
 }, {
     rendererTypeName: string;
@@ -43,10 +32,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
         onHorizontalScroll?: () => void;
-        blockState? /**
-         * #action
-         * controlled by a reaction
-         */: Record<string, any>;
+        blockState?: Record<string, any>;
     }>;
     readonly DisplayBlurb: React.FC<{
         model: {
@@ -58,10 +44,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IModelType<{
-            id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree" /**
-             * #action
-             * controlled by a reaction
-             */).ISimpleType<string>, [undefined]>;
+            id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
             type: import("mobx-state-tree").ISimpleType<string>;
             rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         }, {
@@ -84,21 +67,12 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     setRpcDriverName(rpcDriverName: string): void;
     reload(): void;
 } & {
-    renderInProgress: AbortController | undefined;
+    renderInProgress: string | undefined;
     features: Feature[] | undefined;
     message: string | undefined;
 } & {
-    /**
-     * #getter
-     */
     readonly level: number;
-    /**
-     * #getter
-     */
     readonly height: number;
-    /**
-     * #getter
-     */
     renderProps(): {
         rpcDriverName: string | undefined;
         displayModel: {
@@ -140,10 +114,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                     message: string | undefined;
                 }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
                 onHorizontalScroll?: () => void;
-                blockState? /**
-                 * #action
-                 * controlled by a reaction
-                 */: Record<string, any>;
+                blockState?: Record<string, any>;
             }>;
             readonly DisplayBlurb: React.FC<{
                 model: {
@@ -155,10 +126,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                     error: unknown;
                     message: string | undefined;
                 } & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IModelType<{
-                    id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree" /**
-                     * #action
-                     * controlled by a reaction
-                     */).ISimpleType<string>, [undefined]>;
+                    id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
                     type: import("mobx-state-tree").ISimpleType<string>;
                     rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
                 }, {
@@ -181,7 +149,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             setRpcDriverName(rpcDriverName: string): void;
             reload(): void;
         } & {
-            renderInProgress: AbortController | undefined;
+            renderInProgress: string | undefined;
             features: Feature[] | undefined;
             message: string | undefined;
         } & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IModelType<{
@@ -189,13 +157,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             type: import("mobx-state-tree").ISimpleType<string>;
             rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         } & {
-            /**
-             * #property
-             */
             type: import("mobx-state-tree").ISimpleType<"LinearComparativeDisplay">;
-            /**
-             * #property
-             */
             configuration: AnyConfigurationSchemaType;
         }, {
             rendererTypeName: string;
@@ -221,10 +183,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                     message: string | undefined;
                 }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
                 onHorizontalScroll?: () => void;
-                blockState? /**
-                 * #action
-                 * controlled by a reaction
-                 */: Record<string, any>;
+                blockState?: Record<string, any>;
             }>;
             readonly DisplayBlurb: React.FC<{
                 model: {
@@ -259,34 +218,18 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             setRpcDriverName(rpcDriverName: string): void;
             reload(): void;
         } & {
-            renderInProgress: AbortController | undefined;
+            renderInProgress: string | undefined;
             features: Feature[] | undefined;
             message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
         highResolutionScaling: number;
     };
 } & {
-    /**
-     * #action
-     * controlled by a reaction
-     */
-    setLoading(abortController: AbortController): void;
-    /**
-     * #action
-     * controlled by a reaction
-     */
+    setLoading(newStopToken: string): void;
     setMessage(messageText: string): void;
-    /**
-     * #action
-     * controlled by a reaction
-     */
     setRendered(args?: {
         features: Feature[];
     }): void;
-    /**
-     * #action
-     * controlled by a reaction
-     */
     setError(error: unknown): void;
 } & {
     afterAttach(): void;

package/dist/LinearComparativeDisplay/stateModelFactory.js

@@ -1,48 +1,29 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-const mobx_state_tree_1 = require("mobx-state-tree");
+const models_1 = require("@jbrowse/core/pluggableElementTypes/models");
 const util_1 = require("@jbrowse/core/util");
+const stopToken_1 = require("@jbrowse/core/util/stopToken");
 const tracks_1 = require("@jbrowse/core/util/tracks");
-const models_1 = require("@jbrowse/core/pluggableElementTypes/models");
-/**
- * #stateModel LinearComparativeDisplay
- * extends
- * - [BaseDisplay](../basedisplay)
- */
+const mobx_state_tree_1 = require("mobx-state-tree");
 function stateModelFactory(configSchema) {
     return mobx_state_tree_1.types
         .compose('LinearComparativeDisplay', models_1.BaseDisplay, mobx_state_tree_1.types.model({
-        /**
-         * #property
-         */
         type: mobx_state_tree_1.types.literal('LinearComparativeDisplay'),
-        /**
-         * #property
-         */
         configuration: (0, configuration_1.ConfigurationReference)(configSchema),
     }))
-        .volatile(( /* self */) => ({
+        .volatile(() => ({
         renderInProgress: undefined,
         features: undefined,
         message: undefined,
     }))
         .views(self => ({
-        /**
-         * #getter
-         */
         get level() {
             return (0, mobx_state_tree_1.getParent)(self, 4).level;
         },
-        /**
-         * #getter
-         */
         get height() {
             return (0, mobx_state_tree_1.getParent)(self, 4).height;
         },
-        /**
-         * #getter
-         */
         renderProps() {
             return {
                 rpcDriverName: self.rpcDriverName,
@@ -52,33 +33,18 @@ function stateModelFactory(configSchema) {
         },
     }))
         .actions(self => {
-        let renderInProgress;
+        let stopToken;
         return {
-            /**
-             * #action
-             * controlled by a reaction
-             */
-            setLoading(abortController) {
+            setLoading(newStopToken) {
                 self.message = undefined;
                 self.error = undefined;
-                renderInProgress = abortController;
+                stopToken = newStopToken;
             },
-            /**
-             * #action
-             * controlled by a reaction
-             */
             setMessage(messageText) {
-                if (renderInProgress && !renderInProgress.signal.aborted) {
-                    renderInProgress.abort();
-                }
                 self.message = messageText;
                 self.error = undefined;
-                renderInProgress = undefined;
+                stopToken = undefined;
             },
-            /**
-             * #action
-             * controlled by a reaction
-             */
             setRendered(args) {
                 if (!args) {
                     return;
@@ -103,34 +69,27 @@ function stateModelFactory(configSchema) {
                 }
                 self.message = undefined;
                 self.error = undefined;
-                renderInProgress = undefined;
+                stopToken = undefined;
                 if (foundNewFeatureNotInExistingMap ||
                     foundExistingFeatureNotInNewMap ||
                     !self.features) {
                     self.features = features;
                 }
             },
-            /**
-             * #action
-             * controlled by a reaction
-             */
             setError(error) {
                 console.error(error);
-                if (renderInProgress && !renderInProgress.signal.aborted) {
-                    renderInProgress.abort();
+                if (stopToken !== undefined) {
+                    (0, stopToken_1.stopStopToken)(stopToken);
                 }
-                // the rendering failed for some reason
                 self.message = undefined;
                 self.error = error;
-                renderInProgress = undefined;
+                stopToken = undefined;
             },
         };
     })
         .actions(self => ({
         afterAttach() {
-            (0, util_1.makeAbortableReaction)(
-            // @ts-expect-error
-            self, renderBlockData, renderBlockEffect, {
+            (0, util_1.makeAbortableReaction)(self, renderBlockData, renderBlockEffect, {
                 name: `${self.type} ${self.id} rendering`,
                 delay: 1000,
                 fireImmediately: true,
@@ -141,9 +100,6 @@ function stateModelFactory(configSchema) {
 function renderBlockData(self) {
     const { rpcManager } = (0, util_1.getSession)(self);
     const display = self;
-    // Alternative to readConfObject(config) is below used because
-    // renderProps is something under our control.  Compare to
-    // serverSideRenderedBlock
     (0, configuration_1.readConfObject)(self.configuration);
     const { level, adapterConfig } = self;
     const parent = (0, util_1.getContainingView)(self);

package/dist/LinearComparativeView/components/Header.d.ts

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

package/dist/LinearComparativeView/components/Header.js

@@ -1,40 +1,17 @@
 "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 = __importStar(require("react"));
-const mobx_react_1 = require("mobx-react");
-const material_1 = require("@mui/material");
-const mui_1 = require("tss-react/mui");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const CascadingMenuButton_1 = __importDefault(require("@jbrowse/core/ui/CascadingMenuButton"));
-// icons
+const Icons_1 = require("@jbrowse/core/ui/Icons");
 const MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
 const Search_1 = __importDefault(require("@mui/icons-material/Search"));
-const Icons_1 = require("@jbrowse/core/ui/Icons");
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const mui_1 = require("tss-react/mui");
 const HeaderSearchBoxes_1 = __importDefault(require("./HeaderSearchBoxes"));
 const useStyles = (0, mui_1.makeStyles)()({
     inline: {
@@ -46,67 +23,60 @@ const Header = (0, mobx_react_1.observer)(function ({ model, }) {
     const { views } = model;
     const [showSearchBoxes, setShowSearchBoxes] = (0, react_1.useState)(views.length <= 3);
     const [sideBySide, setSideBySide] = (0, react_1.useState)(views.length <= 3);
-    return (react_1.default.createElement(material_1.FormGroup, { row: true },
-        react_1.default.createElement(CascadingMenuButton_1.default, { menuItems: [
-                {
-                    label: 'Synteny track selectors',
-                    type: 'subMenu',
-                    subMenu: views.slice(0, -1).map((_, idx) => ({
-                        label: `Row ${idx + 1}->${idx + 2} (${views[idx].assemblyNames.join(',')}->${views[idx + 1].assemblyNames.join(',')})`,
+    return ((0, jsx_runtime_1.jsxs)(material_1.FormGroup, { row: true, children: [(0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
+                    {
+                        label: 'Synteny track selectors',
+                        type: 'subMenu',
+                        subMenu: views.slice(0, -1).map((_, idx) => ({
+                            label: `Row ${idx + 1}->${idx + 2} (${views[idx].assemblyNames.join(',')}->${views[idx + 1].assemblyNames.join(',')})`,
+                            onClick: () => {
+                                model.activateTrackSelector(idx);
+                            },
+                        })),
+                    },
+                    {
+                        label: 'Row track selectors',
+                        type: 'subMenu',
+                        subMenu: views.map((view, idx) => ({
+                            label: `Row ${idx + 1} track selector (${view.assemblyNames.join(',')})`,
+                            onClick: () => view.activateTrackSelector(),
+                        })),
+                    },
+                ], children: (0, jsx_runtime_1.jsx)(Icons_1.TrackSelector, {}) }), (0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
+                    {
+                        label: 'Row view menus',
+                        type: 'subMenu',
+                        subMenu: views.map((view, idx) => ({
+                            label: `View ${idx + 1} Menu`,
+                            subMenu: view.menuItems(),
+                        })),
+                    },
+                    ...model.headerMenuItems(),
+                ], children: (0, jsx_runtime_1.jsx)(MoreVert_1.default, {}) }), (0, jsx_runtime_1.jsx)(CascadingMenuButton_1.default, { menuItems: [
+                    {
+                        label: 'Show search boxes',
+                        type: 'checkbox',
+                        checked: showSearchBoxes,
                         onClick: () => {
-                            model.activateTrackSelector(idx);
+                            setShowSearchBoxes(!showSearchBoxes);
                         },
-                    })),
-                },
-                {
-                    label: 'Row track selectors',
-                    type: 'subMenu',
-                    subMenu: views.map((view, idx) => ({
-                        label: `Row ${idx + 1} track selector (${view.assemblyNames.join(',')})`,
-                        onClick: () => view.activateTrackSelector(),
-                    })),
-                },
-            ] },
-            react_1.default.createElement(Icons_1.TrackSelector, null)),
-        react_1.default.createElement(CascadingMenuButton_1.default, { menuItems: [
-                {
-                    label: 'Row view menus',
-                    type: 'subMenu',
-                    subMenu: views.map((view, idx) => ({
-                        label: `View ${idx + 1} Menu`,
-                        subMenu: view.menuItems(),
-                    })),
-                },
-                ...model.headerMenuItems(),
-            ] },
-            react_1.default.createElement(MoreVert_1.default, null)),
-        react_1.default.createElement(CascadingMenuButton_1.default, { menuItems: [
-                {
-                    label: 'Show search boxes',
-                    type: 'checkbox',
-                    checked: showSearchBoxes,
-                    onClick: () => {
-                        setShowSearchBoxes(!showSearchBoxes);
                     },
-                },
-                {
-                    label: 'Orientation - Side-by-side',
-                    type: 'radio',
-                    checked: sideBySide,
-                    onClick: () => {
-                        setSideBySide(!sideBySide);
+                    {
+                        label: 'Orientation - Side-by-side',
+                        type: 'radio',
+                        checked: sideBySide,
+                        onClick: () => {
+                            setSideBySide(!sideBySide);
+                        },
                     },
-                },
-                {
-                    label: 'Orientation - Vertical',
-                    type: 'radio',
-                    checked: !sideBySide,
-                    onClick: () => {
-                        setSideBySide(!sideBySide);
+                    {
+                        label: 'Orientation - Vertical',
+                        type: 'radio',
+                        checked: !sideBySide,
+                        onClick: () => {
+                            setSideBySide(!sideBySide);
+                        },
                     },
-                },
-            ] },
-            react_1.default.createElement(Search_1.default, null)),
-        showSearchBoxes ? (react_1.default.createElement("span", { className: sideBySide ? classes.inline : undefined }, views.map(view => (react_1.default.createElement(HeaderSearchBoxes_1.default, { key: view.id, view: view }))))) : null));
+                ], children: (0, jsx_runtime_1.jsx)(Search_1.default, {}) }), showSearchBoxes ? ((0, jsx_runtime_1.jsx)("span", { className: sideBySide ? classes.inline : undefined, children: views.map(view => ((0, jsx_runtime_1.jsx)(HeaderSearchBoxes_1.default, { view: view }, view.id))) })) : null] }));
 });
 exports.default = Header;

package/dist/LinearComparativeView/components/HeaderSearchBoxes.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
-import { LinearGenomeViewModel } from '@jbrowse/plugin-linear-genome-view';
+import type { LinearGenomeViewModel } from '@jbrowse/plugin-linear-genome-view';
 declare const HeaderSearchBoxes: ({ view, }: {
     view: LinearGenomeViewModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default HeaderSearchBoxes;