@jbrowse/plugin-linear-genome-view 2.11.1 → 2.11.2

package/dist/BaseLinearDisplay/components/LinearBlocks.js

@@ -8,7 +8,6 @@ const react_1 = __importDefault(require("react"));
 const mui_1 = require("tss-react/mui");
 const util_1 = require("@jbrowse/core/util");
 const mobx_react_1 = require("mobx-react");
-const blockTypes_1 = require("@jbrowse/core/util/blockTypes");
 const Block_1 = require("./Block");
 const useStyles = (0, mui_1.makeStyles)()({
     linearBlocks: {
@@ -35,9 +34,10 @@ const RenderedBlocks = (0, mobx_react_1.observer)(function ({ model, }) {
     const { classes } = useStyles();
     const { blockDefinitions, blockState } = model;
     return (react_1.default.createElement(react_1.default.Fragment, null, blockDefinitions.map(block => {
-        if (block instanceof blockTypes_1.ContentBlock) {
+        const key = `${model.id}-${block.key}`;
+        if (block.type === 'ContentBlock') {
             const state = blockState.get(block.key);
-            return (react_1.default.createElement(Block_1.ContentBlock, { block: block, key: `${model.id}-${block.key}` },
+            return (react_1.default.createElement(Block_1.ContentBlock, { block: block, key: key },
                 (state === null || state === void 0 ? void 0 : state.ReactComponent) ? (react_1.default.createElement(state.ReactComponent, { model: state })) : null,
                 (state === null || state === void 0 ? void 0 : state.maxHeightReached) ? (react_1.default.createElement("div", { className: classes.heightOverflowed, style: {
                         top: state.layout.getTotalHeight() - 16,
@@ -45,11 +45,11 @@ const RenderedBlocks = (0, mobx_react_1.observer)(function ({ model, }) {
                         height: 16,
                     } }, "Max height reached")) : null));
         }
-        if (block instanceof blockTypes_1.ElidedBlock) {
-            return (react_1.default.createElement(Block_1.ElidedBlock, { key: `${model.id}-${block.key}`, width: block.widthPx }));
+        else if (block.type === 'ElidedBlock') {
+            return react_1.default.createElement(Block_1.ElidedBlock, { key: key, width: block.widthPx });
         }
-        if (block instanceof blockTypes_1.InterRegionPaddingBlock) {
-            return (react_1.default.createElement(Block_1.InterRegionPaddingBlock, { key: block.key, width: block.widthPx, style: { background: 'none' }, boundary: block.variant === 'boundary' }));
+        else if (block.type === 'InterRegionPaddingBlock') {
+            return (react_1.default.createElement(Block_1.InterRegionPaddingBlock, { key: key, width: block.widthPx, style: { background: 'none' }, boundary: block.variant === 'boundary' }));
         }
         throw new Error(`invalid block type ${JSON.stringify(block)}`);
     })));

package/dist/BaseLinearDisplay/models/BaseLinearDisplayModel.d.ts

@@ -110,6 +110,11 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 }, {
     rendererTypeName: string;
@@ -200,7 +205,9 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
     readonly regionTooLarge: boolean;
     readonly regionTooLargeReason: string;
 } & {
-    regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
+    regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features"; /**
+     * #action
+     */
     regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): React.JSX.Element | null;
 } & {
     featureIdUnderMouse: string | undefined;
@@ -273,6 +280,10 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
      * #action
      */
     selectFeature(feature: Feature): void;
+    /**
+     * #action
+     */
+    navToFeature(feature: Feature): void;
     /**
      * #action
      */
@@ -401,6 +412,11 @@ export declare const BaseLinearDisplay: import("mobx-state-tree").IModelType<{
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 }>>, {
     type: string;

package/dist/BaseLinearDisplay/models/BaseLinearDisplayModel.js

@@ -36,6 +36,7 @@ const mobx_1 = require("mobx");
 const mobx_state_tree_1 = require("mobx-state-tree");
 // icons
 const MenuOpen_1 = __importDefault(require("@mui/icons-material/MenuOpen"));
+const CenterFocusStrong_1 = __importDefault(require("@mui/icons-material/CenterFocusStrong"));
 const BaseLinearDisplay_1 = require("../components/BaseLinearDisplay");
 const serverSideRenderedBlock_1 = __importDefault(require("./serverSideRenderedBlock"));
 const configSchema_1 = __importDefault(require("./configSchema"));
@@ -211,6 +212,17 @@ function stateModelFactory() {
                 session.setSelection(feature);
             }
         },
+        /**
+         * #action
+         */
+        navToFeature(feature) {
+            const view = (0, util_1.getContainingView)(self);
+            view.navTo({
+                refName: feature.get('refName'),
+                start: feature.get('start'),
+                end: feature.get('end'),
+            });
+        },
         /**
          * #action
          */
@@ -268,6 +280,15 @@ function stateModelFactory() {
                                 }
                             },
                         },
+                        {
+                            label: 'Zoom to feature',
+                            icon: CenterFocusStrong_1.default,
+                            onClick: () => {
+                                if (self.contextMenuFeature) {
+                                    self.navToFeature(self.contextMenuFeature);
+                                }
+                            },
+                        },
                     ]
                     : []),
             ];

package/dist/BaseLinearDisplay/models/configSchema.d.ts

@@ -32,5 +32,15 @@ declare const baseLinearDisplayConfigSchema: import("@jbrowse/core/configuration
         defaultValue: string;
         contextVariable: string[];
     };
+    /**
+     * #slot
+     * config jexlFilters are deferred evaluated so they are prepended with
+     * jexl at runtime rather than being stored with jexl in the config
+     */
+    jexlFilters: {
+        type: string;
+        description: string;
+        defaultValue: never[];
+    };
 }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 export default baseLinearDisplayConfigSchema;

package/dist/BaseLinearDisplay/models/configSchema.js

@@ -4,9 +4,11 @@ const configuration_1 = require("@jbrowse/core/configuration");
 /**
  * #config BaseLinearDisplay
  * #category display
- * `BaseLinearDisplay` is a "base" config that is extended by classes like
- * `LinearBasicDisplay` (used for feature tracks, etc) and `LinearBareDisplay`
- * (more stripped down than even the basic display, not commonly used)
+ *
+ * `BaseLinearDisplay` is a "base" config that is extended by other configs including
+ * - `LinearBasicDisplay` (used for feature tracks, etc)
+ * - `LinearBareDisplay` (more stripped down than even the basic display, not
+ *   commonly used)
  */
 function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
 const baseLinearDisplayConfigSchema = (0, configuration_1.ConfigurationSchema)('BaseLinearDisplay', {
@@ -43,6 +45,16 @@ const baseLinearDisplayConfigSchema = (0, configuration_1.ConfigurationSchema)('
         defaultValue: `jexl:get(feature,'name')`,
         contextVariable: ['feature'],
     },
+    /**
+     * #slot
+     * config jexlFilters are deferred evaluated so they are prepended with
+     * jexl at runtime rather than being stored with jexl in the config
+     */
+    jexlFilters: {
+        type: 'stringArray',
+        description: 'default set of jexl filters to apply to a track. note: these do not use the jexl prefix because they have a deferred evaluation system',
+        defaultValue: [],
+    },
 }, {
     /**
      * #identifier

package/dist/BaseLinearDisplay/models/serverSideRenderedBlock.js

@@ -102,6 +102,7 @@ const blockState = mobx_state_tree_1.types
             renderInProgress = undefined;
         },
         setError(error) {
+            console.error(error);
             if (renderInProgress && !renderInProgress.signal.aborted) {
                 renderInProgress.abort();
             }

package/dist/LinearBareDisplay/configSchema.d.ts

@@ -30,5 +30,10 @@ declare function configSchemaFactory(pluginManager: PluginManager): import("@jbr
         defaultValue: string;
         contextVariable: string[];
     };
+    jexlFilters: {
+        type: string;
+        description: string;
+        defaultValue: never[];
+    };
 }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>, undefined>>;
 export { configSchemaFactory };

package/dist/LinearBareDisplay/model.d.ts

@@ -77,7 +77,9 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         };
         fetchSizeLimit: {
             type: string;
-            defaultValue: number;
+            defaultValue: number; /**
+             * #method
+             */
             description: string;
         };
         height: {
@@ -91,6 +93,11 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 } & {
     /**
@@ -215,6 +222,7 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
     deleteBlock(key: string): void;
     selectFeature(feature: import("@jbrowse/core/util").Feature): void;
+    navToFeature(feature: import("@jbrowse/core/util").Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string | undefined): void;
     setContextMenuFeature(feature?: import("@jbrowse/core/util").Feature | undefined): void;
@@ -309,7 +317,9 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         };
         fetchSizeLimit: {
             type: string;
-            defaultValue: number;
+            defaultValue: number; /**
+             * #method
+             */
             description: string;
         };
         height: {
@@ -323,6 +333,11 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 }>> & import("mobx-state-tree/dist/internal").NonEmptyObject & import("mobx-state-tree")._NotCustomized, {
     type: string;

package/dist/LinearBasicDisplay/components/AddFiltersDialog.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare const AddFiltersDialog: ({ model, handleClose, }: {
+    model: {
+        jexlFilters?: string[];
+        activeFilters: string[];
+        setJexlFilters: (arg?: string[]) => void;
+    };
+    handleClose: () => void;
+}) => React.JSX.Element;
+export default AddFiltersDialog;

package/dist/LinearBasicDisplay/components/AddFiltersDialog.js

@@ -0,0 +1,94 @@
+"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 mobx_react_1 = require("mobx-react");
+const ui_1 = require("@jbrowse/core/ui");
+const material_1 = require("@mui/material");
+const mui_1 = require("tss-react/mui");
+const jexlStrings_1 = require("@jbrowse/core/util/jexlStrings");
+const useStyles = (0, mui_1.makeStyles)()({
+    dialogContent: {
+        width: '80em',
+    },
+    textAreaFont: {
+        fontFamily: 'Courier New',
+    },
+    error: {
+        color: 'red',
+        fontSize: '0.8em',
+    },
+});
+function checkJexl(code) {
+    (0, jexlStrings_1.stringToJexlExpression)(code);
+}
+const AddFiltersDialog = (0, mobx_react_1.observer)(function ({ model, handleClose, }) {
+    const { classes } = useStyles();
+    const { activeFilters } = model;
+    const [data, setData] = (0, react_1.useState)(activeFilters.join('\n'));
+    const [error, setError] = (0, react_1.useState)();
+    (0, react_1.useEffect)(() => {
+        try {
+            data
+                .split('\n')
+                .map(line => line.trim())
+                .filter(line => !!line)
+                .map(line => checkJexl(line.trim()));
+            setError(undefined);
+        }
+        catch (e) {
+            console.error(e);
+            setError(e);
+        }
+    }, [data]);
+    return (react_1.default.createElement(ui_1.Dialog, { maxWidth: "xl", open: true, onClose: handleClose, title: "Add track filters" },
+        react_1.default.createElement(material_1.DialogContent, null,
+            react_1.default.createElement("div", null,
+                "Add filters, in jexl format, one per line, starting with the string jexl:. Examples:",
+                ' ',
+                react_1.default.createElement("ul", null,
+                    react_1.default.createElement("li", null,
+                        react_1.default.createElement("code", null, "jexl:get(feature,'name')=='BRCA1'"),
+                        " - show only feature where the name attribute is BRCA1"),
+                    react_1.default.createElement("li", null,
+                        react_1.default.createElement("code", null, "jexl:get(feature,'type')=='gene'"),
+                        " - show only gene type features in a GFF that has many other feature types"),
+                    react_1.default.createElement("li", null,
+                        react_1.default.createElement("code", null, "jexl:get(feature,'score') > 400"),
+                        " - show only features that have a score greater than 400"))),
+            error ? react_1.default.createElement("p", { className: classes.error }, `${error}`) : null,
+            react_1.default.createElement(material_1.TextField, { variant: "outlined", multiline: true, minRows: 5, maxRows: 10, className: classes.dialogContent, fullWidth: true, value: data, onChange: event => setData(event.target.value), InputProps: {
+                    classes: {
+                        input: classes.textAreaFont,
+                    },
+                } })),
+        react_1.default.createElement(material_1.DialogActions, null,
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, disabled: !!error, onClick: () => {
+                    model.setJexlFilters(data.split('\n'));
+                    handleClose();
+                } }, "Submit"),
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => handleClose() }, "Cancel"))));
+});
+exports.default = AddFiltersDialog;

package/dist/LinearBasicDisplay/components/{SetMaxHeight.js → SetMaxHeightDialog.js}

@@ -40,12 +40,12 @@ const SetMaxHeightDialog = (0, mobx_react_1.observer)(function ({ model, handleC
     return (react_1.default.createElement(ui_1.Dialog, { open: true, onClose: handleClose, title: "Set max height" },
         react_1.default.createElement(material_1.DialogContent, { className: classes.root },
             react_1.default.createElement(material_1.Typography, null, "Set max height for the track. For example, you can increase this if the layout says \"Max height reached\""),
-            react_1.default.createElement(material_1.TextField, { value: max, onChange: event => setMax(event.target.value), placeholder: "Enter max score" }),
-            react_1.default.createElement(material_1.DialogActions, null,
-                react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, onClick: () => {
-                        model.setMaxHeight(max !== '' && !Number.isNaN(+max) ? +max : undefined);
-                        handleClose();
-                    } }, "Submit"),
-                react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => handleClose() }, "Cancel")))));
+            react_1.default.createElement(material_1.TextField, { value: max, onChange: event => setMax(event.target.value), placeholder: "Enter max score" })),
+        react_1.default.createElement(material_1.DialogActions, null,
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, onClick: () => {
+                    model.setMaxHeight(max !== '' && !Number.isNaN(+max) ? +max : undefined);
+                    handleClose();
+                } }, "Submit"),
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => handleClose() }, "Cancel"))));
 });
 exports.default = SetMaxHeightDialog;

package/dist/LinearBasicDisplay/configSchema.d.ts

@@ -30,5 +30,10 @@ declare function configSchemaFactory(pluginManager: PluginManager): import("@jbr
         defaultValue: string;
         contextVariable: string[];
     };
+    jexlFilters: {
+        type: string;
+        description: string;
+        defaultValue: never[];
+    };
 }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>, undefined>>;
 export default configSchemaFactory;

package/dist/LinearBasicDisplay/model.d.ts

@@ -2,6 +2,7 @@
 import { AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
 import { MenuItem } from '@jbrowse/core/ui';
 import { Instance } from 'mobx-state-tree';
+import SerializableFilterChain from '@jbrowse/core/pluggableElementTypes/renderers/util/serializableFilterChain';
 /**
  * #stateModel LinearBasicDisplay
  * #category display
@@ -50,11 +51,11 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             model: {
                 error?: unknown;
                 reload: () => void;
-                message: import("react").ReactNode;
-                filled?: boolean | undefined;
-                status?: string | undefined; /**
-                 * #getter
+                message: import("react").ReactNode; /**
+                 * #property
                  */
+                filled?: boolean | undefined;
+                status?: string | undefined;
                 reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
             };
         }) => import("react").JSX.Element | undefined;
@@ -63,7 +64,9 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         doReload(): void;
         afterAttach(): void;
         setStatus(message: string): void;
-        setLoading(abortController: AbortController): void;
+        setLoading(abortController: AbortController): void; /**
+         * #getter
+         */
         setMessage(messageText: string): void;
         setRendered(props: {
             reactElement: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
@@ -94,10 +97,17 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         };
         mouseover: {
             type: string;
-            description: string;
+            description: string; /**
+             * #property
+             */
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 } & {
     /**
@@ -124,6 +134,10 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
      * #property
      */
     configuration: AnyConfigurationSchemaType;
+    /**
+     * #property
+     */
+    jexlFilters: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IArrayType<import("mobx-state-tree").ISimpleType<string>>>;
 }, {
     rendererTypeName: string;
     error: unknown;
@@ -140,7 +154,9 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             message: string | undefined;
         } & import("mobx-state-tree").IStateTreeNode<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>;
+            type: import("mobx-state-tree").ISimpleType<string>; /**
+             * #property
+             */
             rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         }, {
             rendererTypeName: string;
@@ -166,11 +182,11 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         }, {
             rendererTypeName: string;
             error: unknown;
-            message: string | undefined; /**
-             * #action
-             */
+            message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
-    }> | null;
+    }> | null; /**
+     * #getter
+     */
     readonly adapterConfig: any;
     readonly parentTrack: any;
     renderProps(): any;
@@ -208,13 +224,13 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     setCurrStatsBpPerPx(n: number): void;
     setFeatureDensityStatsLimit(stats?: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined): void;
     getFeatureDensityStats(): Promise<import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats>;
-    setFeatureDensityStatsP(arg: any): void; /**
-     * #method
-     */
+    setFeatureDensityStatsP(arg: any): void;
     setFeatureDensityStats(featureDensityStats?: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined): void;
     clearFeatureDensityStats(): void;
 } & {
-    readonly regionTooLarge: boolean;
+    readonly regionTooLarge: boolean; /**
+     * #method
+     */
     readonly regionTooLargeReason: string;
 } & {
     regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
@@ -240,6 +256,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
     deleteBlock(key: string): void;
     selectFeature(feature: import("@jbrowse/core/util").Feature): void;
+    navToFeature(feature: import("@jbrowse/core/util").Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string | undefined): void;
     setContextMenuFeature(feature?: import("@jbrowse/core/util").Feature | undefined): void;
@@ -253,6 +270,10 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     renderSvg(opts: import("../BaseLinearDisplay").ExportSvgDisplayOptions): Promise<import("react").JSX.Element>;
     afterAttach(): void;
 } & {
+    /**
+     * #getter
+     */
+    readonly activeFilters: any;
     /**
      * #getter
      */
@@ -283,6 +304,10 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         setSubschema(slotName: string, data: unknown): any;
     } & import("mobx-state-tree").IStateTreeNode<AnyConfigurationSchemaType>;
 } & {
+    /**
+     * #action
+     */
+    setJexlFilters(f?: string[]): void;
     /**
      * #action
      */
@@ -309,6 +334,7 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             setSubschema(slotName: string, data: unknown): any;
         } & import("mobx-state-tree").IStateTreeNode<AnyConfigurationSchemaType>;
+        filters: SerializableFilterChain;
     };
     /**
      * #method
@@ -355,11 +381,11 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             model: {
                 error?: unknown;
                 reload: () => void;
-                message: import("react").ReactNode;
-                filled?: boolean | undefined;
-                status?: string | undefined; /**
-                 * #getter
+                message: import("react").ReactNode; /**
+                 * #property
                  */
+                filled?: boolean | undefined;
+                status?: string | undefined;
                 reactElement?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
             };
         }) => import("react").JSX.Element | undefined;
@@ -368,7 +394,9 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         doReload(): void;
         afterAttach(): void;
         setStatus(message: string): void;
-        setLoading(abortController: AbortController): void;
+        setLoading(abortController: AbortController): void; /**
+         * #getter
+         */
         setMessage(messageText: string): void;
         setRendered(props: {
             reactElement: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
@@ -399,10 +427,17 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
         };
         mouseover: {
             type: string;
-            description: string;
+            description: string; /**
+             * #property
+             */
             defaultValue: string;
             contextVariable: string[];
         };
+        jexlFilters: {
+            type: string;
+            description: string;
+            defaultValue: never[];
+        };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 }>> & import("mobx-state-tree/dist/internal").NonEmptyObject & import("mobx-state-tree")._NotCustomized, {
     type: string;

package/dist/LinearBasicDisplay/model.js

@@ -34,7 +34,9 @@ const mobx_state_tree_1 = require("mobx-state-tree");
 const Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
 // locals
 const BaseLinearDisplay_1 = require("../BaseLinearDisplay");
-const SetMaxHeightDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/SetMaxHeight'))));
+const serializableFilterChain_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/renderers/util/serializableFilterChain"));
+const SetMaxHeightDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/SetMaxHeightDialog'))));
+const AddFiltersDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/AddFiltersDialog'))));
 /**
  * #stateModel LinearBasicDisplay
  * #category display
@@ -71,8 +73,21 @@ function stateModelFactory(configSchema) {
          * #property
          */
         configuration: (0, configuration_1.ConfigurationReference)(configSchema),
+        /**
+         * #property
+         */
+        jexlFilters: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.array(mobx_state_tree_1.types.string)),
     }))
         .views(self => ({
+        /**
+         * #getter
+         */
+        get activeFilters() {
+            var _a;
+            // config jexlFilters are deferred evaluated so they are prepended with
+            // jexl at runtime rather than being stored with jexl in the config
+            return ((_a = self.jexlFilters) !== null && _a !== void 0 ? _a : (0, configuration_1.getConf)(self, 'jexlFilters').map((r) => `jexl:${r}`));
+        },
         /**
          * #getter
          */
@@ -125,6 +140,12 @@ function stateModelFactory(configSchema) {
         },
     }))
         .actions(self => ({
+        /**
+         * #action
+         */
+        setJexlFilters(f) {
+            self.jexlFilters = (0, mobx_state_tree_1.cast)(f);
+        },
         /**
          * #action
          */
@@ -157,12 +178,13 @@ function stateModelFactory(configSchema) {
              * #method
              */
             renderProps() {
-                const config = self.rendererConfig;
                 const superProps = superRenderProps();
-                const superPropsOmit = superProps;
                 return {
-                    ...superPropsOmit,
-                    config,
+                    ...superProps,
+                    config: self.rendererConfig,
+                    filters: new serializableFilterChain_1.default({
+                        filters: self.activeFilters,
+                    }),
                 };
             },
             /**
@@ -207,6 +229,15 @@ function stateModelFactory(configSchema) {
                             ]);
                         },
                     },
+                    {
+                        label: 'Edit filters',
+                        onClick: () => {
+                            (0, util_1.getSession)(self).queueDialog(handleClose => [
+                                AddFiltersDialog,
+                                { model: self, handleClose },
+                            ]);
+                        },
+                    },
                 ];
             },
         };