@jbrowse/plugin-variants 2.5.0 → 2.6.2

package/dist/ChordVariantDisplay/index.js

@@ -23,4 +23,3 @@ exports.default = (pluginManager) => {
         });
     });
 };
-//# sourceMappingURL=index.js.map

package/dist/ChordVariantDisplay/models/configSchema.js

@@ -22,4 +22,3 @@ function stateModelFactory(pluginManager) {
     });
 }
 exports.default = stateModelFactory;
-//# sourceMappingURL=configSchema.js.map

package/dist/ChordVariantDisplay/models/stateModelFactory.d.ts

@@ -34,6 +34,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
     error: unknown; /**
      * #property
      */
+    message: string | undefined;
 } & {
     readonly RenderingComponent: import("react").FC<{
         model: {
@@ -42,7 +43,10 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
             rpcDriverName: string | undefined;
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             rendererTypeName: string;
-            error: unknown;
+            error: unknown; /**
+             * #method
+             */
+            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>;
@@ -50,6 +54,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
         }, {
             rendererTypeName: string;
             error: unknown;
+            message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
         onHorizontalScroll?: Function | undefined;
         blockState?: Record<string, any> | undefined;
@@ -62,6 +67,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             rendererTypeName: string;
             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").ISimpleType<string>, [undefined]>;
             type: import("mobx-state-tree").ISimpleType<string>;
@@ -69,6 +75,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
         }, {
             rendererTypeName: string;
             error: unknown;
+            message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }> | null;
     readonly adapterConfig: any;
@@ -78,8 +85,9 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
     readonly DisplayMessageComponent: import("react").FC<any> | undefined;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
-    regionCannotBeRendered(): undefined;
+    regionCannotBeRendered(): null;
 } & {
+    setMessage(arg?: string | undefined): void;
     setError(error?: unknown): void;
     setRpcDriverName(rpcDriverName: string): void;
     reload(): void;
@@ -115,7 +123,7 @@ declare const stateModelFactory: (configSchema: AnyConfigurationSchemaType) => i
 } & {
     renderSvg(opts: import("@jbrowse/plugin-circular-view/src/CircularView/models/CircularView").ExportSvgOptions & {
         theme: import("@mui/material").ThemeOptions;
-    }): Promise<JSX.Element>;
+    }): Promise<import("react").JSX.Element>;
 } & {
     /**
      * #getter

package/dist/ChordVariantDisplay/models/stateModelFactory.js

@@ -51,4 +51,3 @@ const stateModelFactory = (configSchema) => {
 // tracks all have a height
 //
 exports.default = stateModelFactory;
-//# sourceMappingURL=stateModelFactory.js.map

package/dist/LinearVariantDisplay/configSchema.js

@@ -19,4 +19,3 @@ function configSchemaF(pluginManager) {
     });
 }
 exports.default = configSchemaF;
-//# sourceMappingURL=configSchema.js.map

package/dist/LinearVariantDisplay/index.js

@@ -21,4 +21,3 @@ exports.default = (pluginManager) => {
         });
     });
 };
-//# sourceMappingURL=index.js.map

package/dist/LinearVariantDisplay/model.d.ts

@@ -13,6 +13,13 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
 } & {
     heightPreConfig: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+} & {
+    /**
+     * #property
+     */
+    userBpPerPxLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+    userByteSizeLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+} & {
     blockState: import("mobx-state-tree").IMapType<import("mobx-state-tree").IModelType<{
         key: import("mobx-state-tree").ISimpleType<string>;
         region: import("mobx-state-tree").IModelType<{
@@ -59,8 +66,6 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         reload(): void;
         beforeDestroy(): void;
     }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
-    userBpPerPxLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
-    userByteSizeLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
     configuration: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
         maxFeatureScreenDensity: {
             type: string;
@@ -70,18 +75,12 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         fetchSizeLimit: {
             type: string;
             defaultValue: number;
-            description: string; /**
-             * #property
-             */
-        }; /**
-         * #property
-         */
+            description: string;
+        };
         height: {
             type: string;
             defaultValue: number;
-            description: string; /**
-             * #action
-             */
+            description: string;
         };
         mouseover: {
             type: string;
@@ -93,9 +92,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
 } & {
     type: import("mobx-state-tree").ISimpleType<"LinearBasicDisplay">;
     trackShowLabels: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
-    trackShowDescriptions: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>; /**
-     * #action
-     */
+    trackShowDescriptions: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
     trackDisplayMode: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
     trackMaxHeight: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
     configuration: AnyConfigurationSchemaType;
@@ -111,6 +108,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
 }, {
     rendererTypeName: string;
     error: unknown;
+    message: string | undefined;
 } & {
     readonly RenderingComponent: import("react").FC<{
         model: {
@@ -120,6 +118,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             rendererTypeName: string;
             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").ISimpleType<string>, [undefined]>;
             type: import("mobx-state-tree").ISimpleType<string>;
@@ -127,6 +126,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         }, {
             rendererTypeName: string;
             error: unknown;
+            message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
         onHorizontalScroll?: Function | undefined;
         blockState?: Record<string, any> | undefined;
@@ -139,6 +139,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             rendererTypeName: string;
             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").ISimpleType<string>, [undefined]>;
             type: import("mobx-state-tree").ISimpleType<string>;
@@ -146,6 +147,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
         }, {
             rendererTypeName: string;
             error: unknown;
+            message: string | undefined;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }> | null;
     readonly adapterConfig: any;
@@ -155,21 +157,49 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     readonly DisplayMessageComponent: import("react").FC<any> | undefined;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
-    regionCannotBeRendered(): undefined;
+    regionCannotBeRendered(): null;
 } & {
+    setMessage(arg?: string | undefined): void;
     setError(error?: unknown): void;
     setRpcDriverName(rpcDriverName: string): void;
     reload(): void;
 } & {
-    currBpPerPx: number;
     scrollTop: number;
-    message: string;
-    featureIdUnderMouse: string | undefined;
-    contextMenuFeature: Feature | undefined;
+} & {
+    readonly height: number;
+} & {
+    setScrollTop(scrollTop: number): void;
+    setHeight(displayHeight: number): number;
+    resizeHeight(distance: number): number;
+} & {
     featureDensityStatsP: Promise<import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats> | undefined;
     featureDensityStats: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined;
+    currStatsBpPerPx: number;
+} & {
+    readonly currentBytesRequested: number;
+    readonly currentFeatureScreenDensity: number;
+    readonly maxFeatureScreenDensity: any;
+    readonly featureDensityStatsReady: boolean;
+    readonly maxAllowableBytes: number;
+} & {
+    afterAttach(): void;
+} & {
+    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;
+    setFeatureDensityStats(featureDensityStats?: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined): void;
+    clearFeatureDensityStats(): void;
+} & {
+    readonly regionTooLarge: boolean;
+    readonly regionTooLargeReason: string;
+} & {
+    regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
+    regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): import("react").JSX.Element | null;
+} & {
+    featureIdUnderMouse: string | undefined;
+    contextMenuFeature: Feature | undefined;
 } & {
-    readonly height: number;
     readonly blockType: "dynamicBlocks" | "staticBlocks";
     readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
 } & {
@@ -183,49 +213,22 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     getFeatureOverlapping(blockKey: string, x: number, y: number): string | undefined;
     getFeatureByID(blockKey: string, id: string): [number, number, number, number] | undefined;
     searchFeatureByID(id: string): [number, number, number, number] | undefined;
-    readonly currentBytesRequested: number;
-    readonly currentFeatureScreenDensity: number;
-    readonly maxFeatureScreenDensity: any;
-    readonly featureDensityStatsReady: boolean;
-    readonly maxAllowableBytes: number;
-} & {
-    setMessage(message: string): void;
 } & {
-    afterAttach(): void;
-    getFeatureDensityStats(): Promise<import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats>;
-    setFeatureDensityStatsP(arg: any): void;
-    setFeatureDensityStats(featureDensityStats?: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined): void;
-    clearFeatureDensityStats(): void;
-    setHeight(displayHeight: number): number;
-    resizeHeight(distance: number): number;
-    setScrollTop(scrollTop: number): void;
-    setFeatureDensityStatsLimit(stats?: import("@jbrowse/core/data_adapters/BaseAdapter").FeatureDensityStats | undefined): void;
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
-    setCurrBpPerPx(n: number): void;
     deleteBlock(key: string): void;
     selectFeature(feature: Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string | undefined): void;
-    reload(): void;
     setContextMenuFeature(feature?: Feature | undefined): void;
-} & {
-    readonly regionTooLarge: boolean;
-    readonly regionTooLargeReason: string;
 } & {
     reload(): Promise<void>;
 } & {
-    afterAttach(): void;
-} & {
-    regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
-    regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): JSX.Element | null;
     trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     contextMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     renderProps(): any;
 } & {
-    renderSvg(opts: import("@jbrowse/plugin-linear-genome-view/src/LinearGenomeView").ExportSvgOptions & {
-        overrideHeight: number;
-        theme: import("@mui/material").ThemeOptions;
-    }): Promise<JSX.Element>;
+    renderSvg(opts: import("@jbrowse/plugin-linear-genome-view").ExportSvgDisplayOptions): Promise<import("react").JSX.Element>;
+    afterAttach(): void;
 } & {
     readonly rendererTypeName: any;
     readonly showLabels: any;

package/dist/LinearVariantDisplay/model.js

@@ -49,4 +49,3 @@ function stateModelFactory(configSchema) {
     }));
 }
 exports.default = stateModelFactory;
-//# sourceMappingURL=model.js.map

package/dist/StructuralVariantChordRenderer/Chord.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Feature } from '@jbrowse/core/util';
 import { AnyConfigurationModel } from '@jbrowse/core/configuration';
 export interface Region {
@@ -27,5 +28,5 @@ declare const Chord: ({ feature, blocksForRefs, radius, config, bezierRadius, se
     bezierRadius: number;
     selected: boolean;
     onClick: (feature: Feature, reg: AnyRegion, endBlock: AnyRegion, evt: unknown) => void;
-}) => JSX.Element | null;
+}) => React.JSX.Element | null;
 export default Chord;

package/dist/StructuralVariantChordRenderer/Chord.js

@@ -85,4 +85,3 @@ const Chord = (0, mobx_react_1.observer)(function Chord({ feature, blocksForRefs
     return null;
 });
 exports.default = Chord;
-//# sourceMappingURL=Chord.js.map

package/dist/StructuralVariantChordRenderer/ReactComponent.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Feature } from '@jbrowse/core/util';
 import { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import { Block, AnyRegion } from './Chord';
@@ -12,5 +13,5 @@ declare const _default: ({ features, config, displayModel, blockDefinitions, rad
     blockDefinitions: Block[];
     bezierRadius: number;
     onChordClick: (feature: Feature, reg: AnyRegion, endBlock: AnyRegion, evt: unknown) => void;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default _default;

package/dist/StructuralVariantChordRenderer/ReactComponent.js

@@ -60,4 +60,3 @@ exports.default = (0, mobx_react_1.observer)(function StructuralVariantChords({
             } }),
         chords));
 });
-//# sourceMappingURL=ReactComponent.js.map

package/dist/StructuralVariantChordRenderer/configSchema.js

@@ -35,4 +35,3 @@ const configSchema = (0, configuration_1.ConfigurationSchema)('StructuralVariant
     },
 }, { explicitlyTyped: true });
 exports.default = configSchema;
-//# sourceMappingURL=configSchema.js.map

package/dist/StructuralVariantChordRenderer/index.js

@@ -15,4 +15,3 @@ exports.default = (pluginManager) => {
         pluginManager,
     }));
 };
-//# sourceMappingURL=index.js.map

package/dist/VariantFeatureWidget/AnnotGrid.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 import { GridColDef, GridValidRowModel } from '@mui/x-data-grid';
 export default function VariantAnnotPanel({ rows, columns, }: {
     rows: GridValidRowModel[];
     columns: GridColDef[];
-}): JSX.Element | null;
+}): React.JSX.Element | null;

package/dist/VariantFeatureWidget/AnnotGrid.js

@@ -26,22 +26,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const x_data_grid_1 = require("@mui/x-data-grid");
 const material_1 = require("@mui/material");
+const ResizeBar_1 = __importStar(require("@jbrowse/core/ui/ResizeBar"));
+const util_1 = require("@jbrowse/core/util");
 function VariantAnnotPanel({ rows, columns, }) {
-    const rowHeight = 25;
-    const headerHeight = 100;
-    const footerHeight = 50;
+    const { ref, scrollLeft } = (0, ResizeBar_1.useResizeBar)();
     const [checked, setChecked] = (0, react_1.useState)(false);
-    const height = Math.min(rows.length, 100) * rowHeight +
-        headerHeight +
-        (checked ? 50 : 0) +
-        footerHeight;
-    return rows.length ? (react_1.default.createElement("div", null,
+    const [widths, setWidths] = (0, react_1.useState)(columns.map(e => (0, util_1.measureGridWidth)(rows.map(r => r[e.field]))));
+    return rows.length ? (react_1.default.createElement("div", { ref: ref },
         react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, { checked: checked, onChange: event => setChecked(event.target.checked) }), label: react_1.default.createElement(material_1.Typography, { variant: "body2" }, "Show options") }),
-        react_1.default.createElement("div", { style: {
-                height,
-                width: '100%',
-            } },
-            react_1.default.createElement(x_data_grid_1.DataGrid, { rowHeight: rowHeight, rows: rows, columns: columns, slots: { toolbar: checked ? x_data_grid_1.GridToolbar : null } })))) : null;
+        react_1.default.createElement("div", { ref: ref },
+            react_1.default.createElement(ResizeBar_1.default, { widths: widths, setWidths: setWidths, scrollLeft: scrollLeft }),
+            react_1.default.createElement(x_data_grid_1.DataGrid, { rowHeight: 25, rows: rows, columns: columns.map((c, i) => ({ ...c, width: widths[i] })), slots: { toolbar: checked ? x_data_grid_1.GridToolbar : null } })))) : null;
 }
 exports.default = VariantAnnotPanel;
-//# sourceMappingURL=AnnotGrid.js.map

package/dist/VariantFeatureWidget/BreakendOptionDialog.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { Feature } from '@jbrowse/core/util';
 declare const _default: ({ model, handleClose, feature, viewType, }: {
     model: any;
     handleClose: () => void;
     feature: Feature;
     viewType: any;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default _default;

package/dist/VariantFeatureWidget/BreakendOptionDialog.js

@@ -74,4 +74,3 @@ exports.default = (0, mobx_react_1.observer)(function BreakendOptionDialog({ mod
                 }, variant: "contained", color: "primary", autoFocus: true }, "OK"),
             react_1.default.createElement(material_1.Button, { onClick: () => handleClose(), color: "secondary", variant: "contained" }, "Cancel"))));
 });
-//# sourceMappingURL=BreakendOptionDialog.js.map

package/dist/VariantFeatureWidget/BreakendPanel.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 import { SimpleFeatureSerialized } from '@jbrowse/core/util/simpleFeature';
 export default function BreakendPanel(props: {
     locStrings: string[];
     model: any;
     feature: SimpleFeatureSerialized;
-}): JSX.Element;
+}): React.JSX.Element;

package/dist/VariantFeatureWidget/BreakendPanel.js

@@ -78,4 +78,3 @@ function BreakendPanel(props) {
                 } })) : null)) : null));
 }
 exports.default = BreakendPanel;
-//# sourceMappingURL=BreakendPanel.js.map

package/dist/VariantFeatureWidget/VariantAnnotationTable.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export default function VariantAnnotationTable({ data, fields, title, }: {
+    data: string[];
+    fields: string[];
+    title: string;
+}): React.JSX.Element | null;

package/dist/VariantFeatureWidget/VariantAnnotationTable.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const BaseFeatureDetail_1 = require("@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail");
+const AnnotGrid_1 = __importDefault(require("./AnnotGrid"));
+function VariantAnnotationTable({ data, fields, title, }) {
+    return data.length ? (react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: title },
+        react_1.default.createElement(AnnotGrid_1.default, { rows: data.map((elt, id) => ({
+                id,
+                ...Object.fromEntries(elt.split('|').map((e, i) => [fields[i], e])),
+            })) || [], columns: fields.map(c => ({ field: c })) }))) : null;
+}
+exports.default = VariantAnnotationTable;

package/dist/VariantFeatureWidget/VariantFeatureWidget.d.ts

@@ -1,3 +1,10 @@
-declare function VariantFeatureDetails(props: any): JSX.Element;
+import React from 'react';
+import { SimpleFeatureSerialized } from '@jbrowse/core/util';
+declare function VariantFeatureDetails(props: {
+    model: {
+        featureData: SimpleFeatureSerialized;
+        descriptions: Record<string, string>;
+    };
+}): React.JSX.Element;
 declare const _default: typeof VariantFeatureDetails;
 export default _default;

package/dist/VariantFeatureWidget/VariantFeatureWidget.js

@@ -3,7 +3,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-/* eslint-disable @typescript-eslint/no-explicit-any */
 const react_1 = __importDefault(require("react"));
 const mobx_react_1 = require("mobx-react");
 const material_1 = require("@mui/material");
@@ -11,33 +10,45 @@ const BaseFeatureDetail_1 = require("@jbrowse/core/BaseFeatureWidget/BaseFeature
 const vcf_1 = require("@gmod/vcf");
 // locals
 const VariantSampleGrid_1 = __importDefault(require("./VariantSampleGrid"));
-const VariantCsqPanel_1 = __importDefault(require("./VariantCsqPanel"));
-const VariantAnnPanel_1 = __importDefault(require("./VariantAnnPanel"));
 const BreakendPanel_1 = __importDefault(require("./BreakendPanel"));
+const VariantAnnotationTable_1 = __importDefault(require("./VariantAnnotationTable"));
+const basicDescriptions = {
+    CHROM: 'chromosome: An identifier from the reference genome',
+    POS: 'position: The reference position, with the 1st base having position 1',
+    ID: 'identifier: Semi-colon separated list of unique identifiers where available',
+    REF: 'reference base(s): Each base must be one of A,C,G,T,N (case insensitive).',
+    ALT: 'alternate base(s): Comma-separated list of alternate non-reference alleles',
+    QUAL: 'quality: Phred-scaled quality score for the assertion made in ALT',
+    FILTER: 'filter status: PASS if this position has passed all filters, otherwise a semicolon-separated list of codes for filters that fail',
+};
 function VariantFeatureDetails(props) {
     const { model } = props;
     const { featureData, descriptions } = model;
     const feat = JSON.parse(JSON.stringify(featureData));
     const { samples, ...rest } = feat;
-    const basicDescriptions = {
-        CHROM: 'chromosome: An identifier from the reference genome',
-        POS: 'position: The reference position, with the 1st base having position 1',
-        ID: 'identifier: Semi-colon separated list of unique identifiers where available',
-        REF: 'reference base(s): Each base must be one of A,C,G,T,N (case insensitive).',
-        ALT: 'alternate base(s): Comma-separated list of alternate non-reference alleles',
-        QUAL: 'quality: Phred-scaled quality score for the assertion made in ALT',
-        FILTER: 'filter status: PASS if this position has passed all filters, otherwise a semicolon-separated list of codes for filters that fail',
-    };
     return (react_1.default.createElement(material_1.Paper, { "data-testid": "variant-side-drawer" },
         react_1.default.createElement(BaseFeatureDetail_1.FeatureDetails, { feature: rest, descriptions: { ...basicDescriptions, ...descriptions }, ...props }),
         react_1.default.createElement(material_1.Divider, null),
-        react_1.default.createElement(VariantCsqPanel_1.default, { feature: rest, descriptions: descriptions }),
+        react_1.default.createElement(CsqPanel, { feature: rest, descriptions: descriptions }),
         react_1.default.createElement(material_1.Divider, null),
-        react_1.default.createElement(VariantAnnPanel_1.default, { feature: rest, descriptions: descriptions }),
+        react_1.default.createElement(AnnPanel, { feature: rest, descriptions: descriptions }),
         react_1.default.createElement(material_1.Divider, null),
         feat.type === 'breakend' ? (react_1.default.createElement(BreakendPanel_1.default, { feature: feat, locStrings: feat.ALT.map((alt) => { var _a; return ((_a = (0, vcf_1.parseBreakend)(alt)) === null || _a === void 0 ? void 0 : _a.MatePosition) || ''; }), model: model })) : null,
         feat.type === 'translocation' ? (react_1.default.createElement(BreakendPanel_1.default, { feature: feat, model: model, locStrings: [`${feat.INFO.CHR2[0]}:${feat.INFO.END}`] })) : null,
         react_1.default.createElement(VariantSampleGrid_1.default, { feature: feat, ...props, descriptions: descriptions })));
 }
+function AnnPanel({ descriptions, feature, }) {
+    var _a, _b, _c, _d;
+    const annDesc = (_b = (_a = descriptions === null || descriptions === void 0 ? void 0 : descriptions.INFO) === null || _a === void 0 ? void 0 : _a.ANN) === null || _b === void 0 ? void 0 : _b.Description;
+    const annFields = ((_c = annDesc === null || annDesc === void 0 ? void 0 : annDesc.match(/.*Functional annotations:'(.*)'$/)) === null || _c === void 0 ? void 0 : _c[1].split('|')) || [];
+    const ann = ((_d = feature.INFO) === null || _d === void 0 ? void 0 : _d.ANN) || [];
+    return (react_1.default.createElement(VariantAnnotationTable_1.default, { fields: annFields, data: ann, title: "Variant ANN field" }));
+}
+function CsqPanel({ descriptions, feature, }) {
+    var _a, _b, _c, _d;
+    const csqDescription = (_b = (_a = descriptions === null || descriptions === void 0 ? void 0 : descriptions.INFO) === null || _a === void 0 ? void 0 : _a.CSQ) === null || _b === void 0 ? void 0 : _b.Description;
+    const csqFields = ((_c = csqDescription === null || csqDescription === void 0 ? void 0 : csqDescription.match(/.*Format: (.*)/)) === null || _c === void 0 ? void 0 : _c[1].split('|')) || [];
+    const csq = ((_d = feature.INFO) === null || _d === void 0 ? void 0 : _d.CSQ) || [];
+    return (react_1.default.createElement(VariantAnnotationTable_1.default, { fields: csqFields, data: csq, title: "Variant CSQ field" }));
+}
 exports.default = (0, mobx_react_1.observer)(VariantFeatureDetails);
-//# sourceMappingURL=VariantFeatureWidget.js.map

package/dist/VariantFeatureWidget/VariantSampleGrid.d.ts

@@ -1,5 +1,12 @@
+import React from 'react';
 import { SimpleFeatureSerialized } from '@jbrowse/core/util';
 export default function VariantSamples(props: {
     feature: SimpleFeatureSerialized;
-    descriptions: any;
-}): JSX.Element | null;
+    descriptions: {
+        FORMAT?: {
+            [key: string]: {
+                Description?: string;
+            };
+        };
+    };
+}): React.JSX.Element | null;

package/dist/VariantFeatureWidget/VariantSampleGrid.js

@@ -92,4 +92,3 @@ function VariantSamples(props) {
                 } }))));
 }
 exports.default = VariantSamples;
-//# sourceMappingURL=VariantSampleGrid.js.map

package/dist/VariantFeatureWidget/index.js

@@ -50,4 +50,3 @@ exports.default = (pluginManager) => {
         ReactComponent: (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./VariantFeatureWidget')))),
     }));
 };
-//# sourceMappingURL=index.js.map

package/dist/VariantTrack/configSchema.js

@@ -15,4 +15,3 @@ const configSchema = (pluginManager) => (0, configuration_1.ConfigurationSchema)
     baseConfiguration: (0, pluggableElementTypes_1.createBaseTrackConfig)(pluginManager),
 });
 exports.default = configSchema;
-//# sourceMappingURL=configSchema.js.map

package/dist/VariantTrack/index.js

@@ -17,4 +17,3 @@ exports.default = (pm) => {
         });
     });
 };
-//# sourceMappingURL=index.js.map

package/dist/VcfAdapter/VcfAdapter.js

@@ -104,4 +104,3 @@ class VcfAdapter extends BaseAdapter_1.BaseFeatureDataAdapter {
 }
 VcfAdapter.capabilities = ['getFeatures', 'getRefNames'];
 exports.default = VcfAdapter;
-//# sourceMappingURL=VcfAdapter.js.map

package/dist/VcfAdapter/configSchema.js

@@ -15,4 +15,3 @@ const VcfAdapter = (0, configuration_1.ConfigurationSchema)('VcfAdapter', {
     },
 }, { explicitlyTyped: true });
 exports.default = VcfAdapter;
-//# sourceMappingURL=configSchema.js.map

package/dist/VcfAdapter/index.js

@@ -36,4 +36,3 @@ exports.default = (pluginManager) => {
         getAdapterClass: () => Promise.resolve().then(() => __importStar(require('./VcfAdapter'))).then(r => r.default),
     }));
 };
-//# sourceMappingURL=index.js.map

package/dist/VcfFeature/index.js

@@ -12,9 +12,10 @@ class VCFFeature {
     }
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     get(field) {
+        var _a;
         return field === 'samples'
             ? this.variant.SAMPLES
-            : this.data[field] || this.variant[field];
+            : (_a = this.data[field]) !== null && _a !== void 0 ? _a : this.variant[field];
     }
     set() { }
     parent() {
@@ -56,4 +57,3 @@ class VCFFeature {
     }
 }
 exports.default = VCFFeature;
-//# sourceMappingURL=index.js.map

package/dist/VcfFeature/util.js

@@ -123,4 +123,3 @@ exports.getSOAndDescByExamination = getSOAndDescByExamination;
 function makeDescriptionString(soTerm, ref, alt) {
     return `${soTerm} ${ref} -> ${alt}`;
 }
-//# sourceMappingURL=util.js.map

package/dist/VcfTabixAdapter/VcfTabixAdapter.js

@@ -72,4 +72,3 @@ class default_1 extends BaseAdapter_1.BaseFeatureDataAdapter {
     freeResources( /* { region } */) { }
 }
 exports.default = default_1;
-//# sourceMappingURL=VcfTabixAdapter.js.map

package/dist/VcfTabixAdapter/configSchema.js

@@ -36,4 +36,3 @@ const VcfTabixAdapter = (0, configuration_1.ConfigurationSchema)('VcfTabixAdapte
     }),
 }, { explicitlyTyped: true });
 exports.default = VcfTabixAdapter;
-//# sourceMappingURL=configSchema.js.map

package/dist/VcfTabixAdapter/index.js

@@ -39,4 +39,3 @@ exports.default = (pluginManager) => {
         getAdapterClass: () => Promise.resolve().then(() => __importStar(require('./VcfTabixAdapter'))).then(r => r.default),
     }));
 };
-//# sourceMappingURL=index.js.map