@jbrowse/plugin-linear-comparative-view 2.14.0 → 2.15.1

package/dist/LGVSyntenyDisplay/model.d.ts

@@ -37,7 +37,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     }, {
         renderInProgress: AbortController | undefined;
         filled: boolean;
-        reactElement: import("react").ReactElement | undefined;
+        reactElement: React.ReactElement | undefined;
         features: Map<string, import("@jbrowse/core/util").Feature> | undefined;
         layout: any;
         status: string;
@@ -48,10 +48,10 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
             model: {
                 error?: unknown;
                 reload: () => void;
-                message: import("react").ReactNode;
+                message: React.ReactNode;
                 filled?: boolean;
                 status?: string;
-                reactElement?: import("react").ReactElement;
+                reactElement?: React.ReactElement;
             };
         }) => import("react").JSX.Element | undefined;
         renderProps: any;
@@ -62,7 +62,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         setLoading(abortController: AbortController): void;
         setMessage(messageText: string): void;
         setRendered(props: {
-            reactElement: import("react").ReactElement;
+            reactElement: React.ReactElement;
             features: Map<string, import("@jbrowse/core/util").Feature>;
             layout: any;
             maxHeightReached: boolean;
@@ -135,7 +135,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -156,7 +156,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -179,7 +179,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -225,13 +225,13 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     featureIdUnderMouse: undefined | string;
     contextMenuFeature: undefined | import("@jbrowse/core/util").Feature;
 } & {
+    readonly DisplayMessageComponent: import("react").FC<any> | undefined;
     readonly blockType: "dynamicBlocks" | "staticBlocks";
     readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
 } & {
     readonly renderDelay: number;
-    readonly TooltipComponent: import("react").FC<any>;
+    readonly TooltipComponent: import("@jbrowse/core/util").AnyReactComponentType;
     readonly selectedFeatureId: string | undefined;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
 } & {
     readonly features: import("@jbrowse/core/util/compositeMap").default<string, import("@jbrowse/core/util").Feature>;
     readonly featureUnderMouse: import("@jbrowse/core/util").Feature | undefined;
@@ -329,7 +329,6 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
             muiName: string;
         };
-        priority: number;
         onClick: () => void;
     })[];
 } & {

package/dist/LinearComparativeDisplay/stateModelFactory.d.ts

@@ -19,7 +19,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -42,7 +42,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -65,7 +65,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -105,7 +105,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -128,7 +128,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -151,7 +151,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;
@@ -177,7 +177,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -198,7 +198,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -221,7 +221,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;

package/dist/LinearComparativeView/model.d.ts

@@ -68,8 +68,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly assemblyNames: string[];
     } & {
         scaleBarDisplayPrefix(): string | undefined;
-        MiniControlsComponent(): import("react").FC<any>;
-        HeaderComponent(): import("react").FC<any>;
+        MiniControlsComponent(): React.FC<any>;
+        HeaderComponent(): React.FC<any>;
         readonly assemblyErrors: string;
         readonly assembliesInitialized: boolean;
         readonly initialized: boolean;

package/dist/LinearSyntenyDisplay/components/LinearSyntenyRendering.js

@@ -31,11 +31,10 @@ const mobx_react_1 = require("mobx-react");
 const util_1 = require("@jbrowse/core/util");
 const mobx_1 = require("mobx");
 const mui_1 = require("tss-react/mui");
-// locals
-const SyntenyTooltip_1 = __importDefault(require("./SyntenyTooltip"));
 const drawSynteny_1 = require("../drawSynteny");
 const SyntenyContextMenu_1 = __importDefault(require("./SyntenyContextMenu"));
 const util_2 = require("./util");
+const SyntenyTooltip = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./SyntenyTooltip'))));
 const useStyles = (0, mui_1.makeStyles)()({
     pix: {
         imageRendering: 'pixelated',
@@ -208,7 +207,7 @@ const LinearSyntenyRendering = (0, mobx_react_1.observer)(function ({ model, })
             }, "data-testid": "synteny_canvas", className: classes.abs, width: width, height: height }),
         react_1.default.createElement("canvas", { ref: k3, className: classes.pix, width: width, height: height }),
         react_1.default.createElement("canvas", { ref: k4, className: classes.pix, width: width, height: height }),
-        mouseoverId && tooltip && currX && currY ? (react_1.default.createElement(SyntenyTooltip_1.default, { title: tooltip })) : null,
+        mouseoverId && tooltip && currX && currY ? (react_1.default.createElement(SyntenyTooltip, { title: tooltip })) : null,
         anchorEl ? (react_1.default.createElement(SyntenyContextMenu_1.default, { model: model, anchorEl: anchorEl, onClose: () => {
                 setAnchorEl(undefined);
             } })) : null));

package/dist/LinearSyntenyDisplay/components/SyntenyTooltip.js

@@ -5,47 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const mobx_react_1 = require("mobx-react");
-const material_1 = require("@mui/material");
-const mui_1 = require("tss-react/mui");
-const react_2 = require("@floating-ui/react");
 const ui_1 = require("@jbrowse/core/ui");
-function round(value) {
-    return Math.round(value * 1e5) / 1e5;
-}
-const useStyles = (0, mui_1.makeStyles)()(theme => ({
-    // these styles come from
-    // https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Tooltip/Tooltip.js
-    tooltip: {
-        position: 'absolute',
-        pointerEvents: 'none',
-        backgroundColor: (0, material_1.alpha)(theme.palette.grey[700], 0.9),
-        borderRadius: theme.shape.borderRadius,
-        color: theme.palette.common.white,
-        fontFamily: theme.typography.fontFamily,
-        padding: '4px 8px',
-        fontSize: theme.typography.pxToRem(12),
-        lineHeight: `${round(14 / 10)}em`,
-        maxWidth: 300,
-        wordWrap: 'break-word',
-    },
-}));
+const BaseTooltip_1 = __importDefault(require("@jbrowse/core/ui/BaseTooltip"));
 const SyntenyTooltip = (0, mobx_react_1.observer)(function ({ title }) {
-    var _a, _b;
-    const theme = (0, material_1.useTheme)();
-    const { classes } = useStyles();
-    const { refs, floatingStyles, context } = (0, react_2.useFloating)({
-        placement: 'right',
-        strategy: 'fixed',
-    });
-    const clientPoint = (0, react_2.useClientPoint)(context);
-    const { getFloatingProps } = (0, react_2.useInteractions)([clientPoint]);
-    const popperTheme = (_a = theme.components) === null || _a === void 0 ? void 0 : _a.MuiPopper;
-    return title ? (react_1.default.createElement(material_1.Portal, { container: (_b = popperTheme === null || popperTheme === void 0 ? void 0 : popperTheme.defaultProps) === null || _b === void 0 ? void 0 : _b.container },
-        react_1.default.createElement("div", { className: classes.tooltip, ref: refs.setFloating, style: {
-                ...floatingStyles,
-                zIndex: 100000,
-                pointerEvents: 'none',
-            }, ...getFloatingProps() },
-            react_1.default.createElement(ui_1.SanitizedHTML, { html: title })))) : null;
+    return title ? (react_1.default.createElement(BaseTooltip_1.default, null,
+        react_1.default.createElement(ui_1.SanitizedHTML, { html: title }))) : null;
 });
 exports.default = SyntenyTooltip;

package/dist/LinearSyntenyDisplay/components/util.js

@@ -86,6 +86,8 @@ function drawBezierBox(ctx, x1, x2, y1, x3, x4, y2, mid) {
     ctx.fill();
 }
 function onSynClick(event, model) {
+    const view = (0, util_1.getContainingView)(model);
+    const track = (0, util_1.getContainingTrack)(model);
     const ref1 = model.clickMapCanvas;
     const ref2 = model.cigarClickMapCanvas;
     if (!ref1 || !ref2) {
@@ -108,11 +110,10 @@ function onSynClick(event, model) {
         model.setClickId(f.id());
         const session = (0, util_1.getSession)(model);
         if ((0, util_1.isSessionModelWithWidgets)(session)) {
-            session.showWidget(session.addWidget('SyntenyFeatureWidget', 'syntenyFeature', {
-                featureData: {
-                    feature1: f.toJSON(),
-                    feature2: f.get('mate'),
-                },
+            session.showWidget(session.addWidget('BaseFeatureWidget', 'baseFeature', {
+                view,
+                track,
+                featureData: f.toJSON(),
             }));
         }
     }

package/dist/LinearSyntenyDisplay/model.d.ts

@@ -39,7 +39,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -60,7 +60,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -85,7 +85,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -122,7 +122,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -143,7 +143,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -168,7 +168,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;
@@ -194,7 +194,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -215,7 +215,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -238,7 +238,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;

package/dist/index.js

@@ -13,7 +13,6 @@ const LGVSyntenyDisplay_1 = __importDefault(require("./LGVSyntenyDisplay"));
 const LinearSyntenyView_1 = __importDefault(require("./LinearSyntenyView"));
 const LaunchLinearSyntenyView_1 = __importDefault(require("./LaunchLinearSyntenyView"));
 const SyntenyTrack_1 = __importDefault(require("./SyntenyTrack"));
-const SyntenyFeatureDetail_1 = __importDefault(require("./SyntenyFeatureDetail"));
 const LinearReadVsRef_1 = __importDefault(require("./LinearReadVsRef"));
 class LinearComparativeViewPlugin extends Plugin_1.default {
     constructor() {
@@ -28,7 +27,6 @@ class LinearComparativeViewPlugin extends Plugin_1.default {
         (0, LGVSyntenyDisplay_1.default)(pluginManager);
         (0, LaunchLinearSyntenyView_1.default)(pluginManager);
         (0, SyntenyTrack_1.default)(pluginManager);
-        (0, SyntenyFeatureDetail_1.default)(pluginManager);
         (0, LinearReadVsRef_1.default)(pluginManager);
     }
     configure(pluginManager) {

package/esm/LGVSyntenyDisplay/model.d.ts

@@ -37,7 +37,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     }, {
         renderInProgress: AbortController | undefined;
         filled: boolean;
-        reactElement: import("react").ReactElement | undefined;
+        reactElement: React.ReactElement | undefined;
         features: Map<string, import("@jbrowse/core/util").Feature> | undefined;
         layout: any;
         status: string;
@@ -48,10 +48,10 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
             model: {
                 error?: unknown;
                 reload: () => void;
-                message: import("react").ReactNode;
+                message: React.ReactNode;
                 filled?: boolean;
                 status?: string;
-                reactElement?: import("react").ReactElement;
+                reactElement?: React.ReactElement;
             };
         }) => import("react").JSX.Element | undefined;
         renderProps: any;
@@ -62,7 +62,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         setLoading(abortController: AbortController): void;
         setMessage(messageText: string): void;
         setRendered(props: {
-            reactElement: import("react").ReactElement;
+            reactElement: React.ReactElement;
             features: Map<string, import("@jbrowse/core/util").Feature>;
             layout: any;
             maxHeightReached: boolean;
@@ -135,7 +135,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -156,7 +156,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -179,7 +179,7 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -225,13 +225,13 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
     featureIdUnderMouse: undefined | string;
     contextMenuFeature: undefined | import("@jbrowse/core/util").Feature;
 } & {
+    readonly DisplayMessageComponent: import("react").FC<any> | undefined;
     readonly blockType: "dynamicBlocks" | "staticBlocks";
     readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
 } & {
     readonly renderDelay: number;
-    readonly TooltipComponent: import("react").FC<any>;
+    readonly TooltipComponent: import("@jbrowse/core/util").AnyReactComponentType;
     readonly selectedFeatureId: string | undefined;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
 } & {
     readonly features: import("@jbrowse/core/util/compositeMap").default<string, import("@jbrowse/core/util").Feature>;
     readonly featureUnderMouse: import("@jbrowse/core/util").Feature | undefined;
@@ -329,7 +329,6 @@ declare function stateModelFactory(schema: AnyConfigurationSchemaType): import("
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
             muiName: string;
         };
-        priority: number;
         onClick: () => void;
     })[];
 } & {

package/esm/LinearComparativeDisplay/stateModelFactory.d.ts

@@ -19,7 +19,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -42,7 +42,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -65,7 +65,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -105,7 +105,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -128,7 +128,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -151,7 +151,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;
@@ -177,7 +177,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -198,7 +198,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -221,7 +221,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;

package/esm/LinearComparativeView/model.d.ts

@@ -68,8 +68,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly assemblyNames: string[];
     } & {
         scaleBarDisplayPrefix(): string | undefined;
-        MiniControlsComponent(): import("react").FC<any>;
-        HeaderComponent(): import("react").FC<any>;
+        MiniControlsComponent(): React.FC<any>;
+        HeaderComponent(): React.FC<any>;
         readonly assemblyErrors: string;
         readonly assembliesInitialized: boolean;
         readonly initialized: boolean;

package/esm/LinearSyntenyDisplay/components/LinearSyntenyRendering.js

@@ -1,13 +1,12 @@
-import React, { useState, useCallback, useRef } from 'react';
+import React, { useState, useCallback, useRef, lazy } from 'react';
 import { observer } from 'mobx-react';
 import { getContainingView } from '@jbrowse/core/util';
 import { transaction } from 'mobx';
 import { makeStyles } from 'tss-react/mui';
-// locals
-import SyntenyTooltip from './SyntenyTooltip';
 import { getId, MAX_COLOR_RANGE } from '../drawSynteny';
 import SyntenyContextMenu from './SyntenyContextMenu';
 import { getTooltip, onSynClick, onSynContextClick } from './util';
+const SyntenyTooltip = lazy(() => import('./SyntenyTooltip'));
 const useStyles = makeStyles()({
     pix: {
         imageRendering: 'pixelated',

package/esm/LinearSyntenyDisplay/components/SyntenyTooltip.js

@@ -1,46 +1,9 @@
 import React from 'react';
 import { observer } from 'mobx-react';
-import { Portal, useTheme, alpha } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
-import { useClientPoint, useFloating, useInteractions, } from '@floating-ui/react';
 import { SanitizedHTML } from '@jbrowse/core/ui';
-function round(value) {
-    return Math.round(value * 1e5) / 1e5;
-}
-const useStyles = makeStyles()(theme => ({
-    // these styles come from
-    // https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Tooltip/Tooltip.js
-    tooltip: {
-        position: 'absolute',
-        pointerEvents: 'none',
-        backgroundColor: alpha(theme.palette.grey[700], 0.9),
-        borderRadius: theme.shape.borderRadius,
-        color: theme.palette.common.white,
-        fontFamily: theme.typography.fontFamily,
-        padding: '4px 8px',
-        fontSize: theme.typography.pxToRem(12),
-        lineHeight: `${round(14 / 10)}em`,
-        maxWidth: 300,
-        wordWrap: 'break-word',
-    },
-}));
+import BaseTooltip from '@jbrowse/core/ui/BaseTooltip';
 const SyntenyTooltip = observer(function ({ title }) {
-    var _a, _b;
-    const theme = useTheme();
-    const { classes } = useStyles();
-    const { refs, floatingStyles, context } = useFloating({
-        placement: 'right',
-        strategy: 'fixed',
-    });
-    const clientPoint = useClientPoint(context);
-    const { getFloatingProps } = useInteractions([clientPoint]);
-    const popperTheme = (_a = theme.components) === null || _a === void 0 ? void 0 : _a.MuiPopper;
-    return title ? (React.createElement(Portal, { container: (_b = popperTheme === null || popperTheme === void 0 ? void 0 : popperTheme.defaultProps) === null || _b === void 0 ? void 0 : _b.container },
-        React.createElement("div", { className: classes.tooltip, ref: refs.setFloating, style: {
-                ...floatingStyles,
-                zIndex: 100000,
-                pointerEvents: 'none',
-            }, ...getFloatingProps() },
-            React.createElement(SanitizedHTML, { html: title })))) : null;
+    return title ? (React.createElement(BaseTooltip, null,
+        React.createElement(SanitizedHTML, { html: title }))) : null;
 });
 export default SyntenyTooltip;

package/esm/LinearSyntenyDisplay/components/util.js

@@ -1,4 +1,4 @@
-import { assembleLocString, doesIntersect2, getSession, isSessionModelWithWidgets, } from '@jbrowse/core/util';
+import { assembleLocString, doesIntersect2, getSession, isSessionModelWithWidgets, getContainingTrack, getContainingView, } from '@jbrowse/core/util';
 // locals
 import { getId, MAX_COLOR_RANGE } from '../drawSynteny';
 export function drawMatchSimple({ feature, ctx, offsets, cb, height, drawCurves, oobLimit, viewWidth, hideTiny, }) {
@@ -77,6 +77,8 @@ export function drawBezierBox(ctx, x1, x2, y1, x3, x4, y2, mid) {
     ctx.fill();
 }
 export function onSynClick(event, model) {
+    const view = getContainingView(model);
+    const track = getContainingTrack(model);
     const ref1 = model.clickMapCanvas;
     const ref2 = model.cigarClickMapCanvas;
     if (!ref1 || !ref2) {
@@ -99,11 +101,10 @@ export function onSynClick(event, model) {
         model.setClickId(f.id());
         const session = getSession(model);
         if (isSessionModelWithWidgets(session)) {
-            session.showWidget(session.addWidget('SyntenyFeatureWidget', 'syntenyFeature', {
-                featureData: {
-                    feature1: f.toJSON(),
-                    feature2: f.get('mate'),
-                },
+            session.showWidget(session.addWidget('BaseFeatureWidget', 'baseFeature', {
+                view,
+                track,
+                featureData: f.toJSON(),
             }));
         }
     }

package/esm/LinearSyntenyDisplay/model.d.ts

@@ -39,7 +39,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     error: unknown;
     message: string | undefined;
 } & {
-    readonly RenderingComponent: import("react").FC<{
+    readonly RenderingComponent: React.FC<{
         model: {
             id: string;
             type: string;
@@ -60,7 +60,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         onHorizontalScroll?: () => void;
         blockState?: Record<string, any>;
     }>;
-    readonly DisplayBlurb: import("react").FC<{
+    readonly DisplayBlurb: React.FC<{
         model: {
             id: string;
             type: string;
@@ -85,7 +85,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     readonly parentTrack: any;
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-    readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+    readonly DisplayMessageComponent: undefined | React.FC<any>;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
@@ -122,7 +122,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -143,7 +143,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -168,7 +168,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;
@@ -194,7 +194,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             error: unknown;
             message: string | undefined;
         } & {
-            readonly RenderingComponent: import("react").FC<{
+            readonly RenderingComponent: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -215,7 +215,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
                 onHorizontalScroll?: () => void;
                 blockState?: Record<string, any>;
             }>;
-            readonly DisplayBlurb: import("react").FC<{
+            readonly DisplayBlurb: React.FC<{
                 model: {
                     id: string;
                     type: string;
@@ -238,7 +238,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             readonly parentTrack: any;
             renderProps(): any;
             readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
-            readonly DisplayMessageComponent: undefined | import("react").FC<any>;
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
             trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
             regionCannotBeRendered(): null;

package/esm/index.js

@@ -8,7 +8,6 @@ import LGVSyntenyDisplayF from './LGVSyntenyDisplay';
 import LinearSyntenyViewF from './LinearSyntenyView';
 import LaunchLinearSyntenyViewF from './LaunchLinearSyntenyView';
 import SyntenyTrackF from './SyntenyTrack';
-import SyntenyFeatureWidgetF from './SyntenyFeatureDetail';
 import LinearReadVsRefMenuItemF from './LinearReadVsRef';
 export default class LinearComparativeViewPlugin extends Plugin {
     constructor() {
@@ -23,7 +22,6 @@ export default class LinearComparativeViewPlugin extends Plugin {
         LGVSyntenyDisplayF(pluginManager);
         LaunchLinearSyntenyViewF(pluginManager);
         SyntenyTrackF(pluginManager);
-        SyntenyFeatureWidgetF(pluginManager);
         LinearReadVsRefMenuItemF(pluginManager);
     }
     configure(pluginManager) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-linear-comparative-view",
-  "version": "2.14.0",
+  "version": "2.15.1",
   "description": "JBrowse 2 linear comparative view",
   "keywords": [
     "jbrowse",
@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@floating-ui/react": "^0.26.3",
-    "@mui/icons-material": "^5.0.1",
+    "@mui/icons-material": "^6.0.0",
     "clone": "^2.1.2",
     "copy-to-clipboard": "^3.3.1",
     "file-saver": "^2.0.0"
@@ -46,7 +46,7 @@
     "@jbrowse/core": "^2.0.0",
     "@jbrowse/plugin-alignments": "^2.0.0",
     "@jbrowse/plugin-linear-genome-view": "^2.0.0",
-    "@mui/material": "^5.0.0",
+    "@mui/material": "^6.0.0",
     "mobx": "^6.0.0",
     "mobx-react": "^9.0.0",
     "mobx-state-tree": "^5.0.0",
@@ -61,5 +61,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9fb8231d932db40adf0a283081765431756c66ff"
+  "gitHead": "86ed70124fc5a0b1161266659d1ca9f8796bf3fe"
 }

package/dist/SyntenyFeatureDetail/SyntenyFeatureDetail.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-declare const SyntenyFeatureDetail: ({ model, }: {
-    model: {
-        featureData: unknown;
-    };
-}) => React.JSX.Element;
-export default SyntenyFeatureDetail;

package/dist/SyntenyFeatureDetail/SyntenyFeatureDetail.js

@@ -1,65 +0,0 @@
-"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 copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
-const material_1 = require("@mui/material");
-const mobx_react_1 = require("mobx-react");
-const BaseFeatureDetail_1 = require("@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail");
-function Formatter({ value }) {
-    const [show, setShow] = (0, react_1.useState)(false);
-    const [copied, setCopied] = (0, react_1.useState)(false);
-    const display = String(value);
-    if (display.length > 100) {
-        return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("button", { type: "button", onClick: () => {
-                    (0, copy_to_clipboard_1.default)(display);
-                    setCopied(true);
-                    setTimeout(() => {
-                        setCopied(false);
-                    }, 700);
-                } }, copied ? 'Copied to clipboard' : 'Copy'),
-            react_1.default.createElement("button", { type: "button", onClick: () => {
-                    setShow(val => !val);
-                } }, show ? 'Show less' : 'Show more'),
-            react_1.default.createElement("div", null, show ? display : `${display.slice(0, 100)}...`)));
-    }
-    return react_1.default.createElement("div", null, display);
-}
-function CustomFeatureDetails(props) {
-    return (react_1.default.createElement(BaseFeatureDetail_1.BaseAttributes, { ...props, formatter: (value) => react_1.default.createElement(Formatter, { value: value }) }));
-}
-const SyntenyFeatureDetail = (0, mobx_react_1.observer)(function ({ model, }) {
-    const { feature1, feature2 } = JSON.parse(JSON.stringify(model.featureData));
-    return (react_1.default.createElement(material_1.Paper, { "data-testid": "alignment-side-drawer" },
-        react_1.default.createElement(BaseFeatureDetail_1.BaseCoreDetails, { title: "Feature 1", feature: feature1 }),
-        react_1.default.createElement(BaseFeatureDetail_1.BaseCoreDetails, { title: "Feature 2", feature: feature2 }),
-        react_1.default.createElement(CustomFeatureDetails, { feature: feature1 }),
-        react_1.default.createElement(CustomFeatureDetails, { feature: feature2 })));
-});
-exports.default = SyntenyFeatureDetail;

package/dist/SyntenyFeatureDetail/index.d.ts

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

package/dist/SyntenyFeatureDetail/index.js

@@ -1,58 +0,0 @@
-"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 });
-exports.default = SyntenyFeatureWidgetF;
-const react_1 = require("react");
-const configuration_1 = require("@jbrowse/core/configuration");
-const WidgetType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/WidgetType"));
-const mst_1 = require("@jbrowse/core/util/types/mst");
-const mobx_state_tree_1 = require("mobx-state-tree");
-const configSchema = (0, configuration_1.ConfigurationSchema)('SyntenyFeatureWidget', {});
-const stateModel = mobx_state_tree_1.types
-    .model('SyntenyFeatureWidget', {
-    id: mst_1.ElementId,
-    type: mobx_state_tree_1.types.literal('SyntenyFeatureWidget'),
-    featureData: mobx_state_tree_1.types.frozen(),
-})
-    .actions(self => ({
-    setFeatureData(data) {
-        self.featureData = data;
-    },
-    clearFeatureData() {
-        self.featureData = undefined;
-    },
-}));
-function SyntenyFeatureWidgetF(pluginManager) {
-    pluginManager.addWidgetType(() => new WidgetType_1.default({
-        name: 'SyntenyFeatureWidget',
-        heading: 'Synteny feature details',
-        configSchema,
-        stateModel,
-        ReactComponent: (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./SyntenyFeatureDetail')))),
-    }));
-}

package/esm/SyntenyFeatureDetail/SyntenyFeatureDetail.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-declare const SyntenyFeatureDetail: ({ model, }: {
-    model: {
-        featureData: unknown;
-    };
-}) => React.JSX.Element;
-export default SyntenyFeatureDetail;

package/esm/SyntenyFeatureDetail/SyntenyFeatureDetail.js

@@ -1,37 +0,0 @@
-import React, { useState } from 'react';
-import copy from 'copy-to-clipboard';
-import { Paper } from '@mui/material';
-import { observer } from 'mobx-react';
-import { BaseCoreDetails, BaseAttributes, } from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail';
-function Formatter({ value }) {
-    const [show, setShow] = useState(false);
-    const [copied, setCopied] = useState(false);
-    const display = String(value);
-    if (display.length > 100) {
-        return (React.createElement(React.Fragment, null,
-            React.createElement("button", { type: "button", onClick: () => {
-                    copy(display);
-                    setCopied(true);
-                    setTimeout(() => {
-                        setCopied(false);
-                    }, 700);
-                } }, copied ? 'Copied to clipboard' : 'Copy'),
-            React.createElement("button", { type: "button", onClick: () => {
-                    setShow(val => !val);
-                } }, show ? 'Show less' : 'Show more'),
-            React.createElement("div", null, show ? display : `${display.slice(0, 100)}...`)));
-    }
-    return React.createElement("div", null, display);
-}
-function CustomFeatureDetails(props) {
-    return (React.createElement(BaseAttributes, { ...props, formatter: (value) => React.createElement(Formatter, { value: value }) }));
-}
-const SyntenyFeatureDetail = observer(function ({ model, }) {
-    const { feature1, feature2 } = JSON.parse(JSON.stringify(model.featureData));
-    return (React.createElement(Paper, { "data-testid": "alignment-side-drawer" },
-        React.createElement(BaseCoreDetails, { title: "Feature 1", feature: feature1 }),
-        React.createElement(BaseCoreDetails, { title: "Feature 2", feature: feature2 }),
-        React.createElement(CustomFeatureDetails, { feature: feature1 }),
-        React.createElement(CustomFeatureDetails, { feature: feature2 })));
-});
-export default SyntenyFeatureDetail;

package/esm/SyntenyFeatureDetail/index.d.ts

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

package/esm/SyntenyFeatureDetail/index.js

@@ -1,29 +0,0 @@
-import { lazy } from 'react';
-import { ConfigurationSchema } from '@jbrowse/core/configuration';
-import WidgetType from '@jbrowse/core/pluggableElementTypes/WidgetType';
-import { ElementId } from '@jbrowse/core/util/types/mst';
-import { types } from 'mobx-state-tree';
-const configSchema = ConfigurationSchema('SyntenyFeatureWidget', {});
-const stateModel = types
-    .model('SyntenyFeatureWidget', {
-    id: ElementId,
-    type: types.literal('SyntenyFeatureWidget'),
-    featureData: types.frozen(),
-})
-    .actions(self => ({
-    setFeatureData(data) {
-        self.featureData = data;
-    },
-    clearFeatureData() {
-        self.featureData = undefined;
-    },
-}));
-export default function SyntenyFeatureWidgetF(pluginManager) {
-    pluginManager.addWidgetType(() => new WidgetType({
-        name: 'SyntenyFeatureWidget',
-        heading: 'Synteny feature details',
-        configSchema,
-        stateModel,
-        ReactComponent: lazy(() => import('./SyntenyFeatureDetail')),
-    }));
-}